@datarailsshared/datarailsshared 1.6.407 → 1.6.409

package/fesm2022/datarailsshared-datarailsshared.mjs

@@ -25,6 +25,10 @@ import * as i5 from '@angular/material/datepicker';
 import { MatCalendar, DateRange, MAT_DATE_RANGE_SELECTION_STRATEGY, MatDatepickerModule } from '@angular/material/datepicker';
 import { MomentDateAdapter, MAT_MOMENT_DATE_ADAPTER_OPTIONS } from '@angular/material-moment-adapter';
 import * as i1$3 from '@angular/platform-browser';
+import 'codemirror/mode/javascript/javascript';
+import 'codemirror/addon/edit/matchbrackets';
+import 'codemirror/addon/hint/show-hint';
+import '@codemirror/autocomplete';
 import * as CodeMirror from 'codemirror';
 import * as i2$1 from '@angular/material/tabs';
 import { MatTabsModule } from '@angular/material/tabs';
@@ -32,10 +36,6 @@ import * as i1$4 from '@angular/material/legacy-dialog';
 import { MAT_LEGACY_DIALOG_DATA, MatLegacyDialogRef, MatLegacyDialogModule } from '@angular/material/legacy-dialog';
 import * as i1$5 from 'ngx-toastr';
 import { Toast, ToastrModule } from 'ngx-toastr';
-import 'codemirror/mode/javascript/javascript';
-import 'codemirror/addon/edit/matchbrackets';
-import 'codemirror/addon/hint/show-hint';
-import '@codemirror/autocomplete';
 import { ESCAPE, hasModifierKey } from '@angular/cdk/keycodes';
 import * as i1$7 from '@angular/cdk/dialog';
 import { CdkDialogContainer, DialogModule, Dialog, DialogConfig } from '@angular/cdk/dialog';
