@cauca-911/material 20.2.12 → 20.2.14

package/fesm2022/cauca-911-material.mjs

@@ -128,7 +128,7 @@ class MobileTimePickerComponent {
                     MatIconModule,
                     MatFormFieldModule,
                     MatInputModule
-                ], template: "<button mat-icon-button (click)=\"valueUp()\">\n    <mat-icon>keyboard_arrow_up</mat-icon>\n</button>\n<div>\n{{(value < 10 ? '0' : '' ) + value}}\n</div>\n<button mat-icon-button (click)=\"valueDown()\">\n    <mat-icon>keyboard_arrow_down</mat-icon>\n</button>\n", styles: [":host{display:flex;flex-direction:column;align-items:center;justify-content:center;height:70px;font-family:var(--mat-form-field-container-text-font)}.mat-mdc-icon-button{height:24px;width:24px;line-height:24px;padding:0}\n"] }]
+                ], template: "<button mat-icon-button (click)=\"valueUp()\">\r\n    <mat-icon>keyboard_arrow_up</mat-icon>\r\n</button>\r\n<div>\r\n{{(value < 10 ? '0' : '' ) + value}}\r\n</div>\r\n<button mat-icon-button (click)=\"valueDown()\">\r\n    <mat-icon>keyboard_arrow_down</mat-icon>\r\n</button>\r\n", styles: [":host{display:flex;flex-direction:column;align-items:center;justify-content:center;height:70px;font-family:var(--mat-form-field-container-text-font)}.mat-mdc-icon-button{height:24px;width:24px;line-height:24px;padding:0}\n"] }]
     }], null, { value: [{
             type: Input,
             args: [{ required: true }]
@@ -173,7 +173,7 @@ class DesktopTimePickerComponent {
         type: Component,
         args: [{ selector: 'cauca-desktop-time-picker', imports: [
                     MatListModule
-                ], template: "<mat-list [disabled]=\"disabled?.all\">\n    @for (option of options; track option) {\n    <mat-list-item [activated]=\"value === option\" [disabled]=\"disabled?.someOptions.includes(option)\"\n        (click)=\"valueChange.emit(option)\">{{(option < 10 ? '0' : '' ) + option}}</mat-list-item>\n            }\n</mat-list>", styles: ["mat-list{width:50px;padding:0}mat-list .mat-mdc-list-item:not(.mat-mdc-list-item-interactive){cursor:pointer}>div::-webkit-scrollbar{display:none}::ng-deep .mdc-list-item__primary-text{font-family:var(--mat-datepicker-calendar-text-font);font-size:var(--mat-datepicker-calendar-text-size)}::ng-deep .mdc-list-item--activated{background-color:var(--mat-datepicker-calendar-date-selected-state-background-color)}::ng-deep .mdc-list-item--activated .mdc-list-item__primary-text{color:var(--mat-datepicker-calendar-date-selected-state-text-color)}\n"] }]
+                ], template: "<mat-list [disabled]=\"disabled?.all\">\r\n    @for (option of options; track option) {\r\n    <mat-list-item [activated]=\"value === option\" [disabled]=\"disabled?.someOptions.includes(option)\"\r\n        (click)=\"valueChange.emit(option)\">{{(option < 10 ? '0' : '' ) + option}}</mat-list-item>\r\n            }\r\n</mat-list>", styles: ["mat-list{width:50px;padding:0}mat-list .mat-mdc-list-item:not(.mat-mdc-list-item-interactive){cursor:pointer}>div::-webkit-scrollbar{display:none}::ng-deep .mdc-list-item__primary-text{font-family:var(--mat-datepicker-calendar-text-font);font-size:var(--mat-datepicker-calendar-text-size)}::ng-deep .mdc-list-item--activated{background-color:var(--mat-datepicker-calendar-date-selected-state-background-color)}::ng-deep .mdc-list-item--activated .mdc-list-item__primary-text{color:var(--mat-datepicker-calendar-date-selected-state-text-color)}\n"] }]
     }], null, { options: [{
             type: Input
         }], value: [{
@@ -509,7 +509,7 @@ class DialogDateTimePickerComponent {
         } }, dependencies: [CommonModule, i1$3.NgClass, i1$3.NgIf, CaucaCoreForChildModule,
             MatButtonModule, i2.MatButton, MatDatepickerModule, i2$1.MatCalendar, MatIconModule, i1$1.MatIcon, MatListModule,
             MobileTimePickerComponent,
-            DesktopTimePickerComponent, i1.TranslatePipe], styles: ["div[mat-dialog-actions][_ngcontent-%COMP%]{padding:8px;border-top:1px solid #ccc}div[mat-dialog-actions][_ngcontent-%COMP%]   button[_ngcontent-%COMP%]{margin:2px}.date-time-picker[_ngcontent-%COMP%]{display:grid;grid-template-areas:\"calendar hours minutes seconds\";height:350px;overflow:hidden;justify-content:center}.date-time-picker[_ngcontent-%COMP%] > div[_ngcontent-%COMP%]{overflow:auto;flex:1;max-width:50px;scrollbar-width:none;border-left:1px solid #ccc}.date-time-picker[_ngcontent-%COMP%] > div[_ngcontent-%COMP%]:first-child{flex:4;max-width:290px;border-left:none}.date-time-picker[_ngcontent-%COMP%] > div[_ngcontent-%COMP%]:first-child   mat-calendar[_ngcontent-%COMP%]{width:290px;height:350px}.date-time-picker[_ngcontent-%COMP%] > div[_ngcontent-%COMP%]::-webkit-scrollbar{display:none}.date-time-picker[_ngcontent-%COMP%]     .mdc-list-item__primary-text{font-family:var(--mat-datepicker-calendar-text-font);font-size:var(--mat-datepicker-calendar-text-size)}.date-time-picker[_ngcontent-%COMP%]     .mdc-list-item--activated{background-color:var(--mat-datepicker-calendar-date-selected-state-background-color)}.date-time-picker[_ngcontent-%COMP%]     .mdc-list-item--activated .mdc-list-item__primary-text{color:var(--mat-datepicker-calendar-date-selected-state-text-color)}.calendar[_ngcontent-%COMP%]{grid-area:calendar}.hours[_ngcontent-%COMP%]{grid-area:hours}.minutes[_ngcontent-%COMP%]{grid-area:minutes}.seconds[_ngcontent-%COMP%]{grid-area:seconds}.hour-and-minute-separator[_ngcontent-%COMP%]{grid-area:hour-and-minute-separator;display:flex;align-items:center;justify-content:center;font-weight:700}.minute-and-second-separator[_ngcontent-%COMP%]{grid-area:minute-and-second-separator;display:flex;align-items:center;justify-content:center;font-weight:700}@media only screen and (max-width: 555px){.show-seconds[_ngcontent-%COMP%]{grid-template-areas:\"calendar calendar calendar calendar calendar calendar calendar\" \". hours hour-and-minute-separator minutes minute-and-second-separator seconds .\";grid-template-columns:auto 40px 2px 40px 2px 40px auto}.hide-seconds[_ngcontent-%COMP%]{grid-template-areas:\"calendar calendar calendar calendar calendar\" \". hours hour-and-minute-separator minutes .\";grid-template-columns:auto 40px 2px 40px auto}.date-time-picker[_ngcontent-%COMP%]{grid-template-rows:auto auto;height:450px}.date-time-picker[_ngcontent-%COMP%] > div[_ngcontent-%COMP%]{border-left:none}.date-time-picker[_ngcontent-%COMP%] > div[_ngcontent-%COMP%]:not(:first-child){height:70px}.date-time-picker[_ngcontent-%COMP%] > div[_ngcontent-%COMP%]:first-child{overflow:initial;flex:4;max-width:290px;border-left:none}}"] }); }
+            DesktopTimePickerComponent, i1.TranslatePipe], styles: ["div[mat-dialog-actions][_ngcontent-%COMP%]{padding:8px;border-top:1px solid #ccc}div[mat-dialog-actions][_ngcontent-%COMP%]   button[_ngcontent-%COMP%]{margin:2px}.date-time-picker[_ngcontent-%COMP%]{display:grid;grid-template-areas:\"calendar hours minutes seconds\";height:350px;overflow:hidden;justify-content:center}.date-time-picker[_ngcontent-%COMP%] > div[_ngcontent-%COMP%]{overflow:auto;flex:1;max-width:50px;scrollbar-width:none;border-left:1px solid #ccc}.date-time-picker[_ngcontent-%COMP%] > div[_ngcontent-%COMP%]:first-child{flex:4;max-width:290px;border-left:none}.date-time-picker[_ngcontent-%COMP%] > div[_ngcontent-%COMP%]:first-child   mat-calendar[_ngcontent-%COMP%]{width:290px;height:350px}.date-time-picker[_ngcontent-%COMP%] > div[_ngcontent-%COMP%]::-webkit-scrollbar{display:none}.date-time-picker[_ngcontent-%COMP%]     .mdc-list-item__primary-text{font-family:var(--mat-datepicker-calendar-text-font);font-size:var(--mat-datepicker-calendar-text-size)}.date-time-picker[_ngcontent-%COMP%]     .mdc-list-item--activated{background-color:var(--mat-datepicker-calendar-date-selected-state-background-color)}.date-time-picker[_ngcontent-%COMP%]     .mdc-list-item--activated .mdc-list-item__primary-text{color:var(--mat-datepicker-calendar-date-selected-state-text-color)}.calendar[_ngcontent-%COMP%]{grid-area:calendar}.hours[_ngcontent-%COMP%]{grid-area:hours}.minutes[_ngcontent-%COMP%]{grid-area:minutes}.seconds[_ngcontent-%COMP%]{grid-area:seconds}.hour-and-minute-separator[_ngcontent-%COMP%]{grid-area:hour-and-minute-separator;display:flex;align-items:center;justify-content:center;font-weight:700}.minute-and-second-separator[_ngcontent-%COMP%]{grid-area:minute-and-second-separator;display:flex;align-items:center;justify-content:center;font-weight:700}@media only screen and (max-width:555px){.show-seconds[_ngcontent-%COMP%]{grid-template-areas:\"calendar calendar calendar calendar calendar calendar calendar\" \". hours hour-and-minute-separator minutes minute-and-second-separator seconds .\";grid-template-columns:auto 40px 2px 40px 2px 40px auto}.hide-seconds[_ngcontent-%COMP%]{grid-template-areas:\"calendar calendar calendar calendar calendar\" \". hours hour-and-minute-separator minutes .\";grid-template-columns:auto 40px 2px 40px auto}.date-time-picker[_ngcontent-%COMP%]{grid-template-rows:auto auto;height:450px}.date-time-picker[_ngcontent-%COMP%] > div[_ngcontent-%COMP%]{border-left:none}.date-time-picker[_ngcontent-%COMP%] > div[_ngcontent-%COMP%]:not(:first-child){height:70px}.date-time-picker[_ngcontent-%COMP%] > div[_ngcontent-%COMP%]:first-child{overflow:initial;flex:4;max-width:290px;border-left:none}}"] }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DialogDateTimePickerComponent, [{
         type: Component,
@@ -522,7 +522,7 @@ class DialogDateTimePickerComponent {
                     MatListModule,
                     MobileTimePickerComponent,
                     DesktopTimePickerComponent
-                ], providers: [provideNativeDateAdapter()], template: "<div mat-dialog-content>\n    <div [ngClass]=\"showSeconds ? 'show-seconds' : 'hide-seconds'\" class=\"date-time-picker\">\n        <div class=\"calendar\">\n            <mat-calendar\n                [minDate]=\"minimumDate\"\n                [maxDate]=\"maximumDate\"\n                [selected]=\"selectedDate\"\n                (selectedChange)=\"dateChanged($event)\"\n            ></mat-calendar>\n        </div>\n\n        @if (showTime()) {\n            <div class=\"hours\" *ngIf=\"!showMobileUi\">\n                <cauca-desktop-time-picker [disabled]=\"{all: disabled.hours, someOptions: disabled.someHours}\" (valueChange)=\"hourChanged($event)\" [options]=\"hours\" [value]=\"selectedHour\"/>\n            </div>\n            <div class=\"hours\" *ngIf=\"showMobileUi\">\n                <cauca-mobile-time-picker (valueChange)=\"hourChanged($event)\" [options]=\"hours\" [value]=\"selectedHour\" />\n            </div>\n            \n            <div class=\"hour-and-minute-separator\" *ngIf=\"showMobileUi\">:</div>\n            \n            <div class=\"minutes\" *ngIf=\"!showMobileUi\">\n                <cauca-desktop-time-picker [disabled]=\"{all: disabled.minutes, someOptions: disabled.someMinutes}\" (valueChange)=\"minuteChanged($event)\" [options]=\"minutes\" [value]=\"selectedMinute\"/>\n            </div>\n            <div class=\"minutes\" *ngIf=\"showMobileUi\">\n                <cauca-mobile-time-picker (valueChange)=\"minuteChanged($event)\" [options]=\"minutes\" [value]=\"selectedMinute\" />\n            </div>\n            \n            <div class=\"minute-and-second-separator\" *ngIf=\"showSeconds && showMobileUi\">:</div>\n            <div class=\"seconds\" *ngIf=\"showSeconds && !showMobileUi\">\n                <cauca-desktop-time-picker [disabled]=\"{all: disabled.seconds, someOptions: disabled.someSeconds}\" (valueChange)=\"secondChanged($event)\" [options]=\"seconds\" [value]=\"selectedSecond\"/>\n            </div>\n            <div class=\"seconds\" *ngIf=\"showSeconds && showMobileUi\">\n                <cauca-mobile-time-picker (valueChange)=\"secondChanged($event)\" [options]=\"seconds\" [value]=\"selectedSecond\" />\n            </div>\n        }\n    </div>\n</div>\n\n<div mat-dialog-actions align=\"end\">\n    <button mat-stroked-button (click)=\"clear()\" *ngIf=\"showClearButton\">\n        <mat-icon *ngIf=\"showButtonIcons\">clear</mat-icon>\n        {{'material.clear' | translate}}\n    </button>\n    <button color=\"primary\" mat-stroked-button (click)=\"cancel()\">\n        <mat-icon *ngIf=\"showButtonIcons\">cancel</mat-icon>\n        {{'material.cancel' | translate}}\n    </button>\n    <button color=\"primary\" mat-raised-button cdkFocusInitial (click)=\"confirm()\">\n        <mat-icon *ngIf=\"showButtonIcons\">check</mat-icon>\n        {{'material.ok' | translate}}\n    </button>\n</div>", styles: ["div[mat-dialog-actions]{padding:8px;border-top:1px solid #ccc}div[mat-dialog-actions] button{margin:2px}.date-time-picker{display:grid;grid-template-areas:\"calendar hours minutes seconds\";height:350px;overflow:hidden;justify-content:center}.date-time-picker>div{overflow:auto;flex:1;max-width:50px;scrollbar-width:none;border-left:1px solid #ccc}.date-time-picker>div:first-child{flex:4;max-width:290px;border-left:none}.date-time-picker>div:first-child mat-calendar{width:290px;height:350px}.date-time-picker>div::-webkit-scrollbar{display:none}.date-time-picker ::ng-deep .mdc-list-item__primary-text{font-family:var(--mat-datepicker-calendar-text-font);font-size:var(--mat-datepicker-calendar-text-size)}.date-time-picker ::ng-deep .mdc-list-item--activated{background-color:var(--mat-datepicker-calendar-date-selected-state-background-color)}.date-time-picker ::ng-deep .mdc-list-item--activated .mdc-list-item__primary-text{color:var(--mat-datepicker-calendar-date-selected-state-text-color)}.calendar{grid-area:calendar}.hours{grid-area:hours}.minutes{grid-area:minutes}.seconds{grid-area:seconds}.hour-and-minute-separator{grid-area:hour-and-minute-separator;display:flex;align-items:center;justify-content:center;font-weight:700}.minute-and-second-separator{grid-area:minute-and-second-separator;display:flex;align-items:center;justify-content:center;font-weight:700}@media only screen and (max-width: 555px){.show-seconds{grid-template-areas:\"calendar calendar calendar calendar calendar calendar calendar\" \". hours hour-and-minute-separator minutes minute-and-second-separator seconds .\";grid-template-columns:auto 40px 2px 40px 2px 40px auto}.hide-seconds{grid-template-areas:\"calendar calendar calendar calendar calendar\" \". hours hour-and-minute-separator minutes .\";grid-template-columns:auto 40px 2px 40px auto}.date-time-picker{grid-template-rows:auto auto;height:450px}.date-time-picker>div{border-left:none}.date-time-picker>div:not(:first-child){height:70px}.date-time-picker>div:first-child{overflow:initial;flex:4;max-width:290px;border-left:none}}\n"] }]
+                ], providers: [provideNativeDateAdapter()], template: "<div mat-dialog-content>\r\n    <div [ngClass]=\"showSeconds ? 'show-seconds' : 'hide-seconds'\" class=\"date-time-picker\">\r\n        <div class=\"calendar\">\r\n            <mat-calendar\r\n                [minDate]=\"minimumDate\"\r\n                [maxDate]=\"maximumDate\"\r\n                [selected]=\"selectedDate\"\r\n                (selectedChange)=\"dateChanged($event)\"\r\n            ></mat-calendar>\r\n        </div>\r\n\r\n        @if (showTime()) {\r\n            <div class=\"hours\" *ngIf=\"!showMobileUi\">\r\n                <cauca-desktop-time-picker [disabled]=\"{all: disabled.hours, someOptions: disabled.someHours}\" (valueChange)=\"hourChanged($event)\" [options]=\"hours\" [value]=\"selectedHour\"/>\r\n            </div>\r\n            <div class=\"hours\" *ngIf=\"showMobileUi\">\r\n                <cauca-mobile-time-picker (valueChange)=\"hourChanged($event)\" [options]=\"hours\" [value]=\"selectedHour\" />\r\n            </div>\r\n            \r\n            <div class=\"hour-and-minute-separator\" *ngIf=\"showMobileUi\">:</div>\r\n            \r\n            <div class=\"minutes\" *ngIf=\"!showMobileUi\">\r\n                <cauca-desktop-time-picker [disabled]=\"{all: disabled.minutes, someOptions: disabled.someMinutes}\" (valueChange)=\"minuteChanged($event)\" [options]=\"minutes\" [value]=\"selectedMinute\"/>\r\n            </div>\r\n            <div class=\"minutes\" *ngIf=\"showMobileUi\">\r\n                <cauca-mobile-time-picker (valueChange)=\"minuteChanged($event)\" [options]=\"minutes\" [value]=\"selectedMinute\" />\r\n            </div>\r\n            \r\n            <div class=\"minute-and-second-separator\" *ngIf=\"showSeconds && showMobileUi\">:</div>\r\n            <div class=\"seconds\" *ngIf=\"showSeconds && !showMobileUi\">\r\n                <cauca-desktop-time-picker [disabled]=\"{all: disabled.seconds, someOptions: disabled.someSeconds}\" (valueChange)=\"secondChanged($event)\" [options]=\"seconds\" [value]=\"selectedSecond\"/>\r\n            </div>\r\n            <div class=\"seconds\" *ngIf=\"showSeconds && showMobileUi\">\r\n                <cauca-mobile-time-picker (valueChange)=\"secondChanged($event)\" [options]=\"seconds\" [value]=\"selectedSecond\" />\r\n            </div>\r\n        }\r\n    </div>\r\n</div>\r\n\r\n<div mat-dialog-actions align=\"end\">\r\n    <button mat-stroked-button (click)=\"clear()\" *ngIf=\"showClearButton\">\r\n        <mat-icon *ngIf=\"showButtonIcons\">clear</mat-icon>\r\n        {{'material.clear' | translate}}\r\n    </button>\r\n    <button color=\"primary\" mat-stroked-button (click)=\"cancel()\">\r\n        <mat-icon *ngIf=\"showButtonIcons\">cancel</mat-icon>\r\n        {{'material.cancel' | translate}}\r\n    </button>\r\n    <button color=\"primary\" mat-raised-button cdkFocusInitial (click)=\"confirm()\">\r\n        <mat-icon *ngIf=\"showButtonIcons\">check</mat-icon>\r\n        {{'material.ok' | translate}}\r\n    </button>\r\n</div>", styles: ["div[mat-dialog-actions]{padding:8px;border-top:1px solid #ccc}div[mat-dialog-actions] button{margin:2px}.date-time-picker{display:grid;grid-template-areas:\"calendar hours minutes seconds\";height:350px;overflow:hidden;justify-content:center}.date-time-picker>div{overflow:auto;flex:1;max-width:50px;scrollbar-width:none;border-left:1px solid #ccc}.date-time-picker>div:first-child{flex:4;max-width:290px;border-left:none}.date-time-picker>div:first-child mat-calendar{width:290px;height:350px}.date-time-picker>div::-webkit-scrollbar{display:none}.date-time-picker ::ng-deep .mdc-list-item__primary-text{font-family:var(--mat-datepicker-calendar-text-font);font-size:var(--mat-datepicker-calendar-text-size)}.date-time-picker ::ng-deep .mdc-list-item--activated{background-color:var(--mat-datepicker-calendar-date-selected-state-background-color)}.date-time-picker ::ng-deep .mdc-list-item--activated .mdc-list-item__primary-text{color:var(--mat-datepicker-calendar-date-selected-state-text-color)}.calendar{grid-area:calendar}.hours{grid-area:hours}.minutes{grid-area:minutes}.seconds{grid-area:seconds}.hour-and-minute-separator{grid-area:hour-and-minute-separator;display:flex;align-items:center;justify-content:center;font-weight:700}.minute-and-second-separator{grid-area:minute-and-second-separator;display:flex;align-items:center;justify-content:center;font-weight:700}@media only screen and (max-width:555px){.show-seconds{grid-template-areas:\"calendar calendar calendar calendar calendar calendar calendar\" \". hours hour-and-minute-separator minutes minute-and-second-separator seconds .\";grid-template-columns:auto 40px 2px 40px 2px 40px auto}.hide-seconds{grid-template-areas:\"calendar calendar calendar calendar calendar\" \". hours hour-and-minute-separator minutes .\";grid-template-columns:auto 40px 2px 40px auto}.date-time-picker{grid-template-rows:auto auto;height:450px}.date-time-picker>div{border-left:none}.date-time-picker>div:not(:first-child){height:70px}.date-time-picker>div:first-child{overflow:initial;flex:4;max-width:290px;border-left:none}}\n"] }]
     }], () => [], { onResize: [{
             type: HostListener,
             args: ['window:resize', ['$event']]
@@ -688,7 +688,7 @@ class CaucaDateTimePickerComponent {
                         multi: true,
                         useExisting: forwardRef(() => CaucaDateTimePickerComponent),
                     }
-                ], template: "<mat-form-field [subscriptSizing]=\"subscriptSizing\">\n    @if (label) {\n        <mat-label>{{ translateLabel ? (label | translate) : label }}{{isRequired ? '*' : ''}}</mat-label>\n    }\n    <input (focusout)=\"onTouched()\" matInput [value]=\"stringDate\" readonly=\"readonly\">\n    <button matSuffix mat-icon-button (click)=\"showDialog()\">\n        <mat-icon>calendar_month</mat-icon>\n    </button>\n</mat-form-field>", styles: [":host{display:block}mat-form-field{width:100%}\n"] }]
+                ], template: "<mat-form-field [subscriptSizing]=\"subscriptSizing\">\r\n    @if (label) {\r\n        <mat-label>{{ translateLabel ? (label | translate) : label }}{{isRequired ? '*' : ''}}</mat-label>\r\n    }\r\n    <input (focusout)=\"onTouched()\" matInput [value]=\"stringDate\" readonly=\"readonly\">\r\n    <button matSuffix mat-icon-button (click)=\"showDialog()\">\r\n        <mat-icon>calendar_month</mat-icon>\r\n    </button>\r\n</mat-form-field>", styles: [":host{display:block}mat-form-field{width:100%}\n"] }]
     }], null, { subscriptSizing: [{
             type: Input
         }], showTime: [{
@@ -748,7 +748,7 @@ class BaseButton {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(BaseButton, [{
         type: Directive
-    }], null, null); })();
+    }], null, { colorOnHover: [{ type: i0.Input, args: [{ isSignal: true, alias: "colorOnHover", required: false }] }], color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], iconAlignment: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconAlignment", required: false }] }], isDisabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "isDisabled", required: false }] }], isInProgress: [{ type: i0.Input, args: [{ isSignal: true, alias: "isInProgress", required: false }] }], buttonClick: [{ type: i0.Output, args: ["buttonClick"] }] }); })();
 class BaseButtonWithLabel extends BaseButton {
     constructor() {
         super(...arguments);
@@ -761,7 +761,7 @@ class BaseButtonWithLabel extends BaseButton {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(BaseButtonWithLabel, [{
         type: Directive
-    }], null, null); })();
+    }], null, { translateLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "translateLabel", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], small: [{ type: i0.Input, args: [{ isSignal: true, alias: "small", required: false }] }] }); })();
 
 function BasicButtonComponent_Conditional_1_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "mat-icon");
