intelica-library-components 1.1.4 → 1.1.12

package/fesm2022/intelica-library-components.mjs

@@ -28,11 +28,12 @@ import { InputText, InputTextModule } from 'primeng/inputtext';
 import * as i6 from 'primeng/select';
 import { Select, SelectModule } from 'primeng/select';
 import * as i3$1 from 'primeng/api';
+import { ConfirmationService } from 'primeng/api';
 import { InputGroupAddonModule } from 'primeng/inputgroupaddon';
 import * as i3$2 from 'primeng/ripple';
 import { RippleModule } from 'primeng/ripple';
 import * as i2$3 from 'primeng/datepicker';
-import { DatePickerModule } from 'primeng/datepicker';
+import { DatePickerModule, DatePicker } from 'primeng/datepicker';
 import * as i2$2 from 'primeng/multiselect';
 import { MultiSelectModule } from 'primeng/multiselect';
 import * as i7 from 'primeng/textarea';
@@ -41,6 +42,8 @@ import { Dialog } from 'primeng/dialog';
 import * as echarts from 'echarts';
 import * as i2$4 from 'primeng/skeleton';
 import { SkeletonModule } from 'primeng/skeleton';
+import * as i1$3 from 'primeng/confirmdialog';
+import { ConfirmDialogModule } from 'primeng/confirmdialog';
 import * as XLSX from 'xlsx';
 import { Workbook } from 'exceljs';
 import { saveAs } from 'file-saver';
@@ -518,6 +521,33 @@ var TableSortOrder;
     TableSortOrder[TableSortOrder["Desc"] = -1] = "Desc";
 })(TableSortOrder || (TableSortOrder = {}));
 
+/**
+ * Enum representing the different types of alerts available in the system.
+ * Each type corresponds to a specific visual style and semantic meaning.
+ */
+var AlertType;
+(function (AlertType) {
+    /** Warning alert - Yellow icon and title, used for cautionary messages */
+    AlertType["WARNING"] = "warning";
+    /** Success alert - Green icon and title, used for successful operations */
+    AlertType["SUCCESS"] = "success";
+    /** Error alert - Red icon and title, used for error messages */
+    AlertType["ERROR"] = "error";
+})(AlertType || (AlertType = {}));
+/**
+ * Enum representing the button configuration modes for alerts.
+ * Determines which buttons are displayed in the alert dialog.
+ */
+var AlertButtonMode;
+(function (AlertButtonMode) {
+    /** Only shows a single OK/Confirm button */
+    AlertButtonMode["OK_ONLY"] = "ok_only";
+    /** Shows both Confirm and Cancel buttons */
+    AlertButtonMode["CONFIRM_CANCEL"] = "confirm_cancel";
+    /** Shows only a Confirm button (without cancel) */
+    AlertButtonMode["CONFIRM_ONLY"] = "confirm_only";
+})(AlertButtonMode || (AlertButtonMode = {}));
+
 class PermissionsService {
     constructor() { }
     async canActivate(next, state) {
@@ -4917,6 +4947,457 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImpor
                 args: ["document:click", ["$event"]]
             }] } });
 