@@ -9532,7 +9532,7 @@ class DrAlertComponent {
 
 class CodeEditorHintWrapperComponent {
     /** @nocollapse */ static { this.ɵfac = function CodeEditorHintWrapperComponent_Factory(t) { return new (t || CodeEditorHintWrapperComponent)(); }; }
-    /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: CodeEditorHintWrapperComponent, selectors: [["dr-code-editor-hint-wrapper"]], decls: 1, vars: 2, consts: [[3, "innerHTML", "drTooltip"]], template: function CodeEditorHintWrapperComponent_Template(rf, ctx) { if (rf & 1) {
+    /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: CodeEditorHintWrapperComponent, selectors: [["dr-code-editor-hint-wrapper"]], standalone: true, features: [i0.ɵɵStandaloneFeature], decls: 1, vars: 2, consts: [[3, "innerHTML", "drTooltip"]], template: function CodeEditorHintWrapperComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelement(0, "span", 0);
         } if (rf & 2) {
             i0.ɵɵproperty("innerHTML", ctx.content, i0.ɵɵsanitizeHtml)("drTooltip", ctx.tooltip);
@@ -9541,6 +9541,8 @@ class CodeEditorHintWrapperComponent {
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CodeEditorHintWrapperComponent, [{
         type: Component,
         args: [{
+                standalone: true,
+                imports: [DrTooltipDirective],
                 selector: 'dr-code-editor-hint-wrapper',
                 template: ` <span [innerHTML]="content" [drTooltip]="tooltip"></span> `,
             }]
@@ -9680,13 +9682,13 @@ class DrCodemirrorComponent {
         } if (rf & 2) {
             let _t;
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.ref = _t.first);
-        } }, inputs: { className: "className", name: "name", autoFocus: "autoFocus", options: "options", preserveScrollPosition: "preserveScrollPosition" }, outputs: { cursorActivity: "cursorActivity", focusChange: "focusChange", scroll: "scroll", drop: "drop", codeMirrorLoaded: "codeMirrorLoaded" }, features: [i0.ɵɵProvidersFeature([
+        } }, inputs: { className: "className", name: "name", autoFocus: "autoFocus", options: "options", preserveScrollPosition: "preserveScrollPosition" }, outputs: { cursorActivity: "cursorActivity", focusChange: "focusChange", scroll: "scroll", drop: "drop", codeMirrorLoaded: "codeMirrorLoaded" }, standalone: true, features: [i0.ɵɵProvidersFeature([
                 {
                     provide: NG_VALUE_ACCESSOR,
                     useExisting: forwardRef((() => DrCodemirrorComponent)),
                     multi: true,
                 },
-            ])], decls: 3, vars: 7, consts: [["autocomplete", "off", 3, "name", "autofocus"], ["ref", ""]], template: function DrCodemirrorComponent_Template(rf, ctx) { if (rf & 1) {
+            ]), i0.ɵɵStandaloneFeature], decls: 3, vars: 7, consts: [["autocomplete", "off", 3, "name", "autofocus"], ["ref", ""]], template: function DrCodemirrorComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "textarea", 0, 1);
             i0.ɵɵtext(2, "        ");
             i0.ɵɵelementEnd();
@@ -9699,6 +9701,7 @@ class DrCodemirrorComponent {
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DrCodemirrorComponent, [{
         type: Component,
         args: [{
+                standalone: true,
                 selector: 'dr-codemirror',
                 template: `
         <textarea
@@ -9828,6 +9831,22 @@ class DrErrorComponent {
             args: ['class.no-icon']
         }] }); })();
 
+class DrErrorModule {
+    /** @nocollapse */ static { this.ɵfac = function DrErrorModule_Factory(t) { return new (t || DrErrorModule)(); }; }
+    /** @nocollapse */ static { this.ɵmod = /** @pureOrBreakMyCode */ i0.ɵɵdefineNgModule({ type: DrErrorModule }); }
+    /** @nocollapse */ static { this.ɵinj = /** @pureOrBreakMyCode */ i0.ɵɵdefineInjector({ imports: [CommonModule, FormsModule, DrTooltipModule] }); }
+}
+(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DrErrorModule, [{
+        type: NgModule,
+        args: [{
+                imports: [CommonModule, FormsModule, DrTooltipModule],
+                exports: [DrErrorComponent],
+                providers: [],
+                declarations: [DrErrorComponent],
+            }]
+    }], null, null); })();
+(function () { (typeof ngJitMode === "undefined" || ngJitMode) && i0.ɵɵsetNgModuleScope(DrErrorModule, { declarations: [DrErrorComponent], imports: [CommonModule, FormsModule, DrTooltipModule], exports: [DrErrorComponent] }); })();
+
 const _c0$H = ["codeEditor"];
 function DrCodeEditorComponent_span_2_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "span", 4);
@@ -10111,7 +10130,7 @@ class DrCodeEditorComponent {
         } if (rf & 2) {
             let _t;
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.codeEditor = _t.first);
-        } }, inputs: { markers: "markers", highlightHints: "highlightHints", hints: "hints", control: "control", placeholder: "placeholder" }, features: [i0.ɵɵProvidersFeature([{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef((() => DrCodeEditorComponent)), multi: true }])], decls: 4, vars: 9, consts: [[3, "ngModel", "options", "ngModelChange", "focusChange", "codeMirrorLoaded"], ["codeEditor", ""], ["class", "codemirror-placeholder", 4, "ngIf"], [3, "control", "displayAsLabel"], [1, "codemirror-placeholder"]], template: function DrCodeEditorComponent_Template(rf, ctx) { if (rf & 1) {
+        } }, inputs: { markers: "markers", highlightHints: "highlightHints", hints: "hints", control: "control", placeholder: "placeholder" }, standalone: true, features: [i0.ɵɵProvidersFeature([{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef((() => DrCodeEditorComponent)), multi: true }]), i0.ɵɵStandaloneFeature], decls: 4, vars: 9, consts: [[3, "ngModel", "options", "ngModelChange", "focusChange", "codeMirrorLoaded"], ["codeEditor", ""], ["class", "codemirror-placeholder", 4, "ngIf"], [3, "control", "displayAsLabel"], [1, "codemirror-placeholder"]], template: function DrCodeEditorComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "dr-codemirror", 0, 1);
             i0.ɵɵlistener("ngModelChange", function DrCodeEditorComponent_Template_dr_codemirror_ngModelChange_0_listener($event) { return ctx.value = $event; })("focusChange", function DrCodeEditorComponent_Template_dr_codemirror_focusChange_0_listener($event) { return ctx.focusChanged($event); })("codeMirrorLoaded", function DrCodeEditorComponent_Template_dr_codemirror_codeMirrorLoaded_0_listener() { return ctx.afterCodeMirrorLoaded(); });
             i0.ɵɵelementEnd();
@@ -10124,11 +10143,11 @@ class DrCodeEditorComponent {
             i0.ɵɵproperty("ngIf", !ctx.isFocused && !ctx.innerValue);
             i0.ɵɵadvance(1);
             i0.ɵɵproperty("control", ctx.control)("displayAsLabel", true);
-        } }, dependencies: [i1.NgIf, i2.NgControlStatus, i2.NgModel, DrErrorComponent, DrCodemirrorComponent], styles: ["dr-codemirror[_ngcontent-%COMP%]     .CodeMirror{height:10rem;border:1px solid #9ea1aa;border-radius:6px}dr-codemirror[_ngcontent-%COMP%]     .CodeMirror-focused{border-color:#4646ce!important}dr-codemirror[_ngcontent-%COMP%]     .CodeMirror-line{font-size:12px;line-height:16px;font-weight:400}dr-codemirror[_ngcontent-%COMP%]     .CodeMirror .CodeMirror-scroll{padding:0}dr-codemirror[_ngcontent-%COMP%]     .CodeMirror .marker{color:#fff;background:#20a452}dr-codemirror[_ngcontent-%COMP%]     .CodeMirror .marker:first-child, dr-codemirror[_ngcontent-%COMP%]     .CodeMirror .cm-variable:not(.marker)+.marker{padding-left:2px;margin-left:2px}dr-codemirror[_ngcontent-%COMP%]     .CodeMirror .marker+.cm-variable:not(.marker){margin-left:2px}dr-codemirror[_ngcontent-%COMP%]     .CodeMirror-matchingbracket{color:#0f0!important}[_nghost-%COMP%] {position:relative}[_nghost-%COMP%]  .mirror-error .CodeMirror{border:1px solid #bf1d30}[_nghost-%COMP%]  .mark-hints .hint-variable{color:#4646ce}dr-error[_ngcontent-%COMP%]{position:absolute;bottom:5px;left:7px;background:#fff;margin:0;width:calc(100% - 9px)}dr-error[_ngcontent-%COMP%]:not(:last-child){display:none}.codemirror-placeholder[_ngcontent-%COMP%]{color:#6d6e6f;position:absolute;top:10px;left:10px;font-size:12px;pointer-events:none;white-space:pre}  .CodeMirror-hints{background:#fff;border:1px solid #e5e6ea;box-shadow:0 4px 8px 1px #00000040;border-radius:6px;z-index:100;padding:8px 0}  .CodeMirror-hints .CodeMirror-hint{font-size:12px;line-height:16px;font-weight:400;padding:0 12px;display:flex;align-items:center;height:32px;background:#fff;color:#333}  .CodeMirror-hints .CodeMirror-hint,   .CodeMirror-hints .CodeMirror-hint-active{background:#fff;color:#333}  .CodeMirror-hints:not(:hover) .CodeMirror-hint-active,   .CodeMirror-hints .CodeMirror-hint:hover{background:#eaeaff;cursor:pointer}"], changeDetection: 0 }); }
+        } }, dependencies: [CommonModule, i1.NgIf, FormsModule, i2.NgControlStatus, i2.NgModel, DrCodemirrorComponent, DrErrorModule, DrErrorComponent], styles: ["dr-codemirror[_ngcontent-%COMP%]     .CodeMirror{height:10rem;border:1px solid #9ea1aa;border-radius:6px}dr-codemirror[_ngcontent-%COMP%]     .CodeMirror-focused{border-color:#4646ce!important}dr-codemirror[_ngcontent-%COMP%]     .CodeMirror-line{font-size:12px;line-height:16px;font-weight:400}dr-codemirror[_ngcontent-%COMP%]     .CodeMirror .CodeMirror-scroll{padding:0}dr-codemirror[_ngcontent-%COMP%]     .CodeMirror .marker{color:#fff;background:#20a452}dr-codemirror[_ngcontent-%COMP%]     .CodeMirror .marker:first-child, dr-codemirror[_ngcontent-%COMP%]     .CodeMirror .cm-variable:not(.marker)+.marker{padding-left:2px;margin-left:2px}dr-codemirror[_ngcontent-%COMP%]     .CodeMirror .marker+.cm-variable:not(.marker){margin-left:2px}dr-codemirror[_ngcontent-%COMP%]     .CodeMirror-matchingbracket{color:#0f0!important}[_nghost-%COMP%] {position:relative}[_nghost-%COMP%]  .mirror-error .CodeMirror{border:1px solid #bf1d30}[_nghost-%COMP%]  .mark-hints .hint-variable{color:#4646ce}dr-error[_ngcontent-%COMP%]{position:absolute;bottom:5px;left:7px;background:#fff;margin:0;width:calc(100% - 9px)}dr-error[_ngcontent-%COMP%]:not(:last-child){display:none}.codemirror-placeholder[_ngcontent-%COMP%]{color:#6d6e6f;position:absolute;top:10px;left:10px;font-size:12px;pointer-events:none;white-space:pre}  .CodeMirror-hints{background:#fff;border:1px solid #e5e6ea;box-shadow:0 4px 8px 1px #00000040;border-radius:6px;z-index:100;padding:8px 0}  .CodeMirror-hints .CodeMirror-hint{font-size:12px;line-height:16px;font-weight:400;padding:0 12px;display:flex;align-items:center;height:32px;background:#fff;color:#333}  .CodeMirror-hints .CodeMirror-hint,   .CodeMirror-hints .CodeMirror-hint-active{background:#fff;color:#333}  .CodeMirror-hints:not(:hover) .CodeMirror-hint-active,   .CodeMirror-hints .CodeMirror-hint:hover{background:#eaeaff;cursor:pointer}"], changeDetection: 0 }); }
 }
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DrCodeEditorComponent, [{
         type: Component,
-        args: [{ selector: 'dr-code-editor', changeDetection: ChangeDetectionStrategy.OnPush, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef((() => DrCodeEditorComponent)), multi: true }], template: "<dr-codemirror\n    #codeEditor\n    [(ngModel)]=\"value\"\n    [options]=\"codeMirrorOptions\"\n    [class.mark-hints]=\"highlightHints\"\n    [class.mirror-error]=\"control.status === 'INVALID' && !control.pristine\"\n    (focusChange)=\"focusChanged($event)\"\n    (codeMirrorLoaded)=\"afterCodeMirrorLoaded()\"></dr-codemirror>\n<span *ngIf=\"!isFocused && !innerValue\" class=\"codemirror-placeholder\">{{ placeholder }}</span>\n<dr-error [control]=\"control\" [displayAsLabel]=\"true\"></dr-error>\n", styles: ["dr-codemirror ::ng-deep .CodeMirror{height:10rem;border:1px solid #9ea1aa;border-radius:6px}dr-codemirror ::ng-deep .CodeMirror-focused{border-color:#4646ce!important}dr-codemirror ::ng-deep .CodeMirror-line{font-size:12px;line-height:16px;font-weight:400}dr-codemirror ::ng-deep .CodeMirror .CodeMirror-scroll{padding:0}dr-codemirror ::ng-deep .CodeMirror .marker{color:#fff;background:#20a452}dr-codemirror ::ng-deep .CodeMirror .marker:first-child,dr-codemirror ::ng-deep .CodeMirror .cm-variable:not(.marker)+.marker{padding-left:2px;margin-left:2px}dr-codemirror ::ng-deep .CodeMirror .marker+.cm-variable:not(.marker){margin-left:2px}dr-codemirror ::ng-deep .CodeMirror-matchingbracket{color:#0f0!important}:host::ng-deep{position:relative}:host::ng-deep .mirror-error .CodeMirror{border:1px solid #bf1d30}:host::ng-deep .mark-hints .hint-variable{color:#4646ce}dr-error{position:absolute;bottom:5px;left:7px;background:#fff;margin:0;width:calc(100% - 9px)}dr-error:not(:last-child){display:none}.codemirror-placeholder{color:#6d6e6f;position:absolute;top:10px;left:10px;font-size:12px;pointer-events:none;white-space:pre}::ng-deep .CodeMirror-hints{background:#fff;border:1px solid #e5e6ea;box-shadow:0 4px 8px 1px #00000040;border-radius:6px;z-index:100;padding:8px 0}::ng-deep .CodeMirror-hints .CodeMirror-hint{font-size:12px;line-height:16px;font-weight:400;padding:0 12px;display:flex;align-items:center;height:32px;background:#fff;color:#333}::ng-deep .CodeMirror-hints .CodeMirror-hint,::ng-deep .CodeMirror-hints .CodeMirror-hint-active{background:#fff;color:#333}::ng-deep .CodeMirror-hints:not(:hover) .CodeMirror-hint-active,::ng-deep .CodeMirror-hints .CodeMirror-hint:hover{background:#eaeaff;cursor:pointer}\n"] }]
+        args: [{ standalone: true, imports: [CommonModule, FormsModule, DrCodemirrorComponent, DrErrorModule], selector: 'dr-code-editor', changeDetection: ChangeDetectionStrategy.OnPush, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef((() => DrCodeEditorComponent)), multi: true }], template: "<dr-codemirror\n    #codeEditor\n    [(ngModel)]=\"value\"\n    [options]=\"codeMirrorOptions\"\n    [class.mark-hints]=\"highlightHints\"\n    [class.mirror-error]=\"control.status === 'INVALID' && !control.pristine\"\n    (focusChange)=\"focusChanged($event)\"\n    (codeMirrorLoaded)=\"afterCodeMirrorLoaded()\"></dr-codemirror>\n<span *ngIf=\"!isFocused && !innerValue\" class=\"codemirror-placeholder\">{{ placeholder }}</span>\n<dr-error [control]=\"control\" [displayAsLabel]=\"true\"></dr-error>\n", styles: ["dr-codemirror ::ng-deep .CodeMirror{height:10rem;border:1px solid #9ea1aa;border-radius:6px}dr-codemirror ::ng-deep .CodeMirror-focused{border-color:#4646ce!important}dr-codemirror ::ng-deep .CodeMirror-line{font-size:12px;line-height:16px;font-weight:400}dr-codemirror ::ng-deep .CodeMirror .CodeMirror-scroll{padding:0}dr-codemirror ::ng-deep .CodeMirror .marker{color:#fff;background:#20a452}dr-codemirror ::ng-deep .CodeMirror .marker:first-child,dr-codemirror ::ng-deep .CodeMirror .cm-variable:not(.marker)+.marker{padding-left:2px;margin-left:2px}dr-codemirror ::ng-deep .CodeMirror .marker+.cm-variable:not(.marker){margin-left:2px}dr-codemirror ::ng-deep .CodeMirror-matchingbracket{color:#0f0!important}:host::ng-deep{position:relative}:host::ng-deep .mirror-error .CodeMirror{border:1px solid #bf1d30}:host::ng-deep .mark-hints .hint-variable{color:#4646ce}dr-error{position:absolute;bottom:5px;left:7px;background:#fff;margin:0;width:calc(100% - 9px)}dr-error:not(:last-child){display:none}.codemirror-placeholder{color:#6d6e6f;position:absolute;top:10px;left:10px;font-size:12px;pointer-events:none;white-space:pre}::ng-deep .CodeMirror-hints{background:#fff;border:1px solid #e5e6ea;box-shadow:0 4px 8px 1px #00000040;border-radius:6px;z-index:100;padding:8px 0}::ng-deep .CodeMirror-hints .CodeMirror-hint{font-size:12px;line-height:16px;font-weight:400;padding:0 12px;display:flex;align-items:center;height:32px;background:#fff;color:#333}::ng-deep .CodeMirror-hints .CodeMirror-hint,::ng-deep .CodeMirror-hints .CodeMirror-hint-active{background:#fff;color:#333}::ng-deep .CodeMirror-hints:not(:hover) .CodeMirror-hint-active,::ng-deep .CodeMirror-hints .CodeMirror-hint:hover{background:#eaeaff;cursor:pointer}\n"] }]
     }], function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ComponentFactoryResolver }, { type: i0.Injector }]; }, { markers: [{
             type: Input
         }], highlightHints: [{
@@ -10596,6 +10615,56 @@ function Debounce$1(ms) {
     };
 }
 
+const _c0$F = [[["", "dropdownItemContent", ""]], [["", "dropdownItemActions", ""]]];
+const _c1$h = ["[dropdownItemContent]", "[dropdownItemActions]"];
+class DrDropdownItemComponent {
+    constructor() {
+        this.role = 'option';
+    }
+    /** @nocollapse */ static { this.ɵfac = function DrDropdownItemComponent_Factory(t) { return new (t || DrDropdownItemComponent)(); }; }
+    /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: DrDropdownItemComponent, selectors: [["dr-dropdown-item"]], hostVars: 1, hostBindings: function DrDropdownItemComponent_HostBindings(rf, ctx) { if (rf & 2) {
+            i0.ɵɵattribute("role", ctx.role);
+        } }, inputs: { selected: "selected", disabled: "disabled", divider: "divider" }, standalone: true, features: [i0.ɵɵStandaloneFeature], ngContentSelectors: _c1$h, decls: 5, vars: 6, consts: [[1, "dr-dropdown-item"], [1, "dr-dropdown-text"], [1, "dr-dropdown-actions"]], template: function DrDropdownItemComponent_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵprojectionDef(_c0$F);
+            i0.ɵɵelementStart(0, "div", 0)(1, "span", 1);
+            i0.ɵɵprojection(2);
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(3, "div", 2);
+            i0.ɵɵprojection(4, 1);
+            i0.ɵɵelementEnd()();
+        } if (rf & 2) {
+            i0.ɵɵclassProp("item-disabled", ctx.disabled)("item-selected", ctx.selected)("divider", ctx.divider);
+        } }, styles: ["[_nghost-%COMP%]{display:flex;align-items:center}[_nghost-%COMP%]   .dr-dropdown-text[_ngcontent-%COMP%]{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;margin-right:auto;display:inline-flex;align-items:center;flex:1}[_nghost-%COMP%]   .dr-dropdown-actions[_ngcontent-%COMP%]{margin-left:auto;display:flex;align-items:center}[_nghost-%COMP%]   .dr-dropdown-item[_ngcontent-%COMP%]{font-size:14px;line-height:24px;font-weight:400;display:flex;align-items:center;justify-content:flex-start;cursor:pointer;min-width:15rem;font-style:normal;clear:both;width:100%;white-space:nowrap;padding:0 12px;height:36px;flex-shrink:0;background-color:#fff;color:#333}[_nghost-%COMP%]   .dr-dropdown-item[_ngcontent-%COMP%]:hover{background-color:#f5f5f5}[_nghost-%COMP%]   .dr-dropdown-item.divider[_ngcontent-%COMP%]{border-top:1px solid #dfe0e3}[_nghost-%COMP%]   .dr-dropdown-item[_ngcontent-%COMP%]:active, [_nghost-%COMP%]   .dr-dropdown-item.item-selected[_ngcontent-%COMP%]{background-color:#eaeaff}[_nghost-%COMP%]   .dr-dropdown-item.item-disabled[_ngcontent-%COMP%]{background-color:#fff!important;color:#aeabac!important}"], changeDetection: 0 }); }
+}
+(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DrDropdownItemComponent, [{
+        type: Component,
+        args: [{ standalone: true, selector: 'dr-dropdown-item', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"dr-dropdown-item\" [class.item-disabled]=\"disabled\" [class.item-selected]=\"selected\" [class.divider]=\"divider\">\n    <span class=\"dr-dropdown-text\">\n        <ng-content select=\"[dropdownItemContent]\"></ng-content>\n    </span>\n    <div class=\"dr-dropdown-actions\">\n        <ng-content select=\"[dropdownItemActions]\"></ng-content>\n    </div>\n</div>\n", styles: [":host{display:flex;align-items:center}:host .dr-dropdown-text{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;margin-right:auto;display:inline-flex;align-items:center;flex:1}:host .dr-dropdown-actions{margin-left:auto;display:flex;align-items:center}:host .dr-dropdown-item{font-size:14px;line-height:24px;font-weight:400;display:flex;align-items:center;justify-content:flex-start;cursor:pointer;min-width:15rem;font-style:normal;clear:both;width:100%;white-space:nowrap;padding:0 12px;height:36px;flex-shrink:0;background-color:#fff;color:#333}:host .dr-dropdown-item:hover{background-color:#f5f5f5}:host .dr-dropdown-item.divider{border-top:1px solid #dfe0e3}:host .dr-dropdown-item:active,:host .dr-dropdown-item.item-selected{background-color:#eaeaff}:host .dr-dropdown-item.item-disabled{background-color:#fff!important;color:#aeabac!important}\n"] }]
+    }], null, { selected: [{
+            type: Input
+        }], disabled: [{
+            type: Input
+        }], divider: [{
+            type: Input
+        }], role: [{
+            type: HostBinding,
+            args: ['attr.role']
+        }] }); })();
+
+class DrDropdownItemShowPipe {
+    transform(arr) {
+        return arr.filter((item) => (item.show ? item.show(item.data) : true));
+    }
+    /** @nocollapse */ static { this.ɵfac = function DrDropdownItemShowPipe_Factory(t) { return new (t || DrDropdownItemShowPipe)(); }; }
+    /** @nocollapse */ static { this.ɵpipe = /** @pureOrBreakMyCode */ i0.ɵɵdefinePipe({ name: "drDropdownItemShowPipe", type: DrDropdownItemShowPipe, pure: true, standalone: true }); }
+}
+(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DrDropdownItemShowPipe, [{
+        type: Pipe,
+        args: [{
+                standalone: true,
+                name: 'drDropdownItemShowPipe',
+            }]
+    }], null, null); })();
+
 var __decorate$1 = (this && this.__decorate) || function (decorators, target, key, desc) {
     var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
     if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
@@ -10605,7 +10674,7 @@ var __decorate$1 = (this && this.__decorate) || function (decorators, target, ke
 var __metadata$1 = (this && this.__metadata) || function (k, v) {
     if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
 };
-const _c0$F = ["menuContainer"];
+const _c0$E = ["menuContainer"];
 function DrDropdownComponent_dr_dropdown_item_4_ng_container_1_i_1_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelement(0, "i", 11);
 } if (rf & 2) {
@@ -10655,12 +10724,12 @@ function DrDropdownComponent_dr_dropdown_item_4_ng_container_2_Template(rf, ctx)
     i0.ɵɵadvance(1);
     i0.ɵɵproperty("ngIf", ctx_r5.hasChildren(act_r2));
 } }
-const _c1$h = function (a0) { return { $implicit: a0 }; };
+const _c1$g = function (a0) { return { $implicit: a0 }; };
 function DrDropdownComponent_dr_dropdown_item_4_ng_container_3_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainer(0, 17);
 } if (rf & 2) {
     const act_r2 = i0.ɵɵnextContext().$implicit;
-    i0.ɵɵproperty("ngTemplateOutlet", act_r2.templateRef)("ngTemplateOutletContext", i0.ɵɵpureFunction1(2, _c1$h, act_r2));
+    i0.ɵɵproperty("ngTemplateOutlet", act_r2.templateRef)("ngTemplateOutletContext", i0.ɵɵpureFunction1(2, _c1$g, act_r2));
 } }
 function DrDropdownComponent_dr_dropdown_item_4_Template(rf, ctx) { if (rf & 1) {
     const _r20 = i0.ɵɵgetCurrentView();
@@ -10836,11 +10905,11 @@ class DrDropdownComponent {
     }
     /** @nocollapse */ static { this.ɵfac = function DrDropdownComponent_Factory(t) { return new (t || DrDropdownComponent)(); }; }
     /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: DrDropdownComponent, selectors: [["dr-dropdown"]], viewQuery: function DrDropdownComponent_Query(rf, ctx) { if (rf & 1) {
-            i0.ɵɵviewQuery(_c0$F, 7);
+            i0.ɵɵviewQuery(_c0$E, 7);
         } if (rf & 2) {
             let _t;
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.menuContainer = _t.first);
-        } }, inputs: { options: "options" }, outputs: { onAction: "action" }, features: [i0.ɵɵNgOnChangesFeature], ngContentSelectors: _c3$3, decls: 6, vars: 5, consts: [[1, "dr-dropdown"], ["menuContainer", ""], ["tabindex", "-1", "role", "listbox", 1, "dr-dropdown__container", 3, "mouseenter", "mouseleave"], ["drDropdownChild", "", "tabindex", "0", 3, "drTooltip", "drTooltipPosition", "drTooltipOptions", "drTooltipTheme", "drTooltipMousleaveTimeout", "drTooltipMouseEnterTimeout", "drTooltipClass", "drDropdown", "drDropdownClass", "drDropdownInHover", "drDropdownPosition", "disabled", "selected", "divider", "mousedown", 4, "ngFor", "ngForOf"], ["drDropdownChild", "", "tabindex", "0", 3, "drTooltip", "drTooltipPosition", "drTooltipOptions", "drTooltipTheme", "drTooltipMousleaveTimeout", "drTooltipMouseEnterTimeout", "drTooltipClass", "drDropdown", "drDropdownClass", "drDropdownInHover", "drDropdownPosition", "disabled", "selected", "divider", "mousedown"], ["dropdownItemContent", "", 4, "ngIf"], ["dropdownItemActions", "", 4, "ngIf"], ["dropdownItemContent", "", 3, "ngTemplateOutlet", "ngTemplateOutletContext", 4, "ngIf"], ["dropdownItemContent", ""], ["class", "dr-dropdown__icon", 3, "class", 4, "ngIf"], [1, "dr-dropdown__text"], [1, "dr-dropdown__icon"], ["dropdownItemActions", ""], [3, "class", "showOnHover", "mousedown", 4, "ngFor", "ngForOf"], ["class", "dr-icon-arrow-right", 4, "ngIf"], [3, "mousedown"], [1, "dr-icon-arrow-right"], ["dropdownItemContent", "", 3, "ngTemplateOutlet", "ngTemplateOutletContext"]], template: function DrDropdownComponent_Template(rf, ctx) { if (rf & 1) {
+        } }, inputs: { options: "options" }, outputs: { onAction: "action" }, standalone: true, features: [i0.ɵɵNgOnChangesFeature, i0.ɵɵStandaloneFeature], ngContentSelectors: _c3$3, decls: 6, vars: 5, consts: [[1, "dr-dropdown"], ["menuContainer", ""], ["tabindex", "-1", "role", "listbox", 1, "dr-dropdown__container", 3, "mouseenter", "mouseleave"], ["drDropdownChild", "", "tabindex", "0", 3, "drTooltip", "drTooltipPosition", "drTooltipOptions", "drTooltipTheme", "drTooltipMousleaveTimeout", "drTooltipMouseEnterTimeout", "drTooltipClass", "drDropdown", "drDropdownClass", "drDropdownInHover", "drDropdownPosition", "disabled", "selected", "divider", "mousedown", 4, "ngFor", "ngForOf"], ["drDropdownChild", "", "tabindex", "0", 3, "drTooltip", "drTooltipPosition", "drTooltipOptions", "drTooltipTheme", "drTooltipMousleaveTimeout", "drTooltipMouseEnterTimeout", "drTooltipClass", "drDropdown", "drDropdownClass", "drDropdownInHover", "drDropdownPosition", "disabled", "selected", "divider", "mousedown"], ["dropdownItemContent", "", 4, "ngIf"], ["dropdownItemActions", "", 4, "ngIf"], ["dropdownItemContent", "", 3, "ngTemplateOutlet", "ngTemplateOutletContext", 4, "ngIf"], ["dropdownItemContent", ""], ["class", "dr-dropdown__icon", 3, "class", 4, "ngIf"], [1, "dr-dropdown__text"], [1, "dr-dropdown__icon"], ["dropdownItemActions", ""], [3, "class", "showOnHover", "mousedown", 4, "ngFor", "ngForOf"], ["class", "dr-icon-arrow-right", 4, "ngIf"], [3, "mousedown"], [1, "dr-icon-arrow-right"], ["dropdownItemContent", "", 3, "ngTemplateOutlet", "ngTemplateOutletContext"]], template: function DrDropdownComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵprojectionDef(_c2$5);
             i0.ɵɵelementStart(0, "div", 0, 1)(2, "div", 2);
             i0.ɵɵlistener("mouseenter", function DrDropdownComponent_Template_div_mouseenter_2_listener() { return ctx.onMouseenter(); })("mouseleave", function DrDropdownComponent_Template_div_mouseleave_2_listener() { return ctx.onMouseleave(); });
@@ -10852,7 +10921,9 @@ class DrDropdownComponent {
             i0.ɵɵclassMap(ctx.containerClass);
             i0.ɵɵadvance(4);
             i0.ɵɵproperty("ngForOf", i0.ɵɵpipeBind1(5, 3, ctx.list));
-        } }, styles: [".dr-dropdown__item .dr-dropdown{visibility:hidden;transition-delay:.2s}  .dr-dropdown__item:hover>*>.dr-dropdown{visibility:visible;transition-delay:0s}  .dr-dropdown__tooltip>.default-content{max-width:300px;white-space:normal!important}.dr-dropdown[_ngcontent-%COMP%]{width:auto}.dr-dropdown__text[_ngcontent-%COMP%]{overflow:hidden;text-overflow:ellipsis;flex:1}.dr-dropdown__container[_ngcontent-%COMP%]{display:flex;flex-direction:column;background:#fff;padding:8px 0;overflow-y:auto;max-height:60vh;max-width:300px}.dr-dropdown__icon[_ngcontent-%COMP%]{margin-right:8px}.dr-dropdown[_ngcontent-%COMP%]   i[_ngcontent-%COMP%]:not(:first-child):hover{color:#4646ce}.dr-dropdown[_ngcontent-%COMP%]   dr-dropdown-item[_ngcontent-%COMP%]:hover   .showOnHover[_ngcontent-%COMP%]{visibility:visible}.dr-dropdown[_ngcontent-%COMP%]   .showOnHover[_ngcontent-%COMP%]{visibility:hidden}"], changeDetection: 0 }); }
+        } }, dependencies: function () { return [CommonModule, i1.NgForOf, i1.NgIf, i1.NgTemplateOutlet, DrTooltipDirective,
+            DrDropdownItemComponent,
+            DrDropdownItemShowPipe, DrDropdownDirective, DrDropdownChildDirective]; }, styles: [".dr-dropdown__item .dr-dropdown{visibility:hidden;transition-delay:.2s}  .dr-dropdown__item:hover>*>.dr-dropdown{visibility:visible;transition-delay:0s}  .dr-dropdown__tooltip>.default-content{max-width:300px;white-space:normal!important}.dr-dropdown[_ngcontent-%COMP%]{width:auto}.dr-dropdown__text[_ngcontent-%COMP%]{overflow:hidden;text-overflow:ellipsis;flex:1}.dr-dropdown__container[_ngcontent-%COMP%]{display:flex;flex-direction:column;background:#fff;padding:8px 0;overflow-y:auto;max-height:60vh;max-width:300px}.dr-dropdown__icon[_ngcontent-%COMP%]{margin-right:8px}.dr-dropdown[_ngcontent-%COMP%]   i[_ngcontent-%COMP%]:not(:first-child):hover{color:#4646ce}.dr-dropdown[_ngcontent-%COMP%]   dr-dropdown-item[_ngcontent-%COMP%]:hover   .showOnHover[_ngcontent-%COMP%]{visibility:visible}.dr-dropdown[_ngcontent-%COMP%]   .showOnHover[_ngcontent-%COMP%]{visibility:hidden}"], changeDetection: 0 }); }
 }
 __decorate$1([
     Debounce$1(200),
@@ -10862,7 +10933,14 @@ __decorate$1([
 ], DrDropdownComponent.prototype, "onMouseleave", null);
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DrDropdownComponent, [{
         type: Component,
-        args: [{ selector: 'dr-dropdown', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div #menuContainer [class]=\"containerClass\" class=\"dr-dropdown\">\n    <div class=\"dr-dropdown__container\" (mouseenter)=\"onMouseenter()\" (mouseleave)=\"onMouseleave()\" tabindex=\"-1\" role=\"listbox\">\n        <ng-content select=\"dr-dropdown-item\"></ng-content>\n\n        <dr-dropdown-item\n            *ngFor=\"let act of list | drDropdownItemShowPipe; let index = index\"\n            (mousedown)=\"action(act)\"\n            [drTooltip]=\"tooltipToShow(act)\"\n            [drTooltipPosition]=\"getTooltipPosition(act)\"\n            [drTooltipOptions]=\"getTooltipOptions(act)\"\n            [drTooltipTheme]=\"getTooltipTheme(act)\"\n            [drTooltipMousleaveTimeout]=\"getTooltipMousleaveTimeout(act)\"\n            [drTooltipMouseEnterTimeout]=\"getTooltipMouseEnterTimeout(act)\"\n            [drTooltipClass]=\"'dr-dropdown__tooltip'\"\n            [drDropdown]=\"hasChildren(act) && act.children\"\n            [drDropdownClass]=\"act.childOptions?.class\"\n            [drDropdownInHover]=\"true\"\n            [drDropdownPosition]=\"act.childOptions?.position\"\n            drDropdownChild\n            [disabled]=\"disabled(act)\"\n            [selected]=\"selected(act)\"\n            [divider]=\"act.separateLine\"\n            [attr.data-analytics]=\"getDataAnalyticsTag(act, index)\"\n            tabindex=\"0\">\n            <ng-container dropdownItemContent *ngIf=\"!act.templateRef\">\n                <i *ngIf=\"act.icon\" [class]=\"act.icon\" class=\"dr-dropdown__icon\"></i>\n                <span class=\"dr-dropdown__text\">{{ act.title }}</span>\n            </ng-container>\n\n            <ng-container dropdownItemActions *ngIf=\"!act.templateRef\">\n                <i\n                    *ngFor=\"let actionIcon of act.actionIcons\"\n                    [attr.data-analytics]=\"getDataAnalyticsTag(actionIcon, index)\"\n                    [class]=\"actionIcon.icon\"\n                    [class.showOnHover]=\"actionIcon.showOnHover\"\n                    (mousedown)=\"onActionIconClick($event, actionIcon, act.data)\"></i>\n                <i *ngIf=\"hasChildren(act)\" class=\"dr-icon-arrow-right\"></i>\n            </ng-container>\n\n            <ng-container\n                *ngIf=\"act.templateRef\"\n                dropdownItemContent\n                [ngTemplateOutlet]=\"act.templateRef\"\n                [ngTemplateOutletContext]=\"{ $implicit: act }\">\n            </ng-container>\n        </dr-dropdown-item>\n    </div>\n</div>\n", styles: ["::ng-deep .dr-dropdown__item .dr-dropdown{visibility:hidden;transition-delay:.2s}::ng-deep .dr-dropdown__item:hover>*>.dr-dropdown{visibility:visible;transition-delay:0s}::ng-deep .dr-dropdown__tooltip>.default-content{max-width:300px;white-space:normal!important}.dr-dropdown{width:auto}.dr-dropdown__text{overflow:hidden;text-overflow:ellipsis;flex:1}.dr-dropdown__container{display:flex;flex-direction:column;background:#fff;padding:8px 0;overflow-y:auto;max-height:60vh;max-width:300px}.dr-dropdown__icon{margin-right:8px}.dr-dropdown i:not(:first-child):hover{color:#4646ce}.dr-dropdown dr-dropdown-item:hover .showOnHover{visibility:visible}.dr-dropdown .showOnHover{visibility:hidden}\n"] }]
+        args: [{ standalone: true, imports: [
+                    CommonModule,
+                    DrTooltipDirective,
+                    DrDropdownItemComponent,
+                    DrDropdownItemShowPipe,
+                    forwardRef((() => DrDropdownDirective)),
+                    forwardRef((() => DrDropdownChildDirective)),
+                ], selector: 'dr-dropdown', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div #menuContainer [class]=\"containerClass\" class=\"dr-dropdown\">\n    <div class=\"dr-dropdown__container\" (mouseenter)=\"onMouseenter()\" (mouseleave)=\"onMouseleave()\" tabindex=\"-1\" role=\"listbox\">\n        <ng-content select=\"dr-dropdown-item\"></ng-content>\n\n        <dr-dropdown-item\n            *ngFor=\"let act of list | drDropdownItemShowPipe; let index = index\"\n            (mousedown)=\"action(act)\"\n            [drTooltip]=\"tooltipToShow(act)\"\n            [drTooltipPosition]=\"getTooltipPosition(act)\"\n            [drTooltipOptions]=\"getTooltipOptions(act)\"\n            [drTooltipTheme]=\"getTooltipTheme(act)\"\n            [drTooltipMousleaveTimeout]=\"getTooltipMousleaveTimeout(act)\"\n            [drTooltipMouseEnterTimeout]=\"getTooltipMouseEnterTimeout(act)\"\n            [drTooltipClass]=\"'dr-dropdown__tooltip'\"\n            [drDropdown]=\"hasChildren(act) && act.children\"\n            [drDropdownClass]=\"act.childOptions?.class\"\n            [drDropdownInHover]=\"true\"\n            [drDropdownPosition]=\"act.childOptions?.position\"\n            drDropdownChild\n            [disabled]=\"disabled(act)\"\n            [selected]=\"selected(act)\"\n            [divider]=\"act.separateLine\"\n            [attr.data-analytics]=\"getDataAnalyticsTag(act, index)\"\n            tabindex=\"0\">\n            <ng-container dropdownItemContent *ngIf=\"!act.templateRef\">\n                <i *ngIf=\"act.icon\" [class]=\"act.icon\" class=\"dr-dropdown__icon\"></i>\n                <span class=\"dr-dropdown__text\">{{ act.title }}</span>\n            </ng-container>\n\n            <ng-container dropdownItemActions *ngIf=\"!act.templateRef\">\n                <i\n                    *ngFor=\"let actionIcon of act.actionIcons\"\n                    [attr.data-analytics]=\"getDataAnalyticsTag(actionIcon, index)\"\n                    [class]=\"actionIcon.icon\"\n                    [class.showOnHover]=\"actionIcon.showOnHover\"\n                    (mousedown)=\"onActionIconClick($event, actionIcon, act.data)\"></i>\n                <i *ngIf=\"hasChildren(act)\" class=\"dr-icon-arrow-right\"></i>\n            </ng-container>\n\n            <ng-container\n                *ngIf=\"act.templateRef\"\n                dropdownItemContent\n                [ngTemplateOutlet]=\"act.templateRef\"\n                [ngTemplateOutletContext]=\"{ $implicit: act }\">\n            </ng-container>\n        </dr-dropdown-item>\n    </div>\n</div>\n", styles: ["::ng-deep .dr-dropdown__item .dr-dropdown{visibility:hidden;transition-delay:.2s}::ng-deep .dr-dropdown__item:hover>*>.dr-dropdown{visibility:visible;transition-delay:0s}::ng-deep .dr-dropdown__tooltip>.default-content{max-width:300px;white-space:normal!important}.dr-dropdown{width:auto}.dr-dropdown__text{overflow:hidden;text-overflow:ellipsis;flex:1}.dr-dropdown__container{display:flex;flex-direction:column;background:#fff;padding:8px 0;overflow-y:auto;max-height:60vh;max-width:300px}.dr-dropdown__icon{margin-right:8px}.dr-dropdown i:not(:first-child):hover{color:#4646ce}.dr-dropdown dr-dropdown-item:hover .showOnHover{visibility:visible}.dr-dropdown .showOnHover{visibility:hidden}\n"] }]
     }], function () { return []; }, { menuContainer: [{
             type: ViewChild,
             args: ['menuContainer', { static: true }]
@@ -11001,7 +11079,7 @@ class DrDropdownDirective {
     /** @nocollapse */ static { this.ɵfac = function DrDropdownDirective_Factory(t) { return new (t || DrDropdownDirective)(); }; }
     /** @nocollapse */ static { this.ɵdir = /** @pureOrBreakMyCode */ i0.ɵɵdefineDirective({ type: DrDropdownDirective, selectors: [["", "drDropdown", ""]], hostBindings: function DrDropdownDirective_HostBindings(rf, ctx) { if (rf & 1) {
             i0.ɵɵlistener("mouseenter", function DrDropdownDirective_mouseenter_HostBindingHandler() { return ctx.elementHover(); })("click", function DrDropdownDirective_click_HostBindingHandler() { return ctx.elementClick(); })("mouseleave", function DrDropdownDirective_mouseleave_HostBindingHandler() { return ctx.leaveDropdownTriggerElement(); })("mouseup", function DrDropdownDirective_mouseup_HostBindingHandler() { return ctx.documentClick(); }, false, i0.ɵɵresolveDocument);
-        } }, inputs: { drDropdown: "drDropdown", drDropdownPosition: "drDropdownPosition", drDropdownClass: "drDropdownClass", drDropdownInHover: "drDropdownInHover", dataAnalytics: ["data-analytics", "dataAnalytics"], drDropdownPositionOffsetX: "drDropdownPositionOffsetX", drDropdownPositionOffsetY: "drDropdownPositionOffsetY" }, outputs: { drDropdownAction: "drDropdownAction", dropdownClosed: "drDropdownClose", dropdownOpened: "drDropdownOpened" }, features: [i0.ɵɵProvidersFeature([
+        } }, inputs: { drDropdown: "drDropdown", drDropdownPosition: "drDropdownPosition", drDropdownClass: "drDropdownClass", drDropdownInHover: "drDropdownInHover", dataAnalytics: ["data-analytics", "dataAnalytics"], drDropdownPositionOffsetX: "drDropdownPositionOffsetX", drDropdownPositionOffsetY: "drDropdownPositionOffsetY" }, outputs: { drDropdownAction: "drDropdownAction", dropdownClosed: "drDropdownClose", dropdownOpened: "drDropdownOpened" }, standalone: true, features: [i0.ɵɵProvidersFeature([
                 {
                     provide: DropdownInstanceService,
                     useFactory: ((injector) => {
@@ -11015,6 +11093,7 @@ class DrDropdownDirective {
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DrDropdownDirective, [{
         type: Directive,
         args: [{
+                standalone: true,
                 selector: '[drDropdown]',
                 providers: [
                     {
@@ -11066,64 +11145,16 @@ class DrDropdownDirective {
         }] }); })();
 class DrDropdownChildDirective {
     /** @nocollapse */ static { this.ɵfac = function DrDropdownChildDirective_Factory(t) { return new (t || DrDropdownChildDirective)(); }; }
-    /** @nocollapse */ static { this.ɵdir = /** @pureOrBreakMyCode */ i0.ɵɵdefineDirective({ type: DrDropdownChildDirective, selectors: [["", "drDropdownChild", ""]] }); }
+    /** @nocollapse */ static { this.ɵdir = /** @pureOrBreakMyCode */ i0.ɵɵdefineDirective({ type: DrDropdownChildDirective, selectors: [["", "drDropdownChild", ""]], standalone: true }); }
 }
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DrDropdownChildDirective, [{
         type: Directive,
         args: [{
+                standalone: true,
                 selector: '[drDropdownChild]',
             }]
     }], null, null); })();
 
-const _c0$E = [[["", "dropdownItemContent", ""]], [["", "dropdownItemActions", ""]]];
-const _c1$g = ["[dropdownItemContent]", "[dropdownItemActions]"];
-class DrDropdownItemComponent {
-    constructor() {
-        this.role = 'option';
-    }
-    /** @nocollapse */ static { this.ɵfac = function DrDropdownItemComponent_Factory(t) { return new (t || DrDropdownItemComponent)(); }; }
-    /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: DrDropdownItemComponent, selectors: [["dr-dropdown-item"]], hostVars: 1, hostBindings: function DrDropdownItemComponent_HostBindings(rf, ctx) { if (rf & 2) {
-            i0.ɵɵattribute("role", ctx.role);
-        } }, inputs: { selected: "selected", disabled: "disabled", divider: "divider" }, ngContentSelectors: _c1$g, decls: 5, vars: 6, consts: [[1, "dr-dropdown-item"], [1, "dr-dropdown-text"], [1, "dr-dropdown-actions"]], template: function DrDropdownItemComponent_Template(rf, ctx) { if (rf & 1) {
-            i0.ɵɵprojectionDef(_c0$E);
-            i0.ɵɵelementStart(0, "div", 0)(1, "span", 1);
-            i0.ɵɵprojection(2);
-            i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(3, "div", 2);
-            i0.ɵɵprojection(4, 1);
-            i0.ɵɵelementEnd()();
-        } if (rf & 2) {
-            i0.ɵɵclassProp("item-disabled", ctx.disabled)("item-selected", ctx.selected)("divider", ctx.divider);
-        } }, styles: ["[_nghost-%COMP%]{display:flex;align-items:center}[_nghost-%COMP%]   .dr-dropdown-text[_ngcontent-%COMP%]{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;margin-right:auto;display:inline-flex;align-items:center;flex:1}[_nghost-%COMP%]   .dr-dropdown-actions[_ngcontent-%COMP%]{margin-left:auto;display:flex;align-items:center}[_nghost-%COMP%]   .dr-dropdown-item[_ngcontent-%COMP%]{font-size:14px;line-height:24px;font-weight:400;display:flex;align-items:center;justify-content:flex-start;cursor:pointer;min-width:15rem;font-style:normal;clear:both;width:100%;white-space:nowrap;padding:0 12px;height:36px;flex-shrink:0;background-color:#fff;color:#333}[_nghost-%COMP%]   .dr-dropdown-item[_ngcontent-%COMP%]:hover{background-color:#f5f5f5}[_nghost-%COMP%]   .dr-dropdown-item.divider[_ngcontent-%COMP%]{border-top:1px solid #dfe0e3}[_nghost-%COMP%]   .dr-dropdown-item[_ngcontent-%COMP%]:active, [_nghost-%COMP%]   .dr-dropdown-item.item-selected[_ngcontent-%COMP%]{background-color:#eaeaff}[_nghost-%COMP%]   .dr-dropdown-item.item-disabled[_ngcontent-%COMP%]{background-color:#fff!important;color:#aeabac!important}"], changeDetection: 0 }); }
-}
-(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DrDropdownItemComponent, [{
-        type: Component,
-        args: [{ selector: 'dr-dropdown-item', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"dr-dropdown-item\" [class.item-disabled]=\"disabled\" [class.item-selected]=\"selected\" [class.divider]=\"divider\">\n    <span class=\"dr-dropdown-text\">\n        <ng-content select=\"[dropdownItemContent]\"></ng-content>\n    </span>\n    <div class=\"dr-dropdown-actions\">\n        <ng-content select=\"[dropdownItemActions]\"></ng-content>\n    </div>\n</div>\n", styles: [":host{display:flex;align-items:center}:host .dr-dropdown-text{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;margin-right:auto;display:inline-flex;align-items:center;flex:1}:host .dr-dropdown-actions{margin-left:auto;display:flex;align-items:center}:host .dr-dropdown-item{font-size:14px;line-height:24px;font-weight:400;display:flex;align-items:center;justify-content:flex-start;cursor:pointer;min-width:15rem;font-style:normal;clear:both;width:100%;white-space:nowrap;padding:0 12px;height:36px;flex-shrink:0;background-color:#fff;color:#333}:host .dr-dropdown-item:hover{background-color:#f5f5f5}:host .dr-dropdown-item.divider{border-top:1px solid #dfe0e3}:host .dr-dropdown-item:active,:host .dr-dropdown-item.item-selected{background-color:#eaeaff}:host .dr-dropdown-item.item-disabled{background-color:#fff!important;color:#aeabac!important}\n"] }]
-    }], null, { selected: [{
-            type: Input
-        }], disabled: [{
-            type: Input
-        }], divider: [{
-            type: Input
-        }], role: [{
-            type: HostBinding,
-            args: ['attr.role']
-        }] }); })();
-
-class DrDropdownItemShowPipe {
-    transform(arr) {
-        return arr.filter((item) => (item.show ? item.show(item.data) : true));
-    }
-    /** @nocollapse */ static { this.ɵfac = function DrDropdownItemShowPipe_Factory(t) { return new (t || DrDropdownItemShowPipe)(); }; }
-    /** @nocollapse */ static { this.ɵpipe = /** @pureOrBreakMyCode */ i0.ɵɵdefinePipe({ name: "drDropdownItemShowPipe", type: DrDropdownItemShowPipe, pure: true }); }
-}
-(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DrDropdownItemShowPipe, [{
-        type: Pipe,
-        args: [{
-                name: 'drDropdownItemShowPipe',
-            }]
-    }], null, null); })();
-
 function DrTabComponent_ng_template_0_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵprojection(0);
 } }
@@ -11137,7 +11168,7 @@ class DrTabComponent {
         } if (rf & 2) {
             let _t;
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.contentTemplate = _t.first);
-        } }, inputs: { id: "id", label: "label", icon: "icon", disabled: "disabled", tooltip: "tooltip", customLabelTemplate: "customLabelTemplate" }, ngContentSelectors: _c0$D, decls: 1, vars: 0, template: function DrTabComponent_Template(rf, ctx) { if (rf & 1) {
+        } }, inputs: { id: "id", label: "label", icon: "icon", disabled: "disabled", tooltip: "tooltip", customLabelTemplate: "customLabelTemplate" }, standalone: true, features: [i0.ɵɵStandaloneFeature], ngContentSelectors: _c0$D, decls: 1, vars: 0, template: function DrTabComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵprojectionDef();
             i0.ɵɵtemplate(0, DrTabComponent_ng_template_0_Template, 1, 0, "ng-template");
         } }, encapsulation: 2 }); }
@@ -11145,6 +11176,7 @@ class DrTabComponent {
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DrTabComponent, [{
         type: Component,
         args: [{
+                standalone: true,
                 selector: 'dr-tab',
                 template: `
         <ng-template>
@@ -11360,7 +11392,7 @@ class DrTabsComponent {
         } if (rf & 2) {
             let _t;
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.tabsContentList = _t);
-        } }, inputs: { theme: "theme", disableAnimation: "disableAnimation", selectedTab: "selectedTab", selectedTabId: "selectedTabId", withRadio: "withRadio", withIcon: "withIcon", vertical: "vertical", noBodyPadding: "noBodyPadding", hideTabs: "hideTabs", noHeaderBorder: "noHeaderBorder", noLabelBorders: "noLabelBorders", noTabLabelsPadding: "noTabLabelsPadding", noLabelPadding: "noLabelPadding", noFixedTabHeight: "noFixedTabHeight" }, outputs: { selectedTabChange: "selectedTabChange", selectedTabIdChange: "selectedTabIdChange" }, decls: 2, vars: 22, consts: [["disableRipple", "", 3, "ngClass", "selectedIndex", "animationDuration", "selectedIndexChange"], [3, "label", "disabled", 4, "ngFor", "ngForOf"], [3, "label", "disabled"], [4, "ngIf", "ngIfElse"], ["customLabel", ""], [4, "ngTemplateOutlet"], [4, "ngIf"], ["mat-tab-label", ""], [3, "value", "ngModel", "ngModelChange"], [1, "cursor-pointer", 3, "drTooltip"], [1, "icon-tab__wrapper"], [1, "cursor-pointer", 3, "ngClass"]], template: function DrTabsComponent_Template(rf, ctx) { if (rf & 1) {
+        } }, inputs: { theme: "theme", disableAnimation: "disableAnimation", selectedTab: "selectedTab", selectedTabId: "selectedTabId", withRadio: "withRadio", withIcon: "withIcon", vertical: "vertical", noBodyPadding: "noBodyPadding", hideTabs: "hideTabs", noHeaderBorder: "noHeaderBorder", noLabelBorders: "noLabelBorders", noTabLabelsPadding: "noTabLabelsPadding", noLabelPadding: "noLabelPadding", noFixedTabHeight: "noFixedTabHeight" }, outputs: { selectedTabChange: "selectedTabChange", selectedTabIdChange: "selectedTabIdChange" }, standalone: true, features: [i0.ɵɵStandaloneFeature], decls: 2, vars: 22, consts: [["disableRipple", "", 3, "ngClass", "selectedIndex", "animationDuration", "selectedIndexChange"], [3, "label", "disabled", 4, "ngFor", "ngForOf"], [3, "label", "disabled"], [4, "ngIf", "ngIfElse"], ["customLabel", ""], [4, "ngTemplateOutlet"], [4, "ngIf"], ["mat-tab-label", ""], [3, "value", "ngModel", "ngModelChange"], [1, "cursor-pointer", 3, "drTooltip"], [1, "icon-tab__wrapper"], [1, "cursor-pointer", 3, "ngClass"]], template: function DrTabsComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "mat-tab-group", 0);
             i0.ɵɵlistener("selectedIndexChange", function DrTabsComponent_Template_mat_tab_group_selectedIndexChange_0_listener($event) { return ctx.selectedIndexChange($event); });
             i0.ɵɵtemplate(1, DrTabsComponent_mat_tab_1_Template, 5, 5, "mat-tab", 1);
@@ -11370,11 +11402,11 @@ class DrTabsComponent {
             i0.ɵɵproperty("ngClass", ctx.theme)("selectedIndex", ctx._selectedIndex)("animationDuration", ctx.disableAnimation || ctx.vertical || ctx._disableAnimationTemp ? "0ms" : "500ms");
             i0.ɵɵadvance(1);
             i0.ɵɵproperty("ngForOf", ctx.tabsContentList);
-        } }, dependencies: [i1.NgClass, i1.NgForOf, i1.NgIf, i1.NgTemplateOutlet, i2$1.MatTabLabel, i2$1.MatTab, i2$1.MatTabGroup, i2.NgControlStatus, i2.NgModel, RadioButtonComponent, DrTooltipDirective], styles: ["[_nghost-%COMP%]{width:100%}[_nghost-%COMP%]   .cursor-pointer[_ngcontent-%COMP%]{cursor:pointer}[_nghost-%COMP%]     .mat-mdc-tab-group, [_nghost-%COMP%]     .mat-mdc-tab-body-wrapper{height:100%}[_nghost-%COMP%]     .mat-mdc-tab-group{font-family:Poppins,sans-serif}[_nghost-%COMP%]     .mat-mdc-tab-nav-bar, [_nghost-%COMP%]     .mat-mdc-tab-header{border-bottom:1px solid #d5dae5}[_nghost-%COMP%]     .mat-mdc-tab-labels{padding:0 17px}[_nghost-%COMP%]     .mat-mdc-tab, [_nghost-%COMP%]     .mat-mdc-tab:hover{-webkit-tap-highlight-color:#ffffff}[_nghost-%COMP%]     .mat-mdc-tab .mdc-tab__text-label, [_nghost-%COMP%]     .mat-mdc-tab:hover .mdc-tab__text-label{font-weight:400;font-size:14px;line-height:22px;color:#51566f;font-family:Poppins,sans-serif;letter-spacing:0}[_nghost-%COMP%]     .mat-mdc-tab .mdc-tab__ripple{display:none}[_nghost-%COMP%]     .mdc-tab-indicator__content{height:3px;border:none;border-radius:5px;background-color:#4646ce!important}[_nghost-%COMP%]     .mdc-tab{padding:0 8px;min-width:0;height:38px!important;flex-grow:0!important;opacity:1}[_nghost-%COMP%]     .mdc-tab:not(:last-child){margin-right:21px}[_nghost-%COMP%]     .mdc-tab--active .mat-mdc-tab-body-content{transform:unset!important}[_nghost-%COMP%]     .mdc-tab--active .mdc-tab__content .mdc-tab__text-label, [_nghost-%COMP%]     .mdc-tab--active:hover .mdc-tab__content .mdc-tab__text-label, [_nghost-%COMP%]     .mdc-tab--active:focus .mdc-tab__content .mdc-tab__text-label{color:#4646ce;font-weight:700}[_nghost-%COMP%]     .with-radio .mat-mdc-tab-labels{margin-bottom:0;padding:12px 8px}[_nghost-%COMP%]     .with-radio .mdc-tab{padding:0 16px;min-width:0;justify-content:start;height:38px;opacity:1}[_nghost-%COMP%]     .with-radio .mdc-tab:not(:last-child){margin-right:8px}[_nghost-%COMP%]     .with-radio .mdc-tab--active{background:#f6f7f8;border-radius:3px}[_nghost-%COMP%]     .with-radio .mdc-tab--active .mdc-tab__text-label, [_nghost-%COMP%]     .with-radio .mdc-tab--active:hover .mdc-tab__text-label, [_nghost-%COMP%]     .with-radio .mdc-tab--active:focus .mdc-tab__text-label{color:#0c142b;font-weight:600}[_nghost-%COMP%]     .with-radio .mdc-tab-indicator{display:none!important}[_nghost-%COMP%]     .vertical.mat-mdc-tab-group{flex-direction:row}[_nghost-%COMP%]     .vertical .mat-mdc-tab-header{border-bottom:none}[_nghost-%COMP%]     .vertical .mat-mdc-tab-label-container{border-right:1px solid #d5dae5}[_nghost-%COMP%]     .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels{flex-direction:column;padding:0}[_nghost-%COMP%]     .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab{border-bottom:1px solid #d5dae5;margin:0!important;justify-content:flex-start;padding:1rem 2rem;height:40px}[_nghost-%COMP%]     .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab:before{content:\"\";width:2px;height:100%;display:flex;position:absolute;top:0;left:0;border:none;margin:0}[_nghost-%COMP%]     .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab--active{background-color:#f3f7ff}[_nghost-%COMP%]     .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab--active:before{background-color:#151a41}[_nghost-%COMP%]     .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab--active .mdc-tab__text-label{font-weight:400;color:#151a41}[_nghost-%COMP%]     .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab__content{height:auto}[_nghost-%COMP%]     .vertical .mdc-tab-indicator{display:none!important}[_nghost-%COMP%]     .vertical .mat-mdc-tab-body-wrapper{width:100%;padding:16px}[_nghost-%COMP%]     .secondary .mat-mdc-tab-header{border-bottom:none}[_nghost-%COMP%]     .secondary .mat-mdc-tab-labels{justify-content:space-evenly;padding:0;background:#f2f2fb}[_nghost-%COMP%]     .secondary .mdc-tab{flex:1!important;margin:0;border-bottom:1px solid #dfe0e3}[_nghost-%COMP%]     .secondary .mdc-tab+.mdc-tab{border-left:1px solid #dfe0e3}[_nghost-%COMP%]     .secondary .mdc-tab--active{background:#fff;border-bottom:none}[_nghost-%COMP%]     .secondary .mdc-tab--active .mdc-tab__text-label, [_nghost-%COMP%]     .secondary .mdc-tab--active:hover .mdc-tab__text-label, [_nghost-%COMP%]     .secondary .mdc-tab--active:focus .mdc-tab__text-label{color:#25258c}[_nghost-%COMP%]     .secondary .mdc-tab-indicator{display:none}[_nghost-%COMP%]     mat-tab-group.no-body-padding .mat-mdc-tab-body-wrapper{padding:0}[_nghost-%COMP%]     mat-tab-group.no-tab-labels-padding .mat-mdc-tab-labels{padding:0}[_nghost-%COMP%]     mat-tab-group.no-label-padding .mdc-tab{padding:0!important}[_nghost-%COMP%]     mat-tab-group.no-label-padding.vertical .mdc-tab{padding:0 0 0 2px!important}[_nghost-%COMP%]     mat-tab-group.no-tabs .mat-mdc-tab-header{display:none}[_nghost-%COMP%]     mat-tab-group.no-header-border .mat-mdc-tab-header{border:none!important}[_nghost-%COMP%]     mat-tab-group.no-header-border .mat-mdc-tab-header .mat-mdc-tab-label-container{border:none!important}[_nghost-%COMP%]     mat-tab-group.no-label-borders .mdc-tab{border:none!important}[_nghost-%COMP%]     mat-tab-group.no-fixed-tab-height .mdc-tab{height:auto!important}"] }); }
+        } }, dependencies: [CommonModule, i1.NgClass, i1.NgForOf, i1.NgIf, i1.NgTemplateOutlet, MatTabsModule, i2$1.MatTabLabel, i2$1.MatTab, i2$1.MatTabGroup, FormsModule, i2.NgControlStatus, i2.NgModel, DrInputsModule, RadioButtonComponent, DrTooltipModule, DrTooltipDirective], styles: ["[_nghost-%COMP%]{width:100%}[_nghost-%COMP%]   .cursor-pointer[_ngcontent-%COMP%]{cursor:pointer}[_nghost-%COMP%]     .mat-mdc-tab-group, [_nghost-%COMP%]     .mat-mdc-tab-body-wrapper{height:100%}[_nghost-%COMP%]     .mat-mdc-tab-group{font-family:Poppins,sans-serif}[_nghost-%COMP%]     .mat-mdc-tab-nav-bar, [_nghost-%COMP%]     .mat-mdc-tab-header{border-bottom:1px solid #d5dae5}[_nghost-%COMP%]     .mat-mdc-tab-labels{padding:0 17px}[_nghost-%COMP%]     .mat-mdc-tab, [_nghost-%COMP%]     .mat-mdc-tab:hover{-webkit-tap-highlight-color:#ffffff}[_nghost-%COMP%]     .mat-mdc-tab .mdc-tab__text-label, [_nghost-%COMP%]     .mat-mdc-tab:hover .mdc-tab__text-label{font-weight:400;font-size:14px;line-height:22px;color:#51566f;font-family:Poppins,sans-serif;letter-spacing:0}[_nghost-%COMP%]     .mat-mdc-tab .mdc-tab__ripple{display:none}[_nghost-%COMP%]     .mdc-tab-indicator__content{height:3px;border:none;border-radius:5px;background-color:#4646ce!important}[_nghost-%COMP%]     .mdc-tab{padding:0 8px;min-width:0;height:38px!important;flex-grow:0!important;opacity:1}[_nghost-%COMP%]     .mdc-tab:not(:last-child){margin-right:21px}[_nghost-%COMP%]     .mdc-tab--active .mat-mdc-tab-body-content{transform:unset!important}[_nghost-%COMP%]     .mdc-tab--active .mdc-tab__content .mdc-tab__text-label, [_nghost-%COMP%]     .mdc-tab--active:hover .mdc-tab__content .mdc-tab__text-label, [_nghost-%COMP%]     .mdc-tab--active:focus .mdc-tab__content .mdc-tab__text-label{color:#4646ce;font-weight:700}[_nghost-%COMP%]     .with-radio .mat-mdc-tab-labels{margin-bottom:0;padding:12px 8px}[_nghost-%COMP%]     .with-radio .mdc-tab{padding:0 16px;min-width:0;justify-content:start;height:38px;opacity:1}[_nghost-%COMP%]     .with-radio .mdc-tab:not(:last-child){margin-right:8px}[_nghost-%COMP%]     .with-radio .mdc-tab--active{background:#f6f7f8;border-radius:3px}[_nghost-%COMP%]     .with-radio .mdc-tab--active .mdc-tab__text-label, [_nghost-%COMP%]     .with-radio .mdc-tab--active:hover .mdc-tab__text-label, [_nghost-%COMP%]     .with-radio .mdc-tab--active:focus .mdc-tab__text-label{color:#0c142b;font-weight:600}[_nghost-%COMP%]     .with-radio .mdc-tab-indicator{display:none!important}[_nghost-%COMP%]     .vertical.mat-mdc-tab-group{flex-direction:row}[_nghost-%COMP%]     .vertical .mat-mdc-tab-header{border-bottom:none}[_nghost-%COMP%]     .vertical .mat-mdc-tab-label-container{border-right:1px solid #d5dae5}[_nghost-%COMP%]     .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels{flex-direction:column;padding:0}[_nghost-%COMP%]     .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab{border-bottom:1px solid #d5dae5;margin:0!important;justify-content:flex-start;padding:1rem 2rem;height:40px}[_nghost-%COMP%]     .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab:before{content:\"\";width:2px;height:100%;display:flex;position:absolute;top:0;left:0;border:none;margin:0}[_nghost-%COMP%]     .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab--active{background-color:#f3f7ff}[_nghost-%COMP%]     .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab--active:before{background-color:#151a41}[_nghost-%COMP%]     .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab--active .mdc-tab__text-label{font-weight:400;color:#151a41}[_nghost-%COMP%]     .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab__content{height:auto}[_nghost-%COMP%]     .vertical .mdc-tab-indicator{display:none!important}[_nghost-%COMP%]     .vertical .mat-mdc-tab-body-wrapper{width:100%;padding:16px}[_nghost-%COMP%]     .secondary .mat-mdc-tab-header{border-bottom:none}[_nghost-%COMP%]     .secondary .mat-mdc-tab-labels{justify-content:space-evenly;padding:0;background:#f2f2fb}[_nghost-%COMP%]     .secondary .mdc-tab{flex:1!important;margin:0;border-bottom:1px solid #dfe0e3}[_nghost-%COMP%]     .secondary .mdc-tab+.mdc-tab{border-left:1px solid #dfe0e3}[_nghost-%COMP%]     .secondary .mdc-tab--active{background:#fff;border-bottom:none}[_nghost-%COMP%]     .secondary .mdc-tab--active .mdc-tab__text-label, [_nghost-%COMP%]     .secondary .mdc-tab--active:hover .mdc-tab__text-label, [_nghost-%COMP%]     .secondary .mdc-tab--active:focus .mdc-tab__text-label{color:#25258c}[_nghost-%COMP%]     .secondary .mdc-tab-indicator{display:none}[_nghost-%COMP%]     mat-tab-group.no-body-padding .mat-mdc-tab-body-wrapper{padding:0}[_nghost-%COMP%]     mat-tab-group.no-tab-labels-padding .mat-mdc-tab-labels{padding:0}[_nghost-%COMP%]     mat-tab-group.no-label-padding .mdc-tab{padding:0!important}[_nghost-%COMP%]     mat-tab-group.no-label-padding.vertical .mdc-tab{padding:0 0 0 2px!important}[_nghost-%COMP%]     mat-tab-group.no-tabs .mat-mdc-tab-header{display:none}[_nghost-%COMP%]     mat-tab-group.no-header-border .mat-mdc-tab-header{border:none!important}[_nghost-%COMP%]     mat-tab-group.no-header-border .mat-mdc-tab-header .mat-mdc-tab-label-container{border:none!important}[_nghost-%COMP%]     mat-tab-group.no-label-borders .mdc-tab{border:none!important}[_nghost-%COMP%]     mat-tab-group.no-fixed-tab-height .mdc-tab{height:auto!important}"] }); }
 }
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DrTabsComponent, [{
         type: Component,
-        args: [{ selector: 'dr-tabs', template: "<mat-tab-group\n    disableRipple\n    [ngClass]=\"theme\"\n    [selectedIndex]=\"_selectedIndex\"\n    (selectedIndexChange)=\"selectedIndexChange($event)\"\n    [class.with-radio]=\"withRadio\"\n    [class.vertical]=\"vertical\"\n    [class.no-tab-labels-padding]=\"noTabLabelsPadding\"\n    [class.no-label-padding]=\"noLabelPadding\"\n    [class.no-body-padding]=\"noBodyPadding\"\n    [class.no-tabs]=\"hideTabs\"\n    [class.no-header-border]=\"noHeaderBorder\"\n    [class.no-label-borders]=\"noLabelBorders\"\n    [class.no-fixed-tab-height]=\"noFixedTabHeight\"\n    [animationDuration]=\"disableAnimation || vertical || _disableAnimationTemp ? '0ms' : '500ms'\">\n    <mat-tab *ngFor=\"let tab of tabsContentList; let index = index\" label=\"{{ tab.label }}\" [disabled]=\"tab.disabled\">\n        <ng-container *ngIf=\"!tab.customLabelTemplate; else customLabel\">\n            <ng-container *ngIf=\"withRadio\">\n                <ng-template mat-tab-label>\n                    <dr-radio-button [value]=\"index\" [(ngModel)]=\"_selectedIndex\"> </dr-radio-button>\n                    {{ tab.label }}\n                </ng-template>\n            </ng-container>\n            <ng-container *ngIf=\"tab.tooltip && !withRadio && !withIcon\">\n                <ng-template mat-tab-label>\n                    <label class=\"cursor-pointer\" [drTooltip]=\"tab.tooltip\">{{ tab.label }}</label>\n                </ng-template>\n            </ng-container>\n            <ng-container *ngIf=\"withIcon\">\n                <ng-template mat-tab-label>\n                    <span class=\"icon-tab__wrapper\">\n                        <i [ngClass]=\"tab.icon\" class=\"cursor-pointer\"></i>\n                    </span>\n                </ng-template>\n            </ng-container>\n            <ng-container *ngIf=\"withIcon\">\n                <ng-template mat-tab-label>\n                    <span class=\"icon-tab__wrapper\">\n                        <i [ngClass]=\"tab.icon\" class=\"cursor-pointer\"></i>\n                    </span>\n                </ng-template>\n            </ng-container>\n        </ng-container>\n        <ng-template #customLabel>\n            <ng-template mat-tab-label>\n                <ng-container *ngTemplateOutlet=\"tab.customLabelTemplate\"></ng-container>\n            </ng-template>\n        </ng-template>\n        <ng-container *ngTemplateOutlet=\"tab.contentTemplate\"></ng-container>\n    </mat-tab>\n</mat-tab-group>\n", styles: [":host{width:100%}:host .cursor-pointer{cursor:pointer}:host ::ng-deep .mat-mdc-tab-group,:host ::ng-deep .mat-mdc-tab-body-wrapper{height:100%}:host ::ng-deep .mat-mdc-tab-group{font-family:Poppins,sans-serif}:host ::ng-deep .mat-mdc-tab-nav-bar,:host ::ng-deep .mat-mdc-tab-header{border-bottom:1px solid #d5dae5}:host ::ng-deep .mat-mdc-tab-labels{padding:0 17px}:host ::ng-deep .mat-mdc-tab,:host ::ng-deep .mat-mdc-tab:hover{-webkit-tap-highlight-color:#ffffff}:host ::ng-deep .mat-mdc-tab .mdc-tab__text-label,:host ::ng-deep .mat-mdc-tab:hover .mdc-tab__text-label{font-weight:400;font-size:14px;line-height:22px;color:#51566f;font-family:Poppins,sans-serif;letter-spacing:0}:host ::ng-deep .mat-mdc-tab .mdc-tab__ripple{display:none}:host ::ng-deep .mdc-tab-indicator__content{height:3px;border:none;border-radius:5px;background-color:#4646ce!important}:host ::ng-deep .mdc-tab{padding:0 8px;min-width:0;height:38px!important;flex-grow:0!important;opacity:1}:host ::ng-deep .mdc-tab:not(:last-child){margin-right:21px}:host ::ng-deep .mdc-tab--active .mat-mdc-tab-body-content{transform:unset!important}:host ::ng-deep .mdc-tab--active .mdc-tab__content .mdc-tab__text-label,:host ::ng-deep .mdc-tab--active:hover .mdc-tab__content .mdc-tab__text-label,:host ::ng-deep .mdc-tab--active:focus .mdc-tab__content .mdc-tab__text-label{color:#4646ce;font-weight:700}:host ::ng-deep .with-radio .mat-mdc-tab-labels{margin-bottom:0;padding:12px 8px}:host ::ng-deep .with-radio .mdc-tab{padding:0 16px;min-width:0;justify-content:start;height:38px;opacity:1}:host ::ng-deep .with-radio .mdc-tab:not(:last-child){margin-right:8px}:host ::ng-deep .with-radio .mdc-tab--active{background:#f6f7f8;border-radius:3px}:host ::ng-deep .with-radio .mdc-tab--active .mdc-tab__text-label,:host ::ng-deep .with-radio .mdc-tab--active:hover .mdc-tab__text-label,:host ::ng-deep .with-radio .mdc-tab--active:focus .mdc-tab__text-label{color:#0c142b;font-weight:600}:host ::ng-deep .with-radio .mdc-tab-indicator{display:none!important}:host ::ng-deep .vertical.mat-mdc-tab-group{flex-direction:row}:host ::ng-deep .vertical .mat-mdc-tab-header{border-bottom:none}:host ::ng-deep .vertical .mat-mdc-tab-label-container{border-right:1px solid #d5dae5}:host ::ng-deep .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels{flex-direction:column;padding:0}:host ::ng-deep .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab{border-bottom:1px solid #d5dae5;margin:0!important;justify-content:flex-start;padding:1rem 2rem;height:40px}:host ::ng-deep .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab:before{content:\"\";width:2px;height:100%;display:flex;position:absolute;top:0;left:0;border:none;margin:0}:host ::ng-deep .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab--active{background-color:#f3f7ff}:host ::ng-deep .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab--active:before{background-color:#151a41}:host ::ng-deep .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab--active .mdc-tab__text-label{font-weight:400;color:#151a41}:host ::ng-deep .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab__content{height:auto}:host ::ng-deep .vertical .mdc-tab-indicator{display:none!important}:host ::ng-deep .vertical .mat-mdc-tab-body-wrapper{width:100%;padding:16px}:host ::ng-deep .secondary .mat-mdc-tab-header{border-bottom:none}:host ::ng-deep .secondary .mat-mdc-tab-labels{justify-content:space-evenly;padding:0;background:#f2f2fb}:host ::ng-deep .secondary .mdc-tab{flex:1!important;margin:0;border-bottom:1px solid #dfe0e3}:host ::ng-deep .secondary .mdc-tab+.mdc-tab{border-left:1px solid #dfe0e3}:host ::ng-deep .secondary .mdc-tab--active{background:#fff;border-bottom:none}:host ::ng-deep .secondary .mdc-tab--active .mdc-tab__text-label,:host ::ng-deep .secondary .mdc-tab--active:hover .mdc-tab__text-label,:host ::ng-deep .secondary .mdc-tab--active:focus .mdc-tab__text-label{color:#25258c}:host ::ng-deep .secondary .mdc-tab-indicator{display:none}:host ::ng-deep mat-tab-group.no-body-padding .mat-mdc-tab-body-wrapper{padding:0}:host ::ng-deep mat-tab-group.no-tab-labels-padding .mat-mdc-tab-labels{padding:0}:host ::ng-deep mat-tab-group.no-label-padding .mdc-tab{padding:0!important}:host ::ng-deep mat-tab-group.no-label-padding.vertical .mdc-tab{padding:0 0 0 2px!important}:host ::ng-deep mat-tab-group.no-tabs .mat-mdc-tab-header{display:none}:host ::ng-deep mat-tab-group.no-header-border .mat-mdc-tab-header{border:none!important}:host ::ng-deep mat-tab-group.no-header-border .mat-mdc-tab-header .mat-mdc-tab-label-container{border:none!important}:host ::ng-deep mat-tab-group.no-label-borders .mdc-tab{border:none!important}:host ::ng-deep mat-tab-group.no-fixed-tab-height .mdc-tab{height:auto!important}\n"] }]
+        args: [{ standalone: true, imports: [CommonModule, MatTabsModule, FormsModule, DrInputsModule, DrTooltipModule], selector: 'dr-tabs', template: "<mat-tab-group\n    disableRipple\n    [ngClass]=\"theme\"\n    [selectedIndex]=\"_selectedIndex\"\n    (selectedIndexChange)=\"selectedIndexChange($event)\"\n    [class.with-radio]=\"withRadio\"\n    [class.vertical]=\"vertical\"\n    [class.no-tab-labels-padding]=\"noTabLabelsPadding\"\n    [class.no-label-padding]=\"noLabelPadding\"\n    [class.no-body-padding]=\"noBodyPadding\"\n    [class.no-tabs]=\"hideTabs\"\n    [class.no-header-border]=\"noHeaderBorder\"\n    [class.no-label-borders]=\"noLabelBorders\"\n    [class.no-fixed-tab-height]=\"noFixedTabHeight\"\n    [animationDuration]=\"disableAnimation || vertical || _disableAnimationTemp ? '0ms' : '500ms'\">\n    <mat-tab *ngFor=\"let tab of tabsContentList; let index = index\" label=\"{{ tab.label }}\" [disabled]=\"tab.disabled\">\n        <ng-container *ngIf=\"!tab.customLabelTemplate; else customLabel\">\n            <ng-container *ngIf=\"withRadio\">\n                <ng-template mat-tab-label>\n                    <dr-radio-button [value]=\"index\" [(ngModel)]=\"_selectedIndex\"> </dr-radio-button>\n                    {{ tab.label }}\n                </ng-template>\n            </ng-container>\n            <ng-container *ngIf=\"tab.tooltip && !withRadio && !withIcon\">\n                <ng-template mat-tab-label>\n                    <label class=\"cursor-pointer\" [drTooltip]=\"tab.tooltip\">{{ tab.label }}</label>\n                </ng-template>\n            </ng-container>\n            <ng-container *ngIf=\"withIcon\">\n                <ng-template mat-tab-label>\n                    <span class=\"icon-tab__wrapper\">\n                        <i [ngClass]=\"tab.icon\" class=\"cursor-pointer\"></i>\n                    </span>\n                </ng-template>\n            </ng-container>\n            <ng-container *ngIf=\"withIcon\">\n                <ng-template mat-tab-label>\n                    <span class=\"icon-tab__wrapper\">\n                        <i [ngClass]=\"tab.icon\" class=\"cursor-pointer\"></i>\n                    </span>\n                </ng-template>\n            </ng-container>\n        </ng-container>\n        <ng-template #customLabel>\n            <ng-template mat-tab-label>\n                <ng-container *ngTemplateOutlet=\"tab.customLabelTemplate\"></ng-container>\n            </ng-template>\n        </ng-template>\n        <ng-container *ngTemplateOutlet=\"tab.contentTemplate\"></ng-container>\n    </mat-tab>\n</mat-tab-group>\n", styles: [":host{width:100%}:host .cursor-pointer{cursor:pointer}:host ::ng-deep .mat-mdc-tab-group,:host ::ng-deep .mat-mdc-tab-body-wrapper{height:100%}:host ::ng-deep .mat-mdc-tab-group{font-family:Poppins,sans-serif}:host ::ng-deep .mat-mdc-tab-nav-bar,:host ::ng-deep .mat-mdc-tab-header{border-bottom:1px solid #d5dae5}:host ::ng-deep .mat-mdc-tab-labels{padding:0 17px}:host ::ng-deep .mat-mdc-tab,:host ::ng-deep .mat-mdc-tab:hover{-webkit-tap-highlight-color:#ffffff}:host ::ng-deep .mat-mdc-tab .mdc-tab__text-label,:host ::ng-deep .mat-mdc-tab:hover .mdc-tab__text-label{font-weight:400;font-size:14px;line-height:22px;color:#51566f;font-family:Poppins,sans-serif;letter-spacing:0}:host ::ng-deep .mat-mdc-tab .mdc-tab__ripple{display:none}:host ::ng-deep .mdc-tab-indicator__content{height:3px;border:none;border-radius:5px;background-color:#4646ce!important}:host ::ng-deep .mdc-tab{padding:0 8px;min-width:0;height:38px!important;flex-grow:0!important;opacity:1}:host ::ng-deep .mdc-tab:not(:last-child){margin-right:21px}:host ::ng-deep .mdc-tab--active .mat-mdc-tab-body-content{transform:unset!important}:host ::ng-deep .mdc-tab--active .mdc-tab__content .mdc-tab__text-label,:host ::ng-deep .mdc-tab--active:hover .mdc-tab__content .mdc-tab__text-label,:host ::ng-deep .mdc-tab--active:focus .mdc-tab__content .mdc-tab__text-label{color:#4646ce;font-weight:700}:host ::ng-deep .with-radio .mat-mdc-tab-labels{margin-bottom:0;padding:12px 8px}:host ::ng-deep .with-radio .mdc-tab{padding:0 16px;min-width:0;justify-content:start;height:38px;opacity:1}:host ::ng-deep .with-radio .mdc-tab:not(:last-child){margin-right:8px}:host ::ng-deep .with-radio .mdc-tab--active{background:#f6f7f8;border-radius:3px}:host ::ng-deep .with-radio .mdc-tab--active .mdc-tab__text-label,:host ::ng-deep .with-radio .mdc-tab--active:hover .mdc-tab__text-label,:host ::ng-deep .with-radio .mdc-tab--active:focus .mdc-tab__text-label{color:#0c142b;font-weight:600}:host ::ng-deep .with-radio .mdc-tab-indicator{display:none!important}:host ::ng-deep .vertical.mat-mdc-tab-group{flex-direction:row}:host ::ng-deep .vertical .mat-mdc-tab-header{border-bottom:none}:host ::ng-deep .vertical .mat-mdc-tab-label-container{border-right:1px solid #d5dae5}:host ::ng-deep .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels{flex-direction:column;padding:0}:host ::ng-deep .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab{border-bottom:1px solid #d5dae5;margin:0!important;justify-content:flex-start;padding:1rem 2rem;height:40px}:host ::ng-deep .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab:before{content:\"\";width:2px;height:100%;display:flex;position:absolute;top:0;left:0;border:none;margin:0}:host ::ng-deep .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab--active{background-color:#f3f7ff}:host ::ng-deep .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab--active:before{background-color:#151a41}:host ::ng-deep .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab--active .mdc-tab__text-label{font-weight:400;color:#151a41}:host ::ng-deep .vertical .mat-mdc-tab-label-container .mat-mdc-tab-labels .mdc-tab__content{height:auto}:host ::ng-deep .vertical .mdc-tab-indicator{display:none!important}:host ::ng-deep .vertical .mat-mdc-tab-body-wrapper{width:100%;padding:16px}:host ::ng-deep .secondary .mat-mdc-tab-header{border-bottom:none}:host ::ng-deep .secondary .mat-mdc-tab-labels{justify-content:space-evenly;padding:0;background:#f2f2fb}:host ::ng-deep .secondary .mdc-tab{flex:1!important;margin:0;border-bottom:1px solid #dfe0e3}:host ::ng-deep .secondary .mdc-tab+.mdc-tab{border-left:1px solid #dfe0e3}:host ::ng-deep .secondary .mdc-tab--active{background:#fff;border-bottom:none}:host ::ng-deep .secondary .mdc-tab--active .mdc-tab__text-label,:host ::ng-deep .secondary .mdc-tab--active:hover .mdc-tab__text-label,:host ::ng-deep .secondary .mdc-tab--active:focus .mdc-tab__text-label{color:#25258c}:host ::ng-deep .secondary .mdc-tab-indicator{display:none}:host ::ng-deep mat-tab-group.no-body-padding .mat-mdc-tab-body-wrapper{padding:0}:host ::ng-deep mat-tab-group.no-tab-labels-padding .mat-mdc-tab-labels{padding:0}:host ::ng-deep mat-tab-group.no-label-padding .mdc-tab{padding:0!important}:host ::ng-deep mat-tab-group.no-label-padding.vertical .mdc-tab{padding:0 0 0 2px!important}:host ::ng-deep mat-tab-group.no-tabs .mat-mdc-tab-header{display:none}:host ::ng-deep mat-tab-group.no-header-border .mat-mdc-tab-header{border:none!important}:host ::ng-deep mat-tab-group.no-header-border .mat-mdc-tab-header .mat-mdc-tab-label-container{border:none!important}:host ::ng-deep mat-tab-group.no-label-borders .mdc-tab{border:none!important}:host ::ng-deep mat-tab-group.no-fixed-tab-height .mdc-tab{height:auto!important}\n"] }]
     }], function () { return [{ type: i0.ChangeDetectorRef }]; }, { theme: [{
             type: Input
         }], disableAnimation: [{
@@ -11446,14 +11478,14 @@ class DrAccordionComponent {
     /** @nocollapse */ static { this.ɵfac = function DrAccordionComponent_Factory(t) { return new (t || DrAccordionComponent)(); }; }
     /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: DrAccordionComponent, selectors: [["dr-accordion"]], hostVars: 2, hostBindings: function DrAccordionComponent_HostBindings(rf, ctx) { if (rf & 2) {
             i0.ɵɵclassMap(ctx.theme);
-        } }, inputs: { multi: "multi", theme: "theme" }, ngContentSelectors: _c1$f, decls: 1, vars: 0, template: function DrAccordionComponent_Template(rf, ctx) { if (rf & 1) {
+        } }, inputs: { multi: "multi", theme: "theme" }, standalone: true, features: [i0.ɵɵStandaloneFeature], ngContentSelectors: _c1$f, decls: 1, vars: 0, template: function DrAccordionComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵprojectionDef(_c0$C);
             i0.ɵɵprojection(0);
         } }, styles: ["[_nghost-%COMP%]{display:block;box-shadow:#2c33491a 0 5px 10px}.borderless[_nghost-%COMP%]{box-shadow:none}"], changeDetection: 0 }); }
 }
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DrAccordionComponent, [{
         type: Component,
-        args: [{ selector: 'dr-accordion', template: '<ng-content select="dr-accordion-item"></ng-content>', changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{display:block;box-shadow:#2c33491a 0 5px 10px}:host.borderless{box-shadow:none}\n"] }]
+        args: [{ standalone: true, selector: 'dr-accordion', template: '<ng-content select="dr-accordion-item"></ng-content>', changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{display:block;box-shadow:#2c33491a 0 5px 10px}:host.borderless{box-shadow:none}\n"] }]
     }], null, { multi: [{
             type: Input,
             args: ['multi']
@@ -11565,7 +11597,7 @@ class DrAccordionItemComponent {
     /** @nocollapse */ static { this.ɵfac = function DrAccordionItemComponent_Factory(t) { return new (t || DrAccordionItemComponent)(i0.ɵɵdirectiveInject(DrAccordionComponent, 1), i0.ɵɵdirectiveInject(i0.ChangeDetectorRef)); }; }
     /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: DrAccordionItemComponent, selectors: [["dr-accordion-item"]], hostVars: 6, hostBindings: function DrAccordionItemComponent_HostBindings(rf, ctx) { if (rf & 2) {
             i0.ɵɵclassProp("collapsed", ctx.collapsed)("expanded", ctx.expanded)("disabled", ctx.disabled);
-        } }, inputs: { collapsed: "collapsed", expanded: "expanded", disabled: "disabled" }, outputs: { collapsedChange: "collapsedChange" }, features: [i0.ɵɵNgOnChangesFeature], ngContentSelectors: _c1$e, decls: 2, vars: 0, template: function DrAccordionItemComponent_Template(rf, ctx) { if (rf & 1) {
+        } }, inputs: { collapsed: "collapsed", expanded: "expanded", disabled: "disabled" }, outputs: { collapsedChange: "collapsedChange" }, standalone: true, features: [i0.ɵɵNgOnChangesFeature, i0.ɵɵStandaloneFeature], ngContentSelectors: _c1$e, decls: 2, vars: 0, template: function DrAccordionItemComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵprojectionDef(_c0$B);
             i0.ɵɵprojection(0);
             i0.ɵɵprojection(1, 1);
@@ -11573,7 +11605,7 @@ class DrAccordionItemComponent {
 }
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DrAccordionItemComponent, [{
         type: Component,
-        args: [{ selector: 'dr-accordion-item', template: `
+        args: [{ standalone: true, selector: 'dr-accordion-item', template: `
         <ng-content select="dr-accordion-item-header"></ng-content>
         <ng-content select="dr-accordion-item-body"></ng-content>
     `, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{background-color:#fff;color:#222b45;font-family:Poppins,sans-serif;font-size:16px;font-weight:400;line-height:1.25rem;display:flex;flex-direction:column}\n"] }]
@@ -11676,7 +11708,7 @@ class DrAccordionItemHeaderComponent {
             i0.ɵɵattribute("aria-expanded", ctx.expanded)("tabindex", ctx.tabbable)("aria-disabled", ctx.disabled);
             i0.ɵɵclassMap(ctx.theme);
             i0.ɵɵclassProp("accordion-item-header-collapsed", ctx.isCollapsed)("accordion-item-header-expanded", ctx.expanded);
-        } }, inputs: { chevronOrientation: "chevronOrientation", chevronPosition: "chevronPosition", icon: "icon", toggleOnChevronClick: "toggleOnChevronClick" }, ngContentSelectors: _c3$2, decls: 5, vars: 2, consts: [[3, "class", "dr-accordion-item-header-icon--additional-padding", 4, "ngIf"], [3, "class", "click", 4, "ngIf"], [3, "click"]], template: function DrAccordionItemHeaderComponent_Template(rf, ctx) { if (rf & 1) {
+        } }, inputs: { chevronOrientation: "chevronOrientation", chevronPosition: "chevronPosition", icon: "icon", toggleOnChevronClick: "toggleOnChevronClick" }, standalone: true, features: [i0.ɵɵStandaloneFeature], ngContentSelectors: _c3$2, decls: 5, vars: 2, consts: [[3, "class", "dr-accordion-item-header-icon--additional-padding", 4, "ngIf"], [3, "class", "click", 4, "ngIf"], [3, "click"]], template: function DrAccordionItemHeaderComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵprojectionDef(_c2$4);
             i0.ɵɵtemplate(0, DrAccordionItemHeaderComponent_i_0_Template, 1, 4, "i", 0);
             i0.ɵɵtemplate(1, DrAccordionItemHeaderComponent_i_1_Template, 1, 8, "i", 1);
@@ -11687,7 +11719,7 @@ class DrAccordionItemHeaderComponent {
             i0.ɵɵproperty("ngIf", ctx.icon);
             i0.ɵɵadvance(1);
             i0.ɵɵproperty("ngIf", !ctx.disabled);
-        } }, dependencies: [i1.NgIf], styles: ["[_nghost-%COMP%]{font-size:14px;line-height:24px;font-weight:600;display:flex;align-items:center;cursor:pointer;position:relative;border-bottom:1px solid #edf1f7;color:#222b45;font-family:Poppins,sans-serif;padding:1.25rem;text-transform:capitalize}[_nghost-%COMP%]:focus{outline:0}[_nghost-%COMP%]   .expansion-indicator--right[_ngcontent-%COMP%]{position:absolute;right:10px}[_nghost-%COMP%]   .expansion-indicator--left[_ngcontent-%COMP%]{position:relative;left:-4px}[_nghost-%COMP%]   .dr-accordion-item-header-icon[_ngcontent-%COMP%]{padding-right:8px}.borderless[_nghost-%COMP%]{border:none!important;padding-left:0}.borderless[_nghost-%COMP%]   .expansion-indicator[_ngcontent-%COMP%]{color:#6d6e6f}"], data: { animation: [
+        } }, dependencies: [CommonModule, i1.NgIf], styles: ["[_nghost-%COMP%]{font-size:14px;line-height:24px;font-weight:600;display:flex;align-items:center;cursor:pointer;position:relative;border-bottom:1px solid #edf1f7;color:#222b45;font-family:Poppins,sans-serif;padding:1.25rem;text-transform:capitalize}[_nghost-%COMP%]:focus{outline:0}[_nghost-%COMP%]   .expansion-indicator--right[_ngcontent-%COMP%]{position:absolute;right:10px}[_nghost-%COMP%]   .expansion-indicator--left[_ngcontent-%COMP%]{position:relative;left:-4px}[_nghost-%COMP%]   .dr-accordion-item-header-icon[_ngcontent-%COMP%]{padding-right:8px}.borderless[_nghost-%COMP%]{border:none!important;padding-left:0}.borderless[_nghost-%COMP%]   .expansion-indicator[_ngcontent-%COMP%]{color:#6d6e6f}"], data: { animation: [
                 trigger('expansionIndicator', [
                     state('expanded', style({
                         transform: 'rotate({{ rotationDegree }}deg)',
@@ -11699,7 +11731,7 @@ class DrAccordionItemHeaderComponent {
 }
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DrAccordionItemHeaderComponent, [{
         type: Component,
-        args: [{ selector: 'dr-accordion-item-header', animations: [
+        args: [{ standalone: true, imports: [CommonModule], selector: 'dr-accordion-item-header', animations: [
                     trigger('expansionIndicator', [
                         state('expanded', style({
                             transform: 'rotate({{ rotationDegree }}deg)',
@@ -11779,7 +11811,7 @@ class DrAccordionItemBodyComponent {
         this.destroy$.complete();
     }
     /** @nocollapse */ static { this.ɵfac = function DrAccordionItemBodyComponent_Factory(t) { return new (t || DrAccordionItemBodyComponent)(i0.ɵɵdirectiveInject(DrAccordionItemComponent, 1), i0.ɵɵdirectiveInject(i0.ChangeDetectorRef)); }; }
-    /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: DrAccordionItemBodyComponent, selectors: [["dr-accordion-item-body"]], ngContentSelectors: _c1$c, decls: 3, vars: 3, consts: [[1, "item-body"]], template: function DrAccordionItemBodyComponent_Template(rf, ctx) { if (rf & 1) {
+    /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: DrAccordionItemBodyComponent, selectors: [["dr-accordion-item-body"]], standalone: true, features: [i0.ɵɵStandaloneFeature], ngContentSelectors: _c1$c, decls: 3, vars: 3, consts: [[1, "item-body"]], template: function DrAccordionItemBodyComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵprojectionDef();
             i0.ɵɵelementStart(0, "div")(1, "div", 0);
             i0.ɵɵprojection(2);
@@ -11790,7 +11822,7 @@ class DrAccordionItemBodyComponent {
 }
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DrAccordionItemBodyComponent, [{
         type: Component,
-        args: [{ selector: 'dr-accordion-item-body', template: `
+        args: [{ standalone: true, selector: 'dr-accordion-item-body', template: `
         <div [@accordionItemBody]="{ value: state }">
             <div class="item-body">
                 <ng-content></ng-content>
@@ -11806,7 +11838,7 @@ const _c1$b = ["dr-layout-header", "dr-layout-body"];
 class DrLayoutComponent {
     constructor() { }
     /** @nocollapse */ static { this.ɵfac = function DrLayoutComponent_Factory(t) { return new (t || DrLayoutComponent)(); }; }
-    /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: DrLayoutComponent, selectors: [["dr-layout"]], ngContentSelectors: _c1$b, decls: 6, vars: 0, consts: [[1, "dr-layout"], [1, "dr-layout__container"], [1, "content"], [1, "columns"]], template: function DrLayoutComponent_Template(rf, ctx) { if (rf & 1) {
+    /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: DrLayoutComponent, selectors: [["dr-layout"]], standalone: true, features: [i0.ɵɵStandaloneFeature], ngContentSelectors: _c1$b, decls: 6, vars: 0, consts: [[1, "dr-layout"], [1, "dr-layout__container"], [1, "content"], [1, "columns"]], template: function DrLayoutComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵprojectionDef(_c0$y);
             i0.ɵɵelementStart(0, "div", 0);
             i0.ɵɵprojection(1);
@@ -11817,14 +11849,14 @@ class DrLayoutComponent {
 }
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DrLayoutComponent, [{
         type: Component,
-        args: [{ selector: 'dr-layout', template: "<div class=\"dr-layout\">\n    <ng-content select=\"dr-layout-header\"></ng-content>\n    <div class=\"dr-layout__container\">\n        <div class=\"content\">\n            <div class=\"columns\">\n                <ng-content select=\"dr-layout-body\"></ng-content>\n            </div>\n        </div>\n    </div>\n</div>\n", styles: [":host{font-size:16px;font-weight:400;font-family:Poppins,sans-serif;line-height:1.25rem;-webkit-font-smoothing:antialiased}:host .dr-layout{display:flex;flex-direction:column;min-height:100vh;font-size:16px;font-weight:400;line-height:1.4rem}:host .dr-layout ::ng-deep dr-layout-header{display:block;position:fixed;top:0;left:0;right:0;z-index:1040}:host .dr-layout ::ng-deep dr-layout-header nav{align-items:center;justify-content:flex-start;display:flex}:host .dr-layout__container{display:flex;flex:1;-ms-flex:1 1 auto;flex-direction:row}:host .dr-layout__container .content{display:flex;flex:1;-ms-flex:1 1 auto;flex-direction:column;min-width:0}:host .dr-layout__container .content .columns{display:flex;flex:1;-ms-flex:1 1 auto;flex-direction:row;width:100%}:host .dr-layout__container .content .columns ::ng-deep dr-layout-body{flex:1 0;min-width:0}\n"] }]
+        args: [{ standalone: true, selector: 'dr-layout', template: "<div class=\"dr-layout\">\n    <ng-content select=\"dr-layout-header\"></ng-content>\n    <div class=\"dr-layout__container\">\n        <div class=\"content\">\n            <div class=\"columns\">\n                <ng-content select=\"dr-layout-body\"></ng-content>\n            </div>\n        </div>\n    </div>\n</div>\n", styles: [":host{font-size:16px;font-weight:400;font-family:Poppins,sans-serif;line-height:1.25rem;-webkit-font-smoothing:antialiased}:host .dr-layout{display:flex;flex-direction:column;min-height:100vh;font-size:16px;font-weight:400;line-height:1.4rem}:host .dr-layout ::ng-deep dr-layout-header{display:block;position:fixed;top:0;left:0;right:0;z-index:1040}:host .dr-layout ::ng-deep dr-layout-header nav{align-items:center;justify-content:flex-start;display:flex}:host .dr-layout__container{display:flex;flex:1;-ms-flex:1 1 auto;flex-direction:row}:host .dr-layout__container .content{display:flex;flex:1;-ms-flex:1 1 auto;flex-direction:column;min-width:0}:host .dr-layout__container .content .columns{display:flex;flex:1;-ms-flex:1 1 auto;flex-direction:row;width:100%}:host .dr-layout__container .content .columns ::ng-deep dr-layout-body{flex:1 0;min-width:0}\n"] }]
     }], function () { return []; }, null); })();
 
 const _c0$x = ["*"];
 class DrLayoutHeaderComponent {
     constructor() { }
     /** @nocollapse */ static { this.ɵfac = function DrLayoutHeaderComponent_Factory(t) { return new (t || DrLayoutHeaderComponent)(); }; }
-    /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: DrLayoutHeaderComponent, selectors: [["dr-layout-header"]], ngContentSelectors: _c0$x, decls: 2, vars: 0, template: function DrLayoutHeaderComponent_Template(rf, ctx) { if (rf & 1) {
+    /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: DrLayoutHeaderComponent, selectors: [["dr-layout-header"]], standalone: true, features: [i0.ɵɵStandaloneFeature], ngContentSelectors: _c0$x, decls: 2, vars: 0, template: function DrLayoutHeaderComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵprojectionDef();
             i0.ɵɵelementStart(0, "nav");
             i0.ɵɵprojection(1);
@@ -11834,6 +11866,7 @@ class DrLayoutHeaderComponent {
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DrLayoutHeaderComponent, [{
         type: Component,
         args: [{
+                standalone: true,
                 selector: 'dr-layout-header',
                 template: `
         <nav>
@@ -11847,7 +11880,7 @@ const _c0$w = ["*"];
 class DrLayoutBodyComponent {
     constructor() { }
     /** @nocollapse */ static { this.ɵfac = function DrLayoutBodyComponent_Factory(t) { return new (t || DrLayoutBodyComponent)(); }; }
-    /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: DrLayoutBodyComponent, selectors: [["dr-layout-body"]], ngContentSelectors: _c0$w, decls: 1, vars: 0, template: function DrLayoutBodyComponent_Template(rf, ctx) { if (rf & 1) {
+    /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: DrLayoutBodyComponent, selectors: [["dr-layout-body"]], standalone: true, features: [i0.ɵɵStandaloneFeature], ngContentSelectors: _c0$w, decls: 1, vars: 0, template: function DrLayoutBodyComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵprojectionDef();
             i0.ɵɵprojection(0);
         } }, encapsulation: 2 }); }
@@ -11855,6 +11888,7 @@ class DrLayoutBodyComponent {
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DrLayoutBodyComponent, [{
         type: Component,
         args: [{
+                standalone: true,
                 selector: 'dr-layout-body',
                 template: '<ng-content></ng-content>',
             }]
@@ -13336,15 +13370,15 @@ class TreeviewItemComponent {
         this.checkedChange.emit(checked);
     }
     /** @nocollapse */ static { this.ɵfac = function TreeviewItemComponent_Factory(t) { return new (t || TreeviewItemComponent)(i0.ɵɵdirectiveInject(TreeviewConfig)); }; }
-    /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: TreeviewItemComponent, selectors: [["ngx-treeview-item"]], inputs: { config: "config", template: "template", item: "item" }, outputs: { checkedChange: "checkedChange" }, decls: 1, vars: 1, consts: [["class", "treeview-item", 4, "ngIf"], [1, "treeview-item"], [3, "ngTemplateOutlet", "ngTemplateOutletContext"], [4, "ngIf"], [3, "config", "item", "template", "checkedChange", 4, "ngFor", "ngForOf"], [3, "config", "item", "template", "checkedChange"]], template: function TreeviewItemComponent_Template(rf, ctx) { if (rf & 1) {
+    /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: TreeviewItemComponent, selectors: [["ngx-treeview-item"]], inputs: { config: "config", template: "template", item: "item" }, outputs: { checkedChange: "checkedChange" }, standalone: true, features: [i0.ɵɵStandaloneFeature], decls: 1, vars: 1, consts: [["class", "treeview-item", 4, "ngIf"], [1, "treeview-item"], [3, "ngTemplateOutlet", "ngTemplateOutletContext"], [4, "ngIf"], [3, "config", "item", "template", "checkedChange", 4, "ngFor", "ngForOf"], [3, "config", "item", "template", "checkedChange"]], template: function TreeviewItemComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵtemplate(0, TreeviewItemComponent_div_0_Template, 3, 7, "div", 0);
         } if (rf & 2) {
             i0.ɵɵproperty("ngIf", ctx.item);
-        } }, dependencies: [i1.NgForOf, i1.NgIf, i1.NgTemplateOutlet, TreeviewItemComponent], styles: ["[_nghost-%COMP%]{display:block}[_nghost-%COMP%]   .treeview-item[_ngcontent-%COMP%]{white-space:nowrap}[_nghost-%COMP%]   .treeview-item[_ngcontent-%COMP%]   .treeview-item[_ngcontent-%COMP%]{margin-left:2rem}"] }); }
+        } }, dependencies: [TreeviewItemComponent, CommonModule, i1.NgForOf, i1.NgIf, i1.NgTemplateOutlet], styles: ["[_nghost-%COMP%]{display:block}[_nghost-%COMP%]   .treeview-item[_ngcontent-%COMP%]{white-space:nowrap}[_nghost-%COMP%]   .treeview-item[_ngcontent-%COMP%]   .treeview-item[_ngcontent-%COMP%]{margin-left:2rem}"] }); }
 }
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TreeviewItemComponent, [{
         type: Component,
-        args: [{ selector: 'ngx-treeview-item', template: "<div *ngIf=\"item\" class=\"treeview-item\">\n    <ng-template\n        [ngTemplateOutlet]=\"template\"\n        [ngTemplateOutletContext]=\"{ item: item, onCollapseExpand: onCollapseExpand, onCheckedChange: onCheckedChange }\">\n    </ng-template>\n    <div *ngIf=\"!item.collapsed\">\n        <ngx-treeview-item\n            [config]=\"config\"\n            *ngFor=\"let child of item.children\"\n            [item]=\"child\"\n            [template]=\"template\"\n            (checkedChange)=\"onChildCheckedChange(child, $event)\">\n        </ngx-treeview-item>\n    </div>\n</div>\n", styles: [":host{display:block}:host .treeview-item{white-space:nowrap}:host .treeview-item .treeview-item{margin-left:2rem}\n"] }]
+        args: [{ standalone: true, imports: [CommonModule], selector: 'ngx-treeview-item', template: "<div *ngIf=\"item\" class=\"treeview-item\">\n    <ng-template\n        [ngTemplateOutlet]=\"template\"\n        [ngTemplateOutletContext]=\"{ item: item, onCollapseExpand: onCollapseExpand, onCheckedChange: onCheckedChange }\">\n    </ng-template>\n    <div *ngIf=\"!item.collapsed\">\n        <ngx-treeview-item\n            [config]=\"config\"\n            *ngFor=\"let child of item.children\"\n            [item]=\"child\"\n            [template]=\"template\"\n            (checkedChange)=\"onChildCheckedChange(child, $event)\">\n        </ngx-treeview-item>\n    </div>\n</div>\n", styles: [":host{display:block}:host .treeview-item{white-space:nowrap}:host .treeview-item .treeview-item{margin-left:2rem}\n"] }]
     }], function () { return [{ type: TreeviewConfig }]; }, { config: [{
             type: Input
         }], template: [{
@@ -13709,7 +13743,7 @@ class TreeviewComponent {
         this.allItem.collapsed = !hasItemExpanded;
     }
     /** @nocollapse */ static { this.ɵfac = function TreeviewComponent_Factory(t) { return new (t || TreeviewComponent)(i0.ɵɵdirectiveInject(TreeviewI18n), i0.ɵɵdirectiveInject(TreeviewConfig), i0.ɵɵdirectiveInject(TreeviewEventParser)); }; }
-    /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: TreeviewComponent, selectors: [["ngx-treeview"]], inputs: { headerTemplate: "headerTemplate", itemTemplate: "itemTemplate", items: "items", config: "config" }, outputs: { selectedChange: "selectedChange", filterChange: "filterChange" }, features: [i0.ɵɵNgOnChangesFeature], decls: 9, vars: 5, consts: [["defaultItemTemplate", ""], ["defaultHeaderTemplate", ""], [1, "treeview-header"], [3, "ngTemplateOutlet", "ngTemplateOutletContext"], [3, "ngSwitch"], ["class", "treeview-container", 3, "max-height", 4, "ngSwitchCase"], ["class", "treeview-text", 4, "ngSwitchCase"], [1, "form-inline", "row-item"], ["aria-hidden", "true", 3, "ngSwitch", "click", 4, "ngIf"], [1, "form-check"], ["type", "checkbox", 1, "form-check-input", 3, "ngModel", "disabled", "indeterminate", "ngModelChange"], [1, "form-check-label", 3, "click"], ["aria-hidden", "true", 3, "ngSwitch", "click"], ["width", "0.8rem", "height", "0.8rem", "viewBox", "0 0 16 16", "class", "bi bi-caret-right-fill", "fill", "currentColor", "xmlns", "http://www.w3.org/2000/svg", 4, "ngSwitchCase"], ["width", "0.8rem", "height", "0.8rem", "viewBox", "0 0 16 16", "class", "bi bi-caret-down-fill", "fill", "currentColor", "xmlns", "http://www.w3.org/2000/svg", 4, "ngSwitchCase"], ["width", "0.8rem", "height", "0.8rem", "viewBox", "0 0 16 16", "fill", "currentColor", "xmlns", "http://www.w3.org/2000/svg", 1, "bi", "bi-caret-right-fill"], ["d", "M12.14 8.753l-5.482 4.796c-.646.566-1.658.106-1.658-.753V3.204a1 1 0 0 1 1.659-.753l5.48 4.796a1 1 0 0 1 0 1.506z"], ["width", "0.8rem", "height", "0.8rem", "viewBox", "0 0 16 16", "fill", "currentColor", "xmlns", "http://www.w3.org/2000/svg", 1, "bi", "bi-caret-down-fill"], ["d", "M7.247 11.14L2.451 5.658C1.885 5.013 2.345 4 3.204 4h9.592a1 1 0 0 1 .753 1.659l-4.796 5.48a1 1 0 0 1-1.506 0z"], ["class", "row row-filter", 4, "ngIf"], [4, "ngIf"], [1, "row", "row-filter"], [1, "col-12"], ["type", "text", 1, "form-control", 3, "placeholder", "ngModel", "ngModelChange"], ["class", "row row-all", 4, "ngIf"], ["class", "dropdown-divider", 4, "ngIf"], [1, "row", "row-all"], ["class", "form-check form-check-inline", 4, "ngIf"], ["class", "float-right form-check-label", 3, "click", 4, "ngIf"], [1, "form-check", "form-check-inline"], ["type", "checkbox", 1, "form-check-input", 3, "ngModel", "indeterminate", "ngModelChange"], [1, "float-right", "form-check-label", 3, "click"], ["aria-hidden", "true", 3, "title", "ngSwitch"], ["width", "1em", "height", "1em", "viewBox", "0 0 16 16", "class", "bi bi-arrows-angle-expand", "fill", "currentColor", "xmlns", "http://www.w3.org/2000/svg", 4, "ngSwitchCase"], ["width", "1em", "height", "1em", "viewBox", "0 0 16 16", "class", "bi bi-arrows-angle-contract", "fill", "currentColor", "xmlns", "http://www.w3.org/2000/svg", 4, "ngSwitchCase"], ["width", "1em", "height", "1em", "viewBox", "0 0 16 16", "fill", "currentColor", "xmlns", "http://www.w3.org/2000/svg", 1, "bi", "bi-arrows-angle-expand"], ["fill-rule", "evenodd", "d", "M1.5 10.036a.5.5 0 0 1 .5.5v3.5h3.5a.5.5 0 0 1 0 1h-4a.5.5 0 0 1-.5-.5v-4a.5.5 0 0 1 .5-.5z"], ["fill-rule", "evenodd", "d", "M6.354 9.646a.5.5 0 0 1 0 .708l-4.5 4.5a.5.5 0 0 1-.708-.708l4.5-4.5a.5.5 0 0 1 .708 0zm8.5-8.5a.5.5 0 0 1 0 .708l-4.5 4.5a.5.5 0 0 1-.708-.708l4.5-4.5a.5.5 0 0 1 .708 0z"], ["fill-rule", "evenodd", "d", "M10.036 1.5a.5.5 0 0 1 .5-.5h4a.5.5 0 0 1 .5.5v4a.5.5 0 1 1-1 0V2h-3.5a.5.5 0 0 1-.5-.5z"], ["width", "1em", "height", "1em", "viewBox", "0 0 16 16", "fill", "currentColor", "xmlns", "http://www.w3.org/2000/svg", 1, "bi", "bi-arrows-angle-contract"], ["fill-rule", "evenodd", "d", "M9.5 2.036a.5.5 0 0 1 .5.5v3.5h3.5a.5.5 0 0 1 0 1h-4a.5.5 0 0 1-.5-.5v-4a.5.5 0 0 1 .5-.5z"], ["fill-rule", "evenodd", "d", "M14.354 1.646a.5.5 0 0 1 0 .708l-4.5 4.5a.5.5 0 1 1-.708-.708l4.5-4.5a.5.5 0 0 1 .708 0zm-7.5 7.5a.5.5 0 0 1 0 .708l-4.5 4.5a.5.5 0 0 1-.708-.708l4.5-4.5a.5.5 0 0 1 .708 0z"], ["fill-rule", "evenodd", "d", "M2.036 9.5a.5.5 0 0 1 .5-.5h4a.5.5 0 0 1 .5.5v4a.5.5 0 0 1-1 0V10h-3.5a.5.5 0 0 1-.5-.5z"], [1, "dropdown-divider"], [1, "treeview-container"], [3, "config", "item", "template", "checkedChange", 4, "ngFor", "ngForOf"], [3, "config", "item", "template", "checkedChange"], [1, "treeview-text"]], template: function TreeviewComponent_Template(rf, ctx) { if (rf & 1) {
+    /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: TreeviewComponent, selectors: [["ngx-treeview"]], inputs: { headerTemplate: "headerTemplate", itemTemplate: "itemTemplate", items: "items", config: "config" }, outputs: { selectedChange: "selectedChange", filterChange: "filterChange" }, standalone: true, features: [i0.ɵɵNgOnChangesFeature, i0.ɵɵStandaloneFeature], decls: 9, vars: 5, consts: [["defaultItemTemplate", ""], ["defaultHeaderTemplate", ""], [1, "treeview-header"], [3, "ngTemplateOutlet", "ngTemplateOutletContext"], [3, "ngSwitch"], ["class", "treeview-container", 3, "max-height", 4, "ngSwitchCase"], ["class", "treeview-text", 4, "ngSwitchCase"], [1, "form-inline", "row-item"], ["aria-hidden", "true", 3, "ngSwitch", "click", 4, "ngIf"], [1, "form-check"], ["type", "checkbox", 1, "form-check-input", 3, "ngModel", "disabled", "indeterminate", "ngModelChange"], [1, "form-check-label", 3, "click"], ["aria-hidden", "true", 3, "ngSwitch", "click"], ["width", "0.8rem", "height", "0.8rem", "viewBox", "0 0 16 16", "class", "bi bi-caret-right-fill", "fill", "currentColor", "xmlns", "http://www.w3.org/2000/svg", 4, "ngSwitchCase"], ["width", "0.8rem", "height", "0.8rem", "viewBox", "0 0 16 16", "class", "bi bi-caret-down-fill", "fill", "currentColor", "xmlns", "http://www.w3.org/2000/svg", 4, "ngSwitchCase"], ["width", "0.8rem", "height", "0.8rem", "viewBox", "0 0 16 16", "fill", "currentColor", "xmlns", "http://www.w3.org/2000/svg", 1, "bi", "bi-caret-right-fill"], ["d", "M12.14 8.753l-5.482 4.796c-.646.566-1.658.106-1.658-.753V3.204a1 1 0 0 1 1.659-.753l5.48 4.796a1 1 0 0 1 0 1.506z"], ["width", "0.8rem", "height", "0.8rem", "viewBox", "0 0 16 16", "fill", "currentColor", "xmlns", "http://www.w3.org/2000/svg", 1, "bi", "bi-caret-down-fill"], ["d", "M7.247 11.14L2.451 5.658C1.885 5.013 2.345 4 3.204 4h9.592a1 1 0 0 1 .753 1.659l-4.796 5.48a1 1 0 0 1-1.506 0z"], ["class", "row row-filter", 4, "ngIf"], [4, "ngIf"], [1, "row", "row-filter"], [1, "col-12"], ["type", "text", 1, "form-control", 3, "placeholder", "ngModel", "ngModelChange"], ["class", "row row-all", 4, "ngIf"], ["class", "dropdown-divider", 4, "ngIf"], [1, "row", "row-all"], ["class", "form-check form-check-inline", 4, "ngIf"], ["class", "float-right form-check-label", 3, "click", 4, "ngIf"], [1, "form-check", "form-check-inline"], ["type", "checkbox", 1, "form-check-input", 3, "ngModel", "indeterminate", "ngModelChange"], [1, "float-right", "form-check-label", 3, "click"], ["aria-hidden", "true", 3, "title", "ngSwitch"], ["width", "1em", "height", "1em", "viewBox", "0 0 16 16", "class", "bi bi-arrows-angle-expand", "fill", "currentColor", "xmlns", "http://www.w3.org/2000/svg", 4, "ngSwitchCase"], ["width", "1em", "height", "1em", "viewBox", "0 0 16 16", "class", "bi bi-arrows-angle-contract", "fill", "currentColor", "xmlns", "http://www.w3.org/2000/svg", 4, "ngSwitchCase"], ["width", "1em", "height", "1em", "viewBox", "0 0 16 16", "fill", "currentColor", "xmlns", "http://www.w3.org/2000/svg", 1, "bi", "bi-arrows-angle-expand"], ["fill-rule", "evenodd", "d", "M1.5 10.036a.5.5 0 0 1 .5.5v3.5h3.5a.5.5 0 0 1 0 1h-4a.5.5 0 0 1-.5-.5v-4a.5.5 0 0 1 .5-.5z"], ["fill-rule", "evenodd", "d", "M6.354 9.646a.5.5 0 0 1 0 .708l-4.5 4.5a.5.5 0 0 1-.708-.708l4.5-4.5a.5.5 0 0 1 .708 0zm8.5-8.5a.5.5 0 0 1 0 .708l-4.5 4.5a.5.5 0 0 1-.708-.708l4.5-4.5a.5.5 0 0 1 .708 0z"], ["fill-rule", "evenodd", "d", "M10.036 1.5a.5.5 0 0 1 .5-.5h4a.5.5 0 0 1 .5.5v4a.5.5 0 1 1-1 0V2h-3.5a.5.5 0 0 1-.5-.5z"], ["width", "1em", "height", "1em", "viewBox", "0 0 16 16", "fill", "currentColor", "xmlns", "http://www.w3.org/2000/svg", 1, "bi", "bi-arrows-angle-contract"], ["fill-rule", "evenodd", "d", "M9.5 2.036a.5.5 0 0 1 .5.5v3.5h3.5a.5.5 0 0 1 0 1h-4a.5.5 0 0 1-.5-.5v-4a.5.5 0 0 1 .5-.5z"], ["fill-rule", "evenodd", "d", "M14.354 1.646a.5.5 0 0 1 0 .708l-4.5 4.5a.5.5 0 1 1-.708-.708l4.5-4.5a.5.5 0 0 1 .708 0zm-7.5 7.5a.5.5 0 0 1 0 .708l-4.5 4.5a.5.5 0 0 1-.708-.708l4.5-4.5a.5.5 0 0 1 .708 0z"], ["fill-rule", "evenodd", "d", "M2.036 9.5a.5.5 0 0 1 .5-.5h4a.5.5 0 0 1 .5.5v4a.5.5 0 0 1-1 0V10h-3.5a.5.5 0 0 1-.5-.5z"], [1, "dropdown-divider"], [1, "treeview-container"], [3, "config", "item", "template", "checkedChange", 4, "ngFor", "ngForOf"], [3, "config", "item", "template", "checkedChange"], [1, "treeview-text"]], template: function TreeviewComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵtemplate(0, TreeviewComponent_ng_template_0_Template, 6, 5, "ng-template", null, 0, i0.ɵɵtemplateRefExtractor);
             i0.ɵɵtemplate(2, TreeviewComponent_ng_template_2_Template, 2, 2, "ng-template", null, 1, i0.ɵɵtemplateRefExtractor);
             i0.ɵɵelementStart(4, "div", 2);
@@ -13729,11 +13763,11 @@ class TreeviewComponent {
             i0.ɵɵproperty("ngSwitchCase", true);
             i0.ɵɵadvance(1);
             i0.ɵɵproperty("ngSwitchCase", false);
-        } }, dependencies: [i2.DefaultValueAccessor, i2.CheckboxControlValueAccessor, i2.NgControlStatus, i2.NgModel, i1.NgForOf, i1.NgIf, i1.NgTemplateOutlet, i1.NgSwitch, i1.NgSwitchCase, TreeviewItemComponent], styles: ["[_nghost-%COMP%]   .treeview-header[_ngcontent-%COMP%]   .row-filter[_ngcontent-%COMP%]{margin-bottom:.5rem}[_nghost-%COMP%]   .treeview-header[_ngcontent-%COMP%]   .row-all[_ngcontent-%COMP%]   .bi[_ngcontent-%COMP%]{cursor:pointer}[_nghost-%COMP%]   .treeview-container[_ngcontent-%COMP%]   .row-item[_ngcontent-%COMP%]{margin-bottom:.3rem;flex-wrap:nowrap}[_nghost-%COMP%]   .treeview-container[_ngcontent-%COMP%]   .row-item[_ngcontent-%COMP%]   .bi[_ngcontent-%COMP%]{cursor:pointer;margin-right:.3rem}.treeview-container[_ngcontent-%COMP%]{overflow-y:auto;padding-right:.3rem}.treeview-text[_ngcontent-%COMP%]{padding:.3rem 0;white-space:nowrap}"] }); }
+        } }, dependencies: [CommonModule, i1.NgForOf, i1.NgIf, i1.NgTemplateOutlet, i1.NgSwitch, i1.NgSwitchCase, FormsModule, i2.DefaultValueAccessor, i2.CheckboxControlValueAccessor, i2.NgControlStatus, i2.NgModel, TreeviewItemComponent], styles: ["[_nghost-%COMP%]   .treeview-header[_ngcontent-%COMP%]   .row-filter[_ngcontent-%COMP%]{margin-bottom:.5rem}[_nghost-%COMP%]   .treeview-header[_ngcontent-%COMP%]   .row-all[_ngcontent-%COMP%]   .bi[_ngcontent-%COMP%]{cursor:pointer}[_nghost-%COMP%]   .treeview-container[_ngcontent-%COMP%]   .row-item[_ngcontent-%COMP%]{margin-bottom:.3rem;flex-wrap:nowrap}[_nghost-%COMP%]   .treeview-container[_ngcontent-%COMP%]   .row-item[_ngcontent-%COMP%]   .bi[_ngcontent-%COMP%]{cursor:pointer;margin-right:.3rem}.treeview-container[_ngcontent-%COMP%]{overflow-y:auto;padding-right:.3rem}.treeview-text[_ngcontent-%COMP%]{padding:.3rem 0;white-space:nowrap}"] }); }
 }
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TreeviewComponent, [{
         type: Component,
-        args: [{ selector: 'ngx-treeview', template: "<ng-template #defaultItemTemplate let-item=\"item\" let-onCollapseExpand=\"onCollapseExpand\" let-onCheckedChange=\"onCheckedChange\">\n    <div class=\"form-inline row-item\">\n        <i *ngIf=\"item.children\" (click)=\"onCollapseExpand()\" aria-hidden=\"true\" [ngSwitch]=\"item.collapsed\">\n            <svg\n                *ngSwitchCase=\"true\"\n                width=\"0.8rem\"\n                height=\"0.8rem\"\n                viewBox=\"0 0 16 16\"\n                class=\"bi bi-caret-right-fill\"\n                fill=\"currentColor\"\n                xmlns=\"http://www.w3.org/2000/svg\">\n                <path\n                    d=\"M12.14 8.753l-5.482 4.796c-.646.566-1.658.106-1.658-.753V3.204a1 1 0 0 1 1.659-.753l5.48 4.796a1 1 0 0 1 0 1.506z\" />\n            </svg>\n            <svg\n                *ngSwitchCase=\"false\"\n                width=\"0.8rem\"\n                height=\"0.8rem\"\n                viewBox=\"0 0 16 16\"\n                class=\"bi bi-caret-down-fill\"\n                fill=\"currentColor\"\n                xmlns=\"http://www.w3.org/2000/svg\">\n                <path\n                    d=\"M7.247 11.14L2.451 5.658C1.885 5.013 2.345 4 3.204 4h9.592a1 1 0 0 1 .753 1.659l-4.796 5.48a1 1 0 0 1-1.506 0z\" />\n            </svg>\n        </i>\n        <div class=\"form-check\">\n            <input\n                type=\"checkbox\"\n                class=\"form-check-input\"\n                [(ngModel)]=\"item.checked\"\n                (ngModelChange)=\"onCheckedChange()\"\n                [disabled]=\"item.disabled\"\n                [indeterminate]=\"item.indeterminate\" />\n            <label class=\"form-check-label\" (click)=\"item.checked = !item.checked; onCheckedChange()\">\n                {{ item.text }}\n            </label>\n        </div>\n    </div>\n</ng-template>\n<ng-template\n    #defaultHeaderTemplate\n    let-config=\"config\"\n    let-item=\"item\"\n    let-onCollapseExpand=\"onCollapseExpand\"\n    let-onCheckedChange=\"onCheckedChange\"\n    let-onFilterTextChange=\"onFilterTextChange\">\n    <div *ngIf=\"config.hasFilter\" class=\"row row-filter\">\n        <div class=\"col-12\">\n            <input\n                class=\"form-control\"\n                type=\"text\"\n                [placeholder]=\"i18n.getFilterPlaceholder()\"\n                [(ngModel)]=\"filterText\"\n                (ngModelChange)=\"onFilterTextChange($event)\" />\n        </div>\n    </div>\n    <div *ngIf=\"hasFilterItems\">\n        <div *ngIf=\"config.hasAllCheckBox || config.hasCollapseExpand\" class=\"row row-all\">\n            <div class=\"col-12\">\n                <div class=\"form-check form-check-inline\" *ngIf=\"config.hasAllCheckBox\">\n                    <input\n                        type=\"checkbox\"\n                        class=\"form-check-input\"\n                        [(ngModel)]=\"item.checked\"\n                        (ngModelChange)=\"onCheckedChange()\"\n                        [indeterminate]=\"item.indeterminate\" />\n                    <label class=\"form-check-label\" (click)=\"item.checked = !item.checked; onCheckedChange()\">\n                        {{ i18n.getAllCheckboxText() }}\n                    </label>\n                </div>\n                <label *ngIf=\"config.hasCollapseExpand\" class=\"float-right form-check-label\" (click)=\"onCollapseExpand()\">\n                    <i [title]=\"i18n.getTooltipCollapseExpandText(item.collapsed)\" aria-hidden=\"true\" [ngSwitch]=\"item.collapsed\">\n                        <svg\n                            *ngSwitchCase=\"true\"\n                            width=\"1em\"\n                            height=\"1em\"\n                            viewBox=\"0 0 16 16\"\n                            class=\"bi bi-arrows-angle-expand\"\n                            fill=\"currentColor\"\n                            xmlns=\"http://www.w3.org/2000/svg\">\n                            <path\n                                fill-rule=\"evenodd\"\n                                d=\"M1.5 10.036a.5.5 0 0 1 .5.5v3.5h3.5a.5.5 0 0 1 0 1h-4a.5.5 0 0 1-.5-.5v-4a.5.5 0 0 1 .5-.5z\" />\n                            <path\n                                fill-rule=\"evenodd\"\n                                d=\"M6.354 9.646a.5.5 0 0 1 0 .708l-4.5 4.5a.5.5 0 0 1-.708-.708l4.5-4.5a.5.5 0 0 1 .708 0zm8.5-8.5a.5.5 0 0 1 0 .708l-4.5 4.5a.5.5 0 0 1-.708-.708l4.5-4.5a.5.5 0 0 1 .708 0z\" />\n                            <path\n                                fill-rule=\"evenodd\"\n                                d=\"M10.036 1.5a.5.5 0 0 1 .5-.5h4a.5.5 0 0 1 .5.5v4a.5.5 0 1 1-1 0V2h-3.5a.5.5 0 0 1-.5-.5z\" />\n                        </svg>\n                        <svg\n                            *ngSwitchCase=\"false\"\n                            width=\"1em\"\n                            height=\"1em\"\n                            viewBox=\"0 0 16 16\"\n                            class=\"bi bi-arrows-angle-contract\"\n                            fill=\"currentColor\"\n                            xmlns=\"http://www.w3.org/2000/svg\">\n                            <path\n                                fill-rule=\"evenodd\"\n                                d=\"M9.5 2.036a.5.5 0 0 1 .5.5v3.5h3.5a.5.5 0 0 1 0 1h-4a.5.5 0 0 1-.5-.5v-4a.5.5 0 0 1 .5-.5z\" />\n                            <path\n                                fill-rule=\"evenodd\"\n                                d=\"M14.354 1.646a.5.5 0 0 1 0 .708l-4.5 4.5a.5.5 0 1 1-.708-.708l4.5-4.5a.5.5 0 0 1 .708 0zm-7.5 7.5a.5.5 0 0 1 0 .708l-4.5 4.5a.5.5 0 0 1-.708-.708l4.5-4.5a.5.5 0 0 1 .708 0z\" />\n                            <path\n                                fill-rule=\"evenodd\"\n                                d=\"M2.036 9.5a.5.5 0 0 1 .5-.5h4a.5.5 0 0 1 .5.5v4a.5.5 0 0 1-1 0V10h-3.5a.5.5 0 0 1-.5-.5z\" />\n                        </svg>\n                    </i>\n                </label>\n            </div>\n        </div>\n        <div *ngIf=\"config.hasDivider\" class=\"dropdown-divider\"></div>\n    </div>\n</ng-template>\n<div class=\"treeview-header\">\n    <ng-template [ngTemplateOutlet]=\"headerTemplate || defaultHeaderTemplate\" [ngTemplateOutletContext]=\"headerTemplateContext\">\n    </ng-template>\n</div>\n<div [ngSwitch]=\"hasFilterItems\">\n    <div *ngSwitchCase=\"true\" class=\"treeview-container\" [style.max-height.px]=\"maxHeight\">\n        <ngx-treeview-item\n            *ngFor=\"let item of filterItems\"\n            [config]=\"config\"\n            [item]=\"item\"\n            [template]=\"itemTemplate || defaultItemTemplate\"\n            (checkedChange)=\"onItemCheckedChange(item, $event)\">\n        </ngx-treeview-item>\n    </div>\n    <div *ngSwitchCase=\"false\" class=\"treeview-text\">\n        {{ i18n.getFilterNoItemsFoundText() }}\n    </div>\n</div>\n", styles: [":host .treeview-header .row-filter{margin-bottom:.5rem}:host .treeview-header .row-all .bi{cursor:pointer}:host .treeview-container .row-item{margin-bottom:.3rem;flex-wrap:nowrap}:host .treeview-container .row-item .bi{cursor:pointer;margin-right:.3rem}.treeview-container{overflow-y:auto;padding-right:.3rem}.treeview-text{padding:.3rem 0;white-space:nowrap}\n"] }]
+        args: [{ standalone: true, imports: [CommonModule, FormsModule, TreeviewItemComponent], selector: 'ngx-treeview', template: "<ng-template #defaultItemTemplate let-item=\"item\" let-onCollapseExpand=\"onCollapseExpand\" let-onCheckedChange=\"onCheckedChange\">\n    <div class=\"form-inline row-item\">\n        <i *ngIf=\"item.children\" (click)=\"onCollapseExpand()\" aria-hidden=\"true\" [ngSwitch]=\"item.collapsed\">\n            <svg\n                *ngSwitchCase=\"true\"\n                width=\"0.8rem\"\n                height=\"0.8rem\"\n                viewBox=\"0 0 16 16\"\n                class=\"bi bi-caret-right-fill\"\n                fill=\"currentColor\"\n                xmlns=\"http://www.w3.org/2000/svg\">\n                <path\n                    d=\"M12.14 8.753l-5.482 4.796c-.646.566-1.658.106-1.658-.753V3.204a1 1 0 0 1 1.659-.753l5.48 4.796a1 1 0 0 1 0 1.506z\" />\n            </svg>\n            <svg\n                *ngSwitchCase=\"false\"\n                width=\"0.8rem\"\n                height=\"0.8rem\"\n                viewBox=\"0 0 16 16\"\n                class=\"bi bi-caret-down-fill\"\n                fill=\"currentColor\"\n                xmlns=\"http://www.w3.org/2000/svg\">\n                <path\n                    d=\"M7.247 11.14L2.451 5.658C1.885 5.013 2.345 4 3.204 4h9.592a1 1 0 0 1 .753 1.659l-4.796 5.48a1 1 0 0 1-1.506 0z\" />\n            </svg>\n        </i>\n        <div class=\"form-check\">\n            <input\n                type=\"checkbox\"\n                class=\"form-check-input\"\n                [(ngModel)]=\"item.checked\"\n                (ngModelChange)=\"onCheckedChange()\"\n                [disabled]=\"item.disabled\"\n                [indeterminate]=\"item.indeterminate\" />\n            <label class=\"form-check-label\" (click)=\"item.checked = !item.checked; onCheckedChange()\">\n                {{ item.text }}\n            </label>\n        </div>\n    </div>\n</ng-template>\n<ng-template\n    #defaultHeaderTemplate\n    let-config=\"config\"\n    let-item=\"item\"\n    let-onCollapseExpand=\"onCollapseExpand\"\n    let-onCheckedChange=\"onCheckedChange\"\n    let-onFilterTextChange=\"onFilterTextChange\">\n    <div *ngIf=\"config.hasFilter\" class=\"row row-filter\">\n        <div class=\"col-12\">\n            <input\n                class=\"form-control\"\n                type=\"text\"\n                [placeholder]=\"i18n.getFilterPlaceholder()\"\n                [(ngModel)]=\"filterText\"\n                (ngModelChange)=\"onFilterTextChange($event)\" />\n        </div>\n    </div>\n    <div *ngIf=\"hasFilterItems\">\n        <div *ngIf=\"config.hasAllCheckBox || config.hasCollapseExpand\" class=\"row row-all\">\n            <div class=\"col-12\">\n                <div class=\"form-check form-check-inline\" *ngIf=\"config.hasAllCheckBox\">\n                    <input\n                        type=\"checkbox\"\n                        class=\"form-check-input\"\n                        [(ngModel)]=\"item.checked\"\n                        (ngModelChange)=\"onCheckedChange()\"\n                        [indeterminate]=\"item.indeterminate\" />\n                    <label class=\"form-check-label\" (click)=\"item.checked = !item.checked; onCheckedChange()\">\n                        {{ i18n.getAllCheckboxText() }}\n                    </label>\n                </div>\n                <label *ngIf=\"config.hasCollapseExpand\" class=\"float-right form-check-label\" (click)=\"onCollapseExpand()\">\n                    <i [title]=\"i18n.getTooltipCollapseExpandText(item.collapsed)\" aria-hidden=\"true\" [ngSwitch]=\"item.collapsed\">\n                        <svg\n                            *ngSwitchCase=\"true\"\n                            width=\"1em\"\n                            height=\"1em\"\n                            viewBox=\"0 0 16 16\"\n                            class=\"bi bi-arrows-angle-expand\"\n                            fill=\"currentColor\"\n                            xmlns=\"http://www.w3.org/2000/svg\">\n                            <path\n                                fill-rule=\"evenodd\"\n                                d=\"M1.5 10.036a.5.5 0 0 1 .5.5v3.5h3.5a.5.5 0 0 1 0 1h-4a.5.5 0 0 1-.5-.5v-4a.5.5 0 0 1 .5-.5z\" />\n                            <path\n                                fill-rule=\"evenodd\"\n                                d=\"M6.354 9.646a.5.5 0 0 1 0 .708l-4.5 4.5a.5.5 0 0 1-.708-.708l4.5-4.5a.5.5 0 0 1 .708 0zm8.5-8.5a.5.5 0 0 1 0 .708l-4.5 4.5a.5.5 0 0 1-.708-.708l4.5-4.5a.5.5 0 0 1 .708 0z\" />\n                            <path\n                                fill-rule=\"evenodd\"\n                                d=\"M10.036 1.5a.5.5 0 0 1 .5-.5h4a.5.5 0 0 1 .5.5v4a.5.5 0 1 1-1 0V2h-3.5a.5.5 0 0 1-.5-.5z\" />\n                        </svg>\n                        <svg\n                            *ngSwitchCase=\"false\"\n                            width=\"1em\"\n                            height=\"1em\"\n                            viewBox=\"0 0 16 16\"\n                            class=\"bi bi-arrows-angle-contract\"\n                            fill=\"currentColor\"\n                            xmlns=\"http://www.w3.org/2000/svg\">\n                            <path\n                                fill-rule=\"evenodd\"\n                                d=\"M9.5 2.036a.5.5 0 0 1 .5.5v3.5h3.5a.5.5 0 0 1 0 1h-4a.5.5 0 0 1-.5-.5v-4a.5.5 0 0 1 .5-.5z\" />\n                            <path\n                                fill-rule=\"evenodd\"\n                                d=\"M14.354 1.646a.5.5 0 0 1 0 .708l-4.5 4.5a.5.5 0 1 1-.708-.708l4.5-4.5a.5.5 0 0 1 .708 0zm-7.5 7.5a.5.5 0 0 1 0 .708l-4.5 4.5a.5.5 0 0 1-.708-.708l4.5-4.5a.5.5 0 0 1 .708 0z\" />\n                            <path\n                                fill-rule=\"evenodd\"\n                                d=\"M2.036 9.5a.5.5 0 0 1 .5-.5h4a.5.5 0 0 1 .5.5v4a.5.5 0 0 1-1 0V10h-3.5a.5.5 0 0 1-.5-.5z\" />\n                        </svg>\n                    </i>\n                </label>\n            </div>\n        </div>\n        <div *ngIf=\"config.hasDivider\" class=\"dropdown-divider\"></div>\n    </div>\n</ng-template>\n<div class=\"treeview-header\">\n    <ng-template [ngTemplateOutlet]=\"headerTemplate || defaultHeaderTemplate\" [ngTemplateOutletContext]=\"headerTemplateContext\">\n    </ng-template>\n</div>\n<div [ngSwitch]=\"hasFilterItems\">\n    <div *ngSwitchCase=\"true\" class=\"treeview-container\" [style.max-height.px]=\"maxHeight\">\n        <ngx-treeview-item\n            *ngFor=\"let item of filterItems\"\n            [config]=\"config\"\n            [item]=\"item\"\n            [template]=\"itemTemplate || defaultItemTemplate\"\n            (checkedChange)=\"onItemCheckedChange(item, $event)\">\n        </ngx-treeview-item>\n    </div>\n    <div *ngSwitchCase=\"false\" class=\"treeview-text\">\n        {{ i18n.getFilterNoItemsFoundText() }}\n    </div>\n</div>\n", styles: [":host .treeview-header .row-filter{margin-bottom:.5rem}:host .treeview-header .row-all .bi{cursor:pointer}:host .treeview-container .row-item{margin-bottom:.3rem;flex-wrap:nowrap}:host .treeview-container .row-item .bi{cursor:pointer;margin-right:.3rem}.treeview-container{overflow-y:auto;padding-right:.3rem}.treeview-text{padding:.3rem 0;white-space:nowrap}\n"] }]
     }], function () { return [{ type: TreeviewI18n }, { type: TreeviewConfig }, { type: TreeviewEventParser }]; }, { headerTemplate: [{
             type: Input
         }], itemTemplate: [{
@@ -13756,11 +13790,12 @@ class TreeviewPipe {
         return objects.map((object) => new TreeviewItem({ text: object[textField], value: object }));
     }
     /** @nocollapse */ static { this.ɵfac = function TreeviewPipe_Factory(t) { return new (t || TreeviewPipe)(); }; }
-    /** @nocollapse */ static { this.ɵpipe = /** @pureOrBreakMyCode */ i0.ɵɵdefinePipe({ name: "ngxTreeview", type: TreeviewPipe, pure: true }); }
+    /** @nocollapse */ static { this.ɵpipe = /** @pureOrBreakMyCode */ i0.ɵɵdefinePipe({ name: "ngxTreeview", type: TreeviewPipe, pure: true, standalone: true }); }
 }
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TreeviewPipe, [{
         type: Pipe,
         args: [{
+                standalone: true,
                 name: 'ngxTreeview',
             }]
     }], null, null); })();
@@ -14840,13 +14875,12 @@ class DrImageCropperComponent {
 class DrDropdownModule {
     /** @nocollapse */ static { this.ɵfac = function DrDropdownModule_Factory(t) { return new (t || DrDropdownModule)(); }; }
     /** @nocollapse */ static { this.ɵmod = /** @pureOrBreakMyCode */ i0.ɵɵdefineNgModule({ type: DrDropdownModule }); }
-    /** @nocollapse */ static { this.ɵinj = /** @pureOrBreakMyCode */ i0.ɵɵdefineInjector({ providers: [DrDropdownService], imports: [CommonModule, DrTooltipModule, DrPopoverModule] }); }
+    /** @nocollapse */ static { this.ɵinj = /** @pureOrBreakMyCode */ i0.ɵɵdefineInjector({ providers: [DrDropdownService], imports: [DrDropdownComponent] }); }
 }
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DrDropdownModule, [{
         type: NgModule,
         args: [{
-                imports: [CommonModule, DrTooltipModule, DrPopoverModule],
-                declarations: [
+                imports: [
                     DrDropdownDirective,
                     DrDropdownComponent,
                     DrDropdownItemShowPipe,
@@ -14857,30 +14891,25 @@ class DrDropdownModule {
                 providers: [DrDropdownService],
             }]
     }], null, null); })();
-(function () { (typeof ngJitMode === "undefined" || ngJitMode) && i0.ɵɵsetNgModuleScope(DrDropdownModule, { declarations: [DrDropdownDirective,
+(function () { (typeof ngJitMode === "undefined" || ngJitMode) && i0.ɵɵsetNgModuleScope(DrDropdownModule, { imports: [DrDropdownDirective,
         DrDropdownComponent,
         DrDropdownItemShowPipe,
         DrDropdownChildDirective,
-        DrDropdownItemComponent], imports: [CommonModule, DrTooltipModule, DrPopoverModule], exports: [DrDropdownDirective, DrDropdownComponent, DrDropdownItemShowPipe, DrDropdownItemComponent] }); })();
-i0.ɵɵsetComponentScope(DrDropdownComponent, [i1.NgForOf, i1.NgIf, i1.NgTemplateOutlet, DrTooltipDirective, DrDropdownDirective,
-    DrDropdownChildDirective,
-    DrDropdownItemComponent], [DrDropdownItemShowPipe]);
+        DrDropdownItemComponent], exports: [DrDropdownDirective, DrDropdownComponent, DrDropdownItemShowPipe, DrDropdownItemComponent] }); })();
 
 class DrTabsModule {
     /** @nocollapse */ static { this.ɵfac = function DrTabsModule_Factory(t) { return new (t || DrTabsModule)(); }; }
     /** @nocollapse */ static { this.ɵmod = /** @pureOrBreakMyCode */ i0.ɵɵdefineNgModule({ type: DrTabsModule }); }
-    /** @nocollapse */ static { this.ɵinj = /** @pureOrBreakMyCode */ i0.ɵɵdefineInjector({ imports: [CommonModule, MatTabsModule, FormsModule, ReactiveFormsModule, DrInputsModule, DrTooltipModule] }); }
+    /** @nocollapse */ static { this.ɵinj = /** @pureOrBreakMyCode */ i0.ɵɵdefineInjector({ imports: [DrTabsComponent] }); }
 }
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DrTabsModule, [{
         type: NgModule,
         args: [{
-                imports: [CommonModule, MatTabsModule, FormsModule, ReactiveFormsModule, DrInputsModule, DrTooltipModule],
+                imports: [DrTabsComponent, DrTabComponent],
                 exports: [DrTabsComponent, DrTabComponent],
-                providers: [],
-                declarations: [DrTabsComponent, DrTabComponent],
             }]
     }], null, null); })();
