ngx-sfc-components 0.0.7 → 0.0.9

package/esm2020/lib/components/menu/dropdown/parts/item/dropdown-menu-item.component.mjs

@@ -14,7 +14,7 @@ export class DropdownMenuItemComponent {
     }
 }
 DropdownMenuItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: DropdownMenuItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-DropdownMenuItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: DropdownMenuItemComponent, selector: "sfc-dropdown-menu-item", inputs: { item: "item" }, host: { listeners: { "click": "click()" }, properties: { "class.active": "this._active" } }, ngImport: i0, template: "<li>\r\n    <sfc-icon [icon]=\"item.icon\" [imageSrc]=\"item.image\"></sfc-icon>\r\n    <a>{{item.label}}</a>\r\n</li>\r\n\r\n<sfc-delimeter *ngIf=\"item.delimeter\"></sfc-delimeter>", styles: [":host{display:flex;flex-direction:column;padding:.1em 0}:host li{color:#545e61;display:flex;align-items:center;flex-wrap:wrap;padding:.4em;border:.0063em solid transparent;border-radius:.31em;font-weight:700;font-size:.8em;-webkit-user-select:none;user-select:none}:host li:hover,:host li:focus-within{background:#f5f7fa;border-color:#f5f7fa;color:#2bbbad;cursor:pointer;outline:none}:host li sfc-icon{padding-right:.625em;width:10%}:host ::ng-deep sfc-delimeter,:host-context(.sfc-default-theme) :host ::ng-deep sfc-delimeter{background:linear-gradient(to right,rgba(0,0,0,0) 0%,rgba(0,0,0,.3) 17%,rgba(0,0,0,.3) 83%,rgba(0,0,0,0) 100%)}:host-context(.sfc-dark-theme) :host ::ng-deep sfc-delimeter{background:linear-gradient(to right,rgba(0,0,0,0) 0%,rgba(0,0,0,.3) 17%,rgba(0,0,0,.3) 83%,rgba(0,0,0,0) 100%)}:host.active li{background:#e6e9ed;border-color:#e6e9ed;color:#2bbbad}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.DelimeterComponent, selector: "sfc-delimeter", inputs: ["direction"] }, { kind: "component", type: i2.IconComponent, selector: "sfc-icon", inputs: ["icon", "imageSrc"] }] });
+DropdownMenuItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: DropdownMenuItemComponent, selector: "sfc-dropdown-menu-item", inputs: { item: "item" }, host: { listeners: { "click": "click()" }, properties: { "class.active": "this._active" } }, ngImport: i0, template: "<li>\r\n    <sfc-icon [icon]=\"item.icon\" [imageSrc]=\"item.image\"></sfc-icon>\r\n    <a>{{item.label}}</a>\r\n</li>\r\n\r\n<sfc-delimeter *ngIf=\"item.delimeter\"></sfc-delimeter>", styles: [":host{display:flex;flex-direction:column;padding:.1em 0}:host li{color:#545e61;display:flex;align-items:center;flex-wrap:wrap;padding:.4em;border:.0063em solid transparent;border-radius:.31em;font-weight:700;font-size:.8em;-webkit-user-select:none;user-select:none}:host li:hover,:host li:focus-within{background:#f5f7fa;border-color:#f5f7fa;color:#2bbbad;cursor:pointer;outline:none}:host li sfc-icon{padding-right:.625em;width:10%}:host ::ng-deep sfc-delimeter,:host-context(.sfc-default-theme) :host ::ng-deep sfc-delimeter{background:linear-gradient(to right,rgba(0,0,0,0) 0%,rgba(0,0,0,.3) 17%,rgba(0,0,0,.3) 83%,rgba(0,0,0,0) 100%)}:host-context(.sfc-dark-theme) :host ::ng-deep sfc-delimeter{background:linear-gradient(to right,rgba(0,0,0,0) 0%,rgba(0,0,0,.3) 17%,rgba(0,0,0,.3) 83%,rgba(0,0,0,0) 100%)}:host.active li{background:#e6e9ed;border-color:#e6e9ed;color:#2bbbad}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.DelimeterComponent, selector: "sfc-delimeter", inputs: ["label", "direction"] }, { kind: "component", type: i2.IconComponent, selector: "sfc-icon", inputs: ["icon", "imageSrc"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: DropdownMenuItemComponent, decorators: [{
             type: Component,
             args: [{ selector: 'sfc-dropdown-menu-item', template: "<li>\r\n    <sfc-icon [icon]=\"item.icon\" [imageSrc]=\"item.image\"></sfc-icon>\r\n    <a>{{item.label}}</a>\r\n</li>\r\n\r\n<sfc-delimeter *ngIf=\"item.delimeter\"></sfc-delimeter>", styles: [":host{display:flex;flex-direction:column;padding:.1em 0}:host li{color:#545e61;display:flex;align-items:center;flex-wrap:wrap;padding:.4em;border:.0063em solid transparent;border-radius:.31em;font-weight:700;font-size:.8em;-webkit-user-select:none;user-select:none}:host li:hover,:host li:focus-within{background:#f5f7fa;border-color:#f5f7fa;color:#2bbbad;cursor:pointer;outline:none}:host li sfc-icon{padding-right:.625em;width:10%}:host ::ng-deep sfc-delimeter,:host-context(.sfc-default-theme) :host ::ng-deep sfc-delimeter{background:linear-gradient(to right,rgba(0,0,0,0) 0%,rgba(0,0,0,.3) 17%,rgba(0,0,0,.3) 83%,rgba(0,0,0,0) 100%)}:host-context(.sfc-dark-theme) :host ::ng-deep sfc-delimeter{background:linear-gradient(to right,rgba(0,0,0,0) 0%,rgba(0,0,0,.3) 17%,rgba(0,0,0,.3) 83%,rgba(0,0,0,0) 100%)}:host.active li{background:#e6e9ed;border-color:#e6e9ed;color:#2bbbad}\n"] }]

package/esm2020/lib/components/menu/side/parts/title/side-menu-title.component.mjs

@@ -9,7 +9,7 @@ export class SideMenuTitleComponent {
     }
 }
 SideMenuTitleComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: SideMenuTitleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-SideMenuTitleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: SideMenuTitleComponent, selector: "sfc-side-menu-title", inputs: { label: "label", open: "open" }, host: { properties: { "class.open": "this.open" } }, ngImport: i0, template: "<sfc-delimeter></sfc-delimeter>\r\n<li><span>{{label}}</span></li>", styles: [":host li{text-transform:uppercase;font-weight:700;font-size:.65em;padding:1.25em 0;transform:translate(7%);display:inline-block;transition:transform .5s ease-in-out}:host li,:host-context(.sfc-default-theme) :host li{color:#545e61}:host-context(.sfc-dark-theme) :host li{color:#fff}:host.open li{transform:translate(30%)}\n"], dependencies: [{ kind: "component", type: i1.DelimeterComponent, selector: "sfc-delimeter", inputs: ["direction"] }] });
+SideMenuTitleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: SideMenuTitleComponent, selector: "sfc-side-menu-title", inputs: { label: "label", open: "open" }, host: { properties: { "class.open": "this.open" } }, ngImport: i0, template: "<sfc-delimeter></sfc-delimeter>\r\n<li><span>{{label}}</span></li>", styles: [":host li{text-transform:uppercase;font-weight:700;font-size:.65em;padding:1.25em 0;transform:translate(7%);display:inline-block;transition:transform .5s ease-in-out}:host li,:host-context(.sfc-default-theme) :host li{color:#545e61}:host-context(.sfc-dark-theme) :host li{color:#fff}:host.open li{transform:translate(30%)}\n"], dependencies: [{ kind: "component", type: i1.DelimeterComponent, selector: "sfc-delimeter", inputs: ["label", "direction"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: SideMenuTitleComponent, decorators: [{
             type: Component,
             args: [{ selector: 'sfc-side-menu-title', template: "<sfc-delimeter></sfc-delimeter>\r\n<li><span>{{label}}</span></li>", styles: [":host li{text-transform:uppercase;font-weight:700;font-size:.65em;padding:1.25em 0;transform:translate(7%);display:inline-block;transition:transform .5s ease-in-out}:host li,:host-context(.sfc-default-theme) :host li{color:#545e61}:host-context(.sfc-dark-theme) :host li{color:#fff}:host.open li{transform:translate(30%)}\n"] }]

package/esm2020/lib/components/slider/parts/button/slider-button.component.mjs

@@ -18,10 +18,10 @@ export class SliderButtonComponent {
     }
 }
 SliderButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: SliderButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-SliderButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: SliderButtonComponent, selector: "sfc-slider-button", inputs: { type: "type", active: "active" }, host: { properties: { "class": "this.type", "class.active": "this.active" } }, ngImport: i0, template: "<div>\r\n    <fa-icon [icon]=\"icon\"></fa-icon>\r\n</div>", styles: [":host{position:absolute;width:3em;height:3.7em;top:50%;margin-top:-1.5em;line-height:3.7em;text-align:center;cursor:pointer;background:rgba(0,0,0,.1019607843);transition:all .1s ease}:host:hover{background:rgba(0,0,0,.3019607843)}:host.next{right:-3em;border-radius:.43em 0 0 .43em}:host.previous{left:-3em;border-radius:0 .43em .43em 0}:host.active.next{right:0}:host.active.previous{left:0}\n"], dependencies: [{ kind: "component", type: i1.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }] });
+SliderButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: SliderButtonComponent, selector: "sfc-slider-button", inputs: { type: "type", active: "active" }, host: { properties: { "class": "this.type", "class.active": "this.active" } }, ngImport: i0, template: "<div>\r\n    <fa-icon [icon]=\"icon\"></fa-icon>\r\n</div>", styles: [":host{position:absolute;width:3em;top:45%;line-height:3.7em;text-align:center;cursor:pointer;background:rgba(0,0,0,.1019607843);transition:all .1s ease;z-index:9999;border-radius:.43em}:host:hover{background:rgba(0,0,0,.3019607843)}:host.next{right:0}:host.previous{left:0}:host.active.next{right:0}:host.active.previous{left:0}\n"], dependencies: [{ kind: "component", type: i1.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: SliderButtonComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'sfc-slider-button', template: "<div>\r\n    <fa-icon [icon]=\"icon\"></fa-icon>\r\n</div>", styles: [":host{position:absolute;width:3em;height:3.7em;top:50%;margin-top:-1.5em;line-height:3.7em;text-align:center;cursor:pointer;background:rgba(0,0,0,.1019607843);transition:all .1s ease}:host:hover{background:rgba(0,0,0,.3019607843)}:host.next{right:-3em;border-radius:.43em 0 0 .43em}:host.previous{left:-3em;border-radius:0 .43em .43em 0}:host.active.next{right:0}:host.active.previous{left:0}\n"] }]
+            args: [{ selector: 'sfc-slider-button', template: "<div>\r\n    <fa-icon [icon]=\"icon\"></fa-icon>\r\n</div>", styles: [":host{position:absolute;width:3em;top:45%;line-height:3.7em;text-align:center;cursor:pointer;background:rgba(0,0,0,.1019607843);transition:all .1s ease;z-index:9999;border-radius:.43em}:host:hover{background:rgba(0,0,0,.3019607843)}:host.next{right:0}:host.previous{left:0}:host.active.next{right:0}:host.active.previous{left:0}\n"] }]
         }], propDecorators: { type: [{
                 type: Input
             }, {

package/esm2020/lib/components/slider/parts/item/slider-item.component.mjs

@@ -1,17 +1,28 @@
-import { Component, Input } from '@angular/core';
+import { Component, HostBinding, Input, ViewChild } from '@angular/core';
 import { CommonConstants } from 'ngx-sfc-common';
 import * as i0 from "@angular/core";
+import * as i1 from "ngx-sfc-common";
 export class SliderItemComponent {
     constructor() {
         this.model = { imageSrc: CommonConstants.EMPTY_STRING };
     }
+    get _height() {
+        return this.imageEl?.nativeElement.offsetHeight || 0;
+    }
+    ;
 }
 SliderItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: SliderItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-SliderItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: SliderItemComponent, selector: "sfc-slider-item", inputs: { model: "model" }, ngImport: i0, template: "<li>\r\n    <div>\r\n        <h2>{{model.title}}</h2>\r\n        <span>{{model.subTitle}}</span>\r\n    </div>\r\n    <img [src]=\"model.imageSrc\">\r\n</li>", styles: [":host{display:inline-block}:host li{position:relative;width:37.5em;height:25em;background:#434a54}:host li div{position:absolute;top:10%;left:6%;-webkit-user-select:none;user-select:none;font-size:1.5em}:host li div h2{margin:0;text-transform:uppercase}:host li img{width:100%;height:100%;object-fit:fill}\n"] });
+SliderItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: SliderItemComponent, selector: "sfc-slider-item", inputs: { model: "model" }, host: { properties: { "style.height.px": "this._height" } }, viewQueries: [{ propertyName: "imageEl", first: true, predicate: ["image"], descendants: true }], ngImport: i0, template: "<div class=\"container\">\r\n    <div class=\"title\">\r\n        <h2>{{model.title}}</h2>\r\n        <span>{{model.subTitle}}</span>\r\n    </div>\r\n    <div class=\"image\">\r\n        <img #image [src]=\"model.imageSrc\" sfcImageLoad>\r\n    </div>   \r\n</div>", styles: [":host{display:inline-block}:host .container{position:absolute;left:0;top:0;width:100%}:host .container .title{position:absolute;top:10%;left:6%;-webkit-user-select:none;user-select:none;font-size:1.5em;z-index:2}:host .container .title h2{margin:0;text-transform:uppercase}:host .container .image{position:relative;z-index:1}:host .container .image img{max-width:100%;height:auto}\n"], dependencies: [{ kind: "directive", type: i1.ImageLoadDirective, selector: "[sfcImageLoad]", outputs: ["sfcImageLoad"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: SliderItemComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'sfc-slider-item', template: "<li>\r\n    <div>\r\n        <h2>{{model.title}}</h2>\r\n        <span>{{model.subTitle}}</span>\r\n    </div>\r\n    <img [src]=\"model.imageSrc\">\r\n</li>", styles: [":host{display:inline-block}:host li{position:relative;width:37.5em;height:25em;background:#434a54}:host li div{position:absolute;top:10%;left:6%;-webkit-user-select:none;user-select:none;font-size:1.5em}:host li div h2{margin:0;text-transform:uppercase}:host li img{width:100%;height:100%;object-fit:fill}\n"] }]
+            args: [{ selector: 'sfc-slider-item', template: "<div class=\"container\">\r\n    <div class=\"title\">\r\n        <h2>{{model.title}}</h2>\r\n        <span>{{model.subTitle}}</span>\r\n    </div>\r\n    <div class=\"image\">\r\n        <img #image [src]=\"model.imageSrc\" sfcImageLoad>\r\n    </div>   \r\n</div>", styles: [":host{display:inline-block}:host .container{position:absolute;left:0;top:0;width:100%}:host .container .title{position:absolute;top:10%;left:6%;-webkit-user-select:none;user-select:none;font-size:1.5em;z-index:2}:host .container .title h2{margin:0;text-transform:uppercase}:host .container .image{position:relative;z-index:1}:host .container .image img{max-width:100%;height:auto}\n"] }]
         }], propDecorators: { model: [{
                 type: Input
+            }], imageEl: [{
+                type: ViewChild,
+                args: ['image']
+            }], _height: [{
+                type: HostBinding,
+                args: ['style.height.px']
             }] } });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2xpZGVyLWl0ZW0uY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbmd4LXNmYy1jb21wb25lbnRzL3NyYy9saWIvY29tcG9uZW50cy9zbGlkZXIvcGFydHMvaXRlbS9zbGlkZXItaXRlbS5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9uZ3gtc2ZjLWNvbXBvbmVudHMvc3JjL2xpYi9jb21wb25lbnRzL3NsaWRlci9wYXJ0cy9pdGVtL3NsaWRlci1pdGVtLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQ2pELE9BQU8sRUFBRSxlQUFlLEVBQUUsTUFBTSxnQkFBZ0IsQ0FBQzs7QUFRakQsTUFBTSxPQUFPLG1CQUFtQjtJQUxoQztRQVFFLFVBQUssR0FBcUIsRUFBRSxRQUFRLEVBQUUsZUFBZSxDQUFDLFlBQVksRUFBRSxDQUFDO0tBRXRFOztnSEFMWSxtQkFBbUI7b0dBQW5CLG1CQUFtQixtRkNUaEMsK0pBTUs7MkZER1EsbUJBQW1CO2tCQUwvQixTQUFTOytCQUNFLGlCQUFpQjs4QkFPM0IsS0FBSztzQkFESixLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBJbnB1dCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xyXG5pbXBvcnQgeyBDb21tb25Db25zdGFudHMgfSBmcm9tICduZ3gtc2ZjLWNvbW1vbic7XHJcbmltcG9ydCB7IElTbGlkZXJJdGVtTW9kZWwgfSBmcm9tICcuL3NsaWRlci1pdGVtLm1vZGVsJztcclxuXHJcbkBDb21wb25lbnQoe1xyXG4gIHNlbGVjdG9yOiAnc2ZjLXNsaWRlci1pdGVtJyxcclxuICB0ZW1wbGF0ZVVybDogJy4vc2xpZGVyLWl0ZW0uY29tcG9uZW50Lmh0bWwnLFxyXG4gIHN0eWxlVXJsczogWycuL3NsaWRlci1pdGVtLmNvbXBvbmVudC5zY3NzJ11cclxufSlcclxuZXhwb3J0IGNsYXNzIFNsaWRlckl0ZW1Db21wb25lbnQge1xyXG5cclxuICBASW5wdXQoKVxyXG4gIG1vZGVsOiBJU2xpZGVySXRlbU1vZGVsID0geyBpbWFnZVNyYzogQ29tbW9uQ29uc3RhbnRzLkVNUFRZX1NUUklORyB9O1xyXG5cclxufVxyXG4iLCI8bGk+XHJcbiAgICA8ZGl2PlxyXG4gICAgICAgIDxoMj57e21vZGVsLnRpdGxlfX08L2gyPlxyXG4gICAgICAgIDxzcGFuPnt7bW9kZWwuc3ViVGl0bGV9fTwvc3Bhbj5cclxuICAgIDwvZGl2PlxyXG4gICAgPGltZyBbc3JjXT1cIm1vZGVsLmltYWdlU3JjXCI+XHJcbjwvbGk+Il19
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2xpZGVyLWl0ZW0uY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbmd4LXNmYy1jb21wb25lbnRzL3NyYy9saWIvY29tcG9uZW50cy9zbGlkZXIvcGFydHMvaXRlbS9zbGlkZXItaXRlbS5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9uZ3gtc2ZjLWNvbXBvbmVudHMvc3JjL2xpYi9jb21wb25lbnRzL3NsaWRlci9wYXJ0cy9pdGVtL3NsaWRlci1pdGVtLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQWMsV0FBVyxFQUFFLEtBQUssRUFBRSxTQUFTLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDckYsT0FBTyxFQUFFLGVBQWUsRUFBRSxNQUFNLGdCQUFnQixDQUFDOzs7QUFRakQsTUFBTSxPQUFPLG1CQUFtQjtJQUxoQztRQVFFLFVBQUssR0FBcUIsRUFBRSxRQUFRLEVBQUUsZUFBZSxDQUFDLFlBQVksRUFBRSxDQUFDO0tBU3RFO0lBSkMsSUFDWSxPQUFPO1FBQ2pCLE9BQU8sSUFBSSxDQUFDLE9BQU8sRUFBRSxhQUFhLENBQUMsWUFBWSxJQUFJLENBQUMsQ0FBQztJQUN2RCxDQUFDO0lBQUEsQ0FBQzs7Z0hBWFMsbUJBQW1CO29HQUFuQixtQkFBbUIsa1BDVGhDLDJRQVFNOzJGRENPLG1CQUFtQjtrQkFML0IsU0FBUzsrQkFDRSxpQkFBaUI7OEJBTzNCLEtBQUs7c0JBREosS0FBSztnQkFJRSxPQUFPO3NCQURkLFNBQVM7dUJBQUMsT0FBTztnQkFJTixPQUFPO3NCQURsQixXQUFXO3VCQUFDLGlCQUFpQiIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgRWxlbWVudFJlZiwgSG9zdEJpbmRpbmcsIElucHV0LCBWaWV3Q2hpbGQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcclxuaW1wb3J0IHsgQ29tbW9uQ29uc3RhbnRzIH0gZnJvbSAnbmd4LXNmYy1jb21tb24nO1xyXG5pbXBvcnQgeyBJU2xpZGVySXRlbU1vZGVsIH0gZnJvbSAnLi9zbGlkZXItaXRlbS5tb2RlbCc7XHJcblxyXG5AQ29tcG9uZW50KHtcclxuICBzZWxlY3RvcjogJ3NmYy1zbGlkZXItaXRlbScsXHJcbiAgdGVtcGxhdGVVcmw6ICcuL3NsaWRlci1pdGVtLmNvbXBvbmVudC5odG1sJyxcclxuICBzdHlsZVVybHM6IFsnLi9zbGlkZXItaXRlbS5jb21wb25lbnQuc2NzcyddXHJcbn0pXHJcbmV4cG9ydCBjbGFzcyBTbGlkZXJJdGVtQ29tcG9uZW50IHtcclxuXHJcbiAgQElucHV0KClcclxuICBtb2RlbDogSVNsaWRlckl0ZW1Nb2RlbCA9IHsgaW1hZ2VTcmM6IENvbW1vbkNvbnN0YW50cy5FTVBUWV9TVFJJTkcgfTtcclxuXHJcbiAgQFZpZXdDaGlsZCgnaW1hZ2UnKVxyXG4gIHByaXZhdGUgaW1hZ2VFbCE6IEVsZW1lbnRSZWY7XHJcblxyXG4gIEBIb3N0QmluZGluZygnc3R5bGUuaGVpZ2h0LnB4JylcclxuICBwcml2YXRlIGdldCBfaGVpZ2h0KCk6IG51bWJlciB7XHJcbiAgICByZXR1cm4gdGhpcy5pbWFnZUVsPy5uYXRpdmVFbGVtZW50Lm9mZnNldEhlaWdodCB8fCAwO1xyXG4gIH07XHJcbn1cclxuIiwiPGRpdiBjbGFzcz1cImNvbnRhaW5lclwiPlxyXG4gICAgPGRpdiBjbGFzcz1cInRpdGxlXCI+XHJcbiAgICAgICAgPGgyPnt7bW9kZWwudGl0bGV9fTwvaDI+XHJcbiAgICAgICAgPHNwYW4+e3ttb2RlbC5zdWJUaXRsZX19PC9zcGFuPlxyXG4gICAgPC9kaXY+XHJcbiAgICA8ZGl2IGNsYXNzPVwiaW1hZ2VcIj5cclxuICAgICAgICA8aW1nICNpbWFnZSBbc3JjXT1cIm1vZGVsLmltYWdlU3JjXCIgc2ZjSW1hZ2VMb2FkPlxyXG4gICAgPC9kaXY+ICAgXHJcbjwvZGl2PiJdfQ==

package/esm2020/lib/components/slider/parts/pagination/slider-pagination.component.mjs

