npm - @c80/ui - Versions diffs - 1.1.2 → 2.0.0 - Mend

@c80/ui 1.1.2 → 2.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (76) hide show

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

	@@ -1 +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":"AAAA,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,EAAE,uBAAuB,EAAE,MAAM,eAAe,CAAC;AAC7F,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAC/C,OAAO,EAAE,aAAa,EAAE,MAAM,WAAW,CAAC;;AAE1C;;GAEG;~~AAUH~~,MAAM,OAAO,cAAc;IACR,YAAY,GAAG,MAAM,CAAC,YAAY,CAAC,CAAC;IAE5C,MAAM,GAAG,IAAI,CAAC,YAAY,CAAC,UAAU,CAAC,MAAM,CAAC;IAC7C,MAAM,GAAG,IAAI,CAAC,YAAY,CAAC,UAAU,CAAC,MAAM,CAAC;IAC7C,SAAS,GAAG,QAAQ,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,MAAM,EAAE,~~qDAAC~~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~~qEChB3B~~,0yDA6CC,~~6qDDlCW~~,aAAa;;4FAKZ,cAAc;~~kBAT1B~~,SAAS;+~~BAEE~~,WAAW,cACT,IAAI,WACP,CAAC,aAAa,CAAC,mBAGP,uBAAuB,CAAC,MAAM","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 /\n \n * @returns Texto del botón OK\n */\n getOkText(): string {\n return this.config().confirmText ?? 'OK';\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 @if (config().allowHtml) {\n <p class=\"modal-message\" [innerHTML]=\"config().message\"></p>\n } @else {\n <p class=\"modal-message\">{{ config().message }}</p>\n }\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]=\"getOkText()\" (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}"]}
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';\r\nimport { ModalService } from './modal.service';\r\nimport { IconComponent } from './../icon';\r\n\r\n/*\r\n \r\n /\r\n@Component({\r\n selector: 'c80-modal',\r\n standalone: true,\r\n imports: [IconComponent],\r\n templateUrl: './modal.component.html',\r\n styleUrl: './modal.component.scss',\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n})\r\nexport class ModalComponent {\r\n private readonly modalService = inject(ModalService);\r\n\r\n readonly isOpen = this.modalService.modalState.isOpen;\r\n readonly config = this.modalService.modalState.config;\r\n readonly isVisible = computed(() => this.isOpen());\r\n\r\n /\r\n \r\n /\r\n constructor() {\r\n effect(() => {\r\n if (this.isOpen()) {\r\n // Auto-focus modal when opened for accessibility\r\n / v8 ignore next 8 /\r\n setTimeout(() => {\r\n const backdrop = document.querySelector(\r\n '.modal-backdrop'\r\n ) as HTMLElement;\r\n if (backdrop) {\r\n backdrop.focus();\r\n }\r\n }, 100);\r\n }\r\n });\r\n }\r\n\r\n /\r\n Maneja la confirmación del modal\r\n /\r\n onConfirm(): void {\r\n this.modalService.handleResult({ action: 'confirm', confirmed: true });\r\n }\r\n\r\n /\r\n Maneja la cancelación del modal\r\n /\r\n onCancel(): void {\r\n this.modalService.handleResult({ action: 'cancel', confirmed: false });\r\n }\r\n\r\n /\r\n Maneja la respuesta afirmativa del modal\r\n /\r\n onYes(): void {\r\n this.modalService.handleResult({ action: 'yes', confirmed: true });\r\n }\r\n\r\n /\r\n Maneja la respuesta negativa del modal\r\n /\r\n onNo(): void {\r\n this.modalService.handleResult({ action: 'no', confirmed: false });\r\n }\r\n\r\n /\r\n Cierra el modal actual\r\n /\r\n closeModal(): void {\r\n this.modalService.closeModal();\r\n }\r\n\r\n /\r\n Maneja el clic en el backdrop del modal\r\n * @param event - Evento de clic\r\n /\r\n onBackdropClick(event: Event): void {\r\n if (event.target === event.currentTarget) {\r\n this.closeModal();\r\n }\r\n }\r\n\r\n /\r\n \r\n * @returns Clase CSS del botón primario según el tipo de modal\r\n /\r\n getPrimaryButtonClass(): string {\r\n const configValue = this.config();\r\n switch (configValue.type) {\r\n case 'warning':\r\n return 'btn-warning';\r\n case 'error':\r\n return 'btn-danger';\r\n case 'confirm':\r\n case 'yesNo':\r\n return 'btn-primary';\r\n default:\r\n return 'btn-info';\r\n }\r\n }\r\n\r\n /\r\n \r\n * @returns true si debe mostrar botones Sí/No\r\n /\r\n showYesNoButtons(): boolean {\r\n return this.config().type === 'yesNo';\r\n }\r\n\r\n /\r\n \r\n * @returns true si debe mostrar botones Confirmar/Cancelar\r\n /\r\n showConfirmButtons(): boolean {\r\n const type = this.config().type;\r\n return type === 'confirm' \|\| type === 'warning' \|\| type === 'error';\r\n }\r\n\r\n /\r\n \r\n * @returns true si debe mostrar botón OK\r\n /\r\n showOkButton(): boolean {\r\n return this.config().type === 'info';\r\n }\r\n\r\n /\r\n \r\n * @returns Texto del botón de confirmación\r\n /\r\n getConfirmText(): string {\r\n return this.config().confirmText ?? 'Confirmar';\r\n }\r\n\r\n /\r\n \r\n * @returns Texto del botón de cancelar\r\n /\r\n getCancelText(): string {\r\n return this.config().cancelText ?? 'Cancelar';\r\n }\r\n\r\n /\r\n \r\n * @returns Texto del botón Sí\r\n /\r\n getYesText(): string {\r\n return this.config().yesText ?? 'Sí';\r\n }\r\n\r\n /\r\n \r\n * @returns Texto del botón No\r\n /\r\n getNoText(): string {\r\n return this.config().noText ?? 'No';\r\n }\r\n\r\n /\r\n \r\n * @returns Texto del botón OK\r\n */\r\n getOkText(): string {\r\n return this.config().confirmText ?? 'OK';\r\n }\r\n}\r\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 @if (config().allowHtml) {\n <p class=\"modal-message\" [innerHTML]=\"config().message\"></p>\n } @else {\n <p class=\"modal-message\">{{ config().message }}</p>\n }\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]=\"getOkText()\" (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 CHANGED Viewed

@@ -4,12 +4,12 @@ import * as i0 from "@angular/core";
  *
  */
 export class ModalService {
-    isOpen = signal(false, ...(ngDevMode ? [{ debugName: "isOpen" }] : []));
+    isOpen = signal(false, ...(ngDevMode ? [{ debugName: "isOpen" }] : /* istanbul ignore next */ []));
     config = signal({
         title: '',
         message: '',
         type: 'info',
-    }, ...(ngDevMode ? [{ debugName: "config" }] : []));
+    }, ...(ngDevMode ? [{ debugName: "config" }] : /* istanbul ignore next */ []));
     resolvePromise;
     modalState = {
         isOpen: this.isOpen.asReadonly(),
@@ -140,10 +140,10 @@ export class ModalService {
     closeModal() {
         this.isOpen.set(false);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: ModalService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: ModalService, providedIn: 'root' });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: ModalService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: ModalService, providedIn: 'root' });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: ModalService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: ModalService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',

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

	@@ -1 +1 @@
1	- {"version":3,"file":"modal.service.js","sourceRoot":"","sources":["../../../../../libs/ui/src/lib/modal/modal.service.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;;AAGnD;;GAEG;AAIH,MAAM,OAAO,YAAY;IACN,MAAM,GAAG,MAAM,CAAC,KAAK,~~kDAAC~~,CAAC;IACvB,MAAM,GAAG,MAAM,CAAc;QAC5C,KAAK,EAAE,EAAE;QACT,OAAO,EAAE,EAAE;QACX,IAAI,EAAE,MAAM;KACb,~~kDAAC~~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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 * @param options.allowHtml\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 allowHtml?: boolean;\n }): Promise<boolean> {\n const { title, message, confirmText = 'Confirmar', cancelText = 'Cancelar', allowHtml } = options;\n return this.showModal({\n title,\n message,\n type: 'confirm',\n confirmText,\n cancelText,\n allowHtml,\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 * @param options.allowHtml\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 allowHtml?: boolean;\n }): Promise<boolean> {\n const { title, message, yesText = 'Sí', noText = 'No', allowHtml } = options;\n return this.showModal({\n title,\n message,\n type: 'yesNo',\n yesText,\n noText,\n allowHtml,\n }).then((result) => result.action === 'yes');\n }\n\n /\n \n * @param title\n * @param message\n * @param allowHtml\n * @param confirmText\n * @returns Promise que resuelve cuando se cierra el modal\n /\n async info(title: string, message: string, allowHtml?: boolean, confirmText?: string): Promise<void> {\n return this.showModal({\n title,\n message,\n type: 'info',\n allowHtml,\n confirmText,\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 * @param options.allowHtml\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 allowHtml?: boolean;\n }): Promise<boolean> {\n const { title, message, confirmText = 'Entendido', cancelText = 'Cancelar', allowHtml } = options;\n return this.showModal({\n title,\n message,\n type: 'warning',\n confirmText,\n cancelText,\n allowHtml,\n }).then((result) => result.confirmed);\n }\n\n /\n \n * @param title\n * @param message\n * @param confirmText\n * @param allowHtml\n * @returns Promise que resuelve true si se confirmó\n /\n async error(\n title: string,\n message: string,\n confirmText = 'Entendido',\n allowHtml?: boolean\n ): Promise<void> {\n return this.showModal({\n title,\n message,\n type: 'error',\n confirmText,\n allowHtml,\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"]}
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';\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 * @param options.allowHtml\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 allowHtml?: boolean;\n }): Promise<boolean> {\n const { title, message, confirmText = 'Confirmar', cancelText = 'Cancelar', allowHtml } = options;\n return this.showModal({\n title,\n message,\n type: 'confirm',\n confirmText,\n cancelText,\n allowHtml,\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 * @param options.allowHtml\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 allowHtml?: boolean;\n }): Promise<boolean> {\n const { title, message, yesText = 'Sí', noText = 'No', allowHtml } = options;\n return this.showModal({\n title,\n message,\n type: 'yesNo',\n yesText,\n noText,\n allowHtml,\n }).then((result) => result.action === 'yes');\n }\n\n /\n \n * @param title\n * @param message\n * @param allowHtml\n * @param confirmText\n * @returns Promise que resuelve cuando se cierra el modal\n /\n async info(title: string, message: string, allowHtml?: boolean, confirmText?: string): Promise<void> {\n return this.showModal({\n title,\n message,\n type: 'info',\n allowHtml,\n confirmText,\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 * @param options.allowHtml\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 allowHtml?: boolean;\n }): Promise<boolean> {\n const { title, message, confirmText = 'Entendido', cancelText = 'Cancelar', allowHtml } = options;\n return this.showModal({\n title,\n message,\n type: 'warning',\n confirmText,\n cancelText,\n allowHtml,\n }).then((result) => result.confirmed);\n }\n\n /\n \n * @param title\n * @param message\n * @param confirmText\n * @param allowHtml\n * @returns Promise que resuelve true si se confirmó\n /\n async error(\n title: string,\n message: string,\n confirmText = 'Entendido',\n allowHtml?: boolean\n ): Promise<void> {\n return this.showModal({\n title,\n message,\n type: 'error',\n confirmText,\n allowHtml,\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 CHANGED Viewed

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