-(function () { (typeof ngJitMode === "undefined" || ngJitMode) && i0.ɵɵsetNgModuleScope(DrTabsModule, { declarations: [DrTabsComponent, DrTabComponent], imports: [CommonModule, MatTabsModule, FormsModule, ReactiveFormsModule, DrInputsModule, DrTooltipModule], exports: [DrTabsComponent, DrTabComponent] }); })();
+(function () { (typeof ngJitMode === "undefined" || ngJitMode) && i0.ɵɵsetNgModuleScope(DrTabsModule, { imports: [DrTabsComponent, DrTabComponent], exports: [DrTabsComponent, DrTabComponent] }); })();
 
 const DR_ACCORDION_COMPONENTS = [
     DrAccordionComponent,
@@ -14891,21 +14920,19 @@ const DR_ACCORDION_COMPONENTS = [
 class DrAccordionModule {
     /** @nocollapse */ static { this.ɵfac = function DrAccordionModule_Factory(t) { return new (t || DrAccordionModule)(); }; }
     /** @nocollapse */ static { this.ɵmod = /** @pureOrBreakMyCode */ i0.ɵɵdefineNgModule({ type: DrAccordionModule }); }
-    /** @nocollapse */ static { this.ɵinj = /** @pureOrBreakMyCode */ i0.ɵɵdefineInjector({ imports: [CommonModule] }); }
+    /** @nocollapse */ static { this.ɵinj = /** @pureOrBreakMyCode */ i0.ɵɵdefineInjector({ imports: [DrAccordionItemHeaderComponent] }); }
 }
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DrAccordionModule, [{
         type: NgModule,
         args: [{
-                imports: [CommonModule],
+                imports: [...DR_ACCORDION_COMPONENTS],
                 exports: [...DR_ACCORDION_COMPONENTS],
-                declarations: [...DR_ACCORDION_COMPONENTS],
-                providers: [],
             }]
     }], null, null); })();
