c3-components 0.15.3 → 0.16.0

package/fesm2022/c3-components.mjs

@@ -1,14 +1,13 @@
 import * as i0 from '@angular/core';
-import { input, signal, viewChild, TemplateRef, inject, ChangeDetectorRef, effect, Component, forwardRef, model, HostListener, Directive, NgModule, Inject, ViewContainerRef, Injector, Injectable, Pipe, output, ViewEncapsulation, Optional, computed, InjectionToken, contentChild, contentChildren, HostBinding, ElementRef, DestroyRef } from '@angular/core';
+import { input, signal, viewChild, TemplateRef, computed, inject, ChangeDetectorRef, effect, Component, forwardRef, ElementRef, ViewContainerRef, HostListener, Directive, NgModule, Inject, Injector, Injectable, Pipe, output, ViewEncapsulation, Optional, InjectionToken, contentChild, contentChildren, HostBinding, model, DestroyRef, PLATFORM_ID, ChangeDetectionStrategy, ContentChildren, ViewChild } from '@angular/core';
 import * as i1 from '@angular/common';
-import { CommonModule } from '@angular/common';
+import { CommonModule, isPlatformBrowser } from '@angular/common';
 import * as i2 from '@angular/forms';
 import { NG_VALUE_ACCESSOR, FormsModule, ReactiveFormsModule } from '@angular/forms';
-import * as i1$1 from '@angular/cdk/overlay';
-import { OverlayConfig, OverlayModule } from '@angular/cdk/overlay';
+import { Overlay, OverlayConfig, OverlayModule } from '@angular/cdk/overlay';
 import { TemplatePortal } from '@angular/cdk/portal';
-import { Subscription, Subject, merge, takeUntil, BehaviorSubject, filter, skip, debounceTime, of, mergeMap, map, tap, startWith } from 'rxjs';
-import * as i1$2 from '@angular/material/dialog';
+import { Subscription, Subject, merge, takeUntil, BehaviorSubject, filter, skip, debounceTime, of, mergeMap, map, tap, startWith, distinctUntilChanged } from 'rxjs';
+import * as i1$1 from '@angular/material/dialog';
 import { MAT_DIALOG_DATA, MatDialog, MatDialogModule } from '@angular/material/dialog';
 import * as i3 from '@angular/material/button';
 import { MatButtonModule } from '@angular/material/button';
@@ -21,9 +20,9 @@ import * as i2$1 from '@angular/material/icon';
 import { MatIconModule } from '@angular/material/icon';
 import * as i5$1 from '@angular/material/toolbar';
 import { MatToolbarModule } from '@angular/material/toolbar';
-import * as i1$4 from '@angular/common/http';
+import * as i1$3 from '@angular/common/http';
 import { provideHttpClient, withInterceptorsFromDi, HttpClient } from '@angular/common/http';
-import * as i1$3 from '@angular/platform-browser';
+import * as i1$2 from '@angular/platform-browser';
 import * as i3$2 from '@angular/material/core';
 import { MatNativeDateModule, MatRippleModule } from '@angular/material/core';
 import * as i5$2 from '@angular/material/menu';
@@ -34,28 +33,54 @@ import autoAnimate from '@formkit/auto-animate';
 import { FlatTreeControl } from '@angular/cdk/tree';
 import * as i4$1 from '@angular/material/progress-spinner';
 import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
-import * as i1$5 from '@angular/material/tree';
+import * as i1$4 from '@angular/material/tree';
 import { MatTreeFlattener, MatTreeFlatDataSource, MatTreeModule } from '@angular/material/tree';