+/**
+ * Constants for DatePicker custom button types
+ * Use these constants instead of string literals to maintain consistency
+ * and facilitate future changes
+ */
+const DATEPICKER_BUTTON_TYPES = {
+    TODAY: 'TODAY',
+    LAST_12_MONTHS: 'LAST_12_MONTHS',
+    CURRENT_YEAR: 'CURRENT_YEAR',
+    CURRENT_MONTH: 'CURRENT_MONTH',
+};
+
+class DatepickerComponent {
+    cdr;
+    // Expose constants to template
+    DATEPICKER_BUTTON_TYPES = DATEPICKER_BUTTON_TYPES;
+    /**
+     * @description Readonly input
+     * @default	false
+     * @type {boolean}
+     */
+    readonlyInput = false;
+    /**
+     * @description Show icon
+     * @default	false
+     * @type {boolean}
+     */
+    showIcon = false;
+    /**
+     * @description Number of months to display
+     * @default	2
+     * @type {number}
+     */
+    numberOfMonths = 2;
+    /**
+     * @description Panel style class
+     * @default	"prDatapicker prDatapicker--dropdown"
+     * @type {string}
+     */
+    panelStyleClass = "prDatapicker prDatapicker--dropdown";
+    /**
+     * @description Manual apply mode - requires Apply button click to confirm selection
+     * @default	false
+     * @type {boolean}
+     */
+    manualApply = false;
+    /**
+     * @description Custom buttons to show in footer
+     * @default	[]
+     * @type {CustomButtonType[]}
+     */
+    customButtons = [];
+    /**
+     * @description Date format for display in input
+     * @default	"dd M, yy" (e.g., "08 Jan, 2026")
+     * @type {string}
+     */
+    dateFormat;
+    /**
+     * @description View mode for the datepicker
+     * @default	"date"
+     * @type {"date" | "month" | "year"}
+     */
+    view = "date";
+    /**
+     * @description Selection mode for the datepicker
+     * @default	"range"
+     * @type {"single" | "range"}
+     */
+    selectionMode = "range";
+    /**
+     * @description Change event
+     * @emits {(Date | null)[] | null}
+     * @type {EventEmitter<(Date | null)[] | null>}
+     */
+    onChangeEvent = new EventEmitter();
+    rangeDates = null;
+    // Temporary selection for manual apply mode
+    tempSelection = null;
+    viewMonth;
+    viewYear;
+    currentYear = new Date().getFullYear();
+    currentMonth = new Date().getMonth();
+    defaultDate;
+    navigatingWithArrows = false;
+    // ViewChild to access datepicker instance
+    datepickerRef;
+    // Flag to control when closing is allowed
+    allowClose = true;
+    // Flag to prevent auto-close immediately after date selection
+    preventAutoClose = false;
+    // Track active button
+    activeButton = null;
+    months = [
+        { label: "Enero", value: 0 },
+        { label: "Febrero", value: 1 },
+        { label: "Marzo", value: 2 },
+        { label: "Abril", value: 3 },
+        { label: "Mayo", value: 4 },
+        { label: "Junio", value: 5 },
+        { label: "Julio", value: 6 },
+        { label: "Agosto", value: 7 },
+        { label: "Septiembre", value: 8 },
+        { label: "Octubre", value: 9 },
+        { label: "Noviembre", value: 10 },
+        { label: "Diciembre", value: 11 },
+    ];
+    years = [];
+    onChangeFn = () => { };
+    onTouchedFn = () => { };
+    constructor(cdr) {
+        this.cdr = cdr;
+        const today = new Date();
+        this.viewMonth = today.getMonth();
+        this.viewYear = today.getFullYear();
+        this.defaultDate = new Date(this.viewYear, this.viewMonth, 1);
+        const YEARS_BACK = 10;
+        this.years = [];
+        for (let y = this.viewYear - YEARS_BACK; y <= this.viewYear; y++) {
+            this.years.push(y);
+        }
+    }
+    get filteredMonths() {
+        if (this.navigatingWithArrows) {
+            return this.months;
+        }
+        if (this.viewYear === this.currentYear) {
+            return this.months.filter(m => m.value >= this.currentMonth);
+        }
+        return this.months;
+    }
+    getDateFormat() {
+        if (this.dateFormat) {
+            return this.dateFormat;
+        }
+        switch (this.view) {
+            case 'month':
+                return 'M, yy';
+            case 'year':
+                return 'yy';
+            default:
+                return 'dd M, yy';
+        }
+    }
+    normalizeMonthYear(month, year) {
+        if (month > 11) {
+            return { month: 0, year: year + 1 };
+        }
+        if (month < 0) {
+            return { month: 11, year: year - 1 };
+        }
+        return { month, year };
+    }
+    onMonthChange(event) {
+        this.navigatingWithArrows = true;
+        const normalized = this.normalizeMonthYear(event.month, event.year);
+        this.viewMonth = normalized.month;
+        this.viewYear = normalized.year;
+    }
+    onYearChange(event) {
+        this.navigatingWithArrows = true;
+        const normalized = this.normalizeMonthYear(event.month, event.year);
+        this.viewMonth = normalized.month;
+        this.viewYear = normalized.year;
+    }
+    onViewChange() {
+        this.navigatingWithArrows = false;
+        if (this.viewYear === this.currentYear && this.viewMonth < this.currentMonth) {
+            this.viewMonth = this.currentMonth;
+        }
+        this.defaultDate = new Date(this.viewYear, this.viewMonth, 1);
+    }
+    // Internal model for the datepicker (handles manual apply mode)
+    get internalModel() {
+        // In manual apply mode, show temp selection for the calendar
+        // In normal mode, show the actual value
+        return this.manualApply ? this.tempSelection : this.rangeDates;
+    }
+    // Handle model changes from datepicker
+    onModelChange(val) {
+        // Reset active button when user manually selects dates
+        this.activeButton = null;
+        if (this.manualApply) {
+            // In manual apply mode, only store in temp selection
+            this.tempSelection = val;
+            // Prevent auto-close immediately after date selection
+            this.preventAutoClose = true;
+            // After a brief moment, allow closing by clicking outside
+            setTimeout(() => {
+                this.preventAutoClose = false;
+            }, 200);
+        }
+        else {
+            // In normal mode, update the actual value immediately
+            this.rangeDates = val;
+            this.onChangeEvent.emit(this.rangeDates);
+            this.onChangeFn(this.rangeDates);
+            this.onTouchedFn();
+        }
+    }
+    writeValue(value) {
+        this.rangeDates = value;
+        if (this.manualApply) {
+            this.tempSelection = value;
+        }
+    }
+    registerOnChange(fn) {
+        this.onChangeFn = fn;
+    }
+    registerOnTouched(fn) {
+        this.onTouchedFn = fn;
+    }
+    setDisabledState(isDisabled) {
+        /* opcional: implementar si necesitas deshabilitar el componente desde ngModel */
+    }
+    onDateChange() {
+        this.onChangeEvent.emit(this.rangeDates);
+        this.onChangeFn(this.rangeDates);
+        this.onTouchedFn();
+    }
+    // Event handlers for open/close
+    handleOpen() {
+        if (this.manualApply) {
+            // Initialize temp selection with current value
+            this.tempSelection = this.rangeDates;
+            // Reset flags
+            this.allowClose = false;
+            this.preventAutoClose = false;
+            // Ensure hideOverlay is overridden every time the overlay opens
+            setTimeout(() => {
+                this.setupHideOverlayOverride();
+            }, 0);
+        }
+    }
+    handleClose() {
+        if (this.manualApply) {
+            // Reset temp selection to current value (discards changes if not applied)
+            this.tempSelection = this.rangeDates;
+            // Reset flags
+            this.allowClose = false;
+            this.preventAutoClose = false;
+            // Force the datepicker to refresh its internal model to show the original value
+            // Use setTimeout to ensure the change happens after the close animation
+            setTimeout(() => {
+                if (this.datepickerRef) {
+                    // Update the datepicker's internal value
+                    this.datepickerRef.value = this.rangeDates;
+                    // Trigger change detection
+                    this.cdr.detectChanges();
+                }
+            }, 0);
+        }
+    }
+    // Apply button callback
+    applyCallback(event) {
+        // Apply the temporary selection to the actual value
+        this.rangeDates = this.tempSelection;
+        this.onChangeEvent.emit(this.rangeDates);
+        this.onChangeFn(this.rangeDates);
+        this.onTouchedFn();
+        // Allow closing
+        this.allowClose = true;
+        this.preventAutoClose = false;
+        // Close the datepicker overlay
+        if (this.datepickerRef) {
+            this.datepickerRef.overlayVisible = false;
+        }
+    }
+    // Clear button callback
+    clearCallback(event) {
+        // Reset active button
+        this.activeButton = null;
+        if (this.manualApply) {
+            // In manual apply mode, clear both temp selection and actual value
+            this.tempSelection = null;
+            this.rangeDates = null;
+            this.onChangeEvent.emit(this.rangeDates);
+            this.onChangeFn(this.rangeDates);
+            this.onTouchedFn();
+            // Allow closing
+            this.allowClose = true;
+            this.preventAutoClose = false;
+        }
+        else {
+            this.rangeDates = null;
+            this.onChangeEvent.emit(this.rangeDates);
+            this.onChangeFn(this.rangeDates);
+            this.onTouchedFn();
+        }
+        // Close the datepicker overlay
+        if (this.datepickerRef) {
+            this.datepickerRef.overlayVisible = false;
+        }
+    }
+    // Custom button callbacks
+    todayCallback(event) {
+        const today = new Date();
+        const dateRange = [today, today];
+        this.activeButton = DATEPICKER_BUTTON_TYPES.TODAY;
+        if (this.manualApply) {
+            this.tempSelection = dateRange;
+        }
+        else {
+            this.rangeDates = dateRange;
+            this.onChangeEvent.emit(this.rangeDates);
+            this.onChangeFn(this.rangeDates);
+            this.onTouchedFn();
+        }
+    }
+    last12MonthsCallback(event) {
+        const endDate = new Date();
+        const startDate = new Date();
+        startDate.setMonth(startDate.getMonth() - 12);
+        const dateRange = [startDate, endDate];
+        this.activeButton = DATEPICKER_BUTTON_TYPES.LAST_12_MONTHS;
+        if (this.manualApply) {
+            this.tempSelection = dateRange;
+        }
+        else {
+            this.rangeDates = dateRange;
+            this.onChangeEvent.emit(this.rangeDates);
+            this.onChangeFn(this.rangeDates);
+            this.onTouchedFn();
+        }
+    }
+    currentYearCallback(event) {
+        const today = new Date();
+        const startDate = new Date(today.getFullYear(), 0, 1); // January 1st
+        const endDate = new Date(today.getFullYear(), 11, 31); // December 31st
+        const dateRange = [startDate, endDate];
+        this.activeButton = DATEPICKER_BUTTON_TYPES.CURRENT_YEAR;
+        if (this.manualApply) {
+            this.tempSelection = dateRange;
+        }
+        else {
+            this.rangeDates = dateRange;
+            this.onChangeEvent.emit(this.rangeDates);
+            this.onChangeFn(this.rangeDates);
+            this.onTouchedFn();
+        }
+    }
+    currentMonthCallback(event) {
+        const today = new Date();
+        const startDate = new Date(today.getFullYear(), today.getMonth(), 1); // First day of month
+        const lastDay = new Date(today.getFullYear(), today.getMonth() + 1, 0).getDate();
+        const endDate = new Date(today.getFullYear(), today.getMonth(), lastDay); // Last day of month
+        const dateRange = [startDate, endDate];
+        this.activeButton = DATEPICKER_BUTTON_TYPES.CURRENT_MONTH;
+        if (this.manualApply) {
+            this.tempSelection = dateRange;
+        }
+        else {
+            this.rangeDates = dateRange;
+            this.onChangeEvent.emit(this.rangeDates);
+            this.onChangeFn(this.rangeDates);
+            this.onTouchedFn();
+        }
+    }
+    // Helper method to check if a button should be shown
+    shouldShowButton(buttonType) {
+        return this.customButtons.includes(buttonType);
+    }
+    // Helper method to get button class
+    getButtonClass(buttonType) {
+        return this.activeButton === buttonType ? 'btnActive' : 'btnSecond';
+    }
+    ngAfterViewChecked() {
+        // Sync viewYear with PrimeNG's internal year when in month view
+        if (this.view === 'month' && this.datepickerRef && this.datepickerRef.currentYear !== undefined) {
+            if (this.viewYear !== this.datepickerRef.currentYear) {
+                // Use setTimeout to avoid ExpressionChangedAfterItHasBeenCheckedError
+                setTimeout(() => {
+                    this.viewYear = this.datepickerRef.currentYear;
+                }, 0);
+            }
+        }
+    }
+    setupHideOverlayOverride() {
+        if (!this.datepickerRef) {
+            return;
+        }
+        // Check if hideOverlay method exists
+        if (!this.datepickerRef.hideOverlay) {
+            return;
+        }
+        // Save the original method only once
+        if (!this.datepickerRef._hideOverlayOriginal) {
+            this.datepickerRef._hideOverlayOriginal = this.datepickerRef.hideOverlay.bind(this.datepickerRef);
+        }
+        // Override the hideOverlay method
+        this.datepickerRef.hideOverlay = () => {
+            // In manual apply mode, prevent auto-close only immediately after date selection
+            if (this.manualApply && this.preventAutoClose) {
+                return;
+            }
+            // In manual apply mode, if closing without Apply button (clicking outside)
+            // Reset temp selection to original value BEFORE closing
+            if (this.manualApply && !this.allowClose) {
+                // Reset temp selection to discard changes
+                this.tempSelection = this.rangeDates;
+                // Update datepicker's internal value
+                this.datepickerRef.value = this.rangeDates;
+            }
+            // Allow closing
+            this.datepickerRef._hideOverlayOriginal();
+        };
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: DatepickerComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.1", type: DatepickerComponent, isStandalone: true, selector: "intelica-datepicker", inputs: { readonlyInput: "readonlyInput", showIcon: "showIcon", numberOfMonths: "numberOfMonths", panelStyleClass: "panelStyleClass", manualApply: "manualApply", customButtons: "customButtons", dateFormat: "dateFormat", view: "view", selectionMode: "selectionMode" }, outputs: { onChangeEvent: "onChange" }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => DatepickerComponent),
+                multi: true,
+            },
+        ], viewQueries: [{ propertyName: "datepickerRef", first: true, predicate: ["datepicker"], descendants: true }], ngImport: i0, template: "<p-datepicker\r\n\t#datepicker\r\n\t[class]=\"panelStyleClass\"\r\n\t[ngModel]=\"internalModel\"\r\n\t(ngModelChange)=\"onModelChange($event)\"\r\n\t[selectionMode]=\"selectionMode\"\r\n\t[numberOfMonths]=\"numberOfMonths\"\r\n\t[readonlyInput]=\"readonlyInput\"\r\n\t[showIcon]=\"showIcon\"\r\n\t[view]=\"view\"\r\n\t[dateFormat]=\"getDateFormat()\"\r\n\t[defaultDate]=\"defaultDate\"\r\n\t(onMonthChange)=\"onMonthChange($event)\"\r\n\t(onYearChange)=\"onYearChange($event)\"\r\n\t(onShow)=\"handleOpen()\"\r\n\t(onHide)=\"handleClose()\"\r\n\t>\r\n\r\n\t<ng-template pTemplate=\"header\">\r\n\t\t<div class=\"prDatapicker__header\">\r\n\t\t\t<div class=\"prDatapicker__content\">\r\n\r\n\t\t\t\t<!-- MES -->\r\n\t\t\t\t<p-select\r\n\t\t\t\t\t*ngIf=\"view === 'date'\"\r\n\t\t\t\t\tclass=\"prSelect\"\r\n\t\t\t\t\t[options]=\"filteredMonths\"\r\n\t\t\t\t\toptionLabel=\"label\"\r\n\t\t\t\t\toptionValue=\"value\"\r\n\t\t\t\t\t[(ngModel)]=\"viewMonth\"\r\n\t\t\t\t\t(ngModelChange)=\"onViewChange()\"\r\n\t\t\t\t\tdropdownIcon=\"icon icon-arrow-down\">\r\n\t\t\t\t</p-select>\r\n\r\n\t\t\t\t<!-- A\u00D1O -->\r\n\t\t\t\t<p-select\r\n\t\t\t\t\t*ngIf=\"view === 'date' || view === 'month'\"\r\n\t\t\t\t\tclass=\"prSelect\"\r\n\t\t\t\t\t[options]=\"years\"\r\n\t\t\t\t\t[(ngModel)]=\"viewYear\"\r\n\t\t\t\t\t(ngModelChange)=\"onViewChange()\"\r\n\t\t\t\t\tdropdownIcon=\"icon icon-arrow-down\"\r\n\t\t\t\t\t[virtualScroll]=\"true\"\r\n\t\t\t\t\t[virtualScrollItemSize]=\"38\">\r\n\t\t\t\t</p-select>\r\n\r\n\t\t\t</div>\r\n\t\t</div>\r\n\t</ng-template>\r\n\t<ng-template pTemplate=\"footer\" *ngIf=\"selectionMode === 'range'\">\r\n\t\t<div class=\"footerDatapicker footerDatapicker--range\">\r\n\t\t\t<div class=\"footerDatapicker__box\">\r\n\t\t\t\t<!-- TODAY button -->\r\n\t\t\t\t<p-button\r\n\t\t\t\t\t*ngIf=\"shouldShowButton(DATEPICKER_BUTTON_TYPES.TODAY)\"\r\n\t\t\t\t\t[class]=\"getButtonClass(DATEPICKER_BUTTON_TYPES.TODAY)\"\r\n\t\t\t\t\tlabel=\"Today\"\r\n\t\t\t\t\t(click)=\"todayCallback($event)\">\r\n\t\t\t\t</p-button>\r\n\t\t\t\t<!-- LAST 12 MONTHS button -->\r\n\t\t\t\t<p-button\r\n\t\t\t\t\t*ngIf=\"shouldShowButton(DATEPICKER_BUTTON_TYPES.LAST_12_MONTHS)\"\r\n\t\t\t\t\t[class]=\"getButtonClass(DATEPICKER_BUTTON_TYPES.LAST_12_MONTHS)\"\r\n\t\t\t\t\tlabel=\"Last 12 months\"\r\n\t\t\t\t\t(click)=\"last12MonthsCallback($event)\">\r\n\t\t\t\t</p-button>\r\n\t\t\t\t<!-- CURRENT YEAR button -->\r\n\t\t\t\t<p-button\r\n\t\t\t\t\t*ngIf=\"shouldShowButton(DATEPICKER_BUTTON_TYPES.CURRENT_YEAR)\"\r\n\t\t\t\t\t[class]=\"getButtonClass(DATEPICKER_BUTTON_TYPES.CURRENT_YEAR)\"\r\n\t\t\t\t\tlabel=\"Current year\"\r\n\t\t\t\t\t(click)=\"currentYearCallback($event)\">\r\n\t\t\t\t</p-button>\r\n\t\t\t\t<!-- CURRENT MONTH button -->\r\n\t\t\t\t<p-button\r\n\t\t\t\t\t*ngIf=\"shouldShowButton(DATEPICKER_BUTTON_TYPES.CURRENT_MONTH)\"\r\n\t\t\t\t\t[class]=\"getButtonClass(DATEPICKER_BUTTON_TYPES.CURRENT_MONTH)\"\r\n\t\t\t\t\tlabel=\"Current month\"\r\n\t\t\t\t\t(click)=\"currentMonthCallback($event)\">\r\n\t\t\t\t</p-button>\r\n\t\t\t</div>\r\n\t\t\t<div class=\"footerDatapicker__box\">\r\n\t\t\t\t<!-- Apply button - shown only in manual apply mode -->\r\n\t\t\t\t<p-button\r\n\t\t\t\t\t*ngIf=\"manualApply\"\r\n\t\t\t\t\tclass=\"btnPrimary\"\r\n\t\t\t\t\tlabel=\"Apply\"\r\n\t\t\t\t\t(click)=\"applyCallback($event)\">\r\n\t\t\t\t</p-button>\r\n\t\t\t\t<!-- Clear button - always shown -->\r\n\t\t\t\t<p-button\r\n\t\t\t\t\tclass=\"btnSecond\"\r\n\t\t\t\t\tlabel=\"Clear\"\r\n\t\t\t\t\t(click)=\"clearCallback($event)\">\r\n\t\t\t\t</p-button>\r\n\t\t\t</div>\r\n\t\t</div>\r\n\t</ng-template>\r\n\r\n</p-datepicker>\r\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: DatePicker, selector: "p-datePicker, p-datepicker, p-date-picker", inputs: ["iconDisplay", "styleClass", "inputStyle", "inputId", "inputStyleClass", "placeholder", "ariaLabelledBy", "ariaLabel", "iconAriaLabel", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "icon", "readonlyInput", "shortYearCutoff", "hourFormat", "timeOnly", "stepHour", "stepMinute", "stepSecond", "showSeconds", "showOnFocus", "showWeek", "startWeekFromFirstDayOfYear", "showClear", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autofocus", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "minDate", "maxDate", "disabledDates", "disabledDays", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "view", "defaultDate", "appendTo"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onClear", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { kind: "ngmodule", type: SelectModule }, { kind: "component", type: i6.Select, selector: "p-select", inputs: ["id", "scrollHeight", "filter", "panelStyle", "styleClass", "panelStyleClass", "readonly", "editable", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "filterValue", "options", "appendTo"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "directive", type: i3$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i2.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "buttonProps", "autofocus", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: DatepickerComponent, decorators: [{
+            type: Component,
+            args: [{ selector: "intelica-datepicker", imports: [CommonModule, FormsModule, DatePicker, SelectModule, ButtonModule], providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => DatepickerComponent),
+                            multi: true,
+                        },
+                    ], template: "<p-datepicker\r\n\t#datepicker\r\n\t[class]=\"panelStyleClass\"\r\n\t[ngModel]=\"internalModel\"\r\n\t(ngModelChange)=\"onModelChange($event)\"\r\n\t[selectionMode]=\"selectionMode\"\r\n\t[numberOfMonths]=\"numberOfMonths\"\r\n\t[readonlyInput]=\"readonlyInput\"\r\n\t[showIcon]=\"showIcon\"\r\n\t[view]=\"view\"\r\n\t[dateFormat]=\"getDateFormat()\"\r\n\t[defaultDate]=\"defaultDate\"\r\n\t(onMonthChange)=\"onMonthChange($event)\"\r\n\t(onYearChange)=\"onYearChange($event)\"\r\n\t(onShow)=\"handleOpen()\"\r\n\t(onHide)=\"handleClose()\"\r\n\t>\r\n\r\n\t<ng-template pTemplate=\"header\">\r\n\t\t<div class=\"prDatapicker__header\">\r\n\t\t\t<div class=\"prDatapicker__content\">\r\n\r\n\t\t\t\t<!-- MES -->\r\n\t\t\t\t<p-select\r\n\t\t\t\t\t*ngIf=\"view === 'date'\"\r\n\t\t\t\t\tclass=\"prSelect\"\r\n\t\t\t\t\t[options]=\"filteredMonths\"\r\n\t\t\t\t\toptionLabel=\"label\"\r\n\t\t\t\t\toptionValue=\"value\"\r\n\t\t\t\t\t[(ngModel)]=\"viewMonth\"\r\n\t\t\t\t\t(ngModelChange)=\"onViewChange()\"\r\n\t\t\t\t\tdropdownIcon=\"icon icon-arrow-down\">\r\n\t\t\t\t</p-select>\r\n\r\n\t\t\t\t<!-- A\u00D1O -->\r\n\t\t\t\t<p-select\r\n\t\t\t\t\t*ngIf=\"view === 'date' || view === 'month'\"\r\n\t\t\t\t\tclass=\"prSelect\"\r\n\t\t\t\t\t[options]=\"years\"\r\n\t\t\t\t\t[(ngModel)]=\"viewYear\"\r\n\t\t\t\t\t(ngModelChange)=\"onViewChange()\"\r\n\t\t\t\t\tdropdownIcon=\"icon icon-arrow-down\"\r\n\t\t\t\t\t[virtualScroll]=\"true\"\r\n\t\t\t\t\t[virtualScrollItemSize]=\"38\">\r\n\t\t\t\t</p-select>\r\n\r\n\t\t\t</div>\r\n\t\t</div>\r\n\t</ng-template>\r\n\t<ng-template pTemplate=\"footer\" *ngIf=\"selectionMode === 'range'\">\r\n\t\t<div class=\"footerDatapicker footerDatapicker--range\">\r\n\t\t\t<div class=\"footerDatapicker__box\">\r\n\t\t\t\t<!-- TODAY button -->\r\n\t\t\t\t<p-button\r\n\t\t\t\t\t*ngIf=\"shouldShowButton(DATEPICKER_BUTTON_TYPES.TODAY)\"\r\n\t\t\t\t\t[class]=\"getButtonClass(DATEPICKER_BUTTON_TYPES.TODAY)\"\r\n\t\t\t\t\tlabel=\"Today\"\r\n\t\t\t\t\t(click)=\"todayCallback($event)\">\r\n\t\t\t\t</p-button>\r\n\t\t\t\t<!-- LAST 12 MONTHS button -->\r\n\t\t\t\t<p-button\r\n\t\t\t\t\t*ngIf=\"shouldShowButton(DATEPICKER_BUTTON_TYPES.LAST_12_MONTHS)\"\r\n\t\t\t\t\t[class]=\"getButtonClass(DATEPICKER_BUTTON_TYPES.LAST_12_MONTHS)\"\r\n\t\t\t\t\tlabel=\"Last 12 months\"\r\n\t\t\t\t\t(click)=\"last12MonthsCallback($event)\">\r\n\t\t\t\t</p-button>\r\n\t\t\t\t<!-- CURRENT YEAR button -->\r\n\t\t\t\t<p-button\r\n\t\t\t\t\t*ngIf=\"shouldShowButton(DATEPICKER_BUTTON_TYPES.CURRENT_YEAR)\"\r\n\t\t\t\t\t[class]=\"getButtonClass(DATEPICKER_BUTTON_TYPES.CURRENT_YEAR)\"\r\n\t\t\t\t\tlabel=\"Current year\"\r\n\t\t\t\t\t(click)=\"currentYearCallback($event)\">\r\n\t\t\t\t</p-button>\r\n\t\t\t\t<!-- CURRENT MONTH button -->\r\n\t\t\t\t<p-button\r\n\t\t\t\t\t*ngIf=\"shouldShowButton(DATEPICKER_BUTTON_TYPES.CURRENT_MONTH)\"\r\n\t\t\t\t\t[class]=\"getButtonClass(DATEPICKER_BUTTON_TYPES.CURRENT_MONTH)\"\r\n\t\t\t\t\tlabel=\"Current month\"\r\n\t\t\t\t\t(click)=\"currentMonthCallback($event)\">\r\n\t\t\t\t</p-button>\r\n\t\t\t</div>\r\n\t\t\t<div class=\"footerDatapicker__box\">\r\n\t\t\t\t<!-- Apply button - shown only in manual apply mode -->\r\n\t\t\t\t<p-button\r\n\t\t\t\t\t*ngIf=\"manualApply\"\r\n\t\t\t\t\tclass=\"btnPrimary\"\r\n\t\t\t\t\tlabel=\"Apply\"\r\n\t\t\t\t\t(click)=\"applyCallback($event)\">\r\n\t\t\t\t</p-button>\r\n\t\t\t\t<!-- Clear button - always shown -->\r\n\t\t\t\t<p-button\r\n\t\t\t\t\tclass=\"btnSecond\"\r\n\t\t\t\t\tlabel=\"Clear\"\r\n\t\t\t\t\t(click)=\"clearCallback($event)\">\r\n\t\t\t\t</p-button>\r\n\t\t\t</div>\r\n\t\t</div>\r\n\t</ng-template>\r\n\r\n</p-datepicker>\r\n" }]
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { readonlyInput: [{
+                type: Input
+            }], showIcon: [{
+                type: Input
+            }], numberOfMonths: [{
+                type: Input
+            }], panelStyleClass: [{
+                type: Input
+            }], manualApply: [{
+                type: Input
+            }], customButtons: [{
+                type: Input
+            }], dateFormat: [{
+                type: Input
+            }], view: [{
+                type: Input
+            }], selectionMode: [{
+                type: Input
+            }], onChangeEvent: [{
+                type: Output,
+                args: ["onChange"]
+            }], datepickerRef: [{
+                type: ViewChild,
+                args: ['datepicker']
+            }] } });
+
 class SkeletonService {
     isLoading = signal(false, ...(ngDevMode ? [{ debugName: "isLoading" }] : []));
     hide() {
@@ -5348,6 +5829,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImpor
                 type: Input
             }] } });
 