-(function () { (typeof ngJitMode === "undefined" || ngJitMode) && i0.ɵɵsetNgModuleScope(DrAccordionModule, { declarations: [DrAccordionComponent,
+(function () { (typeof ngJitMode === "undefined" || ngJitMode) && i0.ɵɵsetNgModuleScope(DrAccordionModule, { imports: [DrAccordionComponent,
         DrAccordionItemComponent,
         DrAccordionItemHeaderComponent,
-        DrAccordionItemBodyComponent], imports: [CommonModule], exports: [DrAccordionComponent,
+        DrAccordionItemBodyComponent], exports: [DrAccordionComponent,
         DrAccordionItemComponent,
         DrAccordionItemHeaderComponent,
         DrAccordionItemBodyComponent] }); })();
@@ -14914,33 +14941,16 @@ const components = [DrLayoutComponent, DrLayoutHeaderComponent, DrLayoutBodyComp
 class DrLayoutModule {
     /** @nocollapse */ static { this.ɵfac = function DrLayoutModule_Factory(t) { return new (t || DrLayoutModule)(); }; }
     /** @nocollapse */ static { this.ɵmod = /** @pureOrBreakMyCode */ i0.ɵɵdefineNgModule({ type: DrLayoutModule }); }
-    /** @nocollapse */ static { this.ɵinj = /** @pureOrBreakMyCode */ i0.ɵɵdefineInjector({ imports: [CommonModule] }); }
+    /** @nocollapse */ static { this.ɵinj = /** @pureOrBreakMyCode */ i0.ɵɵdefineInjector({}); }
 }
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DrLayoutModule, [{
         type: NgModule,
         args: [{
-                imports: [CommonModule],
+                imports: [...components],
                 exports: [...components],
-                declarations: [...components],
             }]
     }], null, null); })();
-(function () { (typeof ngJitMode === "undefined" || ngJitMode) && i0.ɵɵsetNgModuleScope(DrLayoutModule, { declarations: [DrLayoutComponent, DrLayoutHeaderComponent, DrLayoutBodyComponent], imports: [CommonModule], exports: [DrLayoutComponent, DrLayoutHeaderComponent, DrLayoutBodyComponent] }); })();
-
-class DrErrorModule {
-    /** @nocollapse */ static { this.ɵfac = function DrErrorModule_Factory(t) { return new (t || DrErrorModule)(); }; }
-    /** @nocollapse */ static { this.ɵmod = /** @pureOrBreakMyCode */ i0.ɵɵdefineNgModule({ type: DrErrorModule }); }
-    /** @nocollapse */ static { this.ɵinj = /** @pureOrBreakMyCode */ i0.ɵɵdefineInjector({ imports: [CommonModule, FormsModule, DrTooltipModule] }); }
-}
-(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DrErrorModule, [{
-        type: NgModule,
-        args: [{
-                imports: [CommonModule, FormsModule, DrTooltipModule],
-                exports: [DrErrorComponent],
-                providers: [],
-                declarations: [DrErrorComponent],
-            }]
-    }], null, null); })();
-(function () { (typeof ngJitMode === "undefined" || ngJitMode) && i0.ɵɵsetNgModuleScope(DrErrorModule, { declarations: [DrErrorComponent], imports: [CommonModule, FormsModule, DrTooltipModule], exports: [DrErrorComponent] }); })();
+(function () { (typeof ngJitMode === "undefined" || ngJitMode) && i0.ɵɵsetNgModuleScope(DrLayoutModule, { imports: [DrLayoutComponent, DrLayoutHeaderComponent, DrLayoutBodyComponent], exports: [DrLayoutComponent, DrLayoutHeaderComponent, DrLayoutBodyComponent] }); })();
 
 class DrStepperModule {
     /** @nocollapse */ static { this.ɵfac = function DrStepperModule_Factory(t) { return new (t || DrStepperModule)(); }; }
@@ -15097,18 +15107,16 @@ class TreeviewModule {
     }
     /** @nocollapse */ static { this.ɵfac = function TreeviewModule_Factory(t) { return new (t || TreeviewModule)(); }; }
     /** @nocollapse */ static { this.ɵmod = /** @pureOrBreakMyCode */ i0.ɵɵdefineNgModule({ type: TreeviewModule }); }
-    /** @nocollapse */ static { this.ɵinj = /** @pureOrBreakMyCode */ i0.ɵɵdefineInjector({ imports: [FormsModule, CommonModule] }); }
+    /** @nocollapse */ static { this.ɵinj = /** @pureOrBreakMyCode */ i0.ɵɵdefineInjector({ imports: [TreeviewComponent, TreeviewItemComponent] }); }
 }
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TreeviewModule, [{
         type: NgModule,
         args: [{
-                imports: [FormsModule, CommonModule],
-                declarations: [TreeviewComponent, TreeviewItemComponent, TreeviewPipe],
+                imports: [TreeviewComponent, TreeviewItemComponent, TreeviewPipe],
                 exports: [TreeviewComponent, TreeviewPipe],
-                providers: [],
             }]
     }], null, null); })();
