@cauca-911/material 20.2.0 → 20.2.2

package/fesm2022/cauca-911-material.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { Injectable, Component, EventEmitter, Output, Input, signal, inject, HostListener, Injector, ElementRef, forwardRef, input, computed, output, Directive, ChangeDetectionStrategy, Inject, HostBinding, model, TemplateRef, Optional, Self, ContentChild, ViewChild, NgModule } from '@angular/core';
+import { Injectable, Component, EventEmitter, Output, Input, signal, inject, HostListener, Injector, ElementRef, forwardRef, input, computed, output, Directive, ChangeDetectionStrategy, Inject, HostBinding, model, TemplateRef, Optional, Self, ContentChild, ViewChild, resource, NgModule } from '@angular/core';
 import * as i1 from '@ngx-translate/core';
 import { TranslateModule, TranslatePipe, TranslateService } from '@ngx-translate/core';
 import * as i1$6 from '@angular/material/dialog';
@@ -25,7 +25,7 @@ import { Validators, NgControl, FormControlName, ControlContainer, FormControl,
 import * as i1$5 from '@angular/cdk/clipboard';
 import { MatMenuItem, MatMenuTrigger } from '@angular/material/menu';
 import { firstValueFrom, of, tap, mergeMap, catchError, finalize, throwError, filter, Subject, startWith, map, ReplaySubject, switchMap, EMPTY, combineLatest, distinctUntilChanged } from 'rxjs';
-import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
+import { takeUntilDestroyed, toSignal } from '@angular/core/rxjs-interop';
 import * as i2$2 from '@angular/cdk/layout';
 import * as i5 from '@angular/cdk/text-field';
 import { MatProgressSpinner } from '@angular/material/progress-spinner';
@@ -36,10 +36,15 @@ import { FontAwesomeModule, FaIconComponent } from '@fortawesome/angular-fontawe
 import { coerceBooleanProperty } from '@angular/cdk/coercion';
 import * as i2$3 from '@angular/material/autocomplete';
 import { MatAutocompleteModule, MatAutocompleteTrigger } from '@angular/material/autocomplete';
+import { ColorPickerDirective } from 'ngx-color-picker';
+import * as i2$4 from '@angular/material/select';
+import { MatSelectModule } from '@angular/material/select';
+import * as i5$1 from 'ngx-mat-select-search';
+import { NgxMatSelectSearchModule } from 'ngx-mat-select-search';
 import * as i1$a from '@angular/router';
 import { RouterModule, Router, NavigationEnd } from '@angular/router';
+import { trigger, state, transition, style, AUTO_STYLE, animate } from '@angular/animations';
 import { MatTabGroup, MatTab } from '@angular/material/tabs';
-import { trigger, state, transition, style, animate } from '@angular/animations';
 
 class CaucaMaterialService {
     static { this.ɵfac = function CaucaMaterialService_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || CaucaMaterialService)(); }; }
@@ -181,7 +186,7 @@ class DesktopTimePickerComponent {
         }] }); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(DesktopTimePickerComponent, { className: "DesktopTimePickerComponent", filePath: "lib/components/cauca-date-time-picker/components/desktop-time-picker/desktop-time-picker.component.ts", lineNumber: 12 }); })();
 
-const _c0$b = (a0, a1) => ({ all: a0, someOptions: a1 });
+const _c0$d = (a0, a1) => ({ all: a0, someOptions: a1 });
 function DialogDateTimePickerComponent_Conditional_4_div_0_Template(rf, ctx) { if (rf & 1) {
     const _r1 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "div", 14)(1, "cauca-desktop-time-picker", 15);
@@ -190,7 +195,7 @@ function DialogDateTimePickerComponent_Conditional_4_div_0_Template(rf, ctx) { i
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(2);
     i0.ɵɵadvance();
-    i0.ɵɵproperty("disabled", i0.ɵɵpureFunction2(3, _c0$b, ctx_r1.disabled.hours, ctx_r1.disabled.someHours))("options", ctx_r1.hours)("value", ctx_r1.selectedHour);
+    i0.ɵɵproperty("disabled", i0.ɵɵpureFunction2(3, _c0$d, ctx_r1.disabled.hours, ctx_r1.disabled.someHours))("options", ctx_r1.hours)("value", ctx_r1.selectedHour);
 } }
 function DialogDateTimePickerComponent_Conditional_4_div_1_Template(rf, ctx) { if (rf & 1) {
     const _r3 = i0.ɵɵgetCurrentView();
@@ -215,7 +220,7 @@ function DialogDateTimePickerComponent_Conditional_4_div_3_Template(rf, ctx) { i
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(2);
     i0.ɵɵadvance();
-    i0.ɵɵproperty("disabled", i0.ɵɵpureFunction2(3, _c0$b, ctx_r1.disabled.minutes, ctx_r1.disabled.someMinutes))("options", ctx_r1.minutes)("value", ctx_r1.selectedMinute);
+    i0.ɵɵproperty("disabled", i0.ɵɵpureFunction2(3, _c0$d, ctx_r1.disabled.minutes, ctx_r1.disabled.someMinutes))("options", ctx_r1.minutes)("value", ctx_r1.selectedMinute);
 } }
 function DialogDateTimePickerComponent_Conditional_4_div_4_Template(rf, ctx) { if (rf & 1) {
     const _r5 = i0.ɵɵgetCurrentView();
@@ -240,7 +245,7 @@ function DialogDateTimePickerComponent_Conditional_4_div_6_Template(rf, ctx) { i
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(2);
     i0.ɵɵadvance();
-    i0.ɵɵproperty("disabled", i0.ɵɵpureFunction2(3, _c0$b, ctx_r1.disabled.seconds, ctx_r1.disabled.someSeconds))("options", ctx_r1.seconds)("value", ctx_r1.selectedSecond);
+    i0.ɵɵproperty("disabled", i0.ɵɵpureFunction2(3, _c0$d, ctx_r1.disabled.seconds, ctx_r1.disabled.someSeconds))("options", ctx_r1.seconds)("value", ctx_r1.selectedSecond);
 } }
 function DialogDateTimePickerComponent_Conditional_4_div_7_Template(rf, ctx) { if (rf & 1) {
     const _r7 = i0.ɵɵgetCurrentView();
@@ -1652,8 +1657,8 @@ class DeleteDialogData {
     }
 }
 
-const _c0$a = a0 => ({ itemName: a0 });
-const _c1$2 = a0 => ({ itemType: a0 });
+const _c0$c = a0 => ({ itemName: a0 });
+const _c1$3 = a0 => ({ itemType: a0 });
 function DeleteDialogComponent_Conditional_1_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "div", 1);
     i0.ɵɵtext(1);
@@ -1662,7 +1667,7 @@ function DeleteDialogComponent_Conditional_1_Template(rf, ctx) { if (rf & 1) {
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext();
     i0.ɵɵadvance();
-    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind2(2, 1, "deleteDialog.titleFemale", i0.ɵɵpureFunction1(4, _c1$2, ctx_r0.itemType)));
+    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind2(2, 1, "deleteDialog.titleFemale", i0.ɵɵpureFunction1(4, _c1$3, ctx_r0.itemType)));
 } }
 function DeleteDialogComponent_Conditional_2_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "div", 1);