@@ -1123,7 +1123,7 @@ class ButtonComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ButtonComponent, [{
         type: Component,
-        args: [{ selector: 'cauca-button', imports: [MatIconModule, MatButtonModule, NgClass], template: "@if (type === 'basic') {\n  <button [ngClass]=\"class\" mat-button (click)=\"buttonClick.emit()\" [disabled]=\"disable || inProgress\" [color]=\"color\" class=\"button-basic\">\n    @if (inProgress || icon) {\n      <mat-icon [class.button-spin]=\"inProgress\">{{ inProgress ? 'update' : icon }}</mat-icon>\n    }\n    <span>{{label}}</span>\n  </button>\n}\n\n@if (type === 'raised') {\n  <button [ngClass]=\"class\" matButton=\"elevated\" (click)=\"buttonClick.emit()\" [disabled]=\"disable || inProgress\" [color]=\"color\" class=\"button-raised\">\n    @if (inProgress || icon) {\n      <mat-icon [class.button-spin]=\"inProgress\">{{ inProgress ? 'update' : icon }}</mat-icon>\n    }\n    <span>{{label}}</span>\n  </button>\n}\n\n@if (type === 'stroked') {\n  <button [ngClass]=\"class\" matButton=\"outlined\" (click)=\"buttonClick.emit()\" [disabled]=\"disable || inProgress\" [color]=\"color\" class=\"button-stroked\">\n    @if (inProgress || icon) {\n      <mat-icon [class.button-spin]=\"inProgress\">{{ inProgress ? 'update' : icon }}</mat-icon>\n    }\n    <span>{{label}}</span>\n  </button>\n}\n\n@if (type === 'flat') {\n  <button [ngClass]=\"class\" matButton=\"filled\" (click)=\"buttonClick.emit()\" [disabled]=\"disable || inProgress\" [color]=\"color\" class=\"button-flat\">\n    @if (inProgress || icon) {\n      <mat-icon [class.button-spin]=\"inProgress\">{{ inProgress ? 'update' : icon }}</mat-icon>\n    }\n    <span>{{label}}</span>\n  </button>\n}\n\n@if (type === 'icon') {\n  <button [ngClass]=\"class\" matIconButton (click)=\"buttonClick.emit()\" [disabled]=\"disable || inProgress\" [color]=\"color\" class=\"button-icon\">\n    @if (inProgress || icon) {\n      <mat-icon [class.button-spin]=\"inProgress\">{{ inProgress ? 'update' : icon }}</mat-icon>\n    }\n  </button>\n}\n\n@if (type === 'fab') {\n  <button [ngClass]=\"class\" matFab (click)=\"buttonClick.emit()\" [disabled]=\"disable || inProgress\" [color]=\"color\" class=\"button-icon\">\n    @if (inProgress || icon) {\n      <mat-icon [class.button-spin]=\"inProgress\">{{ inProgress ? 'update' : icon }}</mat-icon>\n    }\n    <span>{{label}}</span>\n  </button>\n}", styles: ["@keyframes spinner{to{transform:rotate(360deg)}}.button-spin{animation:spinner 1s linear infinite}\n"] }]
+        args: [{ selector: 'cauca-button', imports: [MatIconModule, MatButtonModule, NgClass], template: "@if (type === 'basic') {\r\n  <button [ngClass]=\"class\" mat-button (click)=\"buttonClick.emit()\" [disabled]=\"disable || inProgress\" [color]=\"color\" class=\"button-basic\">\r\n    @if (inProgress || icon) {\r\n      <mat-icon [class.button-spin]=\"inProgress\">{{ inProgress ? 'update' : icon }}</mat-icon>\r\n    }\r\n    <span>{{label}}</span>\r\n  </button>\r\n}\r\n\r\n@if (type === 'raised') {\r\n  <button [ngClass]=\"class\" matButton=\"elevated\" (click)=\"buttonClick.emit()\" [disabled]=\"disable || inProgress\" [color]=\"color\" class=\"button-raised\">\r\n    @if (inProgress || icon) {\r\n      <mat-icon [class.button-spin]=\"inProgress\">{{ inProgress ? 'update' : icon }}</mat-icon>\r\n    }\r\n    <span>{{label}}</span>\r\n  </button>\r\n}\r\n\r\n@if (type === 'stroked') {\r\n  <button [ngClass]=\"class\" matButton=\"outlined\" (click)=\"buttonClick.emit()\" [disabled]=\"disable || inProgress\" [color]=\"color\" class=\"button-stroked\">\r\n    @if (inProgress || icon) {\r\n      <mat-icon [class.button-spin]=\"inProgress\">{{ inProgress ? 'update' : icon }}</mat-icon>\r\n    }\r\n    <span>{{label}}</span>\r\n  </button>\r\n}\r\n\r\n@if (type === 'flat') {\r\n  <button [ngClass]=\"class\" matButton=\"filled\" (click)=\"buttonClick.emit()\" [disabled]=\"disable || inProgress\" [color]=\"color\" class=\"button-flat\">\r\n    @if (inProgress || icon) {\r\n      <mat-icon [class.button-spin]=\"inProgress\">{{ inProgress ? 'update' : icon }}</mat-icon>\r\n    }\r\n    <span>{{label}}</span>\r\n  </button>\r\n}\r\n\r\n@if (type === 'icon') {\r\n  <button [ngClass]=\"class\" matIconButton (click)=\"buttonClick.emit()\" [disabled]=\"disable || inProgress\" [color]=\"color\" class=\"button-icon\">\r\n    @if (inProgress || icon) {\r\n      <mat-icon [class.button-spin]=\"inProgress\">{{ inProgress ? 'update' : icon }}</mat-icon>\r\n    }\r\n  </button>\r\n}\r\n\r\n@if (type === 'fab') {\r\n  <button [ngClass]=\"class\" matFab (click)=\"buttonClick.emit()\" [disabled]=\"disable || inProgress\" [color]=\"color\" class=\"button-icon\">\r\n    @if (inProgress || icon) {\r\n      <mat-icon [class.button-spin]=\"inProgress\">{{ inProgress ? 'update' : icon }}</mat-icon>\r\n    }\r\n    <span>{{label}}</span>\r\n  </button>\r\n}", styles: ["@keyframes spinner{to{transform:rotate(360deg)}}.button-spin{animation:spinner 1s linear infinite}\n"] }]
     }], null, { class: [{
             type: Input
         }], inProgress: [{
@@ -1165,7 +1165,7 @@ class LinkButtonComponent {
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(LinkButtonComponent, [{
         type: Component,
         args: [{ selector: 'cauca-link-button', changeDetection: ChangeDetectionStrategy.OnPush, imports: [ButtonComponent, TranslatePipe], template: "<cauca-button class=\"link-button\" icon=\"link\" type=\"stroked\" color=\"primary\" (buttonClick)=\"copyLink()\" [label]=\"'copyLink'|translate\" />", styles: [".link-button{text-decoration:dashed}\n"] }]
-    }], () => [{ type: i1$5.Clipboard }], null); })();
+    }], () => [{ type: i1$5.Clipboard }], { segments: [{ type: i0.Input, args: [{ isSignal: true, alias: "segments", required: false }] }] }); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(LinkButtonComponent, { className: "LinkButtonComponent", filePath: "lib/components/buttons/link-button/link-button.component.ts", lineNumber: 14 }); })();
 
 function MenuItemComponent_Conditional_1_Template(rf, ctx) { if (rf & 1) {
@@ -1230,7 +1230,7 @@ class MenuItemComponent extends BaseButtonWithLabel {
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(MenuItemComponent, [{
         type: Component,
         args: [{ selector: 'cauca-menu-item', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, imports: [MatMenuItem, TranslateModule, MatIcon, MatMenuTrigger, NgClass], template: "<button (mouseenter)=\"onMouseEnter()\" (mouseleave)=\"onMouseLeave()\" mat-menu-item [ngClass]=\"small() ? 'small-button' : ''\" class=\"change-password-menu-item\" [matMenuTriggerFor]=\"trigger()\" [disabled]=\"buttonDisabled()\" (click)=\"buttonClick.emit()\">\r\n    @if(showIcon() && iconAlignment() === 'left') { <mat-icon [style.color]=\"iconColor()\" [class.button-spin]=\"isInProgress()\">{{iconToShow()}}</mat-icon> }\r\n    @if (translateLabel()) {{{label()|translate}}} @else {{{label()}}}\r\n    @if(showIcon() && iconAlignment() === 'right') { <mat-icon [style.color]=\"iconColor()\" [class.button-spin]=\"isInProgress()\">{{iconToShow()}}</mat-icon> }\r\n</button>\r\n", styles: [".mat-mdc-menu-item .mat-icon-no-color{color:#0000008f}mat-icon{color:inherit}\n"] }]
-    }], null, null); })();
+    }], null, { translateLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "translateLabel", required: false }] }], trigger: [{ type: i0.Input, args: [{ isSignal: true, alias: "trigger", required: false }] }] }); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(MenuItemComponent, { className: "MenuItemComponent", filePath: "lib/components/buttons/menu-item/menu-item.component.ts", lineNumber: 16 }); })();
 
 function RaisedButtonComponent_Conditional_1_Template(rf, ctx) { if (rf & 1) {
@@ -1451,11 +1451,11 @@ class AlertDialogComponent {
             i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(3, 2, ctx.title));
             i0.ɵɵadvance(5);
             i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(8, 4, ctx.message));
-        } }, dependencies: [TranslateModule, RaisedButtonComponent, IconButtonComponent, MatDialogModule, i1$6.MatDialogTitle, i1$6.MatDialogActions, i1$6.MatDialogContent, 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}.alert-dialog-content[_ngcontent-%COMP%]{white-space:pre-wrap}"] }); }
+        } }, dependencies: [TranslateModule, RaisedButtonComponent, IconButtonComponent, MatDialogModule, i1$6.MatDialogTitle, i1$6.MatDialogActions, i1$6.MatDialogContent, 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}.alert-dialog-content[_ngcontent-%COMP%]{white-space:pre-wrap}"] }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(AlertDialogComponent, [{
         type: Component,