+class IntelicaAlertComponent {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: IntelicaAlertComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.1", type: IntelicaAlertComponent, isStandalone: true, selector: "intelica-alert", ngImport: i0, template: "<p-confirmDialog key=\"intelica-alert-dialog\" [style]=\"{width: 'auto', 'max-width': '90cw'}\" [closable]=\"false\"\r\n    [visible]=\"undefined\">\r\n    <!-- \r\n        We use the headless template. \r\n        'message' contains the confirmation object.\r\n        'message.data' contains our custom 'presentationData' object from AlertService.\r\n    -->\r\n    <ng-template pTemplate=\"headless\" let-message let-onAccept=\"onAccept\" let-onReject=\"onReject\">\r\n        <div [style]=\"message.data.dialogStyle\"\r\n            style=\"background: white; display: flex; flex-direction: column; align-items: center; padding: 2rem; position: relative; text-align: center;\">\r\n\r\n            <!-- Close Button -->\r\n            @if (message.data.config.showCloseButton) {\r\n            <button type=\"button\"\r\n                style=\"position: absolute; top: 0.75rem; right: 0.75rem; background: transparent; border: none; cursor: pointer; padding: 0.5rem; border-radius: 50%; display: flex; align-items: center; justify-content: center; transition: background-color 0.2s;\"\r\n                (click)=\"onReject()\" aria-label=\"Cerrar\">\r\n                <i class=\"pi pi-times\" style=\"font-size: 1.25rem; color: #6c757d;\"></i>\r\n            </button>\r\n            }\r\n\r\n            <!-- Icon -->\r\n            <div [style.backgroundColor]=\"message.data.iconBackgroundColor\"\r\n                style=\"width: 80px; height: 80px; border-radius: 50%; display: flex; align-items: center; justify-content: center; margin-bottom: 1.5rem;\">\r\n                @if (message.data.config.customImageUrl) {\r\n                <img [src]=\"message.data.config.customImageUrl\" style=\"width: 60px; height: 60px; object-fit: contain;\"\r\n                    alt=\"Alert icon\" />\r\n                } @else {\r\n                <i [class]=\"message.data.iconClass\" [style.color]=\"message.data.iconColor\"\r\n                    style=\"font-size: 2.5rem;\"></i>\r\n                }\r\n            </div>\r\n\r\n            <!-- Title -->\r\n            <h2 [style.color]=\"message.data.titleColor\"\r\n                style=\"margin: 0 0 0.75rem 0; font-size: 1.5rem; font-weight: 600;\">{{ message.header }}</h2>\r\n\r\n            <!-- Subtitle / Message -->\r\n            @if (message.message) {\r\n            <p [style.color]=\"message.data.config.styles?.subtitleColor ?? '#555'\"\r\n                style=\"margin: 0 0 1.5rem 0; font-size: 1rem; line-height: 1.5;\">{{ message.message }}</p>\r\n            }\r\n\r\n            <!-- HTML Content -->\r\n            @if (message.data.config.htmlContent) {\r\n            <div [innerHTML]=\"message.data.config.htmlContent\"\r\n                [style.color]=\"message.data.config.styles?.subtitleColor ?? '#555'\"\r\n                style=\"margin-bottom: 1.5rem; width: 100%;\"></div>\r\n            }\r\n\r\n            <!-- Buttons -->\r\n            <div style=\"display: flex; gap: 0.75rem; justify-content: center; width: 100%; margin-top: 0.5rem;\">\r\n                <!-- Cancel Button -->\r\n                @if (message.data.showCancelButton) {\r\n                <p-button [label]=\"message.data.cancelText\" [style]=\"message.data.cancelButtonStyle\"\r\n                    severity=\"secondary\" [outlined]=\"true\" (onClick)=\"onReject()\" />\r\n                }\r\n                <!-- Confirm Button -->\r\n                <p-button [label]=\"message.data.confirmText\" [style]=\"message.data.confirmButtonStyle\"\r\n                    (onClick)=\"onAccept()\" />\r\n            </div>\r\n        </div>\r\n    </ng-template>\r\n</p-confirmDialog>\r\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ConfirmDialogModule }, { kind: "component", type: i1$3.ConfirmDialog, selector: "p-confirmDialog, p-confirmdialog, p-confirm-dialog", inputs: ["header", "icon", "message", "style", "styleClass", "maskStyleClass", "acceptIcon", "acceptLabel", "closeAriaLabel", "acceptAriaLabel", "acceptVisible", "rejectIcon", "rejectLabel", "rejectAriaLabel", "rejectVisible", "acceptButtonStyleClass", "rejectButtonStyleClass", "closeOnEscape", "dismissableMask", "blockScroll", "rtl", "closable", "appendTo", "key", "autoZIndex", "baseZIndex", "transitionOptions", "focusTrap", "defaultFocus", "breakpoints", "visible", "position", "draggable"], outputs: ["onHide"] }, { kind: "directive", type: i3$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i2.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "buttonProps", "autofocus", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: IntelicaAlertComponent, decorators: [{
+            type: Component,
+            args: [{ selector: "intelica-alert", standalone: true, imports: [CommonModule, ConfirmDialogModule, ButtonModule], template: "<p-confirmDialog key=\"intelica-alert-dialog\" [style]=\"{width: 'auto', 'max-width': '90cw'}\" [closable]=\"false\"\r\n    [visible]=\"undefined\">\r\n    <!-- \r\n        We use the headless template. \r\n        'message' contains the confirmation object.\r\n        'message.data' contains our custom 'presentationData' object from AlertService.\r\n    -->\r\n    <ng-template pTemplate=\"headless\" let-message let-onAccept=\"onAccept\" let-onReject=\"onReject\">\r\n        <div [style]=\"message.data.dialogStyle\"\r\n            style=\"background: white; display: flex; flex-direction: column; align-items: center; padding: 2rem; position: relative; text-align: center;\">\r\n\r\n            <!-- Close Button -->\r\n            @if (message.data.config.showCloseButton) {\r\n            <button type=\"button\"\r\n                style=\"position: absolute; top: 0.75rem; right: 0.75rem; background: transparent; border: none; cursor: pointer; padding: 0.5rem; border-radius: 50%; display: flex; align-items: center; justify-content: center; transition: background-color 0.2s;\"\r\n                (click)=\"onReject()\" aria-label=\"Cerrar\">\r\n                <i class=\"pi pi-times\" style=\"font-size: 1.25rem; color: #6c757d;\"></i>\r\n            </button>\r\n            }\r\n\r\n            <!-- Icon -->\r\n            <div [style.backgroundColor]=\"message.data.iconBackgroundColor\"\r\n                style=\"width: 80px; height: 80px; border-radius: 50%; display: flex; align-items: center; justify-content: center; margin-bottom: 1.5rem;\">\r\n                @if (message.data.config.customImageUrl) {\r\n                <img [src]=\"message.data.config.customImageUrl\" style=\"width: 60px; height: 60px; object-fit: contain;\"\r\n                    alt=\"Alert icon\" />\r\n                } @else {\r\n                <i [class]=\"message.data.iconClass\" [style.color]=\"message.data.iconColor\"\r\n                    style=\"font-size: 2.5rem;\"></i>\r\n                }\r\n            </div>\r\n\r\n            <!-- Title -->\r\n            <h2 [style.color]=\"message.data.titleColor\"\r\n                style=\"margin: 0 0 0.75rem 0; font-size: 1.5rem; font-weight: 600;\">{{ message.header }}</h2>\r\n\r\n            <!-- Subtitle / Message -->\r\n            @if (message.message) {\r\n            <p [style.color]=\"message.data.config.styles?.subtitleColor ?? '#555'\"\r\n                style=\"margin: 0 0 1.5rem 0; font-size: 1rem; line-height: 1.5;\">{{ message.message }}</p>\r\n            }\r\n\r\n            <!-- HTML Content -->\r\n            @if (message.data.config.htmlContent) {\r\n            <div [innerHTML]=\"message.data.config.htmlContent\"\r\n                [style.color]=\"message.data.config.styles?.subtitleColor ?? '#555'\"\r\n                style=\"margin-bottom: 1.5rem; width: 100%;\"></div>\r\n            }\r\n\r\n            <!-- Buttons -->\r\n            <div style=\"display: flex; gap: 0.75rem; justify-content: center; width: 100%; margin-top: 0.5rem;\">\r\n                <!-- Cancel Button -->\r\n                @if (message.data.showCancelButton) {\r\n                <p-button [label]=\"message.data.cancelText\" [style]=\"message.data.cancelButtonStyle\"\r\n                    severity=\"secondary\" [outlined]=\"true\" (onClick)=\"onReject()\" />\r\n                }\r\n                <!-- Confirm Button -->\r\n                <p-button [label]=\"message.data.confirmText\" [style]=\"message.data.confirmButtonStyle\"\r\n                    (onClick)=\"onAccept()\" />\r\n            </div>\r\n        </div>\r\n    </ng-template>\r\n</p-confirmDialog>\r\n" }]
+        }] });
+
 class CheckboxFilterDirective extends FilterDirective {
     constructor() {
         super(FilterTypeEnum.Checkbox);
@@ -5814,6 +6304,50 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImpor
                 args: ["onChange", ["$event"]]
             }] } });
 
