@abp/ng.theme.shared 5.0.0-beta.2 → 5.0.0-beta.3

package/bundles/abp-ng.theme.shared.umd.js

@@ -572,12 +572,12 @@
         return ButtonComponent;
     }());
     ButtonComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0__namespace, type: ButtonComponent, deps: [{ token: i0__namespace.Renderer2 }], target: i0__namespace.ɵɵFactoryTarget.Component });
-    ButtonComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.6", type: ButtonComponent, selector: "abp-button", inputs: { buttonId: "buttonId", buttonClass: "buttonClass", buttonType: "buttonType", iconClass: "iconClass", loading: "loading", disabled: "disabled", attributes: "attributes" }, outputs: { click: "click", focus: "focus", blur: "blur", abpClick: "abpClick", abpFocus: "abpFocus", abpBlur: "abpBlur" }, viewQueries: [{ propertyName: "buttonRef", first: true, predicate: ["button"], descendants: true, static: true }], ngImport: i0__namespace, template: "\n    <button\n      #button\n      [id]=\"buttonId\"\n      [attr.type]=\"buttonType\"\n      [ngClass]=\"buttonClass\"\n      [disabled]=\"loading || disabled\"\n      (click.stop)=\"click.next($event); abpClick.next($event)\"\n      (focus)=\"focus.next($event); abpFocus.next($event)\"\n      (blur)=\"blur.next($event); abpBlur.next($event)\"\n    >\n      <i [ngClass]=\"icon\" class=\"mr-1\"></i><ng-content></ng-content>\n    </button>\n  ", isInline: true, directives: [{ type: i1__namespace.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2__namespace.StopPropagationDirective, selector: "[click.stop]", outputs: ["click.stop"] }] });
+    ButtonComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.6", type: ButtonComponent, selector: "abp-button", inputs: { buttonId: "buttonId", buttonClass: "buttonClass", buttonType: "buttonType", iconClass: "iconClass", loading: "loading", disabled: "disabled", attributes: "attributes" }, outputs: { click: "click", focus: "focus", blur: "blur", abpClick: "abpClick", abpFocus: "abpFocus", abpBlur: "abpBlur" }, viewQueries: [{ propertyName: "buttonRef", first: true, predicate: ["button"], descendants: true, static: true }], ngImport: i0__namespace, template: "\n    <button\n      #button\n      [id]=\"buttonId\"\n      [attr.type]=\"buttonType\"\n      [ngClass]=\"buttonClass\"\n      [disabled]=\"loading || disabled\"\n      (click.stop)=\"click.next($event); abpClick.next($event)\"\n      (focus)=\"focus.next($event); abpFocus.next($event)\"\n      (blur)=\"blur.next($event); abpBlur.next($event)\"\n    >\n      <i [ngClass]=\"icon\" class=\"me-1\"></i><ng-content></ng-content>\n    </button>\n  ", isInline: true, directives: [{ type: i1__namespace.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2__namespace.StopPropagationDirective, selector: "[click.stop]", outputs: ["click.stop"] }] });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0__namespace, type: ButtonComponent, decorators: [{
                 type: i0.Component,
                 args: [{
                         selector: 'abp-button',
-                        template: "\n    <button\n      #button\n      [id]=\"buttonId\"\n      [attr.type]=\"buttonType\"\n      [ngClass]=\"buttonClass\"\n      [disabled]=\"loading || disabled\"\n      (click.stop)=\"click.next($event); abpClick.next($event)\"\n      (focus)=\"focus.next($event); abpFocus.next($event)\"\n      (blur)=\"blur.next($event); abpBlur.next($event)\"\n    >\n      <i [ngClass]=\"icon\" class=\"mr-1\"></i><ng-content></ng-content>\n    </button>\n  ",
+                        template: "\n    <button\n      #button\n      [id]=\"buttonId\"\n      [attr.type]=\"buttonType\"\n      [ngClass]=\"buttonClass\"\n      [disabled]=\"loading || disabled\"\n      (click.stop)=\"click.next($event); abpClick.next($event)\"\n      (focus)=\"focus.next($event); abpFocus.next($event)\"\n      (blur)=\"blur.next($event); abpBlur.next($event)\"\n    >\n      <i [ngClass]=\"icon\" class=\"me-1\"></i><ng-content></ng-content>\n    </button>\n  ",
                     }]
             }], ctorParameters: function () { return [{ type: i0__namespace.Renderer2 }]; }, propDecorators: { buttonId: [{
                     type: i0.Input
@@ -704,7 +704,7 @@
         return HttpErrorWrapperComponent;
     }());
     HttpErrorWrapperComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0__namespace, type: HttpErrorWrapperComponent, deps: [{ token: i2__namespace.SubscriptionService }], target: i0__namespace.ɵɵFactoryTarget.Component });
