@maplander/components 0.20.0 → 0.20.3

package/fesm5/maplander-components.js

@@ -15,9 +15,9 @@ import { MatFormFieldModule } from '@angular/material/form-field';
 import { MatSelectModule } from '@angular/material/select';
 import { MatDividerModule } from '@angular/material/divider';
 import { MatRippleModule, MAT_DATE_LOCALE, DateAdapter, MAT_DATE_FORMATS, NativeDateAdapter, MatNativeDateModule } from '@angular/material/core';
+import { MatInputModule, MatMenuModule, MatButtonModule as MatButtonModule$1, MatIconModule as MatIconModule$1, MAT_DIALOG_DATA as MAT_DIALOG_DATA$1, MatDialogRef as MatDialogRef$1, MatDialog as MatDialog$1 } from '@angular/material';
 import { fromPromise } from 'rxjs/internal-compatibility';
 import { mergeMap, map, takeUntil } from 'rxjs/operators';
-import { MatMenuModule, MatButtonModule as MatButtonModule$1, MatIconModule as MatIconModule$1, MAT_DIALOG_DATA as MAT_DIALOG_DATA$1, MatDialogRef as MatDialogRef$1, MatDialog as MatDialog$1 } from '@angular/material';
 import { SnackBarService, SnackBarModule } from '@maplander/core';
 import { BreakpointObserver } from '@angular/cdk/layout';
 import { MomentDateAdapter, MAT_MOMENT_DATE_ADAPTER_OPTIONS } from '@angular/material-moment-adapter';
@@ -25,7 +25,7 @@ import * as momentImported from 'moment';
 import { HttpClient } from '@angular/common/http';
 import { DomSanitizer } from '@angular/platform-browser';
 import { MatCalendar, MatDatepickerModule } from '@angular/material/datepicker';
-import { MatInputModule } from '@angular/material/input';
+import { MatInputModule as MatInputModule$1 } from '@angular/material/input';
 import { MatCheckboxModule } from '@angular/material/checkbox';
 import { MatRadioModule } from '@angular/material/radio';
 import { MatSidenavModule } from '@angular/material/sidenav';