-import * as i1$6 from '@angular/router';
-import { Router, ActivatedRoute, RouterModule } from '@angular/router';
+import * as i1$5 from '@angular/router';
+import { Router, ActivatedRoute, RouterModule, NavigationEnd, RouterLink } from '@angular/router';
 import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
 
 class C3DropdownComponent {
     constructor() {
+        /** Classes set directly on the component via [panelClass]. */
         this.panelClass = input(...(ngDevMode ? [undefined, { debugName: "panelClass" }] : []));
+        /** Classes set by the trigger directive via [c3DropdownClass] or [dropdownClass]. */
+        this.dropdownClass = signal(undefined, ...(ngDevMode ? [{ debugName: "dropdownClass" }] : []));
+        /** Whether the dropdown is currently open. */
         this.isOpen = signal(false, ...(ngDevMode ? [{ debugName: "isOpen" }] : []));
         this.template = viewChild.required((TemplateRef));
+        /** Merges panelClass (from component input) and dropdownClass (from trigger). */
+        this.mergedClass = computed(() => {
+            const panel = this.panelClass();
+            const dropdown = this.dropdownClass();
+            if (!panel && !dropdown)
+                return '';
+            if (!panel)
+                return dropdown;
+            if (!dropdown)
+                return panel;
+            // Merge both into an array
+            const toArray = (v) => {
+                if (typeof v === 'string')
+                    return v ? [v] : [];
+                if (Array.isArray(v))
+                    return v;
+                if (v instanceof Set)
+                    return [...v];
+                return Object.keys(v).filter((k) => v[k]);
+            };
+            return [...toArray(panel), ...toArray(dropdown)];
+        }, ...(ngDevMode ? [{ debugName: "mergedClass" }] : []));
         this._changeDetectorRef = inject(ChangeDetectorRef);
         effect(() => {
-            if (this.panelClass()) {
-                this._changeDetectorRef.markForCheck();
-            }
+            // Trigger change detection when either class source changes
+            this.mergedClass();
+            this._changeDetectorRef.markForCheck();
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: C3DropdownComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "20.3.14", type: C3DropdownComponent, isStandalone: false, selector: "c3-dropdown", inputs: { panelClass: { classPropertyName: "panelClass", publicName: "panelClass", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "template", first: true, predicate: (TemplateRef), descendants: true, isSignal: true }], ngImport: i0, template: `
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "20.3.14", type: C3DropdownComponent, isStandalone: false, selector: "c3-dropdown", inputs: { panelClass: { classPropertyName: "panelClass", publicName: "panelClass", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "template", first: true, predicate: (TemplateRef), descendants: true, isSignal: true }], exportAs: ["c3Dropdown"], ngImport: i0, template: `
     <ng-template>
-      <div class="c3-dropdown-panel" [ngClass]="panelClass()">
+      <div class="c3-dropdown-panel" [ngClass]="mergedClass()">
         <ng-content></ng-content>
       </div>
     </ng-template>
@@ -65,9 +90,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImpo
             type: Component,
             args: [{
                     selector: 'c3-dropdown',
+                    exportAs: 'c3Dropdown',
                     template: `
     <ng-template>
-      <div class="c3-dropdown-panel" [ngClass]="panelClass()">
+      <div class="c3-dropdown-panel" [ngClass]="mergedClass()">
         <ng-content></ng-content>
       </div>
     </ng-template>
@@ -84,28 +110,42 @@ const MAT_DROPDOWN_VALUE_ACCESSOR = {
 /**
  * @description The C3DropdownTrigger directive is used to display or hide a dropdown menu
  * C3DropdownComponent when an item is clicked.
- * @selector [c3Dropdown]
+ * @selector [c3Dropdown], [c3DropdownTrigger]
  * @exportAs c3DropdownTrigger
  * @input c3Dropdown - A reference to an instance of C3DropdownComponent.
+ * @input c3DropdownTrigger - A reference to an instance of C3DropdownComponent (alias).
  * @input c3DropdownDisabled - A boolean indicating whether the directive should be disabled.
- * @input c3DropdownClass - A string, an array of strings, a set of strings or a
- * object representing the CSS classes to be applied to the dropdown menu.
+ * @input c3DropdownClass / dropdownClass - CSS classes to be applied to the dropdown panel.
  */
 class C3DropdownTrigger {
-    constructor(_element, _overlay, _viewContainerRef) {
-        this._element = _element;
-        this._overlay = _overlay;
-        this._viewContainerRef = _viewContainerRef;
+    constructor() {
         this._closingActionsSubscription = Subscription.EMPTY;
         this._destroyed = new Subject();
-        /** The dropdown menu instance */
-        this.dropdown = model.required(...(ngDevMode ? [{ debugName: "dropdown", alias: 'c3DropdownTrigger' }] : [{
-                alias: 'c3DropdownTrigger',
-            }]));
+        this._element = inject((ElementRef));
+        this._overlay = inject(Overlay);
+        this._viewContainerRef = inject(ViewContainerRef);
+        /** The dropdown menu instance (via [c3Dropdown] binding). */
+        this.c3Dropdown = input(null, ...(ngDevMode ? [{ debugName: "c3Dropdown" }] : []));
+        /** The dropdown menu instance (via [c3DropdownTrigger] binding). */
+        this.c3DropdownTrigger = input(null, ...(ngDevMode ? [{ debugName: "c3DropdownTrigger" }] : []));
+        /** Resolved dropdown reference (supports both binding syntaxes). */
+        this._dropdown = computed(() => this.c3Dropdown() ?? this.c3DropdownTrigger(), ...(ngDevMode ? [{ debugName: "_dropdown" }] : []));
         /** Whether the dropdown is disabled. */
-        this.dropdownDisabled = input(false, ...(ngDevMode ? [{ debugName: "dropdownDisabled" }] : []));
-        /** Classes to be passed to the dropdown menu. Supports the same syntax as `ngClass`. */
-        this.dropdownClass = input('', ...(ngDevMode ? [{ debugName: "dropdownClass" }] : []));
+        this.dropdownDisabled = input(false, ...(ngDevMode ? [{ debugName: "dropdownDisabled", alias: 'c3DropdownDisabled' }] : [{
+                alias: 'c3DropdownDisabled',
+            }]));
+        /** Classes to be passed to the dropdown menu via [c3DropdownClass]. */
+        this.c3DropdownClass = input(undefined, ...(ngDevMode ? [{ debugName: "c3DropdownClass" }] : []));
+        /** Classes to be passed to the dropdown menu via [dropdownClass]. */
+        this.dropdownClass = input(undefined, ...(ngDevMode ? [{ debugName: "dropdownClass" }] : []));
+        // Push trigger class changes to the dropdown component
+        effect(() => {
+            const dropdown = this._dropdown();
+            const cls = this.c3DropdownClass() ?? this.dropdownClass();
+            if (dropdown) {
+                dropdown.dropdownClass.set(cls);
+            }
+        });
     }
     onClick() {
         this.show();
@@ -117,19 +157,21 @@ class C3DropdownTrigger {
         this.close();
     }
     show() {
-        if (!this.dropdown().template())
+        const dropdown = this._dropdown();
+        if (!dropdown?.template())
             return;
-        this.dropdown().isOpen.set(true);
+        dropdown.isOpen.set(true);
         const overlayRef = this._overlay.create(this._getOverlayConfig());
-        const portal = new TemplatePortal(this.dropdown().template(), this._viewContainerRef);
+        const portal = new TemplatePortal(dropdown.template(), this._viewContainerRef);
         overlayRef.attach(portal);
         this.overlayRef = overlayRef;
         this._closingActionsSubscription = this._menuClosingActions().subscribe(() => this.close());
     }
     close() {
-        if (this.overlayRef && this.overlayRef.hasAttached())
+        if (this.overlayRef?.hasAttached()) {
             this.overlayRef.detach();
-        this.dropdown().isOpen.set(false);
+        }
+        this._dropdown()?.isOpen.set(false);
     }
     _getOverlayConfig() {
         const belowPosition = {
@@ -143,9 +185,6 @@ class C3DropdownTrigger {
             originY: 'top',
             overlayX: 'start',
             overlayY: 'bottom',
-            // The overlay edge connected to the trigger should have squared corners, while
-            // the opposite end has rounded corners. We apply a CSS class to swap the
-            // border-radius based on the overlay position.
             panelClass: 'mat-autocomplete-panel-above',
         };
         const positionStrategy = this._overlay
@@ -165,17 +204,18 @@ class C3DropdownTrigger {
         const detachments = this.overlayRef.detachments();
         return merge(backdrop, detachments).pipe(takeUntil(this._destroyed));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: C3DropdownTrigger, deps: [{ token: i0.ElementRef }, { token: i1$1.Overlay }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.14", type: C3DropdownTrigger, isStandalone: false, selector: "[c3DropdownTrigger]", inputs: { dropdown: { classPropertyName: "dropdown", publicName: "c3DropdownTrigger", isSignal: true, isRequired: true, transformFunction: null }, dropdownDisabled: { classPropertyName: "dropdownDisabled", publicName: "dropdownDisabled", isSignal: true, isRequired: false, transformFunction: null }, dropdownClass: { classPropertyName: "dropdownClass", publicName: "dropdownClass", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { dropdown: "c3DropdownTriggerChange" }, host: { listeners: { "click": "onClick()" } }, providers: [MAT_DROPDOWN_VALUE_ACCESSOR], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: C3DropdownTrigger, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.14", type: C3DropdownTrigger, isStandalone: false, selector: "[c3Dropdown], [c3DropdownTrigger]", inputs: { c3Dropdown: { classPropertyName: "c3Dropdown", publicName: "c3Dropdown", isSignal: true, isRequired: false, transformFunction: null }, c3DropdownTrigger: { classPropertyName: "c3DropdownTrigger", publicName: "c3DropdownTrigger", isSignal: true, isRequired: false, transformFunction: null }, dropdownDisabled: { classPropertyName: "dropdownDisabled", publicName: "c3DropdownDisabled", isSignal: true, isRequired: false, transformFunction: null }, c3DropdownClass: { classPropertyName: "c3DropdownClass", publicName: "c3DropdownClass", isSignal: true, isRequired: false, transformFunction: null }, dropdownClass: { classPropertyName: "dropdownClass", publicName: "dropdownClass", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "click": "onClick()" } }, providers: [MAT_DROPDOWN_VALUE_ACCESSOR], exportAs: ["c3DropdownTrigger"], ngImport: i0 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: C3DropdownTrigger, decorators: [{
             type: Directive,
             args: [{
-                    selector: '[c3DropdownTrigger]',
+                    selector: '[c3Dropdown], [c3DropdownTrigger]',
+                    exportAs: 'c3DropdownTrigger',
                     providers: [MAT_DROPDOWN_VALUE_ACCESSOR],
                     standalone: false,
                 }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i1$1.Overlay }, { type: i0.ViewContainerRef }], propDecorators: { dropdown: [{ type: i0.Input, args: [{ isSignal: true, alias: "c3DropdownTrigger", required: true }] }, { type: i0.Output, args: ["c3DropdownTriggerChange"] }], dropdownDisabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "dropdownDisabled", required: false }] }], dropdownClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "dropdownClass", required: false }] }], onClick: [{
+        }], ctorParameters: () => [], propDecorators: { c3Dropdown: [{ type: i0.Input, args: [{ isSignal: true, alias: "c3Dropdown", required: false }] }], c3DropdownTrigger: [{ type: i0.Input, args: [{ isSignal: true, alias: "c3DropdownTrigger", required: false }] }], dropdownDisabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "c3DropdownDisabled", required: false }] }], c3DropdownClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "c3DropdownClass", required: false }] }], dropdownClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "dropdownClass", required: false }] }], onClick: [{
                 type: HostListener,
                 args: ['click']
             }] } });
@@ -202,7 +242,7 @@ class C3AlertDialogComponent {
     onNoClick() {
         this.dialogRef.close();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: C3AlertDialogComponent, deps: [{ token: i1$2.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: C3AlertDialogComponent, deps: [{ token: i1$1.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.14", type: C3AlertDialogComponent, isStandalone: false, selector: "AlertDialogComponent", ngImport: i0, template: `
     <mat-dialog-content>
       <div [innerHtml]="data.text"></div>
@@ -212,7 +252,7 @@ class C3AlertDialogComponent {
         {{ data.acceptText || 'ok' }}
       </button>
     </mat-dialog-actions>
-  `, isInline: true, dependencies: [{ kind: "component", type: i3.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "directive", type: i1$2.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i1$2.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i1$2.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }] }); }
+  `, isInline: true, dependencies: [{ kind: "component", type: i3.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "directive", type: i1$1.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i1$1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i1$1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: C3AlertDialogComponent, decorators: [{
             type: Component,
@@ -230,7 +270,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImpo
   `,
                     standalone: false
                 }]
-        }], ctorParameters: () => [{ type: i1$2.MatDialogRef }, { type: undefined, decorators: [{
+        }], ctorParameters: () => [{ type: i1$1.MatDialogRef }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [MAT_DIALOG_DATA]
                 }] }] });
@@ -243,7 +283,7 @@ class ConfirmDialogComponent {
     onNoClick() {
         this.dialogRef.close();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: ConfirmDialogComponent, deps: [{ token: i1$2.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: ConfirmDialogComponent, deps: [{ token: i1$1.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.14", type: ConfirmDialogComponent, isStandalone: false, selector: "ConfirmDialogComponent", ngImport: i0, template: `
     <mat-dialog-content>
       <div [innerHtml]="data.text"></div>
@@ -256,7 +296,7 @@ class ConfirmDialogComponent {
         {{ data.accept?.text }}
       </button>
     </mat-dialog-actions>
-  `, isInline: true, dependencies: [{ kind: "component", type: i3.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "directive", type: i1$2.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i1$2.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i1$2.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }] }); }
+  `, isInline: true, dependencies: [{ kind: "component", type: i3.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "directive", type: i1$1.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i1$1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i1$1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: ConfirmDialogComponent, decorators: [{
             type: Component,
@@ -277,7 +317,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImpo
   `,
                     standalone: false
                 }]
-        }], ctorParameters: () => [{ type: i1$2.MatDialogRef }, { type: undefined, decorators: [{
+        }], ctorParameters: () => [{ type: i1$1.MatDialogRef }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [MAT_DIALOG_DATA]
                 }] }] });
@@ -292,7 +332,7 @@ class C3PromptDialogComponent {
     onNoClick() {
         this.dialogRef.close();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: C3PromptDialogComponent, deps: [{ token: i1$2.MatDialogRef }, { token: MAT_DIALOG_DATA }, { token: i2.FormBuilder }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: C3PromptDialogComponent, deps: [{ token: i1$1.MatDialogRef }, { token: MAT_DIALOG_DATA }, { token: i2.FormBuilder }], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.14", type: C3PromptDialogComponent, isStandalone: false, selector: "PrompDialogComponent", ngImport: i0, template: `
     <div mat-dialog-title>{{ data.text }}</div>
     <mat-dialog-content>
@@ -329,7 +369,7 @@ class C3PromptDialogComponent {
         {{ data.accept?.text }}
       </button>
     </mat-dialog-actions>
-    `, isInline: true, styles: ["mat-form-field{width:100%}\n"], dependencies: [{ kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "component", type: i3.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "directive", type: i1$2.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i1$2.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i1$2.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i1$2.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatLabel, selector: "mat-label" }, { kind: "directive", type: i5.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "directive", type: i6.CdkTextareaAutosize, selector: "textarea[cdkTextareaAutosize]", inputs: ["cdkAutosizeMinRows", "cdkAutosizeMaxRows", "cdkTextareaAutosize", "placeholder"], exportAs: ["cdkTextareaAutosize"] }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] }); }
+    `, isInline: true, styles: ["mat-form-field{width:100%}\n"], dependencies: [{ kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "component", type: i3.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "directive", type: i1$1.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i1$1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i1$1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i1$1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatLabel, selector: "mat-label" }, { kind: "directive", type: i5.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "directive", type: i6.CdkTextareaAutosize, selector: "textarea[cdkTextareaAutosize]", inputs: ["cdkAutosizeMinRows", "cdkAutosizeMaxRows", "cdkTextareaAutosize", "placeholder"], exportAs: ["cdkTextareaAutosize"] }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: C3PromptDialogComponent, decorators: [{
             type: Component,
@@ -370,7 +410,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImpo
       </button>
     </mat-dialog-actions>
     `, standalone: false, styles: ["mat-form-field{width:100%}\n"] }]
-        }], ctorParameters: () => [{ type: i1$2.MatDialogRef }, { type: undefined, decorators: [{
+        }], ctorParameters: () => [{ type: i1$1.MatDialogRef }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [MAT_DIALOG_DATA]
                 }] }, { type: i2.FormBuilder }] });
@@ -438,7 +478,7 @@ class C3DialogEmbedChildComponent {
             }
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: C3DialogEmbedChildComponent, deps: [{ token: i1$2.MatDialogRef }, { token: MAT_DIALOG_DATA }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: C3DialogEmbedChildComponent, deps: [{ token: i1$1.MatDialogRef }, { token: MAT_DIALOG_DATA }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.14", type: C3DialogEmbedChildComponent, isStandalone: false, selector: "C3DialogEmbedChildComponent", viewQueries: [{ propertyName: "target", first: true, predicate: ["target"], descendants: true, read: ViewContainerRef, isSignal: true }], ngImport: i0, template: `
     <div [class]="'dialog-content-container ' + (data.classContainer || '')">
       @if (data.toolbar) {
@@ -497,7 +537,7 @@ class C3DialogEmbedChildComponent {
         </div>
       }
     </div>
-  `, isInline: true, styles: [".dialog-content-container{display:flex;flex-direction:column;height:100%;padding:1rem;overflow:auto}.dialog-content-container .dialog-content{display:flex;flex-direction:column;height:100%;overflow:auto;flex-grow:1}.dialog-content-container .mat-toolbar{display:flex;justify-content:space-between;align-items:center;border-radius:.25rem}.dialog-content-container .mat-toolbar span{color:inherit}.dialog-content-container .spacer{flex:1 1 auto;min-width:16px}.dialog-actions{display:flex;justify-content:flex-end;gap:.5rem}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i3.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i3.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "directive", type: i1$2.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "component", type: i2$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i5$1.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }] }); }
+  `, isInline: true, styles: [".dialog-content-container{display:flex;flex-direction:column;height:100%;padding:1rem;overflow:auto}.dialog-content-container .dialog-content{display:flex;flex-direction:column;height:100%;overflow:auto;flex-grow:1}.dialog-content-container .mat-toolbar{display:flex;justify-content:space-between;align-items:center;border-radius:.25rem}.dialog-content-container .mat-toolbar span{color:inherit}.dialog-content-container .spacer{flex:1 1 auto;min-width:16px}.dialog-actions{display:flex;justify-content:flex-end;gap:.5rem}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i3.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i3.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "directive", type: i1$1.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "component", type: i2$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i5$1.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: C3DialogEmbedChildComponent, decorators: [{
             type: Component,
@@ -560,7 +600,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImpo
       }
     </div>
   `, standalone: false, styles: [".dialog-content-container{display:flex;flex-direction:column;height:100%;padding:1rem;overflow:auto}.dialog-content-container .dialog-content{display:flex;flex-direction:column;height:100%;overflow:auto;flex-grow:1}.dialog-content-container .mat-toolbar{display:flex;justify-content:space-between;align-items:center;border-radius:.25rem}.dialog-content-container .mat-toolbar span{color:inherit}.dialog-content-container .spacer{flex:1 1 auto;min-width:16px}.dialog-actions{display:flex;justify-content:flex-end;gap:.5rem}\n"] }]
-        }], ctorParameters: () => [{ type: i1$2.MatDialogRef }, { type: undefined, decorators: [{
+        }], ctorParameters: () => [{ type: i1$1.MatDialogRef }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [MAT_DIALOG_DATA]
                 }] }, { type: i0.ChangeDetectorRef }], propDecorators: { target: [{ type: i0.ViewChild, args: ['target', { ...{
@@ -931,7 +971,7 @@ class C3SafeUrlPipe {
     transform(url) {
         return url ? this.sanitizer.bypassSecurityTrustResourceUrl(url) : '';
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: C3SafeUrlPipe, deps: [{ token: i1$3.DomSanitizer }], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: C3SafeUrlPipe, deps: [{ token: i1$2.DomSanitizer }], target: i0.ɵɵFactoryTarget.Pipe }); }
     static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.3.14", ngImport: i0, type: C3SafeUrlPipe, isStandalone: true, name: "c3SafeUrl" }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: C3SafeUrlPipe, decorators: [{
@@ -940,7 +980,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImpo
                     name: 'c3SafeUrl',
                     standalone: true,
                 }]
-        }], ctorParameters: () => [{ type: i1$3.DomSanitizer }] });
+        }], ctorParameters: () => [{ type: i1$2.DomSanitizer }] });
 
 class C3FileViewerImageComponent {
     constructor() {
@@ -1050,7 +1090,7 @@ class C3FileViewerComponent {
         this.fileViewer().styleHeight =
             'calc(100% - ' + this.screenHeightOccupied() + 'px)';
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: C3FileViewerComponent, deps: [{ token: 'config', optional: true }, { token: i1$4.HttpClient }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: C3FileViewerComponent, deps: [{ token: 'config', optional: true }, { token: i1$3.HttpClient }], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.14", type: C3FileViewerComponent, isStandalone: false, selector: "c3-file-viewer", inputs: { screenHeightOccupied: { classPropertyName: "screenHeightOccupied", publicName: "screenHeightOccupied", isSignal: true, isRequired: false, transformFunction: null }, fileViewer: { classPropertyName: "fileViewer", publicName: "fileViewer", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { indexChange: "indexChange", configChange: "configChange", customFileEvent: "customFileEvent" }, host: { listeners: { "mouseover": "onMouseOver()", "mouseleave": "onMouseLeave()", "window:keyup.ArrowRight": "next($event)", "window:keyup.ArrowLeft": "previous($event)" }, classAttribute: "c3-file-viewer" }, usesOnChanges: true, ngImport: i0, template: "@if (fileViewer(); as viewer) {\n<div\n  class=\"c3-file-container\"\n  [c3-full-screen]=\"viewer.fullscreen$ | async\"\n  [style.height]=\"viewer.styleHeight\"\n  [style.backgroundColor]=\"viewer.config.containerBackgroundColor\"\n  (wheel)=\"viewer.scrollZoom($event)\"\n  (dragover)=\"viewer.onDragOver($event)\"\n>\n  @if (viewer.currentFile.type.startsWith('image')) {\n    <c3-file-viewer-image\n      [fileViewer]=\"viewer\"\n      [style]=\"viewer.style\"\n      (dragstart)=\"viewer.onDragStart($event)\"\n    />\n  } @else if (viewer.currentFile.type.startsWith('video')) {\n    <c3-file-viewer-video\n      [fileViewer]=\"viewer\"\n    />\n  } @else if (viewer.currentFile.type.startsWith('application/pdf')) {\n    <c3-file-viewer-pdf\n      [fileViewer]=\"viewer\"\n    />\n  } @else {\n    <c3-file-viewer-default\n      [fileViewer]=\"viewer\"\n    />\n  }\n\n  <!-- Div below will be used to hide the 'ghost' image when dragging -->\n  <div></div>\n  @if (viewer.loading) {\n    <div class=\"spinner-container\">\n      <div class=\"spinner\"></div>\n    </div>\n  }\n\n    <c3-file-viewer-actions [fileViewer]=\"viewer\" />\n  </div>\n}\n", styles: [".c3-file-container{position:relative;width:100%;display:flex;justify-content:center;align-items:center;overflow:hidden}\n"], dependencies: [{ kind: "directive", type: FullScreenDirective, selector: "[C3FullScreen], [c3-full-screen]", inputs: ["c3Screenfull", "c3-full-screen"] }, { kind: "component", type: C3FileViewerActionsComponent, selector: "c3-file-viewer-actions", inputs: ["fileViewer"] }, { kind: "component", type: C3FileViewerImageComponent, selector: "c3-file-viewer-image, [c3-file-viewer-image]", inputs: ["fileViewer"], outputs: ["dragstart"] }, { kind: "component", type: C3FileViewerPdfComponent, selector: "c3-file-viewer-pdf", inputs: ["fileViewer"], outputs: ["dragstart"] }, { kind: "component", type: C3FileViewerVideoComponent, selector: "c3-file-viewer-video", inputs: ["fileViewer"] }, { kind: "component", type: C3FileViewerDefaultComponent, selector: "c3-file-viewer-default", inputs: ["fileViewer"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: C3FileViewerComponent, decorators: [{
@@ -1063,7 +1103,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImpo
                 }, {
                     type: Inject,
                     args: ['config']
-                }] }, { type: i1$4.HttpClient }], propDecorators: { screenHeightOccupied: [{ type: i0.Input, args: [{ isSignal: true, alias: "screenHeightOccupied", required: false }] }], fileViewer: [{ type: i0.Input, args: [{ isSignal: true, alias: "fileViewer", required: true }] }], indexChange: [{ type: i0.Output, args: ["indexChange"] }], configChange: [{ type: i0.Output, args: ["configChange"] }], customFileEvent: [{ type: i0.Output, args: ["customFileEvent"] }], onMouseOver: [{
+                }] }, { type: i1$3.HttpClient }], propDecorators: { screenHeightOccupied: [{ type: i0.Input, args: [{ isSignal: true, alias: "screenHeightOccupied", required: false }] }], fileViewer: [{ type: i0.Input, args: [{ isSignal: true, alias: "fileViewer", required: true }] }], indexChange: [{ type: i0.Output, args: ["indexChange"] }], configChange: [{ type: i0.Output, args: ["configChange"] }], customFileEvent: [{ type: i0.Output, args: ["customFileEvent"] }], onMouseOver: [{
                 type: HostListener,
                 args: ['mouseover']
             }], onMouseLeave: [{
@@ -1528,7 +1568,7 @@ class C3FileViewerDialogComponent {
             ...this.dialogConfig(),
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: C3FileViewerDialogComponent, deps: [{ token: i1$2.MatDialog }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: C3FileViewerDialogComponent, deps: [{ token: i1$1.MatDialog }], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.14", type: C3FileViewerDialogComponent, isStandalone: false, selector: "c3-file-viewer-dialog", inputs: { fileViewer: { classPropertyName: "fileViewer", publicName: "fileViewer", isSignal: true, isRequired: true, transformFunction: null }, dialogConfig: { classPropertyName: "dialogConfig", publicName: "dialogConfig", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "click": "openDialog()" }, classAttribute: "c3-file-viewer-dialog" }, ngImport: i0, template: ` <ng-content /> `, isInline: true }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: C3FileViewerDialogComponent, decorators: [{
@@ -1541,7 +1581,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImpo
                     },
                     standalone: false
                 }]
-        }], ctorParameters: () => [{ type: i1$2.MatDialog }], propDecorators: { fileViewer: [{ type: i0.Input, args: [{ isSignal: true, alias: "fileViewer", required: true }] }], dialogConfig: [{ type: i0.Input, args: [{ isSignal: true, alias: "dialogConfig", required: false }] }], openDialog: [{
+        }], ctorParameters: () => [{ type: i1$1.MatDialog }], propDecorators: { fileViewer: [{ type: i0.Input, args: [{ isSignal: true, alias: "fileViewer", required: true }] }], dialogConfig: [{ type: i0.Input, args: [{ isSignal: true, alias: "dialogConfig", required: false }] }], openDialog: [{
                 type: HostListener,
                 args: ['click']
             }] } });
@@ -2117,7 +2157,7 @@ class C3TreeComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: C3TreeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.14", type: C3TreeComponent, isStandalone: true, selector: "c3-tree", inputs: { treeData: { classPropertyName: "treeData", publicName: "treeData", isSignal: true, isRequired: true, transformFunction: null }, isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { treeData: "treeDataChange", isLoading: "isLoadingChange", treeDataSelected: "treeDataSelected" }, ngImport: i0, template: "@if(isLoading()) {\r\n<div class=\"c3-tree-loader\">\r\n  <mat-spinner diameter=\"50\"></mat-spinner>\r\n</div>\r\n}\r\n\r\n<mat-tree [dataSource]=\"dataSource\" [treeControl]=\"treeControl\">\r\n  <mat-tree-node *matTreeNodeDef=\"let node\" matTreeNodePadding class=\"children\">\r\n    <button mat-ripple (click)=\"treeDataSelected.emit(node)\">\r\n      {{ node.name }}\r\n    </button>\r\n  </mat-tree-node>\r\n  <mat-tree-node\r\n    *matTreeNodeDef=\"let node; when: hasChild\"\r\n    matTreeNodePadding\r\n    class=\"has-children\"\r\n  >\r\n    <button matTreeNodeToggle [attr.aria-label]=\"'Toggle ' + node.name\">\r\n      <mat-icon class=\"mat-icon-rtl-mirror\">\r\n        {{ treeControl.isExpanded(node) ? \"expand_more\" : \"chevron_right\" }}\r\n      </mat-icon>\r\n    </button>\r\n    <div class=\"mat-tree-node-content\">\r\n      <ng-content>\r\n        <span>{{ node.name }}</span>\r\n      </ng-content>\r\n    </div>\r\n  </mat-tree-node>\r\n</mat-tree>\r\n", styles: [":host{display:block;width:100%;position:relative;min-height:100%;padding:4px 0}.c3-tree-loader{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}mat-tree{width:100%;height:100%;background-color:transparent;border:1px solid var(--mat-divider-color);border-radius:4px;overflow:auto}mat-tree mat-tree-node{display:flex;align-items:center;justify-content:start;gap:1rem}mat-tree mat-tree-node.has-children>button{height:32px;width:32px;border-radius:50%;display:flex;justify-content:center;align-items:center;border:1px solid transparent;margin:.5rem}mat-tree mat-tree-node.has-children>button:hover{border-color:var(--mat-divider-color)}mat-tree mat-tree-node.has-children:hover{background-color:var(--background-hover)}mat-tree mat-tree-node.has-children .mat-tree-node-content{padding-right:.25rem;display:flex;justify-content:space-between;align-items:center;width:100%}mat-tree mat-tree-node.children button{width:100%;border-radius:.25rem;padding:0 1rem;height:2rem;text-align:left}mat-tree mat-tree-node.children button:hover{background-color:var(--background-hover)}mat-tree mat-tree-node:hover{background-color:var(--background-hover)}\n"], dependencies: [{ kind: "ngmodule", type: MatTreeModule }, { kind: "directive", type: i1$5.MatTreeNodeDef, selector: "[matTreeNodeDef]", inputs: ["matTreeNodeDefWhen", "matTreeNode"] }, { kind: "directive", type: i1$5.MatTreeNodePadding, selector: "[matTreeNodePadding]", inputs: ["matTreeNodePadding", "matTreeNodePaddingIndent"] }, { kind: "directive", type: i1$5.MatTreeNodeToggle, selector: "[matTreeNodeToggle]", inputs: ["matTreeNodeToggleRecursive"] }, { kind: "component", type: i1$5.MatTree, selector: "mat-tree", exportAs: ["matTree"] }, { kind: "directive", type: i1$5.MatTreeNode, selector: "mat-tree-node", inputs: ["tabIndex", "disabled"], outputs: ["activation", "expandedChange"], exportAs: ["matTreeNode"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatRippleModule }, { kind: "directive", type: i3$2.MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"], exportAs: ["matRipple"] }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i4$1.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.14", type: C3TreeComponent, isStandalone: true, selector: "c3-tree", inputs: { treeData: { classPropertyName: "treeData", publicName: "treeData", isSignal: true, isRequired: true, transformFunction: null }, isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { treeData: "treeDataChange", isLoading: "isLoadingChange", treeDataSelected: "treeDataSelected" }, ngImport: i0, template: "@if(isLoading()) {\r\n<div class=\"c3-tree-loader\">\r\n  <mat-spinner diameter=\"50\"></mat-spinner>\r\n</div>\r\n}\r\n\r\n<mat-tree [dataSource]=\"dataSource\" [treeControl]=\"treeControl\">\r\n  <mat-tree-node *matTreeNodeDef=\"let node\" matTreeNodePadding class=\"children\">\r\n    <button mat-ripple (click)=\"treeDataSelected.emit(node)\">\r\n      {{ node.name }}\r\n    </button>\r\n  </mat-tree-node>\r\n  <mat-tree-node\r\n    *matTreeNodeDef=\"let node; when: hasChild\"\r\n    matTreeNodePadding\r\n    class=\"has-children\"\r\n  >\r\n    <button matTreeNodeToggle [attr.aria-label]=\"'Toggle ' + node.name\">\r\n      <mat-icon class=\"mat-icon-rtl-mirror\">\r\n        {{ treeControl.isExpanded(node) ? \"expand_more\" : \"chevron_right\" }}\r\n      </mat-icon>\r\n    </button>\r\n    <div class=\"mat-tree-node-content\">\r\n      <ng-content>\r\n        <span>{{ node.name }}</span>\r\n      </ng-content>\r\n    </div>\r\n  </mat-tree-node>\r\n</mat-tree>\r\n", styles: [":host{display:block;width:100%;position:relative;min-height:100%;padding:4px 0}.c3-tree-loader{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}mat-tree{width:100%;height:100%;background-color:transparent;border:1px solid var(--mat-divider-color);border-radius:4px;overflow:auto}mat-tree mat-tree-node{display:flex;align-items:center;justify-content:start;gap:1rem}mat-tree mat-tree-node.has-children>button{height:32px;width:32px;border-radius:50%;display:flex;justify-content:center;align-items:center;border:1px solid transparent;margin:.5rem}mat-tree mat-tree-node.has-children>button:hover{border-color:var(--mat-divider-color)}mat-tree mat-tree-node.has-children:hover{background-color:var(--background-hover)}mat-tree mat-tree-node.has-children .mat-tree-node-content{padding-right:.25rem;display:flex;justify-content:space-between;align-items:center;width:100%}mat-tree mat-tree-node.children button{width:100%;border-radius:.25rem;padding:0 1rem;height:2rem;text-align:left}mat-tree mat-tree-node.children button:hover{background-color:var(--background-hover)}mat-tree mat-tree-node:hover{background-color:var(--background-hover)}\n"], dependencies: [{ kind: "ngmodule", type: MatTreeModule }, { kind: "directive", type: i1$4.MatTreeNodeDef, selector: "[matTreeNodeDef]", inputs: ["matTreeNodeDefWhen", "matTreeNode"] }, { kind: "directive", type: i1$4.MatTreeNodePadding, selector: "[matTreeNodePadding]", inputs: ["matTreeNodePadding", "matTreeNodePaddingIndent"] }, { kind: "directive", type: i1$4.MatTreeNodeToggle, selector: "[matTreeNodeToggle]", inputs: ["matTreeNodeToggleRecursive"] }, { kind: "component", type: i1$4.MatTree, selector: "mat-tree", exportAs: ["matTree"] }, { kind: "directive", type: i1$4.MatTreeNode, selector: "mat-tree-node", inputs: ["tabIndex", "disabled"], outputs: ["activation", "expandedChange"], exportAs: ["matTreeNode"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatRippleModule }, { kind: "directive", type: i3$2.MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"], exportAs: ["matRipple"] }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i4$1.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: C3TreeComponent, decorators: [{
             type: Component,
@@ -2385,7 +2425,7 @@ class C3MenuComponent {
         this._c3Menu = inject(C3MenuService);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: C3MenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.14", type: C3MenuComponent, isStandalone: false, selector: "c3-menu", ngImport: i0, template: "@if(!_c3Menu.isHeadless()) {\n  <div id=\"app-menu\">\n    <div class=\"ui-scroll\">\n      <ul>\n        <ng-content></ng-content>\n      </ul>\n    </div>\n  </div>\n}\n<div class=\"layout-main\" [class.headless]=\"_c3Menu.isHeadless()\">\n  <router-outlet></router-outlet>\n</div>\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: i1$6.RouterOutlet, selector: "router-outlet", inputs: ["name", "routerOutletData"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.14", type: C3MenuComponent, isStandalone: false, selector: "c3-menu", ngImport: i0, template: "@if(!_c3Menu.isHeadless()) {\n  <div id=\"app-menu\">\n    <div class=\"ui-scroll\">\n      <ul>\n        <ng-content></ng-content>\n      </ul>\n    </div>\n  </div>\n}\n<div class=\"layout-main\" [class.headless]=\"_c3Menu.isHeadless()\">\n  <router-outlet></router-outlet>\n</div>\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: i1$5.RouterOutlet, selector: "router-outlet", inputs: ["name", "routerOutletData"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: C3MenuComponent, decorators: [{
             type: Component,
@@ -2422,7 +2462,7 @@ class C3NavItemComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: C3NavItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "20.3.14", type: C3NavItemComponent, isStandalone: false, selector: "c3-nav-item", inputs: { route: { classPropertyName: "route", publicName: "route", isSignal: true, isRequired: true, transformFunction: null }, itemTitle: { classPropertyName: "itemTitle", publicName: "itemTitle", isSignal: true, isRequired: true, transformFunction: null }, check: { classPropertyName: "check", publicName: "check", isSignal: true, isRequired: false, transformFunction: null }, isExternal: { classPropertyName: "isExternal", publicName: "isExternal", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "element", first: true, predicate: ["button"], descendants: true, read: ElementRef, isSignal: true }], ngImport: i0, template: "<li #button>\n  <a matRipple matRippleColor=\"#ffffff66\" [routerLink]=\"isExternal() ? null : route()\" [href]=\"isExternal() ? route() : null\">\n    <ng-content></ng-content>\n    <span> {{ itemTitle() }} </span>\n  </a>\n</li>\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: i1$6.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i3$2.MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"], exportAs: ["matRipple"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "20.3.14", type: C3NavItemComponent, isStandalone: false, selector: "c3-nav-item", inputs: { route: { classPropertyName: "route", publicName: "route", isSignal: true, isRequired: true, transformFunction: null }, itemTitle: { classPropertyName: "itemTitle", publicName: "itemTitle", isSignal: true, isRequired: true, transformFunction: null }, check: { classPropertyName: "check", publicName: "check", isSignal: true, isRequired: false, transformFunction: null }, isExternal: { classPropertyName: "isExternal", publicName: "isExternal", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "element", first: true, predicate: ["button"], descendants: true, read: ElementRef, isSignal: true }], ngImport: i0, template: "<li #button>\n  <a matRipple matRippleColor=\"#ffffff66\" [routerLink]=\"isExternal() ? null : route()\" [href]=\"isExternal() ? route() : null\">\n    <ng-content></ng-content>\n    <span> {{ itemTitle() }} </span>\n  </a>\n</li>\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: i1$5.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i3$2.MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"], exportAs: ["matRipple"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: C3NavItemComponent, decorators: [{
             type: Component,
@@ -2446,6 +2486,551 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImpo
                 }]
         }] });
 
+/**
+ * @description Directive that highlights matching text within the host element's content.
+ * Wraps matched text in `<span class="c3-highlight">` inside a `<span class="c3-highlight_container">`.
+ *
+ * @selector [c3HighlightText]
+ * @input c3HighlightText - The text to highlight.
+ * @input c3HighlightTextCaseSensitive - Whether the match should be case-sensitive (default: false).
+ *
+ * @example
+ * ```html
+ * <p [c3HighlightText]="searchTerm">Some text to search in</p>
+ * <p [c3HighlightText]="searchTerm" [c3HighlightTextCaseSensitive]="true">Case-sensitive match</p>
+ * ```
+ */
+class C3HighlightTextDirective {
+    constructor() {
+        /** The text string to highlight within the host element. */
+        this.highlightText = input('', ...(ngDevMode ? [{ debugName: "highlightText", alias: 'c3HighlightText' }] : [{
+                alias: 'c3HighlightText',
+            }]));
+        /** Whether the highlighting should be case-sensitive. Defaults to false. */
+        this.caseSensitive = input(false, ...(ngDevMode ? [{ debugName: "caseSensitive", alias: 'c3HighlightTextCaseSensitive' }] : [{
+                alias: 'c3HighlightTextCaseSensitive',
+            }]));
+        this._el = inject(ElementRef);
+        effect(() => {
+            const text = this.highlightText();
+            const sensitive = this.caseSensitive();
+            if (text) {
+                this._applyHighlight(this._el.nativeElement, text, sensitive);
+            }
+            else {
+                this._resetHighlights(this._el.nativeElement);
+            }
+        });
+    }
+    /** Walks the DOM tree and wraps matching text nodes in highlight spans. */
+    _applyHighlight(element, text, caseSensitive) {
+        this._resetHighlights(element);
+        if (!text)
+            return;
+        const flags = caseSensitive ? '' : 'i';
+        const regex = new RegExp(`(${this._escapeRegExp(text)})`, flags);
+        const textNodes = this._getTextNodes(element);
+        textNodes.forEach((node) => {
+            const parentNode = node.parentNode;
+            if (!(parentNode instanceof Element))
+                return;
+            if (parentNode.classList.contains('c3-highlight_container'))
+                return;
+            const match = node.textContent?.match(regex);
+            if (match) {
+                const wrapper = document.createElement('span');
+                wrapper.classList.add('c3-highlight_container');
+                wrapper.innerHTML = node.textContent.replace(regex, '<span class="c3-highlight">$1</span>');
+                parentNode.replaceChild(wrapper, node);
+            }
+        });
+    }
+    /** Escapes special regex characters in the search text. */
+    _escapeRegExp(text) {
+        return text.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
+    }
+    /** Removes all previously applied highlight wrappers, restoring original text nodes. */
+    _resetHighlights(element) {
+        element
+            .querySelectorAll('.c3-highlight_container')
+            .forEach((highlight) => {
+            const parent = highlight.parentNode;
+            if (parent) {
+                parent.insertBefore(document.createTextNode(highlight.textContent ?? ''), highlight);
+                parent.removeChild(highlight);
+            }
+        });
+    }
+    /** Recursively collects all text nodes within an element. */
+    _getTextNodes(element) {
+        const textNodes = [];
+        const nodes = element.childNodes;
+        for (let i = 0; i < nodes.length; i++) {
+            const node = nodes[i];
+            if (node.nodeType === Node.TEXT_NODE) {
+                textNodes.push(node);
+            }
+            else if (node.nodeType === Node.ELEMENT_NODE) {
+                textNodes.push(...this._getTextNodes(node));
+            }
+        }
+        return textNodes;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: C3HighlightTextDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.14", type: C3HighlightTextDirective, isStandalone: true, selector: "[c3HighlightText]", inputs: { highlightText: { classPropertyName: "highlightText", publicName: "c3HighlightText", isSignal: true, isRequired: false, transformFunction: null }, caseSensitive: { classPropertyName: "caseSensitive", publicName: "c3HighlightTextCaseSensitive", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: C3HighlightTextDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[c3HighlightText]',
+                    standalone: true,
+                }]
+        }], ctorParameters: () => [], propDecorators: { highlightText: [{ type: i0.Input, args: [{ isSignal: true, alias: "c3HighlightText", required: false }] }], caseSensitive: [{ type: i0.Input, args: [{ isSignal: true, alias: "c3HighlightTextCaseSensitive", required: false }] }] } });
+
+class C3HighlightTextModule {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: C3HighlightTextModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.14", ngImport: i0, type: C3HighlightTextModule, imports: [C3HighlightTextDirective], exports: [C3HighlightTextDirective] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: C3HighlightTextModule }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: C3HighlightTextModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [C3HighlightTextDirective],
+                    exports: [C3HighlightTextDirective],
+                }]
+        }] });
+
+/**
+ * @description A rounded title container that wraps projected content in a pill-shaped element.
+ * Styled via the `c3-rounded-title-theme` SCSS mixin.
+ *
+ * @selector c3-rounded-title
+ *
+ * @example
+ * ```html
+ * <c3-rounded-title>My Section Title</c3-rounded-title>
+ * ```
+ */
+class C3RoundedTitleComponent {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: C3RoundedTitleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.14", type: C3RoundedTitleComponent, isStandalone: true, selector: "c3-rounded-title", host: { classAttribute: "c3-rounded-title" }, ngImport: i0, template: `
+    <div class="title">
+      <ng-content></ng-content>
+    </div>
+  `, isInline: true, encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: C3RoundedTitleComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'c3-rounded-title',
+                    template: `
+    <div class="title">
+      <ng-content></ng-content>
+    </div>
+  `,
+                    encapsulation: ViewEncapsulation.None,
+                    host: { class: 'c3-rounded-title' },
+                    standalone: true,
+                }]
+        }] });
+
+class C3RoundedTitleModule {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: C3RoundedTitleModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.14", ngImport: i0, type: C3RoundedTitleModule, imports: [C3RoundedTitleComponent], exports: [C3RoundedTitleComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: C3RoundedTitleModule }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: C3RoundedTitleModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [C3RoundedTitleComponent],
+                    exports: [C3RoundedTitleComponent],
+                }]
+        }] });
+
+/**
+ * @description A simple navigation bar component with elevation.
+ * Content is projected via `ng-content`. Styled via the `c3-navbar-theme` SCSS mixin.
+ *
+ * @selector c3-navbar
+ *
+ * @example
+ * ```html
+ * <c3-navbar>
+ *   <a routerLink="/home" routerLinkActive="selected">Home</a>
+ *   <a routerLink="/settings" routerLinkActive="selected">Settings</a>
+ * </c3-navbar>
+ * ```
+ */
+class C3NavbarComponent {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: C3NavbarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.14", type: C3NavbarComponent, isStandalone: true, selector: "c3-navbar", host: { classAttribute: "c3-navbar mat-elevation-z4" }, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true, encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: C3NavbarComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'c3-navbar',
+                    template: `<ng-content></ng-content>`,
+                    encapsulation: ViewEncapsulation.None,
+                    host: { class: 'c3-navbar mat-elevation-z4' },
+                    standalone: true,
+                }]
+        }] });
+
+class C3NavbarModule {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: C3NavbarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.14", ngImport: i0, type: C3NavbarModule, imports: [C3NavbarComponent], exports: [C3NavbarComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: C3NavbarModule }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: C3NavbarModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [C3NavbarComponent],
+                    exports: [C3NavbarComponent],
+                }]
+        }] });
+
+/**
+ * @description A side-panel modal component that slides in from the right.
+ * Uses a `router-outlet` for content and provides a close button that navigates
+ * back to the computed return route.
+ *
+ * The return route is automatically computed from the current route tree,
+ * or can be overridden via the `returnRoute` input.
+ *
+ * @selector c3-modal
+ *
+ * @example
+ * ```html
+ * <!-- Auto-computed return route -->
+ * <c3-modal></c3-modal>
+ *
+ * <!-- Custom return route -->
+ * <c3-modal returnRoute="/dashboard"></c3-modal>
+ * ```
+ */
+class C3ModalComponent {
+    constructor() {
+        /** Override the auto-computed return route. */
+        this.returnRoute = input(null, ...(ngDevMode ? [{ debugName: "returnRoute" }] : []));
+        /** Resolved return route (input override or auto-computed). */
+        this._returnRoute = signal('/', ...(ngDevMode ? [{ debugName: "_returnRoute" }] : []));
+        this.height = signal('400px', ...(ngDevMode ? [{ debugName: "height" }] : []));
+        this.posButton = signal(0, ...(ngDevMode ? [{ debugName: "posButton" }] : []));
+        this.container = viewChild('container', ...(ngDevMode ? [{ debugName: "container" }] : []));
+        this._activatedRoute = inject(ActivatedRoute);
+        this._cdr = inject(ChangeDetectorRef);
+        this._platformId = inject(PLATFORM_ID);
+        // Compute return route from the route tree
+        const snapshot = this._activatedRoute.snapshot;
+        const currentSegment = snapshot.url[0];
+        const autoReturn = this._activatedRoute.pathFromRoot.reduce((accu, route) => {
+            if (route.snapshot.url[0] &&
+                route.snapshot.url[0] !== currentSegment) {
+                accu += route.snapshot.url[0].path + '/';
+            }
+            return accu;
+        }, '/');
+        this._returnRoute.set(autoReturn);
+    }
+    ngAfterViewInit() {
+        if (!isPlatformBrowser(this._platformId))
+            return;
+        // Update height on window resize
+        this._updateHeight();
+        this._resizeListener = () => this._updateHeight();
+        window.addEventListener('resize', this._resizeListener);
+        // Watch container width changes for close button positioning
+        this._containerWatcher = setInterval(() => {
+            const el = this.container()?.nativeElement;
+            if (el && this.posButton() !== el.clientWidth - 26) {
+                this.posButton.set(el.clientWidth - 26);
+                this._cdr.markForCheck();
+            }
+        }, 1000);
+    }
+    ngOnDestroy() {
+        if (isPlatformBrowser(this._platformId)) {
+            if (this._resizeListener) {
+                window.removeEventListener('resize', this._resizeListener);
+            }
+            if (this._containerWatcher) {
+                clearInterval(this._containerWatcher);
+            }
+        }
+    }
+    _updateHeight() {
+        this.height.set(window.innerHeight + 'px');
+        this._cdr.markForCheck();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: C3ModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.14", type: C3ModalComponent, isStandalone: true, selector: "c3-modal", inputs: { returnRoute: { classPropertyName: "returnRoute", publicName: "returnRoute", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "c3-modal" }, viewQueries: [{ propertyName: "container", first: true, predicate: ["container"], descendants: true, isSignal: true }], ngImport: i0, template: `
+    <div class="outer" [routerLink]="_returnRoute()"></div>
+    <div #container class="container" [style.height]="height()">
+      <div>
+        <router-outlet></router-outlet>
+      </div>
+    </div>
+    @if (posButton()) {
+      <button
+        [routerLink]="_returnRoute()"
+        class="close-button c3-modal"
+        mat-fab
+        [style.right.px]="posButton()"
+      >
+        <mat-icon>close</mat-icon>
+      </button>
+    }
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1$5.RouterOutlet, selector: "router-outlet", inputs: ["name", "routerOutletData"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }, { kind: "directive", type: i1$5.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.MatFabButton, selector: "button[mat-fab], a[mat-fab], button[matFab], a[matFab]", inputs: ["extended"], exportAs: ["matButton", "matAnchor"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: C3ModalComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'c3-modal',
+                    template: `
+    <div class="outer" [routerLink]="_returnRoute()"></div>
+    <div #container class="container" [style.height]="height()">
+      <div>
+        <router-outlet></router-outlet>
+      </div>
+    </div>
+    @if (posButton()) {
+      <button
+        [routerLink]="_returnRoute()"
+        class="close-button c3-modal"
+        mat-fab
+        [style.right.px]="posButton()"
+      >
+        <mat-icon>close</mat-icon>
+      </button>
+    }
+  `,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    encapsulation: ViewEncapsulation.None,
+                    host: { class: 'c3-modal' },
+                    standalone: true,
+                    imports: [RouterModule, MatIconModule, MatButtonModule],
+                }]
+        }], ctorParameters: () => [], propDecorators: { returnRoute: [{ type: i0.Input, args: [{ isSignal: true, alias: "returnRoute", required: false }] }], container: [{ type: i0.ViewChild, args: ['container', { isSignal: true }] }] } });
+
+class C3ModalModule {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: C3ModalModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.14", ngImport: i0, type: C3ModalModule, imports: [C3ModalComponent], exports: [C3ModalComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: C3ModalModule, imports: [C3ModalComponent] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: C3ModalModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [C3ModalComponent],
+                    exports: [C3ModalComponent],
+                }]
+        }] });
+
+/**
+ * @description A single tab item used inside `c3-tabs`.
+ * Provides a ripple effect and wraps projected content.
+ *
+ * @selector c3-tab, [c3-tab]
+ *
+ * @example
+ * ```html
+ * <c3-tabs>
+ *   <c3-tab><a routerLink="/page-a">Page A</a></c3-tab>
+ *   <c3-tab><a routerLink="/page-b">Page B</a></c3-tab>
+ * </c3-tabs>
+ * ```
+ */
+class C3TabComponent {
+    constructor() {
+        this.elementRef = inject(ElementRef);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: C3TabComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.14", type: C3TabComponent, isStandalone: true, selector: "c3-tab, [c3-tab]", host: { classAttribute: "item" }, ngImport: i0, template: `
+    <div matRipple style="padding: 0 8px; border-radius: 18px">
+      <ng-content></ng-content>
+    </div>
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: MatRippleModule }, { kind: "directive", type: i3$2.MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"], exportAs: ["matRipple"] }], encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: C3TabComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'c3-tab, [c3-tab]',
+                    template: `
+    <div matRipple style="padding: 0 8px; border-radius: 18px">
+      <ng-content></ng-content>
+    </div>
+  `,
+                    encapsulation: ViewEncapsulation.None,
+                    host: { class: 'item' },
+                    imports: [MatRippleModule],
+                }]
+        }] });
+
+/**
+ * @description A pill-shaped tab bar with an animated background indicator
+ * that slides to the active tab. Works with Angular Router to auto-detect
+ * the active route.
+ *
+ * @selector c3-tabs, [c3-tabs]
+ * @input ignoreQueryParams - If true, query params are ignored when matching active route.
+ *
+ * @example
+ * ```html
+ * <c3-tabs>
+ *   <c3-tab><a routerLink="/page-a">Page A</a></c3-tab>
+ *   <c3-tab><a routerLink="/page-b">Page B</a></c3-tab>
+ * </c3-tabs>
+ *
+ * <!-- Ignore query params for route matching -->
+ * <c3-tabs [ignoreQueryParams]="true">
+ *   <c3-tab><a routerLink="/search" [queryParams]="{ q: 'test' }">Search</a></c3-tab>
+ * </c3-tabs>
+ * ```
+ */
+class C3TabsComponent {
+    constructor() {
+        /** Whether to ignore query parameters when matching the active route. */
+        this.ignoreQueryParams = input(false, ...(ngDevMode ? [{ debugName: "ignoreQueryParams" }] : []));
+        this.btnBackgroundOffset = 0;
+        this.btnWidth = 0;
+        this._router = inject(Router);
+        this._cdr = inject(ChangeDetectorRef);
+        this._platformId = inject(PLATFORM_ID);
+        this._destroyRef = inject(DestroyRef);
+    }
+    ngAfterViewInit() {
+        if (!this.items.length)
+            return;
+        if (!this.links.length) {
+            this.setSelectedItem();
+        }
+        else {
+            // Defer subscription to avoid ExpressionChangedAfterItHasBeenCheckedError
+            setTimeout(() => this._router.events
+                .pipe(startWith(null), filter((event) => event instanceof NavigationEnd || !this.selectedItem), map(() => this._getActiveTabIndex()), distinctUntilChanged(), takeUntilDestroyed(this._destroyRef))
+                .subscribe((index) => this.setSelectedItem(index)), 300);
+        }
+        this._cdr.detectChanges();
+    }
+    /**
+     * Gets the left position of an element relative to the viewport.
+     * Returns 0 on server platform.
+     */
+    getLeftPositionElement(element) {
+        if (!isPlatformBrowser(this._platformId))
+            return 0;
+        return element.getBoundingClientRect().left;
+    }
+    /** Computes the offset for the sliding background indicator. */
+    getBtnBackgroundOffset() {
+        try {
+            if (!this.selectedItem)
+                return 0;
+            return (this.getLeftPositionElement(this.selectedItem.elementRef.nativeElement) -
+                this.getLeftPositionElement(this.containerElement.nativeElement) +
+                'px');
+        }
+        catch {
+            return 0;
+        }
+    }
+    /** Selects a tab by index and updates the indicator position. */
+    setSelectedItem(index = 0) {
+        this.selectedItem = this.items.get(index);
+        setTimeout(() => this._setBtn(), 0);
+    }
+    /**
+     * Finds the active tab index by matching router links.
+     * When multiple links match, the most specific one (most query params) wins.
+     */
+    _getActiveTabIndex() {
+        const opts = {
+            paths: 'exact',
+            queryParams: this.ignoreQueryParams()
+                ? 'ignored'
+                : 'subset',
+            fragment: 'ignored',
+            matrixParams: 'ignored',
+        };
+        const linkArray = this.links.toArray();
+        let bestIndex = 0;
+        let bestParamCount = -1;
+        for (let i = 0; i < linkArray.length; i++) {
+            const link = linkArray[i];
+            if (link.urlTree == null ||
+                !this._router.isActive(link.urlTree, opts))
+                continue;
+            const paramCount = Object.keys(link.urlTree.queryParams).length;
+            if (paramCount > bestParamCount) {
+                bestParamCount = paramCount;
+                bestIndex = i;
+            }
+        }
+        return bestIndex;
+    }
+    /** Updates the sliding indicator position and width. */
+    _setBtn() {
+        this.btnBackgroundOffset = this.getBtnBackgroundOffset();
+        if (this.selectedItem) {
+            this.btnWidth =
+                this.selectedItem.elementRef.nativeElement.offsetWidth + 'px';
+        }
+        this._cdr.markForCheck();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: C3TabsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.14", type: C3TabsComponent, isStandalone: false, selector: "c3-tabs, [c3-tabs]", inputs: { ignoreQueryParams: { classPropertyName: "ignoreQueryParams", publicName: "ignoreQueryParams", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "c3-tabs" }, queries: [{ propertyName: "items", predicate: C3TabComponent }, { propertyName: "links", predicate: RouterLink }], viewQueries: [{ propertyName: "containerElement", first: true, predicate: ["mc"], descendants: true }], ngImport: i0, template: `
+    <div class="flex flex-row items-center justify-center">
+      <div #mc class="menu-text__container mat-elevation-z2">
+        <div
+          class="toggle-btn__background mat-elevation-z2"
+          [style]="{ left: btnBackgroundOffset, width: btnWidth }"
+        >
+          <em>&nbsp;</em>
+        </div>
+        <ng-content></ng-content>
+      </div>
+    </div>
+  `, isInline: true, styles: [".c3-tabs{display:block}.c3-tabs .menu-text__container{position:relative;display:flex;border-radius:26px;height:44px;padding:4px}.c3-tabs .menu-text__container .item,.c3-tabs .menu-text__container .item a{z-index:1;cursor:pointer;transition:.5s all ease;line-height:36px;text-decoration:none;color:#fff;padding:0 8px}.c3-tabs .menu-text__container .item:not(.active),.c3-tabs .menu-text__container .item:not(.active) a{color:#fff}.c3-tabs .menu-text__container .toggle-btn__background{position:absolute;width:70px;border-radius:18px;height:36px;transition:.5s all ease;-webkit-user-select:none;user-select:none}\n"], encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: C3TabsComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'c3-tabs, [c3-tabs]', template: `
+    <div class="flex flex-row items-center justify-center">
+      <div #mc class="menu-text__container mat-elevation-z2">
+        <div
+          class="toggle-btn__background mat-elevation-z2"
+          [style]="{ left: btnBackgroundOffset, width: btnWidth }"
+        >
+          <em>&nbsp;</em>
+        </div>
+        <ng-content></ng-content>
+      </div>
+    </div>
+  `, encapsulation: ViewEncapsulation.None, host: { class: 'c3-tabs' }, standalone: false, styles: [".c3-tabs{display:block}.c3-tabs .menu-text__container{position:relative;display:flex;border-radius:26px;height:44px;padding:4px}.c3-tabs .menu-text__container .item,.c3-tabs .menu-text__container .item a{z-index:1;cursor:pointer;transition:.5s all ease;line-height:36px;text-decoration:none;color:#fff;padding:0 8px}.c3-tabs .menu-text__container .item:not(.active),.c3-tabs .menu-text__container .item:not(.active) a{color:#fff}.c3-tabs .menu-text__container .toggle-btn__background{position:absolute;width:70px;border-radius:18px;height:36px;transition:.5s all ease;-webkit-user-select:none;user-select:none}\n"] }]
+        }], propDecorators: { ignoreQueryParams: [{ type: i0.Input, args: [{ isSignal: true, alias: "ignoreQueryParams", required: false }] }], containerElement: [{
+                type: ViewChild,
+                args: ['mc']
+            }], items: [{
+                type: ContentChildren,
+                args: [C3TabComponent]
+            }], links: [{
+                type: ContentChildren,
+                args: [RouterLink]
+            }] } });
+
+class C3TabsModule {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: C3TabsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.14", ngImport: i0, type: C3TabsModule, declarations: [C3TabsComponent], imports: [CommonModule, RouterModule, MatRippleModule, C3TabComponent], exports: [C3TabsComponent, C3TabComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: C3TabsModule, imports: [CommonModule, RouterModule, MatRippleModule, C3TabComponent] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImport: i0, type: C3TabsModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [C3TabsComponent],
+                    imports: [CommonModule, RouterModule, MatRippleModule, C3TabComponent],
+                    exports: [C3TabsComponent, C3TabComponent],
+                }]
+        }] });
+
 /*
  * Public API Surface of c3-components
  */
@@ -2460,5 +3045,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.14", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { C3AlertDialogComponent, C3AutoAnimateDirective, C3DialogEmbedChildComponent, C3DialogModule, C3DialogService, C3DialogTemplateComponent, C3DropdownComponent, C3DropdownModule, C3DropdownTrigger, C3ExpansionComponent, C3ExpansionHeaderComponent, C3ExpansionModule, C3FileDisplayCardComponent, C3FileDisplayGridComponent, C3FileDisplayIconComponent, C3FileDisplayListCellDefDirective, C3FileDisplayListColumnDefDirective, C3FileDisplayListComponent, C3FileDisplayListHeaderCellDefDirective, C3FileDisplayerModule, C3FileViewer, C3FileViewerComponent, C3FileViewerDialog, C3FileViewerDialogComponent, C3FileViewerModule, C3FlowingMenuComponent, C3FlowingMenuItemComponent, C3FlowingMenuItemContentComponent, C3FlowingMenuModule, C3MenuComponent, C3MenuModule, C3NavItemComponent, C3OpenDialogDirective, C3PreventClickDirective, C3PreventKeyboardEventDirective, C3PromptDialogComponent, C3SafeUrlPipe, C3SelectOnFocusDirective, C3StopPropagationDirective, C3TraceCardAlignLeftDirective, C3TraceCardAlignRightDirective, C3TraceCardComponent, C3TraceCardContentComponent, C3TraceCardModule, C3TraceCardTitleComponent, C3TreeComponent, C3_FILE_DISPLAY_LIST, ConfirmDialogComponent, CustomFileEvent, FullScreenDirective, MAT_DROPDOWN_VALUE_ACCESSOR };
+export { C3AlertDialogComponent, C3AutoAnimateDirective, C3DialogEmbedChildComponent, C3DialogModule, C3DialogService, C3DialogTemplateComponent, C3DropdownComponent, C3DropdownModule, C3DropdownTrigger, C3ExpansionComponent, C3ExpansionHeaderComponent, C3ExpansionModule, C3FileDisplayCardComponent, C3FileDisplayGridComponent, C3FileDisplayIconComponent, C3FileDisplayListCellDefDirective, C3FileDisplayListColumnDefDirective, C3FileDisplayListComponent, C3FileDisplayListHeaderCellDefDirective, C3FileDisplayerModule, C3FileViewer, C3FileViewerComponent, C3FileViewerDialog, C3FileViewerDialogComponent, C3FileViewerModule, C3FlowingMenuComponent, C3FlowingMenuItemComponent, C3FlowingMenuItemContentComponent, C3FlowingMenuModule, C3HighlightTextDirective, C3HighlightTextModule, C3MenuComponent, C3MenuModule, C3ModalComponent, C3ModalModule, C3NavItemComponent, C3NavbarComponent, C3NavbarModule, C3OpenDialogDirective, C3PreventClickDirective, C3PreventKeyboardEventDirective, C3PromptDialogComponent, C3RoundedTitleComponent, C3RoundedTitleModule, C3SafeUrlPipe, C3SelectOnFocusDirective, C3StopPropagationDirective, C3TabComponent, C3TabsComponent, C3TabsModule, C3TraceCardAlignLeftDirective, C3TraceCardAlignRightDirective, C3TraceCardComponent, C3TraceCardContentComponent, C3TraceCardModule, C3TraceCardTitleComponent, C3TreeComponent, C3_FILE_DISPLAY_LIST, ConfirmDialogComponent, CustomFileEvent, FullScreenDirective, MAT_DROPDOWN_VALUE_ACCESSOR };
 //# sourceMappingURL=c3-components.mjs.map