-    HttpErrorWrapperComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.6", type: HttpErrorWrapperComponent, selector: "abp-http-error-wrapper", providers: [i2.SubscriptionService], viewQueries: [{ propertyName: "containerRef", first: true, predicate: ["container"], descendants: true }], ngImport: i0__namespace, template: "<div\n  #container\n  id=\"abp-http-error-container\"\n  class=\"error\"\n  [style.backgroundColor]=\"backgroundColor\"\n>\n  <button\n    *ngIf=\"!hideCloseIcon\"\n    id=\"abp-close-button\"\n    type=\"button\"\n    class=\"close mr-2\"\n    (click)=\"destroy()\"\n  >\n    <span aria-hidden=\"true\">&times;</span>\n  </button>\n\n  <div *ngIf=\"!customComponent\" class=\"row centered\">\n    <div class=\"col-md-12\">\n      <div class=\"error-template\">\n        <h1>{{ statusText }} {{ title | abpLocalization }}</h1>\n        <div class=\"error-details\">\n          {{ details | abpLocalization }}\n        </div>\n        <div class=\"error-actions\">\n          <a\n            *ngIf=\"isHomeShow\"\n            (click)=\"destroy()\"\n            routerLink=\"/\"\n            class=\"btn btn-primary btn-md mt-2\"\n            ><span class=\"glyphicon glyphicon-home\"></span>\n            {{ { key: '::Menu:Home', defaultValue: 'Home' } | abpLocalization }}\n          </a>\n        </div>\n      </div>\n    </div>\n  </div>\n</div>\n", styles: [".error{position:fixed;top:0;width:100vw;height:100vh;z-index:999999}.centered{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)}\n"], directives: [{ type: i1__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1__namespace$1.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["routerLink", "target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo"] }], pipes: { "abpLocalization": i2__namespace.LocalizationPipe } });
+    HttpErrorWrapperComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.6", type: HttpErrorWrapperComponent, selector: "abp-http-error-wrapper", providers: [i2.SubscriptionService], viewQueries: [{ propertyName: "containerRef", first: true, predicate: ["container"], descendants: true }], ngImport: i0__namespace, template: "<div\n  #container\n  id=\"abp-http-error-container\"\n  class=\"error\"\n  [style.backgroundColor]=\"backgroundColor\"\n>\n  <button\n    *ngIf=\"!hideCloseIcon\"\n    id=\"abp-close-button\"\n    type=\"button\"\n    class=\"close me-2\"\n    (click)=\"destroy()\"\n  >\n    <span aria-hidden=\"true\">&times;</span>\n  </button>\n\n  <div *ngIf=\"!customComponent\" class=\"row centered\">\n    <div class=\"col-md-12\">\n      <div class=\"error-template\">\n        <h1>{{ statusText }} {{ title | abpLocalization }}</h1>\n        <div class=\"error-details\">\n          {{ details | abpLocalization }}\n        </div>\n        <div class=\"error-actions\">\n          <a\n            *ngIf=\"isHomeShow\"\n            (click)=\"destroy()\"\n            routerLink=\"/\"\n            class=\"btn btn-primary btn-md mt-2\"\n            ><span class=\"glyphicon glyphicon-home\"></span>\n            {{ { key: '::Menu:Home', defaultValue: 'Home' } | abpLocalization }}\n          </a>\n        </div>\n      </div>\n    </div>\n  </div>\n</div>\n", styles: [".error{position:fixed;top:0;width:100vw;height:100vh;z-index:999999}.centered{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)}\n"], directives: [{ type: i1__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1__namespace$1.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["routerLink", "target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo"] }], pipes: { "abpLocalization": i2__namespace.LocalizationPipe } });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0__namespace, type: HttpErrorWrapperComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -1082,7 +1082,7 @@
         return ModalComponent;
     }());
     ModalComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0__namespace, type: ModalComponent, deps: [{ token: ConfirmationService }, { token: i2__namespace.SubscriptionService }, { token: SUPPRESS_UNSAVED_CHANGES_WARNING, optional: true }, { token: i3__namespace.NgbModal }, { token: ModalRefService }], target: i0__namespace.ɵɵFactoryTarget.Component });
