@seniorsistemas/angular-components 17.18.5 → 17.18.6

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.
@@ -19970,6 +19970,7 @@
19970
19970
  this.id = "s-tile-" + TileComponent_1.nextId++;
19971
19971
  this.disabled = false;
19972
19972
  this.tabIndex = 0;
19973
+ this.useThumbnail = true;
19973
19974
  this.onClick = new core.EventEmitter();
19974
19975
  }
19975
19976
  TileComponent_1 = TileComponent;
@@ -20019,6 +20020,9 @@
20019
20020
  __decorate([
20020
20021
  core.Input()
20021
20022
  ], TileComponent.prototype, "tabIndex", void 0);
20023
+ __decorate([
20024
+ core.Input()
20025
+ ], TileComponent.prototype, "useThumbnail", void 0);
20022
20026
  __decorate([
20023
20027
  core.Output()
20024
20028
  ], TileComponent.prototype, "onClick", void 0);
@@ -20028,8 +20032,8 @@
20028
20032
  TileComponent = TileComponent_1 = __decorate([
20029
20033
  core.Component({
20030
20034
  selector: "s-tile",
20031
- template: "<div\n [id]=\"id\"\n class=\"tile\"\n [attr.tabindex]=\"disabled ? undefined : tabIndex\"\n [attr.aria-label]=\"label\"\n [attr.aria-disabled]=\"disabled\"\n role=\"button\"\n [ngClass]=\"{'tile--disabled': disabled}\"\n (click)=\"!disabled && onClick.emit($event)\">\n <div\n *ngIf=\"imageSource || iconClass\"\n class=\"thumbnail\">\n <s-thumbnail\n *ngIf=\"imageSource\" \n [id]=\"id + '-thumbnail'\"\n [imageSource]=\"imageSource\"\n [imageAlt]=\"imageAlt || label\"\n size=\"small\"\n [isTile]=\"true\">\n </s-thumbnail>\n <span\n *ngIf=\"!imageSource && iconClass\" \n [id]=\"id + '-icon'\"\n [class]=\"'icon ' + iconClass\"\n aria-hidden=\"true\">\n </span>\n </div>\n <div\n *ngIf=\"!iconClass && !imageSource\"\n class=\"first-letter-container\">\n <div class=\"first-letter\">\n <span>{{ initialLetter }}</span>\n </div>\n </div>\n\n <div class=\"info\">\n <span\n [id]=\"id + '-title'\"\n class=\"title\"\n [sTooltip]=\"label\"\n tooltipPosition=\"top\"\n showDelay=\"500\">\n {{ label }}\n </span>\n <span\n [id]=\"id + '-description'\"\n class=\"description\"\n [sTooltip]=\"description\"\n tooltipPosition=\"top\"\n showDelay=\"500\">\n {{ description }}\n </span>\n </div>\n</div>\n",
20032
- styles: [".tile{-ms-flex-align:center;align-items:center;background-color:#fff;border:1px solid #c1c1cc;cursor:pointer;display:-ms-flexbox;display:flex;min-height:80px;overflow:hidden;padding:15px;position:relative;transition:background-color .2s ease-out,border-color .2s ease-out}.tile--disabled{opacity:.5;filter:Alpha(Opacity=50);background-image:none}.tile--disabled,.tile--disabled *{cursor:text!important}.tile:focus:not(.tile--disabled),.tile:hover:not(.tile--disabled){background-color:#eeebf2;outline:0}.tile .thumbnail{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;margin-right:15px}.tile .thumbnail .icon{color:#428bca;font-size:2.5rem}.tile .info{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center;overflow:hidden}.tile .info .description,.tile .info .title{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tile .info .title{color:#428bca;font-size:1.25rem}.tile .info .description{color:#6e7280;font-size:.875rem}.tile .first-letter-container{float:left;margin-right:10px;position:relative;text-align:center}.tile .first-letter-container .first-letter{background-color:#428bca;border-radius:50%;color:#fff;font-size:1.375rem;height:40px;line-height:1.8em;margin:0 auto 5px;width:40px}"]
20035
+ template: "<div\n [id]=\"id\"\n class=\"tile\"\n [attr.tabindex]=\"disabled ? undefined : tabIndex\"\n [attr.aria-label]=\"label\"\n [attr.aria-disabled]=\"disabled\"\n role=\"button\"\n [ngClass]=\"{ 'tile--disabled': disabled }\"\n (click)=\"!disabled && onClick.emit($event)\">\n <div\n *ngIf=\"imageSource || iconClass\"\n class=\"thumbnail\">\n <ng-container *ngIf=\"imageSource\">\n <div\n *ngIf=\"!useThumbnail\"\n class=\"image-icon\">\n <div\n class=\"icon\"\n [style.background-image]=\"'url(' + imageSource + ')'\">\n </div>\n </div>\n <s-thumbnail\n *ngIf=\"useThumbnail\"\n [id]=\"id + '-thumbnail'\"\n [imageSource]=\"imageSource\"\n [imageAlt]=\"imageAlt || label\"\n size=\"small\"\n [isTile]=\"true\"\n >\n </s-thumbnail>\n </ng-container>\n\n <span\n *ngIf=\"!imageSource && iconClass\"\n [id]=\"id + '-icon'\"\n [class]=\"'icon ' + iconClass\"\n aria-hidden=\"true\">\n </span>\n </div>\n <div\n *ngIf=\"!iconClass && !imageSource\"\n class=\"first-letter-container\">\n <div class=\"first-letter\">\n <span>{{ initialLetter }}</span>\n </div>\n </div>\n\n <div class=\"info\">\n <span\n [id]=\"id + '-title'\"\n class=\"title\"\n [sTooltip]=\"label\"\n tooltipPosition=\"top\"\n showDelay=\"500\">\n {{ label }}\n </span>\n <span\n [id]=\"id + '-description'\"\n class=\"description\"\n [sTooltip]=\"description\"\n tooltipPosition=\"top\"\n showDelay=\"500\">\n {{ description }}\n </span>\n </div>\n</div>\n",
20036
+ styles: [".tile{-ms-flex-align:center;align-items:center;background-color:#fff;border:1px solid #c1c1cc;cursor:pointer;display:-ms-flexbox;display:flex;min-height:80px;overflow:hidden;padding:15px;position:relative;transition:background-color .2s ease-out,border-color .2s ease-out}.tile:focus:not(.tile--disabled),.tile:hover:not(.tile--disabled){background-color:#eeebf2;outline:0}.tile .thumbnail{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;margin-right:15px}.tile .thumbnail .icon{color:#428bca;font-size:2.5rem}.tile .info{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center;overflow:hidden}.tile .info .description,.tile .info .title{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tile .info .title{color:#428bca;font-size:1.25rem}.tile .info .description{color:#6e7280;font-size:.875rem}.tile .first-letter-container{float:left;margin-right:10px;position:relative;text-align:center}.tile .first-letter-container .first-letter{background-color:#428bca;border-radius:50%;color:#fff;font-size:1.375rem;height:40px;line-height:1.8em;margin:0 auto 5px;width:40px}.tile--disabled{opacity:.5;filter:Alpha(Opacity=50);background-image:none}.tile--disabled,.tile--disabled *{cursor:text!important}.tile .image-icon{padding:8px;background-color:#eeebf2;border-radius:4px}.tile .image-icon .icon{height:32px;width:32px;background-size:cover;background-repeat:no-repeat}"]
20033
20037
  })
20034
20038
  ], TileComponent);
20035
20039
  return TileComponent;