@@ -1672,7 +1677,7 @@ function DeleteDialogComponent_Conditional_2_Template(rf, ctx) { if (rf & 1) {
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext();
     i0.ɵɵadvance();
-    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind2(2, 1, "deleteDialog.titleMale", i0.ɵɵpureFunction1(4, _c1$2, ctx_r0.itemType)));
+    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind2(2, 1, "deleteDialog.titleMale", i0.ɵɵpureFunction1(4, _c1$3, ctx_r0.itemType)));
 } }
 class DeleteDialogComponent {
     constructor(dialogRef, data, breakdownObserver) {
@@ -1714,7 +1719,7 @@ class DeleteDialogComponent {
             i0.ɵɵadvance();
             i0.ɵɵconditional(ctx.itemGenderIsFemale ? 1 : 2);
             i0.ɵɵadvance(5);
-            i0.ɵɵtextInterpolate(i0.ɵɵpipeBind2(7, 2, "deleteDialog.message", i0.ɵɵpureFunction1(5, _c0$a, ctx.itemName)));
+            i0.ɵɵtextInterpolate(i0.ɵɵpipeBind2(7, 2, "deleteDialog.message", i0.ɵɵpureFunction1(5, _c0$c, ctx.itemName)));
         } }, dependencies: [MatDialogModule, i1$6.MatDialogTitle, i1$6.MatDialogActions, i1$6.MatDialogContent, TranslateModule, StrokedButtonComponent, IconButtonComponent, RaisedButtonComponent, i1.TranslatePipe], styles: ["@media (max-width: 500px){  .dialog-global-style{max-width:100vw!important}}  .dialog-global-style{margin:auto!important}[_nghost-%COMP%] > div[_ngcontent-%COMP%]:first-child{display:flex;align-items:center}[_nghost-%COMP%] > div[_ngcontent-%COMP%]:first-child   div[_ngcontent-%COMP%]:first-child{flex:1}.mat-mdc-dialog-actions[_ngcontent-%COMP%]{column-gap:8px}"] }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DeleteDialogComponent, [{
@@ -1726,7 +1731,7 @@ class DeleteDialogComponent {
             }] }, { type: i2$2.BreakpointObserver }], null); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(DeleteDialogComponent, { className: "DeleteDialogComponent", filePath: "lib/components/dialogs/delete-dialog/delete-dialog.component.ts", lineNumber: 18 }); })();
 
-const _c0$9 = a0 => ({ itemName: a0 });
+const _c0$b = a0 => ({ itemName: a0 });
 class ErrorDialogComponent {
     constructor(dialogRef, data, breakdownObserver) {
         this.dialogRef = dialogRef;
@@ -1759,7 +1764,7 @@ class ErrorDialogComponent {
             i0.ɵɵadvance(2);
             i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(3, 2, "errorDialog.titleError"));
             i0.ɵɵadvance(5);
-            i0.ɵɵtextInterpolate(i0.ɵɵpipeBind2(8, 4, "errorDialog.messageError", i0.ɵɵpureFunction1(7, _c0$9, ctx.itemName)));
+            i0.ɵɵtextInterpolate(i0.ɵɵpipeBind2(8, 4, "errorDialog.messageError", i0.ɵɵpureFunction1(7, _c0$b, ctx.itemName)));
         } }, dependencies: [MatDialogModule, i1$6.MatDialogTitle, i1$6.MatDialogActions, i1$6.MatDialogContent, TranslateModule, RaisedButtonComponent, IconButtonComponent, i1.TranslatePipe], styles: ["@media (max-width: 500px){  .dialog-global-style{max-width:100vw!important}}  .dialog-global-style{margin:auto!important}[_nghost-%COMP%] > div[_ngcontent-%COMP%]:first-child{display:flex;align-items:center}[_nghost-%COMP%] > div[_ngcontent-%COMP%]:first-child   div[_ngcontent-%COMP%]:first-child{flex:1}"] }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ErrorDialogComponent, [{
@@ -1876,7 +1881,7 @@ class LoadingStateService {
         type: Injectable
     }], null, null); })();
 
-const _c0$8 = ["*"];
+const _c0$a = ["*"];
 function SnackBarComponent_Conditional_10_Template(rf, ctx) { if (rf & 1) {
     const _r1 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "cauca-stroked-button", 7);
@@ -1917,7 +1922,7 @@ class SnackBarComponent {
         this.buttonClick = new EventEmitter();
     }
     static { this.ɵfac = function SnackBarComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || SnackBarComponent)(); }; }
-    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SnackBarComponent, selectors: [["cauca-snackbar"]], inputs: { icon: [1, "icon"], caption: [1, "caption"], showCloseButton: [1, "showCloseButton"], type: [1, "type"], variant: [1, "variant"], buttonSpecificColor: [1, "buttonSpecificColor"], buttonIcon: [1, "buttonIcon"], inProgress: [1, "inProgress"], showButton: [1, "showButton"], buttonLabel: [1, "buttonLabel"] }, outputs: { closeClick: "closeClick", buttonClick: "buttonClick" }, ngContentSelectors: _c0$8, decls: 12, vars: 8, consts: [[1, "container"], [1, "icon-container"], [1, "text-container"], [1, "title", "alert-title"], [1, "message", "body2"], ["onkeypress", "buttonClick.emit()", 3, "color", "label", "isInProgress", "icon"], ["icon", "close", "onkeypress", "closeClick.emit()"], ["onkeypress", "buttonClick.emit()", 3, "click", "color", "label", "isInProgress", "icon"], ["icon", "close", "onkeypress", "closeClick.emit()", 3, "click"]], template: function SnackBarComponent_Template(rf, ctx) { if (rf & 1) {
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SnackBarComponent, selectors: [["cauca-snackbar"]], inputs: { icon: [1, "icon"], caption: [1, "caption"], showCloseButton: [1, "showCloseButton"], type: [1, "type"], variant: [1, "variant"], buttonSpecificColor: [1, "buttonSpecificColor"], buttonIcon: [1, "buttonIcon"], inProgress: [1, "inProgress"], showButton: [1, "showButton"], buttonLabel: [1, "buttonLabel"] }, outputs: { closeClick: "closeClick", buttonClick: "buttonClick" }, ngContentSelectors: _c0$a, decls: 12, vars: 8, consts: [[1, "container"], [1, "icon-container"], [1, "text-container"], [1, "title", "alert-title"], [1, "message", "body2"], ["onkeypress", "buttonClick.emit()", 3, "color", "label", "isInProgress", "icon"], ["icon", "close", "onkeypress", "closeClick.emit()"], ["onkeypress", "buttonClick.emit()", 3, "click", "color", "label", "isInProgress", "icon"], ["icon", "close", "onkeypress", "closeClick.emit()", 3, "click"]], template: function SnackBarComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵprojectionDef();
             i0.ɵɵelementStart(0, "div", 0)(1, "div", 1)(2, "mat-icon");
             i0.ɵɵtext(3);
@@ -2426,7 +2431,7 @@ class PasswordValidator {
     }
 }
 
-const _c0$7 = ["*"];
+const _c0$9 = ["*"];
 function PasswordSelectionComponent_Conditional_6_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelement(0, "cauca-password-criteria-viewer", 5);
 } if (rf & 2) {
@@ -2510,7 +2515,7 @@ class PasswordSelectionComponent {
                     multi: true,
                     useExisting: forwardRef(() => PasswordSelectionComponent),
                 },
-            ])], ngContentSelectors: _c0$7, decls: 8, vars: 12, consts: [[3, "formGroup"], [1, "passwords"], ["formControlName", "password", 3, "autocomplete", "label", "translateLabel", "required"], ["formControlName", "confirmation", 3, "autocomplete", "label", "translateLabel", "required"], [1, "errors"], [3, "disabled", "passwordValidation"]], template: function PasswordSelectionComponent_Template(rf, ctx) { if (rf & 1) {
+            ])], ngContentSelectors: _c0$9, decls: 8, vars: 12, consts: [[3, "formGroup"], [1, "passwords"], ["formControlName", "password", 3, "autocomplete", "label", "translateLabel", "required"], ["formControlName", "confirmation", 3, "autocomplete", "label", "translateLabel", "required"], [1, "errors"], [3, "disabled", "passwordValidation"]], template: function PasswordSelectionComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵprojectionDef();
             i0.ɵɵelementStart(0, "form", 0)(1, "div", 1);
             i0.ɵɵelement(2, "cauca-password-input", 2)(3, "cauca-password-input", 3);
