tickera-angular-components 0.0.1-dev.120 → 0.0.1-dev.128
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.
|
@@ -4182,6 +4182,7 @@ class AppModalComponent {
|
|
|
4182
4182
|
showHeader = true;
|
|
4183
4183
|
showCloseButton = true;
|
|
4184
4184
|
showTitle = true;
|
|
4185
|
+
interactiveClose = true;
|
|
4185
4186
|
isOpen = signal(false, ...(ngDevMode ? [{ debugName: "isOpen" }] : []));
|
|
4186
4187
|
size = 'md';
|
|
4187
4188
|
closeModal = new EventEmitter();
|
|
@@ -4190,17 +4191,22 @@ class AppModalComponent {
|
|
|
4190
4191
|
return;
|
|
4191
4192
|
this.closeModal.emit();
|
|
4192
4193
|
}
|
|
4194
|
+
onInteractiveClose() {
|
|
4195
|
+
if (!this.interactiveClose || this.disableClose)
|
|
4196
|
+
return;
|
|
4197
|
+
this.closeModal.emit();
|
|
4198
|
+
}
|
|
4193
4199
|
onKeydownEscape() {
|
|
4194
4200
|
if (this.isOpen()) {
|
|
4195
|
-
this.
|
|
4201
|
+
this.onInteractiveClose();
|
|
4196
4202
|
}
|
|
4197
4203
|
}
|
|
4198
4204
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: AppModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4199
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: AppModalComponent, isStandalone: true, selector: "app-modal", inputs: { title: "title", disableClose: "disableClose", showHeader: "showHeader", showCloseButton: "showCloseButton", showTitle: "showTitle", isOpen: "isOpen", size: "size" }, outputs: { closeModal: "closeModal" }, host: { listeners: { "document:keydown.escape": "onKeydownEscape()" } }, ngImport: i0, template: "@if (isOpen()) {\n <div class=\"modal-overlay\">\n <div class=\"modal-backdrop\" (click)=\"
|
|
4205
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: AppModalComponent, isStandalone: true, selector: "app-modal", inputs: { title: "title", disableClose: "disableClose", showHeader: "showHeader", showCloseButton: "showCloseButton", showTitle: "showTitle", interactiveClose: "interactiveClose", isOpen: "isOpen", size: "size" }, outputs: { closeModal: "closeModal" }, host: { listeners: { "document:keydown.escape": "onKeydownEscape()" } }, ngImport: i0, template: "@if (isOpen()) {\n <div class=\"modal-overlay\">\n <div class=\"modal-backdrop\" (click)=\"onInteractiveClose()\"></div>\n\n <div class=\"modal-dialog\" [class]=\"'modal-dialog--' + size\">\n @if (showHeader && ((showTitle && !!title) || (showCloseButton && !disableClose))) {\n <div class=\"modal-header\">\n @if (showTitle && !!title) {\n <h3 class=\"modal-title\">{{ title }}</h3>\n }\n\n @if (showCloseButton && !disableClose) {\n <button class=\"modal-close-button\" (click)=\"onCloseModal()\">×</button>\n }\n </div>\n }\n\n <div class=\"modal-body\">\n <ng-content></ng-content>\n </div>\n </div>\n </div>\n}\n", styles: [".modal-overlay{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;z-index:50}.modal-backdrop{position:absolute;inset:0;background-color:#000;opacity:.5;filter:blur(4px)}.modal-dialog{position:relative;z-index:10;width:100%;background-color:#fff;border-radius:.5rem;max-height:100vh;overflow-y:auto;box-shadow:0 20px 25px -5px #0000001a,0 8px 10px -6px #0000001a}.modal-dialog--xs{max-width:20rem}.modal-dialog--sm{max-width:24rem}.modal-dialog--md{max-width:28rem}.modal-dialog--lg{max-width:32rem}.modal-dialog--xl{max-width:36rem}.modal-dialog--2xl{max-width:42rem}.modal-dialog--3xl{max-width:48rem}.modal-dialog--4xl{max-width:56rem}.modal-header{display:flex;align-items:center;justify-content:space-between;padding:1.25rem;border-bottom:1px solid #e5e7eb}.modal-title{font-size:1.125rem;font-weight:600;color:#1f2937;margin:0}.modal-close-button{background:none;border:none;font-size:1.5rem;cursor:pointer;color:#4b5563;padding:0;width:1.875rem;height:1.875rem;display:flex;align-items:center;justify-content:center}.modal-close-button:hover{color:#1f2937}.modal-body{padding:1.25rem}.modal-body p:first-of-type{margin-top:0}.modal-body p:last-of-type{margin-bottom:0}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], encapsulation: i0.ViewEncapsulation.None });
|
|
4200
4206
|
}
|
|
4201
4207
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: AppModalComponent, decorators: [{
|
|
4202
4208
|
type: Component,
|
|
4203
|
-
args: [{ selector: 'app-modal', standalone: true, imports: [CommonModule], encapsulation: ViewEncapsulation.None, template: "@if (isOpen()) {\n <div class=\"modal-overlay\">\n <div class=\"modal-backdrop\" (click)=\"
|
|
4209
|
+
args: [{ selector: 'app-modal', standalone: true, imports: [CommonModule], encapsulation: ViewEncapsulation.None, template: "@if (isOpen()) {\n <div class=\"modal-overlay\">\n <div class=\"modal-backdrop\" (click)=\"onInteractiveClose()\"></div>\n\n <div class=\"modal-dialog\" [class]=\"'modal-dialog--' + size\">\n @if (showHeader && ((showTitle && !!title) || (showCloseButton && !disableClose))) {\n <div class=\"modal-header\">\n @if (showTitle && !!title) {\n <h3 class=\"modal-title\">{{ title }}</h3>\n }\n\n @if (showCloseButton && !disableClose) {\n <button class=\"modal-close-button\" (click)=\"onCloseModal()\">×</button>\n }\n </div>\n }\n\n <div class=\"modal-body\">\n <ng-content></ng-content>\n </div>\n </div>\n </div>\n}\n", styles: [".modal-overlay{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;z-index:50}.modal-backdrop{position:absolute;inset:0;background-color:#000;opacity:.5;filter:blur(4px)}.modal-dialog{position:relative;z-index:10;width:100%;background-color:#fff;border-radius:.5rem;max-height:100vh;overflow-y:auto;box-shadow:0 20px 25px -5px #0000001a,0 8px 10px -6px #0000001a}.modal-dialog--xs{max-width:20rem}.modal-dialog--sm{max-width:24rem}.modal-dialog--md{max-width:28rem}.modal-dialog--lg{max-width:32rem}.modal-dialog--xl{max-width:36rem}.modal-dialog--2xl{max-width:42rem}.modal-dialog--3xl{max-width:48rem}.modal-dialog--4xl{max-width:56rem}.modal-header{display:flex;align-items:center;justify-content:space-between;padding:1.25rem;border-bottom:1px solid #e5e7eb}.modal-title{font-size:1.125rem;font-weight:600;color:#1f2937;margin:0}.modal-close-button{background:none;border:none;font-size:1.5rem;cursor:pointer;color:#4b5563;padding:0;width:1.875rem;height:1.875rem;display:flex;align-items:center;justify-content:center}.modal-close-button:hover{color:#1f2937}.modal-body{padding:1.25rem}.modal-body p:first-of-type{margin-top:0}.modal-body p:last-of-type{margin-bottom:0}\n"] }]
|
|
4204
4210
|
}], propDecorators: { title: [{
|
|
4205
4211
|
type: Input
|
|
4206
4212
|
}], disableClose: [{
|
|
@@ -4211,6 +4217,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
|
|
|
4211
4217
|
type: Input
|
|
4212
4218
|
}], showTitle: [{
|
|
4213
4219
|
type: Input
|
|
4220
|
+
}], interactiveClose: [{
|
|
4221
|
+
type: Input
|
|
4214
4222
|
}], isOpen: [{
|
|
4215
4223
|
type: Input
|
|
4216
4224
|
}], size: [{
|
|
@@ -4270,7 +4278,7 @@ class FeedbackModalComponent {
|
|
|
4270
4278
|
}
|
|
4271
4279
|
}
|
|
4272
4280
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: FeedbackModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4273
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: FeedbackModalComponent, isStandalone: true, selector: "feedback-modal", inputs: { isOpen: "isOpen", type: "type", title: "title", message: "message", showHeader: "showHeader", showCloseButton: "showCloseButton", showTitle: "showTitle", autoClose: "autoClose", autoCloseDuration: "autoCloseDuration", buttonText: "buttonText" }, outputs: { closed: "closed" }, usesOnChanges: true, ngImport: i0, template: "<app-modal\n [showHeader]=\"showHeader\"\n [showCloseButton]=\"showCloseButton\"\n [showTitle]=\"showTitle\"\n [isOpen]=\"isOpen\"\n size=\"sm\"\n (closeModal)=\"closeModal()\"\n>\n <div class=\"feedback-modal-body\" [ngClass]=\"'feedback-modal-body--' + type\">\n <div class=\"feedback-modal-icon-wrapper\">\n @switch (type) {\n @case ('loading') {\n <div class=\"feedback-modal-spinner\"></div>\n }\n @case ('success') {\n <i class=\"ri-check-line feedback-modal-icon feedback-modal-icon--success\"></i>\n }\n @case ('error') {\n <i class=\"ri-error-warning-line feedback-modal-icon feedback-modal-icon--error\"></i>\n }\n @case ('warning') {\n <i class=\"ri-alert-line feedback-modal-icon feedback-modal-icon--warning\"></i>\n }\n @case ('info') {\n <i class=\"ri-info-i feedback-modal-icon feedback-modal-icon--info\"></i>\n }\n }\n </div>\n\n <h3 class=\"feedback-modal-title\">{{ title }}</h3>\n\n @if (message) {\n <p class=\"feedback-modal-message\">{{ message }}</p>\n }\n\n @if (resolvedButtonText && showCloseButton) {\n <app-button [text]=\"resolvedButtonText\" [variant]=\"buttonVariant\" (clicked)=\"closeModal()\" />\n }\n </div>\n</app-modal>\n", styles: [".feedback-modal-body{display:flex;flex-direction:column;align-items:center;gap:1rem;padding:1.5rem 0;text-align:center}.feedback-modal-icon-wrapper{display:flex;align-items:center;justify-content:center;width:3.5rem;height:3.5rem;border-radius:9999px}.feedback-modal-body--loading .feedback-modal-icon-wrapper{width:auto;height:auto}.feedback-modal-body--success .feedback-modal-icon-wrapper{background-color:#f0fdf4}.feedback-modal-body--error .feedback-modal-icon-wrapper{background-color:#fef2f2}.feedback-modal-body--warning .feedback-modal-icon-wrapper{background-color:#fefce8}.feedback-modal-body--info .feedback-modal-icon-wrapper{background-color:#eff6ff}.feedback-modal-icon{font-size:2.5rem}.feedback-modal-icon--success{color:#22c55e}.feedback-modal-icon--error{color:#ef4444}.feedback-modal-icon--warning{color:#eab308}.feedback-modal-icon--info{color:#3b82f6}.feedback-modal-spinner{height:3rem;width:3rem;border-radius:9999px;border:6px solid #fecaca;border-top-color:#ef4444;animation:feedback-modal-spin .8s linear infinite}.feedback-modal-title{font-size:1.125rem;font-weight:600;color:#1f2937;margin:0}.feedback-modal-message{font-size:.875rem;color:#6b7280;margin:0}@keyframes feedback-modal-spin{to{transform:rotate(360deg)}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: AppModalComponent, selector: "app-modal", inputs: ["title", "disableClose", "showHeader", "showCloseButton", "showTitle", "isOpen", "size"], outputs: ["closeModal"] }, { kind: "component", type: AppButtonComponent, selector: "app-button", inputs: ["disabled", "loading", "type", "variant", "text", "size", "loadingText", "icon", "tooltip"], outputs: ["clicked"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
4281
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: FeedbackModalComponent, isStandalone: true, selector: "feedback-modal", inputs: { isOpen: "isOpen", type: "type", title: "title", message: "message", showHeader: "showHeader", showCloseButton: "showCloseButton", showTitle: "showTitle", autoClose: "autoClose", autoCloseDuration: "autoCloseDuration", buttonText: "buttonText" }, outputs: { closed: "closed" }, usesOnChanges: true, ngImport: i0, template: "<app-modal\n [showHeader]=\"showHeader\"\n [showCloseButton]=\"showCloseButton\"\n [showTitle]=\"showTitle\"\n [isOpen]=\"isOpen\"\n size=\"sm\"\n (closeModal)=\"closeModal()\"\n>\n <div class=\"feedback-modal-body\" [ngClass]=\"'feedback-modal-body--' + type\">\n <div class=\"feedback-modal-icon-wrapper\">\n @switch (type) {\n @case ('loading') {\n <div class=\"feedback-modal-spinner\"></div>\n }\n @case ('success') {\n <i class=\"ri-check-line feedback-modal-icon feedback-modal-icon--success\"></i>\n }\n @case ('error') {\n <i class=\"ri-error-warning-line feedback-modal-icon feedback-modal-icon--error\"></i>\n }\n @case ('warning') {\n <i class=\"ri-alert-line feedback-modal-icon feedback-modal-icon--warning\"></i>\n }\n @case ('info') {\n <i class=\"ri-info-i feedback-modal-icon feedback-modal-icon--info\"></i>\n }\n }\n </div>\n\n <h3 class=\"feedback-modal-title\">{{ title }}</h3>\n\n @if (message) {\n <p class=\"feedback-modal-message\">{{ message }}</p>\n }\n\n @if (resolvedButtonText && showCloseButton) {\n <app-button [text]=\"resolvedButtonText\" [variant]=\"buttonVariant\" (clicked)=\"closeModal()\" />\n }\n </div>\n</app-modal>\n", styles: [".feedback-modal-body{display:flex;flex-direction:column;align-items:center;gap:1rem;padding:1.5rem 0;text-align:center}.feedback-modal-icon-wrapper{display:flex;align-items:center;justify-content:center;width:3.5rem;height:3.5rem;border-radius:9999px}.feedback-modal-body--loading .feedback-modal-icon-wrapper{width:auto;height:auto}.feedback-modal-body--success .feedback-modal-icon-wrapper{background-color:#f0fdf4}.feedback-modal-body--error .feedback-modal-icon-wrapper{background-color:#fef2f2}.feedback-modal-body--warning .feedback-modal-icon-wrapper{background-color:#fefce8}.feedback-modal-body--info .feedback-modal-icon-wrapper{background-color:#eff6ff}.feedback-modal-icon{font-size:2.5rem}.feedback-modal-icon--success{color:#22c55e}.feedback-modal-icon--error{color:#ef4444}.feedback-modal-icon--warning{color:#eab308}.feedback-modal-icon--info{color:#3b82f6}.feedback-modal-spinner{height:3rem;width:3rem;border-radius:9999px;border:6px solid #fecaca;border-top-color:#ef4444;animation:feedback-modal-spin .8s linear infinite}.feedback-modal-title{font-size:1.125rem;font-weight:600;color:#1f2937;margin:0}.feedback-modal-message{font-size:.875rem;color:#6b7280;margin:0}@keyframes feedback-modal-spin{to{transform:rotate(360deg)}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: AppModalComponent, selector: "app-modal", inputs: ["title", "disableClose", "showHeader", "showCloseButton", "showTitle", "interactiveClose", "isOpen", "size"], outputs: ["closeModal"] }, { kind: "component", type: AppButtonComponent, selector: "app-button", inputs: ["disabled", "loading", "type", "variant", "text", "size", "loadingText", "icon", "tooltip"], outputs: ["clicked"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
4274
4282
|
}
|
|
4275
4283
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: FeedbackModalComponent, decorators: [{
|
|
4276
4284
|
type: Component,
|
|
@@ -4457,9 +4465,9 @@ class DeleteConfirmationComponent {
|
|
|
4457
4465
|
return this.deleteConfirmationService.modalIsOpen;
|
|
4458
4466
|
}
|
|
4459
4467
|
get isConfirmationValid() {
|
|
4460
|
-
const value = this.deleteConfirmationForm.value.confirmationText
|
|
4461
|
-
const confirmation = this.confirmationText
|
|
4462
|
-
return value
|
|
4468
|
+
const value = this.deleteConfirmationForm.value.confirmationText;
|
|
4469
|
+
const confirmation = this.confirmationText;
|
|
4470
|
+
return value === confirmation;
|
|
4463
4471
|
}
|
|
4464
4472
|
onCloseModal() {
|
|
4465
4473
|
this.deleteConfirmationForm.reset();
|
|
@@ -4474,7 +4482,7 @@ class DeleteConfirmationComponent {
|
|
|
4474
4482
|
this.deleteConfirmationService.close();
|
|
4475
4483
|
}
|
|
4476
4484
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: DeleteConfirmationComponent, deps: [{ token: i1$2.FormBuilder }, { token: DeleteConfirmationService }, { token: i2.TranslocoService }], target: i0.ɵɵFactoryTarget.Component });
|
|
4477
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: DeleteConfirmationComponent, isStandalone: true, selector: "delete-confirmation", ngImport: i0, template: "@if (isOpen()) {\n <app-modal
|
|
4485
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: DeleteConfirmationComponent, isStandalone: true, selector: "delete-confirmation", ngImport: i0, template: "@if (isOpen()) {\n <app-modal\n [title]=\"title\"\n [isOpen]=\"isOpen\"\n (closeModal)=\"onCloseModal()\"\n [interactiveClose]=\"true\"\n >\n <form\n [formGroup]=\"deleteConfirmationForm\"\n method=\"POST\"\n class=\"delete-confirmation-content\"\n (ngSubmit)=\"onConfirmDelete()\"\n >\n <app-alert\n type=\"warning\"\n [text]=\"'deleteConfirmation.warning' | transloco\"\n size=\"sm\"\n [closeable]=\"false\"\n />\n\n <p class=\"delete-confirmation-instructions\">\n {{ 'deleteConfirmation.instructions' | transloco }}\n\n <span class=\"delete-confirmation-highlight\">\n {{ confirmationText }}\n </span>\n </p>\n\n <form-input\n name=\"confirmationText\"\n type=\"text\"\n class=\"delete-confirmation-field\"\n [required]=\"true\"\n [autocomplete]=\"false\"\n formControlName=\"confirmationText\"\n [placeholder]=\"\n transloco.translate('deleteConfirmation.placeholder', { text: confirmationText })\n \"\n />\n\n <div class=\"delete-confirmation-actions\">\n <app-button\n variant=\"tertiary\"\n [text]=\"'deleteConfirmation.cancel' | transloco\"\n (click)=\"onCloseModal()\"\n size=\"sm\"\n />\n\n <app-button\n type=\"submit\"\n variant=\"primary\"\n [text]=\"'deleteConfirmation.delete' | transloco\"\n [disabled]=\"!isConfirmationValid\"\n size=\"sm\"\n />\n </div>\n </form>\n </app-modal>\n}\n", styles: [".delete-confirmation-content{display:flex;flex-direction:column;gap:1rem;animation:slideUp .3s ease-out}.delete-confirmation-instructions{font-size:.75rem;color:#4b5563;margin:0}@media(prefers-color-scheme:dark){.delete-confirmation-instructions{color:#9ca3af}}.delete-confirmation-highlight{display:inline-flex;align-items:center;gap:.25rem;padding:.25rem .5rem;margin-top:.25rem;background-color:#e5e7eb;color:#dc2626;font-weight:600;font-size:.875rem;border-radius:.375rem}@media(prefers-color-scheme:dark){.delete-confirmation-highlight{background-color:#374151}}.delete-confirmation-field{flex:1}.delete-confirmation-actions{display:flex;gap:.75rem}@keyframes slideUp{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: TranslocoModule }, { kind: "component", type: AppButtonComponent, selector: "app-button", inputs: ["disabled", "loading", "type", "variant", "text", "size", "loadingText", "icon", "tooltip"], outputs: ["clicked"] }, { kind: "component", type: FormInputComponent, selector: "form-input", inputs: ["label", "type", "name", "id", "placeholder", "required", "readonly", "maxlength", "minlength", "max", "min", "step", "pattern", "fieldGroupClass", "autocomplete"] }, { kind: "component", type: AppModalComponent, selector: "app-modal", inputs: ["title", "disableClose", "showHeader", "showCloseButton", "showTitle", "interactiveClose", "isOpen", "size"], outputs: ["closeModal"] }, { kind: "component", type: AppAlertComponent, selector: "app-alert", inputs: ["type", "text", "closeable", "size"] }, { kind: "pipe", type: i2.TranslocoPipe, name: "transloco" }], encapsulation: i0.ViewEncapsulation.None });
|
|
4478
4486
|
}
|
|
4479
4487
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: DeleteConfirmationComponent, decorators: [{
|
|
4480
4488
|
type: Component,
|
|
@@ -4486,7 +4494,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
|
|
|
4486
4494
|
FormInputComponent,
|
|
4487
4495
|
AppModalComponent,
|
|
4488
4496
|
AppAlertComponent,
|
|
4489
|
-
], encapsulation: ViewEncapsulation.None, template: "@if (isOpen()) {\n <app-modal
|
|
4497
|
+
], encapsulation: ViewEncapsulation.None, template: "@if (isOpen()) {\n <app-modal\n [title]=\"title\"\n [isOpen]=\"isOpen\"\n (closeModal)=\"onCloseModal()\"\n [interactiveClose]=\"true\"\n >\n <form\n [formGroup]=\"deleteConfirmationForm\"\n method=\"POST\"\n class=\"delete-confirmation-content\"\n (ngSubmit)=\"onConfirmDelete()\"\n >\n <app-alert\n type=\"warning\"\n [text]=\"'deleteConfirmation.warning' | transloco\"\n size=\"sm\"\n [closeable]=\"false\"\n />\n\n <p class=\"delete-confirmation-instructions\">\n {{ 'deleteConfirmation.instructions' | transloco }}\n\n <span class=\"delete-confirmation-highlight\">\n {{ confirmationText }}\n </span>\n </p>\n\n <form-input\n name=\"confirmationText\"\n type=\"text\"\n class=\"delete-confirmation-field\"\n [required]=\"true\"\n [autocomplete]=\"false\"\n formControlName=\"confirmationText\"\n [placeholder]=\"\n transloco.translate('deleteConfirmation.placeholder', { text: confirmationText })\n \"\n />\n\n <div class=\"delete-confirmation-actions\">\n <app-button\n variant=\"tertiary\"\n [text]=\"'deleteConfirmation.cancel' | transloco\"\n (click)=\"onCloseModal()\"\n size=\"sm\"\n />\n\n <app-button\n type=\"submit\"\n variant=\"primary\"\n [text]=\"'deleteConfirmation.delete' | transloco\"\n [disabled]=\"!isConfirmationValid\"\n size=\"sm\"\n />\n </div>\n </form>\n </app-modal>\n}\n", styles: [".delete-confirmation-content{display:flex;flex-direction:column;gap:1rem;animation:slideUp .3s ease-out}.delete-confirmation-instructions{font-size:.75rem;color:#4b5563;margin:0}@media(prefers-color-scheme:dark){.delete-confirmation-instructions{color:#9ca3af}}.delete-confirmation-highlight{display:inline-flex;align-items:center;gap:.25rem;padding:.25rem .5rem;margin-top:.25rem;background-color:#e5e7eb;color:#dc2626;font-weight:600;font-size:.875rem;border-radius:.375rem}@media(prefers-color-scheme:dark){.delete-confirmation-highlight{background-color:#374151}}.delete-confirmation-field{flex:1}.delete-confirmation-actions{display:flex;gap:.75rem}@keyframes slideUp{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}\n"] }]
|
|
4490
4498
|
}], ctorParameters: () => [{ type: i1$2.FormBuilder }, { type: DeleteConfirmationService }, { type: i2.TranslocoService }] });
|
|
4491
4499
|
|
|
4492
4500
|
class AppBadgeComponent {
|
|
@@ -4545,6 +4553,8 @@ class DynamicTableComponent {
|
|
|
4545
4553
|
// Eventos para avisar al Backend
|
|
4546
4554
|
pageChange = new EventEmitter();
|
|
4547
4555
|
searchChange = new EventEmitter();
|
|
4556
|
+
pageSizeChange = new EventEmitter();
|
|
4557
|
+
pageSizeOptions = [5, 10, 25, 50];
|
|
4548
4558
|
// Visualización de paginación
|
|
4549
4559
|
showPagination = true;
|
|
4550
4560
|
// Visualización de búsqueda
|
|
@@ -4565,6 +4575,13 @@ class DynamicTableComponent {
|
|
|
4565
4575
|
this.pageChange.emit(newPage); // El padre recibe la nueva página
|
|
4566
4576
|
}
|
|
4567
4577
|
}
|
|
4578
|
+
changePageSize(event) {
|
|
4579
|
+
const newSize = +event.target.value;
|
|
4580
|
+
if (newSize !== this.itemsPerPage) {
|
|
4581
|
+
this.currentPage = 1;
|
|
4582
|
+
this.pageSizeChange.emit(newSize); // El padre recibe el nuevo tamaño y refetch desde la página 1
|
|
4583
|
+
}
|
|
4584
|
+
}
|
|
4568
4585
|
createInjector(row) {
|
|
4569
4586
|
return Injector.create({
|
|
4570
4587
|
providers: [{ provide: 'ROW_DATA', useValue: row }],
|
|
@@ -4572,11 +4589,11 @@ class DynamicTableComponent {
|
|
|
4572
4589
|
});
|
|
4573
4590
|
}
|
|
4574
4591
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: DynamicTableComponent, deps: [{ token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component });
|
|
4575
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: DynamicTableComponent, isStandalone: true, selector: "dynamic-table", inputs: { title: "title", data: "data", headers: "headers", columnComponents: "columnComponents", isLoading: "isLoading", totalItems: "totalItems", itemsPerPage: "itemsPerPage", currentPage: "currentPage", showPagination: "showPagination", showSearch: "showSearch", showTitle: "showTitle" }, outputs: { pageChange: "pageChange", searchChange: "searchChange" }, ngImport: i0, template: "<div class=\"dynamic-table\">\n @if (showTitle || showSearch) {\n <div class=\"dynamic-table-toolbar\">\n @if (showTitle) {\n <h2 class=\"dynamic-table-title\">{{ title }}</h2>\n }\n\n @if (showSearch) {\n <input\n type=\"text\"\n (input)=\"onSearch($event)\"\n placeholder=\"Buscar...\"\n class=\"dynamic-table-search\"\n />\n }\n </div>\n }\n\n <div class=\"dynamic-table-scroll\">\n <table class=\"dynamic-table-table\">\n <thead class=\"dynamic-table-head\">\n <tr>\n @for (header of headers; track header.key) {\n <th class=\"dynamic-table-head-cell\">\n {{ header.label }}\n </th>\n }\n </tr>\n </thead>\n\n <tbody class=\"dynamic-table-body\">\n @if (isLoading) {\n <tr class=\"dynamic-table-row\">\n @for (header of headers; track header.key) {\n <td class=\"dynamic-table-cell\">\n <div class=\"dynamic-table-skeleton\"></div>\n </td>\n }\n </tr>\n }\n\n @for (row of data; track row) {\n <tr class=\"dynamic-table-row\">\n @for (header of headers; track header.key) {\n <td class=\"dynamic-table-cell dynamic-table-cell--nowrap\">\n @if (columnComponents[header.key]) {\n <ng-container\n *ngComponentOutlet=\"columnComponents[header.key]; injector: createInjector(row)\"\n ></ng-container>\n } @else {\n <span class=\"dynamic-table-cell--text\">\n {{ row[header.key] || '---' }}\n </span>\n }\n </td>\n }\n </tr>\n }\n\n @if ((!data || data.length < 1) && !isLoading) {\n <tr>\n <td [attr.colspan]=\"headers.length\" class=\"dynamic-table-empty\">\n No se encontraron registros en el servidor.\n </td>\n </tr>\n }\n </tbody>\n </table>\n </div>\n\n @if (showPagination) {\n <div class=\"dynamic-table-pagination\">\n <div class=\"dynamic-table-pagination-info\">\n Mostrando p\u00E1gina\n <span class=\"dynamic-table-pagination-strong\">{{ currentPage }}</span> de\n <span class=\"dynamic-table-pagination-strong\">{{ totalPages }}</span>\n <span class=\"dynamic-table-pagination-total\">({{ totalItems }} registros totales)</span>\n </div>\n\n <div class=\"dynamic-table-pagination-actions\">\n
|
|
4592
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: DynamicTableComponent, isStandalone: true, selector: "dynamic-table", inputs: { title: "title", data: "data", headers: "headers", columnComponents: "columnComponents", isLoading: "isLoading", totalItems: "totalItems", itemsPerPage: "itemsPerPage", currentPage: "currentPage", showPagination: "showPagination", showSearch: "showSearch", showTitle: "showTitle" }, outputs: { pageChange: "pageChange", searchChange: "searchChange", pageSizeChange: "pageSizeChange" }, ngImport: i0, template: "<div class=\"dynamic-table\">\n @if (showTitle || showSearch) {\n <div class=\"dynamic-table-toolbar\">\n @if (showTitle) {\n <h2 class=\"dynamic-table-title\">{{ title }}</h2>\n }\n\n @if (showSearch) {\n <input\n type=\"text\"\n (input)=\"onSearch($event)\"\n placeholder=\"Buscar...\"\n class=\"dynamic-table-search\"\n />\n }\n </div>\n }\n\n <div class=\"dynamic-table-scroll\">\n <table class=\"dynamic-table-table\">\n <thead class=\"dynamic-table-head\">\n <tr>\n @for (header of headers; track header.key) {\n <th class=\"dynamic-table-head-cell\">\n {{ header.label }}\n </th>\n }\n </tr>\n </thead>\n\n <tbody class=\"dynamic-table-body\">\n @if (isLoading) {\n <tr class=\"dynamic-table-row\">\n @for (header of headers; track header.key) {\n <td class=\"dynamic-table-cell\">\n <div class=\"dynamic-table-skeleton\"></div>\n </td>\n }\n </tr>\n }\n\n @for (row of data; track row) {\n <tr class=\"dynamic-table-row\">\n @for (header of headers; track header.key) {\n <td class=\"dynamic-table-cell dynamic-table-cell--nowrap\">\n @if (columnComponents[header.key]) {\n <ng-container\n *ngComponentOutlet=\"columnComponents[header.key]; injector: createInjector(row)\"\n ></ng-container>\n } @else {\n <span class=\"dynamic-table-cell--text\">\n {{ row[header.key] || '---' }}\n </span>\n }\n </td>\n }\n </tr>\n }\n\n @if ((!data || data.length < 1) && !isLoading) {\n <tr>\n <td [attr.colspan]=\"headers.length\" class=\"dynamic-table-empty\">\n No se encontraron registros en el servidor.\n </td>\n </tr>\n }\n </tbody>\n </table>\n </div>\n\n @if (showPagination) {\n <div class=\"dynamic-table-pagination\">\n @if (totalPages > 1) {\n <div class=\"dynamic-table-pagination-size\">\n <label for=\"page-size-select\" class=\"dynamic-table-pagination-size-label\">\n Items por p\u00E1gina\n </label>\n <select\n id=\"page-size-select\"\n class=\"dynamic-table-pagination-size-select\"\n [value]=\"itemsPerPage\"\n (change)=\"changePageSize($event)\"\n >\n @for (option of pageSizeOptions; track option) {\n <option [value]=\"option\">{{ option }}</option>\n }\n </select>\n </div>\n }\n\n <div class=\"dynamic-table-pagination-info\">\n Mostrando p\u00E1gina\n <span class=\"dynamic-table-pagination-strong\">{{ currentPage }}</span> de\n <span class=\"dynamic-table-pagination-strong\">{{ totalPages }}</span>\n <span class=\"dynamic-table-pagination-total\">({{ totalItems }} registros totales)</span>\n </div>\n\n @if (totalPages > 1) {\n <div class=\"dynamic-table-pagination-actions\">\n <button\n (click)=\"changePage(-1)\"\n [disabled]=\"currentPage === 1\"\n class=\"dynamic-table-pagination-button\"\n >\n Anterior\n </button>\n\n <button\n (click)=\"changePage(1)\"\n [disabled]=\"currentPage >= totalPages\"\n class=\"dynamic-table-pagination-button\"\n >\n Siguiente\n </button>\n </div>\n }\n </div>\n }\n</div>\n", styles: [".dynamic-table{background-color:#fff;border-radius:.5rem;overflow:hidden;border:1px solid #e5e7eb}@media(prefers-color-scheme:dark){.dynamic-table{background-color:#1f2937;border-color:#374151}}.dynamic-table-toolbar{padding:1rem;border-bottom:1px solid #e5e7eb;display:flex;align-items:center;justify-content:flex-start}@media(prefers-color-scheme:dark){.dynamic-table-toolbar{border-color:#374151}}.dynamic-table-title{font-size:1.125rem;font-weight:600;margin:0}@media(prefers-color-scheme:dark){.dynamic-table-title{color:#fff}}.dynamic-table-search{display:block;margin-left:auto;max-width:24rem;border:1px solid #d1d5db;border-radius:.375rem;background-color:#fff;padding:.375rem .75rem;font-size:1rem;color:#111827;outline:1px solid #d1d5db;outline-offset:-1px}.dynamic-table-search::placeholder{color:#9ca3af}.dynamic-table-search:focus{outline:2px solid #4f46e5;outline-offset:-2px}@media(min-width:640px){.dynamic-table-search{font-size:.875rem}}@media(prefers-color-scheme:dark){.dynamic-table-search{background-color:#ffffff0d;color:#fff;outline-color:#ffffff1a}.dynamic-table-search::placeholder{color:#6b7280}.dynamic-table-search:focus{outline-color:#6366f1}}.dynamic-table-scroll{overflow-x:auto}.dynamic-table-table{width:100%;text-align:left;border-collapse:collapse}.dynamic-table-head{background-color:#f3f4f6;color:#4b5563;font-size:.75rem}@media(prefers-color-scheme:dark){.dynamic-table-head{background-color:#374151;color:#d1d5db}}.dynamic-table-head-cell{text-overflow:ellipsis;max-width:200px;padding:.75rem;border-bottom:1px solid #d1d5db;white-space:nowrap}@media(prefers-color-scheme:dark){.dynamic-table-head-cell{border-color:#4b5563}}.dynamic-table-body{color:#374151;font-size:.75rem}@media(prefers-color-scheme:dark){.dynamic-table-body{color:#e5e7eb}}.dynamic-table-row{border-bottom:1px solid #e5e7eb;transition:background-color .15s ease-in-out}.dynamic-table-row:last-child{border-bottom:none}.dynamic-table-row:nth-child(2n){background-color:#f3f4f6}.dynamic-table-row:hover{background-color:#e5e7eb}@media(prefers-color-scheme:dark){.dynamic-table-row{border-color:#374151}.dynamic-table-row:nth-child(2n){background-color:#37415180}.dynamic-table-row:hover{background-color:#374151}}.dynamic-table-cell{padding:.75rem}.dynamic-table-cell--nowrap{white-space:nowrap}.dynamic-table-cell--text{display:inline-block;overflow:hidden;text-overflow:ellipsis;max-width:280px}.dynamic-table-skeleton{height:1.25rem;width:100%;background-color:#e5e7eb;border-radius:.375rem;animation:dynamic-table-pulse 2s cubic-bezier(.4,0,.6,1) infinite}@media(prefers-color-scheme:dark){.dynamic-table-skeleton{background-color:#4b5563}}.dynamic-table-empty{padding:1.5rem;text-align:center;color:#9ca3af;font-style:italic}@media(prefers-color-scheme:dark){.dynamic-table-empty{color:#6b7280}}.dynamic-table-pagination{padding:1rem;display:flex;align-items:center;justify-content:space-between;background-color:#f9fafb;border-top:1px solid #d1d5db}@media(prefers-color-scheme:dark){.dynamic-table-pagination{background-color:#1f293780;border-color:#374151}}.dynamic-table-pagination-info{font-size:.875rem;color:#6b7280}@media(prefers-color-scheme:dark){.dynamic-table-pagination-info{color:#9ca3af}}.dynamic-table-pagination-strong{font-weight:600;color:#1f2937}@media(prefers-color-scheme:dark){.dynamic-table-pagination-strong{color:#fff}}.dynamic-table-pagination-total{margin-left:.25rem}.dynamic-table-pagination-actions{display:flex;gap:.5rem}.dynamic-table-pagination-size{display:flex;align-items:center;gap:.5rem}.dynamic-table-pagination-size-label{font-size:.875rem;color:#6b7280}@media(prefers-color-scheme:dark){.dynamic-table-pagination-size-label{color:#9ca3af}}.dynamic-table-pagination-size-select{padding:.5rem 1rem;border:1px solid #d1d5db;border-radius:.5rem;background-color:#fff;font-size:.875rem;font-weight:500;color:#1f2937;cursor:pointer;transition:all .15s ease-in-out}.dynamic-table-pagination-size-select:hover{background-color:#f3f4f6}.dynamic-table-pagination-size-select:focus{outline:2px solid #4f46e5;outline-offset:-2px}@media(prefers-color-scheme:dark){.dynamic-table-pagination-size-select{background-color:#374151;border-color:#4b5563;color:#fff}.dynamic-table-pagination-size-select:hover{background-color:#4b5563}.dynamic-table-pagination-size-select:focus{outline-color:#6366f1}}.dynamic-table-pagination-button{display:flex;align-items:center;padding:.5rem 1rem;border:1px solid #d1d5db;border-radius:.5rem;background-color:#fff;font-size:.875rem;font-weight:500;transition:all .15s ease-in-out}.dynamic-table-pagination-button:hover{background-color:#f3f4f6}.dynamic-table-pagination-button:disabled{opacity:.4;cursor:not-allowed}@media(prefers-color-scheme:dark){.dynamic-table-pagination-button{background-color:#374151;border-color:#4b5563;color:#fff}.dynamic-table-pagination-button:hover{background-color:#4b5563}}@keyframes dynamic-table-pulse{0%,to{opacity:1}50%{opacity:.5}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletEnvironmentInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"], exportAs: ["ngComponentOutlet"] }] });
|
|
4576
4593
|
}
|
|
4577
4594
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: DynamicTableComponent, decorators: [{
|
|
4578
4595
|
type: Component,
|
|
4579
|
-
args: [{ selector: 'dynamic-table', standalone: true, imports: [CommonModule], template: "<div class=\"dynamic-table\">\n @if (showTitle || showSearch) {\n <div class=\"dynamic-table-toolbar\">\n @if (showTitle) {\n <h2 class=\"dynamic-table-title\">{{ title }}</h2>\n }\n\n @if (showSearch) {\n <input\n type=\"text\"\n (input)=\"onSearch($event)\"\n placeholder=\"Buscar...\"\n class=\"dynamic-table-search\"\n />\n }\n </div>\n }\n\n <div class=\"dynamic-table-scroll\">\n <table class=\"dynamic-table-table\">\n <thead class=\"dynamic-table-head\">\n <tr>\n @for (header of headers; track header.key) {\n <th class=\"dynamic-table-head-cell\">\n {{ header.label }}\n </th>\n }\n </tr>\n </thead>\n\n <tbody class=\"dynamic-table-body\">\n @if (isLoading) {\n <tr class=\"dynamic-table-row\">\n @for (header of headers; track header.key) {\n <td class=\"dynamic-table-cell\">\n <div class=\"dynamic-table-skeleton\"></div>\n </td>\n }\n </tr>\n }\n\n @for (row of data; track row) {\n <tr class=\"dynamic-table-row\">\n @for (header of headers; track header.key) {\n <td class=\"dynamic-table-cell dynamic-table-cell--nowrap\">\n @if (columnComponents[header.key]) {\n <ng-container\n *ngComponentOutlet=\"columnComponents[header.key]; injector: createInjector(row)\"\n ></ng-container>\n } @else {\n <span class=\"dynamic-table-cell--text\">\n {{ row[header.key] || '---' }}\n </span>\n }\n </td>\n }\n </tr>\n }\n\n @if ((!data || data.length < 1) && !isLoading) {\n <tr>\n <td [attr.colspan]=\"headers.length\" class=\"dynamic-table-empty\">\n No se encontraron registros en el servidor.\n </td>\n </tr>\n }\n </tbody>\n </table>\n </div>\n\n @if (showPagination) {\n <div class=\"dynamic-table-pagination\">\n <div class=\"dynamic-table-pagination-info\">\n Mostrando p\u00E1gina\n <span class=\"dynamic-table-pagination-strong\">{{ currentPage }}</span> de\n <span class=\"dynamic-table-pagination-strong\">{{ totalPages }}</span>\n <span class=\"dynamic-table-pagination-total\">({{ totalItems }} registros totales)</span>\n </div>\n\n <div class=\"dynamic-table-pagination-actions\">\n
|
|
4596
|
+
args: [{ selector: 'dynamic-table', standalone: true, imports: [CommonModule], template: "<div class=\"dynamic-table\">\n @if (showTitle || showSearch) {\n <div class=\"dynamic-table-toolbar\">\n @if (showTitle) {\n <h2 class=\"dynamic-table-title\">{{ title }}</h2>\n }\n\n @if (showSearch) {\n <input\n type=\"text\"\n (input)=\"onSearch($event)\"\n placeholder=\"Buscar...\"\n class=\"dynamic-table-search\"\n />\n }\n </div>\n }\n\n <div class=\"dynamic-table-scroll\">\n <table class=\"dynamic-table-table\">\n <thead class=\"dynamic-table-head\">\n <tr>\n @for (header of headers; track header.key) {\n <th class=\"dynamic-table-head-cell\">\n {{ header.label }}\n </th>\n }\n </tr>\n </thead>\n\n <tbody class=\"dynamic-table-body\">\n @if (isLoading) {\n <tr class=\"dynamic-table-row\">\n @for (header of headers; track header.key) {\n <td class=\"dynamic-table-cell\">\n <div class=\"dynamic-table-skeleton\"></div>\n </td>\n }\n </tr>\n }\n\n @for (row of data; track row) {\n <tr class=\"dynamic-table-row\">\n @for (header of headers; track header.key) {\n <td class=\"dynamic-table-cell dynamic-table-cell--nowrap\">\n @if (columnComponents[header.key]) {\n <ng-container\n *ngComponentOutlet=\"columnComponents[header.key]; injector: createInjector(row)\"\n ></ng-container>\n } @else {\n <span class=\"dynamic-table-cell--text\">\n {{ row[header.key] || '---' }}\n </span>\n }\n </td>\n }\n </tr>\n }\n\n @if ((!data || data.length < 1) && !isLoading) {\n <tr>\n <td [attr.colspan]=\"headers.length\" class=\"dynamic-table-empty\">\n No se encontraron registros en el servidor.\n </td>\n </tr>\n }\n </tbody>\n </table>\n </div>\n\n @if (showPagination) {\n <div class=\"dynamic-table-pagination\">\n @if (totalPages > 1) {\n <div class=\"dynamic-table-pagination-size\">\n <label for=\"page-size-select\" class=\"dynamic-table-pagination-size-label\">\n Items por p\u00E1gina\n </label>\n <select\n id=\"page-size-select\"\n class=\"dynamic-table-pagination-size-select\"\n [value]=\"itemsPerPage\"\n (change)=\"changePageSize($event)\"\n >\n @for (option of pageSizeOptions; track option) {\n <option [value]=\"option\">{{ option }}</option>\n }\n </select>\n </div>\n }\n\n <div class=\"dynamic-table-pagination-info\">\n Mostrando p\u00E1gina\n <span class=\"dynamic-table-pagination-strong\">{{ currentPage }}</span> de\n <span class=\"dynamic-table-pagination-strong\">{{ totalPages }}</span>\n <span class=\"dynamic-table-pagination-total\">({{ totalItems }} registros totales)</span>\n </div>\n\n @if (totalPages > 1) {\n <div class=\"dynamic-table-pagination-actions\">\n <button\n (click)=\"changePage(-1)\"\n [disabled]=\"currentPage === 1\"\n class=\"dynamic-table-pagination-button\"\n >\n Anterior\n </button>\n\n <button\n (click)=\"changePage(1)\"\n [disabled]=\"currentPage >= totalPages\"\n class=\"dynamic-table-pagination-button\"\n >\n Siguiente\n </button>\n </div>\n }\n </div>\n }\n</div>\n", styles: [".dynamic-table{background-color:#fff;border-radius:.5rem;overflow:hidden;border:1px solid #e5e7eb}@media(prefers-color-scheme:dark){.dynamic-table{background-color:#1f2937;border-color:#374151}}.dynamic-table-toolbar{padding:1rem;border-bottom:1px solid #e5e7eb;display:flex;align-items:center;justify-content:flex-start}@media(prefers-color-scheme:dark){.dynamic-table-toolbar{border-color:#374151}}.dynamic-table-title{font-size:1.125rem;font-weight:600;margin:0}@media(prefers-color-scheme:dark){.dynamic-table-title{color:#fff}}.dynamic-table-search{display:block;margin-left:auto;max-width:24rem;border:1px solid #d1d5db;border-radius:.375rem;background-color:#fff;padding:.375rem .75rem;font-size:1rem;color:#111827;outline:1px solid #d1d5db;outline-offset:-1px}.dynamic-table-search::placeholder{color:#9ca3af}.dynamic-table-search:focus{outline:2px solid #4f46e5;outline-offset:-2px}@media(min-width:640px){.dynamic-table-search{font-size:.875rem}}@media(prefers-color-scheme:dark){.dynamic-table-search{background-color:#ffffff0d;color:#fff;outline-color:#ffffff1a}.dynamic-table-search::placeholder{color:#6b7280}.dynamic-table-search:focus{outline-color:#6366f1}}.dynamic-table-scroll{overflow-x:auto}.dynamic-table-table{width:100%;text-align:left;border-collapse:collapse}.dynamic-table-head{background-color:#f3f4f6;color:#4b5563;font-size:.75rem}@media(prefers-color-scheme:dark){.dynamic-table-head{background-color:#374151;color:#d1d5db}}.dynamic-table-head-cell{text-overflow:ellipsis;max-width:200px;padding:.75rem;border-bottom:1px solid #d1d5db;white-space:nowrap}@media(prefers-color-scheme:dark){.dynamic-table-head-cell{border-color:#4b5563}}.dynamic-table-body{color:#374151;font-size:.75rem}@media(prefers-color-scheme:dark){.dynamic-table-body{color:#e5e7eb}}.dynamic-table-row{border-bottom:1px solid #e5e7eb;transition:background-color .15s ease-in-out}.dynamic-table-row:last-child{border-bottom:none}.dynamic-table-row:nth-child(2n){background-color:#f3f4f6}.dynamic-table-row:hover{background-color:#e5e7eb}@media(prefers-color-scheme:dark){.dynamic-table-row{border-color:#374151}.dynamic-table-row:nth-child(2n){background-color:#37415180}.dynamic-table-row:hover{background-color:#374151}}.dynamic-table-cell{padding:.75rem}.dynamic-table-cell--nowrap{white-space:nowrap}.dynamic-table-cell--text{display:inline-block;overflow:hidden;text-overflow:ellipsis;max-width:280px}.dynamic-table-skeleton{height:1.25rem;width:100%;background-color:#e5e7eb;border-radius:.375rem;animation:dynamic-table-pulse 2s cubic-bezier(.4,0,.6,1) infinite}@media(prefers-color-scheme:dark){.dynamic-table-skeleton{background-color:#4b5563}}.dynamic-table-empty{padding:1.5rem;text-align:center;color:#9ca3af;font-style:italic}@media(prefers-color-scheme:dark){.dynamic-table-empty{color:#6b7280}}.dynamic-table-pagination{padding:1rem;display:flex;align-items:center;justify-content:space-between;background-color:#f9fafb;border-top:1px solid #d1d5db}@media(prefers-color-scheme:dark){.dynamic-table-pagination{background-color:#1f293780;border-color:#374151}}.dynamic-table-pagination-info{font-size:.875rem;color:#6b7280}@media(prefers-color-scheme:dark){.dynamic-table-pagination-info{color:#9ca3af}}.dynamic-table-pagination-strong{font-weight:600;color:#1f2937}@media(prefers-color-scheme:dark){.dynamic-table-pagination-strong{color:#fff}}.dynamic-table-pagination-total{margin-left:.25rem}.dynamic-table-pagination-actions{display:flex;gap:.5rem}.dynamic-table-pagination-size{display:flex;align-items:center;gap:.5rem}.dynamic-table-pagination-size-label{font-size:.875rem;color:#6b7280}@media(prefers-color-scheme:dark){.dynamic-table-pagination-size-label{color:#9ca3af}}.dynamic-table-pagination-size-select{padding:.5rem 1rem;border:1px solid #d1d5db;border-radius:.5rem;background-color:#fff;font-size:.875rem;font-weight:500;color:#1f2937;cursor:pointer;transition:all .15s ease-in-out}.dynamic-table-pagination-size-select:hover{background-color:#f3f4f6}.dynamic-table-pagination-size-select:focus{outline:2px solid #4f46e5;outline-offset:-2px}@media(prefers-color-scheme:dark){.dynamic-table-pagination-size-select{background-color:#374151;border-color:#4b5563;color:#fff}.dynamic-table-pagination-size-select:hover{background-color:#4b5563}.dynamic-table-pagination-size-select:focus{outline-color:#6366f1}}.dynamic-table-pagination-button{display:flex;align-items:center;padding:.5rem 1rem;border:1px solid #d1d5db;border-radius:.5rem;background-color:#fff;font-size:.875rem;font-weight:500;transition:all .15s ease-in-out}.dynamic-table-pagination-button:hover{background-color:#f3f4f6}.dynamic-table-pagination-button:disabled{opacity:.4;cursor:not-allowed}@media(prefers-color-scheme:dark){.dynamic-table-pagination-button{background-color:#374151;border-color:#4b5563;color:#fff}.dynamic-table-pagination-button:hover{background-color:#4b5563}}@keyframes dynamic-table-pulse{0%,to{opacity:1}50%{opacity:.5}}\n"] }]
|
|
4580
4597
|
}], ctorParameters: () => [{ type: i0.Injector }], propDecorators: { title: [{
|
|
4581
4598
|
type: Input
|
|
4582
4599
|
}], data: [{
|
|
@@ -4597,6 +4614,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
|
|
|
4597
4614
|
type: Output
|
|
4598
4615
|
}], searchChange: [{
|
|
4599
4616
|
type: Output
|
|
4617
|
+
}], pageSizeChange: [{
|
|
4618
|
+
type: Output
|
|
4600
4619
|
}], showPagination: [{
|
|
4601
4620
|
type: Input
|
|
4602
4621
|
}], showSearch: [{
|
|
@@ -6275,7 +6294,7 @@ class ChangePasswordFormComponent {
|
|
|
6275
6294
|
});
|
|
6276
6295
|
}
|
|
6277
6296
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: ChangePasswordFormComponent, deps: [{ token: i1$2.FormBuilder }, { token: ChangePasswordFormService }, { token: CustomerService }, { token: AdminService }, { token: ToastService }, { token: i2.TranslocoService }], target: i0.ɵɵFactoryTarget.Component });
|
|
6278
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: ChangePasswordFormComponent, isStandalone: true, selector: "change-password-form", providers: [AdminService, CustomerService], ngImport: i0, template: "@if (isOpen()) {\n <app-modal\n [title]=\"'changePassword.title' | transloco\"\n [isOpen]=\"isOpen\"\n (closeModal)=\"onCloseModal()\"\n >\n <form\n [formGroup]=\"changePasswordForm\"\n method=\"POST\"\n class=\"change-password-form-body\"\n (ngSubmit)=\"onConfirmDelete()\"\n >\n <form-input\n [label]=\"'changePassword.newPasswordLabel' | transloco\"\n [placeholder]=\"'changePassword.newPasswordPlaceholder' | transloco\"\n name=\"password\"\n type=\"password\"\n class=\"change-password-form-field\"\n [required]=\"true\"\n [autocomplete]=\"false\"\n formControlName=\"password\"\n />\n\n <form-input\n [label]=\"'changePassword.confirmPasswordLabel' | transloco\"\n [placeholder]=\"'changePassword.confirmPasswordPlaceholder' | transloco\"\n name=\"confirm_password\"\n type=\"password\"\n class=\"change-password-form-field\"\n [required]=\"true\"\n [autocomplete]=\"false\"\n formControlName=\"confirm_password\"\n />\n\n <div class=\"change-password-form-actions\">\n <app-button\n variant=\"tertiary\"\n [text]=\"'changePassword.cancel' | transloco\"\n (click)=\"onCloseModal()\"\n size=\"sm\"\n />\n\n <app-button\n [disabled]=\"loading() || changePasswordForm.invalid || changePasswordForm.pristine\"\n [loading]=\"loading()\"\n type=\"submit\"\n variant=\"primary\"\n [text]=\"'changePassword.save' | transloco\"\n [loadingText]=\"'changePassword.saving' | transloco\"\n size=\"sm\"\n />\n </div>\n </form>\n </app-modal>\n}\n", styles: [".change-password-form-body{display:flex;flex-direction:column;gap:1rem}.change-password-form-field{flex:1}.change-password-form-actions{display:flex;gap:.75rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: TranslocoModule }, { kind: "component", type: AppButtonComponent, selector: "app-button", inputs: ["disabled", "loading", "type", "variant", "text", "size", "loadingText", "icon", "tooltip"], outputs: ["clicked"] }, { kind: "component", type: FormInputComponent, selector: "form-input", inputs: ["label", "type", "name", "id", "placeholder", "required", "readonly", "maxlength", "minlength", "max", "min", "step", "pattern", "fieldGroupClass", "autocomplete"] }, { kind: "component", type: AppModalComponent, selector: "app-modal", inputs: ["title", "disableClose", "showHeader", "showCloseButton", "showTitle", "isOpen", "size"], outputs: ["closeModal"] }, { kind: "pipe", type: i2.TranslocoPipe, name: "transloco" }], encapsulation: i0.ViewEncapsulation.None });
|
|
6297
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: ChangePasswordFormComponent, isStandalone: true, selector: "change-password-form", providers: [AdminService, CustomerService], ngImport: i0, template: "@if (isOpen()) {\n <app-modal\n [title]=\"'changePassword.title' | transloco\"\n [isOpen]=\"isOpen\"\n (closeModal)=\"onCloseModal()\"\n >\n <form\n [formGroup]=\"changePasswordForm\"\n method=\"POST\"\n class=\"change-password-form-body\"\n (ngSubmit)=\"onConfirmDelete()\"\n >\n <form-input\n [label]=\"'changePassword.newPasswordLabel' | transloco\"\n [placeholder]=\"'changePassword.newPasswordPlaceholder' | transloco\"\n name=\"password\"\n type=\"password\"\n class=\"change-password-form-field\"\n [required]=\"true\"\n [autocomplete]=\"false\"\n formControlName=\"password\"\n />\n\n <form-input\n [label]=\"'changePassword.confirmPasswordLabel' | transloco\"\n [placeholder]=\"'changePassword.confirmPasswordPlaceholder' | transloco\"\n name=\"confirm_password\"\n type=\"password\"\n class=\"change-password-form-field\"\n [required]=\"true\"\n [autocomplete]=\"false\"\n formControlName=\"confirm_password\"\n />\n\n <div class=\"change-password-form-actions\">\n <app-button\n variant=\"tertiary\"\n [text]=\"'changePassword.cancel' | transloco\"\n (click)=\"onCloseModal()\"\n size=\"sm\"\n />\n\n <app-button\n [disabled]=\"loading() || changePasswordForm.invalid || changePasswordForm.pristine\"\n [loading]=\"loading()\"\n type=\"submit\"\n variant=\"primary\"\n [text]=\"'changePassword.save' | transloco\"\n [loadingText]=\"'changePassword.saving' | transloco\"\n size=\"sm\"\n />\n </div>\n </form>\n </app-modal>\n}\n", styles: [".change-password-form-body{display:flex;flex-direction:column;gap:1rem}.change-password-form-field{flex:1}.change-password-form-actions{display:flex;gap:.75rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: TranslocoModule }, { kind: "component", type: AppButtonComponent, selector: "app-button", inputs: ["disabled", "loading", "type", "variant", "text", "size", "loadingText", "icon", "tooltip"], outputs: ["clicked"] }, { kind: "component", type: FormInputComponent, selector: "form-input", inputs: ["label", "type", "name", "id", "placeholder", "required", "readonly", "maxlength", "minlength", "max", "min", "step", "pattern", "fieldGroupClass", "autocomplete"] }, { kind: "component", type: AppModalComponent, selector: "app-modal", inputs: ["title", "disableClose", "showHeader", "showCloseButton", "showTitle", "interactiveClose", "isOpen", "size"], outputs: ["closeModal"] }, { kind: "pipe", type: i2.TranslocoPipe, name: "transloco" }], encapsulation: i0.ViewEncapsulation.None });
|
|
6279
6298
|
}
|
|
6280
6299
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: ChangePasswordFormComponent, decorators: [{
|
|
6281
6300
|
type: Component,
|
|
@@ -8660,7 +8679,7 @@ class ConfirmationOrderModalComponent {
|
|
|
8660
8679
|
this.onConfirm && this.onConfirm.emit();
|
|
8661
8680
|
}
|
|
8662
8681
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: ConfirmationOrderModalComponent, deps: [{ token: ConfirmationOrderModalService }, { token: TicketSelectionDiscountService }, { token: TicketSelectionTotalsService }, { token: TicketSelectionService }, { token: PerformanceBookingDataService }], target: i0.ɵɵFactoryTarget.Component });
|
|
8663
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: ConfirmationOrderModalComponent, isStandalone: true, selector: "confirmation-order-modal", inputs: { modalTitle: "modalTitle", confirmButtonText: "confirmButtonText", confirmButtonTextLoading: "confirmButtonTextLoading", loading: "loading" }, outputs: { onConfirm: "onConfirm" }, ngImport: i0, template: "<app-modal [title]=\"modalTitle\" [isOpen]=\"isOpen\" size=\"md\" (closeModal)=\"onClose()\">\n <div class=\"confirmation-modal\">\n <p class=\"confirmation-modal__description\">\n Revise los detalles de la compra antes de confirmar.\n </p>\n\n <p class=\"confirmation-modal__item\">\n <span>Entradas ({{ selectedCount | number: '1.0-0' }}):</span>\n <span>${{ ticketSubtotal | number: '1.0' }}</span>\n </p>\n\n @if (productCount > 0) {\n <p class=\"confirmation-modal__item\">\n <span>Productos ({{ productCount | number: '1.0-0' }}):</span>\n <span>${{ productSubtotal | number: '1.0' }}</span>\n </p>\n }\n\n @if (serviceFee > 0) {\n <p class=\"confirmation-modal__item\">\n <span>Tarifa de servicio:</span>\n <span>${{ serviceFee | number: '1.0' }}</span>\n </p>\n }\n\n @if (coupon) {\n <p class=\"confirmation-modal__item\">\n <span>Cup\u00F3n de descuento:</span>\n <span class=\"confirmation-modal__discount\">\n ${{ coupon.discount_value | number: '1.0-2' }}\n </span>\n </p>\n }\n\n @if (corporateBond) {\n <p class=\"confirmation-modal__item\">\n <span>Bono corporativo:</span>\n <span class=\"confirmation-modal__discount\">\n ${{ corporateBond.value | number: '1.0-2' }}\n </span>\n </p>\n }\n\n @if (giftBond) {\n <p class=\"confirmation-modal__item\">\n <span>Bono de regalo:</span>\n <span class=\"confirmation-modal__discount\">\n ${{ giftBond.original_value | number: '1.0-2' }}\n </span>\n </p>\n }\n\n <hr class=\"confirmation-modal__divider\" />\n\n <p class=\"confirmation-modal__totals\">\n <span class=\"confirmation-modal__totals-title\">Total:</span>\n\n @if (totalDiscounted || totalDiscounted === 0) {\n <span class=\"confirmation-modal__totals-discounted\">\n <span class=\"confirmation-modal__discount\">\n ${{ totalValue | currency: 'COP' : 'symbol' : '1.0' }}\n </span>\n <span class=\"confirmation-modal__price\">\n ${{ totalDiscounted | currency: 'COP' : 'symbol' : '1.0' }}\n </span>\n </span>\n } @else {\n <span class=\"confirmation-modal__price\">${{ totalValue | number: '1.0' }}</span>\n }\n </p>\n </div>\n\n <div class=\"confirmation-modal__actions\">\n <app-button\n size=\"sm\"\n variant=\"tertiary\"\n text=\"Cancelar\"\n (click)=\"onClose()\"\n [disabled]=\"loading\"\n />\n\n <app-button\n size=\"sm\"\n variant=\"primary\"\n [text]=\"confirmButtonText\"\n [loadingText]=\"confirmButtonTextLoading\"\n [loading]=\"loading\"\n [disabled]=\"loading\"\n (click)=\"confirmOrder()\"\n />\n </div>\n</app-modal>\n", styles: [".confirmation-modal{display:flex;flex-flow:column nowrap;gap:.5rem;width:100%}.confirmation-modal__description{color:#6b7280;font-size:.875rem;margin-bottom:.5rem}.confirmation-modal__item{align-items:center;color:#9ca3af;display:flex;flex-flow:row wrap;font-size:.75rem;justify-content:space-between;margin:0}.confirmation-modal__discount{text-decoration:line-through}.confirmation-modal__divider{border:none;border-top:1px solid #e5e7eb;width:100%}.confirmation-modal__price{color:#4b5563;font-size:1rem;font-weight:700}.confirmation-modal__totals{align-items:center;display:flex;flex-flow:row;justify-content:space-between;margin:0;width:100%}.confirmation-modal__totals-title{color:#4b5563;font-size:1rem;font-weight:700}.confirmation-modal__totals-discounted{align-items:flex-end;display:flex;flex-flow:column}.confirmation-modal__totals-discounted .confirmation-modal__discount{color:#9ca3af;font-size:.75rem}.confirmation-modal__actions{display:flex;flex-flow:row;gap:.5rem;justify-content:flex-end;padding-top:1rem;width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: AppButtonComponent, selector: "app-button", inputs: ["disabled", "loading", "type", "variant", "text", "size", "loadingText", "icon", "tooltip"], outputs: ["clicked"] }, { kind: "component", type: AppModalComponent, selector: "app-modal", inputs: ["title", "disableClose", "showHeader", "showCloseButton", "showTitle", "isOpen", "size"], outputs: ["closeModal"] }, { kind: "pipe", type: i1$1.DecimalPipe, name: "number" }, { kind: "pipe", type: i1$1.CurrencyPipe, name: "currency" }] });
|
|
8682
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: ConfirmationOrderModalComponent, isStandalone: true, selector: "confirmation-order-modal", inputs: { modalTitle: "modalTitle", confirmButtonText: "confirmButtonText", confirmButtonTextLoading: "confirmButtonTextLoading", loading: "loading" }, outputs: { onConfirm: "onConfirm" }, ngImport: i0, template: "<app-modal [title]=\"modalTitle\" [isOpen]=\"isOpen\" size=\"md\" (closeModal)=\"onClose()\">\n <div class=\"confirmation-modal\">\n <p class=\"confirmation-modal__description\">\n Revise los detalles de la compra antes de confirmar.\n </p>\n\n <p class=\"confirmation-modal__item\">\n <span>Entradas ({{ selectedCount | number: '1.0-0' }}):</span>\n <span>${{ ticketSubtotal | number: '1.0' }}</span>\n </p>\n\n @if (productCount > 0) {\n <p class=\"confirmation-modal__item\">\n <span>Productos ({{ productCount | number: '1.0-0' }}):</span>\n <span>${{ productSubtotal | number: '1.0' }}</span>\n </p>\n }\n\n @if (serviceFee > 0) {\n <p class=\"confirmation-modal__item\">\n <span>Tarifa de servicio:</span>\n <span>${{ serviceFee | number: '1.0' }}</span>\n </p>\n }\n\n @if (coupon) {\n <p class=\"confirmation-modal__item\">\n <span>Cup\u00F3n de descuento:</span>\n <span class=\"confirmation-modal__discount\">\n ${{ coupon.discount_value | number: '1.0-2' }}\n </span>\n </p>\n }\n\n @if (corporateBond) {\n <p class=\"confirmation-modal__item\">\n <span>Bono corporativo:</span>\n <span class=\"confirmation-modal__discount\">\n ${{ corporateBond.value | number: '1.0-2' }}\n </span>\n </p>\n }\n\n @if (giftBond) {\n <p class=\"confirmation-modal__item\">\n <span>Bono de regalo:</span>\n <span class=\"confirmation-modal__discount\">\n ${{ giftBond.original_value | number: '1.0-2' }}\n </span>\n </p>\n }\n\n <hr class=\"confirmation-modal__divider\" />\n\n <p class=\"confirmation-modal__totals\">\n <span class=\"confirmation-modal__totals-title\">Total:</span>\n\n @if (totalDiscounted || totalDiscounted === 0) {\n <span class=\"confirmation-modal__totals-discounted\">\n <span class=\"confirmation-modal__discount\">\n ${{ totalValue | currency: 'COP' : 'symbol' : '1.0' }}\n </span>\n <span class=\"confirmation-modal__price\">\n ${{ totalDiscounted | currency: 'COP' : 'symbol' : '1.0' }}\n </span>\n </span>\n } @else {\n <span class=\"confirmation-modal__price\">${{ totalValue | number: '1.0' }}</span>\n }\n </p>\n </div>\n\n <div class=\"confirmation-modal__actions\">\n <app-button\n size=\"sm\"\n variant=\"tertiary\"\n text=\"Cancelar\"\n (click)=\"onClose()\"\n [disabled]=\"loading\"\n />\n\n <app-button\n size=\"sm\"\n variant=\"primary\"\n [text]=\"confirmButtonText\"\n [loadingText]=\"confirmButtonTextLoading\"\n [loading]=\"loading\"\n [disabled]=\"loading\"\n (click)=\"confirmOrder()\"\n />\n </div>\n</app-modal>\n", styles: [".confirmation-modal{display:flex;flex-flow:column nowrap;gap:.5rem;width:100%}.confirmation-modal__description{color:#6b7280;font-size:.875rem;margin-bottom:.5rem}.confirmation-modal__item{align-items:center;color:#9ca3af;display:flex;flex-flow:row wrap;font-size:.75rem;justify-content:space-between;margin:0}.confirmation-modal__discount{text-decoration:line-through}.confirmation-modal__divider{border:none;border-top:1px solid #e5e7eb;width:100%}.confirmation-modal__price{color:#4b5563;font-size:1rem;font-weight:700}.confirmation-modal__totals{align-items:center;display:flex;flex-flow:row;justify-content:space-between;margin:0;width:100%}.confirmation-modal__totals-title{color:#4b5563;font-size:1rem;font-weight:700}.confirmation-modal__totals-discounted{align-items:flex-end;display:flex;flex-flow:column}.confirmation-modal__totals-discounted .confirmation-modal__discount{color:#9ca3af;font-size:.75rem}.confirmation-modal__actions{display:flex;flex-flow:row;gap:.5rem;justify-content:flex-end;padding-top:1rem;width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: AppButtonComponent, selector: "app-button", inputs: ["disabled", "loading", "type", "variant", "text", "size", "loadingText", "icon", "tooltip"], outputs: ["clicked"] }, { kind: "component", type: AppModalComponent, selector: "app-modal", inputs: ["title", "disableClose", "showHeader", "showCloseButton", "showTitle", "interactiveClose", "isOpen", "size"], outputs: ["closeModal"] }, { kind: "pipe", type: i1$1.DecimalPipe, name: "number" }, { kind: "pipe", type: i1$1.CurrencyPipe, name: "currency" }] });
|
|
8664
8683
|
}
|
|
8665
8684
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: ConfirmationOrderModalComponent, decorators: [{
|
|
8666
8685
|
type: Component,
|
|
@@ -8910,7 +8929,7 @@ class TicketQrModalComponent {
|
|
|
8910
8929
|
this.ticketQrModalService.close();
|
|
8911
8930
|
}
|
|
8912
8931
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: TicketQrModalComponent, deps: [{ token: TicketQrModalService }], target: i0.ɵɵFactoryTarget.Component });
|
|
8913
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: TicketQrModalComponent, isStandalone: true, selector: "ticket-qr-modal", ngImport: i0, template: "<app-modal title=\"C\u00F3digo QR del ticket\" [isOpen]=\"isOpen\" (closeModal)=\"onClose()\" size=\"md\">\n <div class=\"ticket-qr-modal\">\n @if (ticketDescription(); as desc) {\n <p class=\"ticket-qr-modal__description\">{{ desc }}</p>\n }\n\n @if (ticketUuid(); as uuid) {\n <performance-ticket-qr [ticketUuid]=\"uuid\" />\n }\n </div>\n</app-modal>\n", styles: [".ticket-qr-modal__description{color:#6b7280;font-weight:700;font-size:1rem;margin-bottom:1rem;text-align:center;width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: AppModalComponent, selector: "app-modal", inputs: ["title", "disableClose", "showHeader", "showCloseButton", "showTitle", "isOpen", "size"], outputs: ["closeModal"] }, { kind: "component", type: TicketQrComponent, selector: "performance-ticket-qr", inputs: ["ticketUuid"] }] });
|
|
8932
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: TicketQrModalComponent, isStandalone: true, selector: "ticket-qr-modal", ngImport: i0, template: "<app-modal title=\"C\u00F3digo QR del ticket\" [isOpen]=\"isOpen\" (closeModal)=\"onClose()\" size=\"md\">\n <div class=\"ticket-qr-modal\">\n @if (ticketDescription(); as desc) {\n <p class=\"ticket-qr-modal__description\">{{ desc }}</p>\n }\n\n @if (ticketUuid(); as uuid) {\n <performance-ticket-qr [ticketUuid]=\"uuid\" />\n }\n </div>\n</app-modal>\n", styles: [".ticket-qr-modal__description{color:#6b7280;font-weight:700;font-size:1rem;margin-bottom:1rem;text-align:center;width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: AppModalComponent, selector: "app-modal", inputs: ["title", "disableClose", "showHeader", "showCloseButton", "showTitle", "interactiveClose", "isOpen", "size"], outputs: ["closeModal"] }, { kind: "component", type: TicketQrComponent, selector: "performance-ticket-qr", inputs: ["ticketUuid"] }] });
|
|
8914
8933
|
}
|
|
8915
8934
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: TicketQrModalComponent, decorators: [{
|
|
8916
8935
|
type: Component,
|
|
@@ -9101,7 +9120,7 @@ class OrderTransactionDetailsModalComponent {
|
|
|
9101
9120
|
this.modalService.close();
|
|
9102
9121
|
}
|
|
9103
9122
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: OrderTransactionDetailsModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
9104
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: OrderTransactionDetailsModalComponent, isStandalone: true, selector: "order-transaction-details-modal", inputs: { isOpen: "isOpen", transaction: "transaction" }, ngImport: i0, template: "<app-modal\n [isOpen]=\"modalIsOpen\"\n (closeModal)=\"onClose()\"\n [title]=\"'order.transactionDetails.title' | transloco\"\n size=\"lg\"\n>\n @if (selectedTransaction(); as tx) {\n <div class=\"order-transaction-details\">\n <div class=\"order-transaction-details__grid\">\n <div class=\"order-transaction-details__item\">\n <span class=\"order-transaction-details__label\">\n {{ 'order.transactionDetails.labels.id' | transloco }}\n </span>\n <span class=\"order-transaction-details__value\">{{ tx.id }}</span>\n </div>\n\n <div class=\"order-transaction-details__item\">\n <span class=\"order-transaction-details__label\">\n {{ 'order.transactionDetails.labels.paymentMethod' | transloco }}\n </span>\n <span class=\"order-transaction-details__value\">\n {{ 'order.paymentMethods.' + tx.payment_gateway | transloco }}\n </span>\n </div>\n\n <div class=\"order-transaction-details__item\">\n <span class=\"order-transaction-details__label\">\n {{ 'order.transactionDetails.labels.status' | transloco }}\n </span>\n <span class=\"order-transaction-details__value\">\n <app-badge\n [text]=\"'order.transactionStatus.' + tx.status | transloco\"\n [backgroundColor]=\"txColors[tx.status].bg\"\n [textColor]=\"txColors[tx.status].text\"\n size=\"xs\"\n />\n </span>\n </div>\n\n <div class=\"order-transaction-details__item\">\n <span class=\"order-transaction-details__label\">\n {{ 'order.transactionDetails.labels.amount' | transloco }}\n </span>\n <span class=\"order-transaction-details__value\">\n ${{ tx.amount | number: '1.0-2' }} {{ tx.currency }}\n </span>\n </div>\n\n <div class=\"order-transaction-details__item\">\n <span class=\"order-transaction-details__label\">\n {{ 'order.transactionDetails.labels.currency' | transloco }}\n </span>\n <span class=\"order-transaction-details__value\">{{ tx.currency }}</span>\n </div>\n\n <div class=\"order-transaction-details__item\">\n <span class=\"order-transaction-details__label\">\n {{ 'order.transactionDetails.labels.gatewayId' | transloco }}\n </span>\n <span class=\"order-transaction-details__value gateway-id\">\n {{ tx.gateway_transaction_id }}\n </span>\n </div>\n\n <div class=\"order-transaction-details__item\">\n <span class=\"order-transaction-details__label\">\n {{ 'order.transactionDetails.labels.createdAt' | transloco }}\n </span>\n <span class=\"order-transaction-details__value\">{{ tx.created_at | date: 'medium' }}</span>\n </div>\n\n <div class=\"order-transaction-details__item\">\n <span class=\"order-transaction-details__label\">\n {{ 'order.transactionDetails.labels.updatedAt' | transloco }}\n </span>\n <span class=\"order-transaction-details__value\">{{ tx.updated_at | date: 'medium' }}</span>\n </div>\n </div>\n\n <div class=\"order-transaction-details__item\">\n <span class=\"order-transaction-details__label\">\n {{ 'order.transactionDetails.labels.gatewayResponse' | transloco }}\n </span>\n @if (gatewayResponse) {\n <pre class=\"order-transaction-details__json\">{{ gatewayResponse }}</pre>\n } @else {\n <span class=\"order-transaction-details__value\">\u2014</span>\n }\n </div>\n </div>\n }\n</app-modal>\n", styles: [".order-transaction-details{display:flex;flex-direction:column;gap:1.5rem}.order-transaction-details__grid{display:grid;gap:1rem 1.5rem;grid-template-columns:repeat(2,minmax(0,1fr))}.order-transaction-details__item{display:flex;flex-direction:column;gap:.25rem}.order-transaction-details__label{color:#6b7280;font-size:.75rem;font-weight:700;text-transform:uppercase}.order-transaction-details__value{color:#374151;font-size:.875rem}@media(prefers-color-scheme:dark){.order-transaction-details__value{color:#d1d5db}}.order-transaction-details__json{background-color:#f9fafb;border:1px solid #f3f4f6;border-radius:.375rem;color:#374151;font-family:ui-monospace,SFMono-Regular,SF Mono,Menlo,Consolas,Liberation Mono,monospace;font-size:.75rem;line-height:1.625;margin:0;max-height:20rem;overflow:auto;padding:.75rem 1rem;white-space:pre-wrap;word-break:break-word}@media(prefers-color-scheme:dark){.order-transaction-details__json{background-color:#111827}}@media(prefers-color-scheme:dark){.order-transaction-details__json{border-color:#374151}}@media(prefers-color-scheme:dark){.order-transaction-details__json{color:#d1d5db}}.order-transaction-details .gateway-id{font-family:ui-monospace,SFMono-Regular,SF Mono,Menlo,Consolas,Liberation Mono,monospace;font-size:.75rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: TranslocoModule }, { kind: "component", type: AppModalComponent, selector: "app-modal", inputs: ["title", "disableClose", "showHeader", "showCloseButton", "showTitle", "isOpen", "size"], outputs: ["closeModal"] }, { kind: "component", type: AppBadgeComponent, selector: "app-badge", inputs: ["text", "color", "size", "bordered", "backgroundColor", "textColor"] }, { kind: "pipe", type: i1$1.DecimalPipe, name: "number" }, { kind: "pipe", type: i1$1.DatePipe, name: "date" }, { kind: "pipe", type: i2.TranslocoPipe, name: "transloco" }] });
|
|
9123
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: OrderTransactionDetailsModalComponent, isStandalone: true, selector: "order-transaction-details-modal", inputs: { isOpen: "isOpen", transaction: "transaction" }, ngImport: i0, template: "<app-modal\n [isOpen]=\"modalIsOpen\"\n (closeModal)=\"onClose()\"\n [title]=\"'order.transactionDetails.title' | transloco\"\n size=\"lg\"\n>\n @if (selectedTransaction(); as tx) {\n <div class=\"order-transaction-details\">\n <div class=\"order-transaction-details__grid\">\n <div class=\"order-transaction-details__item\">\n <span class=\"order-transaction-details__label\">\n {{ 'order.transactionDetails.labels.id' | transloco }}\n </span>\n <span class=\"order-transaction-details__value\">{{ tx.id }}</span>\n </div>\n\n <div class=\"order-transaction-details__item\">\n <span class=\"order-transaction-details__label\">\n {{ 'order.transactionDetails.labels.paymentMethod' | transloco }}\n </span>\n <span class=\"order-transaction-details__value\">\n {{ 'order.paymentMethods.' + tx.payment_gateway | transloco }}\n </span>\n </div>\n\n <div class=\"order-transaction-details__item\">\n <span class=\"order-transaction-details__label\">\n {{ 'order.transactionDetails.labels.status' | transloco }}\n </span>\n <span class=\"order-transaction-details__value\">\n <app-badge\n [text]=\"'order.transactionStatus.' + tx.status | transloco\"\n [backgroundColor]=\"txColors[tx.status].bg\"\n [textColor]=\"txColors[tx.status].text\"\n size=\"xs\"\n />\n </span>\n </div>\n\n <div class=\"order-transaction-details__item\">\n <span class=\"order-transaction-details__label\">\n {{ 'order.transactionDetails.labels.amount' | transloco }}\n </span>\n <span class=\"order-transaction-details__value\">\n ${{ tx.amount | number: '1.0-2' }} {{ tx.currency }}\n </span>\n </div>\n\n <div class=\"order-transaction-details__item\">\n <span class=\"order-transaction-details__label\">\n {{ 'order.transactionDetails.labels.currency' | transloco }}\n </span>\n <span class=\"order-transaction-details__value\">{{ tx.currency }}</span>\n </div>\n\n <div class=\"order-transaction-details__item\">\n <span class=\"order-transaction-details__label\">\n {{ 'order.transactionDetails.labels.gatewayId' | transloco }}\n </span>\n <span class=\"order-transaction-details__value gateway-id\">\n {{ tx.gateway_transaction_id }}\n </span>\n </div>\n\n <div class=\"order-transaction-details__item\">\n <span class=\"order-transaction-details__label\">\n {{ 'order.transactionDetails.labels.createdAt' | transloco }}\n </span>\n <span class=\"order-transaction-details__value\">{{ tx.created_at | date: 'medium' }}</span>\n </div>\n\n <div class=\"order-transaction-details__item\">\n <span class=\"order-transaction-details__label\">\n {{ 'order.transactionDetails.labels.updatedAt' | transloco }}\n </span>\n <span class=\"order-transaction-details__value\">{{ tx.updated_at | date: 'medium' }}</span>\n </div>\n </div>\n\n <div class=\"order-transaction-details__item\">\n <span class=\"order-transaction-details__label\">\n {{ 'order.transactionDetails.labels.gatewayResponse' | transloco }}\n </span>\n @if (gatewayResponse) {\n <pre class=\"order-transaction-details__json\">{{ gatewayResponse }}</pre>\n } @else {\n <span class=\"order-transaction-details__value\">\u2014</span>\n }\n </div>\n </div>\n }\n</app-modal>\n", styles: [".order-transaction-details{display:flex;flex-direction:column;gap:1.5rem}.order-transaction-details__grid{display:grid;gap:1rem 1.5rem;grid-template-columns:repeat(2,minmax(0,1fr))}.order-transaction-details__item{display:flex;flex-direction:column;gap:.25rem}.order-transaction-details__label{color:#6b7280;font-size:.75rem;font-weight:700;text-transform:uppercase}.order-transaction-details__value{color:#374151;font-size:.875rem}@media(prefers-color-scheme:dark){.order-transaction-details__value{color:#d1d5db}}.order-transaction-details__json{background-color:#f9fafb;border:1px solid #f3f4f6;border-radius:.375rem;color:#374151;font-family:ui-monospace,SFMono-Regular,SF Mono,Menlo,Consolas,Liberation Mono,monospace;font-size:.75rem;line-height:1.625;margin:0;max-height:20rem;overflow:auto;padding:.75rem 1rem;white-space:pre-wrap;word-break:break-word}@media(prefers-color-scheme:dark){.order-transaction-details__json{background-color:#111827}}@media(prefers-color-scheme:dark){.order-transaction-details__json{border-color:#374151}}@media(prefers-color-scheme:dark){.order-transaction-details__json{color:#d1d5db}}.order-transaction-details .gateway-id{font-family:ui-monospace,SFMono-Regular,SF Mono,Menlo,Consolas,Liberation Mono,monospace;font-size:.75rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: TranslocoModule }, { kind: "component", type: AppModalComponent, selector: "app-modal", inputs: ["title", "disableClose", "showHeader", "showCloseButton", "showTitle", "interactiveClose", "isOpen", "size"], outputs: ["closeModal"] }, { kind: "component", type: AppBadgeComponent, selector: "app-badge", inputs: ["text", "color", "size", "bordered", "backgroundColor", "textColor"] }, { kind: "pipe", type: i1$1.DecimalPipe, name: "number" }, { kind: "pipe", type: i1$1.DatePipe, name: "date" }, { kind: "pipe", type: i2.TranslocoPipe, name: "transloco" }] });
|
|
9105
9124
|
}
|
|
9106
9125
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: OrderTransactionDetailsModalComponent, decorators: [{
|
|
9107
9126
|
type: Component,
|
|
@@ -9216,7 +9235,7 @@ class VipRechargeModalComponent {
|
|
|
9216
9235
|
this.confirm.emit({ amount: Number(this.rechargeForm.value.amount) });
|
|
9217
9236
|
}
|
|
9218
9237
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: VipRechargeModalComponent, deps: [{ token: i1$2.FormBuilder }], target: i0.ɵɵFactoryTarget.Component });
|
|
9219
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.25", type: VipRechargeModalComponent, isStandalone: true, selector: "vip-recharge-modal", inputs: { title: "title", submitLabel: "submitLabel", loading: "loading", minAmount: "minAmount", isOpen: "isOpen" }, outputs: { closeModal: "closeModal", confirm: "confirm" }, ngImport: i0, template: "<app-modal [isOpen]=\"isOpen\" [title]=\"title\" size=\"md\" (closeModal)=\"onClose()\">\n <form [formGroup]=\"rechargeForm\" (ngSubmit)=\"onSubmit()\">\n <div class=\"vip-recharge-modal\">\n <form-input\n formControlName=\"amount\"\n label=\"Monto\"\n type=\"number\"\n [min]=\"minAmount\"\n [step]=\"1000\"\n [required]=\"true\"\n placeholder=\"Ingresa el monto a recargar\"\n />\n\n <p class=\"vip-recharge-modal-hint\">\n Monto m\u00EDnimo: {{ minAmount | currency: 'COP' : 'symbol-narrow' : '1.0-0' }}\n </p>\n </div>\n\n <div class=\"vip-recharge-modal-actions\">\n <app-button\n type=\"button\"\n variant=\"tertiary\"\n text=\"Cancelar\"\n size=\"sm\"\n (clicked)=\"onClose()\"\n />\n\n <app-button\n type=\"submit\"\n size=\"sm\"\n variant=\"primary\"\n [text]=\"submitLabel\"\n [loading]=\"loading\"\n [disabled]=\"rechargeForm.invalid\"\n />\n </div>\n </form>\n</app-modal>\n", styles: [".vip-recharge-modal-hint{display:inline-flex;margin-top:1rem;font-size:12px;color:#6b7280}.vip-recharge-modal-actions{display:flex;justify-content:flex-end;gap:12px;margin-top:1rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: AppModalComponent, selector: "app-modal", inputs: ["title", "disableClose", "showHeader", "showCloseButton", "showTitle", "isOpen", "size"], outputs: ["closeModal"] }, { kind: "component", type: FormInputComponent, selector: "form-input", inputs: ["label", "type", "name", "id", "placeholder", "required", "readonly", "maxlength", "minlength", "max", "min", "step", "pattern", "fieldGroupClass", "autocomplete"] }, { kind: "component", type: AppButtonComponent, selector: "app-button", inputs: ["disabled", "loading", "type", "variant", "text", "size", "loadingText", "icon", "tooltip"], outputs: ["clicked"] }, { kind: "pipe", type: i1$1.CurrencyPipe, name: "currency" }], encapsulation: i0.ViewEncapsulation.None });
|
|
9238
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.25", type: VipRechargeModalComponent, isStandalone: true, selector: "vip-recharge-modal", inputs: { title: "title", submitLabel: "submitLabel", loading: "loading", minAmount: "minAmount", isOpen: "isOpen" }, outputs: { closeModal: "closeModal", confirm: "confirm" }, ngImport: i0, template: "<app-modal [isOpen]=\"isOpen\" [title]=\"title\" size=\"md\" (closeModal)=\"onClose()\">\n <form [formGroup]=\"rechargeForm\" (ngSubmit)=\"onSubmit()\">\n <div class=\"vip-recharge-modal\">\n <form-input\n formControlName=\"amount\"\n label=\"Monto\"\n type=\"number\"\n [min]=\"minAmount\"\n [step]=\"1000\"\n [required]=\"true\"\n placeholder=\"Ingresa el monto a recargar\"\n />\n\n <p class=\"vip-recharge-modal-hint\">\n Monto m\u00EDnimo: {{ minAmount | currency: 'COP' : 'symbol-narrow' : '1.0-0' }}\n </p>\n </div>\n\n <div class=\"vip-recharge-modal-actions\">\n <app-button\n type=\"button\"\n variant=\"tertiary\"\n text=\"Cancelar\"\n size=\"sm\"\n (clicked)=\"onClose()\"\n />\n\n <app-button\n type=\"submit\"\n size=\"sm\"\n variant=\"primary\"\n [text]=\"submitLabel\"\n [loading]=\"loading\"\n [disabled]=\"rechargeForm.invalid\"\n />\n </div>\n </form>\n</app-modal>\n", styles: [".vip-recharge-modal-hint{display:inline-flex;margin-top:1rem;font-size:12px;color:#6b7280}.vip-recharge-modal-actions{display:flex;justify-content:flex-end;gap:12px;margin-top:1rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: AppModalComponent, selector: "app-modal", inputs: ["title", "disableClose", "showHeader", "showCloseButton", "showTitle", "interactiveClose", "isOpen", "size"], outputs: ["closeModal"] }, { kind: "component", type: FormInputComponent, selector: "form-input", inputs: ["label", "type", "name", "id", "placeholder", "required", "readonly", "maxlength", "minlength", "max", "min", "step", "pattern", "fieldGroupClass", "autocomplete"] }, { kind: "component", type: AppButtonComponent, selector: "app-button", inputs: ["disabled", "loading", "type", "variant", "text", "size", "loadingText", "icon", "tooltip"], outputs: ["clicked"] }, { kind: "pipe", type: i1$1.CurrencyPipe, name: "currency" }], encapsulation: i0.ViewEncapsulation.None });
|
|
9220
9239
|
}
|
|
9221
9240
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: VipRechargeModalComponent, decorators: [{
|
|
9222
9241
|
type: Component,
|