package/esm2022/lib/navigation-card/navigation-card.component.js CHANGED Viewed

@@ -2,16 +2,16 @@ import { Component, input, output, ChangeDetectionStrategy } from '@angular/core
 import { IconComponent } from '../icon';
 import * as i0 from "@angular/core";
 export class NavigationCardComponent {
-    card = input.required(...(ngDevMode ? [{ debugName: "card" }] : []));
-    active = input(false, ...(ngDevMode ? [{ debugName: "active" }] : []));
+    card = input.required(...(ngDevMode ? [{ debugName: "card" }] : /* istanbul ignore next */ []));
+    active = input(false, ...(ngDevMode ? [{ debugName: "active" }] : /* istanbul ignore next */ []));
     cardClick = output();
     onCardClick() {
         this.cardClick.emit(this.card());
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: NavigationCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.10", type: NavigationCardComponent, isStandalone: true, selector: "c80-navigation-card", inputs: { card: { classPropertyName: "card", publicName: "card", isSignal: true, isRequired: true, transformFunction: null }, active: { classPropertyName: "active", publicName: "active", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { cardClick: "cardClick" }, ngImport: i0, template: "<button type=\"button\" class=\"nav-card\" [class.active]=\"active()\" (click)=\"onCardClick()\">\n    <c80-icon [icon]=\"card().icon\" [size]=\"1.7\" class=\"card-icon\" />\n    <h3 class=\"card-title\">{{ card().title }}</h3>\n</button>", styles: [".nav-card{background:var(--color-bg-primary);border:1px solid var(--color-border-default);border-radius:12px;padding:24px;cursor:pointer;transition:all .1s ease;display:flex;flex-direction:column;align-items:center;text-align:center;min-height:140px;justify-content:center;width:100%;font-family:inherit;font-size:inherit}.nav-card:hover{background:var(--color-bg-hover);box-shadow:var(--shadow-md);transform:translateY(-1px);border-color:var(--color-border-medium)}.nav-card.active{background:var(--color-bg-tertiary);border-color:var(--color-text-primary)}.nav-card:focus-visible{outline:none}.nav-card .card-icon{margin-bottom:12px;display:flex;justify-content:center;align-items:center}.nav-card .card-title{font-size:16px;font-weight:600;margin:0;color:var(--color-text-primary);transition:color .2s}@media(max-width:768px){.nav-card{min-height:120px;padding:20px}.nav-card .card-icon{font-size:40px;width:40px;height:40px}.nav-card .card-title{font-size:14px}}\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 ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: NavigationCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.17", type: NavigationCardComponent, isStandalone: true, selector: "c80-navigation-card", inputs: { card: { classPropertyName: "card", publicName: "card", isSignal: true, isRequired: true, transformFunction: null }, active: { classPropertyName: "active", publicName: "active", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { cardClick: "cardClick" }, ngImport: i0, template: "<button type=\"button\" class=\"nav-card\" [class.active]=\"active()\" (click)=\"onCardClick()\">\n    <c80-icon [icon]=\"card().icon\" [size]=\"1.7\" class=\"card-icon\" />\n    <h3 class=\"card-title\">{{ card().title }}</h3>\n</button>", styles: [".nav-card{background:var(--color-bg-primary);border:1px solid var(--color-border-default);border-radius:12px;padding:24px;cursor:pointer;transition:all .1s ease;display:flex;flex-direction:column;align-items:center;text-align:center;min-height:140px;justify-content:center;width:100%;font-family:inherit;font-size:inherit}.nav-card:hover{background:var(--color-bg-hover);box-shadow:var(--shadow-md);transform:translateY(-1px);border-color:var(--color-border-medium)}.nav-card.active{background:var(--color-bg-tertiary);border-color:var(--color-text-primary)}.nav-card:focus-visible{outline:none}.nav-card .card-icon{margin-bottom:12px;display:flex;justify-content:center;align-items:center}.nav-card .card-title{font-size:16px;font-weight:600;margin:0;color:var(--color-text-primary);transition:color .2s}@media(max-width:768px){.nav-card{min-height:120px;padding:20px}.nav-card .card-icon{font-size:40px;width:40px;height:40px}.nav-card .card-title{font-size:14px}}\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: NavigationCardComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: NavigationCardComponent, decorators: [{
             type: Component,
             args: [{ selector: 'c80-navigation-card', standalone: true, imports: [IconComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<button type=\"button\" class=\"nav-card\" [class.active]=\"active()\" (click)=\"onCardClick()\">\n    <c80-icon [icon]=\"card().icon\" [size]=\"1.7\" class=\"card-icon\" />\n    <h3 class=\"card-title\">{{ card().title }}</h3>\n</button>", styles: [".nav-card{background:var(--color-bg-primary);border:1px solid var(--color-border-default);border-radius:12px;padding:24px;cursor:pointer;transition:all .1s ease;display:flex;flex-direction:column;align-items:center;text-align:center;min-height:140px;justify-content:center;width:100%;font-family:inherit;font-size:inherit}.nav-card:hover{background:var(--color-bg-hover);box-shadow:var(--shadow-md);transform:translateY(-1px);border-color:var(--color-border-medium)}.nav-card.active{background:var(--color-bg-tertiary);border-color:var(--color-text-primary)}.nav-card:focus-visible{outline:none}.nav-card .card-icon{margin-bottom:12px;display:flex;justify-content:center;align-items:center}.nav-card .card-title{font-size:16px;font-weight:600;margin:0;color:var(--color-text-primary);transition:color .2s}@media(max-width:768px){.nav-card{min-height:120px;padding:20px}.nav-card .card-icon{font-size:40px;width:40px;height:40px}.nav-card .card-title{font-size:14px}}\n"] }]
         }], propDecorators: { card: [{ type: i0.Input, args: [{ isSignal: true, alias: "card", required: true }] }], active: [{ type: i0.Input, args: [{ isSignal: true, alias: "active", required: false }] }], cardClick: [{ type: i0.Output, args: ["cardClick"] }] } });

package/esm2022/lib/navigation-card/navigation-card.component.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"navigation-card.component.js","sourceRoot":"","sources":["../../../../../libs/ui/src/lib/navigation-card/navigation-card.component.ts","../../../../../libs/ui/src/lib/navigation-card/navigation-card.component.html"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,EAAE,uBAAuB,EAAE,MAAM,eAAe,CAAC;AAClF,OAAO,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;;~~AAaxC~~,MAAM,OAAO,uBAAuB;IACvB,IAAI,GAAG,KAAK,CAAC,QAAQ~~,+CAAkB~~,CAAC;IACxC,MAAM,GAAG,KAAK,CAAU,KAAK,~~kDAAC~~,CAAC;IAC/B,SAAS,GAAG,MAAM,EAAkB,CAAC;IAE9C,WAAW;QACP,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC,CAAC;IACrC,CAAC;wGAPQ,uBAAuB;4FAAvB,uBAAuB,+~~WCdpC~~,gPAGS,~~kgCDMK~~,aAAa;;4FAKd,uBAAuB;~~kBATnC~~,SAAS;+~~BAEI~~,qBAAqB,cACnB,IAAI,WACP,CAAC,aAAa,CAAC,mBAGP,uBAAuB,CAAC,MAAM","sourcesContent":["import { Component, input, output, ChangeDetectionStrategy } from '@angular/core';\nimport { IconComponent } from '../icon';\nimport type { NavigationCard } from './navigation-card.types';\n\n\n@Component({\~~n // eslint-disable-next-line @angular-eslint/component-selector~~\n selector: 'c80-navigation-card',\n standalone: true,\n imports: [IconComponent],\n templateUrl: './navigation-card.component.html',\n styleUrl: './navigation-card.component.scss',\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class NavigationCardComponent {\n readonly card = input.required<NavigationCard>();\n readonly active = input<boolean>(false);\n readonly cardClick = output<NavigationCard>();\n\n onCardClick(): void {\n this.cardClick.emit(this.card());\n }\n}\n","<button type=\"button\" class=\"nav-card\" [class.active]=\"active()\" (click)=\"onCardClick()\">\n <c80-icon [icon]=\"card().icon\" [size]=\"1.7\" class=\"card-icon\" />\n <h3 class=\"card-title\">{{ card().title }}</h3>\n</button>"]}
1	+ {"version":3,"file":"navigation-card.component.js","sourceRoot":"","sources":["../../../../../libs/ui/src/lib/navigation-card/navigation-card.component.ts","../../../../../libs/ui/src/lib/navigation-card/navigation-card.component.html"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,EAAE,uBAAuB,EAAE,MAAM,eAAe,CAAC;AAClF,OAAO,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;;AAYxC,MAAM,OAAO,uBAAuB;IACvB,IAAI,GAAG,KAAK,CAAC,QAAQ,0EAAkB,CAAC;IACxC,MAAM,GAAG,KAAK,CAAU,KAAK,6EAAC,CAAC;IAC/B,SAAS,GAAG,MAAM,EAAkB,CAAC;IAE9C,WAAW;QACP,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC,CAAC;IACrC,CAAC;wGAPQ,uBAAuB;4FAAvB,uBAAuB,+WCbpC,gPAGS,kgCDKK,aAAa;;4FAKd,uBAAuB;kBARnC,SAAS;+BACI,qBAAqB,cACnB,IAAI,WACP,CAAC,aAAa,CAAC,mBAGP,uBAAuB,CAAC,MAAM","sourcesContent":["import { Component, input, output, ChangeDetectionStrategy } from '@angular/core';\r\nimport { IconComponent } from '../icon';\r\nimport type { NavigationCard } from './navigation-card.types';\r\n\r\n\r\n@Component({\r\n selector: 'c80-navigation-card',\r\n standalone: true,\r\n imports: [IconComponent],\r\n templateUrl: './navigation-card.component.html',\r\n styleUrl: './navigation-card.component.scss',\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n})\r\nexport class NavigationCardComponent {\r\n readonly card = input.required<NavigationCard>();\r\n readonly active = input<boolean>(false);\r\n readonly cardClick = output<NavigationCard>();\r\n\r\n onCardClick(): void {\r\n this.cardClick.emit(this.card());\r\n }\r\n}\r\n","<button type=\"button\" class=\"nav-card\" [class.active]=\"active()\" (click)=\"onCardClick()\">\n <c80-icon [icon]=\"card().icon\" [size]=\"1.7\" class=\"card-icon\" />\n <h3 class=\"card-title\">{{ card().title }}</h3>\n</button>"]}

package/esm2022/lib/navigation-card/navigation-card.types.js CHANGED Viewed

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

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

@@ -5,11 +5,11 @@ import * as i0 from "@angular/core";
  * 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\" [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:capitalize}.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:capitalize}@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 });
+    stats = input.required(...(ngDevMode ? [{ debugName: "stats" }] : /* istanbul ignore next */ []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: ProfileStatsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", 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:capitalize}.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:capitalize}@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: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", 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\" [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:capitalize}.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:capitalize}@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 }] }] } });

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

	@@ -1 +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;;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>"]}
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;;AAG1E;;;GAGG;AAQH,MAAM,OAAO,qBAAqB;IAC9B,KAAK,GAAG,KAAK,CAAC,QAAQ,2EAAc,CAAC;wGAD5B,qBAAqB;4FAArB,qBAAqB,gNCdlC,ugBAaM;;4FDCO,qBAAqB;kBAPjC,SAAS;+BACI,mBAAmB,cACjB,IAAI,mBAGC,uBAAuB,CAAC,MAAM","sourcesContent":["import { ChangeDetectionStrategy, Component, input } from '@angular/core';\r\nimport type { StatItem } from './profile-stats.types';\r\n\r\n/*\r\n Componente para mostrar estadísticas del usuario\r\n * Soporta valores con etiquetas o botones de acción\r\n */\r\n@Component({\r\n selector: 'c80-profile-stats',\r\n standalone: true,\r\n templateUrl: './profile-stats.component.html',\r\n styleUrl: './profile-stats.component.scss',\r\n changeDetection: ChangeDetectionStrategy.OnPush\r\n})\r\nexport class ProfileStatsComponent {\r\n stats = input.required<StatItem[]>();\r\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 CHANGED Viewed

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

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

@@ -5,17 +5,17 @@ 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" }] : []));
+    rating = input(0, ...(ngDevMode ? [{ debugName: "rating" }] : /* istanbul ignore next */ []));
+    size = input(0.1, ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
+    spacing = input(-22, ...(ngDevMode ? [{ debugName: "spacing" }] : /* istanbul ignore next */ []));
     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 });
+    }, ...(ngDevMode ? [{ debugName: "stars" }] : /* istanbul ignore next */ []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: RatingDisplayComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", 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: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: RatingDisplayComponent, decorators: [{
             type: Component,
             args: [{ selector: 'c80-rating-display', standalone: true, imports: [IconComponent], changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         '[style.--spacing.px]': 'spacing()'

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

	@@ -1 +1 @@
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>"]}
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;AAYH,MAAM,OAAO,sBAAsB;IAC/B,MAAM,GAAG,KAAK,CAAS,CAAC,6EAAC,CAAC;IAC1B,IAAI,GAAG,KAAK,CAAS,GAAG,2EAAC,CAAC;IAC1B,OAAO,GAAG,KAAK,CAAS,CAAC,EAAE,8EAAC,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,4EAAC,CAAC;wGARM,sBAAsB;4FAAtB,sBAAsB,qgBCjBnC,iMAIM,wPDKQ,aAAa;;4FAQd,sBAAsB;kBAXlC,SAAS;+BACI,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';\r\nimport { IconComponent } from '../icon';\r\n\r\n/*\r\n \r\n */\r\n@Component({\r\n selector: 'c80-rating-display',\r\n standalone: true,\r\n imports: [IconComponent],\r\n templateUrl: './rating-display.component.html',\r\n styleUrl: './rating-display.component.scss',\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n host: {\r\n '[style.--spacing.px]': 'spacing()'\r\n }\r\n})\r\nexport class RatingDisplayComponent {\r\n rating = input<number>(0);\r\n size = input<number>(0.1);\r\n spacing = input<number>(-22);\r\n\r\n protected readonly stars = computed(() => {\r\n const rating = Math.round(this.rating());\r\n return Array.from({ length: rating });\r\n });\r\n}\r\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/rating-stars.component.js CHANGED Viewed

@@ -5,15 +5,15 @@ 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" }] : []));
+    rating = input(0, ...(ngDevMode ? [{ debugName: "rating" }] : /* istanbul ignore next */ []));
+    showLabel = input(false, ...(ngDevMode ? [{ debugName: "showLabel" }] : /* istanbul ignore next */ []));
+    readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : /* istanbul ignore next */ []));
     ratingChange = output();
-    currentRating = computed(() => this.rating(), ...(ngDevMode ? [{ debugName: "currentRating" }] : []));
+    currentRating = computed(() => this.rating(), ...(ngDevMode ? [{ debugName: "currentRating" }] : /* istanbul ignore next */ []));
     stars = computed(() => {
         const rating = this.currentRating();
         return Array.from({ length: 5 }, (_, i) => i < rating);
-    }, ...(ngDevMode ? [{ debugName: "stars" }] : []));
+    }, ...(ngDevMode ? [{ debugName: "stars" }] : /* istanbul ignore next */ []));
     /**
      *
      * @param rating
@@ -23,10 +23,10 @@ export class RatingStarsComponent {
             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 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: RatingStarsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", 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: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", 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"] }] } });

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

	@@ -1 +1 @@
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>"]}
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;AASH,MAAM,OAAO,oBAAoB;IAC7B,MAAM,GAAG,KAAK,CAAS,CAAC,6EAAC,CAAC;IAC1B,SAAS,GAAG,KAAK,CAAU,KAAK,gFAAC,CAAC;IAClC,QAAQ,GAAG,KAAK,CAAU,KAAK,+EAAC,CAAC;IAEjC,YAAY,GAAG,MAAM,EAAU,CAAC;IAEb,aAAa,GAAG,QAAQ,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,MAAM,EAAE,oFAAC,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,4EAAC,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,mgBCdjC,8hBAQM,mkBDCQ,aAAa;;4FAKd,oBAAoB;kBARhC,SAAS;+BACI,kBAAkB,cAChB,IAAI,WACP,CAAC,aAAa,CAAC,mBAGP,uBAAuB,CAAC,MAAM","sourcesContent":["import { ChangeDetectionStrategy, Component, computed, input, output } from '@angular/core';\r\nimport { IconComponent } from '../icon';\r\n\r\n/*\r\n \r\n /\r\n@Component({\r\n selector: 'c80-rating-stars',\r\n standalone: true,\r\n imports: [IconComponent],\r\n templateUrl: './rating-stars.component.html',\r\n styleUrl: './rating-stars.component.scss',\r\n changeDetection: ChangeDetectionStrategy.OnPush\r\n})\r\nexport class RatingStarsComponent {\r\n rating = input<number>(0);\r\n showLabel = input<boolean>(false);\r\n readonly = input<boolean>(false);\r\n\r\n ratingChange = output<number>();\r\n\r\n protected readonly currentRating = computed(() => this.rating());\r\n\r\n protected readonly stars = computed(() => {\r\n const rating = this.currentRating();\r\n return Array.from({ length: 5 }, (_, i) => i < rating);\r\n });\r\n\r\n /\r\n \r\n * @param rating\r\n */\r\n protected onStarClick(rating: number): void {\r\n if (this.readonly()) return;\r\n this.ratingChange.emit(rating);\r\n }\r\n}\r\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/select.component.js CHANGED Viewed

@@ -5,38 +5,38 @@ let uniqueIdCounter = 0;
  *
  */
 export class SelectComponent {
-    label = input.required(...(ngDevMode ? [{ debugName: "label" }] : []));
+    label = input.required(...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
     /* v8 ignore next */
-    placeholder = input('Seleccionar', ...(ngDevMode ? [{ debugName: "placeholder" }] : []));
+    placeholder = input('Seleccionar', ...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
     /* v8 ignore next */
-    value = input(null, ...(ngDevMode ? [{ debugName: "value" }] : []));
+    value = input(null, ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
     /* v8 ignore next */
-    options = input([], ...(ngDevMode ? [{ debugName: "options" }] : []));
+    options = input([], ...(ngDevMode ? [{ debugName: "options" }] : /* istanbul ignore next */ []));
     /* v8 ignore next */
-    disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : []));
+    disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
     /* v8 ignore next */
-    loading = input(false, ...(ngDevMode ? [{ debugName: "loading" }] : []));
+    loading = input(false, ...(ngDevMode ? [{ debugName: "loading" }] : /* istanbul ignore next */ []));
     /* v8 ignore next */
-    emptyMessage = input('No hay opciones disponibles', ...(ngDevMode ? [{ debugName: "emptyMessage" }] : []));
+    emptyMessage = input('No hay opciones disponibles', ...(ngDevMode ? [{ debugName: "emptyMessage" }] : /* istanbul ignore next */ []));
     /* v8 ignore next */
-    maxHeight = input('300px', ...(ngDevMode ? [{ debugName: "maxHeight" }] : []));
+    maxHeight = input('300px', ...(ngDevMode ? [{ debugName: "maxHeight" }] : /* istanbul ignore next */ []));
     /* v8 ignore next */
-    filterable = input(false, ...(ngDevMode ? [{ debugName: "filterable" }] : []));
+    filterable = input(false, ...(ngDevMode ? [{ debugName: "filterable" }] : /* istanbul ignore next */ []));
     valueChange = output();
     opened = output();
     /* v8 ignore next */
-    isOpen = signal(false, ...(ngDevMode ? [{ debugName: "isOpen" }] : []));
+    isOpen = signal(false, ...(ngDevMode ? [{ debugName: "isOpen" }] : /* istanbul ignore next */ []));
     /* v8 ignore next */
-    searchTerm = signal('', ...(ngDevMode ? [{ debugName: "searchTerm" }] : []));
+    searchTerm = signal('', ...(ngDevMode ? [{ debugName: "searchTerm" }] : /* istanbul ignore next */ []));
     controlId = `c80-select-${++uniqueIdCounter}`;
-    searchInput = viewChild('searchInput', ...(ngDevMode ? [{ debugName: "searchInput" }] : []));
+    searchInput = viewChild('searchInput', ...(ngDevMode ? [{ debugName: "searchInput" }] : /* istanbul ignore next */ []));
     filteredOptions = computed(() => {
         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" }] : []));
+    }, ...(ngDevMode ? [{ debugName: "filteredOptions" }] : /* istanbul ignore next */ []));
     normalizeString(str) {
         return str.toLowerCase().trim();
     }
@@ -110,11 +110,11 @@ export class SelectComponent {
     clearSearch() {
         this.searchTerm.set('');
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: SelectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.10", type: SelectComponent, isStandalone: true, selector: "c80-select", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: true, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, emptyMessage: { classPropertyName: "emptyMessage", publicName: "emptyMessage", isSignal: true, isRequired: false, transformFunction: null }, maxHeight: { classPropertyName: "maxHeight", publicName: "maxHeight", isSignal: true, isRequired: false, transformFunction: null }, filterable: { classPropertyName: "filterable", publicName: "filterable", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange", opened: "opened" }, viewQueries: [{ propertyName: "searchInput", first: true, predicate: ["searchInput"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"k-select\" [class.k-select--disabled]=\"disabled()\" [class.k-select--open]=\"isOpen()\">\n  <button type=\"button\" class=\"k-select__control\" [attr.id]=\"controlId\" [attr.aria-label]=\"label()\" [attr.aria-expanded]=\"isOpen()\" [disabled]=\"disabled() || loading()\" (click)=\"toggleDropdown()\" (keydown.enter)=\"toggleDropdown()\"\n    (keydown.space)=\"$event.preventDefault(); toggleDropdown()\">\n    <span class=\"k-select__value\" [class.k-select__value--placeholder]=\"value() === null\">\n      @if (loading()) {\n      Cargando...\n      } @else {\n      {{ getSelectedLabel() }}\n      }\n    </span>\n    <span class=\"k-select__arrow\" [class.k-select__arrow--up]=\"isOpen()\">\u25BC</span>\n  </button>\n\n  @if (isOpen()) {\n  <div class=\"k-select__backdrop\" tabindex=\"-1\" (click)=\"closeDropdown()\" (keydown.escape)=\"closeDropdown()\"></div>\n  <!-- eslint-disable-next-line @angular-eslint/template/no-inline-styles -->\n  <div class=\"k-select__dropdown\" [style.max-height]=\"maxHeight()\">\n    @if (filterable()) {\n    <div class=\"k-select__search\">\n      <input type=\"text\" class=\"k-select__search-input\" [value]=\"searchTerm()\" (input)=\"onSearchChange($any($event.target).value)\" placeholder=\"Buscar...\" (click)=\"$event.stopPropagation()\" (keydown.escape)=\"closeDropdown()\" #searchInput />\n    </div>\n    }\n\n    <button type=\"button\" class=\"k-select__option\" (click)=\"selectNull()\" (keydown.enter)=\"selectNull()\">\n      -- {{ placeholder() }} --\n    </button>\n\n    @if (loading()) {\n    <button type=\"button\" class=\"k-select__option k-select__option--disabled\" disabled>\n      Cargando...\n    </button>\n    } @else if (filteredOptions().length === 0) {\n    <button type=\"button\" class=\"k-select__option k-select__option--disabled\" disabled>\n      {{ searchTerm() ? 'No se encontraron resultados' : emptyMessage() }}\n    </button>\n    } @else {\n    @for (option of filteredOptions(); track option.value) {\n    <button type=\"button\" class=\"k-select__option\" [class.k-select__option--selected]=\"option.value === value()\" [class.k-select__option--disabled]=\"option.disabled\" [disabled]=\"option.disabled\" (click)=\"selectOption(option)\"\n      (keydown.enter)=\"selectOption(option)\">\n      {{ option.label }}\n    </button>\n    }\n    }\n  </div>\n  }\n</div>", styles: [".k-select{position:relative;width:100%;font-family:inherit}.k-select--disabled{opacity:.6;pointer-events:none}.k-select__control{position:relative;display:flex;align-items:center;justify-content:space-between;width:100%;min-height:40px;padding:8px 12px;border:1px solid var(--color-border-default);border-radius:4px;background-color:var(--color-bg-primary);cursor:pointer;transition:all .2s;text-align:left;outline:none}.k-select__control:hover:not(:disabled){border-color:var(--color-border-medium)}.k-select__control:disabled{cursor:not-allowed;opacity:.6}.k-select__control:focus{outline:none}.k-select--open .k-select__control{border-color:var(--color-border-medium)}.k-select__value{flex:1;font-size:.875rem;color:var(--color-text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.k-select__value--placeholder{color:var(--color-text-muted)}.k-select__arrow{font-size:.5rem;color:var(--color-text-secondary);transition:transform .2s;margin-left:6px;flex-shrink:0}.k-select__arrow--up{transform:rotate(180deg)}.k-select__backdrop{position:fixed;inset:0;z-index:999;background-color:transparent}.k-select__dropdown{position:absolute;top:calc(100% + 4px);left:0;right:0;overflow-y:auto;background-color:var(--color-bg-primary);border:1px solid var(--color-border-default);border-radius:4px;box-shadow:var(--shadow-lg);z-index:1000;animation:fadeIn .15s ease-out}.k-select__search{position:sticky;top:0;padding:8px;background-color:var(--color-bg-primary);border-bottom:1px solid var(--color-border-default);z-index:1}.k-select__search-input{width:100%;padding:6px 10px;font-size:.875rem;border:1px solid var(--color-border-default);border-radius:4px;outline:none;transition:border-color .2s;background-color:var(--color-bg-primary);color:var(--color-text-primary)}.k-select__search-input:focus{border-color:var(--color-icon-primary)}.k-select__search-input::placeholder{color:var(--color-text-muted)}.k-select__option{width:100%;padding:8px 12px;font-size:.875rem;color:var(--color-text-primary);cursor:pointer;transition:background-color .15s;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;border:none;background-color:transparent;text-align:left}.k-select__option:hover:not(.k-select__option--disabled):not(:disabled){background-color:var(--color-bg-hover)}.k-select__option--selected{background-color:var(--color-bg-tertiary);font-weight:500}.k-select__option--selected:hover:not(:disabled){background-color:var(--color-bg-hover)}.k-select__option--disabled{color:var(--color-text-muted);cursor:default}.k-select__option:disabled{cursor:not-allowed;opacity:.6}@keyframes fadeIn{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: SelectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: SelectComponent, isStandalone: true, selector: "c80-select", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: true, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, emptyMessage: { classPropertyName: "emptyMessage", publicName: "emptyMessage", isSignal: true, isRequired: false, transformFunction: null }, maxHeight: { classPropertyName: "maxHeight", publicName: "maxHeight", isSignal: true, isRequired: false, transformFunction: null }, filterable: { classPropertyName: "filterable", publicName: "filterable", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange", opened: "opened" }, viewQueries: [{ propertyName: "searchInput", first: true, predicate: ["searchInput"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"k-select\" [class.k-select--disabled]=\"disabled()\" [class.k-select--open]=\"isOpen()\">\r\n  <button type=\"button\" class=\"k-select__control\" [attr.id]=\"controlId\" [attr.aria-label]=\"label()\" [attr.aria-expanded]=\"isOpen()\" [disabled]=\"disabled() || loading()\" (click)=\"toggleDropdown()\" (keydown.enter)=\"toggleDropdown()\"\r\n    (keydown.space)=\"$event.preventDefault(); toggleDropdown()\">\r\n    <span class=\"k-select__value\" [class.k-select__value--placeholder]=\"value() === null\">\r\n      @if (loading()) {\r\n      Cargando...\r\n      } @else {\r\n      {{ getSelectedLabel() }}\r\n      }\r\n    </span>\r\n    <span class=\"k-select__arrow\" [class.k-select__arrow--up]=\"isOpen()\">\u25BC</span>\r\n  </button>\r\n\r\n  @if (isOpen()) {\r\n  <div class=\"k-select__backdrop\" tabindex=\"-1\" (click)=\"closeDropdown()\" (keydown.escape)=\"closeDropdown()\"></div>\r\n  <div class=\"k-select__dropdown\" [style.max-height]=\"maxHeight()\">\r\n    @if (filterable()) {\r\n    <div class=\"k-select__search\">\r\n      <input type=\"text\" class=\"k-select__search-input\" [value]=\"searchTerm()\" (input)=\"onSearchChange($any($event.target).value)\" placeholder=\"Buscar...\" (click)=\"$event.stopPropagation()\" (keydown.escape)=\"closeDropdown()\" #searchInput />\r\n    </div>\r\n    }\r\n\r\n    <button type=\"button\" class=\"k-select__option\" (click)=\"selectNull()\" (keydown.enter)=\"selectNull()\">\r\n      -- {{ placeholder() }} --\r\n    </button>\r\n\r\n    @if (loading()) {\r\n    <button type=\"button\" class=\"k-select__option k-select__option--disabled\" disabled>\r\n      Cargando...\r\n    </button>\r\n    } @else if (filteredOptions().length === 0) {\r\n    <button type=\"button\" class=\"k-select__option k-select__option--disabled\" disabled>\r\n      {{ searchTerm() ? 'No se encontraron resultados' : emptyMessage() }}\r\n    </button>\r\n    } @else {\r\n    @for (option of filteredOptions(); track option.value) {\r\n    <button type=\"button\" class=\"k-select__option\" [class.k-select__option--selected]=\"option.value === value()\" [class.k-select__option--disabled]=\"option.disabled\" [disabled]=\"option.disabled\" (click)=\"selectOption(option)\"\r\n      (keydown.enter)=\"selectOption(option)\">\r\n      {{ option.label }}\r\n    </button>\r\n    }\r\n    }\r\n  </div>\r\n  }\r\n</div>", styles: [".k-select{position:relative;width:100%;font-family:inherit}.k-select--disabled{opacity:.6;pointer-events:none}.k-select__control{position:relative;display:flex;align-items:center;justify-content:space-between;width:100%;min-height:40px;padding:8px 12px;border:1px solid var(--color-border-default);border-radius:4px;background-color:var(--color-bg-primary);cursor:pointer;transition:all .2s;text-align:left;outline:none}.k-select__control:hover:not(:disabled){border-color:var(--color-border-medium)}.k-select__control:disabled{cursor:not-allowed;opacity:.6}.k-select__control:focus{outline:none}.k-select--open .k-select__control{border-color:var(--color-border-medium)}.k-select__value{flex:1;font-size:.875rem;color:var(--color-text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.k-select__value--placeholder{color:var(--color-text-muted)}.k-select__arrow{font-size:.5rem;color:var(--color-text-secondary);transition:transform .2s;margin-left:6px;flex-shrink:0}.k-select__arrow--up{transform:rotate(180deg)}.k-select__backdrop{position:fixed;inset:0;z-index:999;background-color:transparent}.k-select__dropdown{position:absolute;top:calc(100% + 4px);left:0;right:0;overflow-y:auto;background-color:var(--color-bg-primary);border:1px solid var(--color-border-default);border-radius:4px;box-shadow:var(--shadow-lg);z-index:1000;animation:fadeIn .15s ease-out}.k-select__search{position:sticky;top:0;padding:8px;background-color:var(--color-bg-primary);border-bottom:1px solid var(--color-border-default);z-index:1}.k-select__search-input{width:100%;padding:6px 10px;font-size:.875rem;border:1px solid var(--color-border-default);border-radius:4px;outline:none;transition:border-color .2s;background-color:var(--color-bg-primary);color:var(--color-text-primary)}.k-select__search-input:focus{border-color:var(--color-icon-primary)}.k-select__search-input::placeholder{color:var(--color-text-muted)}.k-select__option{width:100%;padding:8px 12px;font-size:.875rem;color:var(--color-text-primary);cursor:pointer;transition:background-color .15s;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;border:none;background-color:transparent;text-align:left}.k-select__option:hover:not(.k-select__option--disabled):not(:disabled){background-color:var(--color-bg-hover)}.k-select__option--selected{background-color:var(--color-bg-tertiary);font-weight:500}.k-select__option--selected:hover:not(:disabled){background-color:var(--color-bg-hover)}.k-select__option--disabled{color:var(--color-text-muted);cursor:default}.k-select__option:disabled{cursor:not-allowed;opacity:.6}@keyframes fadeIn{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: SelectComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: SelectComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'c80-select', standalone: true, imports: [], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"k-select\" [class.k-select--disabled]=\"disabled()\" [class.k-select--open]=\"isOpen()\">\n  <button type=\"button\" class=\"k-select__control\" [attr.id]=\"controlId\" [attr.aria-label]=\"label()\" [attr.aria-expanded]=\"isOpen()\" [disabled]=\"disabled() || loading()\" (click)=\"toggleDropdown()\" (keydown.enter)=\"toggleDropdown()\"\n    (keydown.space)=\"$event.preventDefault(); toggleDropdown()\">\n    <span class=\"k-select__value\" [class.k-select__value--placeholder]=\"value() === null\">\n      @if (loading()) {\n      Cargando...\n      } @else {\n      {{ getSelectedLabel() }}\n      }\n    </span>\n    <span class=\"k-select__arrow\" [class.k-select__arrow--up]=\"isOpen()\">\u25BC</span>\n  </button>\n\n  @if (isOpen()) {\n  <div class=\"k-select__backdrop\" tabindex=\"-1\" (click)=\"closeDropdown()\" (keydown.escape)=\"closeDropdown()\"></div>\n  <!-- eslint-disable-next-line @angular-eslint/template/no-inline-styles -->\n  <div class=\"k-select__dropdown\" [style.max-height]=\"maxHeight()\">\n    @if (filterable()) {\n    <div class=\"k-select__search\">\n      <input type=\"text\" class=\"k-select__search-input\" [value]=\"searchTerm()\" (input)=\"onSearchChange($any($event.target).value)\" placeholder=\"Buscar...\" (click)=\"$event.stopPropagation()\" (keydown.escape)=\"closeDropdown()\" #searchInput />\n    </div>\n    }\n\n    <button type=\"button\" class=\"k-select__option\" (click)=\"selectNull()\" (keydown.enter)=\"selectNull()\">\n      -- {{ placeholder() }} --\n    </button>\n\n    @if (loading()) {\n    <button type=\"button\" class=\"k-select__option k-select__option--disabled\" disabled>\n      Cargando...\n    </button>\n    } @else if (filteredOptions().length === 0) {\n    <button type=\"button\" class=\"k-select__option k-select__option--disabled\" disabled>\n      {{ searchTerm() ? 'No se encontraron resultados' : emptyMessage() }}\n    </button>\n    } @else {\n    @for (option of filteredOptions(); track option.value) {\n    <button type=\"button\" class=\"k-select__option\" [class.k-select__option--selected]=\"option.value === value()\" [class.k-select__option--disabled]=\"option.disabled\" [disabled]=\"option.disabled\" (click)=\"selectOption(option)\"\n      (keydown.enter)=\"selectOption(option)\">\n      {{ option.label }}\n    </button>\n    }\n    }\n  </div>\n  }\n</div>", styles: [".k-select{position:relative;width:100%;font-family:inherit}.k-select--disabled{opacity:.6;pointer-events:none}.k-select__control{position:relative;display:flex;align-items:center;justify-content:space-between;width:100%;min-height:40px;padding:8px 12px;border:1px solid var(--color-border-default);border-radius:4px;background-color:var(--color-bg-primary);cursor:pointer;transition:all .2s;text-align:left;outline:none}.k-select__control:hover:not(:disabled){border-color:var(--color-border-medium)}.k-select__control:disabled{cursor:not-allowed;opacity:.6}.k-select__control:focus{outline:none}.k-select--open .k-select__control{border-color:var(--color-border-medium)}.k-select__value{flex:1;font-size:.875rem;color:var(--color-text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.k-select__value--placeholder{color:var(--color-text-muted)}.k-select__arrow{font-size:.5rem;color:var(--color-text-secondary);transition:transform .2s;margin-left:6px;flex-shrink:0}.k-select__arrow--up{transform:rotate(180deg)}.k-select__backdrop{position:fixed;inset:0;z-index:999;background-color:transparent}.k-select__dropdown{position:absolute;top:calc(100% + 4px);left:0;right:0;overflow-y:auto;background-color:var(--color-bg-primary);border:1px solid var(--color-border-default);border-radius:4px;box-shadow:var(--shadow-lg);z-index:1000;animation:fadeIn .15s ease-out}.k-select__search{position:sticky;top:0;padding:8px;background-color:var(--color-bg-primary);border-bottom:1px solid var(--color-border-default);z-index:1}.k-select__search-input{width:100%;padding:6px 10px;font-size:.875rem;border:1px solid var(--color-border-default);border-radius:4px;outline:none;transition:border-color .2s;background-color:var(--color-bg-primary);color:var(--color-text-primary)}.k-select__search-input:focus{border-color:var(--color-icon-primary)}.k-select__search-input::placeholder{color:var(--color-text-muted)}.k-select__option{width:100%;padding:8px 12px;font-size:.875rem;color:var(--color-text-primary);cursor:pointer;transition:background-color .15s;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;border:none;background-color:transparent;text-align:left}.k-select__option:hover:not(.k-select__option--disabled):not(:disabled){background-color:var(--color-bg-hover)}.k-select__option--selected{background-color:var(--color-bg-tertiary);font-weight:500}.k-select__option--selected:hover:not(:disabled){background-color:var(--color-bg-hover)}.k-select__option--disabled{color:var(--color-text-muted);cursor:default}.k-select__option:disabled{cursor:not-allowed;opacity:.6}@keyframes fadeIn{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}\n"] }]
+            args: [{ selector: 'c80-select', standalone: true, imports: [], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"k-select\" [class.k-select--disabled]=\"disabled()\" [class.k-select--open]=\"isOpen()\">\r\n  <button type=\"button\" class=\"k-select__control\" [attr.id]=\"controlId\" [attr.aria-label]=\"label()\" [attr.aria-expanded]=\"isOpen()\" [disabled]=\"disabled() || loading()\" (click)=\"toggleDropdown()\" (keydown.enter)=\"toggleDropdown()\"\r\n    (keydown.space)=\"$event.preventDefault(); toggleDropdown()\">\r\n    <span class=\"k-select__value\" [class.k-select__value--placeholder]=\"value() === null\">\r\n      @if (loading()) {\r\n      Cargando...\r\n      } @else {\r\n      {{ getSelectedLabel() }}\r\n      }\r\n    </span>\r\n    <span class=\"k-select__arrow\" [class.k-select__arrow--up]=\"isOpen()\">\u25BC</span>\r\n  </button>\r\n\r\n  @if (isOpen()) {\r\n  <div class=\"k-select__backdrop\" tabindex=\"-1\" (click)=\"closeDropdown()\" (keydown.escape)=\"closeDropdown()\"></div>\r\n  <div class=\"k-select__dropdown\" [style.max-height]=\"maxHeight()\">\r\n    @if (filterable()) {\r\n    <div class=\"k-select__search\">\r\n      <input type=\"text\" class=\"k-select__search-input\" [value]=\"searchTerm()\" (input)=\"onSearchChange($any($event.target).value)\" placeholder=\"Buscar...\" (click)=\"$event.stopPropagation()\" (keydown.escape)=\"closeDropdown()\" #searchInput />\r\n    </div>\r\n    }\r\n\r\n    <button type=\"button\" class=\"k-select__option\" (click)=\"selectNull()\" (keydown.enter)=\"selectNull()\">\r\n      -- {{ placeholder() }} --\r\n    </button>\r\n\r\n    @if (loading()) {\r\n    <button type=\"button\" class=\"k-select__option k-select__option--disabled\" disabled>\r\n      Cargando...\r\n    </button>\r\n    } @else if (filteredOptions().length === 0) {\r\n    <button type=\"button\" class=\"k-select__option k-select__option--disabled\" disabled>\r\n      {{ searchTerm() ? 'No se encontraron resultados' : emptyMessage() }}\r\n    </button>\r\n    } @else {\r\n    @for (option of filteredOptions(); track option.value) {\r\n    <button type=\"button\" class=\"k-select__option\" [class.k-select__option--selected]=\"option.value === value()\" [class.k-select__option--disabled]=\"option.disabled\" [disabled]=\"option.disabled\" (click)=\"selectOption(option)\"\r\n      (keydown.enter)=\"selectOption(option)\">\r\n      {{ option.label }}\r\n    </button>\r\n    }\r\n    }\r\n  </div>\r\n  }\r\n</div>", styles: [".k-select{position:relative;width:100%;font-family:inherit}.k-select--disabled{opacity:.6;pointer-events:none}.k-select__control{position:relative;display:flex;align-items:center;justify-content:space-between;width:100%;min-height:40px;padding:8px 12px;border:1px solid var(--color-border-default);border-radius:4px;background-color:var(--color-bg-primary);cursor:pointer;transition:all .2s;text-align:left;outline:none}.k-select__control:hover:not(:disabled){border-color:var(--color-border-medium)}.k-select__control:disabled{cursor:not-allowed;opacity:.6}.k-select__control:focus{outline:none}.k-select--open .k-select__control{border-color:var(--color-border-medium)}.k-select__value{flex:1;font-size:.875rem;color:var(--color-text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.k-select__value--placeholder{color:var(--color-text-muted)}.k-select__arrow{font-size:.5rem;color:var(--color-text-secondary);transition:transform .2s;margin-left:6px;flex-shrink:0}.k-select__arrow--up{transform:rotate(180deg)}.k-select__backdrop{position:fixed;inset:0;z-index:999;background-color:transparent}.k-select__dropdown{position:absolute;top:calc(100% + 4px);left:0;right:0;overflow-y:auto;background-color:var(--color-bg-primary);border:1px solid var(--color-border-default);border-radius:4px;box-shadow:var(--shadow-lg);z-index:1000;animation:fadeIn .15s ease-out}.k-select__search{position:sticky;top:0;padding:8px;background-color:var(--color-bg-primary);border-bottom:1px solid var(--color-border-default);z-index:1}.k-select__search-input{width:100%;padding:6px 10px;font-size:.875rem;border:1px solid var(--color-border-default);border-radius:4px;outline:none;transition:border-color .2s;background-color:var(--color-bg-primary);color:var(--color-text-primary)}.k-select__search-input:focus{border-color:var(--color-icon-primary)}.k-select__search-input::placeholder{color:var(--color-text-muted)}.k-select__option{width:100%;padding:8px 12px;font-size:.875rem;color:var(--color-text-primary);cursor:pointer;transition:background-color .15s;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;border:none;background-color:transparent;text-align:left}.k-select__option:hover:not(.k-select__option--disabled):not(:disabled){background-color:var(--color-bg-hover)}.k-select__option--selected{background-color:var(--color-bg-tertiary);font-weight:500}.k-select__option--selected:hover:not(:disabled){background-color:var(--color-bg-hover)}.k-select__option--disabled{color:var(--color-text-muted);cursor:default}.k-select__option:disabled{cursor:not-allowed;opacity:.6}@keyframes fadeIn{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}\n"] }]
         }], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: true }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], emptyMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyMessage", required: false }] }], maxHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxHeight", required: false }] }], filterable: [{ type: i0.Input, args: [{ isSignal: true, alias: "filterable", required: false }] }], valueChange: [{ type: i0.Output, args: ["valueChange"] }], opened: [{ type: i0.Output, args: ["opened"] }], searchInput: [{ type: i0.ViewChild, args: ['searchInput', { isSignal: true }] }] } });
 //# sourceMappingURL=select.component.js.map

package/esm2022/lib/select/select.component.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"select.component.js","sourceRoot":"","sources":["../../../../../libs/ui/src/lib/select/select.component.ts","../../../../../libs/ui/src/lib/select/select.component.html"],"names":[],"mappings":"AAAA,OAAO,EAAmB,uBAAuB,EAAE,SAAS,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;;AAGhI,IAAI,eAAe,GAAG,CAAC,CAAC;AAExB;;GAEG;~~AAUH~~,MAAM,OAAO,eAAe;IACjB,KAAK,GAAG,KAAK,CAAC,QAAQ,~~gDAAU~~,CAAC;IAC1C,oBAAoB;IACX,WAAW,GAAG,KAAK,CAAS,aAAa,~~uDAAC~~,CAAC;IACpD,oBAAoB;IACX,KAAK,GAAG,KAAK,CAAW,IAAI,~~iDAAC~~,CAAC;IACvC,oBAAoB;IACX,OAAO,GAAG,KAAK,CAAoB,EAAE,~~mDAAC~~,CAAC;IAChD,oBAAoB;IACX,QAAQ,GAAG,KAAK,CAAU,KAAK,~~oDAAC,~~CAAC;IAC1C,oBAAoB;IACX,OAAO,GAAG,KAAK,CAAU,KAAK,~~mDAAC~~,CAAC;IACzC,oBAAoB;IACX,YAAY,GAAG,KAAK,CAAS,6BAA6B,~~wDAAC~~,CAAC;IACrE,oBAAoB;IACX,SAAS,GAAG,KAAK,CAAS,OAAO,~~qDAAC~~,CAAC;IAC5C,oBAAoB;IACX,UAAU,GAAG,KAAK,CAAU,KAAK,~~sDAAC~~,CAAC;IAEnC,WAAW,GAAG,MAAM,EAAY,CAAC;IACjC,MAAM,GAAG,MAAM,EAAQ,CAAC;IAEjC,oBAAoB;IACX,MAAM,GAAG,MAAM,CAAC,KAAK,~~kDAAC~~,CAAC;IAChC,oBAAoB;IACX,UAAU,GAAG,MAAM,CAAS,EAAE,~~sDAAC~~,CAAC;IAChC,SAAS,GAAG,cAAc,EAAE,eAAe,EAAE,CAAC;IAC9C,WAAW,GAAG,SAAS,CAA+B,aAAa,~~uDAAC~~,CAAC;IAErE,eAAe,GAAG,QAAQ,CAAC,GAAG,EAAE;QACvC,MAAM,IAAI,GAAG,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,UAAU,EAAE,CAAC,CAAC;QACrD,IAAI,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,UAAU,EAAE,EAAE,CAAC;YAChC,OAAO,IAAI,CAAC,OAAO,EAAE,CAAC;QACxB,CAAC;QACD,OAAO,IAAI,CAAC,OAAO,EAAE,CAAC,MAAM,CAAC,GAAG,CAAC,EAAE,CACjC,GAAG,CAAC,KAAK,CAAC,WAAW,EAAE,CAAC,QAAQ,CAAC,IAAI,CAAC,CACvC,CAAC;IACJ,CAAC,~~2DAAC~~,CAAC;IAEH,eAAe,CAAC,GAAW;QACzB,OAAO,GAAG,CAAC,WAAW,EAAE,CAAC,IAAI,EAAE,CAAC;IAClC,CAAC;IAED;;OAEG;IACH,cAAc;QACZ,IAAI,IAAI,CAAC,QAAQ,EAAE,IAAI,IAAI,CAAC,OAAO,EAAE,EAAE,CAAC;YACtC,OAAO;QACT,CAAC;QAED,MAAM,OAAO,GAAG,IAAI,CAAC,MAAM,EAAE,CAAC;QAC9B,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,OAAO,CAAC,CAAC;QAE1B,IAAI,OAAO,EAAE,CAAC;YACZ,IAAI,CAAC,WAAW,EAAE,CAAC;QACrB,CAAC;aAAM,CAAC;YACN,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,CAAC;YACnB,IAAI,IAAI,CAAC,UAAU,EAAE,EAAE,CAAC;gBACtB,sBAAsB;gBACtB,UAAU,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,WAAW,EAAE,EAAE,aAAa,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC,CAAC;YACjE,CAAC;QACH,CAAC;IACH,CAAC;IAED;;;OAGG;IACH,YAAY,CAAC,MAAuB;QAClC,IAAI,MAAM,CAAC,QAAQ,EAAE,CAAC;YACpB,OAAO;QACT,CAAC;QAED,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;QACpC,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC;IACzB,CAAC;IAED;;OAEG;IACH,UAAU;QACR,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QAC5B,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC;IACzB,CAAC;IAED;;;OAGG;IACH,gBAAgB;QACd,MAAM,YAAY,GAAG,IAAI,CAAC,KAAK,EAAE,CAAC;QAClC,IAAI,YAAY,KAAK,IAAI,IAAI,YAAY,KAAK,SAAS,EAAE,CAAC;YACxD,OAAO,IAAI,CAAC,WAAW,EAAE,CAAC;QAC5B,CAAC;QAED,MAAM,QAAQ,GAAG,IAAI,CAAC,OAAO,EAAE,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,CAAC,KAAK,KAAK,YAAY,CAAC,CAAC;QACxE,OAAO,QAAQ,EAAE,KAAK,IAAI,IAAI,CAAC,WAAW,EAAE,CAAC;IAC/C,CAAC;IAED;;OAEG;IACH,aAAa;QACX,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC;QACvB,IAAI,CAAC,WAAW,EAAE,CAAC;IACrB,CAAC;IAED;;;OAGG;IACH,cAAc,CAAC,IAAY;QACzB,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC;IAC5B,CAAC;IAED;;OAEG;IACH,WAAW;QACT,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC;IAC1B,CAAC;wGAzHU,eAAe;4FAAf,eAAe,~~u5CCjB5B~~,~~i0EA6CM~~;;4FD5BO,eAAe;~~kBAT3B~~,SAAS;+~~BAEE~~,YAAY,cACV,IAAI,WACP,EAAE,mBAGM,uBAAuB,CAAC,MAAM;whCA6BgB,aAAa","sourcesContent":["import { type ElementRef, ChangeDetectionStrategy, Component, computed, input, output, signal, viewChild } from '@angular/core';\nimport type { SelectOption } from './select.types';\n\nlet uniqueIdCounter = 0;\n\n/*\n \n /\n@Component({\~~n // eslint-disable-next-line @angular-eslint/component-selector~~\n selector: 'c80-select',\n standalone: true,\n imports: [],\n templateUrl: './select.component.html',\n styleUrl: './select.component.scss',\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class SelectComponent<T = string> {\n readonly label = input.required<string>();\n / v8 ignore next /\n readonly placeholder = input<string>('Seleccionar');\n / v8 ignore next /\n readonly value = input<T \| null>(null);\n / v8 ignore next /\n readonly options = input<SelectOption<T>[]>([]);\n / v8 ignore next /\n readonly disabled = input<boolean>(false);\n / v8 ignore next /\n readonly loading = input<boolean>(false);\n / v8 ignore next /\n readonly emptyMessage = input<string>('No hay opciones disponibles');\n / v8 ignore next /\n readonly maxHeight = input<string>('300px');\n / v8 ignore next /\n readonly filterable = input<boolean>(false);\n\n readonly valueChange = output<T \| null>();\n readonly opened = output<void>();\n\n / v8 ignore next /\n readonly isOpen = signal(false);\n / v8 ignore next /\n readonly searchTerm = signal<string>('');\n readonly controlId = `c80-select-${++uniqueIdCounter}`;\n readonly searchInput = viewChild<ElementRef<HTMLInputElement>>('searchInput');\n\n readonly filteredOptions = computed(() => {\n const term = this.normalizeString(this.searchTerm());\n if (!term \|\| !this.filterable()) {\n return this.options();\n }\n return this.options().filter(opt =>\n opt.label.toLowerCase().includes(term)\n );\n });\n\n normalizeString(str: string): string {\n return str.toLowerCase().trim();\n }\n\n /\n \n /\n toggleDropdown(): void {\n if (this.disabled() \|\| this.loading()) {\n return;\n }\n\n const wasOpen = this.isOpen();\n this.isOpen.set(!wasOpen);\n\n if (wasOpen) {\n this.clearSearch();\n } else {\n this.opened.emit();\n if (this.filterable()) {\n / v8 ignore next 2 /\n setTimeout(() => this.searchInput()?.nativeElement.focus(), 0);\n }\n }\n }\n\n /\n \n * @param option\n /\n selectOption(option: SelectOption<T>): void {\n if (option.disabled) {\n return;\n }\n\n this.valueChange.emit(option.value);\n this.isOpen.set(false);\n }\n\n /\n \n /\n selectNull(): void {\n this.valueChange.emit(null);\n this.isOpen.set(false);\n }\n\n /\n \n * @returns Etiqueta del valor seleccionado o placeholder\n /\n getSelectedLabel(): string {\n const currentValue = this.value();\n if (currentValue === null \|\| currentValue === undefined) {\n return this.placeholder();\n }\n\n const selected = this.options().find(opt => opt.value === currentValue);\n return selected?.label ?? this.placeholder();\n }\n\n /\n \n /\n closeDropdown(): void {\n this.isOpen.set(false);\n this.clearSearch();\n }\n\n /\n \n * @param term\n /\n onSearchChange(term: string): void {\n this.searchTerm.set(term);\n }\n\n /\n \n */\n clearSearch(): void {\n this.searchTerm.set('');\n }\n}\n","<div class=\"k-select\" [class.k-select--disabled]=\"disabled()\" [class.k-select--open]=\"isOpen()\">\n <button type=\"button\" class=\"k-select__control\" [attr.id]=\"controlId\" [attr.aria-label]=\"label()\" [attr.aria-expanded]=\"isOpen()\" [disabled]=\"disabled() \|\| loading()\" (click)=\"toggleDropdown()\" (keydown.enter)=\"toggleDropdown()\"\n (keydown.space)=\"$event.preventDefault(); toggleDropdown()\">\n <span class=\"k-select__value\" [class.k-select__value--placeholder]=\"value() === null\">\n @if (loading()) {\n Cargando...\n } @else {\n {{ getSelectedLabel() }}\n }\n </span>\n <span class=\"k-select__arrow\" [class.k-select__arrow--up]=\"isOpen()\">▼</span>\n </button>\n\n @if (isOpen()) {\n <div class=\"k-select__backdrop\" tabindex=\"-1\" (click)=\"closeDropdown()\" (keydown.escape)=\"closeDropdown()\"></div>\n ~~<!-- eslint-disable-next-line @angular-eslint/template/no-inline-styles -->\n~~ <div class=\"k-select__dropdown\" [style.max-height]=\"maxHeight()\">\n @if (filterable()) {\n <div class=\"k-select__search\">\n <input type=\"text\" class=\"k-select__search-input\" [value]=\"searchTerm()\" (input)=\"onSearchChange($any($event.target).value)\" placeholder=\"Buscar...\" (click)=\"$event.stopPropagation()\" (keydown.escape)=\"closeDropdown()\" #searchInput />\n </div>\n }\n\n <button type=\"button\" class=\"k-select__option\" (click)=\"selectNull()\" (keydown.enter)=\"selectNull()\">\n -- {{ placeholder() }} --\n </button>\n\n @if (loading()) {\n <button type=\"button\" class=\"k-select__option k-select__option--disabled\" disabled>\n Cargando...\n </button>\n } @else if (filteredOptions().length === 0) {\n <button type=\"button\" class=\"k-select__option k-select__option--disabled\" disabled>\n {{ searchTerm() ? 'No se encontraron resultados' : emptyMessage() }}\n </button>\n } @else {\n @for (option of filteredOptions(); track option.value) {\n <button type=\"button\" class=\"k-select__option\" [class.k-select__option--selected]=\"option.value === value()\" [class.k-select__option--disabled]=\"option.disabled\" [disabled]=\"option.disabled\" (click)=\"selectOption(option)\"\n (keydown.enter)=\"selectOption(option)\">\n {{ option.label }}\n </button>\n }\n }\n </div>\n }\n</div>"]}
1	+ {"version":3,"file":"select.component.js","sourceRoot":"","sources":["../../../../../libs/ui/src/lib/select/select.component.ts","../../../../../libs/ui/src/lib/select/select.component.html"],"names":[],"mappings":"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","sourcesContent":["import { type ElementRef, ChangeDetectionStrategy, Component, computed, input, output, signal, viewChild } from '@angular/core';\r\nimport type { SelectOption } from './select.types';\r\n\r\nlet uniqueIdCounter = 0;\r\n\r\n/*\r\n \r\n /\r\n@Component({\r\n selector: 'c80-select',\r\n standalone: true,\r\n imports: [],\r\n templateUrl: './select.component.html',\r\n styleUrl: './select.component.scss',\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n})\r\nexport class SelectComponent<T = string> {\r\n readonly label = input.required<string>();\r\n / v8 ignore next /\r\n readonly placeholder = input<string>('Seleccionar');\r\n / v8 ignore next /\r\n readonly value = input<T \| null>(null);\r\n / v8 ignore next /\r\n readonly options = input<SelectOption<T>[]>([]);\r\n / v8 ignore next /\r\n readonly disabled = input<boolean>(false);\r\n / v8 ignore next /\r\n readonly loading = input<boolean>(false);\r\n / v8 ignore next /\r\n readonly emptyMessage = input<string>('No hay opciones disponibles');\r\n / v8 ignore next /\r\n readonly maxHeight = input<string>('300px');\r\n / v8 ignore next /\r\n readonly filterable = input<boolean>(false);\r\n\r\n readonly valueChange = output<T \| null>();\r\n readonly opened = output<void>();\r\n\r\n / v8 ignore next /\r\n readonly isOpen = signal(false);\r\n / v8 ignore next /\r\n readonly searchTerm = signal<string>('');\r\n readonly controlId = `c80-select-${++uniqueIdCounter}`;\r\n readonly searchInput = viewChild<ElementRef<HTMLInputElement>>('searchInput');\r\n\r\n readonly filteredOptions = computed(() => {\r\n const term = this.normalizeString(this.searchTerm());\r\n if (!term \|\| !this.filterable()) {\r\n return this.options();\r\n }\r\n return this.options().filter(opt =>\r\n opt.label.toLowerCase().includes(term)\r\n );\r\n });\r\n\r\n normalizeString(str: string): string {\r\n return str.toLowerCase().trim();\r\n }\r\n\r\n /\r\n \r\n /\r\n toggleDropdown(): void {\r\n if (this.disabled() \|\| this.loading()) {\r\n return;\r\n }\r\n\r\n const wasOpen = this.isOpen();\r\n this.isOpen.set(!wasOpen);\r\n\r\n if (wasOpen) {\r\n this.clearSearch();\r\n } else {\r\n this.opened.emit();\r\n if (this.filterable()) {\r\n / v8 ignore next 2 /\r\n setTimeout(() => this.searchInput()?.nativeElement.focus(), 0);\r\n }\r\n }\r\n }\r\n\r\n /\r\n \r\n * @param option\r\n /\r\n selectOption(option: SelectOption<T>): void {\r\n if (option.disabled) {\r\n return;\r\n }\r\n\r\n this.valueChange.emit(option.value);\r\n this.isOpen.set(false);\r\n }\r\n\r\n /\r\n \r\n /\r\n selectNull(): void {\r\n this.valueChange.emit(null);\r\n this.isOpen.set(false);\r\n }\r\n\r\n /\r\n \r\n * @returns Etiqueta del valor seleccionado o placeholder\r\n /\r\n getSelectedLabel(): string {\r\n const currentValue = this.value();\r\n if (currentValue === null \|\| currentValue === undefined) {\r\n return this.placeholder();\r\n }\r\n\r\n const selected = this.options().find(opt => opt.value === currentValue);\r\n return selected?.label ?? this.placeholder();\r\n }\r\n\r\n /\r\n \r\n /\r\n closeDropdown(): void {\r\n this.isOpen.set(false);\r\n this.clearSearch();\r\n }\r\n\r\n /\r\n \r\n * @param term\r\n /\r\n onSearchChange(term: string): void {\r\n this.searchTerm.set(term);\r\n }\r\n\r\n /\r\n \r\n */\r\n clearSearch(): void {\r\n this.searchTerm.set('');\r\n }\r\n}\r\n","<div class=\"k-select\" [class.k-select--disabled]=\"disabled()\" [class.k-select--open]=\"isOpen()\">\r\n <button type=\"button\" class=\"k-select__control\" [attr.id]=\"controlId\" [attr.aria-label]=\"label()\" [attr.aria-expanded]=\"isOpen()\" [disabled]=\"disabled() \|\| loading()\" (click)=\"toggleDropdown()\" (keydown.enter)=\"toggleDropdown()\"\r\n (keydown.space)=\"$event.preventDefault(); toggleDropdown()\">\r\n <span class=\"k-select__value\" [class.k-select__value--placeholder]=\"value() === null\">\r\n @if (loading()) {\r\n Cargando...\r\n } @else {\r\n {{ getSelectedLabel() }}\r\n }\r\n </span>\r\n <span class=\"k-select__arrow\" [class.k-select__arrow--up]=\"isOpen()\">▼</span>\r\n </button>\r\n\r\n @if (isOpen()) {\r\n <div class=\"k-select__backdrop\" tabindex=\"-1\" (click)=\"closeDropdown()\" (keydown.escape)=\"closeDropdown()\"></div>\r\n <div class=\"k-select__dropdown\" [style.max-height]=\"maxHeight()\">\r\n @if (filterable()) {\r\n <div class=\"k-select__search\">\r\n <input type=\"text\" class=\"k-select__search-input\" [value]=\"searchTerm()\" (input)=\"onSearchChange($any($event.target).value)\" placeholder=\"Buscar...\" (click)=\"$event.stopPropagation()\" (keydown.escape)=\"closeDropdown()\" #searchInput />\r\n </div>\r\n }\r\n\r\n <button type=\"button\" class=\"k-select__option\" (click)=\"selectNull()\" (keydown.enter)=\"selectNull()\">\r\n -- {{ placeholder() }} --\r\n </button>\r\n\r\n @if (loading()) {\r\n <button type=\"button\" class=\"k-select__option k-select__option--disabled\" disabled>\r\n Cargando...\r\n </button>\r\n } @else if (filteredOptions().length === 0) {\r\n <button type=\"button\" class=\"k-select__option k-select__option--disabled\" disabled>\r\n {{ searchTerm() ? 'No se encontraron resultados' : emptyMessage() }}\r\n </button>\r\n } @else {\r\n @for (option of filteredOptions(); track option.value) {\r\n <button type=\"button\" class=\"k-select__option\" [class.k-select__option--selected]=\"option.value === value()\" [class.k-select__option--disabled]=\"option.disabled\" [disabled]=\"option.disabled\" (click)=\"selectOption(option)\"\r\n (keydown.enter)=\"selectOption(option)\">\r\n {{ option.label }}\r\n </button>\r\n }\r\n }\r\n </div>\r\n }\r\n</div>"]}

package/esm2022/lib/select/select.types.js CHANGED Viewed

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

package/esm2022/lib/snackbar/snackbar.component.js CHANGED Viewed

@@ -8,11 +8,11 @@ export class SnackbarComponent {
     renderer = inject(Renderer2);
     cdr = inject(ChangeDetectorRef);
     /* v8 ignore next */
-    data = signal(null, ...(ngDevMode ? [{ debugName: "data" }] : []));
+    data = signal(null, ...(ngDevMode ? [{ debugName: "data" }] : /* istanbul ignore next */ []));
     /* v8 ignore next */
-    visible = signal(false, ...(ngDevMode ? [{ debugName: "visible" }] : []));
+    visible = signal(false, ...(ngDevMode ? [{ debugName: "visible" }] : /* istanbul ignore next */ []));
     timerId;
-    panelClasses = computed(() => this.data()?.config.panelClass.join(' ') ?? '', ...(ngDevMode ? [{ debugName: "panelClasses" }] : []));
+    panelClasses = computed(() => this.data()?.config.panelClass.join(' ') ?? '', ...(ngDevMode ? [{ debugName: "panelClasses" }] : /* istanbul ignore next */ []));
     /**
      *
      * @param data
@@ -66,10 +66,10 @@ export class SnackbarComponent {
             this.renderer.setStyle(host, horizontalPosition, '1rem');
         }
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: SnackbarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.10", type: SnackbarComponent, isStandalone: true, selector: "c80-snackbar", ngImport: i0, template: "@if (visible() && data(); as snackData) {\n<div class=\"snackbar\" [class]=\"panelClasses()\">\n  <span class=\"snackbar-message\">{{ snackData.message }}</span>\n  @if (snackData.action) {\n  <button class=\"snackbar-action\" type=\"button\" (click)=\"dismiss()\">\n    {{ snackData.action }}\n  </button>\n  }\n</div>\n}", styles: [":host{position:fixed;z-index:9999;pointer-events:none}.snackbar{display:flex;align-items:center;gap:.75rem;padding:1rem 1.25rem;background:var(--color-bg-secondary);color:var(--color-text-primary);border:1px solid var(--color-border-default);border-radius:.5rem;box-shadow:var(--shadow-lg);pointer-events:auto;animation:slideIn .3s ease-out;min-width:20rem;max-width:35rem}.snackbar-message{flex:1;font-size:.875rem;line-height:1.5;font-weight:500}.snackbar-action{background:transparent;border:1px solid var(--color-border-default);color:var(--color-text-secondary);cursor:pointer;font-size:.75rem;font-weight:600;text-transform:uppercase;padding:.375rem .75rem;border-radius:.375rem;transition:all .2s ease;white-space:nowrap}.snackbar-action:hover{background-color:var(--color-bg-hover);border-color:var(--color-border-medium);color:var(--color-text-primary)}.snackbar-action:active{transform:scale(.98)}.notification-success{background:var(--color-bg-success-light);border-color:var(--color-border-success);color:var(--color-text-success)}.notification-success .snackbar-message{color:var(--color-text-success)}.notification-success .snackbar-action{color:var(--color-text-success);border-color:var(--color-border-success)}.notification-success .snackbar-action:hover{background-color:var(--color-bg-success);border-color:var(--color-border-success)}.notification-error{background:var(--color-bg-danger-light);border-color:var(--color-border-danger);color:var(--color-text-danger)}.notification-error .snackbar-message{color:var(--color-text-danger)}.notification-error .snackbar-action{color:var(--color-text-danger);border-color:var(--color-border-danger)}.notification-error .snackbar-action:hover{background-color:var(--color-bg-danger);border-color:var(--color-border-danger)}@keyframes slideIn{0%{opacity:0;transform:translateY(-1rem)}to{opacity:1;transform:translateY(0)}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: SnackbarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: SnackbarComponent, isStandalone: true, selector: "c80-snackbar", ngImport: i0, template: "@if (visible() && data(); as snackData) {\n<div class=\"snackbar\" [class]=\"panelClasses()\">\n  <span class=\"snackbar-message\">{{ snackData.message }}</span>\n  @if (snackData.action) {\n  <button class=\"snackbar-action\" type=\"button\" (click)=\"dismiss()\">\n    {{ snackData.action }}\n  </button>\n  }\n</div>\n}", styles: [":host{position:fixed;z-index:9999;pointer-events:none}.snackbar{display:flex;align-items:center;gap:.75rem;padding:1rem 1.25rem;background:var(--color-bg-secondary);color:var(--color-text-primary);border:1px solid var(--color-border-default);border-radius:.5rem;box-shadow:var(--shadow-lg);pointer-events:auto;animation:slideIn .3s ease-out;min-width:20rem;max-width:35rem}.snackbar-message{flex:1;font-size:.875rem;line-height:1.5;font-weight:500}.snackbar-action{background:transparent;border:1px solid var(--color-border-default);color:var(--color-text-secondary);cursor:pointer;font-size:.75rem;font-weight:600;text-transform:uppercase;padding:.375rem .75rem;border-radius:.375rem;transition:all .2s ease;white-space:nowrap}.snackbar-action:hover{background-color:var(--color-bg-hover);border-color:var(--color-border-medium);color:var(--color-text-primary)}.snackbar-action:active{transform:scale(.98)}.notification-success{background:var(--color-bg-success-light);border-color:var(--color-border-success);color:var(--color-text-success)}.notification-success .snackbar-message{color:var(--color-text-success)}.notification-success .snackbar-action{color:var(--color-text-success);border-color:var(--color-border-success)}.notification-success .snackbar-action:hover{background-color:var(--color-bg-success);border-color:var(--color-border-success)}.notification-error{background:var(--color-bg-danger-light);border-color:var(--color-border-danger);color:var(--color-text-danger)}.notification-error .snackbar-message{color:var(--color-text-danger)}.notification-error .snackbar-action{color:var(--color-text-danger);border-color:var(--color-border-danger)}.notification-error .snackbar-action:hover{background-color:var(--color-bg-danger);border-color:var(--color-border-danger)}@keyframes slideIn{0%{opacity:0;transform:translateY(-1rem)}to{opacity:1;transform:translateY(0)}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.10", ngImport: i0, type: SnackbarComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: SnackbarComponent, decorators: [{
             type: Component,
             args: [{ selector: 'c80-snackbar', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (visible() && data(); as snackData) {\n<div class=\"snackbar\" [class]=\"panelClasses()\">\n  <span class=\"snackbar-message\">{{ snackData.message }}</span>\n  @if (snackData.action) {\n  <button class=\"snackbar-action\" type=\"button\" (click)=\"dismiss()\">\n    {{ snackData.action }}\n  </button>\n  }\n</div>\n}", styles: [":host{position:fixed;z-index:9999;pointer-events:none}.snackbar{display:flex;align-items:center;gap:.75rem;padding:1rem 1.25rem;background:var(--color-bg-secondary);color:var(--color-text-primary);border:1px solid var(--color-border-default);border-radius:.5rem;box-shadow:var(--shadow-lg);pointer-events:auto;animation:slideIn .3s ease-out;min-width:20rem;max-width:35rem}.snackbar-message{flex:1;font-size:.875rem;line-height:1.5;font-weight:500}.snackbar-action{background:transparent;border:1px solid var(--color-border-default);color:var(--color-text-secondary);cursor:pointer;font-size:.75rem;font-weight:600;text-transform:uppercase;padding:.375rem .75rem;border-radius:.375rem;transition:all .2s ease;white-space:nowrap}.snackbar-action:hover{background-color:var(--color-bg-hover);border-color:var(--color-border-medium);color:var(--color-text-primary)}.snackbar-action:active{transform:scale(.98)}.notification-success{background:var(--color-bg-success-light);border-color:var(--color-border-success);color:var(--color-text-success)}.notification-success .snackbar-message{color:var(--color-text-success)}.notification-success .snackbar-action{color:var(--color-text-success);border-color:var(--color-border-success)}.notification-success .snackbar-action:hover{background-color:var(--color-bg-success);border-color:var(--color-border-success)}.notification-error{background:var(--color-bg-danger-light);border-color:var(--color-border-danger);color:var(--color-text-danger)}.notification-error .snackbar-message{color:var(--color-text-danger)}.notification-error .snackbar-action{color:var(--color-text-danger);border-color:var(--color-border-danger)}.notification-error .snackbar-action:hover{background-color:var(--color-bg-danger);border-color:var(--color-border-danger)}@keyframes slideIn{0%{opacity:0;transform:translateY(-1rem)}to{opacity:1;transform:translateY(0)}}\n"] }]
         }] });