+/**
+ * Default configuration values for alerts.
+ */
+const ALERT_DEFAULTS = {
+    buttonMode: AlertButtonMode.OK_ONLY,
+    showCloseButton: true,
+    buttons: {
+        confirmText: "Ok",
+        cancelText: "Cancelar",
+    },
+};
+/**
+ * Paths to custom SVG icons for alerts.
+ * Icons should be placed in: public/assets/icons/alerts/
+ */
+const ALERT_ICON_PATHS = {
+    error: "/assets/icons/alerts/alert-error.svg",
+    // warning: "/assets/icons/alerts/alert-warning.svg",
+    // success: "/assets/icons/alerts/alert-success.svg",
+};
+/**
+ * Centralized configuration for each alert type using PrimeNG icons.
+ */
+const ALERT_TYPE_CONFIG = {
+    [AlertType.WARNING]: {
+        titleColor: "#f0ad4e",
+        icon: "pi pi-exclamation-triangle",
+        iconBackgroundColor: "#fff3cd",
+        iconColor: "#f0ad4e",
+    },
+    [AlertType.SUCCESS]: {
+        titleColor: "#5cb85c",
+        icon: "pi pi-check-circle",
+        iconBackgroundColor: "#d4edda",
+        iconColor: "#5cb85c",
+    },
+    [AlertType.ERROR]: {
+        titleColor: "#d9534f",
+        icon: "pi pi-times-circle",
+        iconBackgroundColor: "#f8d7da",
+        iconColor: "#d9534f",
+    },
+};
+
 class HtmlToExcelService {
     ExportTOExcel(idTabla, html, filename, tabname, extension) {
         let Table = document.getElementById(idTabla);
@@ -6207,6 +6741,239 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImpor
                 }]
         }] });
 
