@seniorsistemas/angular-components 16.13.0 → 16.13.2

package/fesm5/seniorsistemas-angular-components.js

@@ -9530,9 +9530,9 @@ var SidebarComponent = /** @class */ (function () {
     SidebarComponent = SidebarComponent_1 = __decorate([
         Component({
             selector: "s-sidebar",
-            template: "<p-sidebar [id]=\"id\" [visible]=\"visible\" (visibleChange)=\"visibleChange.emit($event)\" [blockScroll]=\"true\" [baseZIndex]=\"baseZIndex\"\n    [modal]=\"true\" [dismissible]=\"false\" [showCloseIcon]=\"false\" position=\"right\" appendTo=\"body\"\n    [styleClass]=\"largeSized ? 's-sidebar-panel s-sidebar-panel-lg' : 's-sidebar-panel'\" (onShow)=\"onShow()\" (onHide)=\"onHide()\">\n\n    <div [id]=\"id + '-container'\" class=\"s-sidebar-container\">\n\n        <a href=\"#\" role=\"button\" class=\"s-sidebar-close\" (click)=\"close($event)\"><span class=\"fa fa-times\" aria-hidden=\"true\"></span></a>\n\n        <div [id]=\"id + '-header'\" class=\"s-sidebar-header\" *ngIf=\"header && !headerSection\">\n            <s-header>\n                <h2 class=\"sds-panel-title\">{{header}}</h2>\n            </s-header>\n        </div>\n\n        <div [id]=\"id + '-header'\" class=\"s-sidebar-header\" *ngIf=\"headerSection\">\n            <ng-content select=\"s-header\"></ng-content>\n        </div>\n\n        <p-scrollPanel [id]=\"id + '-content-container'\" class=\"s-sidebar-content-container\" styleClass=\"s-sidebar-content\">\n            <ng-content></ng-content>\n        </p-scrollPanel>\n\n        <div [id]=\"id + '-footer'\" class=\"s-sidebar-footer\" *ngIf=\"footerSection\">\n            <ng-content select=\"s-footer\"></ng-content>\n        </div>\n\n    </div>\n\n</p-sidebar>\n",
+            template: "<p-sidebar\n    [id]=\"id\"\n    [visible]=\"visible\"\n    (visibleChange)=\"visibleChange.emit($event)\"\n    [blockScroll]=\"true\"\n    [baseZIndex]=\"baseZIndex\"\n    [modal]=\"true\"\n    [dismissible]=\"false\"\n    [showCloseIcon]=\"false\"\n    position=\"right\"\n    appendTo=\"body\"\n    [styleClass]=\"largeSized ? 's-sidebar-panel s-sidebar-panel-lg' : 's-sidebar-panel'\"\n    (onShow)=\"onShow()\"\n    (onHide)=\"onHide()\">\n    <div\n        [id]=\"id + '-container'\"\n        class=\"s-sidebar-container\">\n        <a\n            href=\"#\"\n            role=\"button\"\n            class=\"s-sidebar-close\"\n            (click)=\"close($event)\">\n            <span\n                class=\"fa fa-times\"\n                aria-hidden=\"true\">\n            </span></a>\n        <div\n            *ngIf=\"header && !headerSection\"    \n            [id]=\"id + '-header'\"\n            class=\"s-sidebar-header\">\n            <h2 class=\"sds-panel-title s-sidebar-header__title\">{{header}}</h2>\n        </div>\n        <div\n            *ngIf=\"headerSection\"    \n            [id]=\"id + '-header'\"\n            class=\"s-sidebar-header\">\n            <ng-content select=\"s-header\"></ng-content>\n        </div>\n        <p-scrollPanel\n            [id]=\"id + '-content-container'\"\n            class=\"s-sidebar-content-container\"\n            styleClass=\"s-sidebar-content\">\n            <ng-content></ng-content>\n        </p-scrollPanel>\n        <div\n            *ngIf=\"footerSection\"\n            [id]=\"id + '-footer'\"\n            class=\"s-sidebar-footer\">\n            <ng-content select=\"s-footer\"></ng-content>\n        </div>\n    </div>\n</p-sidebar>\n",
             encapsulation: ViewEncapsulation.None,
-            styles: [".ui-overflow-hidden-sidebar{overflow:hidden}body .ui-sidebar.s-sidebar-panel{width:50%;padding:0}@media (max-width:767px){body .ui-sidebar.s-sidebar-panel{width:100%}}@media (min-width:768px){body .ui-sidebar.s-sidebar-panel{width:75%}}@media (min-width:992px){body .ui-sidebar.s-sidebar-panel{width:50%}body .ui-sidebar.s-sidebar-panel.s-sidebar-panel-lg{width:75%}}body .ui-sidebar.s-sidebar-panel .s-sidebar-container{height:100%;width:100%;padding:20px;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;-ms-flex-direction:column;flex-direction:column}body .ui-sidebar.s-sidebar-panel .s-sidebar-close{position:absolute;right:20px;top:20px;color:#333}body .ui-sidebar.s-sidebar-panel .s-sidebar-header{border-bottom:1px solid #ccc;padding-bottom:15px;padding-right:20px;margin-bottom:15px;-ms-flex-negative:0;flex-shrink:0}body .ui-sidebar.s-sidebar-panel .s-sidebar-content-container{-ms-flex:1;flex:1;overflow:hidden}body .ui-sidebar.s-sidebar-panel .s-sidebar-content{height:100%}body .ui-sidebar.s-sidebar-panel .s-sidebar-footer{border-top:1px solid #ccc;padding-top:15px;margin-top:15px;-ms-flex-negative:0;flex-shrink:0}body .ui-sidebar.s-sidebar-panel p-scrollpanel{padding-top:30px}body .ui-sidebar.s-sidebar-panel .s-sidebar-header+p-scrollpanel{padding-top:0}p-scrollPanel{display:block}"]
+            styles: [".ui-overflow-hidden-sidebar{overflow:hidden}body .ui-sidebar.s-sidebar-panel{width:50%;padding:0}@media (max-width:767px){body .ui-sidebar.s-sidebar-panel{width:100%}}@media (min-width:768px){body .ui-sidebar.s-sidebar-panel{width:75%}}@media (min-width:992px){body .ui-sidebar.s-sidebar-panel{width:50%}body .ui-sidebar.s-sidebar-panel.s-sidebar-panel-lg{width:75%}}body .ui-sidebar.s-sidebar-panel .s-sidebar-container{height:100%;width:100%;padding:20px;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;-ms-flex-direction:column;flex-direction:column}body .ui-sidebar.s-sidebar-panel .s-sidebar-close{position:absolute;right:20px;top:20px;color:#333}body .ui-sidebar.s-sidebar-panel .s-sidebar-header{border-bottom:1px solid #ccc;padding-bottom:15px;padding-right:20px;margin-bottom:15px;-ms-flex-negative:0;flex-shrink:0}body .ui-sidebar.s-sidebar-panel .s-sidebar-content-container{-ms-flex:1;flex:1;overflow:hidden}body .ui-sidebar.s-sidebar-panel .s-sidebar-content{height:100%}body .ui-sidebar.s-sidebar-panel .s-sidebar-footer{border-top:1px solid #ccc;padding-top:15px;margin-top:15px;-ms-flex-negative:0;flex-shrink:0}body .ui-sidebar.s-sidebar-panel p-scrollpanel{padding-top:30px}body .ui-sidebar.s-sidebar-panel .s-sidebar-header+p-scrollpanel{padding-top:0}p-scrollPanel{display:block}.s-sidebar-header__title{font-weight:400}"]
         })
     ], SidebarComponent);
     return SidebarComponent;
@@ -10336,8 +10336,9 @@ var TileComponent = /** @class */ (function () {
         configurable: true
     });
     TileComponent.prototype.onKeyDown = function (event) {
-        if (!this.disabled && [13, 32].includes(event.keyCode))
+        if (!this.disabled && [13, 32].includes(event.keyCode)) {
             this.onClick.emit();
+        }
     };
     var TileComponent_1;
     TileComponent.nextId = 0;
@@ -10374,8 +10375,8 @@ var TileComponent = /** @class */ (function () {
     TileComponent = TileComponent_1 = __decorate([
         Component({
             selector: "s-tile",
-            template: "<div [id]=\"id\" class=\"container\" [attr.tabindex]=\"disabled ? undefined : tabIndex\" [attr.aria-label]=\"label\"\n    [attr.aria-disabled]=\"disabled\" role=\"button\" [ngClass]=\"{'disabled': disabled}\" (click)=\"!disabled && onClick.emit($event)\">\n    <div class=\"thumbnail-container\" *ngIf=\"imageSource || iconClass\">\n        <s-thumbnail [id]=\"id + '-thumbnail'\" *ngIf=\"imageSource\" [imageSource]=\"imageSource\" [imageAlt]=\"imageAlt || label\"\n            size=\"small\" [isTile]=\"true\"></s-thumbnail>\n\n        <span [id]=\"id + '-icon'\" *ngIf=\"!imageSource && iconClass\" [class]=\"'icon ' + iconClass\" aria-hidden=\"true\"></span>\n    </div>\n    <div class=\"first-letter-container\" *ngIf=\"!iconClass && !imageSource\">\n        <div class=\"first-letter-span\">\n            <span>{{initialLetter}}</span>\n        </div>\n    </div>\n\n    <div class=\"info-container\">\n        <span [id]=\"id + '-label'\" class=\"label\" [pTooltip]=\"label\" tooltipPosition=\"top\" showDelay=\"500\">{{label}}</span>\n        <span [id]=\"id + '-description'\" class=\"description\" [pTooltip]=\"description\" tooltipPosition=\"top\" showDelay=\"500\">{{description}}</span>\n    </div>\n</div>\n",
-            styles: [":host{display:block}.container{position:relative;background-color:#fff;border:1px solid #ddd;padding:15px;-ms-flex-align:center;align-items:center;cursor:pointer;min-height:80px;overflow:hidden;display:-ms-flexbox;display:flex;transition:background-color .2s ease-out,border-color .2s ease-out}.container:focus:not(.disabled),.container:hover:not(.disabled){background-color:rgba(221,221,221,.2);outline:0}.container.disabled{opacity:.5;filter:Alpha(Opacity=50);background-image:none}.container.disabled,.container.disabled *{cursor:text!important}.thumbnail-container+.info-container{margin-left:15px}.info-container{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center;overflow:hidden}.info-container span{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.label{color:#428bca;font-size:12pt}.description{color:#999}.icon{color:#428bca;font-size:40px}.first-letter-container{position:relative;float:left;margin-right:10px;text-align:center}.first-letter-container .first-letter-span{margin:0 auto 5px;font-size:22px;line-height:1.8em;width:40px;height:40px;border-radius:100%;background-color:#428bca;color:#fff}"]
+            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",
+            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}"]
         })
     ], TileComponent);
     return TileComponent;
@@ -10386,9 +10387,16 @@ var TileModule = /** @class */ (function () {
     }
     TileModule = __decorate([
         NgModule({
-            imports: [CommonModule, TooltipModule$1, ThumbnailModule],
+            imports: [
+                CommonModule,
+                TooltipModule,
+                ThumbnailModule,
+            ],
             declarations: [TileComponent],
-            exports: [TileComponent, ThumbnailModule],
+            exports: [
+                TileComponent,
+                ThumbnailModule,
+            ],
         })
     ], TileModule);
     return TileModule;