@@ -2606,9 +2611,9 @@ class DateRangePickerComponent {
     }], () => [], null); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(DateRangePickerComponent, { className: "DateRangePickerComponent", filePath: "lib/components/inputs/date-range-picker/date-range-picker.component.ts", lineNumber: 19 }); })();
 
-const _c0$6 = ["auto"];
-const _c1$1 = ["chipInput"];
-const _c2 = a0 => ({ data: a0 });
+const _c0$8 = ["auto"];
+const _c1$2 = ["chipInput"];
+const _c2$1 = a0 => ({ data: a0 });
 function DropdownChipAutocompleteComponent_For_4_Conditional_2_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "mat-icon", 13);
     i0.ɵɵtext(1, "cancel");
@@ -2645,7 +2650,7 @@ function DropdownChipAutocompleteComponent_For_14_Conditional_1_Template(rf, ctx
 } if (rf & 2) {
     const item_r6 = i0.ɵɵnextContext().$implicit;
     const ctx_r3 = i0.ɵɵnextContext();
-    i0.ɵɵproperty("ngTemplateOutlet", ctx_r3.optionTemplate)("ngTemplateOutletContext", i0.ɵɵpureFunction1(2, _c2, item_r6));
+    i0.ɵɵproperty("ngTemplateOutlet", ctx_r3.optionTemplate)("ngTemplateOutletContext", i0.ɵɵpureFunction1(2, _c2$1, item_r6));
 } }
 function DropdownChipAutocompleteComponent_For_14_Conditional_2_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵtext(0);
@@ -2837,8 +2842,8 @@ class DropdownChipAutocompleteComponent {
             let _t;
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.optionTemplate = _t.first);
         } }, viewQuery: function DropdownChipAutocompleteComponent_Query(rf, ctx) { if (rf & 1) {
-            i0.ɵɵviewQuery(_c0$6, 5);
-            i0.ɵɵviewQuery(_c1$1, 5);
+            i0.ɵɵviewQuery(_c0$8, 5);
+            i0.ɵɵviewQuery(_c1$2, 5);
             i0.ɵɵviewQuery(MatAutocompleteTrigger, 5);
         } if (rf & 2) {
             let _t;
@@ -2954,13 +2959,273 @@ class DropdownChipAutocompleteComponent {
         }] }); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(DropdownChipAutocompleteComponent, { className: "DropdownChipAutocompleteComponent", filePath: "lib/components/inputs/dropdown-chip-autocomplete/dropdown-chip-autocomplete.component.ts", lineNumber: 46 }); })();
 