-    ModalComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.6", type: ModalComponent, selector: "abp-modal", inputs: { visible: "visible", busy: "busy", options: "options", suppressUnsavedChangesWarning: "suppressUnsavedChangesWarning" }, outputs: { visibleChange: "visibleChange", init: "init", appear: "appear", disappear: "disappear" }, providers: [i2.SubscriptionService], queries: [{ propertyName: "abpHeader", first: true, predicate: ["abpHeader"], descendants: true }, { propertyName: "abpBody", first: true, predicate: ["abpBody"], descendants: true }, { propertyName: "abpFooter", first: true, predicate: ["abpFooter"], descendants: true }, { propertyName: "abpSubmit", first: true, predicate: ButtonComponent, descendants: true, read: ButtonComponent }], viewQueries: [{ propertyName: "modalContent", first: true, predicate: ["modalContent"], descendants: true }], ngImport: i0__namespace, template: "<ng-content></ng-content>\n\n<ng-template #modalContent let-modal>\n  <div id=\"abp-modal-header\" class=\"modal-header\">\n    <ng-container *ngTemplateOutlet=\"abpHeader\"></ng-container>\n    \u200B\n    <button\n      id=\"abp-modal-close-button\"\n      type=\"button\"\n      class=\"close\"\n      aria-label=\"Close\"\n      (click)=\"modal.dismiss()\"\n    >\n      <span aria-hidden=\"true\">&times;</span>\n    </button>\n  </div>\n  <div id=\"abp-modal-body\" class=\"modal-body\">\n    <ng-container *ngTemplateOutlet=\"abpBody\"></ng-container>\n  </div>\n  <div *ngIf=\"abpFooter\" id=\"abp-modal-footer\" class=\"modal-footer\">\n    <ng-container *ngTemplateOutlet=\"abpFooter\"></ng-container>\n  </div>\n</ng-template>\n", styles: [".modal.show{display:block!important}.modal-backdrop{opacity:.8}.modal::-webkit-scrollbar{width:7px}.modal::-webkit-scrollbar-track{background:#ddd}.modal::-webkit-scrollbar-thumb{background:#8a8686}.modal-dialog{z-index:1050}\n"], directives: [{ type: i1__namespace.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i1__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+    ModalComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.6", type: ModalComponent, selector: "abp-modal", inputs: { visible: "visible", busy: "busy", options: "options", suppressUnsavedChangesWarning: "suppressUnsavedChangesWarning" }, outputs: { visibleChange: "visibleChange", init: "init", appear: "appear", disappear: "disappear" }, providers: [i2.SubscriptionService], queries: [{ propertyName: "abpHeader", first: true, predicate: ["abpHeader"], descendants: true }, { propertyName: "abpBody", first: true, predicate: ["abpBody"], descendants: true }, { propertyName: "abpFooter", first: true, predicate: ["abpFooter"], descendants: true }, { propertyName: "abpSubmit", first: true, predicate: ButtonComponent, descendants: true, read: ButtonComponent }], viewQueries: [{ propertyName: "modalContent", first: true, predicate: ["modalContent"], descendants: true }], ngImport: i0__namespace, template: "<ng-content></ng-content>\n\n<ng-template #modalContent let-modal>\n  <div id=\"abp-modal-header\" class=\"modal-header\">\n    <ng-container *ngTemplateOutlet=\"abpHeader\"></ng-container>\n    \u200B\n    <button\n      id=\"abp-modal-close-button\"\n      type=\"button\"\n      class=\"btn-sm btn-close\"\n      aria-label=\"Close\"\n      (click)=\"modal.dismiss()\"\n    ></button>\n  </div>\n  <div id=\"abp-modal-body\" class=\"modal-body\">\n    <ng-container *ngTemplateOutlet=\"abpBody\"></ng-container>\n  </div>\n  <div *ngIf=\"abpFooter\" id=\"abp-modal-footer\" class=\"modal-footer\">\n    <ng-container *ngTemplateOutlet=\"abpFooter\"></ng-container>\n  </div>\n</ng-template>\n", styles: [".modal.show{display:block!important}.modal-backdrop{opacity:.8}.modal::-webkit-scrollbar{width:7px}.modal::-webkit-scrollbar-track{background:#ddd}.modal::-webkit-scrollbar-thumb{background:#8a8686}.modal-dialog{z-index:1050}\n"], directives: [{ type: i1__namespace.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i1__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0__namespace, type: ModalComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -1269,9 +1269,6 @@
                     type: i0.Input
                 }] } });
 