@@ -3441,6 +3441,7 @@ var FiltersModule = /** @class */ (function () {
                         MatIconModule,
                         MatButtonModule,
                         MatDividerModule,
+                        MatInputModule,
                         MarkerPriceModule.forChild(),
                         CurrencyConverterModule.forChild()
                     ],
@@ -3770,6 +3771,7 @@ var MultimediaUploaderComponent = /** @class */ (function () {
     function (text) {
         if (text.indexOf('https://youtu.be/') !== -1) {
             text = text.replace('https://youtu.be/', '');
+            return text;
         }
         else if (text.indexOf('https://www.youtube.com/') !== -1) {
             text = text.replace('https://www.youtube.com/', '');
@@ -4613,7 +4615,7 @@ var PropertyComponent = /** @class */ (function () {
      * @return {?}
      */
     function () {
-        this.agentActions('SHOW_AGENTS');
+        // this.agentActions('SHOW_AGENTS');
     };
     /**
      * @param {?} changes
@@ -6842,7 +6844,7 @@ var CustomDatepickerComponent = /** @class */ (function () {
 /** @type {?} */
 var MATERIAL$1 = [
     MatFormFieldModule,
-    MatInputModule,
+    MatInputModule$1,
     MatDatepickerModule,
     MatButtonModule,
     MatIconModule
@@ -7072,7 +7074,7 @@ var MATERIAL$2 = [
     MatIconModule,
     MatButtonToggleModule,
     MatRadioModule,
-    MatInputModule,
+    MatInputModule$1,
     MatFormFieldModule,
     MatSelectModule,
     MatSidenavModule,
@@ -7226,6 +7228,9 @@ var PropertyCardComponent = /** @class */ (function () {
         if (changes['marker'] && changes['marker'].currentValue) {
             this.info = changes['marker'].currentValue.info;
         }
+        if (changes['showAlert'] && changes['showAlert'].currentValue) {
+            this.info = changes['showAlert'].currentValue;
+        }
     };
     /**
      * @return {?}
@@ -7333,8 +7338,8 @@ var PropertyCardComponent = /** @class */ (function () {
     PropertyCardComponent.decorators = [
         { type: Component, args: [{
                     selector: 'lib-property-card',
-                    template: "<div class=\"property-card\">\r\n  <ng-template [ngIf]=\"!isOPI\">\r\n    <div class=\"property-card__favorite\">\r\n      <button class=\"favorite__button\" mat-icon-button (click)=\"favorite()\">\r\n        <ng-template [ngIf]=\"isFavorite\" [ngIfElse]=\"noIsFavorite\">\r\n          <mat-icon>favorite</mat-icon>\r\n        </ng-template>\r\n        <ng-template #noIsFavorite>\r\n          <mat-icon>favorite_border</mat-icon>\r\n        </ng-template>\r\n      </button>\r\n    </div>\r\n  </ng-template>\r\n  <ng-template [ngIf]=\"showDiscard\">\r\n    <div class=\"property-card__discard\">\r\n      <button class=\"discard__button\" mat-icon-button (click)=\"discard()\">\r\n        <mat-icon>close</mat-icon>\r\n      </button>\r\n    </div>\r\n  </ng-template>\r\n  <a routerLink=\"{{href || '/'}}\" [queryParams]=\"queryParams || null\" [target]=\"target || null\"\r\n     [state]=\"state || null\"\r\n     class=\"property-card__image\" (mouseover)=\"onFrontImageOver()\"\r\n     (mouseleave)=\"onFrontImageLeave()\">\r\n    <img [src]=\"info.image\" alt=\"Property image\" libImageError [typeImage]=\"info.type\">\r\n    <ng-template [ngIf]=\"mode === 'summary'\">\r\n      <div class=\"property-card__body-summary\">\r\n        <h2 class=\"color--white property-card__price\">\r\n          {{info.price | currency}} {{info.currency}}\r\n        </h2>\r\n        <p class=\"color--white property-card__type\">\r\n          {{info.type | propertyType}} {{info.offering | offeringType}}\r\n        </p>\r\n        <p class=\"color--white property-card__address body-summary__address\">\r\n          {{info.address.colony}}, {{info.address.city}}\r\n        </p>\r\n      </div>\r\n    </ng-template>\r\n  </a>\r\n  <ng-template [ngIf]=\"mode === 'full'\">\r\n    <div class=\"property-card__body\">\r\n      <div class=\"property-card__location-title\">\r\n        <h2 class=\"property-card__price\">\r\n          {{info.price | currency : currency : 'symbol' : '1.0-0'}} {{info.currency}}\r\n        </h2>\r\n        <ng-container *ngIf=\"distance !== ''\" >\r\n          <h2 class=\"property-card__location\" [hidden]=\"!distance\">\r\n            {{distance}}\r\n          </h2>\r\n        </ng-container>\r\n      </div>\r\n      <p class=\"property-card__type\">\r\n        {{info.type | propertyType}} {{info.offering | offeringType}}\r\n      </p>\r\n      <p class=\"property-card__address\">\r\n        {{info.address.colony}}, {{info.address.city}}\r\n      </p>\r\n      <ng-template [ngIf]=\"info.features\">\r\n        <div class=\"property-card__features\">\r\n          <ng-template [ngIf]=\"info.features && info.features.bedrooms && info.features.bedrooms > 0\">\r\n            <p class=\"property-card__feature\">\r\n              <span class=\"property-card__icon ic-features-bedroom\"></span>\r\n              {{info.features.bedrooms}}\r\n            </p>\r\n            <span class=\"property-card__divider\"></span>\r\n          </ng-template>\r\n          <ng-template [ngIf]=\"info.features && info.features.bathrooms && info.features.bathrooms > 0 \">\r\n            <p class=\"property-card__feature\">\r\n              <span class=\"property-card__icon ic-features-bathroom\"></span>\r\n              {{info.features.bathrooms}}\r\n            </p>\r\n            <span class=\"property-card__divider\"></span>\r\n          </ng-template>\r\n          <ng-template [ngIf]=\"info.features && info.features.mainArea && info.features.mainArea > 0\">\r\n            <p class=\"property-card__feature\">\r\n              <span class=\"property-card__icon ic-features-surface\"></span>\r\n              {{info.features.mainArea}}\r\n              <ng-template [ngIf]=\"info.features.areaUnit && info.features.areaUnit === 'M2'\"\r\n                           [ngIfElse]=\"ftUnit\">\r\n                m<sup>2</sup>\r\n              </ng-template>\r\n              <ng-template #ftUnit>\r\n                sq ft\r\n              </ng-template>\r\n            </p>\r\n          </ng-template>\r\n        </div>\r\n      </ng-template>\r\n    </div>\r\n  </ng-template>\r\n</div>\r\n",
-                    styles: [":host{display:block;width:calc(100% - 16px);margin:16px auto;border-radius:16px}.property-card{width:100%;border-radius:16px;position:relative}.property-card__favorite{position:absolute;top:4px;right:4px;border-radius:50%;z-index:1;width:40px;height:40px;display:flex}.favorite__button{margin:auto}.property-card__discard{position:absolute;right:8px;bottom:8px;z-index:1;width:40px;height:40px;border-radius:16px;display:flex}.discard__button{margin:auto}.property-card__image{width:100%;border-radius:16px;padding-bottom:calc(100% / 4 * 3);position:relative;text-decoration:none;display:block}.property-card__image:hover{width:calc(100% - 6px);padding-bottom:calc((100% - 6px)/ 4 * 3)}.property-card__image img{border-radius:16px;position:absolute;width:100%;height:100%;-o-object-fit:cover;object-fit:cover}.property-card__body{padding:8px;box-sizing:border-box}.property-card__body-summary{padding:8px;box-sizing:border-box;position:absolute;bottom:0;width:100%;border-radius:16px;background:linear-gradient(transparent,rgba(0,0,0,.8))}.body-summary__address{width:80%!important}.property-card__location-title{display:flex;width:100%;flex-direction:row;flex-wrap:wrap}.property-card__location{font-size:12px;margin:4px;color:#707070}@media (min-width:1200px){.property-card__location{font-size:14px}}.property-card__location:empty{width:60%;height:14px;background:#e0e0e0;border-radius:16px}.property-card__price{margin:3px 0;font-size:16px}.property-card__price:empty{width:60%;height:16px;background:#e0e0e0;border-radius:16px}.property-card__type{margin:3px 0}.property-card__type:empty{width:70%;height:16px;border-radius:16px;background:#e0e0e0}.property-card__address{margin:3px 0;color:#707070;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.property-card__address:empty{width:80%;height:16px;border-radius:16px;background:#e0e0e0}.property-card__features{display:flex;margin:6px 0 0}.property-card__feature{margin:0 8px 0 0;display:flex;align-items:center;font-size:12px;color:#707070}.property-card__divider{display:block;margin:auto 8px;width:1px;height:16px;background:#9e9e9e}.property-card__icon{width:24px;height:24px;font-size:24px;margin:0 4px 0 0;color:#bdbdbd}"]
+                    template: "<div class=\"property-card\">\r\n  <ng-template [ngIf]=\"!isOPI\">\r\n    <div class=\"property-card__favorite\">\r\n      <button class=\"favorite__button\" mat-icon-button (click)=\"favorite()\">\r\n        <ng-template [ngIf]=\"isFavorite\" [ngIfElse]=\"noIsFavorite\">\r\n          <mat-icon>favorite</mat-icon>\r\n        </ng-template>\r\n        <ng-template #noIsFavorite>\r\n          <mat-icon>favorite_border</mat-icon>\r\n        </ng-template>\r\n      </button>\r\n    </div>\r\n  </ng-template>\r\n  <ng-template [ngIf]=\"showDiscard\">\r\n    <div class=\"property-card__discard\">\r\n      <button class=\"discard__button\" mat-icon-button (click)=\"discard()\">\r\n        <mat-icon>close</mat-icon>\r\n      </button>\r\n    </div>\r\n  </ng-template>\r\n  <ng-template [ngIf]=\"isOPI && showAlert\">\r\n    <div class=\"expiration-message\">\r\n      <p>\r\n        Aviso\r\n        <br>\r\n        Esta propiedad expirar\u00E1 el {{info.endPublishDate | libFormatDate : true : 'dd/MM/yyyy'}}\r\n      </p>\r\n    </div>\r\n  </ng-template>\r\n  <a routerLink=\"{{href || '/'}}\" [queryParams]=\"queryParams || null\" [target]=\"target || null\"\r\n     [state]=\"state || null\"\r\n     class=\"property-card__image\" (mouseover)=\"onFrontImageOver()\"\r\n     (mouseleave)=\"onFrontImageLeave()\">\r\n    <img [src]=\"info.image\" alt=\"Property image\" libImageError [typeImage]=\"info.type\">\r\n    <ng-template [ngIf]=\"mode === 'summary'\">\r\n      <div class=\"property-card__body-summary\">\r\n        <h2 class=\"color--white property-card__price\">\r\n          {{info.price | currency}} {{info.currency}}\r\n        </h2>\r\n        <p class=\"color--white property-card__type\">\r\n          {{info.type | propertyType}} {{info.offering | offeringType}}\r\n        </p>\r\n        <p class=\"color--white property-card__address body-summary__address\">\r\n          {{info.address.colony}}, {{info.address.city}}\r\n        </p>\r\n      </div>\r\n    </ng-template>\r\n  </a>\r\n  <ng-template [ngIf]=\"mode === 'full'\">\r\n    <div class=\"property-card__body\">\r\n      <div class=\"property-card__location-title\">\r\n        <h2 class=\"property-card__price\">\r\n          {{info.price | currency : currency : 'symbol' : '1.0-0'}} {{info.currency}}\r\n        </h2>\r\n        <ng-container *ngIf=\"distance !== ''\" >\r\n          <h2 class=\"property-card__location\" [hidden]=\"!distance\">\r\n            {{distance}}\r\n          </h2>\r\n        </ng-container>\r\n      </div>\r\n      <p class=\"property-card__type\">\r\n        {{info.type | propertyType}} {{info.offering | offeringType}}\r\n      </p>\r\n      <p class=\"property-card__address\">\r\n        {{info.address.colony}}, {{info.address.city}}\r\n      </p>\r\n      <ng-template [ngIf]=\"info.features\">\r\n        <div class=\"property-card__features\">\r\n          <ng-template [ngIf]=\"info.features && info.features.bedrooms && info.features.bedrooms > 0\">\r\n            <p class=\"property-card__feature\">\r\n              <span class=\"property-card__icon ic-features-bedroom\"></span>\r\n              {{info.features.bedrooms}}\r\n            </p>\r\n            <span class=\"property-card__divider\"></span>\r\n          </ng-template>\r\n          <ng-template [ngIf]=\"info.features && info.features.bathrooms && info.features.bathrooms > 0 \">\r\n            <p class=\"property-card__feature\">\r\n              <span class=\"property-card__icon ic-features-bathroom\"></span>\r\n              {{info.features.bathrooms}}\r\n            </p>\r\n            <span class=\"property-card__divider\"></span>\r\n          </ng-template>\r\n          <ng-template [ngIf]=\"info.features && info.features.mainArea && info.features.mainArea > 0\">\r\n            <p class=\"property-card__feature\">\r\n              <span class=\"property-card__icon ic-features-surface\"></span>\r\n              {{info.features.mainArea}}\r\n              <ng-template [ngIf]=\"info.features.areaUnit && info.features.areaUnit === 'M2'\"\r\n                           [ngIfElse]=\"ftUnit\">\r\n                m<sup>2</sup>\r\n              </ng-template>\r\n              <ng-template #ftUnit>\r\n                sq ft\r\n              </ng-template>\r\n            </p>\r\n          </ng-template>\r\n        </div>\r\n      </ng-template>\r\n    </div>\r\n  </ng-template>\r\n</div>\r\n",
+                    styles: [":host{display:block;width:calc(100% - 16px);margin:16px auto;border-radius:16px}.property-card{width:100%;border-radius:16px;position:relative}.property-card__favorite{position:absolute;top:4px;right:4px;border-radius:50%;z-index:1;width:40px;height:40px;display:flex}.favorite__button{margin:auto}.expiration-message{position:absolute;top:0;background-color:#fff;width:100%;height:80px;z-index:1;text-align:center;color:red;font-size:16px;margin:auto}.property-card__discard{position:absolute;right:8px;bottom:8px;z-index:1;width:40px;height:40px;border-radius:16px;display:flex}.discard__button{margin:auto}.property-card__image{width:100%;border-radius:16px;padding-bottom:calc(100% / 4 * 3);position:relative;text-decoration:none;display:block}.property-card__image:hover{width:calc(100% - 6px);padding-bottom:calc((100% - 6px)/ 4 * 3)}.property-card__image img{border-radius:16px;position:absolute;width:100%;height:100%;-o-object-fit:cover;object-fit:cover}.property-card__body{padding:8px;box-sizing:border-box}.property-card__body-summary{padding:8px;box-sizing:border-box;position:absolute;bottom:0;width:100%;border-radius:16px;background:linear-gradient(transparent,rgba(0,0,0,.8))}.body-summary__address{width:80%!important}.property-card__location-title{display:flex;width:100%;flex-direction:row;flex-wrap:wrap}.property-card__location{font-size:12px;margin:4px;color:#707070}@media (min-width:1200px){.property-card__location{font-size:14px}}.property-card__location:empty{width:60%;height:14px;background:#e0e0e0;border-radius:16px}.property-card__price{margin:3px 0;font-size:16px}.property-card__price:empty{width:60%;height:16px;background:#e0e0e0;border-radius:16px}.property-card__type{margin:3px 0}.property-card__type:empty{width:70%;height:16px;border-radius:16px;background:#e0e0e0}.property-card__address{margin:3px 0;color:#707070;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.property-card__address:empty{width:80%;height:16px;border-radius:16px;background:#e0e0e0}.property-card__features{display:flex;margin:6px 0 0}.property-card__feature{margin:0 8px 0 0;display:flex;align-items:center;font-size:12px;color:#707070}.property-card__divider{display:block;margin:auto 8px;width:1px;height:16px;background:#9e9e9e}.property-card__icon{width:24px;height:24px;font-size:24px;margin:0 4px 0 0;color:#bdbdbd}"]
                 }] }
     ];
     /** @nocollapse */
@@ -7347,6 +7352,7 @@ var PropertyCardComponent = /** @class */ (function () {
         target: [{ type: Input }],
         queryParams: [{ type: Input }],
         state: [{ type: Input }],
+        showAlert: [{ type: Input }],
         positionLatLng: [{ type: Input }],
         isFavorite: [{ type: Input }],
         currency: [{ type: Input }],
@@ -7394,7 +7400,8 @@ var PropertyCardModule = /** @class */ (function () {
                         OfferingTypeModule,
                         ImageErrorModule,
                         MatIconModule,
-                        MatButtonModule
+                        MatButtonModule,
+                        FormatDateModule
                     ],
                     declarations: [
                         PropertyCardComponent