-const _c0$5 = ["*"];
+class ColorPickerComponent {
+    static { this.nextId = 0; }
+    get shouldLabelFloat() {
+        return this.focused || !this.empty;
+    }
+    get empty() {
+        return !this._value?.length;
+    }
+    get value() {
+        return this._value;
+    }
+    set value(newValue) {
+        this._value = newValue;
+        this.onChange(this._value);
+        this.stateChanges.next();
+    }
+    constructor(elementRef, ngControl) {
+        this.elementRef = elementRef;
+        this.ngControl = ngControl;
+        this.stateChanges = new Subject();
+        this.id = `example-tel-input-${ColorPickerComponent.nextId++}`;
+        this.focused = false;
+        this.touched = false;
+        this.valueChanged = new EventEmitter();
+        this.onChange = (_) => {
+            // Do nothing for now
+        };
+        this.onTouched = () => {
+            // Do nothing for now
+        };
+        if (this.ngControl != null) {
+            this.ngControl.valueAccessor = this;
+        }
+        elementRef.nativeElement.addEventListener('focusin', this.onFocusIn.bind(this));
+        elementRef.nativeElement.addEventListener('focusout', this.onFocusOut.bind(this));
+    }
+    onFocusIn(_) {
+        if (!this.focused) {
+            this.focused = true;
+            this.stateChanges.next();
+        }
+    }
+    onFocusOut(event) {
+        if (!this.elementRef.nativeElement.contains(event.relatedTarget)) {
+            this.touched = true;
+            this.focused = false;
+            this.onTouched();
+            this.stateChanges.next();
+        }
+    }
+    ngOnDestroy() {
+        this.stateChanges.complete();
+    }
+    setDescribedByIds(_) {
+        // Do nothing for now
+    }
+    onContainerClick(_) {
+        // Do nothing for now
+    }
+    writeValue(value) {
+        this.value = value;
+    }
+    registerOnChange(fn) {
+        this.onChange = fn;
+    }
+    registerOnTouched(fn) {
+        this.onTouched = fn;
+    }
+    onChangeColor(color) {
+        this.value = color;
+    }
+    static { this.ɵfac = function ColorPickerComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || ColorPickerComponent)(i0.ɵɵdirectiveInject(i0.ElementRef), i0.ɵɵdirectiveInject(i1$7.NgControl, 10)); }; }
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: ColorPickerComponent, selectors: [["cauca-color-picker"]], hostVars: 3, hostBindings: function ColorPickerComponent_HostBindings(rf, ctx) { if (rf & 2) {
+            i0.ɵɵdomProperty("id", ctx.id);
+            i0.ɵɵclassProp("floating", ctx.shouldLabelFloat);
+        } }, inputs: { value: "value" }, outputs: { valueChanged: "valueChanged" }, features: [i0.ɵɵProvidersFeature([{
+                    provide: MatFormFieldControl,
+                    useExisting: ColorPickerComponent,
+                }])], decls: 1, vars: 2, consts: [["matInput", "", "type", "text", "id", "color-id", 1, "form-control", 3, "colorPickerChange", "colorPicker", "value"]], template: function ColorPickerComponent_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵelementStart(0, "input", 0);
+            i0.ɵɵtwoWayListener("colorPickerChange", function ColorPickerComponent_Template_input_colorPickerChange_0_listener($event) { i0.ɵɵtwoWayBindingSet(ctx.value, $event) || (ctx.value = $event); return $event; });
+            i0.ɵɵlistener("colorPickerChange", function ColorPickerComponent_Template_input_colorPickerChange_0_listener($event) { return ctx.onChangeColor($event); });
+            i0.ɵɵelementEnd();
+        } if (rf & 2) {
+            i0.ɵɵtwoWayProperty("colorPicker", ctx.value);
+            i0.ɵɵproperty("value", ctx.value);
+        } }, dependencies: [MatInputModule, i3.MatInput, ColorPickerDirective], encapsulation: 2 }); }
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ColorPickerComponent, [{
+        type: Component,
+        args: [{ selector: 'cauca-color-picker', imports: [MatInputModule, ColorPickerDirective], providers: [{
+                        provide: MatFormFieldControl,
+                        useExisting: ColorPickerComponent,
+                    }], template: "<input\r\n    matInput\r\n    [(colorPicker)]=\"value\"\r\n    [value]=\"value\"\r\n    (colorPickerChange)=\"onChangeColor($event)\"\r\n    type=\"text\"\r\n    class=\"form-control\"\r\n    id=\"color-id\"\r\n/>" }]
+    }], () => [{ type: i0.ElementRef }, { type: i1$7.NgControl, decorators: [{
+                type: Optional
+            }, {
+                type: Self
+            }] }], { id: [{
+            type: HostBinding
+        }], valueChanged: [{
+            type: Output
+        }], shouldLabelFloat: [{
+            type: HostBinding,
+            args: ['class.floating']
+        }], value: [{
+            type: Input
+        }] }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(ColorPickerComponent, { className: "ColorPickerComponent", filePath: "lib/components/inputs/color-picker/color-picker.component.ts", lineNumber: 18 }); })();
+
+const _c0$7 = ["singleSelect"];
+const _c1$1 = ["*"];
+const _c2 = () => [];
+function SelectWithSearchComponent_Conditional_6_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "mat-option");
+    i0.ɵɵelement(1, "ngx-mat-select-search", 3);
+    i0.ɵɵpipe(2, "translate");
+    i0.ɵɵpipe(3, "translate");
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r0 = i0.ɵɵnextContext();
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("formControl", ctx_r0.optionFilterControl)("placeholderLabel", i0.ɵɵpipeBind1(2, 3, "search"))("noEntriesFoundLabel", i0.ɵɵpipeBind1(3, 5, "noResult"));
+} }
+function SelectWithSearchComponent_For_8_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "mat-option", 2);
+    i0.ɵɵtext(1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const option_r2 = ctx.$implicit;
+    i0.ɵɵproperty("value", option_r2.id);
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate1(" ", option_r2.name, " ");
+} }
+class SelectWithSearchComponent {
+    constructor() {
+        this.selectFirstOptionByDefault = false;
+        this.optionFilterControl = new FormControl('');
+        this.isDisabled = input(false, ...(ngDevMode ? [{ debugName: "isDisabled" }] : []));
+        this.hasOptions = signal(false, ...(ngDevMode ? [{ debugName: "hasOptions" }] : []));
+        this.disableControl = computed(() => this.isDisabled() || !this.hasOptions(), ...(ngDevMode ? [{ debugName: "disableControl" }] : []));
+        this.allowMultiSelection = input(false, ...(ngDevMode ? [{ debugName: "allowMultiSelection" }] : []));
+        this.showClearOption = input(false, ...(ngDevMode ? [{ debugName: "showClearOption" }] : []));
+        this.enableSearch = input(true, ...(ngDevMode ? [{ debugName: "enableSearch" }] : []));
+        this.filteredOptions = resource({
+            params: () => ({ filter: this.filterText(), options: this.allOptions(), showClear: this.showClearOption() }),
+            loader: ({ params }) => Promise.resolve(this.computeFilteredOptions(params))
+        });
+        this.valueChanged = new EventEmitter();
+        this.allOptions = signal([], ...(ngDevMode ? [{ debugName: "allOptions" }] : []));
+        this.filterText = toSignal(this.optionFilterControl.valueChanges, { initialValue: '' });
+    }
+    set options(newOptions) {
+        if (newOptions) {
+            this.allOptions.set(newOptions);
+            this.hasOptions.set(newOptions.length >= 1);
+            this.setInitialSelectedOption();
+        }
+        else {
+            this.allOptions.set([]);
+            this.hasOptions.set(false);
+        }
+    }
+    get options() {
+        return this.allOptions();
+    }
+    set value(newValue) {
+        if (newValue !== this.selectedOptionId) {
+            this.selectedOptionId = newValue;
+            this.valueChanged.emit(this.value);
+        }
+    }
+    get value() {
+        return this.selectedOptionId;
+    }
+    setInitialSelectedOption() {
+        if (this.value) {
+            const city = this.options.find((c) => c.id === this.value);
+            if (!city) {
+                this.selectFirstOption();
+            }
+        }
+        else if (this.options.length > 0 && this.selectFirstOptionByDefault) {
+            this.selectFirstOption();
+        }
+    }
+    selectFirstOption() {
+        this.value = this.options[0].id;
+    }
+    computeFilteredOptions(params) {
+        const { filter, options, showClear } = params;
+        if (!options || !Array.isArray(options)) {
+            return [];
+        }
+        let filtered;
+        if (!filter) {
+            filtered = options.slice();
+        }
+        else {
+            const filterLower = toLowerCaseAndWithoutDiacritics(filter);
+            filtered = options.filter(option => toLowerCaseAndWithoutDiacritics(option?.name ?? '').indexOf(filterLower) > -1);
+        }
+        if (showClear) {
+            const clearOption = { id: null, name: '--' };
+            filtered = [clearOption, ...filtered];
+        }
+        return filtered;
+    }
+    static { this.ɵfac = function SelectWithSearchComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || SelectWithSearchComponent)(); }; }
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SelectWithSearchComponent, selectors: [["cauca-select-with-search"]], viewQuery: function SelectWithSearchComponent_Query(rf, ctx) { if (rf & 1) {
+            i0.ɵɵviewQuery(_c0$7, 7);
+        } if (rf & 2) {
+            let _t;
+            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.singleSelect = _t.first);
+        } }, inputs: { label: "label", selectFirstOptionByDefault: "selectFirstOptionByDefault", isDisabled: [1, "isDisabled"], allowMultiSelection: [1, "allowMultiSelection"], showClearOption: [1, "showClearOption"], enableSearch: [1, "enableSearch"], options: "options", value: "value" }, outputs: { valueChanged: "valueChanged" }, ngContentSelectors: _c1$1, decls: 9, vars: 10, consts: [["subscriptSizing", "dynamic", 1, "full-width-field", "header", "dense"], [3, "valueChange", "value", "disabled", "multiple"], [3, "value"], [3, "formControl", "placeholderLabel", "noEntriesFoundLabel"]], template: function SelectWithSearchComponent_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵprojectionDef();
+            i0.ɵɵelementStart(0, "mat-form-field", 0);
+            i0.ɵɵprojection(1);
+            i0.ɵɵelementStart(2, "mat-label");
+            i0.ɵɵtext(3);
+            i0.ɵɵpipe(4, "translate");
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(5, "mat-select", 1);
+            i0.ɵɵtwoWayListener("valueChange", function SelectWithSearchComponent_Template_mat_select_valueChange_5_listener($event) { i0.ɵɵtwoWayBindingSet(ctx.value, $event) || (ctx.value = $event); return $event; });
+            i0.ɵɵconditionalCreate(6, SelectWithSearchComponent_Conditional_6_Template, 4, 7, "mat-option");
+            i0.ɵɵrepeaterCreate(7, SelectWithSearchComponent_For_8_Template, 2, 2, "mat-option", 2, i0.ɵɵrepeaterTrackByIdentity);
+            i0.ɵɵelementEnd()();
+        } if (rf & 2) {
+            i0.ɵɵadvance(3);
+            i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(4, 7, ctx.label));
+            i0.ɵɵadvance(2);
+            i0.ɵɵclassProp("readonly-field", ctx.disableControl());
+            i0.ɵɵtwoWayProperty("value", ctx.value);
+            i0.ɵɵproperty("disabled", ctx.disableControl())("multiple", ctx.allowMultiSelection());
+            i0.ɵɵadvance();
+            i0.ɵɵconditional(ctx.enableSearch() ? 6 : -1);
+            i0.ɵɵadvance();
+            i0.ɵɵrepeater(ctx.filteredOptions.value() || i0.ɵɵpureFunction0(9, _c2));
+        } }, dependencies: [MatSelectModule, i1$4.MatFormField, i1$4.MatLabel, i2$4.MatSelect, i2$3.MatOption, TranslateModule, MatFormFieldModule, ReactiveFormsModule, i1$7.NgControlStatus, i1$7.FormControlDirective, FormsModule, NgxMatSelectSearchModule, i5$1.MatSelectSearchComponent, i1.TranslatePipe], encapsulation: 2 }); }
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SelectWithSearchComponent, [{
+        type: Component,
+        args: [{ selector: 'cauca-select-with-search', standalone: true, imports: [MatSelectModule, TranslateModule, MatFormFieldModule, ReactiveFormsModule, FormsModule, NgxMatSelectSearchModule], template: "<mat-form-field class=\"full-width-field header dense\" subscriptSizing=\"dynamic\">\n  <ng-content></ng-content>\n  <mat-label>{{ label | translate }}</mat-label>\n  <mat-select [(value)]=\"value\" [disabled]=\"disableControl()\" [class.readonly-field]=\"disableControl()\" [multiple]=\"allowMultiSelection()\" >\n    @if (enableSearch()) {\n      <mat-option>\n        <ngx-mat-select-search [formControl]=\"optionFilterControl\" [placeholderLabel]=\"'search' | translate\"\n          [noEntriesFoundLabel]=\"'noResult' | translate\">\n        </ngx-mat-select-search>\n      </mat-option>\n    }\n    @for (option of filteredOptions.value() || []; track option) {\n      <mat-option [value]=\"option.id\">\n        {{option.name}}\n      </mat-option>\n    }\n  </mat-select>\n\n</mat-form-field>" }]
+    }], null, { label: [{
+            type: Input,
+            args: [{ required: true }]
+        }], selectFirstOptionByDefault: [{
+            type: Input
+        }], singleSelect: [{
+            type: ViewChild,
+            args: ['singleSelect', { static: true }]
+        }], valueChanged: [{
+            type: Output
+        }], options: [{
+            type: Input
+        }], value: [{
+            type: Input
+        }] }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SelectWithSearchComponent, { className: "SelectWithSearchComponent", filePath: "lib/components/inputs/select-with-search/select-with-search.component.ts", lineNumber: 22 }); })();
+
+const _c0$6 = ["*"];
 class GroupContainerComponent {
     constructor() {
         this.caption = input(...(ngDevMode ? [undefined, { debugName: "caption" }] : []));
     }
     static { this.ɵfac = function GroupContainerComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || GroupContainerComponent)(); }; }