-    var styles = "\n.is-invalid .form-control {\n  border-color: #dc3545;\n  border-style: solid !important;\n  padding-right: calc(1.5em + .75rem);\n  background-image: url(data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23dc3545' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e);\n  background-repeat: no-repeat;\n  background-position: right calc(.375em + .1875rem) center;\n  background-size: calc(.75em + .375rem) calc(.75em + .375rem);\n}\n\n.is-invalid .invalid-feedback,\n.is-invalid + * .invalid-feedback {\n  display: block;\n}\n\n.data-tables-filter {\n  text-align: right;\n}\n\n[dir=rtl] .data-tables-filter {\n  text-align: left;\n}\n\n.pointer {\n  cursor: pointer;\n}\n\n.navbar .dropdown-submenu a::after {\n  transform: rotate(-90deg);\n  position: absolute;\n  right: 16px;\n  top: 18px;\n}\n\n.navbar .dropdown-menu {\n  min-width: 215px;\n}\n\n.datatable-scroll {\n  margin-bottom: 5px !important;\n  width: unset !important;\n}\n\n.ui-table-scrollable-body::-webkit-scrollbar {\n  height: 5px !important;\n  width: 5px !important;\n}\n\n.ui-table-scrollable-body::-webkit-scrollbar-track {\n  background: #ddd;\n}\n\n.ui-table-scrollable-body::-webkit-scrollbar-thumb {\n  background: #8a8686;\n}\n\n.abp-ellipsis-inline {\n  display: inline-block;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.abp-ellipsis {\n  overflow: hidden !important;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.ui-widget-overlay {\n  z-index: 1000;\n}\n\n.color-white {\n  color: #FFF !important;\n}\n\n.custom-checkbox > label {\n  cursor: pointer;\n}\n\n/* <animations */\n\n.fade-in-top {\n  animation: fadeInTop 0.2s ease-in-out;\n}\n\n.fade-out-top {\n  animation: fadeOutTop 0.2s ease-in-out;\n}\n\n.abp-collapsed-height {\n  -moz-transition: max-height linear 0.35s;\n  -ms-transition: max-height linear 0.35s;\n  -o-transition: max-height linear 0.35s;\n  -webkit-transition: max-height linear 0.35s;\n  overflow:hidden;\n  transition:max-height 0.35s linear;\n  height:auto;\n  max-height: 0;\n}\n\n.abp-mh-25 {\n  max-height: 25vh;\n}\n\n.abp-mh-50 {\n  transition:max-height 0.65s linear;\n  max-height: 50vh;\n}\n\n.abp-mh-75 {\n  transition:max-height 0.85s linear;\n  max-height: 75vh;\n}\n\n.abp-mh-100 {\n  transition:max-height 1s linear;\n  max-height: 100vh;\n}\n\n[class^=\"sorting\"] {\n  opacity: .3;\n  cursor: pointer;\n}\n[class^=\"sorting\"]:before {\n  right: 0.5rem;\n  content: \"\u2191\";\n}\n[class^=\"sorting\"]:after {\n  right: 0.5rem;\n  content: \"\u2193\";\n}\n\n.sorting_desc {\n  opacity: 1;\n}\n.sorting_desc:before {\n  opacity: .3;\n}\n\n.sorting_asc {\n  opacity: 1;\n}\n.sorting_asc:after {\n  opacity: .3;\n}\n.ngx-datatable.material {\n  box-shadow: none;\n}\nngb-typeahead-window, ngb-typeahead-window.dropdown-menu {\n  max-height: 25em;\n  overflow-y: scroll !important;\n  z-index: 1050;\n}\n\n@keyframes fadeInTop {\n  from {\n    transform: translateY(-5px);\n    opacity: 0;\n  }\n\n  to {\n    transform: translateY(0px);\n    opacity: 1;\n  }\n}\n\n@keyframes fadeOutTop {\n  to {\n    transform: translateY(-5px);\n    opacity: 0;\n  }\n}\n\n/* </animations */\n\n";
-    var BOOTSTRAP = 'bootstrap-{{dir}}.min.css';
-
     var DEFAULT_VALIDATION_BLUEPRINTS = {
         creditCard: 'AbpValidation::ThisFieldIsNotAValidCreditCardNumber.',
         email: 'AbpValidation::ThisFieldIsNotAValidEmailAddress.',
@@ -1630,6 +1627,36 @@
                     type: i0.Input
                 }] } });
 