-        args: [{ selector: 'cauca-alert-dialog', standalone: true, imports: [TranslateModule, RaisedButtonComponent, IconButtonComponent, MatDialogModule], template: "<div mat-dialog-title>\n  <div class=\"h6\">{{ title | translate }}</div>\n  <cauca-icon-button id=\"closeButton\" (buttonClick)=\"closeClick()\" icon=\"close\" />\n</div>\n<div class=\"alert-dialog-content\" mat-dialog-content>\n  <p>{{ message | translate }}</p>\n</div>\n<mat-dialog-actions align=\"end\">\n  <cauca-raised-button id=\"okButton\" label=\"ok\" color=\"primary\" (buttonClick)=\"closeClick()\" />\n</mat-dialog-actions>", styles: ["@media (max-width: 500px){::ng-deep .dialog-global-style{max-width:100vw!important}}::ng-deep .dialog-global-style{margin:auto!important}:host>div:first-child{display:flex;align-items:center}:host>div:first-child div:first-child{flex:1}.alert-dialog-content{white-space:pre-wrap}\n"] }]
+        args: [{ selector: 'cauca-alert-dialog', standalone: true, imports: [TranslateModule, RaisedButtonComponent, IconButtonComponent, MatDialogModule], template: "<div mat-dialog-title>\r\n  <div class=\"h6\">{{ title | translate }}</div>\r\n  <cauca-icon-button id=\"closeButton\" (buttonClick)=\"closeClick()\" icon=\"close\" />\r\n</div>\r\n<div class=\"alert-dialog-content\" mat-dialog-content>\r\n  <p>{{ message | translate }}</p>\r\n</div>\r\n<mat-dialog-actions align=\"end\">\r\n  <cauca-raised-button id=\"okButton\" label=\"ok\" color=\"primary\" (buttonClick)=\"closeClick()\" />\r\n</mat-dialog-actions>", styles: ["@media(max-width:500px){::ng-deep .dialog-global-style{max-width:100vw!important}}::ng-deep .dialog-global-style{margin:auto!important}:host>div:first-child{display:flex;align-items:center}:host>div:first-child div:first-child{flex:1}.alert-dialog-content{white-space:pre-wrap}\n"] }]
     }], () => [{ type: i1$6.MatDialogRef }, { type: undefined, decorators: [{
                 type: Inject,
                 args: [MAT_DIALOG_DATA]
@@ -1511,11 +1511,11 @@ class ConfirmDialogComponent {
             i0.ɵɵproperty("label", ctx.options.noText)("color", ctx.options.noColor);
             i0.ɵɵadvance();
             i0.ɵɵproperty("label", ctx.options.yesText)("color", ctx.options.yesColor);
-        } }, dependencies: [TranslateModule, MatDialogModule, i1$6.MatDialogTitle, i1$6.MatDialogActions, i1$6.MatDialogContent, RaisedButtonComponent, StrokedButtonComponent, 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}.yes-button[_ngcontent-%COMP%]{padding-left:8px}.message[_ngcontent-%COMP%]{white-space:pre-wrap}.title[_ngcontent-%COMP%]{padding-top:8px}.action-buttons[_ngcontent-%COMP%]{display:flex;align-items:center;flex-direction:row;gap:8px}"] }); }
+        } }, dependencies: [TranslateModule, MatDialogModule, i1$6.MatDialogTitle, i1$6.MatDialogActions, i1$6.MatDialogContent, RaisedButtonComponent, StrokedButtonComponent, 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}.yes-button[_ngcontent-%COMP%]{padding-left:8px}.message[_ngcontent-%COMP%]{white-space:pre-wrap}.title[_ngcontent-%COMP%]{padding-top:8px}.action-buttons[_ngcontent-%COMP%]{display:flex;align-items:center;flex-direction:row;gap:8px}"] }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ConfirmDialogComponent, [{
         type: Component,
-        args: [{ selector: 'cauca-confirm-dialog', standalone: true, imports: [TranslateModule, MatDialogModule, RaisedButtonComponent, StrokedButtonComponent, IconButtonComponent], template: "<div mat-dialog-title>\n    <div class=\"h6 title\">{{ title | translate: options.titleArgs }}</div>\n    <cauca-icon-button id=\"close-button\" (buttonClick)=\"cancelClick()\" icon=\"close\" />\n  </div>\n  <div mat-dialog-content>\n    <p class=\"message\">{{ message | translate: options.messageArgs }}</p>\n  </div>\n  <mat-dialog-actions align=\"end\" class=\"action-buttons\">\n    <cauca-stroked-button class=\"no-button\" [label]=\"options.noText\" [color]=\"options.noColor\" (buttonClick)=\"noClick()\" />\n    <cauca-raised-button class=\"yes-button\" [label]=\"options.yesText\" [color]=\"options.yesColor\" (buttonClick)=\"yesClick()\" />\n  </mat-dialog-actions>", styles: ["@media (max-width: 500px){::ng-deep .dialog-global-style{max-width:100vw!important}}::ng-deep .dialog-global-style{margin:auto!important}:host>div:first-child{display:flex;align-items:center}:host>div:first-child div:first-child{flex:1}.yes-button{padding-left:8px}.message{white-space:pre-wrap}.title{padding-top:8px}.action-buttons{display:flex;align-items:center;flex-direction:row;gap:8px}\n"] }]
+        args: [{ selector: 'cauca-confirm-dialog', standalone: true, imports: [TranslateModule, MatDialogModule, RaisedButtonComponent, StrokedButtonComponent, IconButtonComponent], template: "<div mat-dialog-title>\r\n    <div class=\"h6 title\">{{ title | translate: options.titleArgs }}</div>\r\n    <cauca-icon-button id=\"close-button\" (buttonClick)=\"cancelClick()\" icon=\"close\" />\r\n  </div>\r\n  <div mat-dialog-content>\r\n    <p class=\"message\">{{ message | translate: options.messageArgs }}</p>\r\n  </div>\r\n  <mat-dialog-actions align=\"end\" class=\"action-buttons\">\r\n    <cauca-stroked-button class=\"no-button\" [label]=\"options.noText\" [color]=\"options.noColor\" (buttonClick)=\"noClick()\" />\r\n    <cauca-raised-button class=\"yes-button\" [label]=\"options.yesText\" [color]=\"options.yesColor\" (buttonClick)=\"yesClick()\" />\r\n  </mat-dialog-actions>", styles: ["@media(max-width:500px){::ng-deep .dialog-global-style{max-width:100vw!important}}::ng-deep .dialog-global-style{margin:auto!important}:host>div:first-child{display:flex;align-items:center}:host>div:first-child div:first-child{flex:1}.yes-button{padding-left:8px}.message{white-space:pre-wrap}.title{padding-top:8px}.action-buttons{display:flex;align-items:center;flex-direction:row;gap:8px}\n"] }]
     }], () => [{ type: i1$6.MatDialogRef }, { type: undefined, decorators: [{
                 type: Inject,
                 args: [MAT_DIALOG_DATA]
@@ -1719,11 +1719,11 @@ class DeleteDialogComponent {
             i0.ɵɵconditional(ctx.itemGenderIsFemale ? 1 : 2);
             i0.ɵɵadvance(5);
             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}"] }); }
+        } }, 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, [{
         type: Component,
-        args: [{ selector: 'cauca-delete-dialog', standalone: true, imports: [MatDialogModule, TranslateModule, StrokedButtonComponent, IconButtonComponent, RaisedButtonComponent], template: "<div mat-dialog-title>\n    @if (itemGenderIsFemale)\n    {\n        <div class=\"h6 title\">{{ ('deleteDialog.titleFemale' | translate:{itemType}) }}</div>\n    } @else\n    {\n        <div class=\"h6 title\">{{ ('deleteDialog.titleMale' | translate:{itemType}) }}</div>\n    }\n    <cauca-icon-button id=\"closeButton\" (buttonClick)=\"closeClick()\" icon=\"close\" />\n</div>\n<div mat-dialog-content>\n    <p>{{('deleteDialog.message' | translate:{itemName})}}</p>\n</div>\n<mat-dialog-actions align=\"end\">\n    <cauca-stroked-button id=\"cancelButton\" label=\"cancel\" color=\"primary\" (buttonClick)=\"closeClick()\"/>\n    <cauca-raised-button id=\"deleteButton\" label=\"delete\" color=\"warn\" (buttonClick)=\"deleteClick()\" />\n</mat-dialog-actions>", styles: ["@media (max-width: 500px){::ng-deep .dialog-global-style{max-width:100vw!important}}::ng-deep .dialog-global-style{margin:auto!important}:host>div:first-child{display:flex;align-items:center}:host>div:first-child div:first-child{flex:1}.mat-mdc-dialog-actions{column-gap:8px}\n"] }]
+        args: [{ selector: 'cauca-delete-dialog', standalone: true, imports: [MatDialogModule, TranslateModule, StrokedButtonComponent, IconButtonComponent, RaisedButtonComponent], template: "<div mat-dialog-title>\r\n    @if (itemGenderIsFemale)\r\n    {\r\n        <div class=\"h6 title\">{{ ('deleteDialog.titleFemale' | translate:{itemType}) }}</div>\r\n    } @else\r\n    {\r\n        <div class=\"h6 title\">{{ ('deleteDialog.titleMale' | translate:{itemType}) }}</div>\r\n    }\r\n    <cauca-icon-button id=\"closeButton\" (buttonClick)=\"closeClick()\" icon=\"close\" />\r\n</div>\r\n<div mat-dialog-content>\r\n    <p>{{('deleteDialog.message' | translate:{itemName})}}</p>\r\n</div>\r\n<mat-dialog-actions align=\"end\">\r\n    <cauca-stroked-button id=\"cancelButton\" label=\"cancel\" color=\"primary\" (buttonClick)=\"closeClick()\"/>\r\n    <cauca-raised-button id=\"deleteButton\" label=\"delete\" color=\"warn\" (buttonClick)=\"deleteClick()\" />\r\n</mat-dialog-actions>", styles: ["@media(max-width:500px){::ng-deep .dialog-global-style{max-width:100vw!important}}::ng-deep .dialog-global-style{margin:auto!important}:host>div:first-child{display:flex;align-items:center}:host>div:first-child div:first-child{flex:1}.mat-mdc-dialog-actions{column-gap:8px}\n"] }]
     }], () => [{ type: i1$6.MatDialogRef }, { type: DeleteDialogData, decorators: [{
                 type: Inject,
                 args: [MAT_DIALOG_DATA]
@@ -1764,11 +1764,11 @@ class ErrorDialogComponent {
             i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(3, 2, "errorDialog.titleError"));
             i0.ɵɵadvance(5);
             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}"] }); }
+        } }, 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, [{
         type: Component,
-        args: [{ selector: 'cauca-error-dialog', standalone: true, imports: [MatDialogModule, TranslateModule, RaisedButtonComponent, IconButtonComponent], template: "<div mat-dialog-title>\n    <div class=\"h6\">{{('errorDialog.titleError' | translate)}}</div>\n    <cauca-icon-button id=\"closeButton\" (buttonClick)=\"closeClick()\" icon=\"close\"/>\n</div>\n<div mat-dialog-content>\n    <p>{{('errorDialog.messageError' | translate:{itemName})}}</p>\n</div>\n<mat-dialog-actions align=\"end\">\n    <cauca-raised-button id=\"okButton\" label=\"ok\" color=\"warn\" (buttonClick)=\"closeClick()\"/>\n</mat-dialog-actions>", styles: ["@media (max-width: 500px){::ng-deep .dialog-global-style{max-width:100vw!important}}::ng-deep .dialog-global-style{margin:auto!important}:host>div:first-child{display:flex;align-items:center}:host>div:first-child div:first-child{flex:1}\n"] }]
+        args: [{ selector: 'cauca-error-dialog', standalone: true, imports: [MatDialogModule, TranslateModule, RaisedButtonComponent, IconButtonComponent], template: "<div mat-dialog-title>\r\n    <div class=\"h6\">{{('errorDialog.titleError' | translate)}}</div>\r\n    <cauca-icon-button id=\"closeButton\" (buttonClick)=\"closeClick()\" icon=\"close\"/>\r\n</div>\r\n<div mat-dialog-content>\r\n    <p>{{('errorDialog.messageError' | translate:{itemName})}}</p>\r\n</div>\r\n<mat-dialog-actions align=\"end\">\r\n    <cauca-raised-button id=\"okButton\" label=\"ok\" color=\"warn\" (buttonClick)=\"closeClick()\"/>\r\n</mat-dialog-actions>", styles: ["@media(max-width:500px){::ng-deep .dialog-global-style{max-width:100vw!important}}::ng-deep .dialog-global-style{margin:auto!important}:host>div:first-child{display:flex;align-items:center}:host>div:first-child div:first-child{flex:1}\n"] }]
     }], () => [{ type: i1$6.MatDialogRef }, { type: DeleteDialogData, decorators: [{
                 type: Inject,
                 args: [MAT_DIALOG_DATA]
@@ -1984,7 +1984,7 @@ class SnackBarComponent {
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SnackBarComponent, [{
         type: Component,
         args: [{ selector: 'cauca-snackbar', imports: [MatIcon, StrokedButtonComponent, IconButtonComponent, TranslateModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"container\" [class]=\"appearanceClasses()\">\r\n\r\n    <div class=\"icon-container\">\r\n        <mat-icon>{{icon()}}</mat-icon>\r\n    </div>\r\n\r\n    <div class=\"text-container\">\r\n        <div class=\"title alert-title\">{{caption()|translate}}</div>\r\n        <div class=\"message body2\"><ng-content></ng-content></div>\r\n    </div>\r\n\r\n    @if (showButton()) {<cauca-stroked-button [color]=\"buttonColor()\" [label]=\"buttonLabel()\" (click)=\"buttonClick.emit()\" onkeypress=\"buttonClick.emit()\" [isInProgress]=\"inProgress()\" [icon]=\"buttonIcon()\" />}\r\n\r\n    @if (showCloseButton()) {<cauca-icon-button icon=\"close\" (click)=\"closeClick.emit()\" onkeypress=\"closeClick.emit()\" />}\r\n\r\n</div>", styles: [".info{--darkBackgroundColor: #0288D1;--lightBackgroundColor: #E5F6FD;--lightColor: white;--darkColor: #014361}.warning{--darkBackgroundColor: #ED6C02;--lightBackgroundColor: #FFF4E5;--lightColor: white;--darkColor: #663C00}.success{--darkBackgroundColor: #2E7D32;--lightBackgroundColor: #EDF7ED;--lightColor: white;--darkColor: #1E4620}.error{--darkBackgroundColor: #D32F2F;--lightBackgroundColor: #FDEDED;--lightColor: white;--darkColor: #5F2120}.filled{--textColor: var(--lightColor);--iconColor: var(--lightColor);background-color:var(--darkBackgroundColor)}.standard,.outlined{--textColor: var(--darkColor);--iconColor: var(--darkBackgroundColor)}.container{display:flex;padding:6px 16px;align-items:flex-start;border-radius:4px}.text-container{display:flex;padding:8px 0;flex-direction:column;align-items:flex-start;gap:4px;flex:1 0 0}.icon-container{display:flex;padding:7px 12px 7px 0;align-items:flex-start}.icon-container mat-icon{color:var(--iconColor)}.message,.title{color:var(--textColor)}.standard{background-color:var(--lightBackgroundColor)}.outlined{background-color:transparent;border:1px solid var(--darkBackgroundColor)}.standard .outlined{color:var(--darkColor)}\n"] }]
-    }], null, { closeClick: [{
+    }], null, { icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], caption: [{ type: i0.Input, args: [{ isSignal: true, alias: "caption", required: false }] }], showCloseButton: [{ type: i0.Input, args: [{ isSignal: true, alias: "showCloseButton", required: false }] }], type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], buttonSpecificColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "buttonSpecificColor", required: false }] }], buttonIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "buttonIcon", required: false }] }], inProgress: [{ type: i0.Input, args: [{ isSignal: true, alias: "inProgress", required: false }] }], showButton: [{ type: i0.Input, args: [{ isSignal: true, alias: "showButton", required: false }] }], buttonLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "buttonLabel", required: false }] }], closeClick: [{
             type: Output
         }], buttonClick: [{
             type: Output
@@ -2045,7 +2045,7 @@ class LoadingSpinnerIndicatorComponent {
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(LoadingSpinnerIndicatorComponent, [{
         type: Component,
         args: [{ selector: 'cauca-loading-spinner-indicator', standalone: true, imports: [MatProgressSpinner], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (loadingState.showLoadingIndicator()) {\r\n    <mat-progress-spinner mode=\"indeterminate\"  [diameter]=\"diameter()\" />\r\n}\r\n" }]
-    }], null, null); })();
+    }], null, { diameter: [{ type: i0.Input, args: [{ isSignal: true, alias: "diameter", required: false }] }] }); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(LoadingSpinnerIndicatorComponent, { className: "LoadingSpinnerIndicatorComponent", filePath: "lib/components/misc/loading-spinner-indicator/loading-spinner-indicator.component.ts", lineNumber: 13 }); })();
 
 class BadgeComponent {
@@ -2073,8 +2073,8 @@ class BadgeComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(BadgeComponent, [{
         type: Component,
-        args: [{ selector: 'cauca-badge', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, imports: [TranslateModule, MatChipsModule, MatIcon], template: "<mat-chip highlighted disableRipple [color]=\"color()\">\n    <div class=\"mat-chip-content\">\n        <mat-icon>{{icon()}}</mat-icon>\n        <div class=\"chip-label\">{{label() | translate}}</div>\n    </div>\n</mat-chip>", styles: [".mat-chip-content{display:flex;justify-content:space-between;align-items:center;gap:8px}mat-icon{color:inherit}\n"] }]
-    }], null, null); })();
+        args: [{ selector: 'cauca-badge', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, imports: [TranslateModule, MatChipsModule, MatIcon], template: "<mat-chip highlighted disableRipple [color]=\"color()\">\r\n    <div class=\"mat-chip-content\">\r\n        <mat-icon>{{icon()}}</mat-icon>\r\n        <div class=\"chip-label\">{{label() | translate}}</div>\r\n    </div>\r\n</mat-chip>", styles: [".mat-chip-content{display:flex;justify-content:space-between;align-items:center;gap:8px}mat-icon{color:inherit}\n"] }]
+    }], null, { icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: true }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: true }] }], color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }] }); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(BadgeComponent, { className: "BadgeComponent", filePath: "lib/components/presenters/badge/badge.component.ts", lineNumber: 14 }); })();
 
 function IconComponent_Conditional_0_Template(rf, ctx) { if (rf & 1) {
@@ -2123,17 +2123,17 @@ class IconComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(IconComponent, [{
         type: Component,
-        args: [{ selector: 'cauca-icon', standalone: true, imports: [FontAwesomeModule], template: `
-  @if (isFontAwesome && faIcon && faIcon.length > 0) {
-    <div class="icon">
-      <fa-icon [icon]="faIcon"></fa-icon>
-    </div>
-  }
-  @if (!isFontAwesome && image) {
-    <div class="icon">
-      <img [src]="image" alt="icon" />
-    </div>
-  }
+        args: [{ selector: 'cauca-icon', standalone: true, imports: [FontAwesomeModule], template: `
+  @if (isFontAwesome && faIcon && faIcon.length > 0) {
+    <div class="icon">
+      <fa-icon [icon]="faIcon"></fa-icon>
+    </div>
+  }
+  @if (!isFontAwesome && image) {
+    <div class="icon">
+      <img [src]="image" alt="icon" />
+    </div>
+  }
   `, styles: ["img{max-height:40px;height:40px}fa-icon{max-height:40px;height:40px}\n"] }]
     }], null, { icon: [{
             type: Input
@@ -2255,12 +2255,12 @@ class ListPaginatorComponent {
             i0.ɵɵproperty("isDisabled", ctx.nextDisabled());
             i0.ɵɵadvance();
             i0.ɵɵproperty("isDisabled", ctx.nextDisabled());
-        } }, dependencies: [IconButtonComponent, RoundButtonComponent], styles: ["[_nghost-%COMP%]{display:flex;flex-direction:column;align-items:center}.pages[_ngcontent-%COMP%]{display:flex;padding:0 6px;align-items:flex-start;gap:6px}.page[_ngcontent-%COMP%]{display:flex;width:40px;height:40px;justify-content:center;align-items:center;color:#121014;cursor:pointer}.page[_ngcontent-%COMP%]:hover:not(.disabled){background:#12101405;border-radius:100px}.page[_ngcontent-%COMP%]:active:not(.disabled){background:#1210140f}.selected[_ngcontent-%COMP%]{border-radius:100px;background:#12101414}.disabled[_ngcontent-%COMP%]{color:#12101448;cursor:default}.disabled[_ngcontent-%COMP%]   mat-icon[_ngcontent-%COMP%]{color:#12101448}"], changeDetection: 0 }); }
+        } }, dependencies: [IconButtonComponent, RoundButtonComponent], styles: ["[_nghost-%COMP%]{display:flex;flex-direction:column;align-items:center}.pages[_ngcontent-%COMP%]{display:flex;padding:0 6px;align-items:flex-start;gap:6px}.page[_ngcontent-%COMP%]{display:flex;width:40px;height:40px;justify-content:center;align-items:center;color:#121014;cursor:pointer}.page[_ngcontent-%COMP%]:hover:not(.disabled){background:#12101405;border-radius:100px}.page[_ngcontent-%COMP%]:active:not(.disabled){background:#1210140f}.selected[_ngcontent-%COMP%]{border-radius:100px;background:#12101414}.disabled[_ngcontent-%COMP%]{color:#12101448}.disabled[_ngcontent-%COMP%]   mat-icon[_ngcontent-%COMP%]{color:#12101448}.disabled[_ngcontent-%COMP%]{cursor:default}"], changeDetection: 0 }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ListPaginatorComponent, [{
         type: Component,
-        args: [{ selector: 'cauca-list-paginator', imports: [IconButtonComponent, RoundButtonComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"pages\">\r\n    <cauca-icon-button class=\"page first\" [isDisabled]=\"previousDisabled()\" (buttonClick)=\"tryMoveToFirst()\" icon=\"first_page\" />\r\n    <cauca-icon-button class=\"page previous\" [isDisabled]=\"previousDisabled()\" (buttonClick)=\"tryMoveToPrevious()\" icon=\"chevron_left\" />\r\n\r\n    @for(page of pagesToShow(); track page) {\r\n        @if (page === pageSplitterValue) {\r\n            <div class=\"page\">{{pageSplitter}}\r\n            </div>\r\n        } @else {\r\n            <cauca-round-button class=\"page specific\" [class.selected]=\"page === currentPage()\" (buttonClick)=\"changePage(page)\" [translateLabel]=\"false\" [label]=\"page.toString()\" />\r\n        }\r\n    }\r\n\r\n    <cauca-icon-button class=\"page next\" [isDisabled]=\"nextDisabled()\" (buttonClick)=\"tryMoveToNext()\" icon=\"chevron_right\" />\r\n    <cauca-icon-button class=\"page last\" [isDisabled]=\"nextDisabled()\" (buttonClick)=\"tryMoveToLast()\" icon=\"last_page\" />\r\n</div>", styles: [":host{display:flex;flex-direction:column;align-items:center}.pages{display:flex;padding:0 6px;align-items:flex-start;gap:6px}.page{display:flex;width:40px;height:40px;justify-content:center;align-items:center;color:#121014;cursor:pointer}.page:hover:not(.disabled){background:#12101405;border-radius:100px}.page:active:not(.disabled){background:#1210140f}.selected{border-radius:100px;background:#12101414}.disabled{color:#12101448;cursor:default}.disabled mat-icon{color:#12101448}\n"] }]
-    }], null, { pageChange: [{
+        args: [{ selector: 'cauca-list-paginator', imports: [IconButtonComponent, RoundButtonComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"pages\">\r\n    <cauca-icon-button class=\"page first\" [isDisabled]=\"previousDisabled()\" (buttonClick)=\"tryMoveToFirst()\" icon=\"first_page\" />\r\n    <cauca-icon-button class=\"page previous\" [isDisabled]=\"previousDisabled()\" (buttonClick)=\"tryMoveToPrevious()\" icon=\"chevron_left\" />\r\n\r\n    @for(page of pagesToShow(); track page) {\r\n        @if (page === pageSplitterValue) {\r\n            <div class=\"page\">{{pageSplitter}}\r\n            </div>\r\n        } @else {\r\n            <cauca-round-button class=\"page specific\" [class.selected]=\"page === currentPage()\" (buttonClick)=\"changePage(page)\" [translateLabel]=\"false\" [label]=\"page.toString()\" />\r\n        }\r\n    }\r\n\r\n    <cauca-icon-button class=\"page next\" [isDisabled]=\"nextDisabled()\" (buttonClick)=\"tryMoveToNext()\" icon=\"chevron_right\" />\r\n    <cauca-icon-button class=\"page last\" [isDisabled]=\"nextDisabled()\" (buttonClick)=\"tryMoveToLast()\" icon=\"last_page\" />\r\n</div>", styles: [":host{display:flex;flex-direction:column;align-items:center}.pages{display:flex;padding:0 6px;align-items:flex-start;gap:6px}.page{display:flex;width:40px;height:40px;justify-content:center;align-items:center;color:#121014;cursor:pointer}.page:hover:not(.disabled){background:#12101405;border-radius:100px}.page:active:not(.disabled){background:#1210140f}.selected{border-radius:100px;background:#12101414}.disabled{color:#12101448}.disabled mat-icon{color:#12101448}.disabled{cursor:default}\n"] }]
+    }], null, { itemsCount: [{ type: i0.Input, args: [{ isSignal: true, alias: "itemsCount", required: false }] }], showTotalPage: [{ type: i0.Input, args: [{ isSignal: true, alias: "showTotalPage", required: false }] }], pageSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "pageSize", required: false }] }], pageChange: [{
             type: Output
         }] }); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(ListPaginatorComponent, { className: "ListPaginatorComponent", filePath: "lib/components/list-paginator/list-paginator.component.ts", lineNumber: 12 }); })();
@@ -2304,7 +2304,7 @@ class PasswordCriteriaComponent {
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PasswordCriteriaComponent, [{
         type: Component,
         args: [{ selector: 'cauca-password-criteria', standalone: true, imports: [MatIconModule, TranslateModule, NgClass], template: "@if (condition()) {\r\n<mat-icon [ngClass]=\"disabled() ? 'disabled' : ''\" class=\"green\">check_circle</mat-icon>\r\n}@else {\r\n<mat-icon [ngClass]=\"disabled() ? 'disabled' : ''\" class=\"red\">cancel</mat-icon>\r\n}\r\n<label [ngClass]=\"disabled() ? 'disabled' : ''\" class=\"body2\" translate>{{label()}}</label>", styles: [":host{display:flex;align-items:center;gap:8px}mat-icon{flex-shrink:0}.green{fill:#81c784;color:#81c784}.red{fill:#e57373;color:#e57373}label{color:#000}.disabled{opacity:.5}\n"] }]
-    }], null, null); })();
+    }], null, { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: true }] }], condition: [{ type: i0.Input, args: [{ isSignal: true, alias: "condition", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }] }); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(PasswordCriteriaComponent, { className: "PasswordCriteriaComponent", filePath: "lib/components/inputs/password/password-criteria/password-criteria.component.ts", lineNumber: 13 }); })();
 
 class PasswordCriteriaViewerComponent {
@@ -2330,7 +2330,7 @@ class PasswordCriteriaViewerComponent {
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PasswordCriteriaViewerComponent, [{
         type: Component,
         args: [{ selector: 'cauca-password-criteria-viewer', standalone: true, imports: [PasswordCriteriaComponent], template: "<cauca-password-criteria [disabled]=\"disabled()\" label=\"passwordEdition.minimumCharacters\" [condition]=\"passwordValidation().hasMinimumCharacters\"/>\r\n<cauca-password-criteria [disabled]=\"disabled()\" label=\"passwordEdition.minimumOneNumeric\" [condition]=\"passwordValidation().hasMinimumNumeric\"/>\r\n<cauca-password-criteria [disabled]=\"disabled()\" label=\"passwordEdition.minimumOneSpecialCharacter\" [condition]=\"passwordValidation().hasSpecialCharacter\"/>\r\n<cauca-password-criteria [disabled]=\"disabled()\" label=\"passwordEdition.needLowerAndUppercase\" [condition]=\"passwordValidation().hasLowerAndUppercase\"/>\r\n<cauca-password-criteria [disabled]=\"disabled()\" label=\"passwordEdition.equalPasswords\" [condition]=\"passwordValidation().hasIdenticalPassword\"/>", styles: [":host{display:flex;flex-direction:column}:host>*{flex-grow:1}\n"] }]
-    }], null, null); })();
+    }], null, { passwordValidation: [{ type: i0.Input, args: [{ isSignal: true, alias: "passwordValidation", required: true }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }] }); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(PasswordCriteriaViewerComponent, { className: "PasswordCriteriaViewerComponent", filePath: "lib/components/inputs/password/password-criteria-viewer/password-criteria-viewer.component.ts", lineNumber: 13 }); })();
 
 function PasswordInputComponent_Conditional_1_Template(rf, ctx) { if (rf & 1) {
@@ -2339,18 +2339,18 @@ function PasswordInputComponent_Conditional_1_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵpipe(2, "translate");
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const ctx_r1 = i0.ɵɵnextContext();
+    const ctx_r0 = i0.ɵɵnextContext();
     i0.ɵɵadvance();
-    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(2, 1, ctx_r1.label()));
+    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(2, 1, ctx_r0.label()));
 } }
 function PasswordInputComponent_Conditional_2_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "mat-label");
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const ctx_r1 = i0.ɵɵnextContext();
+    const ctx_r0 = i0.ɵɵnextContext();
     i0.ɵɵadvance();
-    i0.ɵɵtextInterpolate(ctx_r1.label());
+    i0.ɵɵtextInterpolate(ctx_r0.label());
 } }
 class PasswordInputComponent {
     constructor() {
@@ -2397,19 +2397,18 @@ class PasswordInputComponent {
                     useExisting: forwardRef(() => PasswordInputComponent),
                 },
             ])], decls: 8, vars: 10, consts: [["password", ""], ["subscriptSizing", "dynamic"], ["matInput", "", 1, "password", 3, "keydown.enter", "autocomplete", "type", "formControl", "required", "placeholder"], ["matSuffix", "", 2, "cursor", "pointer", 3, "click", "ngClass"]], template: function PasswordInputComponent_Template(rf, ctx) { if (rf & 1) {
-            const _r1 = i0.ɵɵgetCurrentView();
             i0.ɵɵelementStart(0, "mat-form-field", 1);
             i0.ɵɵconditionalCreate(1, PasswordInputComponent_Conditional_1_Template, 3, 3, "mat-label")(2, PasswordInputComponent_Conditional_2_Template, 2, 1, "mat-label");
             i0.ɵɵelementStart(3, "input", 2, 0);
             i0.ɵɵpipe(5, "translate");
-            i0.ɵɵlistener("keydown.enter", function PasswordInputComponent_Template_input_keydown_enter_3_listener() { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.enterKeyDown.emit()); });
+            i0.ɵɵlistener("keydown.enter", function PasswordInputComponent_Template_input_keydown_enter_3_listener() { return ctx.enterKeyDown.emit(); });
             i0.ɵɵelementEnd();
             i0.ɵɵelementStart(6, "mat-icon", 3);
-            i0.ɵɵlistener("click", function PasswordInputComponent_Template_mat_icon_click_6_listener() { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.showPassword.set(!ctx.showPassword())); });
+            i0.ɵɵlistener("click", function PasswordInputComponent_Template_mat_icon_click_6_listener() { return ctx.showPassword.set(!ctx.showPassword()); });
             i0.ɵɵtext(7);
             i0.ɵɵelementEnd()();
         } if (rf & 2) {
-            const password_r3 = i0.ɵɵreference(4);
+            const password_r2 = i0.ɵɵreference(4);
             i0.ɵɵadvance();
             i0.ɵɵconditional(ctx.translateLabel() ? 1 : 2);
             i0.ɵɵadvance(2);
@@ -2417,7 +2416,7 @@ class PasswordInputComponent {
             i0.ɵɵadvance(3);
             i0.ɵɵproperty("ngClass", ctx.disabled() ? "disabled" : "");
             i0.ɵɵadvance();
-            i0.ɵɵtextInterpolate1(" ", password_r3.type === "password" ? "visibility_off" : "visibility", " ");
+            i0.ɵɵtextInterpolate1(" ", password_r2.type === "password" ? "visibility_off" : "visibility", " ");
         } }, dependencies: [TranslateModule, NgClass, MatFormFieldModule, i1$4.MatFormField, i1$4.MatLabel, i1$4.MatSuffix, MatIconModule, i1$1.MatIcon, MatInputModule, i3.MatInput, ReactiveFormsModule, i1$7.DefaultValueAccessor, i1$7.NgControlStatus, i1$7.RequiredValidator, i1$7.FormControlDirective, i1.TranslatePipe], styles: ["[_nghost-%COMP%]{width:100%}mat-form-field[_ngcontent-%COMP%]{width:100%}.disabled[_ngcontent-%COMP%]{opacity:.5}"] }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PasswordInputComponent, [{
@@ -2429,7 +2428,7 @@ class PasswordInputComponent {
                         useExisting: forwardRef(() => PasswordInputComponent),
                     },
                 ], template: "<mat-form-field subscriptSizing=\"dynamic\">\r\n    @if(translateLabel()) {<mat-label>{{label() | translate}}</mat-label>}\r\n    @else {<mat-label>{{label()}}</mat-label>}\r\n    <input (keydown.enter)=\"enterKeyDown.emit()\" [autocomplete]=\"autocomplete()\" #password class=\"password\"\r\n        [type]=\"inputType()\" [formControl]=\"passwordControl\" matInput [required]=\"required()\"\r\n        [placeholder]=\"translatePlaceholder() ? (placeholder() | translate) : placeholder()\" />\r\n    <mat-icon [ngClass]=\"disabled() ? 'disabled' : ''\" style=\"cursor: pointer\" matSuffix\r\n        (click)=\"showPassword.set(!showPassword())\">\r\n        {{ password.type === \"password\" ? \"visibility_off\" : \"visibility\" }}\r\n    </mat-icon>\r\n</mat-form-field>", styles: [":host{width:100%}mat-form-field{width:100%}.disabled{opacity:.5}\n"] }]
-    }], () => [], null); })();
+    }], () => [], { autocomplete: [{ type: i0.Input, args: [{ isSignal: true, alias: "autocomplete", required: false }] }], translateLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "translateLabel", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], translatePlaceholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "translatePlaceholder", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], enterKeyDown: [{ type: i0.Output, args: ["enterKeyDown"] }] }); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(PasswordInputComponent, { className: "PasswordInputComponent", filePath: "lib/components/inputs/password/password-input/password-input.component.ts", lineNumber: 23 }); })();
 
 class PasswordValidation {
@@ -2586,7 +2585,7 @@ class PasswordSelectionComponent {
         }, {
             type: HostBinding,
             args: ['style.form.width']
-        }] }); })();
+        }], showCriteriaOnlyWhenPasswordHasValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "showCriteriaOnlyWhenPasswordHasValue", required: false }] }], alwaysShowCriteria: [{ type: i0.Input, args: [{ isSignal: true, alias: "alwaysShowCriteria", required: false }] }], passwordLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "passwordLabel", required: false }] }], passwordConfirmationLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "passwordConfirmationLabel", required: false }] }], hasValueChange: [{ type: i0.Output, args: ["hasValueChange"] }] }); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(PasswordSelectionComponent, { className: "PasswordSelectionComponent", filePath: "lib/components/inputs/password/password-selection/password-selection.component.ts", lineNumber: 26 }); })();
 
 class DateRangePickerComponent {
@@ -2608,9 +2607,8 @@ class DateRangePickerComponent {
     }
     static { this.ɵfac = function DateRangePickerComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || DateRangePickerComponent)(); }; }
     static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: DateRangePickerComponent, selectors: [["cauca-date-range-picker"]], inputs: { range: [1, "range"] }, outputs: { range: "rangeChange" }, features: [i0.ɵɵProvidersFeature([provideNativeDateAdapter()])], decls: 13, vars: 8, consts: [["campaignOnePicker", ""], ["subscriptSizing", "dynamic", 1, "full-width-field"], ["matPrefix", "", "onkeypress", "clear()", 3, "click"], ["matDatepickerToggleIcon", ""], [3, "formGroup", "rangePicker"], ["matStartDate", "", "formControlName", "from", 3, "readOnly"], ["matEndDate", "", "formControlName", "to", 3, "readOnly"], ["matIconSuffix", "", 3, "for"]], template: function DateRangePickerComponent_Template(rf, ctx) { if (rf & 1) {
-            const _r1 = i0.ɵɵgetCurrentView();
             i0.ɵɵelementStart(0, "mat-form-field", 1)(1, "mat-datepicker-toggle", 2);
-            i0.ɵɵlistener("click", function DateRangePickerComponent_Template_mat_datepicker_toggle_click_1_listener() { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.clear()); });
+            i0.ɵɵlistener("click", function DateRangePickerComponent_Template_mat_datepicker_toggle_click_1_listener() { return ctx.clear(); });
             i0.ɵɵelementStart(2, "mat-icon", 3);
             i0.ɵɵtext(3, "clear");
             i0.ɵɵelementEnd()();
@@ -2624,23 +2622,23 @@ class DateRangePickerComponent {
             i0.ɵɵelement(10, "mat-datepicker-toggle", 7)(11, "mat-date-range-picker", null, 0);
             i0.ɵɵelementEnd();
         } if (rf & 2) {
-            const campaignOnePicker_r2 = i0.ɵɵreference(12);
+            const campaignOnePicker_r1 = i0.ɵɵreference(12);
             i0.ɵɵadvance(5);
             i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(6, 6, "dateRangeSelectorLabel"));
             i0.ɵɵadvance(2);
-            i0.ɵɵproperty("formGroup", ctx.form)("rangePicker", campaignOnePicker_r2);
+            i0.ɵɵproperty("formGroup", ctx.form)("rangePicker", campaignOnePicker_r1);
             i0.ɵɵadvance();
             i0.ɵɵproperty("readOnly", true);
             i0.ɵɵadvance();
             i0.ɵɵproperty("readOnly", true);
             i0.ɵɵadvance();
-            i0.ɵɵproperty("for", campaignOnePicker_r2);
+            i0.ɵɵproperty("for", campaignOnePicker_r1);
         } }, dependencies: [MatFormFieldModule, i1$4.MatFormField, i1$4.MatLabel, i1$4.MatPrefix, i1$4.MatSuffix, MatDatepickerModule, i2$1.MatDatepickerToggle, i2$1.MatDatepickerToggleIcon, i2$1.MatDateRangeInput, i2$1.MatStartDate, i2$1.MatEndDate, i2$1.MatDateRangePicker, ReactiveFormsModule, i1$7.DefaultValueAccessor, i1$7.NgControlStatus, i1$7.NgControlStatusGroup, i1$7.FormGroupDirective, i1$7.FormControlName, MatIcon, TranslateModule, i1.TranslatePipe], encapsulation: 2, changeDetection: 0 }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DateRangePickerComponent, [{
         type: Component,
         args: [{ selector: 'cauca-date-range-picker', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, imports: [MatFormFieldModule, MatDatepickerModule, ReactiveFormsModule, MatIcon, TranslateModule], providers: [provideNativeDateAdapter()], template: "<mat-form-field class=\"full-width-field\" subscriptSizing=\"dynamic\">\r\n  <mat-datepicker-toggle matPrefix (click)=\"clear()\" onkeypress=\"clear()\">\r\n    <mat-icon matDatepickerToggleIcon>clear</mat-icon>\r\n  </mat-datepicker-toggle>\r\n    <mat-label>{{'dateRangeSelectorLabel'|translate}}</mat-label>\r\n    <mat-date-range-input [formGroup]=\"form\" [rangePicker]=\"campaignOnePicker\">\r\n      <input matStartDate formControlName=\"from\" [readOnly]=\"true\">\r\n      <input matEndDate formControlName=\"to\" [readOnly]=\"true\">\r\n    </mat-date-range-input>\r\n    <mat-datepicker-toggle matIconSuffix [for]=\"campaignOnePicker\">\r\n    </mat-datepicker-toggle>\r\n    <mat-date-range-picker #campaignOnePicker></mat-date-range-picker>\r\n  </mat-form-field>" }]
-    }], () => [], null); })();
+    }], () => [], { range: [{ type: i0.Input, args: [{ isSignal: true, alias: "range", required: false }] }, { type: i0.Output, args: ["rangeChange"] }] }); })();
 (() => { (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$8 = ["auto"];
@@ -2874,9 +2872,7 @@ 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$8, 5);
-            i0.ɵɵviewQuery(_c1$2, 5);
-            i0.ɵɵviewQuery(MatAutocompleteTrigger, 5);
+            i0.ɵɵviewQuery(_c0$8, 5)(_c1$2, 5)(MatAutocompleteTrigger, 5);
         } if (rf & 2) {
             let _t;
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.matAutocomplete = _t.first);
@@ -2900,7 +2896,7 @@ class DropdownChipAutocompleteComponent {
             i0.ɵɵtext(10, "arrow_drop_down");
             i0.ɵɵelementEnd()()();
             i0.ɵɵelementStart(11, "mat-autocomplete", 10, 2);
-            i0.ɵɵlistener("optionSelected", function DropdownChipAutocompleteComponent_Template_mat_autocomplete_optionSelected_11_listener($event) { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.selectItemOnAutocomplete($event)); });
+            i0.ɵɵlistener("optionSelected", function DropdownChipAutocompleteComponent_Template_mat_autocomplete_optionSelected_11_listener($event) { return ctx.selectItemOnAutocomplete($event); });
             i0.ɵɵrepeaterCreate(13, DropdownChipAutocompleteComponent_For_14_Template, 3, 2, "mat-option", 11, i0.ɵɵrepeaterTrackByIdentity);
             i0.ɵɵpipe(15, "async");
             i0.ɵɵelementEnd()();
@@ -2941,7 +2937,7 @@ class DropdownChipAutocompleteComponent {
                     MatChipInput,
                     MatIcon,
                     CommonModule
-                ], template: "<div role=\"group\" class=\"dropdown-chip-autocomplete-container\">\n\n  <mat-chip-grid #chipGrid [disabled]=\"disabled\">\n\n    @for (key of value; track key) {\n      <mat-chip highlighted [disabled]=\"disabled\" (removed)=\"removeSelectedItem(key)\" color=\"primary\">\n        {{getValueDisplay(key)}}\n        @if (allowRemove) {\n          <mat-icon matChipRemove>cancel</mat-icon>\n        }\n      </mat-chip>\n    }\n\n    <div class=\"input-wrapper\">\n      <input\n        #chipInput\n        [(ngModel)]=\"searchValue\"\n        [matAutocomplete]=\"auto\"\n        [matChipInputFor]=\"chipGrid\"\n        [matChipInputSeparatorKeyCodes]=\"separatorKeysCodes\">\n      @if (value.length > 0 && canRemoveAll()) {\n        <mat-icon matPrefix class=\"clearAll\" (click)=\"onClearAll();\">clear</mat-icon>\n      }\n      <mat-icon matSuffix>arrow_drop_down</mat-icon>\n    </div>\n  </mat-chip-grid>\n\n  <mat-autocomplete #auto=\"matAutocomplete\" panelWidth=\"500px\" [class.full-width-field]=\"optionTemplate\" (optionSelected)=\"selectItemOnAutocomplete($event)\">\n    @for (item of filteredListAutoComplete | async; track item) {\n      <mat-option [value]=\"item[keyValue]\" class=\"full-width-option\">\n        @if (optionTemplate) {\n          <ng-container *ngTemplateOutlet=\"optionTemplate; context: {data: item}\" />\n        } @else {\n          {{item[displayValue]}}\n        }\n      </mat-option>\n    }\n  </mat-autocomplete>\n</div>\n\n", styles: ["span{opacity:0;transition:opacity .2s}:host.floating span{opacity:1}:host{cursor:pointer}:host mat-icon{align-self:center;color:var(--mat-select-enabled-arrow-color)}:host input.mat-mdc-chip-input{flex:1}.input-wrapper{flex:1;display:flex;flex-direction:row;gap:8px;align-items:center;flex-wrap:nowrap}.input-wrapper>input{flex:1;min-width:150px}.input-wrapper>mat-icon{flex-shrink:0}\n"] }]
+                ], template: "<div role=\"group\" class=\"dropdown-chip-autocomplete-container\">\r\n\r\n  <mat-chip-grid #chipGrid [disabled]=\"disabled\">\r\n\r\n    @for (key of value; track key) {\r\n      <mat-chip highlighted [disabled]=\"disabled\" (removed)=\"removeSelectedItem(key)\" color=\"primary\">\r\n        {{getValueDisplay(key)}}\r\n        @if (allowRemove) {\r\n          <mat-icon matChipRemove>cancel</mat-icon>\r\n        }\r\n      </mat-chip>\r\n    }\r\n\r\n    <div class=\"input-wrapper\">\r\n      <input\r\n        #chipInput\r\n        [(ngModel)]=\"searchValue\"\r\n        [matAutocomplete]=\"auto\"\r\n        [matChipInputFor]=\"chipGrid\"\r\n        [matChipInputSeparatorKeyCodes]=\"separatorKeysCodes\">\r\n      @if (value.length > 0 && canRemoveAll()) {\r\n        <mat-icon matPrefix class=\"clearAll\" (click)=\"onClearAll();\">clear</mat-icon>\r\n      }\r\n      <mat-icon matSuffix>arrow_drop_down</mat-icon>\r\n    </div>\r\n  </mat-chip-grid>\r\n\r\n  <mat-autocomplete #auto=\"matAutocomplete\" panelWidth=\"500px\" [class.full-width-field]=\"optionTemplate\" (optionSelected)=\"selectItemOnAutocomplete($event)\">\r\n    @for (item of filteredListAutoComplete | async; track item) {\r\n      <mat-option [value]=\"item[keyValue]\" class=\"full-width-option\">\r\n        @if (optionTemplate) {\r\n          <ng-container *ngTemplateOutlet=\"optionTemplate; context: {data: item}\" />\r\n        } @else {\r\n          {{item[displayValue]}}\r\n        }\r\n      </mat-option>\r\n    }\r\n  </mat-autocomplete>\r\n</div>\r\n\r\n", styles: ["span{opacity:0;transition:opacity .2s}:host.floating span{opacity:1}:host{cursor:pointer}:host mat-icon{align-self:center;color:var(--mat-select-enabled-arrow-color)}:host input.mat-mdc-chip-input{flex:1}.input-wrapper{flex:1;display:flex;flex-direction:row;gap:8px;align-items:center;flex-wrap:nowrap}.input-wrapper>input{flex:1;min-width:150px}.input-wrapper>mat-icon{flex-shrink:0}\n"] }]
     }], () => [{ type: i1$7.NgControl, decorators: [{
                 type: Optional
             }, {
@@ -2974,7 +2970,7 @@ class DropdownChipAutocompleteComponent {
             type: Input
         }], ariaDescribedBy: [{
             type: Input
-        }], optionTemplate: [{
+        }], canRemoveAll: [{ type: i0.Input, args: [{ isSignal: true, alias: "canRemoveAll", required: false }] }], hasOptionTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "hasOptionTemplate", required: false }] }], optionTemplate: [{
             type: ContentChild,
             args: [TemplateRef]
         }], shouldLabelFloat: [{
@@ -3135,10 +3131,8 @@ class SelectWithSearchComponent {
         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.filteredOptions = resource({ ...(ngDevMode ? { debugName: "filteredOptions" } : {}), 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: '' });
@@ -3233,7 +3227,7 @@ class SelectWithSearchComponent {
 }
 (() => { (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>" }]
+        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\">\r\n  <ng-content></ng-content>\r\n  <mat-label>{{ label | translate }}</mat-label>\r\n  <mat-select [(value)]=\"value\" [disabled]=\"disableControl()\" [class.readonly-field]=\"disableControl()\" [multiple]=\"allowMultiSelection()\" >\r\n    @if (enableSearch()) {\r\n      <mat-option>\r\n        <ngx-mat-select-search [formControl]=\"optionFilterControl\" [placeholderLabel]=\"'search' | translate\"\r\n          [noEntriesFoundLabel]=\"'noResult' | translate\">\r\n        </ngx-mat-select-search>\r\n      </mat-option>\r\n    }\r\n    @for (option of filteredOptions.value() || []; track option) {\r\n      <mat-option [value]=\"option.id\">\r\n        {{option.name}}\r\n      </mat-option>\r\n    }\r\n  </mat-select>\r\n\r\n</mat-form-field>" }]
     }], null, { label: [{
             type: Input,
             args: [{ required: true }]
@@ -3242,7 +3236,7 @@ class SelectWithSearchComponent {
         }], singleSelect: [{
             type: ViewChild,
             args: ['singleSelect', { static: true }]
-        }], valueChanged: [{
+        }], isDisabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "isDisabled", required: false }] }], allowMultiSelection: [{ type: i0.Input, args: [{ isSignal: true, alias: "allowMultiSelection", required: false }] }], showClearOption: [{ type: i0.Input, args: [{ isSignal: true, alias: "showClearOption", required: false }] }], enableSearch: [{ type: i0.Input, args: [{ isSignal: true, alias: "enableSearch", required: false }] }], valueChanged: [{
             type: Output
         }], options: [{
             type: Input
@@ -3274,7 +3268,7 @@ class GroupContainerComponent {
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(GroupContainerComponent, [{
         type: Component,
         args: [{ selector: 'cauca-group-container', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, imports: [TranslateModule], template: "<div class=\"group-container\">\r\n    <div class=\"group-container-title subtitle1\">{{caption()|translate}}</div>\r\n    <div class=\"group-container-content\">\r\n        <ng-content />\r\n    </div>\r\n</div>\r\n", styles: [".group-container{display:flex;align-items:flex-start;align-self:stretch}.group-container-title{display:flex;width:300px;max-width:300px;padding:16px 0;flex-direction:column;align-items:flex-start}.group-container-content{display:flex;flex-direction:column;align-items:stretch;flex:1;padding:16px}\n"] }]
-    }], null, null); })();
+    }], null, { caption: [{ type: i0.Input, args: [{ isSignal: true, alias: "caption", required: false }] }] }); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(GroupContainerComponent, { className: "GroupContainerComponent", filePath: "lib/components/layout/group-container/group-container.component.ts", lineNumber: 12 }); })();
 
 const _c0$5 = ["*"];
@@ -3308,7 +3302,7 @@ class MainSectionComponent {
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(MainSectionComponent, [{
         type: Component,
         args: [{ selector: 'cauca-main-section', imports: [TranslateModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"section\">\r\n    @if (title()) {\r\n        <div class=\"section-description subtitle1\">{{title()|translate}}</div>\r\n    }\r\n    <div class=\"section-fields\"><ng-content /></div>\r\n</div>", styles: [".section{display:flex;padding:24px 16px;flex-direction:column;justify-content:center;align-items:flex-start;flex:1 0 0;max-width:1200px}.section-description{display:flex;flex-direction:column;align-items:flex-start;flex:1 0 0;padding-bottom:24px}.section-fields{display:flex;align-items:flex-start;gap:8px;align-self:stretch}.section-fields>*{flex:1 0 0}\n"] }]
-    }], null, null); })();
+    }], null, { title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }] }); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(MainSectionComponent, { className: "MainSectionComponent", filePath: "lib/components/layout/sections/main-section/main-section.component.ts", lineNumber: 11 }); })();
 
 const _c0$4 = ["*"];
@@ -3329,7 +3323,7 @@ class SectionColumnComponent {
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SectionColumnComponent, [{
         type: Component,
         args: [{ selector: 'cauca-section-column', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"section-columns\" [class.big-gap]=\"showBigGap()\">\r\n    <ng-content></ng-content>\r\n</div>", styles: [":host{flex:1 0 0;display:flex;flex-direction:column;align-items:stretch}.section-columns{display:flex;flex-direction:column;align-items:flex-start;gap:8px;flex:1 0 0}.big-gap{gap:16px}\n"] }]
-    }], null, null); })();
+    }], null, { showBigGap: [{ type: i0.Input, args: [{ isSignal: true, alias: "showBigGap", required: false }] }] }); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SectionColumnComponent, { className: "SectionColumnComponent", filePath: "lib/components/layout/sections/section-column/section-column.component.ts", lineNumber: 10 }); })();
 
 function SectionFieldComponent_Conditional_2_Template(rf, ctx) { if (rf & 1) {
@@ -3413,23 +3407,20 @@ class SectionFieldComponent {
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SectionFieldComponent, [{
         type: Component,
         args: [{ selector: 'cauca-section-field', imports: [TranslateModule, MatIcon], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"section-fields-line\" [class.multi-line]=\"useMultipleValues()\">\r\n    <div class=\"option-label body1\" [class.link]=\"showLink()\">\r\n        @if(autoTranslateLabel()) {\r\n            {{label()|translate}}\r\n        } @else {\r\n            {{label()}}\r\n        }\r\n        @if (showLink()) {\r\n            <mat-icon class=\"icon-link\" (click)=\"linkClick.emit()\" onkeypress=\"linkClick.emit()\">link</mat-icon>\r\n        }:\r\n    </div>\r\n    <div class=\"option-value body2\" [class.no-flex]=\"!splitEqually()\">\r\n        @if (useMultipleValues()) {\r\n            @for(item of values(); track item) {\r\n                <span>{{fieldName() ? item[fieldName()] : item }}</span>\r\n            }\r\n        } @else {\r\n            {{value()}}\r\n        }\r\n    </div>\r\n</div>", styles: [":host{flex:1 0 0;display:flex;flex-direction:column;align-items:stretch;width:100%}.section-fields-line{display:flex;align-items:center;gap:8px;align-self:stretch;white-space:nowrap}.section-fields-line>*{flex:1 0 0}.option-value{display:flex;flex-direction:column;align-items:flex-start;gap:8px;flex:1 0 0;white-space:wrap;word-break:break-all}.option-value.no-flex{flex:unset}.multi-line{align-items:flex-start}.icon-link{cursor:pointer}.link{display:flex}\n"] }]
-    }], null, null); })();
+    }], null, { autoTranslateLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoTranslateLabel", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], values: [{ type: i0.Input, args: [{ isSignal: true, alias: "values", required: false }] }], fieldName: [{ type: i0.Input, args: [{ isSignal: true, alias: "fieldName", required: false }] }], showLink: [{ type: i0.Input, args: [{ isSignal: true, alias: "showLink", required: false }] }], linkClick: [{ type: i0.Output, args: ["linkClick"] }], splitEqually: [{ type: i0.Input, args: [{ isSignal: true, alias: "splitEqually", required: false }] }] }); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SectionFieldComponent, { className: "SectionFieldComponent", filePath: "lib/components/layout/sections/section-field/section-field.component.ts", lineNumber: 12 }); })();
 
 function PageTitleComponent_Conditional_4_Conditional_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 4);
+    i0.ɵɵelementStart(0, "div", 3);
     i0.ɵɵtext(1);
     i0.ɵɵpipe(2, "translate");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(3, "span");
-    i0.ɵɵtext(4, "/");
-    i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext(2);
     i0.ɵɵadvance();
     i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(2, 1, ctx_r0.baseCrumb()));
 } }
-function PageTitleComponent_Conditional_4_For_3_Conditional_0_Template(rf, ctx) { if (rf & 1) {
+function PageTitleComponent_Conditional_4_For_3_Conditional_2_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "a", 5);
     i0.ɵɵtext(1);
     i0.ɵɵpipe(2, "translate");
@@ -3440,10 +3431,10 @@ function PageTitleComponent_Conditional_4_For_3_Conditional_0_Template(rf, ctx)
     i0.ɵɵadvance();
     i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(2, 3, location_r2.title));
 } }
-function PageTitleComponent_Conditional_4_For_3_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+function PageTitleComponent_Conditional_4_For_3_Conditional_3_Template(rf, ctx) { if (rf & 1) {
     const _r3 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "span", 7);
-    i0.ɵɵlistener("click", function PageTitleComponent_Conditional_4_For_3_Conditional_1_Template_span_click_0_listener() { i0.ɵɵrestoreView(_r3); const location_r2 = i0.ɵɵnextContext().$implicit; return i0.ɵɵresetView(location_r2.action()); });
+    i0.ɵɵlistener("click", function PageTitleComponent_Conditional_4_For_3_Conditional_3_Template_span_click_0_listener() { i0.ɵɵrestoreView(_r3); const location_r2 = i0.ɵɵnextContext().$implicit; return i0.ɵɵresetView(location_r2.action()); });
     i0.ɵɵtext(1);
     i0.ɵɵpipe(2, "translate");
     i0.ɵɵelementEnd();
@@ -3452,8 +3443,8 @@ function PageTitleComponent_Conditional_4_For_3_Conditional_1_Template(rf, ctx)
     i0.ɵɵadvance();
     i0.ɵɵtextInterpolate(location_r2.translate ? i0.ɵɵpipeBind1(2, 1, location_r2.title) : location_r2.title);
 } }
-function PageTitleComponent_Conditional_4_For_3_Conditional_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 4);
+function PageTitleComponent_Conditional_4_For_3_Conditional_4_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 3);
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -3462,19 +3453,20 @@ function PageTitleComponent_Conditional_4_For_3_Conditional_2_Template(rf, ctx)
     i0.ɵɵtextInterpolate(location_r2.title);
 } }
 function PageTitleComponent_Conditional_4_For_3_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵconditionalCreate(0, PageTitleComponent_Conditional_4_For_3_Conditional_0_Template, 3, 5, "a", 5)(1, PageTitleComponent_Conditional_4_For_3_Conditional_1_Template, 3, 3, "span", 6)(2, PageTitleComponent_Conditional_4_For_3_Conditional_2_Template, 2, 1, "span", 4);
-    i0.ɵɵelementStart(3, "span");
-    i0.ɵɵtext(4, "/");
+    i0.ɵɵelementStart(0, "span");
+    i0.ɵɵtext(1, "/");
     i0.ɵɵelementEnd();
+    i0.ɵɵconditionalCreate(2, PageTitleComponent_Conditional_4_For_3_Conditional_2_Template, 3, 5, "a", 5)(3, PageTitleComponent_Conditional_4_For_3_Conditional_3_Template, 3, 3, "span", 6)(4, PageTitleComponent_Conditional_4_For_3_Conditional_4_Template, 2, 1, "span", 3);
 } if (rf & 2) {
     const location_r2 = ctx.$implicit;
-    i0.ɵɵconditional(location_r2.link ? 0 : location_r2.action ? 1 : 2);
+    i0.ɵɵadvance(2);
+    i0.ɵɵconditional(location_r2.link ? 2 : location_r2.action ? 3 : 4);
 } }
 function PageTitleComponent_Conditional_4_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "div", 2);
-    i0.ɵɵconditionalCreate(1, PageTitleComponent_Conditional_4_Conditional_1_Template, 5, 3);
+    i0.ɵɵconditionalCreate(1, PageTitleComponent_Conditional_4_Conditional_1_Template, 3, 3, "div", 3);
     i0.ɵɵrepeaterCreate(2, PageTitleComponent_Conditional_4_For_3_Template, 5, 1, null, null, i0.ɵɵrepeaterTrackByIdentity);
-    i0.ɵɵelementStart(4, "span", 3);
+    i0.ɵɵelementStart(4, "span", 4);
     i0.ɵɵtext(5);
     i0.ɵɵpipe(6, "translate");
     i0.ɵɵelementEnd()();
@@ -3502,7 +3494,7 @@ class PageTitleComponent {
         this.breadcrumbService = inject(BreadcrumbService, { optional: true });
     }
     static { this.ɵfac = function PageTitleComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || PageTitleComponent)(); }; }
-    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: PageTitleComponent, selectors: [["cauca-page-title"]], inputs: { caption: [1, "caption"], showBreadcrumb: [1, "showBreadcrumb"], location: [1, "location"], breadcrumb: [1, "breadcrumb"], baseCrumb: [1, "baseCrumb"], translateBreadcrumb: [1, "translateBreadcrumb"] }, decls: 5, vars: 4, consts: [[1, "title-section"], [1, "title-label"], [1, "breadcrumb"], [1, "breadcrumb-current"], [1, "basecrumb"], [1, "basecrumb", 3, "href", "routerLink"], [1, "basecrumb", "crumb-link"], [1, "basecrumb", "crumb-link", 3, "click"]], template: function PageTitleComponent_Template(rf, ctx) { if (rf & 1) {
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: PageTitleComponent, selectors: [["cauca-page-title"]], inputs: { caption: [1, "caption"], showBreadcrumb: [1, "showBreadcrumb"], location: [1, "location"], breadcrumb: [1, "breadcrumb"], baseCrumb: [1, "baseCrumb"], translateBreadcrumb: [1, "translateBreadcrumb"] }, decls: 5, vars: 4, consts: [[1, "title-section"], [1, "title-label"], [1, "breadcrumb"], [1, "basecrumb"], [1, "breadcrumb-current"], [1, "basecrumb", 3, "href", "routerLink"], [1, "basecrumb", "crumb-link"], [1, "basecrumb", "crumb-link", 3, "click"]], template: function PageTitleComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "div", 0)(1, "h4", 1);
             i0.ɵɵtext(2);
             i0.ɵɵpipe(3, "translate");
@@ -3514,12 +3506,12 @@ class PageTitleComponent {
             i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(3, 2, ctx.caption()));
             i0.ɵɵadvance(2);
             i0.ɵɵconditional(ctx.displayBreadcrumb() ? 4 : -1);
-        } }, dependencies: [TranslateModule, RouterModule, i1$a.RouterLink, i1.TranslatePipe], styles: [".title-section[_ngcontent-%COMP%]{display:flex;gap:8px;flex-direction:column;align-items:flex-start;align-self:stretch;margin-bottom:24px}.breadcrumb[_ngcontent-%COMP%]{display:flex;align-items:center;gap:8px}h4[_ngcontent-%COMP%]{padding:0}a[_ngcontent-%COMP%]{text-decoration:none}a[_ngcontent-%COMP%]:visited{color:inherit}.basecrumb[_ngcontent-%COMP%]{color:#12101499}.crumb-link[_ngcontent-%COMP%]{cursor:pointer}@media (max-width: 500px){.title-section[_ngcontent-%COMP%]{padding:16px}}"] }); }
+        } }, dependencies: [TranslateModule, RouterModule, i1$a.RouterLink, i1.TranslatePipe], styles: [".title-section[_ngcontent-%COMP%]{display:flex;gap:8px;flex-direction:column;align-items:flex-start;align-self:stretch;margin-bottom:24px}.breadcrumb[_ngcontent-%COMP%]{display:flex;align-items:center;gap:8px}h4[_ngcontent-%COMP%]{padding:0}a[_ngcontent-%COMP%]{text-decoration:none}a[_ngcontent-%COMP%]:visited{color:inherit}.basecrumb[_ngcontent-%COMP%]{color:#12101499}.crumb-link[_ngcontent-%COMP%]{cursor:pointer}@media(max-width:500px){.title-section[_ngcontent-%COMP%]{padding:16px}}"] }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PageTitleComponent, [{
         type: Component,
-        args: [{ selector: 'cauca-page-title', imports: [TranslateModule, RouterModule], template: "<div class=\"title-section\">\n\n  <h4 class=\"title-label\">{{caption() | translate }}</h4>\n\n  @if (displayBreadcrumb()) {\n    <div class=\"breadcrumb\">\n\n      @if (baseCrumb()) {\n        <div class=\"basecrumb\">{{baseCrumb()|translate}}</div>\n        <span>/</span>\n      }\n\n      @for(location of breadcrumbLocation(); track location) {\n        @if (location.link) {\n          <a class=\"basecrumb\" [href]=\"location.link\" [routerLink]=\"location.link\">{{location.title| translate }}</a>\n        } @else if (location.action) {\n          <span class=\"basecrumb crumb-link\" (click)=\"location.action()\">{{ location.translate ? (location.title | translate) : location.title}}</span>\n        } @else {\n          <span class=\"basecrumb\">{{location.title}}</span>\n        }\n        <span>/</span>\n      }\n\n      <span class=\"breadcrumb-current\">{{ mustTranslateBreadcrumb() ? (currentBreadcrumb() | translate) : currentBreadcrumb() }}</span>\n\n    </div>\n  }\n\n</div>", styles: [".title-section{display:flex;gap:8px;flex-direction:column;align-items:flex-start;align-self:stretch;margin-bottom:24px}.breadcrumb{display:flex;align-items:center;gap:8px}h4{padding:0}a{text-decoration:none}a:visited{color:inherit}.basecrumb{color:#12101499}.crumb-link{cursor:pointer}@media (max-width: 500px){.title-section{padding:16px}}\n"] }]
-    }], null, null); })();
+        args: [{ selector: 'cauca-page-title', imports: [TranslateModule, RouterModule], template: "<div class=\"title-section\">\r\n\r\n  <h4 class=\"title-label\">{{caption() | translate }}</h4>\r\n\r\n  @if (displayBreadcrumb()) {\r\n    <div class=\"breadcrumb\">\r\n\r\n      @if (baseCrumb()) {\r\n        <div class=\"basecrumb\">{{baseCrumb()|translate}}</div>\r\n\r\n      }\r\n\r\n      @for(location of breadcrumbLocation(); track location) {\r\n        <span>/</span>\r\n        @if (location.link) {\r\n          <a class=\"basecrumb\" [href]=\"location.link\" [routerLink]=\"location.link\">{{location.title| translate }}</a>\r\n        } @else if (location.action) {\r\n          <span class=\"basecrumb crumb-link\" (click)=\"location.action()\">{{ location.translate ? (location.title | translate) : location.title}}</span>\r\n        } @else {\r\n          <span class=\"basecrumb\">{{location.title}}</span>\r\n        }\r\n      }\r\n\r\n      <span class=\"breadcrumb-current\">{{ mustTranslateBreadcrumb() ? (currentBreadcrumb() | translate) : currentBreadcrumb() }}</span>\r\n\r\n    </div>\r\n  }\r\n\r\n</div>", styles: [".title-section{display:flex;gap:8px;flex-direction:column;align-items:flex-start;align-self:stretch;margin-bottom:24px}.breadcrumb{display:flex;align-items:center;gap:8px}h4{padding:0}a{text-decoration:none}a:visited{color:inherit}.basecrumb{color:#12101499}.crumb-link{cursor:pointer}@media(max-width:500px){.title-section{padding:16px}}\n"] }]
+    }], null, { caption: [{ type: i0.Input, args: [{ isSignal: true, alias: "caption", required: false }] }], showBreadcrumb: [{ type: i0.Input, args: [{ isSignal: true, alias: "showBreadcrumb", required: false }] }], location: [{ type: i0.Input, args: [{ isSignal: true, alias: "location", required: false }] }], breadcrumb: [{ type: i0.Input, args: [{ isSignal: true, alias: "breadcrumb", required: false }] }], baseCrumb: [{ type: i0.Input, args: [{ isSignal: true, alias: "baseCrumb", required: false }] }], translateBreadcrumb: [{ type: i0.Input, args: [{ isSignal: true, alias: "translateBreadcrumb", required: false }] }] }); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(PageTitleComponent, { className: "PageTitleComponent", filePath: "lib/components/layout/page-title/page-title.component.ts", lineNumber: 13 }); })();
 
 const _c0$3 = ["*"];
@@ -3563,7 +3555,7 @@ class ExpandablePanelComponent {
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ExpandablePanelComponent, [{
         type: Component,
         args: [{ selector: 'cauca-expandable-panel', changeDetection: ChangeDetectionStrategy.OnPush, imports: [MatIcon], template: "<section>\r\n    <div class=\"expansion-button\" (click)=\"changeState()\">\r\n        <mat-icon [class.collapsed]=\"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\" [class.collapsed]=\"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-button mat-icon{transition:transform .5s ease-in-out}.expansion-button mat-icon.collapsed{transform:rotate(180deg)}.expansion-panel{overflow:hidden;flex:1;display:grid;grid-template-rows:1fr;transition:grid-template-rows .5s ease-in,opacity .5s ease-in,visibility .5s ease-in}.expansion-panel.collapsed{grid-template-rows:0fr;opacity:0;visibility:hidden}\n"] }]
-    }], null, null); })();
+    }], null, { isCollapsed: [{ type: i0.Input, args: [{ isSignal: true, alias: "isCollapsed", required: false }] }, { type: i0.Output, args: ["isCollapsedChange"] }], caption: [{ type: i0.Input, args: [{ isSignal: true, alias: "caption", required: false }] }], subCaption: [{ type: i0.Input, args: [{ isSignal: true, alias: "subCaption", required: false }] }] }); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(ExpandablePanelComponent, { className: "ExpandablePanelComponent", filePath: "lib/components/layout/expandable-panel/expandable-panel.component.ts", lineNumber: 11 }); })();
 
 class MenuExpandablePanelItemComponent {
@@ -3607,7 +3599,7 @@ class MenuExpandablePanelItemComponent {
 (() => { (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); })();
+    }], null, { icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], caption: [{ type: i0.Input, args: [{ isSignal: true, alias: "caption", required: false }] }], route: [{ type: i0.Input, args: [{ isSignal: true, alias: "route", required: false }] }], isSubItem: [{ type: i0.Input, args: [{ isSignal: true, alias: "isSubItem", required: false }] }], action: [{ type: i0.Input, args: [{ isSignal: true, alias: "action", required: false }] }] }); })();
 (() => { (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;
@@ -3715,7 +3707,7 @@ class MenuExpandablePanelComponent {
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(MenuExpandablePanelComponent, [{
         type: Component,
         args: [{ selector: 'cauca-menu-expandable-panel', imports: [MatIconModule, TranslatePipe, MenuExpandablePanelItemComponent, NgClass], 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 [class.opened]=\"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 mat-icon:last-child{transition:transform .2s ease-in-out}section mat-icon:last-child.opened{transform:rotate(-90deg)}section.bottom-padding{padding-bottom:10px}div{flex:1}\n"] }]
-    }], null, { topLeftRadius: [{
+    }], null, { caption: [{ type: i0.Input, args: [{ isSignal: true, alias: "caption", required: false }] }], isSubItem: [{ type: i0.Input, args: [{ isSignal: true, alias: "isSubItem", required: false }] }], subCaption: [{ type: i0.Input, args: [{ isSignal: true, alias: "subCaption", required: false }] }], menuIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "menuIcon", required: false }] }], showExpansionIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "showExpansionIcon", required: false }] }], addTopBorderRadius: [{ type: i0.Input, args: [{ isSignal: true, alias: "addTopBorderRadius", required: false }] }], bottomBorder: [{ type: i0.Input, args: [{ isSignal: true, alias: "bottomBorder", required: false }] }], addBottomBorderRadius: [{ type: i0.Input, args: [{ isSignal: true, alias: "addBottomBorderRadius", required: false }] }], route: [{ type: i0.Input, args: [{ isSignal: true, alias: "route", required: false }] }], items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: false }] }], topLeftRadius: [{
             type: HostBinding,
             args: ['style.border-top-left-radius']
         }], topRightRadius: [{
@@ -3759,7 +3751,7 @@ class SavingConfirmedBoxComponent {
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SavingConfirmedBoxComponent, [{
         type: Component,
         args: [{ selector: 'cauca-saving-confirmed-box', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, imports: [SnackBarComponent, TranslateModule], template: "@if (show()) {\r\n    <cauca-snackbar\r\n        caption=\"savingSuccessNotification.title\"\r\n        type=\"success\"\r\n        variant=\"standard\"\r\n        [showButton]=\"false\"\r\n        [showCloseButton]=\"true\"\r\n        (closeClick)=\"show.set(false)\">\r\n        {{'savingSuccessNotification.message' | translate}}\r\n    </cauca-snackbar>\r\n}" }]
-    }], null, null); })();
+    }], null, { show: [{ type: i0.Input, args: [{ isSignal: true, alias: "show", required: false }] }, { type: i0.Output, args: ["showChange"] }] }); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SavingConfirmedBoxComponent, { className: "SavingConfirmedBoxComponent", filePath: "lib/components/notifications/saving-confirmed-box/saving-confirmed-box.component.ts", lineNumber: 13 }); })();
 
 function SavingErrorBoxComponent_Conditional_0_Template(rf, ctx) { if (rf & 1) {
@@ -3791,7 +3783,7 @@ class SavingErrorBoxComponent {
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SavingErrorBoxComponent, [{
         type: Component,
         args: [{ selector: 'cauca-saving-error-box', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, imports: [SnackBarComponent, TranslateModule], template: "@if (show()) {\r\n    <cauca-snackbar\r\n        caption=\"generalError.savingErrorAlertTitle\"\r\n        type=\"error\"\r\n        variant=\"standard\"\r\n        [showButton]=\"false\"\r\n        [showCloseButton]=\"true\"\r\n        (closeClick)=\"show.set(false)\">\r\n        {{error() | translate}}\r\n    </cauca-snackbar>\r\n}" }]
-    }], null, null); })();
+    }], null, { show: [{ type: i0.Input, args: [{ isSignal: true, alias: "show", required: false }] }, { type: i0.Output, args: ["showChange"] }], specificError: [{ type: i0.Input, args: [{ isSignal: true, alias: "specificError", required: false }] }] }); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SavingErrorBoxComponent, { className: "SavingErrorBoxComponent", filePath: "lib/components/notifications/saving-error-box/saving-error-box.component.ts", lineNumber: 13 }); })();
 
 class AutoTrimAndLowerDirective {
@@ -3839,8 +3831,7 @@ class HasErrorRootDirective {
     }
     static { this.ɵfac = function HasErrorRootDirective_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || HasErrorRootDirective)(); }; }
     static { this.ɵdir = /*@__PURE__*/ i0.ɵɵdefineDirective({ type: HasErrorRootDirective, selectors: [["mat-form-field"]], contentQueries: function HasErrorRootDirective_ContentQueries(rf, ctx, dirIndex) { if (rf & 1) {
-            i0.ɵɵcontentQuery(dirIndex, FormControlDirective, 5);
-            i0.ɵɵcontentQuery(dirIndex, FormControlName, 5);
+            i0.ɵɵcontentQuery(dirIndex, FormControlDirective, 5)(dirIndex, FormControlName, 5);
         } if (rf & 2) {
             let _t;
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.formControl = _t.first);
@@ -4002,7 +3993,7 @@ class CaucaSimpleDialogComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CaucaSimpleDialogComponent, [{
         type: Component,
-        args: [{ selector: 'cauca-simple-dialog', imports: [CommonModule, MatDialogTitle, MatDialogContent, MatDialogActions, MatButtonModule], template: "<h1 mat-dialog-title>{{data.title}}</h1>\n<div mat-dialog-content>\n  <div [innerHTML]=\"data.message\"></div>\n</div>\n<div mat-dialog-actions *ngIf=\"data.buttons\">\n  <button *ngFor=\"let label of data.buttons; let i = index\" mat-raised-button (click)=\"onClick(i)\">{{label}}</button>\n</div>", styles: ["div[mat-dialog-actions]{margin-top:20px;text-align:center}\n"] }]
+        args: [{ selector: 'cauca-simple-dialog', imports: [CommonModule, MatDialogTitle, MatDialogContent, MatDialogActions, MatButtonModule], template: "<h1 mat-dialog-title>{{data.title}}</h1>\r\n<div mat-dialog-content>\r\n  <div [innerHTML]=\"data.message\"></div>\r\n</div>\r\n<div mat-dialog-actions *ngIf=\"data.buttons\">\r\n  <button *ngFor=\"let label of data.buttons; let i = index\" mat-raised-button (click)=\"onClick(i)\">{{label}}</button>\r\n</div>", styles: ["div[mat-dialog-actions]{margin-top:20px;text-align:center}\n"] }]
     }], null, null); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(CaucaSimpleDialogComponent, { className: "CaucaSimpleDialogComponent", filePath: "lib/components/deprecated-components/cauca-simple-dialog/cauca-simple-dialog.component.ts", lineNumber: 13 }); })();
 
@@ -4012,39 +4003,39 @@ function CaucaInputFileComponent_mat_icon_1_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const ctx_r1 = i0.ɵɵnextContext();
+    const ctx_r0 = i0.ɵɵnextContext();
     i0.ɵɵadvance();
-    i0.ɵɵtextInterpolate(ctx_r1.icon);
+    i0.ɵɵtextInterpolate(ctx_r0.icon);
 } }
 function CaucaInputFileComponent_span_2_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "span");
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const ctx_r1 = i0.ɵɵnextContext();
+    const ctx_r0 = i0.ɵɵnextContext();
     i0.ɵɵadvance();
-    i0.ɵɵtextInterpolate(ctx_r1.text);
+    i0.ɵɵtextInterpolate(ctx_r0.text);
 } }
 function CaucaInputFileComponent_ng_container_3_Template(rf, ctx) { if (rf & 1) {
-    const _r3 = i0.ɵɵgetCurrentView();
+    const _r2 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementContainerStart(0);
     i0.ɵɵelementStart(1, "input", 5, 1);
-    i0.ɵɵlistener("change", function CaucaInputFileComponent_ng_container_3_Template_input_change_1_listener($event) { i0.ɵɵrestoreView(_r3); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onSelectFile($event)); });
+    i0.ɵɵlistener("change", function CaucaInputFileComponent_ng_container_3_Template_input_change_1_listener($event) { i0.ɵɵrestoreView(_r2); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.onSelectFile($event)); });
     i0.ɵɵelementEnd();
     i0.ɵɵelementContainerEnd();
 } if (rf & 2) {
-    const ctx_r1 = i0.ɵɵnextContext();
+    const ctx_r0 = i0.ɵɵnextContext();
     i0.ɵɵadvance();
-    i0.ɵɵproperty("accept", ctx_r1.accept);
+    i0.ɵɵproperty("accept", ctx_r0.accept);
 } }
 function CaucaInputFileComponent_ng_template_4_Template(rf, ctx) { if (rf & 1) {
-    const _r4 = i0.ɵɵgetCurrentView();
+    const _r3 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "input", 6, 1);
-    i0.ɵɵlistener("change", function CaucaInputFileComponent_ng_template_4_Template_input_change_0_listener($event) { i0.ɵɵrestoreView(_r4); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onSelectFile($event)); });
+    i0.ɵɵlistener("change", function CaucaInputFileComponent_ng_template_4_Template_input_change_0_listener($event) { i0.ɵɵrestoreView(_r3); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.onSelectFile($event)); });
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const ctx_r1 = i0.ɵɵnextContext();
-    i0.ɵɵproperty("accept", ctx_r1.accept);
+    const ctx_r0 = i0.ɵɵnextContext();
+    i0.ɵɵproperty("accept", ctx_r0.accept);
 } }
 class CaucaInputFileComponent {
     constructor() {
@@ -4111,25 +4102,24 @@ class CaucaInputFileComponent {
             let _t;
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.file = _t.first);
         } }, inputs: { accept: "accept", multiple: "multiple", icon: "icon", text: "text" }, outputs: { readend: "readend" }, decls: 6, vars: 4, consts: [["notMultipleInput", ""], ["file", ""], ["mat-raised-button", "", 3, "click"], [4, "ngIf"], [4, "ngIf", "ngIfElse"], ["type", "file", "multiple", "multiple", 3, "change", "accept"], ["type", "file", 3, "change", "accept"]], template: function CaucaInputFileComponent_Template(rf, ctx) { if (rf & 1) {
-            const _r1 = i0.ɵɵgetCurrentView();
             i0.ɵɵelementStart(0, "button", 2);
-            i0.ɵɵlistener("click", function CaucaInputFileComponent_Template_button_click_0_listener($event) { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.openDialog($event)); });
+            i0.ɵɵlistener("click", function CaucaInputFileComponent_Template_button_click_0_listener($event) { return ctx.openDialog($event); });
             i0.ɵɵtemplate(1, CaucaInputFileComponent_mat_icon_1_Template, 2, 1, "mat-icon", 3)(2, CaucaInputFileComponent_span_2_Template, 2, 1, "span", 3);
             i0.ɵɵelementEnd();
             i0.ɵɵtemplate(3, CaucaInputFileComponent_ng_container_3_Template, 3, 1, "ng-container", 4)(4, CaucaInputFileComponent_ng_template_4_Template, 2, 1, "ng-template", null, 0, i0.ɵɵtemplateRefExtractor);
         } if (rf & 2) {
-            const notMultipleInput_r5 = i0.ɵɵreference(5);
+            const notMultipleInput_r4 = i0.ɵɵreference(5);
             i0.ɵɵadvance();
             i0.ɵɵproperty("ngIf", ctx.icon);
             i0.ɵɵadvance();
             i0.ɵɵproperty("ngIf", ctx.text);
             i0.ɵɵadvance();
-            i0.ɵɵproperty("ngIf", ctx.multiple)("ngIfElse", notMultipleInput_r5);
+            i0.ɵɵproperty("ngIf", ctx.multiple)("ngIfElse", notMultipleInput_r4);
         } }, dependencies: [MatButtonModule, i2.MatButton, MatIcon], styles: ["[_nghost-%COMP%]   input[_ngcontent-%COMP%]{display:none}"] }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CaucaInputFileComponent, [{
         type: Component,
-        args: [{ selector: 'cauca-input-file', imports: [MatButtonModule, MatIcon], template: "<button mat-raised-button (click)=\"openDialog($event)\">\n    <mat-icon *ngIf=\"icon\">{{icon}}</mat-icon>\n    <span *ngIf=\"text\">{{text}}</span>\n</button>\n<ng-container *ngIf=\"multiple; else notMultipleInput\">\n  <input #file type=\"file\" (change)=\"onSelectFile($event)\" [accept]=\"accept\" multiple=\"multiple\" />\n</ng-container>\n\n<ng-template #notMultipleInput>\n  <input #file type=\"file\" (change)=\"onSelectFile($event)\" [accept]=\"accept\" />\n</ng-template>", styles: [":host input{display:none}\n"] }]
+        args: [{ selector: 'cauca-input-file', imports: [MatButtonModule, MatIcon], template: "<button mat-raised-button (click)=\"openDialog($event)\">\r\n    <mat-icon *ngIf=\"icon\">{{icon}}</mat-icon>\r\n    <span *ngIf=\"text\">{{text}}</span>\r\n</button>\r\n<ng-container *ngIf=\"multiple; else notMultipleInput\">\r\n  <input #file type=\"file\" (change)=\"onSelectFile($event)\" [accept]=\"accept\" multiple=\"multiple\" />\r\n</ng-container>\r\n\r\n<ng-template #notMultipleInput>\r\n  <input #file type=\"file\" (change)=\"onSelectFile($event)\" [accept]=\"accept\" />\r\n</ng-template>", styles: [":host input{display:none}\n"] }]
     }], null, { file: [{
             type: ViewChild,
             args: ['file', { static: false }]
@@ -4218,7 +4208,7 @@ class CaucaInputMultipleLangueComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CaucaInputMultipleLangueComponent, [{
         type: Component,
-        args: [{ selector: 'cauca-input-multiple-langue', imports: [CommonModule, MatTabGroup, MatTab, MatInput, MatFormFieldModule, ReactiveFormsModule, TranslateModule], template: "<mat-tab-group [selectedIndex]=\"selectedIndex\" (selectedIndexChange)=\"onTagChanged($event)\">\n  <mat-tab *ngFor=\"let lang of labels; let i = index\" [label]=\"lang\">\n    <mat-form-field hideRequiredMarker=\"never\">\n      <input matInput [placeholder]=\"lang\" [formControl]=\"forms[i]\" required=\"required\">\n      <mat-error *ngIf=\"forms[i].invalid\">{{getErrorMessage(i) | translate}}</mat-error>\n    </mat-form-field>\n  </mat-tab>\n</mat-tab-group>", styles: [".mat-mdc-form-field{width:100%}\n"] }]
+        args: [{ selector: 'cauca-input-multiple-langue', imports: [CommonModule, MatTabGroup, MatTab, MatInput, MatFormFieldModule, ReactiveFormsModule, TranslateModule], template: "<mat-tab-group [selectedIndex]=\"selectedIndex\" (selectedIndexChange)=\"onTagChanged($event)\">\r\n  <mat-tab *ngFor=\"let lang of labels; let i = index\" [label]=\"lang\">\r\n    <mat-form-field hideRequiredMarker=\"never\">\r\n      <input matInput [placeholder]=\"lang\" [formControl]=\"forms[i]\" required=\"required\">\r\n      <mat-error *ngIf=\"forms[i].invalid\">{{getErrorMessage(i) | translate}}</mat-error>\r\n    </mat-form-field>\r\n  </mat-tab>\r\n</mat-tab-group>", styles: [".mat-mdc-form-field{width:100%}\n"] }]
     }], () => [], { value: [{
             type: Input
         }] }); })();
@@ -4380,7 +4370,7 @@ class CaucaMenuVerticalComponent {
                     CommonModule,
                     FaIconComponent,
                     TranslateModule,
-                ], template: "<h4 *ngFor=\"let menu of menuItems\" [class]=\"menu.activated ? 'selected' : ''\">\n    <div (click)=\"goTo(menu.path, $event)\" class=\"menu\">\n        <div *ngIf=\"menu.icon\" class=\"menu-icon\">\n            <fa-icon *ngIf=\"menu.icon.filter !== undefined\" [icon]=\"menu.icon\"></fa-icon>\n            <img *ngIf=\"menu.icon.filter === undefined\" [src]=\"menu.icon\" />\n        </div>\n        <div *ngIf=\"menu.label\" class=\"menu-caption\">\n            <span>{{menu.label | translate}}</span>\n        </div>\n    </div>\n    <div *ngIf=\"menu.childs.length && menu.activated\" class=\"submenu\">\n        <div\n            *ngFor=\"let submenu of menu.childs\"\n            [class]=\"submenu.activated ? 'menu selected' : 'menu'\"\n            (click)=\"goTo(submenu.path, $event)\">\n            <div *ngIf=\"!submenu.icon\" class=\"menu-dot\">&bull;</div>\n            <div *ngIf=\"submenu.icon\" class=\"menu-icon\">\n                <fa-icon *ngIf=\"submenu.icon.filter !== undefined\" [icon]=\"submenu.icon\"></fa-icon>\n                <img *ngIf=\"submenu.icon.filter === undefined\" [src]=\"submenu.icon\" />\n            </div>\n            <div *ngIf=\"submenu.label\" class=\"menu-caption\">\n                <span>{{submenu.label | translate}}</span>\n            </div>\n        </div>\n    </div>\n</h4>\n", styles: [".menu,.submenu{cursor:pointer}h4{margin:0;padding:0}h4 .menu{padding:1em 0;display:flex;flex-direction:row}h4 .menu>div{flex:1 1 auto;align-self:center}.menu-dot{max-width:1.1em;text-align:center;margin-right:.5em;font-size:2em}.menu-icon{max-width:60px;text-align:center;margin-right:.5em}.submenu{margin-left:1em}.submenu .menu{padding:0;font-size:.9em;line-height:2.2em}.submenu .menu:before{content:\"\";margin-left:1.1em;width:.1em;height:2.5em;position:relative;background:#fff;margin-right:-1.17em}\n"] }]
+                ], template: "<h4 *ngFor=\"let menu of menuItems\" [class]=\"menu.activated ? 'selected' : ''\">\r\n    <div (click)=\"goTo(menu.path, $event)\" class=\"menu\">\r\n        <div *ngIf=\"menu.icon\" class=\"menu-icon\">\r\n            <fa-icon *ngIf=\"menu.icon.filter !== undefined\" [icon]=\"menu.icon\"></fa-icon>\r\n            <img *ngIf=\"menu.icon.filter === undefined\" [src]=\"menu.icon\" />\r\n        </div>\r\n        <div *ngIf=\"menu.label\" class=\"menu-caption\">\r\n            <span>{{menu.label | translate}}</span>\r\n        </div>\r\n    </div>\r\n    <div *ngIf=\"menu.childs.length && menu.activated\" class=\"submenu\">\r\n        <div\r\n            *ngFor=\"let submenu of menu.childs\"\r\n            [class]=\"submenu.activated ? 'menu selected' : 'menu'\"\r\n            (click)=\"goTo(submenu.path, $event)\">\r\n            <div *ngIf=\"!submenu.icon\" class=\"menu-dot\">&bull;</div>\r\n            <div *ngIf=\"submenu.icon\" class=\"menu-icon\">\r\n                <fa-icon *ngIf=\"submenu.icon.filter !== undefined\" [icon]=\"submenu.icon\"></fa-icon>\r\n                <img *ngIf=\"submenu.icon.filter === undefined\" [src]=\"submenu.icon\" />\r\n            </div>\r\n            <div *ngIf=\"submenu.label\" class=\"menu-caption\">\r\n                <span>{{submenu.label | translate}}</span>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</h4>\r\n", styles: [".menu,.submenu{cursor:pointer}h4{margin:0;padding:0}h4 .menu{padding:1em 0;display:flex;flex-direction:row}h4 .menu>div{flex:1 1 auto;align-self:center}.menu-dot{max-width:1.1em;text-align:center;margin-right:.5em;font-size:2em}.menu-icon{max-width:60px;text-align:center;margin-right:.5em}.submenu{margin-left:1em}.submenu .menu{padding:0;font-size:.9em;line-height:2.2em}.submenu .menu:before{content:\"\";margin-left:1.1em;width:.1em;height:2.5em;position:relative;background:#fff;margin-right:-1.17em}\n"] }]
     }], () => [], { itemClick: [{
             type: Output
         }], menuItems: [{
@@ -4391,9 +4381,9 @@ class CaucaMenuVerticalComponent {
 const _c0$1 = [[["", "header", ""]], [["", "beforeMenu", ""]], [["", "afterMenu", ""]], [["", "footer", ""]]];
 const _c1 = ["[header]", "[beforeMenu]", "[afterMenu]", "[footer]"];
 function CaucaMenuSidebarComponent_div_12_Template(rf, ctx) { if (rf & 1) {
-    const _r2 = i0.ɵɵgetCurrentView();
+    const _r1 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "div", 7)(1, "div", 8);
-    i0.ɵɵlistener("click", function CaucaMenuSidebarComponent_div_12_Template_div_click_1_listener() { i0.ɵɵrestoreView(_r2); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onToggleCollapse()); });
+    i0.ɵɵlistener("click", function CaucaMenuSidebarComponent_div_12_Template_div_click_1_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onToggleCollapse()); });
     i0.ɵɵelementEnd();
     i0.ɵɵelementStart(2, "span", 9);
     i0.ɵɵtext(3);
@@ -4403,11 +4393,11 @@ function CaucaMenuSidebarComponent_div_12_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵtext(6);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
-    const ctx_r2 = i0.ɵɵnextContext();
+    const ctx_r1 = i0.ɵɵnextContext();
     i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate2("", i0.ɵɵpipeBind1(4, 3, "material.version"), " ", ctx_r2.version);
+    i0.ɵɵtextInterpolate2("", i0.ɵɵpipeBind1(4, 3, "material.version"), " ", ctx_r1.version);
     i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate(ctx_r2.version);
+    i0.ɵɵtextInterpolate(ctx_r1.version);
 } }
 class CaucaMenuSidebarComponent {
     constructor() {
@@ -4489,10 +4479,9 @@ class CaucaMenuSidebarComponent {
     static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: CaucaMenuSidebarComponent, selectors: [["cauca-menu-sidebar"]], hostBindings: function CaucaMenuSidebarComponent_HostBindings(rf, ctx) { if (rf & 1) {
             i0.ɵɵlistener("resize", function CaucaMenuSidebarComponent_resize_HostBindingHandler($event) { return ctx.onResize($event); }, i0.ɵɵresolveWindow);
         } }, inputs: { menuItems: "menuItems", version: "version" }, ngContentSelectors: _c1, decls: 13, vars: 2, consts: [["menu", ""], [1, "header"], ["mat-icon-button", "", 1, "close", 3, "click"], [1, "content"], [3, "itemClick", "menuItems"], [1, "footer"], ["class", "version", 4, "ngIf"], [1, "version"], [1, "double-arrow", 3, "click"], [1, "full"], [1, "abbr"]], template: function CaucaMenuSidebarComponent_Template(rf, ctx) { if (rf & 1) {
-            const _r1 = i0.ɵɵgetCurrentView();
             i0.ɵɵprojectionDef(_c0$1);
             i0.ɵɵelementStart(0, "div", 1)(1, "button", 2);
-            i0.ɵɵlistener("click", function CaucaMenuSidebarComponent_Template_button_click_1_listener() { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.hideOnMobile()); });
+            i0.ɵɵlistener("click", function CaucaMenuSidebarComponent_Template_button_click_1_listener() { return ctx.hideOnMobile(); });
             i0.ɵɵelementStart(2, "mat-icon");
             i0.ɵɵtext(3, "clear");
             i0.ɵɵelementEnd()();
@@ -4501,7 +4490,7 @@ class CaucaMenuSidebarComponent {
             i0.ɵɵelementStart(5, "div", 3);
             i0.ɵɵprojection(6, 1);
             i0.ɵɵelementStart(7, "cauca-menu-vertical", 4, 0);
-            i0.ɵɵlistener("itemClick", function CaucaMenuSidebarComponent_Template_cauca_menu_vertical_itemClick_7_listener() { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.onMenuItemClick()); });
+            i0.ɵɵlistener("itemClick", function CaucaMenuSidebarComponent_Template_cauca_menu_vertical_itemClick_7_listener() { return ctx.onMenuItemClick(); });
             i0.ɵɵelementEnd();
             i0.ɵɵprojection(9, 2);
             i0.ɵɵelementEnd();
@@ -4514,11 +4503,11 @@ class CaucaMenuSidebarComponent {
             i0.ɵɵproperty("menuItems", ctx.menuItems);
             i0.ɵɵadvance(5);
             i0.ɵɵproperty("ngIf", ctx.version);
-        } }, dependencies: [CommonModule, i1$3.NgIf, MatIconButton, MatIcon, CaucaMenuVerticalComponent, TranslateModule, i1.TranslatePipe], styles: ["[_nghost-%COMP%]{height:100%;flex-direction:column;display:flex;transition:all .1s ease-out;overflow:hidden;scrollbar-width:5px;scrollbar-color:rgba(0,0,0,.1) rgba(0,0,0,.2)}[_ngcontent-%COMP%]::-webkit-scrollbar{width:5px}[_ngcontent-%COMP%]::-webkit-scrollbar-track{border-radius:5px;-webkit-box-shadow:inset 0 0 6px rgba(0,0,0,.1)}[_ngcontent-%COMP%]::-webkit-scrollbar-thumb{border-radius:5px;background-color:#0003;outline:1px solid slategrey}[_nghost-%COMP%] > div[_ngcontent-%COMP%]{flex:1}[_nghost-%COMP%] > .header[_ngcontent-%COMP%], [_nghost-%COMP%] > .footer[_ngcontent-%COMP%]{flex:0 0 auto}[_nghost-%COMP%] > .content[_ngcontent-%COMP%]{flex-grow:1;overflow:hidden auto}[_nghost-%COMP%] > .version[_ngcontent-%COMP%]{max-height:1em}.hidden[_nghost-%COMP%]{width:0;min-width:0;max-width:0}.mobile[_nghost-%COMP%]{width:275px;min-width:275px;max-width:275px;position:absolute;z-index:10}.collapsed[_nghost-%COMP%]{width:75px;min-width:75px;max-width:75px}.expanded[_nghost-%COMP%]{width:275px;min-width:275px;max-width:275px}[_nghost-%COMP%]   .close[_ngcontent-%COMP%]{display:none}.mobile[_nghost-%COMP%]   .close[_ngcontent-%COMP%]{right:0;display:inline-block;position:absolute}.double-arrow[_ngcontent-%COMP%]{height:3em;line-height:3em;cursor:pointer;position:fixed;opacity:.25;margin-top:-1em}.double-arrow[_ngcontent-%COMP%]:hover{opacity:1}.expanded[_nghost-%COMP%]   .double-arrow[_ngcontent-%COMP%]:before, .collapsed[_nghost-%COMP%]   .double-arrow[_ngcontent-%COMP%]:before{font-family:Material Icons;content:\"double_arrow\";font-size:3em;text-align:right}.collapsed[_nghost-%COMP%]   .double-arrow[_ngcontent-%COMP%]{margin-left:10px}.expanded[_nghost-%COMP%]   .double-arrow[_ngcontent-%COMP%]{margin-left:200px}.collapsed[_nghost-%COMP%]     .menu-caption, .collapsed[_nghost-%COMP%]     .submenu{display:none}.keepExpanded[_nghost-%COMP%]   .double-arrow[_ngcontent-%COMP%]{transform:rotate(180deg);opacity:1}.version[_ngcontent-%COMP%]{bottom:0;padding:1em}.full[_ngcontent-%COMP%], .abbr[_ngcontent-%COMP%]{display:none}.collapsed[_nghost-%COMP%]   .abbr[_ngcontent-%COMP%]{display:inline}.mobile[_nghost-%COMP%]   .full[_ngcontent-%COMP%], .expanded[_nghost-%COMP%]   .full[_ngcontent-%COMP%]{display:inline}@media only screen and (max-width: 1000px){.double-arrow[_ngcontent-%COMP%]{display:none}}"] }); }
+        } }, dependencies: [CommonModule, i1$3.NgIf, MatIconButton, MatIcon, CaucaMenuVerticalComponent, TranslateModule, i1.TranslatePipe], styles: ["[_nghost-%COMP%]{height:100%;flex-direction:column;display:flex;transition:all .1s ease-out;overflow:hidden;scrollbar-width:5px;scrollbar-color:rgba(0,0,0,.1) rgba(0,0,0,.2)}[_ngcontent-%COMP%]::-webkit-scrollbar{width:5px}[_ngcontent-%COMP%]::-webkit-scrollbar-track{border-radius:5px;-webkit-box-shadow:inset 0 0 6px rgba(0,0,0,.1)}[_ngcontent-%COMP%]::-webkit-scrollbar-thumb{border-radius:5px;background-color:#0003;outline:1px solid slategrey}[_nghost-%COMP%] > div[_ngcontent-%COMP%]{flex:1}[_nghost-%COMP%] > .header[_ngcontent-%COMP%], [_nghost-%COMP%] > .footer[_ngcontent-%COMP%]{flex:0 0 auto}[_nghost-%COMP%] > .content[_ngcontent-%COMP%]{flex-grow:1;overflow:hidden auto}[_nghost-%COMP%] > .version[_ngcontent-%COMP%]{max-height:1em}.hidden[_nghost-%COMP%]{width:0;min-width:0;max-width:0}.mobile[_nghost-%COMP%]{width:275px;min-width:275px;max-width:275px;position:absolute;z-index:10}.collapsed[_nghost-%COMP%]{width:75px;min-width:75px;max-width:75px}.expanded[_nghost-%COMP%]{width:275px;min-width:275px;max-width:275px}[_nghost-%COMP%]   .close[_ngcontent-%COMP%]{display:none}.mobile[_nghost-%COMP%]   .close[_ngcontent-%COMP%]{right:0;display:inline-block;position:absolute}.double-arrow[_ngcontent-%COMP%]{height:3em;line-height:3em;cursor:pointer;position:fixed;opacity:.25;margin-top:-1em}.double-arrow[_ngcontent-%COMP%]:hover{opacity:1}.expanded[_nghost-%COMP%]   .double-arrow[_ngcontent-%COMP%]:before, .collapsed[_nghost-%COMP%]   .double-arrow[_ngcontent-%COMP%]:before{font-family:Material Icons;content:\"double_arrow\";font-size:3em;text-align:right}.collapsed[_nghost-%COMP%]   .double-arrow[_ngcontent-%COMP%]{margin-left:10px}.expanded[_nghost-%COMP%]   .double-arrow[_ngcontent-%COMP%]{margin-left:200px}.collapsed[_nghost-%COMP%]     .menu-caption, .collapsed[_nghost-%COMP%]     .submenu{display:none}.keepExpanded[_nghost-%COMP%]   .double-arrow[_ngcontent-%COMP%]{transform:rotate(180deg);opacity:1}.version[_ngcontent-%COMP%]{bottom:0;padding:1em}.full[_ngcontent-%COMP%], .abbr[_ngcontent-%COMP%]{display:none}.collapsed[_nghost-%COMP%]   .abbr[_ngcontent-%COMP%]{display:inline}.mobile[_nghost-%COMP%]   .full[_ngcontent-%COMP%], .expanded[_nghost-%COMP%]   .full[_ngcontent-%COMP%]{display:inline}@media only screen and (max-width:1000px){.double-arrow[_ngcontent-%COMP%]{display:none}}"] }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CaucaMenuSidebarComponent, [{
         type: Component,
-        args: [{ selector: 'cauca-menu-sidebar', imports: [CommonModule, MatIconButton, MatIcon, CaucaMenuVerticalComponent, TranslateModule], template: "<div class=\"header\">\n    <button mat-icon-button class=\"close\" (click)=\"hideOnMobile()\">\n        <mat-icon>clear</mat-icon>\n    </button>\n    <ng-content select=\"[header]\"></ng-content>\n</div>\n<div class=\"content\">\n    <ng-content select=\"[beforeMenu]\"></ng-content>\n    <cauca-menu-vertical #menu [menuItems]=\"menuItems\" (itemClick)=\"onMenuItemClick()\"></cauca-menu-vertical>\n    <ng-content select=\"[afterMenu]\"></ng-content>\n</div>\n<div class=\"footer\">\n    <ng-content select=\"[footer]\"></ng-content>\n</div>\n<div *ngIf=\"version\" class=\"version\">\n    <div class=\"double-arrow\" (click)=\"onToggleCollapse()\"></div>\n    <span class=\"full\">{{'material.version' | translate}} {{version}}</span>\n    <span class=\"abbr\">{{version}}</span>\n</div>\n", styles: [":host{height:100%;flex-direction:column;display:flex;transition:all .1s ease-out;overflow:hidden;scrollbar-width:5px;scrollbar-color:rgba(0,0,0,.1) rgba(0,0,0,.2)}::-webkit-scrollbar{width:5px}::-webkit-scrollbar-track{border-radius:5px;-webkit-box-shadow:inset 0 0 6px rgba(0,0,0,.1)}::-webkit-scrollbar-thumb{border-radius:5px;background-color:#0003;outline:1px solid slategrey}:host>div{flex:1}:host>.header,:host>.footer{flex:0 0 auto}:host>.content{flex-grow:1;overflow:hidden auto}:host>.version{max-height:1em}:host.hidden{width:0;min-width:0;max-width:0}:host.mobile{width:275px;min-width:275px;max-width:275px;position:absolute;z-index:10}:host.collapsed{width:75px;min-width:75px;max-width:75px}:host.expanded{width:275px;min-width:275px;max-width:275px}:host .close{display:none}:host.mobile .close{right:0;display:inline-block;position:absolute}.double-arrow{height:3em;line-height:3em;cursor:pointer;position:fixed;opacity:.25;margin-top:-1em}.double-arrow:hover{opacity:1}:host.expanded .double-arrow:before,:host.collapsed .double-arrow:before{font-family:Material Icons;content:\"double_arrow\";font-size:3em;text-align:right}:host.collapsed .double-arrow{margin-left:10px}:host.expanded .double-arrow{margin-left:200px}:host.collapsed ::ng-deep .menu-caption,:host.collapsed ::ng-deep .submenu{display:none}:host.keepExpanded .double-arrow{transform:rotate(180deg);opacity:1}.version{bottom:0;padding:1em}.full,.abbr{display:none}:host.collapsed .abbr{display:inline}:host.mobile .full,:host.expanded .full{display:inline}@media only screen and (max-width: 1000px){.double-arrow{display:none}}\n"] }]
+        args: [{ selector: 'cauca-menu-sidebar', imports: [CommonModule, MatIconButton, MatIcon, CaucaMenuVerticalComponent, TranslateModule], template: "<div class=\"header\">\r\n    <button mat-icon-button class=\"close\" (click)=\"hideOnMobile()\">\r\n        <mat-icon>clear</mat-icon>\r\n    </button>\r\n    <ng-content select=\"[header]\"></ng-content>\r\n</div>\r\n<div class=\"content\">\r\n    <ng-content select=\"[beforeMenu]\"></ng-content>\r\n    <cauca-menu-vertical #menu [menuItems]=\"menuItems\" (itemClick)=\"onMenuItemClick()\"></cauca-menu-vertical>\r\n    <ng-content select=\"[afterMenu]\"></ng-content>\r\n</div>\r\n<div class=\"footer\">\r\n    <ng-content select=\"[footer]\"></ng-content>\r\n</div>\r\n<div *ngIf=\"version\" class=\"version\">\r\n    <div class=\"double-arrow\" (click)=\"onToggleCollapse()\"></div>\r\n    <span class=\"full\">{{'material.version' | translate}} {{version}}</span>\r\n    <span class=\"abbr\">{{version}}</span>\r\n</div>\r\n", styles: [":host{height:100%;flex-direction:column;display:flex;transition:all .1s ease-out;overflow:hidden;scrollbar-width:5px;scrollbar-color:rgba(0,0,0,.1) rgba(0,0,0,.2)}::-webkit-scrollbar{width:5px}::-webkit-scrollbar-track{border-radius:5px;-webkit-box-shadow:inset 0 0 6px rgba(0,0,0,.1)}::-webkit-scrollbar-thumb{border-radius:5px;background-color:#0003;outline:1px solid slategrey}:host>div{flex:1}:host>.header,:host>.footer{flex:0 0 auto}:host>.content{flex-grow:1;overflow:hidden auto}:host>.version{max-height:1em}:host.hidden{width:0;min-width:0;max-width:0}:host.mobile{width:275px;min-width:275px;max-width:275px;position:absolute;z-index:10}:host.collapsed{width:75px;min-width:75px;max-width:75px}:host.expanded{width:275px;min-width:275px;max-width:275px}:host .close{display:none}:host.mobile .close{right:0;display:inline-block;position:absolute}.double-arrow{height:3em;line-height:3em;cursor:pointer;position:fixed;opacity:.25;margin-top:-1em}.double-arrow:hover{opacity:1}:host.expanded .double-arrow:before,:host.collapsed .double-arrow:before{font-family:Material Icons;content:\"double_arrow\";font-size:3em;text-align:right}:host.collapsed .double-arrow{margin-left:10px}:host.expanded .double-arrow{margin-left:200px}:host.collapsed ::ng-deep .menu-caption,:host.collapsed ::ng-deep .submenu{display:none}:host.keepExpanded .double-arrow{transform:rotate(180deg);opacity:1}.version{bottom:0;padding:1em}.full,.abbr{display:none}:host.collapsed .abbr{display:inline}:host.mobile .full,:host.expanded .full{display:inline}@media only screen and (max-width:1000px){.double-arrow{display:none}}\n"] }]
     }], () => [], { menuItems: [{
             type: Input
         }], version: [{
@@ -4555,10 +4544,10 @@ class CaucaSlideshowComponent {
     constructor() {
         this.height = '150px';
         this.autoPlay = true;
-        this.timer = null;
-        this.items = [];
         this.states = [];
         this.selectedIndex = 0;
+        this.timer = null;
+        this.items = [];
     }
     set images(list) {
         this.items = list;
@@ -4615,7 +4604,7 @@ class CaucaSlideshowComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CaucaSlideshowComponent, [{
         type: Component,
-        args: [{ selector: 'cauca-slideshow', imports: [CommonModule], template: "<div #container class=\"slideshow\">\n  @for (url of images; track url; let index = $index) {\n    <div [class.active]=\"index === selectedIndex\" [class.entering]=\"states[index] === 'in'\" [class.leaving]=\"states[index] === 'out'\">\n      <img [src]=\"url\" />\n    </div>\n  }\n</div>", styles: [".slideshow{margin:0 auto;position:relative;overflow:hidden}.slideshow>div{width:100%;height:100%;position:absolute;transition:transform .5s ease-in,opacity .5s ease-in;transform:translate(100%);opacity:0}.slideshow>div.active{transform:translate(0);opacity:1}.slideshow>div.leaving{transform:translate(-100%);opacity:0}.slideshow>div.entering{transform:translate(0);opacity:1}img{max-height:100%;max-width:100%;margin:0 auto;display:block}\n"] }]
+        args: [{ selector: 'cauca-slideshow', imports: [CommonModule], template: "<div #container class=\"slideshow\">\r\n  @for (url of images; track url; let index = $index) {\r\n    <div [class.active]=\"index === selectedIndex\" [class.entering]=\"states[index] === 'in'\" [class.leaving]=\"states[index] === 'out'\">\r\n      <img [src]=\"url\" />\r\n    </div>\r\n  }\r\n</div>", styles: [".slideshow{margin:0 auto;position:relative;overflow:hidden}.slideshow>div{width:100%;height:100%;position:absolute;transition:transform .5s ease-in,opacity .5s ease-in;transform:translate(100%);opacity:0}.slideshow>div.active{transform:translate(0);opacity:1}.slideshow>div.leaving{transform:translate(-100%);opacity:0}.slideshow>div.entering{transform:translate(0);opacity:1}img{max-height:100%;max-width:100%;margin:0 auto;display:block}\n"] }]
     }], null, { container: [{
             type: ViewChild,
             args: ['container', { static: true }]