-    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: GroupContainerComponent, selectors: [["cauca-group-container"]], inputs: { caption: [1, "caption"] }, ngContentSelectors: _c0$5, decls: 6, vars: 3, consts: [[1, "group-container"], [1, "group-container-title", "subtitle1"], [1, "group-container-content"]], template: function GroupContainerComponent_Template(rf, ctx) { if (rf & 1) {
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: GroupContainerComponent, selectors: [["cauca-group-container"]], inputs: { caption: [1, "caption"] }, ngContentSelectors: _c0$6, decls: 6, vars: 3, consts: [[1, "group-container"], [1, "group-container-title", "subtitle1"], [1, "group-container-content"]], template: function GroupContainerComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵprojectionDef();
             i0.ɵɵdomElementStart(0, "div", 0)(1, "div", 1);
             i0.ɵɵtext(2);
@@ -2980,7 +3245,7 @@ class GroupContainerComponent {
     }], null, null); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(GroupContainerComponent, { className: "GroupContainerComponent", filePath: "lib/components/layout/group-container/group-container.component.ts", lineNumber: 12 }); })();
 
-const _c0$4 = ["*"];
+const _c0$5 = ["*"];
 function MainSectionComponent_Conditional_1_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵdomElementStart(0, "div", 1);
     i0.ɵɵtext(1);
@@ -2996,7 +3261,7 @@ class MainSectionComponent {
         this.title = input('', ...(ngDevMode ? [{ debugName: "title" }] : []));
     }
     static { this.ɵfac = function MainSectionComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || MainSectionComponent)(); }; }
-    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: MainSectionComponent, selectors: [["cauca-main-section"]], inputs: { title: [1, "title"] }, ngContentSelectors: _c0$4, decls: 4, vars: 1, consts: [[1, "section"], [1, "section-description", "subtitle1"], [1, "section-fields"]], template: function MainSectionComponent_Template(rf, ctx) { if (rf & 1) {
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: MainSectionComponent, selectors: [["cauca-main-section"]], inputs: { title: [1, "title"] }, ngContentSelectors: _c0$5, decls: 4, vars: 1, consts: [[1, "section"], [1, "section-description", "subtitle1"], [1, "section-fields"]], template: function MainSectionComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵprojectionDef();
             i0.ɵɵdomElementStart(0, "div", 0);
             i0.ɵɵconditionalCreate(1, MainSectionComponent_Conditional_1_Template, 3, 3, "div", 1);
@@ -3014,13 +3279,13 @@ class MainSectionComponent {
     }], null, null); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(MainSectionComponent, { className: "MainSectionComponent", filePath: "lib/components/layout/sections/main-section/main-section.component.ts", lineNumber: 11 }); })();
 
-const _c0$3 = ["*"];
+const _c0$4 = ["*"];
 class SectionColumnComponent {
     constructor() {
         this.showBigGap = input(false, ...(ngDevMode ? [{ debugName: "showBigGap" }] : []));
     }
     static { this.ɵfac = function SectionColumnComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || SectionColumnComponent)(); }; }
-    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SectionColumnComponent, selectors: [["cauca-section-column"]], inputs: { showBigGap: [1, "showBigGap"] }, ngContentSelectors: _c0$3, decls: 2, vars: 2, consts: [[1, "section-columns"]], template: function SectionColumnComponent_Template(rf, ctx) { if (rf & 1) {
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SectionColumnComponent, selectors: [["cauca-section-column"]], inputs: { showBigGap: [1, "showBigGap"] }, ngContentSelectors: _c0$4, decls: 2, vars: 2, consts: [[1, "section-columns"]], template: function SectionColumnComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵprojectionDef();
             i0.ɵɵdomElementStart(0, "div", 0);
             i0.ɵɵprojection(1);
@@ -3249,6 +3514,259 @@ class PageTitleComponent {
     }], null, null); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(PageTitleComponent, { className: "PageTitleComponent", filePath: "lib/components/layout/page-title/page-title.component.ts", lineNumber: 13 }); })();
 