+    var DocumentDirHandlerService = /** @class */ (function () {
+        function DocumentDirHandlerService(injector) {
+            this.injector = injector;
+            this.dir = new rxjs.BehaviorSubject('ltr');
+            this.dir$ = this.dir.asObservable();
+            this.listenToLanguageChanges();
+        }
+        DocumentDirHandlerService.prototype.listenToLanguageChanges = function () {
+            var _this = this;
+            var l10n = this.injector.get(i2.LocalizationService);
+            // will always listen, no need to unsubscribe
+            l10n.languageChange$
+                .pipe(operators.startWith(l10n.currentLang), operators.map(function (locale) { return i2.getLocaleDirection(locale); }))
+                .subscribe(function (dir) {
+                _this.dir.next(dir);
+                _this.setBodyDir(dir);
+            });
+        };
+        DocumentDirHandlerService.prototype.setBodyDir = function (dir) {
+            document.body.dir = dir;
+            document.dir = dir;
+        };
+        return DocumentDirHandlerService;
+    }());
+    DocumentDirHandlerService.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0__namespace, type: DocumentDirHandlerService, deps: [{ token: i0__namespace.Injector }], target: i0__namespace.ɵɵFactoryTarget.Injectable });
+    DocumentDirHandlerService.ɵprov = i0__namespace.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0__namespace, type: DocumentDirHandlerService });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0__namespace, type: DocumentDirHandlerService, decorators: [{
+                type: i0.Injectable
+            }], ctorParameters: function () { return [{ type: i0__namespace.Injector }]; } });
+
     function httpErrorConfigFactory(config) {
         if (config === void 0) { config = {}; }
         if (config.errorScreen && config.errorScreen.component && !config.errorScreen.forWhichErrors) {
@@ -1918,98 +1945,6 @@
                 args: [{ providedIn: 'root' }]
             }], ctorParameters: function () { return [{ type: i0__namespace.Injector }]; } });
 
