ngx-sfc-common 0.0.24 → 0.0.26

package/fesm2020/ngx-sfc-common.mjs

@@ -2597,6 +2597,29 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImpor
                 type: Input
             }] } });
 
+class DotComponent {
+    constructor() {
+        this.active = false;
+        this.disabled = false;
+    }
+}
+DotComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: DotComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+DotComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: DotComponent, selector: "sfc-dot", inputs: { active: "active", disabled: "disabled" }, host: { properties: { "class.active": "this.active", "class.disabled": "this.disabled" } }, ngImport: i0, template: ``, isInline: true, styles: [":host{display:inline-block;width:.6em;height:.6em;border-radius:50%;transition:background-color .5s ease}:host,:host-context(.sfc-default-theme) :host{background-color:#545e61}:host-context(.sfc-dark-theme) :host{background-color:#fff}:host.active{background-color:#ffce54}:host.disabled:not(.active){background-color:#bdbdbd}\n"] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: DotComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'sfc-dot', template: ``, styles: [":host{display:inline-block;width:.6em;height:.6em;border-radius:50%;transition:background-color .5s ease}:host,:host-context(.sfc-default-theme) :host{background-color:#545e61}:host-context(.sfc-dark-theme) :host{background-color:#fff}:host.active{background-color:#ffce54}:host.disabled:not(.active){background-color:#bdbdbd}\n"] }]
+        }], propDecorators: { active: [{
+                type: Input
+            }, {
+                type: HostBinding,
+                args: ['class.' + UIClass.Active]
+            }], disabled: [{
+                type: Input
+            }, {
+                type: HostBinding,
+                args: ['class.' + UIClass.Disabled]
+            }] } });
+
 class DotsComponent {
     constructor() {
         this.open = false;
@@ -2605,10 +2628,10 @@ class DotsComponent {
     }
 }
 DotsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: DotsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-DotsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: DotsComponent, selector: "sfc-dots", inputs: { open: "open", direction: "direction" }, host: { listeners: { "click": "onClick()" }, properties: { "class.open": "this.open", "class": "this.direction" } }, ngImport: i0, template: "<div class=\"container\">\r\n    <div class=\"dots-container\">\r\n        <div class=\"dot\"></div>\r\n        <div class=\"dot\"></div>\r\n        <div class=\"dot\"></div>\r\n    </div>\r\n</div>", styles: [":host{display:inline-flex;transform:rotate(0);transition:all .3s cubic-bezier(.175,.885,.32,1.275);cursor:pointer}:host.open{transform:rotate(90deg)}:host.vertical{transform:rotate(90deg)}:host.vertical.open{transform:rotate(0)}:host .container{display:inline-flex;flex-direction:column;justify-content:center;align-items:center;flex:1;margin:.25em}:host .container .dots-container{display:flex;flex-flow:row wrap;justify-content:center;align-items:center;position:relative}:host .container .dots-container .dot{width:.3125em;height:.3125em;transition:background .5s ease;transition:background .3s ease;margin:.06em;border-radius:50%;display:block}:host .container .dots-container .dot,:host-context(.sfc-default-theme) :host .container .dots-container .dot{background:#545e61}:host-context(.sfc-dark-theme) :host .container .dots-container .dot{background:#fff}:host:hover .container,:host:focus .container{outline:none}:host:hover .container .dots-container .dot,:host:focus .container .dots-container .dot{transition:background .5s ease}:host:hover .container .dots-container .dot,:host-context(.sfc-default-theme) :host:hover .container .dots-container .dot,:host:focus .container .dots-container .dot,:host-context(.sfc-default-theme) :host:focus .container .dots-container .dot{background:#ffce54}:host-context(.sfc-dark-theme) :host:hover .container .dots-container .dot,:host-context(.sfc-dark-theme) :host:focus .container .dots-container .dot{background:#ffce54}\n"] });
+DotsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: DotsComponent, selector: "sfc-dots", inputs: { open: "open", direction: "direction" }, host: { listeners: { "click": "onClick()" }, properties: { "class.open": "this.open", "class": "this.direction" } }, ngImport: i0, template: "<div class=\"container\">\r\n    <div class=\"dots-container\">\r\n        <sfc-dot></sfc-dot>\r\n        <sfc-dot></sfc-dot>\r\n        <sfc-dot></sfc-dot>\r\n    </div>\r\n</div>", styles: [":host{display:inline-flex;transform:rotate(0);transition:all .3s cubic-bezier(.175,.885,.32,1.275);cursor:pointer}:host.open{transform:rotate(90deg)}:host.vertical{transform:rotate(90deg)}:host.vertical.open{transform:rotate(0)}:host .container{display:inline-flex;flex-direction:column;justify-content:center;align-items:center;flex:1;margin:.25em}:host .container .dots-container{display:flex;flex-flow:row wrap;justify-content:center;align-items:center;position:relative}:host .container .dots-container sfc-dot{width:.3125em;height:.3125em;transition:background .5s ease;margin:.06em}:host .container .dots-container sfc-dot,:host-context(.sfc-default-theme) :host .container .dots-container sfc-dot{background:#545e61}:host-context(.sfc-dark-theme) :host .container .dots-container sfc-dot{background:#fff}:host:hover .container,:host:focus .container{outline:none}:host:hover .container .dots-container sfc-dot,:host:focus .container .dots-container sfc-dot{transition:background .5s ease}:host:hover .container .dots-container sfc-dot,:host-context(.sfc-default-theme) :host:hover .container .dots-container sfc-dot,:host:focus .container .dots-container sfc-dot,:host-context(.sfc-default-theme) :host:focus .container .dots-container sfc-dot{background:#ffce54}:host-context(.sfc-dark-theme) :host:hover .container .dots-container sfc-dot,:host-context(.sfc-dark-theme) :host:focus .container .dots-container sfc-dot{background:#ffce54}\n"], dependencies: [{ kind: "component", type: DotComponent, selector: "sfc-dot", inputs: ["active", "disabled"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: DotsComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'sfc-dots', template: "<div class=\"container\">\r\n    <div class=\"dots-container\">\r\n        <div class=\"dot\"></div>\r\n        <div class=\"dot\"></div>\r\n        <div class=\"dot\"></div>\r\n    </div>\r\n</div>", styles: [":host{display:inline-flex;transform:rotate(0);transition:all .3s cubic-bezier(.175,.885,.32,1.275);cursor:pointer}:host.open{transform:rotate(90deg)}:host.vertical{transform:rotate(90deg)}:host.vertical.open{transform:rotate(0)}:host .container{display:inline-flex;flex-direction:column;justify-content:center;align-items:center;flex:1;margin:.25em}:host .container .dots-container{display:flex;flex-flow:row wrap;justify-content:center;align-items:center;position:relative}:host .container .dots-container .dot{width:.3125em;height:.3125em;transition:background .5s ease;transition:background .3s ease;margin:.06em;border-radius:50%;display:block}:host .container .dots-container .dot,:host-context(.sfc-default-theme) :host .container .dots-container .dot{background:#545e61}:host-context(.sfc-dark-theme) :host .container .dots-container .dot{background:#fff}:host:hover .container,:host:focus .container{outline:none}:host:hover .container .dots-container .dot,:host:focus .container .dots-container .dot{transition:background .5s ease}:host:hover .container .dots-container .dot,:host-context(.sfc-default-theme) :host:hover .container .dots-container .dot,:host:focus .container .dots-container .dot,:host-context(.sfc-default-theme) :host:focus .container .dots-container .dot{background:#ffce54}:host-context(.sfc-dark-theme) :host:hover .container .dots-container .dot,:host-context(.sfc-dark-theme) :host:focus .container .dots-container .dot{background:#ffce54}\n"] }]
+            args: [{ selector: 'sfc-dots', template: "<div class=\"container\">\r\n    <div class=\"dots-container\">\r\n        <sfc-dot></sfc-dot>\r\n        <sfc-dot></sfc-dot>\r\n        <sfc-dot></sfc-dot>\r\n    </div>\r\n</div>", styles: [":host{display:inline-flex;transform:rotate(0);transition:all .3s cubic-bezier(.175,.885,.32,1.275);cursor:pointer}:host.open{transform:rotate(90deg)}:host.vertical{transform:rotate(90deg)}:host.vertical.open{transform:rotate(0)}:host .container{display:inline-flex;flex-direction:column;justify-content:center;align-items:center;flex:1;margin:.25em}:host .container .dots-container{display:flex;flex-flow:row wrap;justify-content:center;align-items:center;position:relative}:host .container .dots-container sfc-dot{width:.3125em;height:.3125em;transition:background .5s ease;margin:.06em}:host .container .dots-container sfc-dot,:host-context(.sfc-default-theme) :host .container .dots-container sfc-dot{background:#545e61}:host-context(.sfc-dark-theme) :host .container .dots-container sfc-dot{background:#fff}:host:hover .container,:host:focus .container{outline:none}:host:hover .container .dots-container sfc-dot,:host:focus .container .dots-container sfc-dot{transition:background .5s ease}:host:hover .container .dots-container sfc-dot,:host-context(.sfc-default-theme) :host:hover .container .dots-container sfc-dot,:host:focus .container .dots-container sfc-dot,:host-context(.sfc-default-theme) :host:focus .container .dots-container sfc-dot{background:#ffce54}:host-context(.sfc-dark-theme) :host:hover .container .dots-container sfc-dot,:host-context(.sfc-dark-theme) :host:focus .container .dots-container sfc-dot{background:#ffce54}\n"] }]
         }], propDecorators: { open: [{
                 type: Input
             }, {
@@ -3010,10 +3033,10 @@ class LoadContainerComponent {
     }
 }
 LoadContainerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: LoadContainerComponent, deps: [{ token: LoaderService }, { token: LoadMoreService }, { token: PaginationService }, { token: SortingService }], target: i0.ɵɵFactoryTarget.Component });
-LoadContainerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: LoadContainerComponent, selector: "sfc-load-container", inputs: { id: "id", type: "type", open: "open", loadMore: "loadMore", loadMoreLabel: "loadMoreLabel", showEmpty: "showEmpty", emptyLabel: "emptyLabel", model: "model", scrollTarget: "scrollTarget", paginationCount: "paginationCount", paginationLimits: "paginationLimits", showLoading: "showLoading" }, outputs: { handleError: "handleError", handleSuccess: "handleSuccess", handleLoading: "handleLoading" }, host: { properties: { "class": "this.type", "class.open": "this.open", "class.empty": "this.isEmpty", "class.loading": "this._loading" } }, providers: [LoadMoreService, PaginationService], viewQueries: [{ propertyName: "contentEl", first: true, predicate: ["content"], descendants: true }], ngImport: i0, template: "<div class=\"container\">\r\n    <sfc-bounce-loader *ngIf=\"showLoading\" [id]=\"id\" [sfcComponentSize]=\"ComponentSize.Small\"></sfc-bounce-loader>\r\n    <div #content class=\"content\" [sfcScrollIntoView]=\"scrollTarget\" (sfcScrollTracker)=\"onScroll()\"\r\n        [positions]=\"scrollPosition\">\r\n        <div class=\"items\">\r\n            <ng-content></ng-content>\r\n        </div>\r\n        <div class=\"actions\" (sfcMouseDown)=\"$event.preventDefault()\">\r\n            <sfc-load-more-button [hidden]=\"hideLoadMoreButton\" (more)=\"more($event)\" [label]=\"loadMoreLabel\">\r\n            </sfc-load-more-button>\r\n            <sfc-pagination *ngIf=\"showPagination\" [limits]=\"paginationLimits\" [count]=\"paginationCount\" [full]=\"false\"\r\n                [total]=\"total\" [size]=\"model.pagination?.size!\" [page]=\"page\">\r\n            </sfc-pagination>\r\n            <sfc-delimeter *ngIf=\"isEmpty\" [label]=\"emptyLabel\"></sfc-delimeter>\r\n        </div>\r\n    </div>\r\n</div>", styles: [":host{width:100%;height:inherit;position:relative}:host .container{height:inherit}:host .container .content{cursor:initial;overflow-y:auto;overflow-x:hidden;height:inherit}:host .container .content,:host-context(.sfc-default-theme) :host .container .content{background:#fff}:host-context(.sfc-dark-theme) :host .container .content{background:transparent}:host .container .content sfc-delimeter{font-style:italic;font-weight:700}:host.dropdown .container .content{display:none;opacity:0;max-height:12.5em;box-shadow:0 .125em .125em #00000024,0 .18em .06em -.125em #0000001f,0 .06em .31em #0003}:host.dropdown.open .container .content{display:block;opacity:1}:host ::ng-deep ::-webkit-scrollbar{width:.375em;height:.375em}:host ::ng-deep ::-webkit-scrollbar-track{border-radius:.625em;background:#e9e9e9}:host ::ng-deep ::-webkit-scrollbar-thumb{border-radius:.625em;background:rgba(0,0,0,.2)}:host ::ng-deep ::-webkit-scrollbar-thumb:hover{background:rgba(0,0,0,.4)}:host ::ng-deep ::-webkit-scrollbar-thumb:active{background:rgba(0,0,0,.6)}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: MouseDownDirective, selector: "[sfcMouseDown]", inputs: ["button"], outputs: ["sfcMouseDown"] }, { kind: "directive", type: ComponentSizeDirective, selector: "[sfcComponentSize]", inputs: ["sfcComponentSize", "customSize"] }, { kind: "directive", type: ScrollTrackerDirective, selector: "[sfcScrollTracker]", inputs: ["positions"], outputs: ["sfcScrollTracker"] }, { kind: "directive", type: ScrollIntoViewDirective, selector: "[sfcScrollIntoView]", inputs: ["sfcScrollIntoView", "local", "options"] }, { kind: "component", type: DelimeterComponent, selector: "sfc-delimeter", inputs: ["label", "direction"] }, { kind: "component", type: PaginationComponent, selector: "sfc-pagination", inputs: ["count", "full", "limits", "page", "total", "size"] }, { kind: "component", type: LoadMoreButtonComponent, selector: "sfc-load-more-button", inputs: ["label", "icon"], outputs: ["more"] }, { kind: "component", type: BounceLoaderComponent, selector: "sfc-bounce-loader" }] });
+LoadContainerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: LoadContainerComponent, selector: "sfc-load-container", inputs: { id: "id", type: "type", open: "open", loadMore: "loadMore", loadMoreLabel: "loadMoreLabel", showEmpty: "showEmpty", emptyLabel: "emptyLabel", model: "model", scrollTarget: "scrollTarget", paginationCount: "paginationCount", paginationLimits: "paginationLimits", showLoading: "showLoading" }, outputs: { handleError: "handleError", handleSuccess: "handleSuccess", handleLoading: "handleLoading" }, host: { properties: { "class": "this.type", "class.open": "this.open", "class.empty": "this.isEmpty", "class.loading": "this._loading" } }, providers: [LoadMoreService, PaginationService], viewQueries: [{ propertyName: "contentEl", first: true, predicate: ["content"], descendants: true }], ngImport: i0, template: "<div class=\"container\">\r\n    <sfc-bounce-loader *ngIf=\"showLoading\" [id]=\"id\" [sfcComponentSize]=\"ComponentSize.Small\"></sfc-bounce-loader>\r\n    <div #content class=\"content\" [sfcScrollIntoView]=\"scrollTarget\" (sfcScrollTracker)=\"onScroll()\"\r\n        [positions]=\"scrollPosition\">\r\n        <div class=\"items\">\r\n            <ng-content></ng-content>\r\n        </div>\r\n        <div class=\"actions\" (sfcMouseDown)=\"$event.preventDefault()\">\r\n            <sfc-load-more-button [hidden]=\"hideLoadMoreButton\" (more)=\"more($event)\" [label]=\"loadMoreLabel\">\r\n            </sfc-load-more-button>\r\n            <sfc-pagination *ngIf=\"showPagination\" [limits]=\"paginationLimits\" [count]=\"paginationCount\" [full]=\"false\"\r\n                [total]=\"total\" [size]=\"model.pagination?.size!\" [page]=\"page\">\r\n            </sfc-pagination>\r\n            <sfc-delimeter *ngIf=\"isEmpty\" [label]=\"emptyLabel\"></sfc-delimeter>\r\n        </div>\r\n    </div>\r\n</div>", styles: [":host{width:100%;height:inherit;position:relative}:host .container{height:inherit}:host .container .content{transition:background .5s ease;cursor:initial;overflow-y:auto;overflow-x:hidden;height:inherit}:host .container .content,:host-context(.sfc-default-theme) :host .container .content{background:transparent}:host-context(.sfc-dark-theme) :host .container .content{background:transparent}:host .container .content sfc-delimeter{font-style:italic;font-weight:700}:host.dropdown .container .content{display:none;opacity:0;max-height:12.5em;box-shadow:0 .125em .125em #00000024,0 .18em .06em -.125em #0000001f,0 .06em .31em #0003}:host.dropdown.open .container .content{display:block;opacity:1}:host ::ng-deep ::-webkit-scrollbar{width:.375em;height:.375em}:host ::ng-deep ::-webkit-scrollbar-track{border-radius:.625em;background:#e9e9e9}:host ::ng-deep ::-webkit-scrollbar-thumb{border-radius:.625em;background:rgba(0,0,0,.2)}:host ::ng-deep ::-webkit-scrollbar-thumb:hover{background:rgba(0,0,0,.4)}:host ::ng-deep ::-webkit-scrollbar-thumb:active{background:rgba(0,0,0,.6)}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: MouseDownDirective, selector: "[sfcMouseDown]", inputs: ["button"], outputs: ["sfcMouseDown"] }, { kind: "directive", type: ComponentSizeDirective, selector: "[sfcComponentSize]", inputs: ["sfcComponentSize", "customSize"] }, { kind: "directive", type: ScrollTrackerDirective, selector: "[sfcScrollTracker]", inputs: ["positions"], outputs: ["sfcScrollTracker"] }, { kind: "directive", type: ScrollIntoViewDirective, selector: "[sfcScrollIntoView]", inputs: ["sfcScrollIntoView", "local", "options"] }, { kind: "component", type: DelimeterComponent, selector: "sfc-delimeter", inputs: ["label", "direction"] }, { kind: "component", type: PaginationComponent, selector: "sfc-pagination", inputs: ["count", "full", "limits", "page", "total", "size"] }, { kind: "component", type: LoadMoreButtonComponent, selector: "sfc-load-more-button", inputs: ["label", "icon"], outputs: ["more"] }, { kind: "component", type: BounceLoaderComponent, selector: "sfc-bounce-loader" }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: LoadContainerComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'sfc-load-container', providers: [LoadMoreService, PaginationService], template: "<div class=\"container\">\r\n    <sfc-bounce-loader *ngIf=\"showLoading\" [id]=\"id\" [sfcComponentSize]=\"ComponentSize.Small\"></sfc-bounce-loader>\r\n    <div #content class=\"content\" [sfcScrollIntoView]=\"scrollTarget\" (sfcScrollTracker)=\"onScroll()\"\r\n        [positions]=\"scrollPosition\">\r\n        <div class=\"items\">\r\n            <ng-content></ng-content>\r\n        </div>\r\n        <div class=\"actions\" (sfcMouseDown)=\"$event.preventDefault()\">\r\n            <sfc-load-more-button [hidden]=\"hideLoadMoreButton\" (more)=\"more($event)\" [label]=\"loadMoreLabel\">\r\n            </sfc-load-more-button>\r\n            <sfc-pagination *ngIf=\"showPagination\" [limits]=\"paginationLimits\" [count]=\"paginationCount\" [full]=\"false\"\r\n                [total]=\"total\" [size]=\"model.pagination?.size!\" [page]=\"page\">\r\n            </sfc-pagination>\r\n            <sfc-delimeter *ngIf=\"isEmpty\" [label]=\"emptyLabel\"></sfc-delimeter>\r\n        </div>\r\n    </div>\r\n</div>", styles: [":host{width:100%;height:inherit;position:relative}:host .container{height:inherit}:host .container .content{cursor:initial;overflow-y:auto;overflow-x:hidden;height:inherit}:host .container .content,:host-context(.sfc-default-theme) :host .container .content{background:#fff}:host-context(.sfc-dark-theme) :host .container .content{background:transparent}:host .container .content sfc-delimeter{font-style:italic;font-weight:700}:host.dropdown .container .content{display:none;opacity:0;max-height:12.5em;box-shadow:0 .125em .125em #00000024,0 .18em .06em -.125em #0000001f,0 .06em .31em #0003}:host.dropdown.open .container .content{display:block;opacity:1}:host ::ng-deep ::-webkit-scrollbar{width:.375em;height:.375em}:host ::ng-deep ::-webkit-scrollbar-track{border-radius:.625em;background:#e9e9e9}:host ::ng-deep ::-webkit-scrollbar-thumb{border-radius:.625em;background:rgba(0,0,0,.2)}:host ::ng-deep ::-webkit-scrollbar-thumb:hover{background:rgba(0,0,0,.4)}:host ::ng-deep ::-webkit-scrollbar-thumb:active{background:rgba(0,0,0,.6)}\n"] }]
+            args: [{ selector: 'sfc-load-container', providers: [LoadMoreService, PaginationService], template: "<div class=\"container\">\r\n    <sfc-bounce-loader *ngIf=\"showLoading\" [id]=\"id\" [sfcComponentSize]=\"ComponentSize.Small\"></sfc-bounce-loader>\r\n    <div #content class=\"content\" [sfcScrollIntoView]=\"scrollTarget\" (sfcScrollTracker)=\"onScroll()\"\r\n        [positions]=\"scrollPosition\">\r\n        <div class=\"items\">\r\n            <ng-content></ng-content>\r\n        </div>\r\n        <div class=\"actions\" (sfcMouseDown)=\"$event.preventDefault()\">\r\n            <sfc-load-more-button [hidden]=\"hideLoadMoreButton\" (more)=\"more($event)\" [label]=\"loadMoreLabel\">\r\n            </sfc-load-more-button>\r\n            <sfc-pagination *ngIf=\"showPagination\" [limits]=\"paginationLimits\" [count]=\"paginationCount\" [full]=\"false\"\r\n                [total]=\"total\" [size]=\"model.pagination?.size!\" [page]=\"page\">\r\n            </sfc-pagination>\r\n            <sfc-delimeter *ngIf=\"isEmpty\" [label]=\"emptyLabel\"></sfc-delimeter>\r\n        </div>\r\n    </div>\r\n</div>", styles: [":host{width:100%;height:inherit;position:relative}:host .container{height:inherit}:host .container .content{transition:background .5s ease;cursor:initial;overflow-y:auto;overflow-x:hidden;height:inherit}:host .container .content,:host-context(.sfc-default-theme) :host .container .content{background:transparent}:host-context(.sfc-dark-theme) :host .container .content{background:transparent}:host .container .content sfc-delimeter{font-style:italic;font-weight:700}:host.dropdown .container .content{display:none;opacity:0;max-height:12.5em;box-shadow:0 .125em .125em #00000024,0 .18em .06em -.125em #0000001f,0 .06em .31em #0003}:host.dropdown.open .container .content{display:block;opacity:1}:host ::ng-deep ::-webkit-scrollbar{width:.375em;height:.375em}:host ::ng-deep ::-webkit-scrollbar-track{border-radius:.625em;background:#e9e9e9}:host ::ng-deep ::-webkit-scrollbar-thumb{border-radius:.625em;background:rgba(0,0,0,.2)}:host ::ng-deep ::-webkit-scrollbar-thumb:hover{background:rgba(0,0,0,.4)}:host ::ng-deep ::-webkit-scrollbar-thumb:active{background:rgba(0,0,0,.6)}\n"] }]
         }], ctorParameters: function () { return [{ type: LoaderService }, { type: LoadMoreService }, { type: PaginationService }, { type: SortingService }]; }, propDecorators: { id: [{
                 type: Input
             }], type: [{
@@ -3191,6 +3214,7 @@ NgxSfcCommonModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", vers
         CloseComponent,
         HamburgerComponent,
         HamburgerMenuComponent,
+        DotComponent,
         DotsComponent,
         PaginationComponent,
         LoadMoreButtonComponent,
@@ -3235,6 +3259,7 @@ NgxSfcCommonModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", vers
         CheckmarkComponent,
         TemplateContentComponent,
         ToggleSwitcherComponent,
+        DotComponent,
         DotsComponent,
         HamburgerComponent,
         HamburgerMenuComponent,
@@ -3288,6 +3313,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImpor
                         CloseComponent,
                         HamburgerComponent,
                         HamburgerMenuComponent,
+                        DotComponent,
                         DotsComponent,
                         PaginationComponent,
                         LoadMoreButtonComponent,
@@ -3337,6 +3363,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImpor
                         CheckmarkComponent,
                         TemplateContentComponent,
                         ToggleSwitcherComponent,
+                        DotComponent,
                         DotsComponent,
                         HamburgerComponent,
                         HamburgerMenuComponent,
@@ -3372,6 +3399,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { BounceLoaderComponent, BrowserDocumentRef, BrowserWindowRef, ButtonComponent, ButtonType, CheckmarkComponent, CheckmarkType, CircleLoaderComponent, CircleLoaderType, ClickOutsideDirective, CloseComponent, CollapseExpandComponent, CollapseExpandContainerComponent, CollapseExpandDirective, CommonConstants, Compare, ComponentReferenceDirective, ComponentSize, ComponentSizeDirective, DOCUMENT, DOCUMENT_PROVIDERS, DateTimeConstants, DefaultModalFooterComponent, DefaultModalHeaderComponent, DelimeterComponent, DestroyParentDirective, Direction, DocumentRef, DomChangesDirective, DotsComponent, HamburgerComponent, HamburgerMenuComponent, IconComponent, IfDirective, ImageLoadDirective, ImageLoadService, LoadContainerChangesSource, LoadContainerComponent, LoadContainerLoadType, LoadContainerType, LoadMoreButtonComponent, LoadMoreService, LoaderService, MediaLimits, ModalComponent, ModalOpenDirective, ModalOpenOnClickDirective, ModalService, ModalTemplate, MouseDownDirective, NgxSfcCommonModule, PaginationComponent, PaginationConstants, PaginationService, Position, ResizeService, ScrollIntoViewDirective, ScrollTrackerDirective, Sequence, ShowHideElementDirective, SortByPipe, SortingDirection, SortingService, SwitchMultiCasePipe, TemplateContentComponent, TemplateReferenceDirective, Theme, ThrowElementOnHoverDirective, ToggleComponent, ToggleSwitcherComponent, TooltipComponent, TooltipType, UIClass, UIConstants, WINDOW, WINDOW_PROVIDERS, WindowRef, addClasses, addItem, addPropertyToObject, all, any, browserDocumentProvider, browserWindowProvider, buildHttpParams, contains, convertDateToTimestamp, convertFromBase64String, convertTimestampToDate, convertToBase64String, convertUTCDateToLocalDate, count, distinct, documentFactory, documentProvider, firstItem, firstOrDefault, generateGuid, getAge, getCalcValue, getCollectionOrEmpty, getCssLikeValue, getFileExtension, getFirstDayOfMonth, getFirstDayOfMonthByYearAndMonth, getFirstDayOfYear, getLastDayOfMonth, getLastDayOfMonthByYearAndMonth, getLastDayOfYear, getNextDate, getNextMonth, getNextYear, getPreviousDate, getPreviousMonth, getPreviousYear, getRotateValue, getValueFromCssLikeValue, getWeeksNumberInMonth, hasItem, hasItemBy, hasObjectItem, hexToRgb, isAsyncData, isChromeBrowser, isDateGreat, isDateGreatOrEqual, isDateTimeGreat, isDateTimeGreatOrEqual, isDefined, isEmail, isEqual, isEqualDateTimes, isEqualDates, isImage, isNullOrEmptyString, isNumeric, isObject, lastItem, max, mergeDeep, nameof, parseBoolean, parseFileSize, readAsDataURL, remove, removeClasses, removeItem, removeItemBy, removePropertyFromObject, replaceRgbOpacity, rgbToHex, setDay, setDefaultSecondsAndMiliseconds, setHours, setMilliseconds, setMinutes, setSeconds, setYear, skip, sort, sortBy, sortByPath, sum, trim, updateItemBy, where, windowFactory, windowProvider };
-//# sourceMappingURL=ngx-sfc-common.mjs.map
+export { BounceLoaderComponent, BrowserDocumentRef, BrowserWindowRef, ButtonComponent, ButtonType, CheckmarkComponent, CheckmarkType, CircleLoaderComponent, CircleLoaderType, ClickOutsideDirective, CloseComponent, CollapseExpandComponent, CollapseExpandContainerComponent, CollapseExpandDirective, CommonConstants, Compare, ComponentReferenceDirective, ComponentSize, ComponentSizeDirective, DOCUMENT, DOCUMENT_PROVIDERS, DateTimeConstants, DefaultModalFooterComponent, DefaultModalHeaderComponent, DelimeterComponent, DestroyParentDirective, Direction, DocumentRef, DomChangesDirective, DotComponent, DotsComponent, HamburgerComponent, HamburgerMenuComponent, IconComponent, IfDirective, ImageLoadDirective, ImageLoadService, LoadContainerChangesSource, LoadContainerComponent, LoadContainerLoadType, LoadContainerType, LoadMoreButtonComponent, LoadMoreService, LoaderService, MediaLimits, ModalComponent, ModalOpenDirective, ModalOpenOnClickDirective, ModalService, ModalTemplate, MouseDownDirective, NgxSfcCommonModule, PaginationComponent, PaginationConstants, PaginationService, Position, ResizeService, ScrollIntoViewDirective, ScrollTrackerDirective, Sequence, ShowHideElementDirective, SortByPipe, SortingDirection, SortingService, SwitchMultiCasePipe, TemplateContentComponent, TemplateReferenceDirective, Theme, ThrowElementOnHoverDirective, ToggleComponent, ToggleSwitcherComponent, TooltipComponent, TooltipType, UIClass, UIConstants, WINDOW, WINDOW_PROVIDERS, WindowRef, addClasses, addItem, addPropertyToObject, all, any, browserDocumentProvider, browserWindowProvider, buildHttpParams, contains, convertDateToTimestamp, convertFromBase64String, convertTimestampToDate, convertToBase64String, convertUTCDateToLocalDate, count, distinct, documentFactory, documentProvider, firstItem, firstOrDefault, generateGuid, getAge, getCalcValue, getCollectionOrEmpty, getCssLikeValue, getFileExtension, getFirstDayOfMonth, getFirstDayOfMonthByYearAndMonth, getFirstDayOfYear, getLastDayOfMonth, getLastDayOfMonthByYearAndMonth, getLastDayOfYear, getNextDate, getNextMonth, getNextYear, getPreviousDate, getPreviousMonth, getPreviousYear, getRotateValue, getValueFromCssLikeValue, getWeeksNumberInMonth, hasItem, hasItemBy, hasObjectItem, hexToRgb, isAsyncData, isChromeBrowser, isDateGreat, isDateGreatOrEqual, isDateTimeGreat, isDateTimeGreatOrEqual, isDefined, isEmail, isEqual, isEqualDateTimes, isEqualDates, isImage, isNullOrEmptyString, isNumeric, isObject, lastItem, max, mergeDeep, nameof, parseBoolean, parseFileSize, readAsDataURL, remove, removeClasses, removeItem, removeItemBy, removePropertyFromObject, replaceRgbOpacity, rgbToHex, setDay, setDefaultSecondsAndMiliseconds, setHours, setMilliseconds, setMinutes, setSeconds, setYear, skip, sort, sortBy, sortByPath, sum, trim, updateItemBy, where, windowFactory, windowProvider };
 //# sourceMappingURL=ngx-sfc-common.mjs.map