@c80/ui 1.0.57 → 1.0.62

package/esm2022/lib/modal/modal.component.js

@@ -2,11 +2,17 @@ import { Component, computed, effect, inject, ChangeDetectionStrategy } from '@a
 import { ModalService } from './modal.service';
 import { IconComponent } from './../icon';
 import * as i0 from "@angular/core";
+/**
+ *
+ */
 export class ModalComponent {
     modalService = inject(ModalService);
     isOpen = this.modalService.modalState.isOpen;
     config = this.modalService.modalState.config;
     isVisible = computed(() => this.isOpen(), ...(ngDevMode ? [{ debugName: "isVisible" }] : []));
+    /**
+     *
+     */
     constructor() {
         effect(() => {
             if (this.isOpen()) {
@@ -21,26 +27,49 @@ export class ModalComponent {
             }
         });
     }
+    /**
+     * Maneja la confirmación del modal
+     */
     onConfirm() {
         this.modalService.handleResult({ action: 'confirm', confirmed: true });
     }
+    /**
+     * Maneja la cancelación del modal
+     */
     onCancel() {
         this.modalService.handleResult({ action: 'cancel', confirmed: false });
     }
+    /**
+     * Maneja la respuesta afirmativa del modal
+     */
     onYes() {
         this.modalService.handleResult({ action: 'yes', confirmed: true });
     }
+    /**
+     * Maneja la respuesta negativa del modal
+     */
     onNo() {
         this.modalService.handleResult({ action: 'no', confirmed: false });
     }
+    /**
+     * Cierra el modal actual
+     */
     closeModal() {
         this.modalService.closeModal();
     }
+    /**
+     * Maneja el clic en el backdrop del modal
+     * @param event - Evento de clic
+     */
     onBackdropClick(event) {
         if (event.target === event.currentTarget) {
             this.closeModal();
         }
     }
+    /**
+     *
+     * @returns Clase CSS del botón primario según el tipo de modal
+     */
     getPrimaryButtonClass() {
         const configValue = this.config();
         switch (configValue.type) {
@@ -55,33 +84,61 @@ export class ModalComponent {
                 return 'btn-info';
         }
     }
+    /**
+     *
+     * @returns true si debe mostrar botones Sí/No
+     */
     showYesNoButtons() {
         return this.config().type === 'yesNo';
     }
+    /**
+     *
+     * @returns true si debe mostrar botones Confirmar/Cancelar
+     */
     showConfirmButtons() {
         const type = this.config().type;
         return type === 'confirm' || type === 'warning' || type === 'error';
     }
+    /**
+     *
+     * @returns true si debe mostrar botón OK
+     */
     showOkButton() {
         return this.config().type === 'info';
     }
+    /**
+     *
+     * @returns Texto del botón de confirmación
+     */
     getConfirmText() {
         return this.config().confirmText ?? 'Confirmar';
     }
+    /**
+     *
+     * @returns Texto del botón de cancelar
+     */
     getCancelText() {
         return this.config().cancelText ?? 'Cancelar';
     }
+    /**
+     *
+     * @returns Texto del botón Sí
+     */
     getYesText() {
         return this.config().yesText ?? 'Sí';
     }
+    /**
+     *
+     * @returns Texto del botón No
+     */
     getNoText() {
         return this.config().noText ?? 'No';
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: ModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.10", type: ModalComponent, isStandalone: true, selector: "c80-modal", ngImport: i0, template: "<!-- Modal Backdrop -->\n@if (isOpen()) {\n<div class=\"modal-backdrop\" [class.show]=\"isVisible()\" tabindex=\"-1\" (click)=\"onBackdropClick($event)\" (keydown.escape)=\"closeModal()\">\n\n  <!-- Modal Container -->\n  <dialog class=\"modal-container\" [class.show]=\"isVisible()\" [attr.aria-labelledby]=\"'modal-title'\" [open]=\"isVisible()\">\n\n    <!-- Modal Header -->\n    <div class=\"modal-header\">\n      <h4 class=\"modal-title\" id=\"modal-title\">{{ config().title }}</h4>\n      <c80-icon [button]=\"true\" icon=\"close\" (iconClick)=\"closeModal()\" title=\"Cerrar\" color=\"warn\" />\n    </div>\n\n    <!-- Modal Body -->\n    <div class=\"modal-body\">\n      <p class=\"modal-message\">{{ config().message }}</p>\n    </div>\n\n    <!-- Modal Footer -->\n    <div class=\"modal-footer\">\n\n      <!-- Info Modal - Solo OK -->\n      @if (showOkButton()) {\n      <c80-icon [button]=\"true\" icon=\"check\" textRight=\"OK\" (iconClick)=\"onConfirm()\" [border]=\"true\" />\n      }\n\n      <!-- Yes/No Modal -->\n      @if (showYesNoButtons()) {\n      <c80-icon [button]=\"true\" icon=\"check\" [textRight]=\"getYesText()\" (iconClick)=\"onYes()\" [border]=\"true\" />\n      <c80-icon [button]=\"true\" icon=\"cancel\" [textRight]=\"getNoText()\" color=\"warn\" (iconClick)=\"onNo()\" [border]=\"true\" />\n      }\n\n      <!-- Confirm Modal -->\n      @if (showConfirmButtons()) {\n      <c80-icon [button]=\"true\" icon=\"check\" [textRight]=\"getConfirmText()\" (iconClick)=\"onConfirm()\" [border]=\"true\" />\n      <c80-icon [button]=\"true\" icon=\"cancel\" [textRight]=\"getCancelText()\" color=\"warn\" (iconClick)=\"onCancel()\" [border]=\"true\" />\n      }\n\n    </div>\n  </dialog>\n</div>\n}", styles: [".modal-backdrop{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#00000080;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);z-index:1100;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .2s ease-in-out;outline:none}.modal-backdrop.show{opacity:1}.modal-container{background:var(--color-bg-primary);border-radius:8px;box-shadow:0 4px 20px #00000026;border:1px solid var(--color-border-default);max-width:400px;width:90%;max-height:90vh;overflow:hidden;transform:scale(.9) translateY(-10px);transition:all .15s ease-out;position:relative;padding:0}.modal-container.show{transform:scale(1) translateY(0)}.modal-container::backdrop{background:transparent}.modal-header{display:flex;align-items:center;gap:8px;padding:16px 20px 12px;border-bottom:1px solid var(--color-border-default);background:var(--color-bg-secondary)}.modal-header .modal-title{flex:1;margin:0;font-size:16px;font-weight:600;color:var(--color-text-primary);line-height:1.3}.modal-body{padding:16px 20px}.modal-body .modal-message{margin:0;font-size:14px;line-height:1.5;color:var(--color-text-primary);white-space:pre-line}.modal-footer{display:flex;justify-content:flex-end;gap:8px;padding:12px 20px 16px;background:var(--color-bg-secondary);border-top:1px solid var(--color-border-default)}@media(max-width:768px){.modal-container{width:95%;margin:10px}.modal-header{padding:12px 16px 8px}.modal-header .modal-title{font-size:15px}.modal-body{padding:12px 16px}.modal-body .modal-message{font-size:13px}.modal-footer{padding:8px 16px 12px;flex-direction:column}}\n"], dependencies: [{ kind: "component", type: IconComponent, selector: "c80-icon", inputs: ["icon", "color", "customColor", "disabled", "size", "button", "border", "type", "textLeft", "textRight", "dark"], outputs: ["iconClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.10", type: ModalComponent, isStandalone: true, selector: "c80-modal", ngImport: i0, template: "<!-- Modal Backdrop -->\n@if (isOpen()) {\n<div class=\"modal-backdrop\" [class.show]=\"isVisible()\" tabindex=\"-1\" (click)=\"onBackdropClick($event)\" (keydown.escape)=\"closeModal()\">\n\n  <!-- Modal Container -->\n  <dialog class=\"modal-container\" [class.show]=\"isVisible()\" [attr.aria-labelledby]=\"'modal-title'\" [open]=\"isVisible()\">\n\n    <!-- Modal Header -->\n    <div class=\"modal-header\">\n      <h4 class=\"modal-title\" id=\"modal-title\">{{ config().title }}</h4>\n      <c80-icon [button]=\"true\" icon=\"close\" (iconClick)=\"closeModal()\" title=\"Cerrar\" />\n    </div>\n\n    <!-- Modal Body -->\n    <div class=\"modal-body\">\n      <p class=\"modal-message\">{{ config().message }}</p>\n    </div>\n\n    <!-- Modal Footer -->\n    <div class=\"modal-footer\">\n\n      <!-- Info Modal - Solo OK -->\n      @if (showOkButton()) {\n      <c80-icon [button]=\"true\" icon=\"check\" textRight=\"OK\" (iconClick)=\"onConfirm()\" [border]=\"true\" />\n      }\n\n      <!-- Yes/No Modal -->\n      @if (showYesNoButtons()) {\n      <c80-icon [button]=\"true\" icon=\"check\" [textRight]=\"getYesText()\" (iconClick)=\"onYes()\" [border]=\"true\" />\n      <c80-icon [button]=\"true\" icon=\"cancel\" [textRight]=\"getNoText()\" (iconClick)=\"onNo()\" [border]=\"true\" />\n      }\n\n      <!-- Confirm Modal -->\n      @if (showConfirmButtons()) {\n      <c80-icon [button]=\"true\" icon=\"check\" [textRight]=\"getConfirmText()\" (iconClick)=\"onConfirm()\" [border]=\"true\" />\n      <c80-icon [button]=\"true\" icon=\"cancel\" [textRight]=\"getCancelText()\" (iconClick)=\"onCancel()\" [border]=\"true\" />\n      }\n\n    </div>\n  </dialog>\n</div>\n}", styles: [".modal-backdrop{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#00000080;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);z-index:1100;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .2s ease-in-out;outline:none}.modal-backdrop.show{opacity:1}.modal-container{background:var(--color-bg-primary);border-radius:8px;box-shadow:0 4px 20px #00000026;border:1px solid var(--color-border-default);max-width:400px;width:90%;max-height:90vh;overflow:hidden;transform:scale(.9) translateY(-10px);transition:all .15s ease-out;position:relative;padding:0}.modal-container.show{transform:scale(1) translateY(0)}.modal-container::backdrop{background:transparent}.modal-header{display:flex;align-items:center;gap:8px;padding:16px 20px 12px;border-bottom:1px solid var(--color-border-default);background:var(--color-bg-secondary)}.modal-header .modal-title{flex:1;margin:0;font-size:16px;font-weight:600;color:var(--color-text-primary);line-height:1.3}.modal-body{padding:16px 20px}.modal-body .modal-message{margin:0;font-size:14px;line-height:1.5;color:var(--color-text-primary);white-space:pre-line}.modal-footer{display:flex;justify-content:flex-end;gap:8px;padding:12px 20px 16px;background:var(--color-bg-secondary);border-top:1px solid var(--color-border-default)}@media(max-width:768px){.modal-container{width:95%;margin:10px}.modal-header{padding:12px 16px 8px}.modal-header .modal-title{font-size:15px}.modal-body{padding:12px 16px}.modal-body .modal-message{font-size:13px}.modal-footer{padding:8px 16px 12px;flex-direction:column}}\n"], dependencies: [{ kind: "component", type: IconComponent, selector: "c80-icon", inputs: ["icon", "color", "customColor", "disabled", "size", "button", "border", "type", "textLeft", "textRight", "dark"], outputs: ["iconClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: ModalComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'c80-modal', standalone: true, imports: [IconComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<!-- Modal Backdrop -->\n@if (isOpen()) {\n<div class=\"modal-backdrop\" [class.show]=\"isVisible()\" tabindex=\"-1\" (click)=\"onBackdropClick($event)\" (keydown.escape)=\"closeModal()\">\n\n  <!-- Modal Container -->\n  <dialog class=\"modal-container\" [class.show]=\"isVisible()\" [attr.aria-labelledby]=\"'modal-title'\" [open]=\"isVisible()\">\n\n    <!-- Modal Header -->\n    <div class=\"modal-header\">\n      <h4 class=\"modal-title\" id=\"modal-title\">{{ config().title }}</h4>\n      <c80-icon [button]=\"true\" icon=\"close\" (iconClick)=\"closeModal()\" title=\"Cerrar\" color=\"warn\" />\n    </div>\n\n    <!-- Modal Body -->\n    <div class=\"modal-body\">\n      <p class=\"modal-message\">{{ config().message }}</p>\n    </div>\n\n    <!-- Modal Footer -->\n    <div class=\"modal-footer\">\n\n      <!-- Info Modal - Solo OK -->\n      @if (showOkButton()) {\n      <c80-icon [button]=\"true\" icon=\"check\" textRight=\"OK\" (iconClick)=\"onConfirm()\" [border]=\"true\" />\n      }\n\n      <!-- Yes/No Modal -->\n      @if (showYesNoButtons()) {\n      <c80-icon [button]=\"true\" icon=\"check\" [textRight]=\"getYesText()\" (iconClick)=\"onYes()\" [border]=\"true\" />\n      <c80-icon [button]=\"true\" icon=\"cancel\" [textRight]=\"getNoText()\" color=\"warn\" (iconClick)=\"onNo()\" [border]=\"true\" />\n      }\n\n      <!-- Confirm Modal -->\n      @if (showConfirmButtons()) {\n      <c80-icon [button]=\"true\" icon=\"check\" [textRight]=\"getConfirmText()\" (iconClick)=\"onConfirm()\" [border]=\"true\" />\n      <c80-icon [button]=\"true\" icon=\"cancel\" [textRight]=\"getCancelText()\" color=\"warn\" (iconClick)=\"onCancel()\" [border]=\"true\" />\n      }\n\n    </div>\n  </dialog>\n</div>\n}", styles: [".modal-backdrop{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#00000080;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);z-index:1100;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .2s ease-in-out;outline:none}.modal-backdrop.show{opacity:1}.modal-container{background:var(--color-bg-primary);border-radius:8px;box-shadow:0 4px 20px #00000026;border:1px solid var(--color-border-default);max-width:400px;width:90%;max-height:90vh;overflow:hidden;transform:scale(.9) translateY(-10px);transition:all .15s ease-out;position:relative;padding:0}.modal-container.show{transform:scale(1) translateY(0)}.modal-container::backdrop{background:transparent}.modal-header{display:flex;align-items:center;gap:8px;padding:16px 20px 12px;border-bottom:1px solid var(--color-border-default);background:var(--color-bg-secondary)}.modal-header .modal-title{flex:1;margin:0;font-size:16px;font-weight:600;color:var(--color-text-primary);line-height:1.3}.modal-body{padding:16px 20px}.modal-body .modal-message{margin:0;font-size:14px;line-height:1.5;color:var(--color-text-primary);white-space:pre-line}.modal-footer{display:flex;justify-content:flex-end;gap:8px;padding:12px 20px 16px;background:var(--color-bg-secondary);border-top:1px solid var(--color-border-default)}@media(max-width:768px){.modal-container{width:95%;margin:10px}.modal-header{padding:12px 16px 8px}.modal-header .modal-title{font-size:15px}.modal-body{padding:12px 16px}.modal-body .modal-message{font-size:13px}.modal-footer{padding:8px 16px 12px;flex-direction:column}}\n"] }]
+            args: [{ selector: 'c80-modal', standalone: true, imports: [IconComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<!-- Modal Backdrop -->\n@if (isOpen()) {\n<div class=\"modal-backdrop\" [class.show]=\"isVisible()\" tabindex=\"-1\" (click)=\"onBackdropClick($event)\" (keydown.escape)=\"closeModal()\">\n\n  <!-- Modal Container -->\n  <dialog class=\"modal-container\" [class.show]=\"isVisible()\" [attr.aria-labelledby]=\"'modal-title'\" [open]=\"isVisible()\">\n\n    <!-- Modal Header -->\n    <div class=\"modal-header\">\n      <h4 class=\"modal-title\" id=\"modal-title\">{{ config().title }}</h4>\n      <c80-icon [button]=\"true\" icon=\"close\" (iconClick)=\"closeModal()\" title=\"Cerrar\" />\n    </div>\n\n    <!-- Modal Body -->\n    <div class=\"modal-body\">\n      <p class=\"modal-message\">{{ config().message }}</p>\n    </div>\n\n    <!-- Modal Footer -->\n    <div class=\"modal-footer\">\n\n      <!-- Info Modal - Solo OK -->\n      @if (showOkButton()) {\n      <c80-icon [button]=\"true\" icon=\"check\" textRight=\"OK\" (iconClick)=\"onConfirm()\" [border]=\"true\" />\n      }\n\n      <!-- Yes/No Modal -->\n      @if (showYesNoButtons()) {\n      <c80-icon [button]=\"true\" icon=\"check\" [textRight]=\"getYesText()\" (iconClick)=\"onYes()\" [border]=\"true\" />\n      <c80-icon [button]=\"true\" icon=\"cancel\" [textRight]=\"getNoText()\" (iconClick)=\"onNo()\" [border]=\"true\" />\n      }\n\n      <!-- Confirm Modal -->\n      @if (showConfirmButtons()) {\n      <c80-icon [button]=\"true\" icon=\"check\" [textRight]=\"getConfirmText()\" (iconClick)=\"onConfirm()\" [border]=\"true\" />\n      <c80-icon [button]=\"true\" icon=\"cancel\" [textRight]=\"getCancelText()\" (iconClick)=\"onCancel()\" [border]=\"true\" />\n      }\n\n    </div>\n  </dialog>\n</div>\n}", styles: [".modal-backdrop{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#00000080;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);z-index:1100;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .2s ease-in-out;outline:none}.modal-backdrop.show{opacity:1}.modal-container{background:var(--color-bg-primary);border-radius:8px;box-shadow:0 4px 20px #00000026;border:1px solid var(--color-border-default);max-width:400px;width:90%;max-height:90vh;overflow:hidden;transform:scale(.9) translateY(-10px);transition:all .15s ease-out;position:relative;padding:0}.modal-container.show{transform:scale(1) translateY(0)}.modal-container::backdrop{background:transparent}.modal-header{display:flex;align-items:center;gap:8px;padding:16px 20px 12px;border-bottom:1px solid var(--color-border-default);background:var(--color-bg-secondary)}.modal-header .modal-title{flex:1;margin:0;font-size:16px;font-weight:600;color:var(--color-text-primary);line-height:1.3}.modal-body{padding:16px 20px}.modal-body .modal-message{margin:0;font-size:14px;line-height:1.5;color:var(--color-text-primary);white-space:pre-line}.modal-footer{display:flex;justify-content:flex-end;gap:8px;padding:12px 20px 16px;background:var(--color-bg-secondary);border-top:1px solid var(--color-border-default)}@media(max-width:768px){.modal-container{width:95%;margin:10px}.modal-header{padding:12px 16px 8px}.modal-header .modal-title{font-size:15px}.modal-body{padding:12px 16px}.modal-body .modal-message{font-size:13px}.modal-footer{padding:8px 16px 12px;flex-direction:column}}\n"] }]
         }], ctorParameters: () => [] });
 //# sourceMappingURL=modal.component.js.map

package/esm2022/lib/modal/modal.component.js.map

@@ -1 +1 @@
-{"version":3,"file":"modal.component.js","sourceRoot":"","sources":["../../../../../libs/ui/src/lib/modal/modal.component.ts","../../../../../libs/ui/src/lib/modal/modal.component.html"],"names":[],"mappings":"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","sourcesContent":["import { Component, computed, effect, inject, ChangeDetectionStrategy } from '@angular/core';\nimport { ModalService } from './modal.service';\nimport { IconComponent } from './../icon';\n\nexport type ModalType = 'info' | 'confirm' | 'yesNo' | 'warning' | 'error';\n\nexport interface ModalConfig {\n  title: string;\n  message: string;\n  type?: ModalType;\n  confirmText?: string;\n  cancelText?: string;\n  yesText?: string;\n  noText?: string;\n  showCancel?: boolean;\n}\n\nexport interface ModalResult {\n  action: 'confirm' | 'cancel' | 'yes' | 'no';\n  confirmed: boolean;\n}\n\n@Component({\n  // eslint-disable-next-line @angular-eslint/component-selector\n  selector: 'c80-modal',\n  standalone: true,\n  imports: [IconComponent],\n  templateUrl: './modal.component.html',\n  styleUrl: './modal.component.scss',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class ModalComponent {\n  private readonly modalService = inject(ModalService);\n\n  readonly isOpen = this.modalService.modalState.isOpen;\n  readonly config = this.modalService.modalState.config;\n  readonly isVisible = computed(() => this.isOpen());\n\n  constructor() {\n    effect(() => {\n      if (this.isOpen()) {\n        // Auto-focus modal when opened for accessibility\n        /* v8 ignore next 8 */\n        setTimeout(() => {\n          const backdrop = document.querySelector(\n            '.modal-backdrop'\n          ) as HTMLElement;\n          if (backdrop) {\n            backdrop.focus();\n          }\n        }, 100);\n      }\n    });\n  }\n\n  onConfirm() {\n    this.modalService.handleResult({ action: 'confirm', confirmed: true });\n  }\n\n  onCancel() {\n    this.modalService.handleResult({ action: 'cancel', confirmed: false });\n  }\n\n  onYes() {\n    this.modalService.handleResult({ action: 'yes', confirmed: true });\n  }\n\n  onNo() {\n    this.modalService.handleResult({ action: 'no', confirmed: false });\n  }\n\n  closeModal() {\n    this.modalService.closeModal();\n  }\n\n  onBackdropClick(event: Event) {\n    if (event.target === event.currentTarget) {\n      this.closeModal();\n    }\n  }\n\n  getPrimaryButtonClass(): string {\n    const configValue = this.config();\n    switch (configValue.type) {\n      case 'warning':\n        return 'btn-warning';\n      case 'error':\n        return 'btn-danger';\n      case 'confirm':\n      case 'yesNo':\n        return 'btn-primary';\n      default:\n        return 'btn-info';\n    }\n  }\n\n  showYesNoButtons(): boolean {\n    return this.config().type === 'yesNo';\n  }\n\n  showConfirmButtons(): boolean {\n    const type = this.config().type;\n    return type === 'confirm' || type === 'warning' || type === 'error';\n  }\n\n  showOkButton(): boolean {\n    return this.config().type === 'info';\n  }\n\n  getConfirmText(): string {\n    return this.config().confirmText ?? 'Confirmar';\n  }\n\n  getCancelText(): string {\n    return this.config().cancelText ?? 'Cancelar';\n  }\n\n  getYesText(): string {\n    return this.config().yesText ?? 'Sí';\n  }\n\n  getNoText(): string {\n    return this.config().noText ?? 'No';\n  }\n}\n","<!-- Modal Backdrop -->\n@if (isOpen()) {\n<div class=\"modal-backdrop\" [class.show]=\"isVisible()\" tabindex=\"-1\" (click)=\"onBackdropClick($event)\" (keydown.escape)=\"closeModal()\">\n\n  <!-- Modal Container -->\n  <dialog class=\"modal-container\" [class.show]=\"isVisible()\" [attr.aria-labelledby]=\"'modal-title'\" [open]=\"isVisible()\">\n\n    <!-- Modal Header -->\n    <div class=\"modal-header\">\n      <h4 class=\"modal-title\" id=\"modal-title\">{{ config().title }}</h4>\n      <c80-icon [button]=\"true\" icon=\"close\" (iconClick)=\"closeModal()\" title=\"Cerrar\" color=\"warn\" />\n    </div>\n\n    <!-- Modal Body -->\n    <div class=\"modal-body\">\n      <p class=\"modal-message\">{{ config().message }}</p>\n    </div>\n\n    <!-- Modal Footer -->\n    <div class=\"modal-footer\">\n\n      <!-- Info Modal - Solo OK -->\n      @if (showOkButton()) {\n      <c80-icon [button]=\"true\" icon=\"check\" textRight=\"OK\" (iconClick)=\"onConfirm()\" [border]=\"true\" />\n      }\n\n      <!-- Yes/No Modal -->\n      @if (showYesNoButtons()) {\n      <c80-icon [button]=\"true\" icon=\"check\" [textRight]=\"getYesText()\" (iconClick)=\"onYes()\" [border]=\"true\" />\n      <c80-icon [button]=\"true\" icon=\"cancel\" [textRight]=\"getNoText()\" color=\"warn\" (iconClick)=\"onNo()\" [border]=\"true\" />\n      }\n\n      <!-- Confirm Modal -->\n      @if (showConfirmButtons()) {\n      <c80-icon [button]=\"true\" icon=\"check\" [textRight]=\"getConfirmText()\" (iconClick)=\"onConfirm()\" [border]=\"true\" />\n      <c80-icon [button]=\"true\" icon=\"cancel\" [textRight]=\"getCancelText()\" color=\"warn\" (iconClick)=\"onCancel()\" [border]=\"true\" />\n      }\n\n    </div>\n  </dialog>\n</div>\n}"]}
+{"version":3,"file":"modal.component.js","sourceRoot":"","sources":["../../../../../libs/ui/src/lib/modal/modal.component.ts","../../../../../libs/ui/src/lib/modal/modal.component.html"],"names":[],"mappings":"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","sourcesContent":["import { Component, computed, effect, inject, ChangeDetectionStrategy } from '@angular/core';\nimport { ModalService } from './modal.service';\nimport { IconComponent } from './../icon';\n\n/**\n *\n */\n@Component({\n  // eslint-disable-next-line @angular-eslint/component-selector\n  selector: 'c80-modal',\n  standalone: true,\n  imports: [IconComponent],\n  templateUrl: './modal.component.html',\n  styleUrl: './modal.component.scss',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class ModalComponent {\n  private readonly modalService = inject(ModalService);\n\n  readonly isOpen = this.modalService.modalState.isOpen;\n  readonly config = this.modalService.modalState.config;\n  readonly isVisible = computed(() => this.isOpen());\n\n  /**\n   *\n   */\n  constructor() {\n    effect(() => {\n      if (this.isOpen()) {\n        // Auto-focus modal when opened for accessibility\n        /* v8 ignore next 8 */\n        setTimeout(() => {\n          const backdrop = document.querySelector(\n            '.modal-backdrop'\n          ) as HTMLElement;\n          if (backdrop) {\n            backdrop.focus();\n          }\n        }, 100);\n      }\n    });\n  }\n\n  /**\n   * Maneja la confirmación del modal\n   */\n  onConfirm(): void {\n    this.modalService.handleResult({ action: 'confirm', confirmed: true });\n  }\n\n  /**\n   * Maneja la cancelación del modal\n   */\n  onCancel(): void {\n    this.modalService.handleResult({ action: 'cancel', confirmed: false });\n  }\n\n  /**\n   * Maneja la respuesta afirmativa del modal\n   */\n  onYes(): void {\n    this.modalService.handleResult({ action: 'yes', confirmed: true });\n  }\n\n  /**\n   * Maneja la respuesta negativa del modal\n   */\n  onNo(): void {\n    this.modalService.handleResult({ action: 'no', confirmed: false });\n  }\n\n  /**\n   * Cierra el modal actual\n   */\n  closeModal(): void {\n    this.modalService.closeModal();\n  }\n\n  /**\n   * Maneja el clic en el backdrop del modal\n   * @param event - Evento de clic\n   */\n  onBackdropClick(event: Event): void {\n    if (event.target === event.currentTarget) {\n      this.closeModal();\n    }\n  }\n\n  /**\n   *\n   * @returns Clase CSS del botón primario según el tipo de modal\n   */\n  getPrimaryButtonClass(): string {\n    const configValue = this.config();\n    switch (configValue.type) {\n      case 'warning':\n        return 'btn-warning';\n      case 'error':\n        return 'btn-danger';\n      case 'confirm':\n      case 'yesNo':\n        return 'btn-primary';\n      default:\n        return 'btn-info';\n    }\n  }\n\n  /**\n   *\n   * @returns true si debe mostrar botones Sí/No\n   */\n  showYesNoButtons(): boolean {\n    return this.config().type === 'yesNo';\n  }\n\n  /**\n   *\n   * @returns true si debe mostrar botones Confirmar/Cancelar\n   */\n  showConfirmButtons(): boolean {\n    const type = this.config().type;\n    return type === 'confirm' || type === 'warning' || type === 'error';\n  }\n\n  /**\n   *\n   * @returns true si debe mostrar botón OK\n   */\n  showOkButton(): boolean {\n    return this.config().type === 'info';\n  }\n\n  /**\n   *\n   * @returns Texto del botón de confirmación\n   */\n  getConfirmText(): string {\n    return this.config().confirmText ?? 'Confirmar';\n  }\n\n  /**\n   *\n   * @returns Texto del botón de cancelar\n   */\n  getCancelText(): string {\n    return this.config().cancelText ?? 'Cancelar';\n  }\n\n  /**\n   *\n   * @returns Texto del botón Sí\n   */\n  getYesText(): string {\n    return this.config().yesText ?? 'Sí';\n  }\n\n  /**\n   *\n   * @returns Texto del botón No\n   */\n  getNoText(): string {\n    return this.config().noText ?? 'No';\n  }\n}\n","<!-- Modal Backdrop -->\n@if (isOpen()) {\n<div class=\"modal-backdrop\" [class.show]=\"isVisible()\" tabindex=\"-1\" (click)=\"onBackdropClick($event)\" (keydown.escape)=\"closeModal()\">\n\n  <!-- Modal Container -->\n  <dialog class=\"modal-container\" [class.show]=\"isVisible()\" [attr.aria-labelledby]=\"'modal-title'\" [open]=\"isVisible()\">\n\n    <!-- Modal Header -->\n    <div class=\"modal-header\">\n      <h4 class=\"modal-title\" id=\"modal-title\">{{ config().title }}</h4>\n      <c80-icon [button]=\"true\" icon=\"close\" (iconClick)=\"closeModal()\" title=\"Cerrar\" />\n    </div>\n\n    <!-- Modal Body -->\n    <div class=\"modal-body\">\n      <p class=\"modal-message\">{{ config().message }}</p>\n    </div>\n\n    <!-- Modal Footer -->\n    <div class=\"modal-footer\">\n\n      <!-- Info Modal - Solo OK -->\n      @if (showOkButton()) {\n      <c80-icon [button]=\"true\" icon=\"check\" textRight=\"OK\" (iconClick)=\"onConfirm()\" [border]=\"true\" />\n      }\n\n      <!-- Yes/No Modal -->\n      @if (showYesNoButtons()) {\n      <c80-icon [button]=\"true\" icon=\"check\" [textRight]=\"getYesText()\" (iconClick)=\"onYes()\" [border]=\"true\" />\n      <c80-icon [button]=\"true\" icon=\"cancel\" [textRight]=\"getNoText()\" (iconClick)=\"onNo()\" [border]=\"true\" />\n      }\n\n      <!-- Confirm Modal -->\n      @if (showConfirmButtons()) {\n      <c80-icon [button]=\"true\" icon=\"check\" [textRight]=\"getConfirmText()\" (iconClick)=\"onConfirm()\" [border]=\"true\" />\n      <c80-icon [button]=\"true\" icon=\"cancel\" [textRight]=\"getCancelText()\" (iconClick)=\"onCancel()\" [border]=\"true\" />\n      }\n\n    </div>\n  </dialog>\n</div>\n}"]}

package/esm2022/lib/modal/modal.service.js

@@ -1,5 +1,8 @@
 import { Injectable, signal } from '@angular/core';
 import * as i0 from "@angular/core";
+/**
+ *
+ */
 export class ModalService {
     isOpen = signal(false, ...(ngDevMode ? [{ debugName: "isOpen" }] : []));
     config = signal({
@@ -12,6 +15,10 @@ export class ModalService {
         isOpen: this.isOpen.asReadonly(),
         config: this.config.asReadonly(),
     };
+    /**
+     *
+     * @param config
+     */
     async showModal(config) {
         this.config.set(config);
         this.isOpen.set(true);
@@ -19,7 +26,17 @@ export class ModalService {
             this.resolvePromise = resolve;
         });
     }
-    async confirm(title, message, confirmText = 'Confirmar', cancelText = 'Cancelar') {
+    /**
+     *
+     * @param options
+     * @param options.title
+     * @param options.message
+     * @param options.confirmText
+     * @param options.cancelText
+     * @returns Promise que resuelve true si se confirmó
+     */
+    async confirm(options) {
+        const { title, message, confirmText = 'Confirmar', cancelText = 'Cancelar' } = options;
         return this.showModal({
             title,
             message,
@@ -28,7 +45,17 @@ export class ModalService {
             cancelText,
         }).then((result) => result.confirmed);
     }
-    async yesNo(title, message, yesText = 'Sí', noText = 'No') {
+    /**
+     *
+     * @param options
+     * @param options.title
+     * @param options.message
+     * @param options.yesText
+     * @param options.noText
+     * @returns Promise que resuelve true si se eligió Sí
+     */
+    async yesNo(options) {
+        const { title, message, yesText = 'Sí', noText = 'No' } = options;
         return this.showModal({
             title,
             message,
@@ -37,6 +64,12 @@ export class ModalService {
             noText,
         }).then((result) => result.action === 'yes');
     }
+    /**
+     *
+     * @param title
+     * @param message
+     * @returns Promise que resuelve cuando se cierra el modal
+     */
     async info(title, message) {
         return this.showModal({
             title,
@@ -44,7 +77,17 @@ export class ModalService {
             type: 'info',
         }).then(() => void 0);
     }
-    async warning(title, message, confirmText = 'Entendido', cancelText = 'Cancelar') {
+    /**
+     *
+     * @param options
+     * @param options.title
+     * @param options.message
+     * @param options.confirmText
+     * @param options.cancelText
+     * @returns Promise que resuelve true si se confirmó
+     */
+    async warning(options) {
+        const { title, message, confirmText = 'Entendido', cancelText = 'Cancelar' } = options;
         return this.showModal({
             title,
             message,
@@ -53,6 +96,13 @@ export class ModalService {
             cancelText,
         }).then((result) => result.confirmed);
     }
+    /**
+     *
+     * @param title
+     * @param message
+     * @param confirmText
+     * @returns Promise que resuelve true si se confirmó
+     */
     async error(title, message, confirmText = 'Entendido') {
         return this.showModal({
             title,
@@ -61,6 +111,10 @@ export class ModalService {
             confirmText,
         }).then(() => void 0);
     }
+    /**
+     * Maneja el resultado del modal y resuelve la promesa
+     * @param result - Resultado de la acción del modal
+     */
     handleResult(result) {
         if (this.resolvePromise) {
             this.resolvePromise(result);
@@ -68,6 +122,9 @@ export class ModalService {
         }
         this.closeModal();
     }
+    /**
+     * Cierra el modal actual
+     */
     closeModal() {
         this.isOpen.set(false);
     }

package/esm2022/lib/modal/modal.service.js.map

@@ -1 +1 @@
-{"version":3,"file":"modal.service.js","sourceRoot":"","sources":["../../../../../libs/ui/src/lib/modal/modal.service.ts"],"names":[],"mappings":"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","sourcesContent":["import { Injectable, signal } from '@angular/core';\r\nimport type { ModalConfig, ModalResult } from './modal.component';\r\n\r\n@Injectable({\r\n  providedIn: 'root',\r\n})\r\nexport class ModalService {\r\n  private readonly isOpen = signal(false);\r\n  private readonly config = signal<ModalConfig>({\r\n    title: '',\r\n    message: '',\r\n    type: 'info',\r\n  });\r\n\r\n  private resolvePromise?: (result: ModalResult) => void;\r\n\r\n  readonly modalState = {\r\n    isOpen: this.isOpen.asReadonly(),\r\n    config: this.config.asReadonly(),\r\n  };\r\n\r\n  async showModal(config: ModalConfig): Promise<ModalResult> {\r\n    this.config.set(config);\r\n    this.isOpen.set(true);\r\n\r\n    return new Promise<ModalResult>((resolve) => {\r\n      this.resolvePromise = resolve;\r\n    });\r\n  }\r\n\r\n  async confirm(\r\n    title: string,\r\n    message: string,\r\n    confirmText = 'Confirmar',\r\n    cancelText = 'Cancelar'\r\n  ): Promise<boolean> {\r\n    return this.showModal({\r\n      title,\r\n      message,\r\n      type: 'confirm',\r\n      confirmText,\r\n      cancelText,\r\n    }).then((result) => result.confirmed);\r\n  }\r\n\r\n  async yesNo(\r\n    title: string,\r\n    message: string,\r\n    yesText = 'Sí',\r\n    noText = 'No'\r\n  ): Promise<boolean> {\r\n    return this.showModal({\r\n      title,\r\n      message,\r\n      type: 'yesNo',\r\n      yesText,\r\n      noText,\r\n    }).then((result) => result.action === 'yes');\r\n  }\r\n\r\n  async info(title: string, message: string): Promise<void> {\r\n    return this.showModal({\r\n      title,\r\n      message,\r\n      type: 'info',\r\n    }).then(() => void 0);\r\n  }\r\n\r\n  async warning(\r\n    title: string,\r\n    message: string,\r\n    confirmText = 'Entendido',\r\n    cancelText = 'Cancelar'\r\n  ): Promise<boolean> {\r\n    return this.showModal({\r\n      title,\r\n      message,\r\n      type: 'warning',\r\n      confirmText,\r\n      cancelText,\r\n    }).then((result) => result.confirmed);\r\n  }\r\n\r\n  async error(\r\n    title: string,\r\n    message: string,\r\n    confirmText = 'Entendido'\r\n  ): Promise<void> {\r\n    return this.showModal({\r\n      title,\r\n      message,\r\n      type: 'error',\r\n      confirmText,\r\n    }).then(() => void 0);\r\n  }\r\n\r\n  handleResult(result: ModalResult) {\r\n    if (this.resolvePromise) {\r\n      this.resolvePromise(result);\r\n      this.resolvePromise = undefined;\r\n    }\r\n    this.closeModal();\r\n  }\r\n\r\n  closeModal() {\r\n    this.isOpen.set(false);\r\n  }\r\n}\r\n"]}
+{"version":3,"file":"modal.service.js","sourceRoot":"","sources":["../../../../../libs/ui/src/lib/modal/modal.service.ts"],"names":[],"mappings":"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","sourcesContent":["import { Injectable, signal } from '@angular/core';\nimport type { ModalConfig, ModalResult } from './modal.types';\n\n/**\n *\n */\n@Injectable({\n  providedIn: 'root',\n})\nexport class ModalService {\n  private readonly isOpen = signal(false);\n  private readonly config = signal<ModalConfig>({\n    title: '',\n    message: '',\n    type: 'info',\n  });\n\n  private resolvePromise?: (result: ModalResult) => void;\n\n  readonly modalState = {\n    isOpen: this.isOpen.asReadonly(),\n    config: this.config.asReadonly(),\n  };\n\n  /**\n   *\n   * @param config\n   */\n  async showModal(config: ModalConfig): Promise<ModalResult> {\n    this.config.set(config);\n    this.isOpen.set(true);\n\n    return new Promise<ModalResult>((resolve) => {\n      this.resolvePromise = resolve;\n    });\n  }\n\n  /**\n   *\n   * @param options\n   * @param options.title\n   * @param options.message\n   * @param options.confirmText\n   * @param options.cancelText\n   * @returns Promise que resuelve true si se confirmó\n   */\n  async confirm(options: {\n    title: string;\n    message: string;\n    confirmText?: string;\n    cancelText?: string;\n  }): Promise<boolean> {\n    const { title, message, confirmText = 'Confirmar', cancelText = 'Cancelar' } = options;\n    return this.showModal({\n      title,\n      message,\n      type: 'confirm',\n      confirmText,\n      cancelText,\n    }).then((result) => result.confirmed);\n  }\n\n  /**\n   *\n   * @param options\n   * @param options.title\n   * @param options.message\n   * @param options.yesText\n   * @param options.noText\n   * @returns Promise que resuelve true si se eligió Sí\n   */\n  async yesNo(options: {\n    title: string;\n    message: string;\n    yesText?: string;\n    noText?: string;\n  }): Promise<boolean> {\n    const { title, message, yesText = 'Sí', noText = 'No' } = options;\n    return this.showModal({\n      title,\n      message,\n      type: 'yesNo',\n      yesText,\n      noText,\n    }).then((result) => result.action === 'yes');\n  }\n\n  /**\n   *\n   * @param title\n   * @param message\n   * @returns Promise que resuelve cuando se cierra el modal\n   */\n  async info(title: string, message: string): Promise<void> {\n    return this.showModal({\n      title,\n      message,\n      type: 'info',\n    }).then(() => void 0);\n  }\n\n  /**\n   *\n   * @param options\n   * @param options.title\n   * @param options.message\n   * @param options.confirmText\n   * @param options.cancelText\n   * @returns Promise que resuelve true si se confirmó\n   */\n  async warning(options: {\n    title: string;\n    message: string;\n    confirmText?: string;\n    cancelText?: string;\n  }): Promise<boolean> {\n    const { title, message, confirmText = 'Entendido', cancelText = 'Cancelar' } = options;\n    return this.showModal({\n      title,\n      message,\n      type: 'warning',\n      confirmText,\n      cancelText,\n    }).then((result) => result.confirmed);\n  }\n\n  /**\n   *\n   * @param title\n   * @param message\n   * @param confirmText\n   * @returns Promise que resuelve true si se confirmó\n   */\n  async error(\n    title: string,\n    message: string,\n    confirmText = 'Entendido'\n  ): Promise<void> {\n    return this.showModal({\n      title,\n      message,\n      type: 'error',\n      confirmText,\n    }).then(() => void 0);\n  }\n\n  /**\n   * Maneja el resultado del modal y resuelve la promesa\n   * @param result - Resultado de la acción del modal\n   */\n  handleResult(result: ModalResult): void {\n    if (this.resolvePromise) {\n      this.resolvePromise(result);\n      this.resolvePromise = undefined;\n    }\n    this.closeModal();\n  }\n\n  /**\n   * Cierra el modal actual\n   */\n  closeModal(): void {\n    this.isOpen.set(false);\n  }\n}\n"]}

package/esm2022/lib/modal/modal.types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=modal.types.js.map

package/esm2022/lib/modal/modal.types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"modal.types.js","sourceRoot":"","sources":["../../../../../libs/ui/src/lib/modal/modal.types.ts"],"names":[],"mappings":"","sourcesContent":["export type ModalType = 'info' | 'confirm' | 'yesNo' | 'warning' | 'error';\n\nexport interface ModalConfig {\n    title: string;\n    message: string;\n    type?: ModalType;\n    confirmText?: string;\n    cancelText?: string;\n    yesText?: string;\n    noText?: string;\n    showCancel?: boolean;\n}\n\nexport interface ModalResult {\n    action: 'confirm' | 'cancel' | 'yes' | 'no';\n    confirmed: boolean;\n}\n"]}

package/esm2022/lib/profile-stats/profile-stats.component.js

@@ -1,12 +1,16 @@
 import { ChangeDetectionStrategy, Component, input } from '@angular/core';
 import * as i0 from "@angular/core";
+/**
+ * Componente para mostrar estadísticas del usuario
+ * Soporta valores con etiquetas o botones de acción
+ */
 export class ProfileStatsComponent {
     stats = input.required(...(ngDevMode ? [{ debugName: "stats" }] : []));
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: ProfileStatsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.10", type: ProfileStatsComponent, isStandalone: true, selector: "c80-profile-stats", inputs: { stats: { classPropertyName: "stats", publicName: "stats", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div class=\"stats\">\n    @for (stat of stats(); track $index) {\n    <div class=\"stats__item\">\n        <span class=\"stats__value\">{{ stat.value }}</span>\n        <span class=\"stats__label\">{{ stat.label }}</span>\n    </div>\n    }\n</div>", styles: [".stats{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--spacing-md);text-align:center}.stats__item{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-xs)}.stats__value{font-size:1.25rem;font-weight:var(--font-weight-bold);color:var(--color-text-primary);line-height:1}.stats__label{font-size:.8125rem;color:var(--color-text-secondary);text-transform:lowercase}@media(max-width:768px){.stats{gap:var(--spacing-sm)}.stats__value{font-size:1.125rem}.stats__label{font-size:.75rem}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.10", type: ProfileStatsComponent, isStandalone: true, selector: "c80-profile-stats", inputs: { stats: { classPropertyName: "stats", publicName: "stats", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div class=\"stats\">\n    @for (stat of stats(); track $index) {\n    <div class=\"stats__item\" [class.stats__item--centered]=\"!stat.label && !stat.button\">\n        <span class=\"stats__value\">{{ stat.value }}</span>\n        @if (stat.button) {\n        <button class=\"stats__button\" (click)=\"stat.button.onClick()\">\n            {{ stat.button.text }}\n        </button>\n        } @else if (stat.label) {\n        <span class=\"stats__label\">{{ stat.label }}</span>\n        }\n    </div>\n    }\n</div>", styles: [".stats{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--spacing-md);text-align:center}.stats__item{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-xs)}.stats__item--centered{justify-content:center}.stats__value{font-size:1.25rem;font-weight:var(--font-weight-bold);color:var(--color-text-primary);line-height:1}.stats__label{font-size:.8125rem;color:var(--color-text-secondary);text-transform:lowercase}.stats__button{padding:3px 20%;font-size:.8125rem;font-weight:700;color:var(--color-primary);background:transparent;border:1px solid var(--color-primary);border-radius:var(--radius-sm);cursor:pointer;transition:all .2s ease;text-transform:lowercase}@media(max-width:768px){.stats{gap:var(--spacing-sm)}.stats__value{font-size:1.125rem}.stats__label{font-size:.75rem}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: ProfileStatsComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'c80-profile-stats', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"stats\">\n    @for (stat of stats(); track $index) {\n    <div class=\"stats__item\">\n        <span class=\"stats__value\">{{ stat.value }}</span>\n        <span class=\"stats__label\">{{ stat.label }}</span>\n    </div>\n    }\n</div>", styles: [".stats{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--spacing-md);text-align:center}.stats__item{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-xs)}.stats__value{font-size:1.25rem;font-weight:var(--font-weight-bold);color:var(--color-text-primary);line-height:1}.stats__label{font-size:.8125rem;color:var(--color-text-secondary);text-transform:lowercase}@media(max-width:768px){.stats{gap:var(--spacing-sm)}.stats__value{font-size:1.125rem}.stats__label{font-size:.75rem}}\n"] }]
+            args: [{ selector: 'c80-profile-stats', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"stats\">\n    @for (stat of stats(); track $index) {\n    <div class=\"stats__item\" [class.stats__item--centered]=\"!stat.label && !stat.button\">\n        <span class=\"stats__value\">{{ stat.value }}</span>\n        @if (stat.button) {\n        <button class=\"stats__button\" (click)=\"stat.button.onClick()\">\n            {{ stat.button.text }}\n        </button>\n        } @else if (stat.label) {\n        <span class=\"stats__label\">{{ stat.label }}</span>\n        }\n    </div>\n    }\n</div>", styles: [".stats{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--spacing-md);text-align:center}.stats__item{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-xs)}.stats__item--centered{justify-content:center}.stats__value{font-size:1.25rem;font-weight:var(--font-weight-bold);color:var(--color-text-primary);line-height:1}.stats__label{font-size:.8125rem;color:var(--color-text-secondary);text-transform:lowercase}.stats__button{padding:3px 20%;font-size:.8125rem;font-weight:700;color:var(--color-primary);background:transparent;border:1px solid var(--color-primary);border-radius:var(--radius-sm);cursor:pointer;transition:all .2s ease;text-transform:lowercase}@media(max-width:768px){.stats{gap:var(--spacing-sm)}.stats__value{font-size:1.125rem}.stats__label{font-size:.75rem}}\n"] }]
         }], propDecorators: { stats: [{ type: i0.Input, args: [{ isSignal: true, alias: "stats", required: true }] }] } });
 //# sourceMappingURL=profile-stats.component.js.map

package/esm2022/lib/profile-stats/profile-stats.component.js.map

@@ -1 +1 @@
-{"version":3,"file":"profile-stats.component.js","sourceRoot":"","sources":["../../../../../libs/ui/src/lib/profile-stats/profile-stats.component.ts","../../../../../libs/ui/src/lib/profile-stats/profile-stats.component.html"],"names":[],"mappings":"AAAA,OAAO,EAAE,uBAAuB,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;;AAW1E,MAAM,OAAO,qBAAqB;IAC9B,KAAK,GAAG,KAAK,CAAC,QAAQ,gDAAc,CAAC;wGAD5B,qBAAqB;4FAArB,qBAAqB,gNCXlC,2PAOM;;4FDIO,qBAAqB;kBARjC,SAAS;+BAEI,mBAAmB,cACjB,IAAI,mBAGC,uBAAuB,CAAC,MAAM","sourcesContent":["import { ChangeDetectionStrategy, Component, input } from '@angular/core';\nimport type { StatItem } from './profile-stats.types';\n\n@Component({\n    // eslint-disable-next-line @angular-eslint/component-selector\n    selector: 'c80-profile-stats',\n    standalone: true,\n    templateUrl: './profile-stats.component.html',\n    styleUrl: './profile-stats.component.scss',\n    changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class ProfileStatsComponent {\n    stats = input.required<StatItem[]>();\n}","<div class=\"stats\">\n    @for (stat of stats(); track $index) {\n    <div class=\"stats__item\">\n        <span class=\"stats__value\">{{ stat.value }}</span>\n        <span class=\"stats__label\">{{ stat.label }}</span>\n    </div>\n    }\n</div>"]}
+{"version":3,"file":"profile-stats.component.js","sourceRoot":"","sources":["../../../../../libs/ui/src/lib/profile-stats/profile-stats.component.ts","../../../../../libs/ui/src/lib/profile-stats/profile-stats.component.html"],"names":[],"mappings":"AAAA,OAAO,EAAE,uBAAuB,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;;AAG1E;;;GAGG;AASH,MAAM,OAAO,qBAAqB;IAC9B,KAAK,GAAG,KAAK,CAAC,QAAQ,gDAAc,CAAC;wGAD5B,qBAAqB;4FAArB,qBAAqB,gNCflC,ugBAaM;;4FDEO,qBAAqB;kBARjC,SAAS;+BAEI,mBAAmB,cACjB,IAAI,mBAGC,uBAAuB,CAAC,MAAM","sourcesContent":["import { ChangeDetectionStrategy, Component, input } from '@angular/core';\nimport type { StatItem } from './profile-stats.types';\n\n/**\n * Componente para mostrar estadísticas del usuario\n * Soporta valores con etiquetas o botones de acción\n */\n@Component({\n    // eslint-disable-next-line @angular-eslint/component-selector\n    selector: 'c80-profile-stats',\n    standalone: true,\n    templateUrl: './profile-stats.component.html',\n    styleUrl: './profile-stats.component.scss',\n    changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class ProfileStatsComponent {\n    stats = input.required<StatItem[]>();\n}","<div class=\"stats\">\n    @for (stat of stats(); track $index) {\n    <div class=\"stats__item\" [class.stats__item--centered]=\"!stat.label && !stat.button\">\n        <span class=\"stats__value\">{{ stat.value }}</span>\n        @if (stat.button) {\n        <button class=\"stats__button\" (click)=\"stat.button.onClick()\">\n            {{ stat.button.text }}\n        </button>\n        } @else if (stat.label) {\n        <span class=\"stats__label\">{{ stat.label }}</span>\n        }\n    </div>\n    }\n</div>"]}

package/esm2022/lib/profile-stats/profile-stats.types.js.map

@@ -1 +1 @@
-{"version":3,"file":"profile-stats.types.js","sourceRoot":"","sources":["../../../../../libs/ui/src/lib/profile-stats/profile-stats.types.ts"],"names":[],"mappings":"","sourcesContent":["export interface StatItem {\n    label: string;\n    value: number | string;\n}"]}
+{"version":3,"file":"profile-stats.types.js","sourceRoot":"","sources":["../../../../../libs/ui/src/lib/profile-stats/profile-stats.types.ts"],"names":[],"mappings":"","sourcesContent":["export interface StatItem {\n    value?: number | string;\n    label?: string;\n    button?: {\n        text: string;\n        onClick: () => void;\n    };\n}"]}

package/esm2022/lib/rating-display/index.js

@@ -0,0 +1,2 @@
+export * from './rating-display.component';
+//# sourceMappingURL=index.js.map

package/esm2022/lib/rating-display/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../libs/ui/src/lib/rating-display/index.ts"],"names":[],"mappings":"AAAA,cAAc,4BAA4B,CAAC","sourcesContent":["export * from './rating-display.component';\n"]}

package/esm2022/lib/rating-display/rating-display.component.js

@@ -0,0 +1,24 @@
+import { ChangeDetectionStrategy, Component, computed, input } from '@angular/core';
+import { IconComponent } from '../icon';
+import * as i0 from "@angular/core";
+/**
+ *
+ */
+export class RatingDisplayComponent {
+    rating = input(0, ...(ngDevMode ? [{ debugName: "rating" }] : []));
+    size = input(0.1, ...(ngDevMode ? [{ debugName: "size" }] : []));
+    spacing = input(-22, ...(ngDevMode ? [{ debugName: "spacing" }] : []));
+    stars = computed(() => {
+        const rating = Math.round(this.rating());
+        return Array.from({ length: rating });
+    }, ...(ngDevMode ? [{ debugName: "stars" }] : []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: RatingDisplayComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.10", type: RatingDisplayComponent, isStandalone: true, selector: "c80-rating-display", inputs: { rating: { classPropertyName: "rating", publicName: "rating", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, spacing: { classPropertyName: "spacing", publicName: "spacing", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "style.--spacing.px": "spacing()" } }, ngImport: i0, template: "<div class=\"rating-display\">\n    @for (star of stars(); track $index) {\n    <c80-icon icon=\"starFilled\" [size]=\"size()\" color=\"warn\" class=\"rating-display__star\" />\n    }\n</div>", styles: [":host{--spacing: -22px}.rating-display{display:flex;align-items:center;pointer-events:none}.rating-display__star{margin-left:var(--spacing)}.rating-display__star:first-child{margin-left:0}\n"], dependencies: [{ kind: "component", type: IconComponent, selector: "c80-icon", inputs: ["icon", "color", "customColor", "disabled", "size", "button", "border", "type", "textLeft", "textRight", "dark"], outputs: ["iconClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: RatingDisplayComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'c80-rating-display', standalone: true, imports: [IconComponent], changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        '[style.--spacing.px]': 'spacing()'
+                    }, template: "<div class=\"rating-display\">\n    @for (star of stars(); track $index) {\n    <c80-icon icon=\"starFilled\" [size]=\"size()\" color=\"warn\" class=\"rating-display__star\" />\n    }\n</div>", styles: [":host{--spacing: -22px}.rating-display{display:flex;align-items:center;pointer-events:none}.rating-display__star{margin-left:var(--spacing)}.rating-display__star:first-child{margin-left:0}\n"] }]
+        }], propDecorators: { rating: [{ type: i0.Input, args: [{ isSignal: true, alias: "rating", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], spacing: [{ type: i0.Input, args: [{ isSignal: true, alias: "spacing", required: false }] }] } });
+//# sourceMappingURL=rating-display.component.js.map

package/esm2022/lib/rating-display/rating-display.component.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"rating-display.component.js","sourceRoot":"","sources":["../../../../../libs/ui/src/lib/rating-display/rating-display.component.ts","../../../../../libs/ui/src/lib/rating-display/rating-display.component.html"],"names":[],"mappings":"AAAA,OAAO,EAAE,uBAAuB,EAAE,SAAS,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AACpF,OAAO,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;;AAExC;;GAEG;AAaH,MAAM,OAAO,sBAAsB;IAC/B,MAAM,GAAG,KAAK,CAAS,CAAC,kDAAC,CAAC;IAC1B,IAAI,GAAG,KAAK,CAAS,GAAG,gDAAC,CAAC;IAC1B,OAAO,GAAG,KAAK,CAAS,CAAC,EAAE,mDAAC,CAAC;IAEV,KAAK,GAAG,QAAQ,CAAC,GAAG,EAAE;QACrC,MAAM,MAAM,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,MAAM,EAAE,CAAC,CAAC;QACzC,OAAO,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,MAAM,EAAE,CAAC,CAAC;IAC1C,CAAC,iDAAC,CAAC;wGARM,sBAAsB;4FAAtB,sBAAsB,qgBClBnC,iMAIM,wPDMQ,aAAa;;4FAQd,sBAAsB;kBAZlC,SAAS;+BAEI,oBAAoB,cAClB,IAAI,WACP,CAAC,aAAa,CAAC,mBAGP,uBAAuB,CAAC,MAAM,QACzC;wBACF,sBAAsB,EAAE,WAAW;qBACtC","sourcesContent":["import { ChangeDetectionStrategy, Component, computed, input } from '@angular/core';\nimport { IconComponent } from '../icon';\n\n/**\n *\n */\n@Component({\n    // eslint-disable-next-line @angular-eslint/component-selector\n    selector: 'c80-rating-display',\n    standalone: true,\n    imports: [IconComponent],\n    templateUrl: './rating-display.component.html',\n    styleUrl: './rating-display.component.scss',\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    host: {\n        '[style.--spacing.px]': 'spacing()'\n    }\n})\nexport class RatingDisplayComponent {\n    rating = input<number>(0);\n    size = input<number>(0.1);\n    spacing = input<number>(-22);\n\n    protected readonly stars = computed(() => {\n        const rating = Math.round(this.rating());\n        return Array.from({ length: rating });\n    });\n}\n","<div class=\"rating-display\">\n    @for (star of stars(); track $index) {\n    <c80-icon icon=\"starFilled\" [size]=\"size()\" color=\"warn\" class=\"rating-display__star\" />\n    }\n</div>"]}

package/esm2022/lib/rating-stars/index.js

@@ -0,0 +1,2 @@
+export * from './rating-stars.component';
+//# sourceMappingURL=index.js.map

package/esm2022/lib/rating-stars/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../libs/ui/src/lib/rating-stars/index.ts"],"names":[],"mappings":"AAAA,cAAc,0BAA0B,CAAC","sourcesContent":["export * from './rating-stars.component';\n"]}

package/esm2022/lib/rating-stars/rating-stars.component.js

@@ -0,0 +1,33 @@
+import { ChangeDetectionStrategy, Component, computed, input, output } from '@angular/core';
+import { IconComponent } from '../icon';
+import * as i0 from "@angular/core";
+/**
+ *
+ */
+export class RatingStarsComponent {
+    rating = input(0, ...(ngDevMode ? [{ debugName: "rating" }] : []));
+    showLabel = input(false, ...(ngDevMode ? [{ debugName: "showLabel" }] : []));
+    readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : []));
+    ratingChange = output();
+    currentRating = computed(() => this.rating(), ...(ngDevMode ? [{ debugName: "currentRating" }] : []));
+    stars = computed(() => {
+        const rating = this.currentRating();
+        return Array.from({ length: 5 }, (_, i) => i < rating);
+    }, ...(ngDevMode ? [{ debugName: "stars" }] : []));
+    /**
+     *
+     * @param rating
+     */
+    onStarClick(rating) {
+        if (this.readonly())
+            return;
+        this.ratingChange.emit(rating);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: RatingStarsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.10", type: RatingStarsComponent, isStandalone: true, selector: "c80-rating-stars", inputs: { rating: { classPropertyName: "rating", publicName: "rating", isSignal: true, isRequired: false, transformFunction: null }, showLabel: { classPropertyName: "showLabel", publicName: "showLabel", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { ratingChange: "ratingChange" }, ngImport: i0, template: "<div class=\"rating-stars\">\n    @for (star of stars(); track $index) {\n    <c80-icon button [icon]=\"star ? 'starFilled' : 'star'\" [size]=\"1.5\" [color]=\"star ? 'warn' : undefined\" (iconClick)=\"onStarClick($index + 1)\" class=\"rating-stars__star\" [class.rating-stars__star--filled]=\"star\"\n        [class.rating-stars__star--empty]=\"!star\" [title]=\"($index + 1) + ' estrella' + ($index > 0 ? 's' : '')\" />\n    }\n    @if (showLabel()) {\n    <span class=\"rating-stars__label\">{{ currentRating() }}/5</span>\n    }\n</div>", styles: [".rating-stars{display:flex;align-items:center;gap:var(--spacing-xs)}.rating-stars__star{cursor:pointer;transition:transform .2s ease;-webkit-user-select:none;user-select:none}.rating-stars__star:hover{transform:scale(1.2)}.rating-stars__star:active{transform:scale(.9)}.rating-stars__star--empty{opacity:.3}.rating-stars__label{margin-left:var(--spacing-sm);font-size:.875rem;color:var(--color-text-secondary)}@media(max-width:768px){.rating-stars{gap:var(--spacing-xs)}.rating-stars__star:hover{transform:scale(1.15)}}\n"], dependencies: [{ kind: "component", type: IconComponent, selector: "c80-icon", inputs: ["icon", "color", "customColor", "disabled", "size", "button", "border", "type", "textLeft", "textRight", "dark"], outputs: ["iconClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: RatingStarsComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'c80-rating-stars', standalone: true, imports: [IconComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"rating-stars\">\n    @for (star of stars(); track $index) {\n    <c80-icon button [icon]=\"star ? 'starFilled' : 'star'\" [size]=\"1.5\" [color]=\"star ? 'warn' : undefined\" (iconClick)=\"onStarClick($index + 1)\" class=\"rating-stars__star\" [class.rating-stars__star--filled]=\"star\"\n        [class.rating-stars__star--empty]=\"!star\" [title]=\"($index + 1) + ' estrella' + ($index > 0 ? 's' : '')\" />\n    }\n    @if (showLabel()) {\n    <span class=\"rating-stars__label\">{{ currentRating() }}/5</span>\n    }\n</div>", styles: [".rating-stars{display:flex;align-items:center;gap:var(--spacing-xs)}.rating-stars__star{cursor:pointer;transition:transform .2s ease;-webkit-user-select:none;user-select:none}.rating-stars__star:hover{transform:scale(1.2)}.rating-stars__star:active{transform:scale(.9)}.rating-stars__star--empty{opacity:.3}.rating-stars__label{margin-left:var(--spacing-sm);font-size:.875rem;color:var(--color-text-secondary)}@media(max-width:768px){.rating-stars{gap:var(--spacing-xs)}.rating-stars__star:hover{transform:scale(1.15)}}\n"] }]
+        }], propDecorators: { rating: [{ type: i0.Input, args: [{ isSignal: true, alias: "rating", required: false }] }], showLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "showLabel", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], ratingChange: [{ type: i0.Output, args: ["ratingChange"] }] } });
+//# sourceMappingURL=rating-stars.component.js.map

package/esm2022/lib/rating-stars/rating-stars.component.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"rating-stars.component.js","sourceRoot":"","sources":["../../../../../libs/ui/src/lib/rating-stars/rating-stars.component.ts","../../../../../libs/ui/src/lib/rating-stars/rating-stars.component.html"],"names":[],"mappings":"AAAA,OAAO,EAAE,uBAAuB,EAAE,SAAS,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;AAC5F,OAAO,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;;AAExC;;GAEG;AAUH,MAAM,OAAO,oBAAoB;IAC7B,MAAM,GAAG,KAAK,CAAS,CAAC,kDAAC,CAAC;IAC1B,SAAS,GAAG,KAAK,CAAU,KAAK,qDAAC,CAAC;IAClC,QAAQ,GAAG,KAAK,CAAU,KAAK,oDAAC,CAAC;IAEjC,YAAY,GAAG,MAAM,EAAU,CAAC;IAEb,aAAa,GAAG,QAAQ,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,MAAM,EAAE,yDAAC,CAAC;IAE9C,KAAK,GAAG,QAAQ,CAAC,GAAG,EAAE;QACrC,MAAM,MAAM,GAAG,IAAI,CAAC,aAAa,EAAE,CAAC;QACpC,OAAO,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,GAAG,MAAM,CAAC,CAAC;IAC3D,CAAC,iDAAC,CAAC;IAEH;;;OAGG;IACO,WAAW,CAAC,MAAc;QAChC,IAAI,IAAI,CAAC,QAAQ,EAAE;YAAE,OAAO;QAC5B,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;IACnC,CAAC;wGArBQ,oBAAoB;4FAApB,oBAAoB,mgBCfjC,8hBAQM,mkBDEQ,aAAa;;4FAKd,oBAAoB;kBAThC,SAAS;+BAEI,kBAAkB,cAChB,IAAI,WACP,CAAC,aAAa,CAAC,mBAGP,uBAAuB,CAAC,MAAM","sourcesContent":["import { ChangeDetectionStrategy, Component, computed, input, output } from '@angular/core';\nimport { IconComponent } from '../icon';\n\n/**\n *\n */\n@Component({\n    // eslint-disable-next-line @angular-eslint/component-selector\n    selector: 'c80-rating-stars',\n    standalone: true,\n    imports: [IconComponent],\n    templateUrl: './rating-stars.component.html',\n    styleUrl: './rating-stars.component.scss',\n    changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class RatingStarsComponent {\n    rating = input<number>(0);\n    showLabel = input<boolean>(false);\n    readonly = input<boolean>(false);\n\n    ratingChange = output<number>();\n\n    protected readonly currentRating = computed(() => this.rating());\n\n    protected readonly stars = computed(() => {\n        const rating = this.currentRating();\n        return Array.from({ length: 5 }, (_, i) => i < rating);\n    });\n\n    /**\n     *\n     * @param rating\n     */\n    protected onStarClick(rating: number): void {\n        if (this.readonly()) return;\n        this.ratingChange.emit(rating);\n    }\n}\n","<div class=\"rating-stars\">\n    @for (star of stars(); track $index) {\n    <c80-icon button [icon]=\"star ? 'starFilled' : 'star'\" [size]=\"1.5\" [color]=\"star ? 'warn' : undefined\" (iconClick)=\"onStarClick($index + 1)\" class=\"rating-stars__star\" [class.rating-stars__star--filled]=\"star\"\n        [class.rating-stars__star--empty]=\"!star\" [title]=\"($index + 1) + ' estrella' + ($index > 0 ? 's' : '')\" />\n    }\n    @if (showLabel()) {\n    <span class=\"rating-stars__label\">{{ currentRating() }}/5</span>\n    }\n</div>"]}

package/esm2022/lib/select/index.js

@@ -1,3 +1,3 @@
-export * from './select.model';
+export * from './select.types';
 export * from './select.component';
 //# sourceMappingURL=index.js.map

package/esm2022/lib/select/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../libs/ui/src/lib/select/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAC;AAC/B,cAAc,oBAAoB,CAAC","sourcesContent":["export * from './select.model';\nexport * from './select.component';\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../libs/ui/src/lib/select/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAC;AAC/B,cAAc,oBAAoB,CAAC","sourcesContent":["export * from './select.types';\nexport * from './select.component';\n"]}

package/esm2022/lib/select/select.component.js

@@ -1,6 +1,9 @@
 import { ChangeDetectionStrategy, Component, computed, input, output, signal, viewChild } from '@angular/core';
 import * as i0 from "@angular/core";
 let uniqueIdCounter = 0;
+/**
+ *
+ */
 export class SelectComponent {
     label = input.required(...(ngDevMode ? [{ debugName: "label" }] : []));
     /* v8 ignore next */
@@ -28,12 +31,18 @@ export class SelectComponent {
     controlId = `c80-select-${++uniqueIdCounter}`;
     searchInput = viewChild('searchInput', ...(ngDevMode ? [{ debugName: "searchInput" }] : []));
     filteredOptions = computed(() => {
-        const term = this.searchTerm().toLowerCase().trim();
+        const term = this.normalizeString(this.searchTerm());
         if (!term || !this.filterable()) {
             return this.options();
         }
         return this.options().filter(opt => opt.label.toLowerCase().includes(term));
     }, ...(ngDevMode ? [{ debugName: "filteredOptions" }] : []));
+    normalizeString(str) {
+        return str.toLowerCase().trim();
+    }
+    /**
+     *
+     */
     toggleDropdown() {
         if (this.disabled() || this.loading()) {
             return;
@@ -51,6 +60,10 @@ export class SelectComponent {
             }
         }
     }
+    /**
+     *
+     * @param option
+     */
     selectOption(option) {
         if (option.disabled) {
             return;
@@ -58,10 +71,17 @@ export class SelectComponent {
         this.valueChange.emit(option.value);
         this.isOpen.set(false);
     }
+    /**
+     *
+     */
     selectNull() {
         this.valueChange.emit(null);
         this.isOpen.set(false);
     }
+    /**
+     *
+     * @returns Etiqueta del valor seleccionado o placeholder
+     */
     getSelectedLabel() {
         const currentValue = this.value();
         if (currentValue === null || currentValue === undefined) {
@@ -70,13 +90,23 @@ export class SelectComponent {
         const selected = this.options().find(opt => opt.value === currentValue);
         return selected?.label ?? this.placeholder();
     }
+    /**
+     *
+     */
     closeDropdown() {
         this.isOpen.set(false);
         this.clearSearch();
     }
+    /**
+     *
+     * @param term
+     */
     onSearchChange(term) {
         this.searchTerm.set(term);
     }
+    /**
+     *
+     */
     clearSearch() {
         this.searchTerm.set('');
     }