-    var LAZY_STYLES = new i0.InjectionToken('LAZY_STYLES');
-
-    var LazyStyleHandler = /** @class */ (function () {
-        function LazyStyleHandler(injector) {
-            this._dir = 'ltr';
-            this.loaded = new Map();
-            this.setStyles(injector);
-            this.setLazyLoad(injector);
-            this.listenToLanguageChanges(injector);
-        }
-        Object.defineProperty(LazyStyleHandler.prototype, "dir", {
-            get: function () {
-                return this._dir;
-            },
-            set: function (dir) {
-                if (dir === this._dir)
-                    return;
-                this.switchCSS(dir);
-                this.setBodyDir(dir);
-                this._dir = dir;
-            },
-            enumerable: false,
-            configurable: true
-        });
-        LazyStyleHandler.prototype.getHrefFromLink = function (link) {
-            if (!link)
-                return '';
-            var a = document.createElement('a');
-            a.href = link.href;
-            return a.pathname.replace(/^\//, '');
-        };
-        LazyStyleHandler.prototype.getLoadedBootstrap = function () {
-            var href = createLazyStyleHref(BOOTSTRAP, this.dir);
-            var selector = "[href*=\"" + href.replace(/\.css$/, '') + "\"]";
-            var link = document.querySelector(selector);
-            return { href: href, link: link };
-        };
-        LazyStyleHandler.prototype.listenToLanguageChanges = function (injector) {
-            var _this = this;
-            var l10n = injector.get(i2.LocalizationService);
-            // will always listen, no need to unsubscribe
-            l10n.languageChange$.pipe(operators.startWith(l10n.currentLang)).subscribe(function (locale) {
-                _this.dir = i2.getLocaleDirection(locale);
-            });
-        };
-        LazyStyleHandler.prototype.setBodyDir = function (dir) {
-            document.body.dir = dir;
-        };
-        LazyStyleHandler.prototype.setLazyLoad = function (injector) {
-            this.lazyLoad = injector.get(i2.LazyLoadService);
-            var _a = this.getLoadedBootstrap(), href = _a.href, link = _a.link;
-            this.lazyLoad.loaded.set(href, link);
-        };
-        LazyStyleHandler.prototype.setStyles = function (injector) {
-            this.styles = injector.get(LAZY_STYLES, [BOOTSTRAP]);
-        };
-        LazyStyleHandler.prototype.switchCSS = function (dir) {
-            var _this = this;
-            this.styles.forEach(function (style) {
-                var oldHref = createLazyStyleHref(style, _this.dir);
-                var newHref = createLazyStyleHref(style, dir);
-                var link = _this.loaded.get(newHref);
-                var href = _this.getHrefFromLink(link) || newHref;
-                var strategy = i2.LOADING_STRATEGY.PrependAnonymousStyleToHead(href);
-                _this.lazyLoad.load(strategy).subscribe(function () {
-                    var oldLink = _this.lazyLoad.loaded.get(oldHref);
-                    _this.loaded.delete(newHref);
-                    _this.loaded.set(oldHref, oldLink);
-                    var newLink = _this.lazyLoad.loaded.get(href);
-                    _this.lazyLoad.loaded.delete(href);
-                    _this.lazyLoad.loaded.set(newHref, newLink);
-                    _this.lazyLoad.remove(oldHref);
-                });
-            });
-        };
-        return LazyStyleHandler;
-    }());
-    LazyStyleHandler.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0__namespace, type: LazyStyleHandler, deps: [{ token: i0__namespace.Injector }], target: i0__namespace.ɵɵFactoryTarget.Injectable });
-    LazyStyleHandler.ɵprov = i0__namespace.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0__namespace, type: LazyStyleHandler, providedIn: 'root' });
-    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.6", ngImport: i0__namespace, type: LazyStyleHandler, decorators: [{
-                type: i0.Injectable,
-                args: [{
-                        providedIn: 'root',
-                    }]
-            }], ctorParameters: function () { return [{ type: i0__namespace.Injector }]; } });
-    function createLazyStyleHref(style, dir) {
-        return style.replace(/{{\s*dir\s*}}/g, dir);
-    }
-    function initLazyStyleHandler(injector) {
-        return function () { return new LazyStyleHandler(injector); };
-    }
-
     var NavItem = /** @class */ (function () {
         function NavItem(props) {
             props = Object.assign(Object.assign({}, props), { visible: props.visible || (function () { return true; }) });
@@ -2231,6 +2166,8 @@
                     }]
             }], ctorParameters: function () { return [{ type: i2__namespace.ContentProjectionService }]; } });
 