+class AlertService {
+    confirmationService = inject(ConfirmationService);
+    DIALOG_KEY = 'intelica-alert-dialog';
+    /**
+     * Displays a warning alert with yellow styling.
+     * Can be called with (title, subtitle, buttonMode, buttons) OR (title, subtitle, buttons).
+     */
+    warning(title, subtitle, modeOrButtons, buttons) {
+        const { buttonMode, buttonConfig } = this.resolveArgs(modeOrButtons, buttons);
+        return this.show({
+            type: AlertType.WARNING,
+            title,
+            subtitle,
+            buttonMode,
+            buttons: buttonConfig,
+        });
+    }
+    /**
+     * Displays a success alert with green styling.
+     * Can be called with (title, subtitle, buttonMode, buttons) OR (title, subtitle, buttons).
+     */
+    success(title, subtitle, modeOrButtons, buttons) {
+        const { buttonMode, buttonConfig } = this.resolveArgs(modeOrButtons, buttons);
+        return this.show({
+            type: AlertType.SUCCESS,
+            title,
+            subtitle,
+            buttonMode,
+            buttons: buttonConfig,
+        });
+    }
+    /**
+     * Displays an error alert with red styling.
+     * Can be called with (title, subtitle, buttonMode, buttons) OR (title, subtitle, buttons).
+     */
+    error(title, subtitle, modeOrButtons, buttons) {
+        const { buttonMode, buttonConfig } = this.resolveArgs(modeOrButtons, buttons);
+        return this.show({
+            type: AlertType.ERROR,
+            title,
+            subtitle,
+            buttonMode,
+            buttons: buttonConfig,
+        });
+    }
+    /**
+     * Helper to resolve flexible arguments.
+     * If 3rd arg is object (not string enum), treat it as buttons config and default mode to OK_ONLY.
+     * If 3rd arg is string (enum), treat it as mode and 4th as buttons config.
+     */
+    resolveArgs(modeOrButtons, buttons) {
+        if (modeOrButtons && typeof modeOrButtons === 'object') {
+            // USAGE: success(title, subtitle, { confirmText: 'Ok', cancelText: 'Cancel' })
+            // Auto-detect mode based on presence of cancelText
+            const hasCancel = !!modeOrButtons.cancelText;
+            return {
+                buttonMode: hasCancel ? AlertButtonMode.CONFIRM_CANCEL : AlertButtonMode.OK_ONLY,
+                buttonConfig: modeOrButtons
+            };
+        }
+        // USAGE: success(title, subtitle, AlertButtonMode.CONFIRM_CANCEL, { ... })
+        // OR default
+        return {
+            buttonMode: modeOrButtons ?? AlertButtonMode.OK_ONLY,
+            buttonConfig: buttons
+        };
+    }
+    message(message, type = AlertType.WARNING) {
+        return this.show({
+            type,
+            title: message,
+            buttonMode: AlertButtonMode.OK_ONLY,
+        });
+    }
+    confirm(title, subtitle, confirmText = "Confirmar", cancelText = "Cancelar", type = AlertType.WARNING) {
+        return this.show({
+            type,
+            title,
+            subtitle,
+            buttonMode: AlertButtonMode.CONFIRM_CANCEL,
+            buttons: { confirmText, cancelText },
+        });
+    }
+    showHtml(title, htmlContent, type = AlertType.WARNING, buttonMode = AlertButtonMode.OK_ONLY) {
+        return this.show({
+            type,
+            title,
+            htmlContent,
+            buttonMode,
+        });
+    }
+    showWithStyles(config, styles) {
+        return this.show({
+            ...config,
+            styles,
+        });
+    }
+    show(config) {
+        return new Promise((resolve) => {
+            const mergedConfig = this.mergeWithDefaults(config);
+            const typeConfig = ALERT_TYPE_CONFIG[mergedConfig.type];
+            // Prepare data object for the view
+            const data = {
+                config: mergedConfig,
+                typeConfig: typeConfig,
+                iconClass: this.getIconClass(mergedConfig, typeConfig),
+                iconBackgroundColor: this.getIconBackgroundColor(mergedConfig, typeConfig),
+                iconColor: this.getIconColor(mergedConfig, typeConfig),
+                titleColor: this.getTitleColor(mergedConfig, typeConfig),
+                showCancelButton: this.showCancelButton(mergedConfig),
+                confirmText: this.getConfirmText(mergedConfig),
+                cancelText: this.getCancelText(mergedConfig),
+                dialogStyle: {
+                    width: mergedConfig.styles?.width ?? "400px",
+                    maxWidth: "90vw",
+                    borderRadius: "12px",
+                    overflow: "hidden",
+                },
+                confirmButtonStyle: this.getConfirmButtonStyle(mergedConfig),
+                cancelButtonStyle: this.getCancelButtonStyle(mergedConfig),
+                // Add manual dismiss handler to data so template can call it if needed, 
+                // though explicit close button in template can just use reject or logic.
+                // For custom headers/X buttons usually we initiate close.
+            };
+            const confirmation = {
+                key: this.DIALOG_KEY,
+                message: mergedConfig.subtitle,
+                header: mergedConfig.title,
+                icon: data.iconClass,
+                dismissableMask: true,
+                closeOnEscape: true,
+                accept: () => {
+                    resolve({
+                        isConfirmed: true,
+                        isCancelled: false,
+                        isDismissed: false,
+                    });
+                },
+                reject: (type) => {
+                    resolve({
+                        isConfirmed: false,
+                        isCancelled: true,
+                        isDismissed: false,
+                    });
+                },
+            };
+            // Cast to any to allow 'data' property if it doesn't exist on type
+            confirmation.data = data;
+            this.confirmationService.confirm(confirmation);
+        });
+    }
+    // Private Helper Methods (Presentation Logic)
+    mergeWithDefaults(config) {
+        return {
+            ...ALERT_DEFAULTS,
+            ...config,
+            buttons: {
+                ...ALERT_DEFAULTS.buttons,
+                ...config.buttons,
+            },
+        };
+    }
+    getIconClass(config, typeConfig) {
+        if (config?.customIcon) {
+            return config.customIcon;
+        }
+        return typeConfig?.icon ?? "pi pi-info-circle";
+    }
+    getIconBackgroundColor(config, typeConfig) {
+        if (config?.styles?.iconBackgroundColor) {
+            return config.styles.iconBackgroundColor;
+        }
+        return typeConfig?.iconBackgroundColor ?? "#e3f2fd";
+    }
+    getIconColor(config, typeConfig) {
+        if (config?.styles?.iconColor) {
+            return config.styles.iconColor;
+        }
+        return typeConfig?.iconColor ?? "#1976d2";
+    }
+    getTitleColor(config, typeConfig) {
+        if (config?.styles?.titleColor) {
+            return config.styles.titleColor;
+        }
+        return typeConfig?.titleColor ?? "#333";
+    }
+    showCancelButton(config) {
+        return config?.buttonMode === AlertButtonMode.CONFIRM_CANCEL;
+    }
+    getConfirmText(config) {
+        return config?.buttons?.confirmText ?? "Ok";
+    }
+    getCancelText(config) {
+        return config?.buttons?.cancelText ?? "Cancelar";
+    }
+    getConfirmButtonStyle(config) {
+        const styles = config?.styles;
+        const baseStyle = {
+            minWidth: "120px",
+        };
+        if (styles?.confirmButtonColor) {
+            baseStyle["backgroundColor"] = styles.confirmButtonColor;
+            baseStyle["borderColor"] = styles.confirmButtonColor;
+        }
+        if (styles?.confirmButtonTextColor) {
+            baseStyle["color"] = styles.confirmButtonTextColor;
+        }
+        return baseStyle;
+    }
+    getCancelButtonStyle(config) {
+        const styles = config?.styles;
+        const baseStyle = {
+            minWidth: "120px",
+        };
+        if (styles?.cancelButtonColor) {
+            baseStyle["backgroundColor"] = styles.cancelButtonColor;
+            baseStyle["borderColor"] = styles.cancelButtonColor;
+        }
+        if (styles?.cancelButtonTextColor) {
+            baseStyle["color"] = styles.cancelButtonTextColor;
+        }
+        return baseStyle;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: AlertService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: AlertService, providedIn: "root" });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.1", ngImport: i0, type: AlertService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: "root",
+                }]
+        }] });
+
 class LanguageService {
     _http = inject(HttpClient);
     _configService = inject(ConfigService);
@@ -6506,19 +7273,19 @@ class EchartService {
                     lines.push(current);
                 return prefix + lines.map((ln, i) => (i === 0 ? ln : `${sangria}${ln}`)).join('\n');
             };
-            y.inverse = true;
-            y.axisLabel = {
-                ...y.axisLabel,
-                color: Color.blue,
-                fontSize: 12,
-                width: categoryWidth,
-                overflow: "break",
-                align: "left",
-                verticalAlign: "middle",
-                margin: categoryWidth + 30,
-                lineHeight: 16,
-                formatter: categoryFormatter || defaultCategoryFormatter,
-            };
+            // y.inverse = true;
+            // y.axisLabel = {
+            // 	...y.axisLabel,
+            // 	color: Color.blue,
+            // 	fontSize: 12,
+            // 	width: categoryWidth,
+            // 	overflow: "break",
+            // 	align: "left",
+            // 	verticalAlign: "middle",
+            // 	margin: categoryWidth + 30,
+            // 	lineHeight: 16,
+            // 	formatter: categoryFormatter || defaultCategoryFormatter,
+            // };
             gr.top = "0%";
             gr.left = -1 * categoryWidth + 60;
             gr.right = 20;
@@ -9190,5 +9957,5 @@ const IntelicaTheme = definePreset(Aura, {
  * Generated bundle index. Do not edit.
  */
 
-export { ActionDirective, ActionsMenuComponent, ButtonSplitComponent, CheckboxFilterDirective, Color, ColumnComponent, ColumnGroupComponent, CompareByField, ConfigService, CookieAttributesGeneral, DataDirective, DateFilterDirective, DateModeOptions, DynamicInputValidation, EchartComponent, EchartService, ElementService, EmailInputValidation, ErrorInterceptor, FeatureFlagService, FilterChipsComponent, FiltersComponent, FormatAmountPipe, GetCookieAttributes, GlobalFeatureFlagService, GlobalTermService, HtmlToExcelService, InitializeConfigService, InputValidation, IntelicaCellCheckboxDirective, IntelicaTheme, ItemSplitDirective, LanguageService, MatrixColumnComponent, MatrixColumnGroupComponent, MatrixTableComponent, ModalDialogComponent, MultiSelectComponent, OrderConstants, PaginatorComponent, Patterns, PopoverComponent, ProfileService, RecordPerPageComponent, RefreshTokenInterceptor, RouteGuard, RowResumenComponent, RowResumenTreeComponent, SearchComponent, SelectDetailFilterDirective, SelectFilterDirective, SharedService, SkeletonChartComponent, SkeletonComponent, SkeletonService, SkeletonTableComponent, SortingComponent, SpinnerComponent, SpinnerService, SweetAlertService, TableComponent, TableFetchComponent, TableSortOrder, TemplateDirective, TemplateMenuComponent, TermGuard, TermPipe, TermService, TextAreaFilterDirective, TextFilterDirective, TextRangeFilterDirective, TreeColumnComponent, TreeColumnGroupComponent, TreeTableComponent, TruncatePipe, decryptData, encryptData, getColor };
+export { ALERT_DEFAULTS, ALERT_ICON_PATHS, ALERT_TYPE_CONFIG, ActionDirective, ActionsMenuComponent, AlertButtonMode, AlertService, AlertType, ButtonSplitComponent, CheckboxFilterDirective, Color, ColumnComponent, ColumnGroupComponent, CompareByField, ConfigService, CookieAttributesGeneral, DATEPICKER_BUTTON_TYPES, DataDirective, DateFilterDirective, DateModeOptions, DatepickerComponent, DynamicInputValidation, EchartComponent, EchartService, ElementService, EmailInputValidation, ErrorInterceptor, FeatureFlagService, FilterChipsComponent, FiltersComponent, FormatAmountPipe, GetCookieAttributes, GlobalFeatureFlagService, GlobalTermService, HtmlToExcelService, InitializeConfigService, InputValidation, IntelicaAlertComponent, IntelicaCellCheckboxDirective, IntelicaTheme, ItemSplitDirective, LanguageService, MatrixColumnComponent, MatrixColumnGroupComponent, MatrixTableComponent, ModalDialogComponent, MultiSelectComponent, OrderConstants, PaginatorComponent, Patterns, PopoverComponent, ProfileService, RecordPerPageComponent, RefreshTokenInterceptor, RouteGuard, RowResumenComponent, RowResumenTreeComponent, SearchComponent, SelectDetailFilterDirective, SelectFilterDirective, SharedService, SkeletonChartComponent, SkeletonComponent, SkeletonService, SkeletonTableComponent, SortingComponent, SpinnerComponent, SpinnerService, SweetAlertService, TableComponent, TableFetchComponent, TableSortOrder, TemplateDirective, TemplateMenuComponent, TermGuard, TermPipe, TermService, TextAreaFilterDirective, TextFilterDirective, TextRangeFilterDirective, TreeColumnComponent, TreeColumnGroupComponent, TreeTableComponent, TruncatePipe, decryptData, encryptData, getColor };
 //# sourceMappingURL=intelica-library-components.mjs.map