-(function () { (typeof ngJitMode === "undefined" || ngJitMode) && i0.ɵɵsetNgModuleScope(TreeviewModule, { declarations: [TreeviewComponent, TreeviewItemComponent, TreeviewPipe], imports: [FormsModule, CommonModule], exports: [TreeviewComponent, TreeviewPipe] }); })();
+(function () { (typeof ngJitMode === "undefined" || ngJitMode) && i0.ɵɵsetNgModuleScope(TreeviewModule, { imports: [TreeviewComponent, TreeviewItemComponent, TreeviewPipe], exports: [TreeviewComponent, TreeviewPipe] }); })();
 
 class DrAlertModule {
     /** @nocollapse */ static { this.ɵfac = function DrAlertModule_Factory(t) { return new (t || DrAlertModule)(); }; }
@@ -15155,18 +15163,16 @@ class DrToastrModule {
 class DrCodeEditorModule {
     /** @nocollapse */ static { this.ɵfac = function DrCodeEditorModule_Factory(t) { return new (t || DrCodeEditorModule)(); }; }
     /** @nocollapse */ static { this.ɵmod = /** @pureOrBreakMyCode */ i0.ɵɵdefineNgModule({ type: DrCodeEditorModule }); }
-    /** @nocollapse */ static { this.ɵinj = /** @pureOrBreakMyCode */ i0.ɵɵdefineInjector({ imports: [CommonModule, FormsModule, ReactiveFormsModule, DrTooltipModule, DrErrorModule] }); }
+    /** @nocollapse */ static { this.ɵinj = /** @pureOrBreakMyCode */ i0.ɵɵdefineInjector({ imports: [DrCodeEditorComponent] }); }
 }
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DrCodeEditorModule, [{
         type: NgModule,
         args: [{
-                imports: [CommonModule, FormsModule, ReactiveFormsModule, DrTooltipModule, DrErrorModule],
+                imports: [DrCodemirrorComponent, DrCodeEditorComponent, CodeEditorHintWrapperComponent],
                 exports: [DrCodemirrorComponent, DrCodeEditorComponent, CodeEditorHintWrapperComponent],
-                providers: [],
-                declarations: [DrCodemirrorComponent, DrCodeEditorComponent, CodeEditorHintWrapperComponent],
             }]
     }], null, null); })();
-(function () { (typeof ngJitMode === "undefined" || ngJitMode) && i0.ɵɵsetNgModuleScope(DrCodeEditorModule, { declarations: [DrCodemirrorComponent, DrCodeEditorComponent, CodeEditorHintWrapperComponent], imports: [CommonModule, FormsModule, ReactiveFormsModule, DrTooltipModule, DrErrorModule], exports: [DrCodemirrorComponent, DrCodeEditorComponent, CodeEditorHintWrapperComponent] }); })();
+(function () { (typeof ngJitMode === "undefined" || ngJitMode) && i0.ɵɵsetNgModuleScope(DrCodeEditorModule, { imports: [DrCodemirrorComponent, DrCodeEditorComponent, CodeEditorHintWrapperComponent], exports: [DrCodemirrorComponent, DrCodeEditorComponent, CodeEditorHintWrapperComponent] }); })();
 
 function DrChipComponent_i_0_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelement(0, "i", 4);