+    var styles = "\n.is-invalid .form-control {\n  border-color: #dc3545;\n  border-style: solid !important;\n  padding-right: calc(1.5em + .75rem);\n  background-image: url(data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23dc3545' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e);\n  background-repeat: no-repeat;\n  background-position: right calc(.375em + .1875rem) center;\n  background-size: calc(.75em + .375rem) calc(.75em + .375rem);\n}\n\n.is-invalid .invalid-feedback,\n.is-invalid + * .invalid-feedback {\n  display: block;\n}\n\n.data-tables-filter {\n  text-align: right;\n}\n\n[dir=rtl] .data-tables-filter {\n  text-align: left;\n}\n\n.pointer {\n  cursor: pointer;\n}\n\n.navbar .dropdown-submenu a::after {\n  transform: rotate(-90deg);\n  position: absolute;\n  right: 16px;\n  top: 18px;\n}\n\n.navbar .dropdown-menu {\n  min-width: 215px;\n}\n\n.datatable-scroll {\n  margin-bottom: 5px !important;\n  width: unset !important;\n}\n\n.ui-table-scrollable-body::-webkit-scrollbar {\n  height: 5px !important;\n  width: 5px !important;\n}\n\n.ui-table-scrollable-body::-webkit-scrollbar-track {\n  background: #ddd;\n}\n\n.ui-table-scrollable-body::-webkit-scrollbar-thumb {\n  background: #8a8686;\n}\n\n.abp-ellipsis-inline {\n  display: inline-block;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.abp-ellipsis {\n  overflow: hidden !important;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.ui-widget-overlay {\n  z-index: 1000;\n}\n\n.color-white {\n  color: #FFF !important;\n}\n\n.custom-checkbox > label {\n  cursor: pointer;\n}\n\n/* <animations */\n\n.fade-in-top {\n  animation: fadeInTop 0.2s ease-in-out;\n}\n\n.fade-out-top {\n  animation: fadeOutTop 0.2s ease-in-out;\n}\n\n.abp-collapsed-height {\n  -moz-transition: max-height linear 0.35s;\n  -ms-transition: max-height linear 0.35s;\n  -o-transition: max-height linear 0.35s;\n  -webkit-transition: max-height linear 0.35s;\n  overflow:hidden;\n  transition:max-height 0.35s linear;\n  height:auto;\n  max-height: 0;\n}\n\n.abp-mh-25 {\n  max-height: 25vh;\n}\n\n.abp-mh-50 {\n  transition:max-height 0.65s linear;\n  max-height: 50vh;\n}\n\n.abp-mh-75 {\n  transition:max-height 0.85s linear;\n  max-height: 75vh;\n}\n\n.abp-mh-100 {\n  transition:max-height 1s linear;\n  max-height: 100vh;\n}\n\n[class^=\"sorting\"] {\n  opacity: .3;\n  cursor: pointer;\n}\n[class^=\"sorting\"]:before {\n  right: 0.5rem;\n  content: \"\u2191\";\n}\n[class^=\"sorting\"]:after {\n  right: 0.5rem;\n  content: \"\u2193\";\n}\n\n.sorting_desc {\n  opacity: 1;\n}\n.sorting_desc:before {\n  opacity: .3;\n}\n\n.sorting_asc {\n  opacity: 1;\n}\n.sorting_asc:after {\n  opacity: .3;\n}\n.ngx-datatable.material {\n  box-shadow: none;\n}\nngb-typeahead-window, ngb-typeahead-window.dropdown-menu {\n  max-height: 25em;\n  overflow-y: scroll !important;\n  z-index: 1050;\n}\n\n@keyframes fadeInTop {\n  from {\n    transform: translateY(-5px);\n    opacity: 0;\n  }\n\n  to {\n    transform: translateY(0px);\n    opacity: 1;\n  }\n}\n\n@keyframes fadeOutTop {\n  to {\n    transform: translateY(-5px);\n    opacity: 0;\n  }\n}\n\n/* </animations */\n.ngb-dp-body {\n  z-index: 1055 !important;\n}\n";
+
     var THEME_SHARED_APPEND_CONTENT = new i0.InjectionToken('THEME_SHARED_APPEND_CONTENT', {
         providedIn: 'root',
         factory: function () {
@@ -2395,12 +2332,6 @@
                         deps: [THEME_SHARED_APPEND_CONTENT],
                         useFactory: i2.noop,
                     },
-                    {
-                        provide: i0.APP_INITIALIZER,
-                        multi: true,
-                        deps: [i0.Injector],
-                        useFactory: initLazyStyleHandler,
-                    },
                     { provide: HTTP_ERROR_CONFIG, useValue: httpErrorConfig },
                     {
                         provide: 'HTTP_ERROR_CONFIG',
@@ -2421,6 +2352,13 @@
                         provide: core.VALIDATION_VALIDATE_ON_SUBMIT,
                         useValue: validation.validateOnSubmit,
                     },
+                    DocumentDirHandlerService,
+                    {
+                        provide: i0.APP_INITIALIZER,
+                        useFactory: i2.noop,
+                        multi: true,
+                        deps: [DocumentDirHandlerService],
+                    },
                 ],
             };
         };