@@ -15,10 +15,10 @@ export class SliderPaginationComponent {
     }
 }
 SliderPaginationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: SliderPaginationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-SliderPaginationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: SliderPaginationComponent, selector: "sfc-slider-pagination", inputs: { count: "count", index: "index" }, outputs: { selected: "selected" }, ngImport: i0, template: "<ul>\r\n    <li *ngFor=\"let _ of items; let itemIndex = index;\" [class.active]=\"itemIndex === index\"\r\n        (click)=\"selectItem(itemIndex)\"></li>\r\n</ul>", styles: [":host{display:inline-block}:host ul{display:flex;align-items:center;margin:0;padding:0}:host ul li{margin:.3em;display:inline-block;width:.6em;height:.6em;border-radius:50%;background:#fff;opacity:.5;cursor:pointer;transition:all .3s cubic-bezier(1,.01,.32,1)}:host ul li.active{transform:scale(1.7);opacity:1}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
+SliderPaginationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: SliderPaginationComponent, selector: "sfc-slider-pagination", inputs: { count: "count", index: "index" }, outputs: { selected: "selected" }, ngImport: i0, template: "<ul>\r\n    <li *ngFor=\"let _ of items; let itemIndex = index;\" [class.active]=\"itemIndex === index\"\r\n        (click)=\"selectItem(itemIndex)\"></li>\r\n</ul>", styles: [":host{display:inline-block;z-index:9999}:host ul{display:flex;align-items:center;margin:0;padding:0}:host ul li{margin:.3em;display:inline-block;width:.6em;height:.6em;border-radius:50%;background:#fff;opacity:.5;cursor:pointer;transition:all .3s cubic-bezier(1,.01,.32,1)}:host ul li.active{transform:scale(1.7);opacity:1}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: SliderPaginationComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'sfc-slider-pagination', template: "<ul>\r\n    <li *ngFor=\"let _ of items; let itemIndex = index;\" [class.active]=\"itemIndex === index\"\r\n        (click)=\"selectItem(itemIndex)\"></li>\r\n</ul>", styles: [":host{display:inline-block}:host ul{display:flex;align-items:center;margin:0;padding:0}:host ul li{margin:.3em;display:inline-block;width:.6em;height:.6em;border-radius:50%;background:#fff;opacity:.5;cursor:pointer;transition:all .3s cubic-bezier(1,.01,.32,1)}:host ul li.active{transform:scale(1.7);opacity:1}\n"] }]
+            args: [{ selector: 'sfc-slider-pagination', template: "<ul>\r\n    <li *ngFor=\"let _ of items; let itemIndex = index;\" [class.active]=\"itemIndex === index\"\r\n        (click)=\"selectItem(itemIndex)\"></li>\r\n</ul>", styles: [":host{display:inline-block;z-index:9999}:host ul{display:flex;align-items:center;margin:0;padding:0}:host ul li{margin:.3em;display:inline-block;width:.6em;height:.6em;border-radius:50%;background:#fff;opacity:.5;cursor:pointer;transition:all .3s cubic-bezier(1,.01,.32,1)}:host ul li.active{transform:scale(1.7);opacity:1}\n"] }]
         }], propDecorators: { count: [{
                 type: Input
             }], index: [{

package/esm2020/lib/components/slider/slider.component.mjs

@@ -1,5 +1,4 @@
-import { Component, HostListener, Input, ViewChild, ViewChildren } from '@angular/core';
-import { getCssLikeValue } from 'ngx-sfc-common';
+import { Component, HostBinding, HostListener, Input, ViewChild, ViewChildren } from '@angular/core';
 import { map } from 'rxjs';
 import { SliderButtonType } from './parts/button/slider-button-type.enum';
 import { SliderItemComponent } from './parts/item/slider-item.component';
@@ -11,16 +10,20 @@ import { faPauseCircle, faPlayCircle } from '@fortawesome/free-solid-svg-icons';
 import * as i0 from "@angular/core";
 import * as i1 from "./service/slider/slider.service";
 import * as i2 from "./service/automatic/slider-automatic.service";
-import * as i3 from "@angular/common";
-import * as i4 from "@fortawesome/angular-fontawesome";
-import * as i5 from "./parts/item/slider-item.component";
-import * as i6 from "./parts/button/slider-button.component";
-import * as i7 from "./parts/pagination/slider-pagination.component";
+import * as i3 from "ngx-sfc-common";
+import * as i4 from "@angular/common";
+import * as i5 from "@fortawesome/angular-fontawesome";
+import * as i6 from "./parts/item/slider-item.component";
+import * as i7 from "./parts/button/slider-button.component";
+import * as i8 from "./parts/pagination/slider-pagination.component";
 export class SliderComponent {
-    constructor(sliderService, automaticService, changeDetector) {
+    constructor(sliderService, automaticService, resizeService, imageLoadService, changeDetector) {
         this.sliderService = sliderService;
         this.automaticService = automaticService;
+        this.resizeService = resizeService;
+        this.imageLoadService = imageLoadService;
         this.changeDetector = changeDetector;
+        this.SIZE_FACTOR = 0.00225;
         this.PAUSE_ICON = faPauseCircle;
         this.PLAY_ICON = faPlayCircle;
         this.SliderButtonType = SliderButtonType;
@@ -29,10 +32,13 @@ export class SliderComponent {
         this.type = SliderType.Default;
         this.showCount = true;
         this.pagination = true;
+        this.handlers = true;
+        this.showAutomaticToggle = true;
         /**
          * If active show buttons
          */
         this.active = false;
+        this._sizeFactor = 1;
     }
     onEnter() {
         this.active = true;
@@ -58,27 +64,22 @@ export class SliderComponent {
         this.vm$ = this.sliderService.model$.pipe(map(model => {
             return {
                 index: model.index,
-                styles: this.getStyles(model.index, model.count),
                 label: `${model.count > 0 ? model.index + 1 : 0} / ${model.count}`,
                 count: model.count
             };
         }));
         if (this.isAutomatic)
             this.automaticService.start();
+        this.imageLoadService.load$.subscribe((sizeEvent) => {
+            this._sizeFactor = this.getSizeFactor(sizeEvent.offset.height);
+            this._maxWidth = sizeEvent.natural.width;
+        });
+        this.resizeService.onResize$.subscribe(() => this._sizeFactor = this.getSizeFactor(this.itemsEl.nativeElement.offsetHeight));
+        this.changeDetector.detectChanges();
     }
     ngAfterViewChecked() {
         this.changeDetector.detectChanges();
     }
-    getStyles(index, count) {
-        if (this.slider) {
-            const width = this.slider.nativeElement.offsetWidth;
-            return {
-                width: getCssLikeValue(width * count),
-                left: getCssLikeValue(-width * index)
-            };
-        }
-        return null;
-    }
     move(type) {
         this.sliderService.move(type);
     }
@@ -88,13 +89,16 @@ export class SliderComponent {
     toggleAutomatic() {
         this.automaticService.toggle();
     }
+    getSizeFactor(value) {
+        return value * this.SIZE_FACTOR;
+    }
 }
-SliderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: SliderComponent, deps: [{ token: i1.SliderService }, { token: i2.SliderAutomaticService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-SliderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: SliderComponent, selector: "sfc-slider", inputs: { items: "items", type: "type", showCount: "showCount", pagination: "pagination" }, host: { listeners: { "mouseenter": "onEnter()", "mouseleave": "onLeave()" } }, providers: [SliderService, SliderAutomaticService], viewQueries: [{ propertyName: "slider", first: true, predicate: ["slider"], descendants: true }, { propertyName: "sliderItems", predicate: SliderItemComponent, descendants: true }], ngImport: i0, template: "<div class=\"container\">\r\n    <div *ngIf=\"vm$ | async as vm\" #slider class=\"slider\">\r\n        <ul [ngStyle]=\"vm.styles\">\r\n            <sfc-slider-item *ngFor=\"let item of items\" [model]=\"item\"></sfc-slider-item>\r\n        </ul>\r\n\r\n        <div class=\"buttons\">\r\n            <sfc-slider-button [active]=\"active\" [type]=\"SliderButtonType.Next\" (click)=\"move(SliderMoveType.Next)\">\r\n            </sfc-slider-button>\r\n            <sfc-slider-button [active]=\"active\" [type]=\"SliderButtonType.Previous\" (click)=\"move(SliderMoveType.Previous)\">\r\n            </sfc-slider-button>\r\n        </div>\r\n\r\n        <div class=\"counter\" *ngIf=\"showCount\">{{vm.label}}</div>\r\n\r\n        <div class=\"actions\">\r\n            <sfc-slider-pagination *ngIf=\"pagination\" [count]=\"vm.count\" [index]=\"vm.index\" (selected)=\"select($event)\">\r\n            </sfc-slider-pagination>\r\n\r\n            <div *ngIf=\"isAutomatic\" class=\"automatic\" (click)=\"toggleAutomatic()\">\r\n                <fa-icon [icon]=\"automaticIcon\"></fa-icon>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</div>", styles: [":host .container{width:37.5em;height:25em;color:#fff}:host .container .slider{height:inherit;position:relative;overflow:hidden;background:#434a54;display:flex;justify-content:center;align-items:flex-end}:host .container .slider>ul{position:absolute;list-style:none;margin:0;padding:0;height:inherit;transition:all .3s cubic-bezier(1,.01,.32,1)}:host .container .slider .counter{top:10%;right:6%;position:absolute;font-weight:700;-webkit-user-select:none;user-select:none}:host .container .slider .actions{margin-bottom:1em;cursor:pointer;display:flex;flex-direction:column;justify-content:center;position:relative;align-items:center}:host .container .slider .actions .automatic{margin-top:.3em}\n"], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i4.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }, { kind: "component", type: i5.SliderItemComponent, selector: "sfc-slider-item", inputs: ["model"] }, { kind: "component", type: i6.SliderButtonComponent, selector: "sfc-slider-button", inputs: ["type", "active"] }, { kind: "component", type: i7.SliderPaginationComponent, selector: "sfc-slider-pagination", inputs: ["count", "index"], outputs: ["selected"] }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }] });
+SliderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: SliderComponent, deps: [{ token: i1.SliderService }, { token: i2.SliderAutomaticService }, { token: i3.ResizeService }, { token: i3.ImageLoadService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+SliderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: SliderComponent, selector: "sfc-slider", inputs: { items: "items", type: "type", showCount: "showCount", pagination: "pagination", handlers: "handlers", showAutomaticToggle: "showAutomaticToggle" }, host: { listeners: { "mouseenter": "onEnter()", "mouseleave": "onLeave()" }, properties: { "style.font-size.em": "this._sizeFactor", "style.max-width.px": "this._maxWidth" } }, providers: [SliderService, SliderAutomaticService], viewQueries: [{ propertyName: "itemsEl", first: true, predicate: ["itemsContainer"], descendants: true }, { propertyName: "sliderItems", predicate: SliderItemComponent, descendants: true }], ngImport: i0, template: "<div class=\"container\" *ngIf=\"vm$ | async as vm\">\r\n    <div #itemsContainer class=\"items\">\r\n        <sfc-slider-item *ngFor=\"let item of items; let itemIndex = index;\" [model]=\"item\"\r\n            [sfcShowHideElement]=\"itemIndex === vm.index\"></sfc-slider-item>\r\n    </div>\r\n\r\n    <div *ngIf=\"handlers\" class=\"buttons\">\r\n        <sfc-slider-button [active]=\"active\" [type]=\"SliderButtonType.Next\" (click)=\"move(SliderMoveType.Next)\">\r\n        </sfc-slider-button>\r\n        <sfc-slider-button [active]=\"active\" [type]=\"SliderButtonType.Previous\" (click)=\"move(SliderMoveType.Previous)\">\r\n        </sfc-slider-button>\r\n    </div>\r\n\r\n    <div class=\"counter\" *ngIf=\"showCount\">{{vm.label}}</div>\r\n\r\n    <div class=\"actions\">\r\n        <sfc-slider-pagination *ngIf=\"pagination\" [count]=\"vm.count\" [index]=\"vm.index\" (selected)=\"select($event)\">\r\n        </sfc-slider-pagination>\r\n\r\n        <div *ngIf=\"isAutomatic && showAutomaticToggle\" class=\"automatic\" (click)=\"toggleAutomatic()\">\r\n            <fa-icon [icon]=\"automaticIcon\"></fa-icon>\r\n        </div>\r\n    </div>\r\n</div>", styles: [":host{display:inline-block;width:100%}:host .container{position:relative;color:#fff}:host .container .counter{top:10%;right:6%;position:absolute;font-weight:700;-webkit-user-select:none;user-select:none}:host .container .actions{cursor:pointer;display:flex;flex-direction:column;justify-content:center;position:absolute;top:85%;align-items:center;width:100%}:host .container .actions .automatic{margin-top:.3em}:host .container .buttons,:host .container .counter,:host .container .actions{z-index:2}\n"], dependencies: [{ kind: "directive", type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i5.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }, { kind: "directive", type: i3.ShowHideElementDirective, selector: "[sfcShowHideElement]", inputs: ["sfcShowHideElement", "delay"] }, { kind: "component", type: i6.SliderItemComponent, selector: "sfc-slider-item", inputs: ["model"] }, { kind: "component", type: i7.SliderButtonComponent, selector: "sfc-slider-button", inputs: ["type", "active"] }, { kind: "component", type: i8.SliderPaginationComponent, selector: "sfc-slider-pagination", inputs: ["count", "index"], outputs: ["selected"] }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: SliderComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'sfc-slider', providers: [SliderService, SliderAutomaticService], template: "<div class=\"container\">\r\n    <div *ngIf=\"vm$ | async as vm\" #slider class=\"slider\">\r\n        <ul [ngStyle]=\"vm.styles\">\r\n            <sfc-slider-item *ngFor=\"let item of items\" [model]=\"item\"></sfc-slider-item>\r\n        </ul>\r\n\r\n        <div class=\"buttons\">\r\n            <sfc-slider-button [active]=\"active\" [type]=\"SliderButtonType.Next\" (click)=\"move(SliderMoveType.Next)\">\r\n            </sfc-slider-button>\r\n            <sfc-slider-button [active]=\"active\" [type]=\"SliderButtonType.Previous\" (click)=\"move(SliderMoveType.Previous)\">\r\n            </sfc-slider-button>\r\n        </div>\r\n\r\n        <div class=\"counter\" *ngIf=\"showCount\">{{vm.label}}</div>\r\n\r\n        <div class=\"actions\">\r\n            <sfc-slider-pagination *ngIf=\"pagination\" [count]=\"vm.count\" [index]=\"vm.index\" (selected)=\"select($event)\">\r\n            </sfc-slider-pagination>\r\n\r\n            <div *ngIf=\"isAutomatic\" class=\"automatic\" (click)=\"toggleAutomatic()\">\r\n                <fa-icon [icon]=\"automaticIcon\"></fa-icon>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</div>", styles: [":host .container{width:37.5em;height:25em;color:#fff}:host .container .slider{height:inherit;position:relative;overflow:hidden;background:#434a54;display:flex;justify-content:center;align-items:flex-end}:host .container .slider>ul{position:absolute;list-style:none;margin:0;padding:0;height:inherit;transition:all .3s cubic-bezier(1,.01,.32,1)}:host .container .slider .counter{top:10%;right:6%;position:absolute;font-weight:700;-webkit-user-select:none;user-select:none}:host .container .slider .actions{margin-bottom:1em;cursor:pointer;display:flex;flex-direction:column;justify-content:center;position:relative;align-items:center}:host .container .slider .actions .automatic{margin-top:.3em}\n"] }]
-        }], ctorParameters: function () { return [{ type: i1.SliderService }, { type: i2.SliderAutomaticService }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { items: [{
+            args: [{ selector: 'sfc-slider', providers: [SliderService, SliderAutomaticService], template: "<div class=\"container\" *ngIf=\"vm$ | async as vm\">\r\n    <div #itemsContainer class=\"items\">\r\n        <sfc-slider-item *ngFor=\"let item of items; let itemIndex = index;\" [model]=\"item\"\r\n            [sfcShowHideElement]=\"itemIndex === vm.index\"></sfc-slider-item>\r\n    </div>\r\n\r\n    <div *ngIf=\"handlers\" class=\"buttons\">\r\n        <sfc-slider-button [active]=\"active\" [type]=\"SliderButtonType.Next\" (click)=\"move(SliderMoveType.Next)\">\r\n        </sfc-slider-button>\r\n        <sfc-slider-button [active]=\"active\" [type]=\"SliderButtonType.Previous\" (click)=\"move(SliderMoveType.Previous)\">\r\n        </sfc-slider-button>\r\n    </div>\r\n\r\n    <div class=\"counter\" *ngIf=\"showCount\">{{vm.label}}</div>\r\n\r\n    <div class=\"actions\">\r\n        <sfc-slider-pagination *ngIf=\"pagination\" [count]=\"vm.count\" [index]=\"vm.index\" (selected)=\"select($event)\">\r\n        </sfc-slider-pagination>\r\n\r\n        <div *ngIf=\"isAutomatic && showAutomaticToggle\" class=\"automatic\" (click)=\"toggleAutomatic()\">\r\n            <fa-icon [icon]=\"automaticIcon\"></fa-icon>\r\n        </div>\r\n    </div>\r\n</div>", styles: [":host{display:inline-block;width:100%}:host .container{position:relative;color:#fff}:host .container .counter{top:10%;right:6%;position:absolute;font-weight:700;-webkit-user-select:none;user-select:none}:host .container .actions{cursor:pointer;display:flex;flex-direction:column;justify-content:center;position:absolute;top:85%;align-items:center;width:100%}:host .container .actions .automatic{margin-top:.3em}:host .container .buttons,:host .container .counter,:host .container .actions{z-index:2}\n"] }]
+        }], ctorParameters: function () { return [{ type: i1.SliderService }, { type: i2.SliderAutomaticService }, { type: i3.ResizeService }, { type: i3.ImageLoadService }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { items: [{
                 type: Input
             }], type: [{
                 type: Input
@@ -102,9 +106,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImpor
                 type: Input
             }], pagination: [{
                 type: Input
-            }], slider: [{
-                type: ViewChild,
-                args: ['slider', { static: false }]
+            }], handlers: [{
+                type: Input
+            }], showAutomaticToggle: [{
+                type: Input
             }], sliderItems: [{
                 type: ViewChildren,
                 args: [SliderItemComponent]
@@ -114,5 +119,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImpor
             }], onLeave: [{
                 type: HostListener,
                 args: ['mouseleave']
+            }], itemsEl: [{
+                type: ViewChild,
+                args: ['itemsContainer']
+            }], _sizeFactor: [{
+                type: HostBinding,
+                args: ['style.font-size.em']
+            }], _maxWidth: [{
+                type: HostBinding,
+                args: ['style.max-width.px']
             }] } });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2xpZGVyLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL25neC1zZmMtY29tcG9uZW50cy9zcmMvbGliL2NvbXBvbmVudHMvc2xpZGVyL3NsaWRlci5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9uZ3gtc2ZjLWNvbXBvbmVudHMvc3JjL2xpYi9jb21wb25lbnRzL3NsaWRlci9zbGlkZXIuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUMrQyxTQUFTLEVBQWMsWUFBWSxFQUFFLEtBQUssRUFDbkYsU0FBUyxFQUFFLFlBQVksRUFDbkMsTUFBTSxlQUFlLENBQUM7QUFDdkIsT0FBTyxFQUFFLGVBQWUsRUFBRSxNQUFNLGdCQUFnQixDQUFDO0FBQ2pELE9BQU8sRUFBRSxHQUFHLEVBQWMsTUFBTSxNQUFNLENBQUM7QUFDdkMsT0FBTyxFQUFFLGdCQUFnQixFQUFFLE1BQU0sd0NBQXdDLENBQUM7QUFDMUUsT0FBTyxFQUFFLG1CQUFtQixFQUFFLE1BQU0sb0NBQW9DLENBQUM7QUFFekUsT0FBTyxFQUFFLHNCQUFzQixFQUFFLE1BQU0sOENBQThDLENBQUM7QUFDdEYsT0FBTyxFQUFFLGNBQWMsRUFBRSxNQUFNLHdDQUF3QyxDQUFDO0FBQ3hFLE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSxpQ0FBaUMsQ0FBQztBQUNoRSxPQUFPLEVBQUUsVUFBVSxFQUFFLE1BQU0sb0JBQW9CLENBQUM7QUFDaEQsT0FBTyxFQUFFLGFBQWEsRUFBRSxZQUFZLEVBQWtCLE1BQU0sbUNBQW1DLENBQUM7Ozs7Ozs7OztBQVFoRyxNQUFNLE9BQU8sZUFBZTtJQTZEMUIsWUFBbUIsYUFBNEIsRUFDckMsZ0JBQXdDLEVBQ3hDLGNBQWlDO1FBRnhCLGtCQUFhLEdBQWIsYUFBYSxDQUFlO1FBQ3JDLHFCQUFnQixHQUFoQixnQkFBZ0IsQ0FBd0I7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O1FBRUQsT0FBTyxJQUFJLENBQUM7SUFDZCxDQUFDO0lBRUQsSUFBSSxDQUFDLElBQW9CO1FBQ3ZCLElBQUksQ0FBQyxhQUFhLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxDQUFDO0lBQ2hDLENBQUM7SUFFRCxNQUFNLENBQUMsS0FBYTtRQUNsQixJQUFJLENBQUMsYUFBYSxDQUFDLE1BQU0sQ0FBQyxLQUFLLENBQUMsQ0FBQztJQUNuQyxDQUFDO0lBRUQsZUFBZTtRQUNiLElBQUksQ0FBQyxnQkFBZ0IsQ0FBQyxNQUFNLEVBQUUsQ0FBQztJQUNqQyxDQUFDOzs0R0E5R1UsZUFBZTtnR0FBZixlQUFlLGdOQUZmLENBQUMsYUFBYSxFQUFFLHNCQUFzQixDQUFDLDZJQTJCcEMsbUJBQW1CLGdEQzlDbkMsNm5DQXdCTTsyRkRITyxlQUFlO2tCQU4zQixTQUFTOytCQUNFLFlBQVksYUFHWCxDQUFDLGFBQWEsRUFBRSxzQkFBc0IsQ0FBQzt5S0FhbEQsS0FBSztzQkFESixLQUFLO2dCQUlOLElBQUk7c0JBREgsS0FBSztnQkFJTixTQUFTO3NCQURSLEtBQUs7Z0JBSU4sVUFBVTtzQkFEVCxLQUFLO2dCQUlFLE1BQU07c0JBRGIsU0FBUzt1QkFBQyxRQUFRLEVBQUUsRUFBRSxNQUFNLEVBQUUsS0FBSyxFQUFFO2dCQUk5QixXQUFXO3NCQURsQixZQUFZO3VCQUFDLG1CQUFtQjtnQkFXakMsT0FBTztzQkFETixZQUFZO3VCQUFDLFlBQVk7Z0JBVTFCLE9BQU87c0JBRE4sWUFBWTt1QkFBQyxZQUFZIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtcclxuICBBZnRlclZpZXdDaGVja2VkLCBBZnRlclZpZXdJbml0LCBDaGFuZ2VEZXRlY3RvclJlZiwgQ29tcG9uZW50LCBFbGVtZW50UmVmLCBIb3N0TGlzdGVuZXIsIElucHV0LFxyXG4gIFF1ZXJ5TGlzdCwgVmlld0NoaWxkLCBWaWV3Q2hpbGRyZW5cclxufSBmcm9tICdAYW5ndWxhci9jb3JlJztcclxuaW1wb3J0IHsgZ2V0Q3NzTGlrZVZhbHVlIH0gZnJvbSAnbmd4LXNmYy1jb21tb24nO1xyXG5pbXBvcnQgeyBtYXAsIE9ic2VydmFibGUgfSBmcm9tICdyeGpzJztcclxuaW1wb3J0IHsgU2xpZGVyQnV0dG9uVHlwZSB9IGZyb20gJy4vcGFydHMvYnV0dG9uL3NsaWRlci1idXR0b24tdHlwZS5lbnVtJztcclxuaW1wb3J0IHsgU2xpZGVySXRlbUNvbXBvbmVudCB9IGZyb20gJy4vcGFydHMvaXRlbS9zbGlkZXItaXRlbS5jb21wb25lbnQnO1xyXG5pbXBvcnQgeyBJU2xpZGVySXRlbU1vZGVsIH0gZnJvbSAnLi9wYXJ0cy9pdGVtL3NsaWRlci1pdGVtLm1vZGVsJztcclxuaW1wb3J0IHsgU2xpZGVyQXV0b21hdGljU2VydmljZSB9IGZyb20gJy4vc2VydmljZS9hdXRvbWF0aWMvc2xpZGVyLWF1dG9tYXRpYy5zZXJ2aWNlJztcclxuaW1wb3J0IHsgU2xpZGVyTW92ZVR5cGUgfSBmcm9tICcuL3NlcnZpY2Uvc2xpZGVyL3NsaWRlci1tb3ZlLXR5cGUuZW51bSc7XHJcbmltcG9ydCB7IFNsaWRlclNlcnZpY2UgfSBmcm9tICcuL3NlcnZpY2Uvc2xpZGVyL3NsaWRlci5zZXJ2aWNlJztcclxuaW1wb3J0IHsgU2xpZGVyVHlwZSB9IGZyb20gJy4vc2xpZGVyLXR5cGUuZW51bSc7XHJcbmltcG9ydCB7IGZhUGF1c2VDaXJjbGUsIGZhUGxheUNpcmNsZSwgSWNvbkRlZmluaXRpb24gfSBmcm9tICdAZm9ydGF3ZXNvbWUvZnJlZS1zb2xpZC1zdmctaWNvbnMnO1xyXG5cclxuQENvbXBvbmVudCh7XHJcbiAgc2VsZWN0b3I6ICdzZmMtc2xpZGVyJyxcclxuICB0ZW1wbGF0ZVVybDogJy4vc2xpZGVyLmNvbXBvbmVudC5odG1sJyxcclxuICBzdHlsZVVybHM6IFsnLi9zbGlkZXIuY29tcG9uZW50LnNjc3MnXSxcclxuICBwcm92aWRlcnM6IFtTbGlkZXJTZXJ2aWNlLCBTbGlkZXJBdXRvbWF0aWNTZXJ2aWNlXVxyXG59KVxyXG5leHBvcnQgY2xhc3MgU2xpZGVyQ29tcG9uZW50IGltcGxlbWVudHMgQWZ0ZXJWaWV3SW5pdCwgQWZ0ZXJWaWV3Q2hlY2tlZCB7XHJcblxyXG4gIHJlYWRvbmx5IFBBVVNFX0lDT04gPSBmYVBhdXNlQ2lyY2xlO1xyXG5cclxuICByZWFkb25seSBQTEFZX0lDT04gPSBmYVBsYXlDaXJjbGU7XHJcblxyXG4gIFNsaWRlckJ1dHRvblR5cGUgPSBTbGlkZXJCdXR0b25UeXBlO1xyXG5cclxuICBTbGlkZXJNb3ZlVHlwZSA9IFNsaWRlck1vdmVUeXBlO1xyXG5cclxuICBASW5wdXQoKVxyXG4gIGl0ZW1zOiBJU2xpZGVySXRlbU1vZGVsW10gPSBbXTtcclxuXHJcbiAgQElucHV0KClcclxuICB0eXBlOiBTbGlkZXJUeXBlID0gU2xpZGVyVHlwZS5EZWZhdWx0O1xyXG5cclxuICBASW5wdXQoKVxyXG4gIHNob3dDb3VudDogYm9vbGVhbiA9IHRydWU7XHJcblxyXG4gIEBJbnB1dCgpXHJcbiAgcGFnaW5hdGlvbjogYm9vbGVhbiA9IHRydWU7XHJcblxyXG4gIEBWaWV3Q2hpbGQoJ3NsaWRlcicsIHsgc3RhdGljOiBmYWxzZSB9KVxyXG4gIHByaXZhdGUgc2xpZGVyITogRWxlbWVudFJlZjtcclxuXHJcbiAgQFZpZXdDaGlsZHJlbihTbGlkZXJJdGVtQ29tcG9uZW50KVxyXG4gIHByaXZhdGUgc2xpZGVySXRlbXMhOiBRdWVyeUxpc3Q8U2xpZGVySXRlbUNvbXBvbmVudD47XHJcblxyXG4gIC8qKlxyXG4gICAqIElmIGFjdGl2ZSBzaG93IGJ1dHRvbnNcclxuICAgKi9cclxuICBhY3RpdmU6IGJvb2xlYW4gPSBmYWxzZTtcclxuXHJcbiAgcHVibGljIHZtJCE6IE9ic2VydmFibGU8YW55PjtcclxuXHJcbiAgQEhvc3RMaXN0ZW5lcignbW91c2VlbnRlcicpXHJcbiAgb25FbnRlcigpIHtcclxuICAgIHRoaXMuYWN0aXZlID0gdHJ1ZTtcclxuXHJcbiAgICAvLyBzdG9wIGF1dG9tYXRpYyBtb3ZlIG9uIGhvdmVyXHJcbiAgICBpZiAodGhpcy5pc0F1dG9tYXRpYylcclxuICAgICAgdGhpcy5hdXRvbWF0aWNTZXJ2aWNlLnN0b3AoKTtcclxuICB9XHJcblxyXG4gIEBIb3N0TGlzdGVuZXIoJ21vdXNlbGVhdmUnKVxyXG4gIG9uTGVhdmUoKSB7XHJcbiAgICB0aGlzLmFjdGl2ZSA9IGZhbHNlO1xyXG5cclxuICAgIC8vIHN0YXJ0IGF1dG9tYXRpYyBtb3ZlIG9uIGhvdmVyIGVuZFxyXG4gICAgaWYgKHRoaXMuaXNBdXRvbWF0aWMgJiYgIXRoaXMuYXV0b21hdGljU2VydmljZS5wYXVzZSlcclxuICAgICAgdGhpcy5hdXRvbWF0aWNTZXJ2aWNlLnN0YXJ0KCk7XHJcbiAgfVxyXG5cclxuICBnZXQgaXNBdXRvbWF0aWMoKSB7XHJcbiAgICByZXR1cm4gdGhpcy50eXBlID09IFNsaWRlclR5cGUuQXV0b21hdGljO1xyXG4gIH1cclxuXHJcbiAgZ2V0IGF1dG9tYXRpY0ljb24oKTogSWNvbkRlZmluaXRpb24ge1xyXG4gICAgcmV0dXJuIHRoaXMuYXV0b21hdGljU2VydmljZS5wYXVzZSA/IHRoaXMuUExBWV9JQ09OIDogdGhpcy5QQVVTRV9JQ09OO1xyXG4gIH1cclxuXHJcbiAgY29uc3RydWN0b3IocHVibGljIHNsaWRlclNlcnZpY2U6IFNsaWRlclNlcnZpY2UsXHJcbiAgICBwcml2YXRlIGF1dG9tYXRpY1NlcnZpY2U6IFNsaWRlckF1dG9tYXRpY1NlcnZpY2UsXHJcbiAgICBwcml2YXRlIGNoYW5nZURldGVjdG9yOiBDaGFuZ2VEZXRlY3RvclJlZikgeyB9XHJcblxyXG4gIG5nQWZ0ZXJWaWV3SW5pdCgpOiB2b2lkIHtcclxuICAgIGNvbnN0IGNvdW50JCA9IHRoaXMuc2xpZGVySXRlbXMuY2hhbmdlcy5waXBlKG1hcChjID0+IGMubGVuZ3RoKSk7XHJcbiAgICB0aGlzLnNsaWRlclNlcnZpY2UuaW5pdChjb3VudCQpO1xyXG5cclxuICAgIHRoaXMudm0kID0gdGhpcy5zbGlkZXJTZXJ2aWNlLm1vZGVsJC5waXBlKFxyXG4gICAgICBtYXAobW9kZWwgPT4ge1xyXG4gICAgICAgIHJldHVybiB7XHJcbiAgICAgICAgICBpbmRleDogbW9kZWwuaW5kZXgsXHJcbiAgICAgICAgICBzdHlsZXM6IHRoaXMuZ2V0U3R5bGVzKG1vZGVsLmluZGV4LCBtb2RlbC5jb3VudCksXHJcbiAgICAgICAgICBsYWJlbDogYCR7bW9kZWwuY291bnQgPiAwID8gbW9kZWwuaW5kZXggKyAxIDogMH0gLyAke21vZGVsLmNvdW50fWAsXHJcbiAgICAgICAgICBjb3VudDogbW9kZWwuY291bnRcclxuICAgICAgICB9XHJcbiAgICAgIH0pXHJcbiAgICApO1xyXG5cclxuICAgIGlmICh0aGlzLmlzQXV0b21hdGljKVxyXG4gICAgICB0aGlzLmF1dG9tYXRpY1NlcnZpY2Uuc3RhcnQoKTtcclxuICB9XHJcblxyXG4gIG5nQWZ0ZXJWaWV3Q2hlY2tlZCgpIHtcclxuICAgIHRoaXMuY2hhbmdlRGV0ZWN0b3IuZGV0ZWN0Q2hhbmdlcygpO1xyXG4gIH1cclxuXHJcbiAgZ2V0U3R5bGVzKGluZGV4OiBudW1iZXIsIGNvdW50OiBudW1iZXIpIHtcclxuICAgIGlmICh0aGlzLnNsaWRlcikge1xyXG4gICAgICBjb25zdCB3aWR0aCA9IHRoaXMuc2xpZGVyLm5hdGl2ZUVsZW1lbnQub2Zmc2V0V2lkdGg7XHJcbiAgICAgIHJldHVybiB7XHJcbiAgICAgICAgd2lkdGg6IGdldENzc0xpa2VWYWx1ZSh3aWR0aCAqIGNvdW50KSxcclxuICAgICAgICBsZWZ0OiBnZXRDc3NMaWtlVmFsdWUoLXdpZHRoICogaW5kZXgpXHJcbiAgICAgIH07XHJcbiAgICB9XHJcblxyXG4gICAgcmV0dXJuIG51bGw7XHJcbiAgfVxyXG5cclxuICBtb3ZlKHR5cGU6IFNsaWRlck1vdmVUeXBlKTogdm9pZCB7XHJcbiAgICB0aGlzLnNsaWRlclNlcnZpY2UubW92ZSh0eXBlKTtcclxuICB9XHJcblxyXG4gIHNlbGVjdChpbmRleDogbnVtYmVyKTogdm9pZCB7XHJcbiAgICB0aGlzLnNsaWRlclNlcnZpY2Uuc2VsZWN0KGluZGV4KTtcclxuICB9XHJcblxyXG4gIHRvZ2dsZUF1dG9tYXRpYygpOiB2b2lkIHtcclxuICAgIHRoaXMuYXV0b21hdGljU2VydmljZS50b2dnbGUoKTtcclxuICB9XHJcbn1cclxuIiwiPGRpdiBjbGFzcz1cImNvbnRhaW5lclwiPlxyXG4gICAgPGRpdiAqbmdJZj1cInZtJCB8IGFzeW5jIGFzIHZtXCIgI3NsaWRlciBjbGFzcz1cInNsaWRlclwiPlxyXG4gICAgICAgIDx1bCBbbmdTdHlsZV09XCJ2bS5zdHlsZXNcIj5cclxuICAgICAgICAgICAgPHNmYy1zbGlkZXItaXRlbSAqbmdGb3I9XCJsZXQgaXRlbSBvZiBpdGVtc1wiIFttb2RlbF09XCJpdGVtXCI+PC9zZmMtc2xpZGVyLWl0ZW0+XHJcbiAgICAgICAgPC91bD5cclxuXHJcbiAgICAgICAgPGRpdiBjbGFzcz1cImJ1dHRvbnNcIj5cclxuICAgICAgICAgICAgPHNmYy1zbGlkZXItYnV0dG9uIFthY3RpdmVdPVwiYWN0aXZlXCIgW3R5cGVdPVwiU2xpZGVyQnV0dG9uVHlwZS5OZXh0XCIgKGNsaWNrKT1cIm1vdmUoU2xpZGVyTW92ZVR5cGUuTmV4dClcIj5cclxuICAgICAgICAgICAgPC9zZmMtc2xpZGVyLWJ1dHRvbj5cclxuICAgICAgICAgICAgPHNmYy1zbGlkZXItYnV0dG9uIFthY3RpdmVdPVwiYWN0aXZlXCIgW3R5cGVdPVwiU2xpZGVyQnV0dG9uVHlwZS5QcmV2aW91c1wiIChjbGljayk9XCJtb3ZlKFNsaWRlck1vdmVUeXBlLlByZXZpb3VzKVwiPlxyXG4gICAgICAgICAgICA8L3NmYy1zbGlkZXItYnV0dG9uPlxyXG4gICAgICAgIDwvZGl2PlxyXG5cclxuICAgICAgICA8ZGl2IGNsYXNzPVwiY291bnRlclwiICpuZ0lmPVwic2hvd0NvdW50XCI+e3t2bS5sYWJlbH19PC9kaXY+XHJcblxyXG4gICAgICAgIDxkaXYgY2xhc3M9XCJhY3Rpb25zXCI+XHJcbiAgICAgICAgICAgIDxzZmMtc2xpZGVyLXBhZ2luYXRpb24gKm5nSWY9XCJwYWdpbmF0aW9uXCIgW2NvdW50XT1cInZtLmNvdW50XCIgW2luZGV4XT1cInZtLmluZGV4XCIgKHNlbGVjdGVkKT1cInNlbGVjdCgkZXZlbnQpXCI+XHJcbiAgICAgICAgICAgIDwvc2ZjLXNsaWRlci1wYWdpbmF0aW9uPlxyXG5cclxuICAgICAgICAgICAgPGRpdiAqbmdJZj1cImlzQXV0b21hdGljXCIgY2xhc3M9XCJhdXRvbWF0aWNcIiAoY2xpY2spPVwidG9nZ2xlQXV0b21hdGljKClcIj5cclxuICAgICAgICAgICAgICAgIDxmYS1pY29uIFtpY29uXT1cImF1dG9tYXRpY0ljb25cIj48L2ZhLWljb24+XHJcbiAgICAgICAgICAgIDwvZGl2PlxyXG4gICAgICAgIDwvZGl2PlxyXG4gICAgPC9kaXY+XHJcbjwvZGl2PiJdfQ==
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2xpZGVyLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL25neC1zZmMtY29tcG9uZW50cy9zcmMvbGliL2NvbXBvbmVudHMvc2xpZGVyL3NsaWRlci5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9uZ3gtc2ZjLWNvbXBvbmVudHMvc3JjL2xpYi9jb21wb25lbnRzL3NsaWRlci9zbGlkZXIuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUMrQyxTQUFTLEVBQWMsV0FBVyxFQUFFLFlBQVksRUFBRSxLQUFLLEVBQ2hHLFNBQVMsRUFBRSxZQUFZLEVBQ25DLE1BQU0sZUFBZSxDQUFDO0FBQ3ZCLE9BQU8sRUFBRSxHQUFHLEVBQWMsTUFBTSxNQUFNLENBQUM7QUFDdkMsT0FBTyxFQUFFLGdCQUFnQixFQUFFLE1BQU0sd0NBQXdDLENBQUM7QUFDMUUsT0FBTyxFQUFFLG1CQUFtQixFQUFFLE1BQU0sb0NBQW9DLENBQUM7QUFFekUsT0FBTyxFQUFFLHNCQUFzQixFQUFFLE1BQU0sOENBQThDLENBQUM7QUFDdEYsT0FBTyxFQUFFLGNBQWMsRUFBRSxNQUFNLHdDQUF3QyxDQUFDO0FBQ3hFLE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSxpQ0FBaUMsQ0FBQztBQUNoRSxPQUFPLEVBQUUsVUFBVSxFQUFFLE1BQU0sb0JBQW9CLENBQUM7QUFDaEQsT0FBTyxFQUFFLGFBQWEsRUFBRSxZQUFZLEVBQWtCLE1BQU0sbUNBQW1DLENBQUM7Ozs7Ozs7Ozs7QUFTaEcsTUFBTSxPQUFPLGVBQWU7SUEyRTFCLFlBQW1CLGFBQTRCLEVBQ3JDLGdCQUF3QyxFQUN4QyxhQUE0QixFQUM3QixnQkFBa0MsRUFDakMsY0FBaUM7UUFKeEIsa0JBQWEsR0FBYixhQUFhLENBQWU7UUFDckMscUJBQWdCLEdBQWhCLGdCQUFnQixDQUF3QjtRQUN4Qyxr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QUFZO3VCQUFDLFlBQVk7Z0JBVTFCLE9BQU87c0JBRE4sWUFBWTt1QkFBQyxZQUFZO2dCQVVsQixPQUFPO3NCQURkLFNBQVM7dUJBQUMsZ0JBQWdCO2dCQUluQixXQUFXO3NCQURsQixXQUFXO3VCQUFDLG9CQUFvQjtnQkFJekIsU0FBUztzQkFEaEIsV0FBVzt1QkFBQyxvQkFBb0IiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge1xyXG4gIEFmdGVyVmlld0NoZWNrZWQsIEFmdGVyVmlld0luaXQsIENoYW5nZURldGVjdG9yUmVmLCBDb21wb25lbnQsIEVsZW1lbnRSZWYsIEhvc3RCaW5kaW5nLCBIb3N0TGlzdGVuZXIsIElucHV0LFxyXG4gIFF1ZXJ5TGlzdCwgVmlld0NoaWxkLCBWaWV3Q2hpbGRyZW5cclxufSBmcm9tICdAYW5ndWxhci9jb3JlJztcclxuaW1wb3J0IHsgbWFwLCBPYnNlcnZhYmxlIH0gZnJvbSAncnhqcyc7XHJcbmltcG9ydCB7IFNsaWRlckJ1dHRvblR5cGUgfSBmcm9tICcuL3BhcnRzL2J1dHRvbi9zbGlkZXItYnV0dG9uLXR5cGUuZW51bSc7XHJcbmltcG9ydCB7IFNsaWRlckl0ZW1Db21wb25lbnQgfSBmcm9tICcuL3BhcnRzL2l0ZW0vc2xpZGVyLWl0ZW0uY29tcG9uZW50JztcclxuaW1wb3J0IHsgSVNsaWRlckl0ZW1Nb2RlbCB9IGZyb20gJy4vcGFydHMvaXRlbS9zbGlkZXItaXRlbS5tb2RlbCc7XHJcbmltcG9ydCB7IFNsaWRlckF1dG9tYXRpY1NlcnZpY2UgfSBmcm9tICcuL3NlcnZpY2UvYXV0b21hdGljL3NsaWRlci1hdXRvbWF0aWMuc2VydmljZSc7XHJcbmltcG9ydCB7IFNsaWRlck1vdmVUeXBlIH0gZnJvbSAnLi9zZXJ2aWNlL3NsaWRlci9zbGlkZXItbW92ZS10eXBlLmVudW0nO1xyXG5pbXBvcnQgeyBTbGlkZXJTZXJ2aWNlIH0gZnJvbSAnLi9zZXJ2aWNlL3NsaWRlci9zbGlkZXIuc2VydmljZSc7XHJcbmltcG9ydCB7IFNsaWRlclR5cGUgfSBmcm9tICcuL3NsaWRlci10eXBlLmVudW0nO1xyXG5pbXBvcnQgeyBmYVBhdXNlQ2lyY2xlLCBmYVBsYXlDaXJjbGUsIEljb25EZWZpbml0aW9uIH0gZnJvbSAnQGZvcnRhd2Vzb21lL2ZyZWUtc29saWQtc3ZnLWljb25zJztcclxuaW1wb3J0IHsgUmVzaXplU2VydmljZSwgSW1hZ2VMb2FkU2VydmljZSB9IGZyb20gJ25neC1zZmMtY29tbW9uJztcclxuXHJcbkBDb21wb25lbnQoe1xyXG4gIHNlbGVjdG9yOiAnc2ZjLXNsaWRlcicsXHJcbiAgdGVtcGxhdGVVcmw6ICcuL3NsaWRlci5jb21wb25lbnQuaHRtbCcsXHJcbiAgc3R5bGVVcmxzOiBbJy4vc2xpZGVyLmNvbXBvbmVudC5zY3NzJ10sXHJcbiAgcHJvdmlkZXJzOiBbU2xpZGVyU2VydmljZSwgU2xpZGVyQXV0b21hdGljU2VydmljZV1cclxufSlcclxuZXhwb3J0IGNsYXNzIFNsaWRlckNvbXBvbmVudCBpbXBsZW1lbnRzIEFmdGVyVmlld0luaXQsIEFmdGVyVmlld0NoZWNrZWQge1xyXG5cclxuICBwcml2YXRlIHJlYWRvbmx5IFNJWkVfRkFDVE9SID0gMC4wMDIyNTtcclxuXHJcbiAgcHJpdmF0ZSByZWFkb25seSBQQVVTRV9JQ09OID0gZmFQYXVzZUNpcmNsZTtcclxuXHJcbiAgcHJpdmF0ZSByZWFkb25seSBQTEFZX0lDT04gPSBmYVBsYXlDaXJjbGU7XHJcblxyXG4gIFNsaWRlckJ1dHRvblR5cGUgPSBTbGlkZXJCdXR0b25UeXBlO1xyXG5cclxuICBTbGlkZXJNb3ZlVHlwZSA9IFNsaWRlck1vdmVUeXBlO1xyXG5cclxuICBASW5wdXQoKVxyXG4gIGl0ZW1zOiBJU2xpZGVySXRlbU1vZGVsW10gPSBbXTtcclxuXHJcbiAgQElucHV0KClcclxuICB0eXBlOiBTbGlkZXJUeXBlID0gU2xpZGVyVHlwZS5EZWZhdWx0O1xyXG5cclxuICBASW5wdXQoKVxyXG4gIHNob3dDb3VudDogYm9vbGVhbiA9IHRydWU7XHJcblxyXG4gIEBJbnB1dCgpXHJcbiAgcGFnaW5hdGlvbjogYm9vbGVhbiA9IHRydWU7XHJcblxyXG4gIEBJbnB1dCgpXHJcbiAgaGFuZGxlcnM6IGJvb2xlYW4gPSB0cnVlO1xyXG5cclxuICBASW5wdXQoKVxyXG4gIHNob3dBdXRvbWF0aWNUb2dnbGU6IGJvb2xlYW4gPSB0cnVlO1xyXG5cclxuICBAVmlld0NoaWxkcmVuKFNsaWRlckl0ZW1Db21wb25lbnQpXHJcbiAgcHJpdmF0ZSBzbGlkZXJJdGVtcyE6IFF1ZXJ5TGlzdDxTbGlkZXJJdGVtQ29tcG9uZW50PjtcclxuXHJcbiAgLyoqXHJcbiAgICogSWYgYWN0aXZlIHNob3cgYnV0dG9uc1xyXG4gICAqL1xyXG4gIGFjdGl2ZTogYm9vbGVhbiA9IGZhbHNlO1xyXG5cclxuICBwdWJsaWMgdm0kITogT2JzZXJ2YWJsZTxhbnk+O1xyXG5cclxuICBASG9zdExpc3RlbmVyKCdtb3VzZWVudGVyJylcclxuICBvbkVudGVyKCkge1xyXG4gICAgdGhpcy5hY3RpdmUgPSB0cnVlO1xyXG5cclxuICAgIC8vIHN0b3AgYXV0b21hdGljIG1vdmUgb24gaG92ZXJcclxuICAgIGlmICh0aGlzLmlzQXV0b21hdGljKVxyXG4gICAgICB0aGlzLmF1dG9tYXRpY1NlcnZpY2Uuc3RvcCgpO1xyXG4gIH1cclxuXHJcbiAgQEhvc3RMaXN0ZW5lcignbW91c2VsZWF2ZScpXHJcbiAgb25MZWF2ZSgpIHtcclxuICAgIHRoaXMuYWN0aXZlID0gZmFsc2U7XHJcblxyXG4gICAgLy8gc3RhcnQgYXV0b21hdGljIG1vdmUgb24gaG92ZXIgZW5kXHJcbiAgICBpZiAodGhpcy5pc0F1dG9tYXRpYyAmJiAhdGhpcy5hdXRvbWF0aWNTZXJ2aWNlLnBhdXNlKVxyXG4gICAgICB0aGlzLmF1dG9tYXRpY1NlcnZpY2Uuc3RhcnQoKTtcclxuICB9XHJcblxyXG4gIEBWaWV3Q2hpbGQoJ2l0ZW1zQ29udGFpbmVyJylcclxuICBwcml2YXRlIGl0ZW1zRWwhOiBFbGVtZW50UmVmO1xyXG5cclxuICBASG9zdEJpbmRpbmcoJ3N0eWxlLmZvbnQtc2l6ZS5lbScpXHJcbiAgcHJpdmF0ZSBfc2l6ZUZhY3RvcjogbnVtYmVyID0gMTtcclxuXHJcbiAgQEhvc3RCaW5kaW5nKCdzdHlsZS5tYXgtd2lkdGgucHgnKVxyXG4gIHByaXZhdGUgX21heFdpZHRoITogbnVtYmVyO1xyXG5cclxuICBnZXQgaXNBdXRvbWF0aWMoKSB7XHJcbiAgICByZXR1cm4gdGhpcy50eXBlID09IFNsaWRlclR5cGUuQXV0b21hdGljO1xyXG4gIH1cclxuXHJcbiAgZ2V0IGF1dG9tYXRpY0ljb24oKTogSWNvbkRlZmluaXRpb24ge1xyXG4gICAgcmV0dXJuIHRoaXMuYXV0b21hdGljU2VydmljZS5wYXVzZSA/IHRoaXMuUExBWV9JQ09OIDogdGhpcy5QQVVTRV9JQ09OO1xyXG4gIH1cclxuXHJcbiAgY29uc3RydWN0b3IocHVibGljIHNsaWRlclNlcnZpY2U6IFNsaWRlclNlcnZpY2UsXHJcbiAgICBwcml2YXRlIGF1dG9tYXRpY1NlcnZpY2U6IFNsaWRlckF1dG9tYXRpY1NlcnZpY2UsXHJcbiAgICBwcml2YXRlIHJlc2l6ZVNlcnZpY2U6IFJlc2l6ZVNlcnZpY2UsXHJcbiAgICBwdWJsaWMgaW1hZ2VMb2FkU2VydmljZTogSW1hZ2VMb2FkU2VydmljZSxcclxuICAgIHByaXZhdGUgY2hhbmdlRGV0ZWN0b3I6IENoYW5nZURldGVjdG9yUmVmKSB7IH1cclxuXHJcbiAgbmdBZnRlclZpZXdJbml0KCk6IHZvaWQge1xyXG4gICAgY29uc3QgY291bnQkID0gdGhpcy5zbGlkZXJJdGVtcy5jaGFuZ2VzLnBpcGUobWFwKGMgPT4gYy5sZW5ndGgpKTtcclxuICAgIHRoaXMuc2xpZGVyU2VydmljZS5pbml0KGNvdW50JCk7XHJcblxyXG4gICAgdGhpcy52bSQgPSB0aGlzLnNsaWRlclNlcnZpY2UubW9kZWwkLnBpcGUoXHJcbiAgICAgIG1hcChtb2RlbCA9PiB7XHJcbiAgICAgICAgcmV0dXJuIHtcclxuICAgICAgICAgIGluZGV4OiBtb2RlbC5pbmRleCxcclxuICAgICAgICAgIGxhYmVsOiBgJHttb2RlbC5jb3VudCA+IDAgPyBtb2RlbC5pbmRleCArIDEgOiAwfSAvICR7bW9kZWwuY291bnR9YCxcclxuICAgICAgICAgIGNvdW50OiBtb2RlbC5jb3VudFxyXG4gICAgICAgIH1cclxuICAgICAgfSlcclxuICAgICk7XHJcblxyXG4gICAgaWYgKHRoaXMuaXNBdXRvbWF0aWMpXHJcbiAgICAgIHRoaXMuYXV0b21hdGljU2VydmljZS5zdGFydCgpO1xyXG5cclxuICAgIHRoaXMuaW1hZ2VMb2FkU2VydmljZS5sb2FkJC5zdWJzY3JpYmUoKHNpemVFdmVudDogYW55KSA9PiB7XHJcbiAgICAgIHRoaXMuX3NpemVGYWN0b3IgPSB0aGlzLmdldFNpemVGYWN0b3Ioc2l6ZUV2ZW50Lm9mZnNldC5oZWlnaHQpO1xyXG4gICAgICB0aGlzLl9tYXhXaWR0aCA9IHNpemVFdmVudC5uYXR1cmFsLndpZHRoO1xyXG4gICAgfSk7XHJcblxyXG4gICAgdGhpcy5yZXNpemVTZXJ2aWNlLm9uUmVzaXplJC5zdWJzY3JpYmUoKCkgPT4gdGhpcy5fc2l6ZUZhY3RvciA9IHRoaXMuZ2V0U2l6ZUZhY3Rvcih0aGlzLml0ZW1zRWwubmF0aXZlRWxlbWVudC5vZmZzZXRIZWlnaHQpKTtcclxuXHJcbiAgICB0aGlzLmNoYW5nZURldGVjdG9yLmRldGVjdENoYW5nZXMoKTtcclxuICB9XHJcblxyXG4gIG5nQWZ0ZXJWaWV3Q2hlY2tlZCgpIHtcclxuICAgIHRoaXMuY2hhbmdlRGV0ZWN0b3IuZGV0ZWN0Q2hhbmdlcygpO1xyXG4gIH1cclxuXHJcbiAgbW92ZSh0eXBlOiBTbGlkZXJNb3ZlVHlwZSk6IHZvaWQge1xyXG4gICAgdGhpcy5zbGlkZXJTZXJ2aWNlLm1vdmUodHlwZSk7XHJcbiAgfVxyXG5cclxuICBzZWxlY3QoaW5kZXg6IG51bWJlcik6IHZvaWQge1xyXG4gICAgdGhpcy5zbGlkZXJTZXJ2aWNlLnNlbGVjdChpbmRleCk7XHJcbiAgfVxyXG5cclxuICB0b2dnbGVBdXRvbWF0aWMoKTogdm9pZCB7XHJcbiAgICB0aGlzLmF1dG9tYXRpY1NlcnZpY2UudG9nZ2xlKCk7XHJcbiAgfVxyXG5cclxuICBwcml2YXRlIGdldFNpemVGYWN0b3IodmFsdWU6IG51bWJlcikge1xyXG4gICAgcmV0dXJuIHZhbHVlICogdGhpcy5TSVpFX0ZBQ1RPUjtcclxuICB9XHJcbn0iLCI8ZGl2IGNsYXNzPVwiY29udGFpbmVyXCIgKm5nSWY9XCJ2bSQgfCBhc3luYyBhcyB2bVwiPlxyXG4gICAgPGRpdiAjaXRlbXNDb250YWluZXIgY2xhc3M9XCJpdGVtc1wiPlxyXG4gICAgICAgIDxzZmMtc2xpZGVyLWl0ZW0gKm5nRm9yPVwibGV0IGl0ZW0gb2YgaXRlbXM7IGxldCBpdGVtSW5kZXggPSBpbmRleDtcIiBbbW9kZWxdPVwiaXRlbVwiXHJcbiAgICAgICAgICAgIFtzZmNTaG93SGlkZUVsZW1lbnRdPVwiaXRlbUluZGV4ID09PSB2bS5pbmRleFwiPjwvc2ZjLXNsaWRlci1pdGVtPlxyXG4gICAgPC9kaXY+XHJcblxyXG4gICAgPGRpdiAqbmdJZj1cImhhbmRsZXJzXCIgY2xhc3M9XCJidXR0b25zXCI+XHJcbiAgICAgICAgPHNmYy1zbGlkZXItYnV0dG9uIFthY3RpdmVdPVwiYWN0aXZlXCIgW3R5cGVdPVwiU2xpZGVyQnV0dG9uVHlwZS5OZXh0XCIgKGNsaWNrKT1cIm1vdmUoU2xpZGVyTW92ZVR5cGUuTmV4dClcIj5cclxuICAgICAgICA8L3NmYy1zbGlkZXItYnV0dG9uPlxyXG4gICAgICAgIDxzZmMtc2xpZGVyLWJ1dHRvbiBbYWN0aXZlXT1cImFjdGl2ZVwiIFt0eXBlXT1cIlNsaWRlckJ1dHRvblR5cGUuUHJldmlvdXNcIiAoY2xpY2spPVwibW92ZShTbGlkZXJNb3ZlVHlwZS5QcmV2aW91cylcIj5cclxuICAgICAgICA8L3NmYy1zbGlkZXItYnV0dG9uPlxyXG4gICAgPC9kaXY+XHJcblxyXG4gICAgPGRpdiBjbGFzcz1cImNvdW50ZXJcIiAqbmdJZj1cInNob3dDb3VudFwiPnt7dm0ubGFiZWx9fTwvZGl2PlxyXG5cclxuICAgIDxkaXYgY2xhc3M9XCJhY3Rpb25zXCI+XHJcbiAgICAgICAgPHNmYy1zbGlkZXItcGFnaW5hdGlvbiAqbmdJZj1cInBhZ2luYXRpb25cIiBbY291bnRdPVwidm0uY291bnRcIiBbaW5kZXhdPVwidm0uaW5kZXhcIiAoc2VsZWN0ZWQpPVwic2VsZWN0KCRldmVudClcIj5cclxuICAgICAgICA8L3NmYy1zbGlkZXItcGFnaW5hdGlvbj5cclxuXHJcbiAgICAgICAgPGRpdiAqbmdJZj1cImlzQXV0b21hdGljICYmIHNob3dBdXRvbWF0aWNUb2dnbGVcIiBjbGFzcz1cImF1dG9tYXRpY1wiIChjbGljayk9XCJ0b2dnbGVBdXRvbWF0aWMoKVwiPlxyXG4gICAgICAgICAgICA8ZmEtaWNvbiBbaWNvbl09XCJhdXRvbWF0aWNJY29uXCI+PC9mYS1pY29uPlxyXG4gICAgICAgIDwvZGl2PlxyXG4gICAgPC9kaXY+XHJcbjwvZGl2PiJdfQ==

package/esm2020/lib/components/table/table.component.mjs

@@ -201,7 +201,7 @@ export class TableComponent {
     }
 }
 TableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: TableComponent, deps: [{ token: WINDOW }, { token: i1.PaginationService }, { token: i2.TableSelectService }, { token: i1.SortingService }, { token: i0.ChangeDetectorRef }, { token: i1.ResizeService }, { token: i3.ColumnsToggleService }, { token: i0.IterableDiffers }], target: i0.ɵɵFactoryTarget.Component });
-TableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: TableComponent, selector: "sfc-table", inputs: { position: "position", delimeter: "delimeter", dataType: "dataType", dataToggle: "dataToggle", showColumns: "showColumns", pagination: "pagination", sequence: "sequence", expanded: "expanded", selectable: "selectable", selectOnClick: "selectOnClick", columnContent: "columnContent", rowContent: "rowContent", cardContent: "cardContent", data: "data", data$: "data$", columns: "columns" }, host: { properties: { "class": "this.dataType" } }, providers: [PaginationService, SortingService, TableSelectService, ColumnsToggleService, ResizeService], queries: [{ propertyName: "templates", predicate: TemplateReferenceDirective, read: TemplateReferenceDirective }], ngImport: i0, template: "<div class=\"container\" *ngIf=\"vm$ | async as vm\">\r\n    <div class=\"columns-container\">\r\n        <div class=\"columns-actions\">\r\n            <sfc-columns-toggle *ngIf=\"showColumns\"></sfc-columns-toggle>\r\n            <sfc-toggle-switcher *ngIf=\"dataToggle\" [active]=\"dataType === TableDataType.Cards\"\r\n                [leftModel]=\"Constants.TOGGLE_SWITCHER_LEFT_MODEL\" [rightModel]=\"Constants.TOGGLE_SWITCHER_RIGHT_MODEL\"\r\n                (click)=\"onDataTypeToggle()\">\r\n            </sfc-toggle-switcher>\r\n        </div>\r\n\r\n        <div *ngIf=\"vm.showColumns\" class=\"columns\">\r\n            <div class=\"column\" [ngStyle]=\"vm.columnStyle\" *ngFor=\"let column of vm.columns\">\r\n                <ng-container [ngSwitch]=\"column.type\">\r\n                    <sfc-selectable-table-column *ngSwitchCase=\"TableColumnType.Selectable\"\r\n                        [selected]=\"allRowsSelected\">\r\n                    </sfc-selectable-table-column>\r\n\r\n                    <sfc-sorting *ngSwitchDefault [model]=\"column.sorting\" [id]=\"column.field\">\r\n\r\n                        <sfc-template-content [referenceContent]=\"columnContent\" [templatesContent]=\"templates\"\r\n                            [templateType]=\"TableTemplate.Column\" [defaultContent]=\"defaultColumn\"\r\n                            [contextData]=\"column\">\r\n                        </sfc-template-content>\r\n\r\n                        <ng-template #defaultColumn>\r\n                            <sfc-default-table-column [model]=\"column\"></sfc-default-table-column>\r\n                        </ng-template>\r\n\r\n                    </sfc-sorting>\r\n                </ng-container>\r\n            </div>\r\n        </div>\r\n    </div>\r\n\r\n    <sfc-delimeter *ngIf=\"delimeter\"></sfc-delimeter>\r\n\r\n    <div class=\"rows-container\">\r\n        <div class=\"row\" *ngFor=\"let item of vm.data\">\r\n\r\n            <ng-container [ngSwitch]=\"dataType\">\r\n                <sfc-template-content *ngSwitchCase=\"TableDataType.Rows\" [referenceContent]=\"rowContent\"\r\n                    [templatesContent]=\"templates\" [templateType]=\"TableTemplate.Row\" [defaultContent]=\"defaultRow\"\r\n                    [contextData]=\"{model: item, columns: vm.columns, columnWidth: vm.columnWidth, position: position}\">\r\n                </sfc-template-content>\r\n\r\n                <ng-template #defaultRow>\r\n                    <sfc-default-table-row [columns]=\"vm.columns\" [model]=\"item\" [position]=\"position\"\r\n                        [columnWidth]=\"vm.columnWidth\" [selectOnClick]=\"selectOnClick\" (selected)=\"selectRow($event)\">\r\n                    </sfc-default-table-row>\r\n                </ng-template>\r\n\r\n                <sfc-template-content *ngSwitchCase=\"TableDataType.Cards\" [referenceContent]=\"cardContent\"\r\n                    [templatesContent]=\"templates\" [templateType]=\"TableTemplate.Card\" [defaultContent]=\"defaultCard\"\r\n                    [contextData]=\"{model: item, columns: vm.columns}\">\r\n                </sfc-template-content>\r\n\r\n                <ng-template #defaultCard>\r\n                    <sfc-default-table-card [columns]=\"vm.columns\" [model]=\"item\" [selectOnClick]=\"selectOnClick\"\r\n                        (selected)=\"selectRow($event)\">\r\n                    </sfc-default-table-card>\r\n                </ng-template>\r\n            </ng-container>\r\n        </div>\r\n    </div>\r\n\r\n    <div class=\"pagination-container\">\r\n        <sfc-pagination *ngIf=\"pagination.enabled\" [limits]=\"false\" [full]=\"false\" [data$]=\"data$\"></sfc-pagination>\r\n    </div>\r\n</div>", styles: [":host .container{display:block;margin:2em auto;width:90%}:host .container .columns-container{display:flex;flex-flow:row wrap;transition:.5s;justify-content:space-between}:host .container .columns-container .columns-actions{display:flex;align-items:center;width:100%}:host .container .columns-container .columns-actions sfc-toggle-switcher{margin-left:auto}:host .container .columns-container .columns{text-align:center;padding:.5em;width:100%;display:flex;flex-flow:row wrap}:host .container .columns-container .columns .column{text-align:center;padding:.5em;display:flex;align-items:center;justify-content:center;box-sizing:border-box}:host .container .rows-container{display:flex;flex-wrap:wrap;justify-content:center;transition:.5s;gap:1em;margin-block:1em 2em}:host .container .rows-container .row{display:contents}\n"], dependencies: [{ kind: "directive", type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i4.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i4.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i4.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "component", type: i1.DelimeterComponent, selector: "sfc-delimeter", inputs: ["direction"] }, { kind: "component", type: i1.TemplateContentComponent, selector: "sfc-template-content", inputs: ["contextData", "referenceContent", "templateType", "templatesContent", "defaultContent"] }, { kind: "component", type: i1.ToggleSwitcherComponent, selector: "sfc-toggle-switcher", inputs: ["active", "disabled", "leftModel", "rightModel"] }, { kind: "component", type: i1.PaginationComponent, selector: "sfc-pagination", inputs: ["count", "full", "limits", "data$"] }, { kind: "component", type: i1.SortingComponent, selector: "sfc-sorting", inputs: ["id", "model"] }, { kind: "component", type: i5.DefaultTableColumnComponent, selector: "sfc-default-table-column", inputs: ["model"] }, { kind: "component", type: i6.SelectableTableColumnComponent, selector: "sfc-selectable-table-column", inputs: ["selected"] }, { kind: "component", type: i7.ColumnsToggleComponent, selector: "sfc-columns-toggle" }, { kind: "component", type: i8.DefaultTableRowComponent, selector: "sfc-default-table-row" }, { kind: "component", type: i9.DefaultTableCardComponent, selector: "sfc-default-table-card" }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }] });
+TableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: TableComponent, selector: "sfc-table", inputs: { position: "position", delimeter: "delimeter", dataType: "dataType", dataToggle: "dataToggle", showColumns: "showColumns", pagination: "pagination", sequence: "sequence", expanded: "expanded", selectable: "selectable", selectOnClick: "selectOnClick", columnContent: "columnContent", rowContent: "rowContent", cardContent: "cardContent", data: "data", data$: "data$", columns: "columns" }, host: { properties: { "class": "this.dataType" } }, providers: [PaginationService, SortingService, TableSelectService, ColumnsToggleService, ResizeService], queries: [{ propertyName: "templates", predicate: TemplateReferenceDirective, read: TemplateReferenceDirective }], ngImport: i0, template: "<div class=\"container\" *ngIf=\"vm$ | async as vm\">\r\n    <div class=\"columns-container\">\r\n        <div class=\"columns-actions\">\r\n            <sfc-columns-toggle *ngIf=\"showColumns\"></sfc-columns-toggle>\r\n            <sfc-toggle-switcher *ngIf=\"dataToggle\" [active]=\"dataType === TableDataType.Cards\"\r\n                [leftModel]=\"Constants.TOGGLE_SWITCHER_LEFT_MODEL\" [rightModel]=\"Constants.TOGGLE_SWITCHER_RIGHT_MODEL\"\r\n                (click)=\"onDataTypeToggle()\">\r\n            </sfc-toggle-switcher>\r\n        </div>\r\n\r\n        <div *ngIf=\"vm.showColumns\" class=\"columns\">\r\n            <div class=\"column\" [ngStyle]=\"vm.columnStyle\" *ngFor=\"let column of vm.columns\">\r\n                <ng-container [ngSwitch]=\"column.type\">\r\n                    <sfc-selectable-table-column *ngSwitchCase=\"TableColumnType.Selectable\"\r\n                        [selected]=\"allRowsSelected\">\r\n                    </sfc-selectable-table-column>\r\n\r\n                    <sfc-sorting *ngSwitchDefault [model]=\"column.sorting\" [id]=\"column.field\">\r\n\r\n                        <sfc-template-content [referenceContent]=\"columnContent\" [templatesContent]=\"templates\"\r\n                            [templateType]=\"TableTemplate.Column\" [defaultContent]=\"defaultColumn\"\r\n                            [contextData]=\"column\">\r\n                        </sfc-template-content>\r\n\r\n                        <ng-template #defaultColumn>\r\n                            <sfc-default-table-column [model]=\"column\"></sfc-default-table-column>\r\n                        </ng-template>\r\n\r\n                    </sfc-sorting>\r\n                </ng-container>\r\n            </div>\r\n        </div>\r\n    </div>\r\n\r\n    <sfc-delimeter *ngIf=\"delimeter\"></sfc-delimeter>\r\n\r\n    <div class=\"rows-container\">\r\n        <div class=\"row\" *ngFor=\"let item of vm.data\">\r\n\r\n            <ng-container [ngSwitch]=\"dataType\">\r\n                <sfc-template-content *ngSwitchCase=\"TableDataType.Rows\" [referenceContent]=\"rowContent\"\r\n                    [templatesContent]=\"templates\" [templateType]=\"TableTemplate.Row\" [defaultContent]=\"defaultRow\"\r\n                    [contextData]=\"{model: item, columns: vm.columns, columnWidth: vm.columnWidth, position: position}\">\r\n                </sfc-template-content>\r\n\r\n                <ng-template #defaultRow>\r\n                    <sfc-default-table-row [columns]=\"vm.columns\" [model]=\"item\" [position]=\"position\"\r\n                        [columnWidth]=\"vm.columnWidth\" [selectOnClick]=\"selectOnClick\" (selected)=\"selectRow($event)\">\r\n                    </sfc-default-table-row>\r\n                </ng-template>\r\n\r\n                <sfc-template-content *ngSwitchCase=\"TableDataType.Cards\" [referenceContent]=\"cardContent\"\r\n                    [templatesContent]=\"templates\" [templateType]=\"TableTemplate.Card\" [defaultContent]=\"defaultCard\"\r\n                    [contextData]=\"{model: item, columns: vm.columns}\">\r\n                </sfc-template-content>\r\n\r\n                <ng-template #defaultCard>\r\n                    <sfc-default-table-card [columns]=\"vm.columns\" [model]=\"item\" [selectOnClick]=\"selectOnClick\"\r\n                        (selected)=\"selectRow($event)\">\r\n                    </sfc-default-table-card>\r\n                </ng-template>\r\n            </ng-container>\r\n        </div>\r\n    </div>\r\n\r\n    <div class=\"pagination-container\">\r\n        <sfc-pagination *ngIf=\"pagination.enabled\" [limits]=\"false\" [full]=\"false\" [data$]=\"data$\"></sfc-pagination>\r\n    </div>\r\n</div>", styles: [":host .container{display:block;margin:2em auto;width:90%}:host .container .columns-container{display:flex;flex-flow:row wrap;transition:.5s;justify-content:space-between}:host .container .columns-container .columns-actions{display:flex;align-items:center;width:100%}:host .container .columns-container .columns-actions sfc-toggle-switcher{margin-left:auto}:host .container .columns-container .columns{text-align:center;padding:.5em;width:100%;display:flex;flex-flow:row wrap}:host .container .columns-container .columns .column{text-align:center;padding:.5em;display:flex;align-items:center;justify-content:center;box-sizing:border-box}:host .container .rows-container{display:flex;flex-wrap:wrap;justify-content:center;transition:.5s;gap:1em;margin-block:1em 2em}:host .container .rows-container .row{display:contents}\n"], dependencies: [{ kind: "directive", type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i4.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i4.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i4.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "component", type: i1.DelimeterComponent, selector: "sfc-delimeter", inputs: ["label", "direction"] }, { kind: "component", type: i1.TemplateContentComponent, selector: "sfc-template-content", inputs: ["contextData", "referenceContent", "templateType", "templatesContent", "defaultContent"] }, { kind: "component", type: i1.ToggleSwitcherComponent, selector: "sfc-toggle-switcher", inputs: ["active", "disabled", "leftModel", "rightModel"] }, { kind: "component", type: i1.PaginationComponent, selector: "sfc-pagination", inputs: ["count", "full", "limits", "data$"] }, { kind: "component", type: i1.SortingComponent, selector: "sfc-sorting", inputs: ["id", "model"] }, { kind: "component", type: i5.DefaultTableColumnComponent, selector: "sfc-default-table-column", inputs: ["model"] }, { kind: "component", type: i6.SelectableTableColumnComponent, selector: "sfc-selectable-table-column", inputs: ["selected"] }, { kind: "component", type: i7.ColumnsToggleComponent, selector: "sfc-columns-toggle" }, { kind: "component", type: i8.DefaultTableRowComponent, selector: "sfc-default-table-row" }, { kind: "component", type: i9.DefaultTableCardComponent, selector: "sfc-default-table-card" }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: TableComponent, decorators: [{
             type: Component,
             args: [{ selector: 'sfc-table', providers: [PaginationService, SortingService, TableSelectService, ColumnsToggleService, ResizeService], template: "<div class=\"container\" *ngIf=\"vm$ | async as vm\">\r\n    <div class=\"columns-container\">\r\n        <div class=\"columns-actions\">\r\n            <sfc-columns-toggle *ngIf=\"showColumns\"></sfc-columns-toggle>\r\n            <sfc-toggle-switcher *ngIf=\"dataToggle\" [active]=\"dataType === TableDataType.Cards\"\r\n                [leftModel]=\"Constants.TOGGLE_SWITCHER_LEFT_MODEL\" [rightModel]=\"Constants.TOGGLE_SWITCHER_RIGHT_MODEL\"\r\n                (click)=\"onDataTypeToggle()\">\r\n            </sfc-toggle-switcher>\r\n        </div>\r\n\r\n        <div *ngIf=\"vm.showColumns\" class=\"columns\">\r\n            <div class=\"column\" [ngStyle]=\"vm.columnStyle\" *ngFor=\"let column of vm.columns\">\r\n                <ng-container [ngSwitch]=\"column.type\">\r\n                    <sfc-selectable-table-column *ngSwitchCase=\"TableColumnType.Selectable\"\r\n                        [selected]=\"allRowsSelected\">\r\n                    </sfc-selectable-table-column>\r\n\r\n                    <sfc-sorting *ngSwitchDefault [model]=\"column.sorting\" [id]=\"column.field\">\r\n\r\n                        <sfc-template-content [referenceContent]=\"columnContent\" [templatesContent]=\"templates\"\r\n                            [templateType]=\"TableTemplate.Column\" [defaultContent]=\"defaultColumn\"\r\n                            [contextData]=\"column\">\r\n                        </sfc-template-content>\r\n\r\n                        <ng-template #defaultColumn>\r\n                            <sfc-default-table-column [model]=\"column\"></sfc-default-table-column>\r\n                        </ng-template>\r\n\r\n                    </sfc-sorting>\r\n                </ng-container>\r\n            </div>\r\n        </div>\r\n    </div>\r\n\r\n    <sfc-delimeter *ngIf=\"delimeter\"></sfc-delimeter>\r\n\r\n    <div class=\"rows-container\">\r\n        <div class=\"row\" *ngFor=\"let item of vm.data\">\r\n\r\n            <ng-container [ngSwitch]=\"dataType\">\r\n                <sfc-template-content *ngSwitchCase=\"TableDataType.Rows\" [referenceContent]=\"rowContent\"\r\n                    [templatesContent]=\"templates\" [templateType]=\"TableTemplate.Row\" [defaultContent]=\"defaultRow\"\r\n                    [contextData]=\"{model: item, columns: vm.columns, columnWidth: vm.columnWidth, position: position}\">\r\n                </sfc-template-content>\r\n\r\n                <ng-template #defaultRow>\r\n                    <sfc-default-table-row [columns]=\"vm.columns\" [model]=\"item\" [position]=\"position\"\r\n                        [columnWidth]=\"vm.columnWidth\" [selectOnClick]=\"selectOnClick\" (selected)=\"selectRow($event)\">\r\n                    </sfc-default-table-row>\r\n                </ng-template>\r\n\r\n                <sfc-template-content *ngSwitchCase=\"TableDataType.Cards\" [referenceContent]=\"cardContent\"\r\n                    [templatesContent]=\"templates\" [templateType]=\"TableTemplate.Card\" [defaultContent]=\"defaultCard\"\r\n                    [contextData]=\"{model: item, columns: vm.columns}\">\r\n                </sfc-template-content>\r\n\r\n                <ng-template #defaultCard>\r\n                    <sfc-default-table-card [columns]=\"vm.columns\" [model]=\"item\" [selectOnClick]=\"selectOnClick\"\r\n                        (selected)=\"selectRow($event)\">\r\n                    </sfc-default-table-card>\r\n                </ng-template>\r\n            </ng-container>\r\n        </div>\r\n    </div>\r\n\r\n    <div class=\"pagination-container\">\r\n        <sfc-pagination *ngIf=\"pagination.enabled\" [limits]=\"false\" [full]=\"false\" [data$]=\"data$\"></sfc-pagination>\r\n    </div>\r\n</div>", styles: [":host .container{display:block;margin:2em auto;width:90%}:host .container .columns-container{display:flex;flex-flow:row wrap;transition:.5s;justify-content:space-between}:host .container .columns-container .columns-actions{display:flex;align-items:center;width:100%}:host .container .columns-container .columns-actions sfc-toggle-switcher{margin-left:auto}:host .container .columns-container .columns{text-align:center;padding:.5em;width:100%;display:flex;flex-flow:row wrap}:host .container .columns-container .columns .column{text-align:center;padding:.5em;display:flex;align-items:center;justify-content:center;box-sizing:border-box}:host .container .rows-container{display:flex;flex-wrap:wrap;justify-content:center;transition:.5s;gap:1em;margin-block:1em 2em}:host .container .rows-container .row{display:contents}\n"] }]