+const _c0$3 = ["*"];
+const DEFAULT_DURATION$1 = 500;
+class ExpandablePanelComponent {
+    constructor() {
+        this.isCollapsed = model(false, ...(ngDevMode ? [{ debugName: "isCollapsed" }] : []));
+        this.caption = input('', ...(ngDevMode ? [{ debugName: "caption" }] : []));
+        this.subCaption = input('', ...(ngDevMode ? [{ debugName: "subCaption" }] : []));
+    }
+    changeState() {
+        this.isCollapsed.update(value => !value);
+    }
+    static { this.ɵfac = function ExpandablePanelComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || ExpandablePanelComponent)(); }; }
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: ExpandablePanelComponent, selectors: [["cauca-expandable-panel"]], inputs: { isCollapsed: [1, "isCollapsed"], caption: [1, "caption"], subCaption: [1, "subCaption"] }, outputs: { isCollapsed: "isCollapsedChange" }, ngContentSelectors: _c0$3, decls: 11, vars: 4, consts: [[1, "expansion-button", 3, "click"], [1, "primary"], [1, "body2"], [1, "expansion-panel"]], template: function ExpandablePanelComponent_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵprojectionDef();
+            i0.ɵɵelementStart(0, "section")(1, "div", 0);
+            i0.ɵɵlistener("click", function ExpandablePanelComponent_Template_div_click_1_listener() { return ctx.changeState(); });
+            i0.ɵɵelementStart(2, "mat-icon");
+            i0.ɵɵtext(3, "expand_less");
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(4, "div")(5, "div", 1);
+            i0.ɵɵtext(6);
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(7, "div", 2);
+            i0.ɵɵtext(8);
+            i0.ɵɵelementEnd()()();
+            i0.ɵɵelementStart(9, "div", 3);
+            i0.ɵɵprojection(10);
+            i0.ɵɵelementEnd()();
+        } if (rf & 2) {
+            i0.ɵɵadvance(2);
+            i0.ɵɵproperty("@arrow-collapse", ctx.isCollapsed());
+            i0.ɵɵadvance(4);
+            i0.ɵɵtextInterpolate(ctx.caption());
+            i0.ɵɵadvance(2);
+            i0.ɵɵtextInterpolate(ctx.subCaption());
+            i0.ɵɵadvance();
+            i0.ɵɵproperty("@collapse", ctx.isCollapsed());
+        } }, dependencies: [MatIcon], styles: ["section[_ngcontent-%COMP%]{display:flex;padding:16px 0}.primary[_ngcontent-%COMP%]{font-weight:600}.body2[_ngcontent-%COMP%]{width:fit-content;white-space:nowrap}.expansion-button[_ngcontent-%COMP%]{display:flex;gap:4px;width:240px;padding:0 16px 8px 0;cursor:pointer;height:fit-content}.expansion-panel[_ngcontent-%COMP%]{overflow:hidden;flex:1}"], data: { animation: [
+                trigger('collapse', [
+                    state('false', style({ height: AUTO_STYLE, opacity: 1, visibility: AUTO_STYLE })),
+                    state('true', style({ height: '0', opacity: 0, visibility: 'hidden' })),
+                    transition('false => true', animate(DEFAULT_DURATION$1 + 'ms ease-in')),
+                    transition('true => false', animate(DEFAULT_DURATION$1 + 'ms ease-out'))
+                ]),
+                trigger('arrow-collapse', [
+                    state('false', style({ transform: 'rotate(0deg)' })),
+                    state('true', style({ transform: 'rotate(180deg)' })),
+                    transition('false => true', animate(DEFAULT_DURATION$1 + 'ms ease-in')),
+                    transition('true => false', animate(DEFAULT_DURATION$1 + 'ms ease-out'))
+                ])
+            ] }, changeDetection: 0 }); }
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ExpandablePanelComponent, [{
+        type: Component,
+        args: [{ selector: 'cauca-expandable-panel', changeDetection: ChangeDetectionStrategy.OnPush, imports: [MatIcon], animations: [
+                    trigger('collapse', [
+                        state('false', style({ height: AUTO_STYLE, opacity: 1, visibility: AUTO_STYLE })),
+                        state('true', style({ height: '0', opacity: 0, visibility: 'hidden' })),
+                        transition('false => true', animate(DEFAULT_DURATION$1 + 'ms ease-in')),
+                        transition('true => false', animate(DEFAULT_DURATION$1 + 'ms ease-out'))
+                    ]),
+                    trigger('arrow-collapse', [
+                        state('false', style({ transform: 'rotate(0deg)' })),
+                        state('true', style({ transform: 'rotate(180deg)' })),
+                        transition('false => true', animate(DEFAULT_DURATION$1 + 'ms ease-in')),
+                        transition('true => false', animate(DEFAULT_DURATION$1 + 'ms ease-out'))
+                    ])
+                ], template: "<section>\r\n    <div class=\"expansion-button\" (click)=\"changeState()\">\r\n        <mat-icon [@arrow-collapse]=\"isCollapsed()\">expand_less</mat-icon>\r\n        <div>\r\n            <div class=\"primary\">{{caption()}}</div>\r\n            <div class=\"body2\">{{subCaption()}}</div>\r\n        </div>\r\n    </div>\r\n    <div class=\"expansion-panel\" [@collapse]=\"isCollapsed()\">\r\n        <ng-content></ng-content>\r\n    </div>\r\n</section>", styles: ["section{display:flex;padding:16px 0}.primary{font-weight:600}.body2{width:fit-content;white-space:nowrap}.expansion-button{display:flex;gap:4px;width:240px;padding:0 16px 8px 0;cursor:pointer;height:fit-content}.expansion-panel{overflow:hidden;flex:1}\n"] }]
+    }], null, null); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(ExpandablePanelComponent, { className: "ExpandablePanelComponent", filePath: "lib/components/layout/expandable-panel/expandable-panel.component.ts", lineNumber: 28 }); })();
+
+class MenuExpandablePanelItemComponent {
+    constructor() {
+        this.icon = input(...(ngDevMode ? [undefined, { debugName: "icon" }] : []));
+        this.caption = input(...(ngDevMode ? [undefined, { debugName: "caption" }] : []));
+        this.route = input(...(ngDevMode ? [undefined, { debugName: "route" }] : []));
+        this.isSubItem = input(false, ...(ngDevMode ? [{ debugName: "isSubItem" }] : []));
+        this.action = input(null, ...(ngDevMode ? [{ debugName: "action" }] : []));
+        this.router = inject(Router);
+    }
+    openRoute() {
+        if (this.action()) {
+            this.action()();
+        }
+        else {
+            this.router.navigate(this.route());
+        }
+    }
+    static { this.ɵfac = function MenuExpandablePanelItemComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || MenuExpandablePanelItemComponent)(); }; }
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: MenuExpandablePanelItemComponent, selectors: [["cauca-menu-expandable-panel-item"]], inputs: { icon: [1, "icon"], caption: [1, "caption"], route: [1, "route"], isSubItem: [1, "isSubItem"], action: [1, "action"] }, decls: 6, vars: 8, consts: [[3, "click"]], template: function MenuExpandablePanelItemComponent_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵelementStart(0, "section", 0);
+            i0.ɵɵlistener("click", function MenuExpandablePanelItemComponent_Template_section_click_0_listener() { return ctx.openRoute(); });
+            i0.ɵɵelementStart(1, "mat-icon");
+            i0.ɵɵtext(2);
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(3, "div");
+            i0.ɵɵtext(4);
+            i0.ɵɵpipe(5, "translate");
+            i0.ɵɵelementEnd()();
+        } if (rf & 2) {
+            i0.ɵɵclassProp("sub-item", ctx.isSubItem());
+            i0.ɵɵadvance(2);
+            i0.ɵɵtextInterpolate(ctx.icon());
+            i0.ɵɵadvance();
+            i0.ɵɵclassMap(ctx.isSubItem() ? "subtitle2" : "subtitle1");
+            i0.ɵɵadvance();
+            i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(5, 6, ctx.caption()));
+        } }, dependencies: [MatIconModule, i1$1.MatIcon, TranslateModule, i1.TranslatePipe], styles: ["section[_ngcontent-%COMP%]{display:flex;gap:16px;padding:16px 24px}.sub-item[_ngcontent-%COMP%]{background-color:#f5f5f5;border-top:1px solid white}"] }); }
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(MenuExpandablePanelItemComponent, [{
+        type: Component,
+        args: [{ selector: 'cauca-menu-expandable-panel-item', imports: [MatIconModule, TranslateModule], template: "<section (click)=\"openRoute()\" [class.sub-item]=\"isSubItem()\">\r\n    <mat-icon>{{icon()}}</mat-icon>\r\n    <div [class]=\"isSubItem() ? 'subtitle2' : 'subtitle1'\">{{caption() | translate}}</div>\r\n</section>", styles: ["section{display:flex;gap:16px;padding:16px 24px}.sub-item{background-color:#f5f5f5;border-top:1px solid white}\n"] }]
+    }], null, null); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(MenuExpandablePanelItemComponent, { className: "MenuExpandablePanelItemComponent", filePath: "lib/components/layout/menu-expandable-panel-item/menu-expandable-panel-item.component.ts", lineNumber: 12 }); })();
+
+const _forTrack0 = ($index, $item) => $item.title;
+function MenuExpandablePanelComponent_Conditional_7_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 2);
+    i0.ɵɵtext(1);
+    i0.ɵɵpipe(2, "translate");
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r0 = i0.ɵɵnextContext();
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(2, 1, ctx_r0.subCaption()));
+} }
+function MenuExpandablePanelComponent_Conditional_8_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "mat-icon");
+    i0.ɵɵtext(1, "arrow_forward_ios");
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r0 = i0.ɵɵnextContext();
+    i0.ɵɵproperty("@arrow-collapse", ctx_r0.opened());
+} }
+function MenuExpandablePanelComponent_Conditional_9_For_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "cauca-menu-expandable-panel-item", 3);
+} if (rf & 2) {
+    const item_r2 = ctx.$implicit;
+    i0.ɵɵproperty("icon", item_r2.icon)("caption", item_r2.title)("route", item_r2.route)("isSubItem", true)("action", item_r2.action);
+} }
+function MenuExpandablePanelComponent_Conditional_9_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵrepeaterCreate(0, MenuExpandablePanelComponent_Conditional_9_For_1_Template, 1, 5, "cauca-menu-expandable-panel-item", 3, _forTrack0);
+} if (rf & 2) {
+    const ctx_r0 = i0.ɵɵnextContext();
+    i0.ɵɵrepeater(ctx_r0.items());
+} }
+const DEFAULT_DURATION = 200;
+class MenuExpandablePanelComponent {
+    constructor() {
+        this.caption = input(...(ngDevMode ? [undefined, { debugName: "caption" }] : []));
+        this.isSubItem = input(false, ...(ngDevMode ? [{ debugName: "isSubItem" }] : []));
+        this.subCaption = input(...(ngDevMode ? [undefined, { debugName: "subCaption" }] : []));
+        this.menuIcon = input(...(ngDevMode ? [undefined, { debugName: "menuIcon" }] : []));
+        this.showExpansionIcon = input(true, ...(ngDevMode ? [{ debugName: "showExpansionIcon" }] : []));
+        this.addTopBorderRadius = input(false, ...(ngDevMode ? [{ debugName: "addTopBorderRadius" }] : []));
+        this.bottomBorder = input(false, ...(ngDevMode ? [{ debugName: "bottomBorder" }] : []));
+        this.addBottomBorderRadius = input(false, ...(ngDevMode ? [{ debugName: "addBottomBorderRadius" }] : []));
+        this.route = input([], ...(ngDevMode ? [{ debugName: "route" }] : []));
+        this.items = input([], ...(ngDevMode ? [{ debugName: "items" }] : []));
+        this.opened = signal(false, ...(ngDevMode ? [{ debugName: "opened" }] : []));
+        this.router = inject(Router);
+    }
+    get topLeftRadius() {
+        return this.addTopBorderRadius() ? '12px' : '0px';
+    }
+    get topRightRadius() {
+        return this.addTopBorderRadius() ? '12px' : '0px';
+    }
+    get bottomLeftRadius() {
+        return this.addBottomBorderRadius() ? '12px' : '0px';
+    }
+    get bottomRightRadius() {
+        return this.addBottomBorderRadius() ? '12px' : '0px';
+    }
+    get bottomBorderClass() {
+        return this.bottomBorder();
+    }
+    handleClick() {
+        if (this.route().length > 0 && this.items().length === 0) {
+            this.router.navigate(this.route());
+        }
+        else {
+            this.opened.set(!this.opened());
+        }
+    }
+    static { this.ɵfac = function MenuExpandablePanelComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || MenuExpandablePanelComponent)(); }; }
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: MenuExpandablePanelComponent, selectors: [["cauca-menu-expandable-panel"]], hostVars: 10, hostBindings: function MenuExpandablePanelComponent_HostBindings(rf, ctx) { if (rf & 2) {
+            i0.ɵɵstyleProp("border-top-left-radius", ctx.topLeftRadius)("border-top-right-radius", ctx.topRightRadius)("border-bottom-left-radius", ctx.bottomLeftRadius)("border-bottom-right-radius", ctx.bottomRightRadius);
+            i0.ɵɵclassProp("bottom-border", ctx.bottomBorderClass);
+        } }, inputs: { caption: [1, "caption"], isSubItem: [1, "isSubItem"], subCaption: [1, "subCaption"], menuIcon: [1, "menuIcon"], showExpansionIcon: [1, "showExpansionIcon"], addTopBorderRadius: [1, "addTopBorderRadius"], bottomBorder: [1, "bottomBorder"], addBottomBorderRadius: [1, "addBottomBorderRadius"], route: [1, "route"], items: [1, "items"] }, decls: 10, vars: 8, consts: [[3, "click", "ngClass"], [1, "subtitle1"], [1, "body2"], [3, "icon", "caption", "route", "isSubItem", "action"]], template: function MenuExpandablePanelComponent_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵelementStart(0, "section", 0);
+            i0.ɵɵlistener("click", function MenuExpandablePanelComponent_Template_section_click_0_listener() { return ctx.handleClick(); });
+            i0.ɵɵelementStart(1, "mat-icon");
+            i0.ɵɵtext(2);
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(3, "div")(4, "div", 1);
+            i0.ɵɵtext(5);
+            i0.ɵɵpipe(6, "translate");
+            i0.ɵɵelementEnd();
+            i0.ɵɵconditionalCreate(7, MenuExpandablePanelComponent_Conditional_7_Template, 3, 3, "div", 2);
+            i0.ɵɵelementEnd();
+            i0.ɵɵconditionalCreate(8, MenuExpandablePanelComponent_Conditional_8_Template, 2, 1, "mat-icon");
+            i0.ɵɵelementEnd();
+            i0.ɵɵconditionalCreate(9, MenuExpandablePanelComponent_Conditional_9_Template, 2, 0);
+        } if (rf & 2) {
+            i0.ɵɵproperty("ngClass", ctx.opened() ? "bottom-padding" : "");
+            i0.ɵɵadvance(2);
+            i0.ɵɵtextInterpolate(ctx.menuIcon());
+            i0.ɵɵadvance(3);
+            i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(6, 6, ctx.caption()));
+            i0.ɵɵadvance(2);
+            i0.ɵɵconditional(ctx.subCaption() ? 7 : -1);
+            i0.ɵɵadvance();
+            i0.ɵɵconditional(ctx.showExpansionIcon() ? 8 : -1);
+            i0.ɵɵadvance();
+            i0.ɵɵconditional(ctx.opened() ? 9 : -1);
+        } }, dependencies: [MatIconModule, i1$1.MatIcon, TranslateModule, MenuExpandablePanelItemComponent, NgClass, i1.TranslatePipe], styles: ["[_nghost-%COMP%]{padding:10px 12px;background-color:#fff;cursor:pointer;display:block}section[_ngcontent-%COMP%]{display:flex;gap:16px;align-items:center}section.bottom-padding[_ngcontent-%COMP%]{padding-bottom:10px}div[_ngcontent-%COMP%]{flex:1}"], data: { animation: [
+                trigger('arrow-collapse', [
+                    state('false', style({ transform: 'rotate(0deg)' })),
+                    state('true', style({ transform: 'rotate(-90deg)' })),
+                    transition('false => true', animate(DEFAULT_DURATION + 'ms ease-in-out')),
+                    transition('true => false', animate(DEFAULT_DURATION + 'ms ease-in-out'))
+                ])
+            ] } }); }
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(MenuExpandablePanelComponent, [{
+        type: Component,
+        args: [{ selector: 'cauca-menu-expandable-panel', imports: [MatIconModule, TranslateModule, MenuExpandablePanelItemComponent, NgClass], animations: [
+                    trigger('arrow-collapse', [
+                        state('false', style({ transform: 'rotate(0deg)' })),
+                        state('true', style({ transform: 'rotate(-90deg)' })),
+                        transition('false => true', animate(DEFAULT_DURATION + 'ms ease-in-out')),
+                        transition('true => false', animate(DEFAULT_DURATION + 'ms ease-in-out'))
+                    ])
+                ], template: "<section [ngClass]=\"opened() ? 'bottom-padding' : ''\" (click)=\"handleClick()\">\r\n    <mat-icon>{{menuIcon()}}</mat-icon>\r\n    <div>\r\n        <div class=\"subtitle1\">{{caption() | translate}}</div>\r\n        @if(subCaption()) {<div class=\"body2\">{{subCaption() | translate}}</div>}\r\n    </div>\r\n    @if (showExpansionIcon()) {<mat-icon [@arrow-collapse]=\"opened()\">arrow_forward_ios</mat-icon>}\r\n</section>\r\n@if(opened()) {\r\n    @for (item of items(); track item.title) {\r\n        <cauca-menu-expandable-panel-item [icon]=\"item.icon\" [caption]=\"item.title\" [route]=\"item.route\" [isSubItem]=\"true\" [action]=\"item.action\" />\r\n    }\r\n}", styles: [":host{padding:10px 12px;background-color:#fff;cursor:pointer;display:block}section{display:flex;gap:16px;align-items:center}section.bottom-padding{padding-bottom:10px}div{flex:1}\n"] }]
+    }], null, { topLeftRadius: [{
+            type: HostBinding,
+            args: ['style.border-top-left-radius']
+        }], topRightRadius: [{
+            type: HostBinding,
+            args: ['style.border-top-right-radius']
+        }], bottomLeftRadius: [{
+            type: HostBinding,
+            args: ['style.border-bottom-left-radius']
+        }], bottomRightRadius: [{
+            type: HostBinding,
+            args: ['style.border-bottom-right-radius']
+        }], bottomBorderClass: [{
+            type: HostBinding,
+            args: ['class.bottom-border']
+        }] }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(MenuExpandablePanelComponent, { className: "MenuExpandablePanelComponent", filePath: "lib/components/layout/menu-expandable-panel/menu-expandable-panel.component.ts", lineNumber: 25 }); })();
+
 function SavingConfirmedBoxComponent_Conditional_0_Template(rf, ctx) { if (rf & 1) {
     const _r1 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "cauca-snackbar", 1);
@@ -4192,5 +4710,5 @@ class MenuItem {
  * Generated bundle index. Do not edit.
  */
 
-export { AutoTrimAndLowerDirective, BadgeComponent, BasicButtonComponent, ButtonComponent, CaucaDateTimePickerComponent, CaucaInputFileComponent, CaucaInputMultipleLangueComponent, CaucaMaterialComponent, CaucaMaterialService, CaucaMenuSidebarComponent, CaucaMenuVerticalComponent, CaucaSimpleDialogComponent, CaucaSlideshowComponent, ConfirmationResult, DateRangePickerComponent, DialogService, DropdownChipAutocompleteComponent, FabButtonComponent, FlatButtonComponent, FormErrorModule, GroupContainerComponent, HasErrorDirective, HasErrorRootDirective, IconButtonComponent, IconComponent, LinkButtonComponent, ListPaginatorComponent, LoadingErrorComponent, LoadingSpinnerIndicatorComponent, LoadingStateService, MainSectionComponent, MenuItem, MenuItemComponent, PageTitleComponent, PasswordCriteriaViewerComponent, PasswordInputComponent, PasswordSelectionComponent, RaisedButtonComponent, RefreshButtonComponent, RoundButtonComponent, SavingConfirmedBoxComponent, SavingErrorBoxComponent, SectionColumnComponent, SectionFieldComponent, SnackBarComponent, StrokedButtonComponent };
+export { AutoTrimAndLowerDirective, BadgeComponent, BasicButtonComponent, ButtonComponent, CaucaDateTimePickerComponent, CaucaInputFileComponent, CaucaInputMultipleLangueComponent, CaucaMaterialComponent, CaucaMaterialService, CaucaMenuSidebarComponent, CaucaMenuVerticalComponent, CaucaSimpleDialogComponent, CaucaSlideshowComponent, ColorPickerComponent, ConfirmationResult, DateRangePickerComponent, DialogService, DropdownChipAutocompleteComponent, ExpandablePanelComponent, FabButtonComponent, FlatButtonComponent, FormErrorModule, GroupContainerComponent, HasErrorDirective, HasErrorRootDirective, IconButtonComponent, IconComponent, LinkButtonComponent, ListPaginatorComponent, LoadingErrorComponent, LoadingSpinnerIndicatorComponent, LoadingStateService, MainSectionComponent, MenuExpandablePanelComponent, MenuExpandablePanelItemComponent, MenuItem, MenuItemComponent, PageTitleComponent, PasswordCriteriaViewerComponent, PasswordInputComponent, PasswordSelectionComponent, RaisedButtonComponent, RefreshButtonComponent, RoundButtonComponent, SavingConfirmedBoxComponent, SavingErrorBoxComponent, SectionColumnComponent, SectionFieldComponent, SelectWithSearchComponent, SnackBarComponent, StrokedButtonComponent };
 //# sourceMappingURL=cauca-911-material.mjs.map