@@ -2475,7 +2413,6 @@
      * Generated bundle index. Do not edit.
      */
 
-    exports.BOOTSTRAP = BOOTSTRAP;
     exports.BaseThemeSharedModule = BaseThemeSharedModule;
     exports.BreadcrumbComponent = BreadcrumbComponent;
     exports.BreadcrumbItemsComponent = BreadcrumbItemsComponent;
@@ -2486,14 +2423,13 @@
     exports.DEFAULT_ERROR_MESSAGES = DEFAULT_ERROR_MESSAGES;
     exports.DEFAULT_VALIDATION_BLUEPRINTS = DEFAULT_VALIDATION_BLUEPRINTS;
     exports.DateParserFormatter = DateParserFormatter;
+    exports.DocumentDirHandlerService = DocumentDirHandlerService;
     exports.EllipsisDirective = EllipsisDirective;
     exports.EllipsisModule = EllipsisModule;
     exports.ErrorHandler = ErrorHandler;
     exports.HTTP_ERROR_CONFIG = HTTP_ERROR_CONFIG;
     exports.HTTP_ERROR_HANDLER = HTTP_ERROR_HANDLER;
     exports.HttpErrorWrapperComponent = HttpErrorWrapperComponent;
-    exports.LAZY_STYLES = LAZY_STYLES;
-    exports.LazyStyleHandler = LazyStyleHandler;
     exports.LoaderBarComponent = LoaderBarComponent;
     exports.LoadingComponent = LoadingComponent;
     exports.LoadingDirective = LoadingDirective;
@@ -2523,7 +2459,6 @@
     exports.collapseYWithMargin = collapseYWithMargin;
     exports.configureNgBootstrap = configureNgBootstrap;
     exports.configureRoutes = configureRoutes;
-    exports.createLazyStyleHref = createLazyStyleHref;
     exports.defaultNgxDatatableMessages = defaultNgxDatatableMessages;
     exports.dialogAnimation = dialogAnimation;
     exports.expandX = expandX;
@@ -2542,7 +2477,6 @@
     exports.fadeOutUp = fadeOutUp;
     exports.getPasswordValidators = getPasswordValidators;
     exports.httpErrorConfigFactory = httpErrorConfigFactory;
-    exports.initLazyStyleHandler = initLazyStyleHandler;
     exports.slideFromBottom = slideFromBottom;
     exports.toastInOut = toastInOut;