@cqa-lib/cqa-ui 1.1.388 → 1.1.389
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.
- package/esm2020/lib/add-prerequisite-cases-section/add-prerequisite-cases-section.component.mjs +11 -3
- package/fesm2015/cqa-lib-cqa-ui.mjs +11 -2
- package/fesm2015/cqa-lib-cqa-ui.mjs.map +1 -1
- package/fesm2020/cqa-lib-cqa-ui.mjs +10 -2
- package/fesm2020/cqa-lib-cqa-ui.mjs.map +1 -1
- package/lib/add-prerequisite-cases-section/add-prerequisite-cases-section.component.d.ts +2 -0
- package/package.json +1 -1
|
@@ -5421,6 +5421,14 @@ class AddPrerequisiteCasesSectionComponent {
|
|
|
5421
5421
|
}
|
|
5422
5422
|
this.cdr.markForCheck();
|
|
5423
5423
|
}
|
|
5424
|
+
/** True when the row at the given index has a selected value */
|
|
5425
|
+
rowHasValue(index) {
|
|
5426
|
+
if (!this.form || !this.rows.length || index < 0 || index >= this.rows.length)
|
|
5427
|
+
return false;
|
|
5428
|
+
const row = this.rows[index];
|
|
5429
|
+
const val = this.form.get(row.key)?.value;
|
|
5430
|
+
return val != null && val !== '';
|
|
5431
|
+
}
|
|
5424
5432
|
/** True when every row has a non-empty value (no placeholders) */
|
|
5425
5433
|
allRowsHaveValues() {
|
|
5426
5434
|
if (!this.form || !this.rows.length)
|
|
@@ -5466,10 +5474,10 @@ class AddPrerequisiteCasesSectionComponent {
|
|
|
5466
5474
|
}
|
|
5467
5475
|
}
|
|
5468
5476
|
AddPrerequisiteCasesSectionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: AddPrerequisiteCasesSectionComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
5469
|
-
AddPrerequisiteCasesSectionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: AddPrerequisiteCasesSectionComponent, selector: "cqa-add-prerequisite-cases-section", inputs: { expanded: "expanded", form: "form", rows: "rows", options: "options", getSelectConfig: "getSelectConfig", label: "label", infoTooltip: "infoTooltip", addAnotherText: "addAnotherText", updateText: "updateText", cancelText: "cancelText", addTriggerText: "addTriggerText", hideAddPrerequisite: "hideAddPrerequisite", updateDisabled: "updateDisabled", isUpdating: "isUpdating", enableServerSearch: "enableServerSearch", hasMoreOptions: "hasMoreOptions", isLoadingOptions: "isLoadingOptions", selectFirstValidationMessage: "selectFirstValidationMessage" }, outputs: { expandedChange: "expandedChange", addRow: "addRow", removeRow: "removeRow", rowsReordered: "rowsReordered", update: "update", cancel: "cancel", selectionChange: "selectionChange", searchOptions: "searchOptions", loadMoreOptions: "loadMoreOptions", prerequisitesChange: "prerequisitesChange" }, host: { classAttribute: "cqa-ui-root cqa-add-prerequisite-cases-section-host" }, queries: [{ propertyName: "selectBodyTpl", first: true, predicate: ["selectBody"], descendants: true, read: TemplateRef }], ngImport: i0, template: "<!-- Add Prerequisite trigger - only when collapsed and no rows (user must click to expand); hide when parent has prerequisites -->\n<ng-container *ngIf=\"rows.length === 0 && !expanded && !hideAddPrerequisite\">\n <div\n class=\"cqa-border-2 cqa-border-dashed cqa-border-[#D8D9FC] cqa-rounded-lg cqa-p-1 cqa-mt-4 cqa-bg-white cqa-cursor-pointer cqa-transition-all cqa-duration-200 cqa-ease-in-out cqa-flex cqa-items-center cqa-justify-center cqa-gap-2 cqa-w-full cqa-hover:cqa-border-[#9999ee] cqa-hover:cqa-bg-[#f8f8ff] cqa-active:cqa-border-[#7c7ce0] cqa-active:cqa-bg-[#eff6ff]\"\n (click)=\"onAddPrerequisiteClick()\">\n <mat-icon class=\"cqa-text-[12px] cqa-w-[12px] cqa-h-[12px] cqa-text-[#3F43EE]\">add</mat-icon>\n <span class=\"cqa-font-regular cqa-font-inter cqa-text-sm cqa-text-[#3F43EE]\">{{ addTriggerText }}</span>\n </div>\n</ng-container>\n\n<!-- Collapsed summary when we have rows but expanded=false -->\n<ng-container *ngIf=\"rows.length > 0 && !expanded\">\n <div\n class=\"cqa-border-2 cqa-border-dashed cqa-border-[#D8D9FC] cqa-rounded-lg cqa-p-1.5 cqa-mt-4 cqa-bg-white cqa-cursor-pointer cqa-transition-all cqa-duration-200 cqa-ease-in-out cqa-flex cqa-items-center cqa-justify-between cqa-min-h-[27px] cqa-hover:cqa-border-[#9ca3af] cqa-hover:cqa-bg-[#f9fafb] cqa-active:cqa-border-[#6366f1] cqa-active:cqa-bg-[#eff6ff]\"\n (click)=\"toggleExpanded(true)\">\n <span class=\"cqa-text-[#4a5565] cqa-font-normal cqa-font-inter cqa-text-xs\">{{ rows.length }} prerequisite{{ rows.length !== 1 ? 's' : '' }}</span>\n <mat-icon class=\"cqa-text-[14px] cqa-w-[14px] cqa-h-[14px] cqa-text-[#4a5565]\">expand_more</mat-icon>\n </div>\n</ng-container>\n\n<!-- Expanded form - when expanded=true (with or without rows; no Add Prerequisite trigger) -->\n<ng-container *ngIf=\"expanded\">\n <div class=\"cqa-p-3 cqa-bg-white cqa-border cqa-border-[#e5e7eb] cqa-rounded-lg\">\n <div class=\"cqa-flex cqa-items-center cqa-gap-1.5 cqa-mb-3\">\n <label class=\"cqa-text-sm cqa-font-medium cqa-text-[#374151] cqa-m-0 cqa-leading-none\">{{ label }}</label>\n <mat-icon class=\"cqa-inline-flex cqa-mt-1 cqa-items-center cqa-justify-center cqa-w-4 cqa-h-4 cqa-text-sm cqa-text-[#6b7280] cqa-cursor-help cqa-flex-shrink-0\" [matTooltip]=\"infoTooltip\" matTooltipPosition=\"above\" matTooltipShowDelay=\"300\">info</mat-icon>\n <button\n type=\"button\"\n class=\"cqa-ml-auto cqa-flex cqa-items-center cqa-justify-center cqa-w-7 cqa-h-7 cqa-p-0 cqa-bg-transparent cqa-border-none cqa-rounded-md cqa-text-[#6b7280] cqa-cursor-pointer cqa-hover:cqa-bg-[#f3f4f6] cqa-hover:cqa-text-[#374151]\"\n (click)=\"toggleExpanded(false)\"\n matTooltip=\"Close\">\n <mat-icon class=\"cqa-text-xl cqa-w-5 cqa-h-5\">expand_less</mat-icon>\n </button>\n </div>\n\n <div\n class=\"prerequisite-drop-list cqa-flex cqa-flex-col cqa-gap-2 cqa-mb-3\"\n [dndDropzone]=\"['prerequisite-row']\"\n dndEffectAllowed=\"move\"\n dndDragoverClass=\"dndDragover\"\n (dndDrop)=\"onDndDrop($event)\">\n <div dndPlaceholderRef class=\"prerequisite-drag-placeholder\">Drop here</div>\n <div\n *ngFor=\"let row of rows; let i = index; trackBy: trackByKey\"\n class=\"prerequisite-drag-item cqa-flex cqa-items-center cqa-gap-2\"\n [dndDraggable]=\"row\"\n [dndDisableIf]=\"rows.length <= 1\"\n dndEffectAllowed=\"move\"\n dndType=\"prerequisite-row\">\n <!-- 9-dot grid drag handle (only when multiple rows to reorder) -->\n <div *ngIf=\"rows.length > 1\" dndHandle class=\"cqa-flex cqa-flex-shrink-0 cqa-items-center cqa-justify-center cqa-cursor-grab cqa-text-[#6B7280] cqa-hover:cqa-text-[#111827] active:cqa-cursor-grabbing\" matTooltip=\"Drag to reorder\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <circle cx=\"3\" cy=\"3\" r=\"1.5\" fill=\"currentColor\"/>\n <circle cx=\"8\" cy=\"3\" r=\"1.5\" fill=\"currentColor\"/>\n <circle cx=\"13\" cy=\"3\" r=\"1.5\" fill=\"currentColor\"/>\n <circle cx=\"3\" cy=\"8\" r=\"1.5\" fill=\"currentColor\"/>\n <circle cx=\"8\" cy=\"8\" r=\"1.5\" fill=\"currentColor\"/>\n <circle cx=\"13\" cy=\"8\" r=\"1.5\" fill=\"currentColor\"/>\n <circle cx=\"3\" cy=\"13\" r=\"1.5\" fill=\"currentColor\"/>\n <circle cx=\"8\" cy=\"13\" r=\"1.5\" fill=\"currentColor\"/>\n <circle cx=\"13\" cy=\"13\" r=\"1.5\" fill=\"currentColor\"/>\n </svg>\n </div>\n\n <div class=\"cqa-flex-1 cqa-min-w-0\">\n <!-- Custom template (e.g. parent-provided cqa-dynamic-select) -->\n <ng-container *ngIf=\"selectBodyTpl\">\n <ng-container\n *ngTemplateOutlet=\"selectBodyTpl; context: {\n $implicit: row,\n index: i,\n form: form,\n config: getConfig(i)\n }\">\n </ng-container>\n </ng-container>\n <!-- Default: built-in cqa-dynamic-select -->\n <cqa-dynamic-select\n *ngIf=\"!selectBodyTpl && form\"\n [form]=\"form\"\n [config]=\"getConfig(i)\"\n (selectionChange)=\"onSelectionChange($event, i)\">\n </cqa-dynamic-select>\n </div>\n\n <button\n type=\"button\"\n class=\"cqa-flex cqa-items-center cqa-justify-center cqa-w-8 cqa-h-8 cqa-min-w-[32px] cqa-bg-transparent cqa-border-none cqa-rounded-md cqa-text-[#6b7280] cqa-cursor-pointer cqa-p-0 cqa-hover:cqa-bg-[#f3f4f6] cqa-hover:cqa-text-[#374151]\"\n (click)=\"onRemoveRow(i)\"\n matTooltip=\"Cancel\">\n <mat-icon class=\"cqa-text-lg cqa-w-[18px] cqa-h-[18px]\">close</mat-icon>\n </button>\n </div>\n </div>\n\n <div *ngIf=\"showAddAnotherValidation && !allRowsHaveValues()\" class=\"cqa-text-xs cqa-text-[#dc2626] cqa-mb-2\">\n {{ selectFirstValidationMessage }}\n </div>\n <!-- Add Prerequisite button only in empty state; hide when parent has prerequisites (e.g. collapsing after update) -->\n <div\n *ngIf=\"rows.length === 0 && !hideAddPrerequisite\"\n class=\"cqa-border-2 cqa-border-dashed cqa-border-[#ccccff] cqa-rounded-lg cqa-p-3 cqa-mb-3 cqa-bg-white cqa-cursor-pointer cqa-transition-all cqa-duration-200 cqa-ease-in-out cqa-flex cqa-items-center cqa-justify-center cqa-gap-2 cqa-min-h-[40px] cqa-w-full cqa-hover:cqa-border-[#9999ee] cqa-hover:cqa-bg-[#f8f8ff] cqa-active:cqa-border-[#7c7ce0] cqa-active:cqa-bg-[#eff6ff]\"\n (click)=\"onAddRow()\">\n <mat-icon class=\"cqa-text-[18px] cqa-w-[18px] cqa-h-[18px] cqa-text-[#3b82f6]\">add</mat-icon>\n <span class=\"cqa-font-medium cqa-font-inter cqa-text-sm cqa-text-[#3b82f6]\">{{ addTriggerText }}</span>\n </div>\n <!-- Add Another link when we already have at least one row -->\n <button\n *ngIf=\"rows.length > 0 && !hideAddPrerequisite\"\n type=\"button\"\n class=\"cqa-mb-3 cqa-flex cqa-items-center cqa-gap-2 cqa-bg-transparent cqa-border-none cqa-p-0 cqa-cursor-pointer cqa-font-inter cqa-text-sm cqa-text-[#4242DB] cqa-hover:cqa-underline\"\n (click)=\"onAddRow()\">\n <mat-icon class=\"cqa-text-[18px] cqa-w-[18px] cqa-h-[18px]\">add</mat-icon>\n <span>{{ addAnotherText }}</span>\n </button>\n <div class=\"cqa-flex cqa-gap-3 cqa-justify-end\">\n <button\n type=\"button\"\n class=\"cqa-py-2.5 cqa-px-4 cqa-bg-white cqa-text-[#374151] cqa-border cqa-border-[#d1d5db] cqa-rounded-md cqa-text-sm cqa-font-semibold cqa-cursor-pointer cqa-hover:cqa-bg-[#f9fafb]\"\n (click)=\"onCancel()\">\n {{ cancelText }}\n </button>\n <button\n type=\"button\"\n class=\"cqa-py-2.5 cqa-px-4 cqa-rounded-md cqa-text-sm cqa-font-semibold cqa-border-none cqa-cursor-pointer disabled:cqa-opacity-50 disabled:cqa-cursor-not-allowed cqa-bg-[#1a56db] cqa-text-white cqa-hover:cqa-bg-[#1647b8] disabled:cqa-bg-[#1a56db] cqa-flex cqa-items-center cqa-justify-center cqa-gap-2\"\n [style.pointer-events]=\"isUpdating ? 'none' : 'auto'\"\n [style.cursor]=\"isUpdating ? 'not-allowed' : 'pointer'\"\n [disabled]=\"isUpdateDisabled()\"\n (click)=\"onUpdate()\">\n <mat-spinner *ngIf=\"isUpdating\" diameter=\"16\" class=\"cqa-inline-block update-spinner-white\"></mat-spinner>\n <span>{{ updateText }}</span>\n </button>\n </div>\n </div>\n</ng-container>\n", components: [{ type: i1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: DynamicSelectFieldComponent, selector: "cqa-dynamic-select", inputs: ["form", "config"], outputs: ["selectionChange", "selectClick", "searchChange", "loadMore", "addCustomValue"] }, { type: i4$1.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "diameter", "strokeWidth", "mode", "value"], exportAs: ["matProgressSpinner"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { type: i6$1.DndDropzoneDirective, selector: "[dndDropzone]", inputs: ["dndDropzone", "dndEffectAllowed", "dndAllowExternal", "dndHorizontal", "dndDragoverClass", "dndDropzoneDisabledClass", "dndDisableIf", "dndDisableDropIf"], outputs: ["dndDragover", "dndDrop"] }, { type: i6$1.DndPlaceholderRefDirective, selector: "[dndPlaceholderRef]" }, { type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i6$1.DndDraggableDirective, selector: "[dndDraggable]", inputs: ["dndDraggable", "dndEffectAllowed", "dndType", "dndDraggingClass", "dndDraggingSourceClass", "dndDraggableDisabledClass", "dndDragImageOffsetFunction", "dndDisableIf", "dndDisableDragIf"], outputs: ["dndStart", "dndDrag", "dndEnd", "dndMoved", "dndCopied", "dndLinked", "dndCanceled"] }, { type: i6$1.DndHandleDirective, selector: "[dndHandle]" }, { type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
5477
|
+
AddPrerequisiteCasesSectionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: AddPrerequisiteCasesSectionComponent, selector: "cqa-add-prerequisite-cases-section", inputs: { expanded: "expanded", form: "form", rows: "rows", options: "options", getSelectConfig: "getSelectConfig", label: "label", infoTooltip: "infoTooltip", addAnotherText: "addAnotherText", updateText: "updateText", cancelText: "cancelText", addTriggerText: "addTriggerText", hideAddPrerequisite: "hideAddPrerequisite", updateDisabled: "updateDisabled", isUpdating: "isUpdating", enableServerSearch: "enableServerSearch", hasMoreOptions: "hasMoreOptions", isLoadingOptions: "isLoadingOptions", selectFirstValidationMessage: "selectFirstValidationMessage" }, outputs: { expandedChange: "expandedChange", addRow: "addRow", removeRow: "removeRow", rowsReordered: "rowsReordered", update: "update", cancel: "cancel", selectionChange: "selectionChange", searchOptions: "searchOptions", loadMoreOptions: "loadMoreOptions", prerequisitesChange: "prerequisitesChange" }, host: { classAttribute: "cqa-ui-root cqa-add-prerequisite-cases-section-host" }, queries: [{ propertyName: "selectBodyTpl", first: true, predicate: ["selectBody"], descendants: true, read: TemplateRef }], ngImport: i0, template: "<!-- Add Prerequisite trigger - only when collapsed and no rows (user must click to expand); hide when parent has prerequisites -->\n<ng-container *ngIf=\"rows.length === 0 && !expanded && !hideAddPrerequisite\">\n <div\n class=\"cqa-border-2 cqa-border-dashed cqa-border-[#D8D9FC] cqa-rounded-lg cqa-p-1 cqa-mt-4 cqa-bg-white cqa-cursor-pointer cqa-transition-all cqa-duration-200 cqa-ease-in-out cqa-flex cqa-items-center cqa-justify-center cqa-gap-2 cqa-w-full cqa-hover:cqa-border-[#9999ee] cqa-hover:cqa-bg-[#f8f8ff] cqa-active:cqa-border-[#7c7ce0] cqa-active:cqa-bg-[#eff6ff]\"\n (click)=\"onAddPrerequisiteClick()\">\n <mat-icon class=\"cqa-text-[12px] cqa-w-[12px] cqa-h-[12px] cqa-text-[#3F43EE]\">add</mat-icon>\n <span class=\"cqa-font-regular cqa-font-inter cqa-text-sm cqa-text-[#3F43EE]\">{{ addTriggerText }}</span>\n </div>\n</ng-container>\n\n<!-- Collapsed summary when we have rows but expanded=false -->\n<ng-container *ngIf=\"rows.length > 0 && !expanded\">\n <div\n class=\"cqa-border-2 cqa-border-dashed cqa-border-[#D8D9FC] cqa-rounded-lg cqa-p-1.5 cqa-mt-4 cqa-bg-white cqa-cursor-pointer cqa-transition-all cqa-duration-200 cqa-ease-in-out cqa-flex cqa-items-center cqa-justify-between cqa-min-h-[27px] cqa-hover:cqa-border-[#9ca3af] cqa-hover:cqa-bg-[#f9fafb] cqa-active:cqa-border-[#6366f1] cqa-active:cqa-bg-[#eff6ff]\"\n (click)=\"toggleExpanded(true)\">\n <span class=\"cqa-text-[#4a5565] cqa-font-normal cqa-font-inter cqa-text-xs\">{{ rows.length }} prerequisite{{ rows.length !== 1 ? 's' : '' }}</span>\n <mat-icon class=\"cqa-text-[14px] cqa-w-[14px] cqa-h-[14px] cqa-text-[#4a5565]\">expand_more</mat-icon>\n </div>\n</ng-container>\n\n<!-- Expanded form - when expanded=true (with or without rows; no Add Prerequisite trigger) -->\n<ng-container *ngIf=\"expanded\">\n <div class=\"cqa-p-3 cqa-bg-white cqa-border cqa-border-[#e5e7eb] cqa-rounded-lg\">\n <div class=\"cqa-flex cqa-items-center cqa-gap-1.5 cqa-mb-3\">\n <label class=\"cqa-text-sm cqa-font-medium cqa-text-[#374151] cqa-m-0 cqa-leading-none\">{{ label }}</label>\n <mat-icon class=\"cqa-inline-flex cqa-mt-1 cqa-items-center cqa-justify-center cqa-w-4 cqa-h-4 cqa-text-sm cqa-text-[#6b7280] cqa-cursor-help cqa-flex-shrink-0\" [matTooltip]=\"infoTooltip\" matTooltipPosition=\"above\" matTooltipShowDelay=\"300\">info</mat-icon>\n <button\n type=\"button\"\n class=\"cqa-ml-auto cqa-flex cqa-items-center cqa-justify-center cqa-w-7 cqa-h-7 cqa-p-0 cqa-bg-transparent cqa-border-none cqa-rounded-md cqa-text-[#6b7280] cqa-cursor-pointer cqa-hover:cqa-bg-[#f3f4f6] cqa-hover:cqa-text-[#374151]\"\n (click)=\"toggleExpanded(false)\"\n matTooltip=\"Close\">\n <mat-icon class=\"cqa-text-xl cqa-w-5 cqa-h-5\">expand_less</mat-icon>\n </button>\n </div>\n\n <div\n class=\"prerequisite-drop-list cqa-flex cqa-flex-col cqa-gap-2 cqa-mb-3\"\n [dndDropzone]=\"['prerequisite-row']\"\n dndEffectAllowed=\"move\"\n dndDragoverClass=\"dndDragover\"\n (dndDrop)=\"onDndDrop($event)\">\n <div dndPlaceholderRef class=\"prerequisite-drag-placeholder\">Drop here</div>\n <div\n *ngFor=\"let row of rows; let i = index; trackBy: trackByKey\"\n class=\"prerequisite-drag-item cqa-flex cqa-items-center cqa-gap-2\"\n [dndDraggable]=\"row\"\n [dndDisableIf]=\"rows.length <= 1\"\n dndEffectAllowed=\"move\"\n dndType=\"prerequisite-row\">\n <!-- 9-dot grid drag handle (only when multiple rows to reorder) -->\n <div *ngIf=\"rows.length > 1\" dndHandle class=\"cqa-flex cqa-flex-shrink-0 cqa-items-center cqa-justify-center cqa-cursor-grab cqa-text-[#6B7280] cqa-hover:cqa-text-[#111827] active:cqa-cursor-grabbing\" matTooltip=\"Drag to reorder\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <circle cx=\"3\" cy=\"3\" r=\"1.5\" fill=\"currentColor\"/>\n <circle cx=\"8\" cy=\"3\" r=\"1.5\" fill=\"currentColor\"/>\n <circle cx=\"13\" cy=\"3\" r=\"1.5\" fill=\"currentColor\"/>\n <circle cx=\"3\" cy=\"8\" r=\"1.5\" fill=\"currentColor\"/>\n <circle cx=\"8\" cy=\"8\" r=\"1.5\" fill=\"currentColor\"/>\n <circle cx=\"13\" cy=\"8\" r=\"1.5\" fill=\"currentColor\"/>\n <circle cx=\"3\" cy=\"13\" r=\"1.5\" fill=\"currentColor\"/>\n <circle cx=\"8\" cy=\"13\" r=\"1.5\" fill=\"currentColor\"/>\n <circle cx=\"13\" cy=\"13\" r=\"1.5\" fill=\"currentColor\"/>\n </svg>\n </div>\n\n <div class=\"cqa-flex-1 cqa-min-w-0\">\n <!-- Custom template (e.g. parent-provided cqa-dynamic-select) -->\n <ng-container *ngIf=\"selectBodyTpl\">\n <ng-container\n *ngTemplateOutlet=\"selectBodyTpl; context: {\n $implicit: row,\n index: i,\n form: form,\n config: getConfig(i)\n }\">\n </ng-container>\n </ng-container>\n <!-- Default: built-in cqa-dynamic-select -->\n <cqa-dynamic-select\n *ngIf=\"!selectBodyTpl && form\"\n [form]=\"form\"\n [config]=\"getConfig(i)\"\n (selectionChange)=\"onSelectionChange($event, i)\">\n </cqa-dynamic-select>\n </div>\n\n <button\n *ngIf=\"rowHasValue(i)\"\n type=\"button\"\n class=\"cqa-flex cqa-items-center cqa-justify-center cqa-w-8 cqa-h-8 cqa-min-w-[32px] cqa-bg-transparent cqa-border-none cqa-rounded-md cqa-text-[#6b7280] cqa-cursor-pointer cqa-p-0 cqa-hover:cqa-bg-[#f3f4f6] cqa-hover:cqa-text-[#374151]\"\n (click)=\"onRemoveRow(i)\"\n matTooltip=\"Remove Prerequisite\">\n <mat-icon class=\"cqa-text-lg cqa-w-[18px] cqa-h-[18px]\">close</mat-icon>\n </button>\n </div>\n </div>\n\n <div *ngIf=\"showAddAnotherValidation && !allRowsHaveValues()\" class=\"cqa-text-xs cqa-text-[#dc2626] cqa-mb-2\">\n {{ selectFirstValidationMessage }}\n </div>\n <!-- Add Prerequisite button only in empty state; hide when parent has prerequisites (e.g. collapsing after update) -->\n <div\n *ngIf=\"rows.length === 0 && !hideAddPrerequisite\"\n class=\"cqa-border-2 cqa-border-dashed cqa-border-[#ccccff] cqa-rounded-lg cqa-p-3 cqa-mb-3 cqa-bg-white cqa-cursor-pointer cqa-transition-all cqa-duration-200 cqa-ease-in-out cqa-flex cqa-items-center cqa-justify-center cqa-gap-2 cqa-min-h-[40px] cqa-w-full cqa-hover:cqa-border-[#9999ee] cqa-hover:cqa-bg-[#f8f8ff] cqa-active:cqa-border-[#7c7ce0] cqa-active:cqa-bg-[#eff6ff]\"\n (click)=\"onAddRow()\">\n <mat-icon class=\"cqa-text-[18px] cqa-w-[18px] cqa-h-[18px] cqa-text-[#3b82f6]\">add</mat-icon>\n <span class=\"cqa-font-medium cqa-font-inter cqa-text-sm cqa-text-[#3b82f6]\">{{ addTriggerText }}</span>\n </div>\n <!-- Add Another link when we already have at least one row -->\n <button\n *ngIf=\"rows.length > 0 && !hideAddPrerequisite\"\n type=\"button\"\n class=\"cqa-mb-3 cqa-flex cqa-items-center cqa-gap-2 cqa-bg-transparent cqa-border-none cqa-p-0 cqa-cursor-pointer cqa-font-inter cqa-text-sm cqa-text-[#4242DB] cqa-hover:cqa-underline\"\n (click)=\"onAddRow()\">\n <mat-icon class=\"cqa-text-[18px] cqa-w-[18px] cqa-h-[18px]\">add</mat-icon>\n <span>{{ addAnotherText }}</span>\n </button>\n <div class=\"cqa-flex cqa-gap-3 cqa-justify-end\">\n <button\n type=\"button\"\n class=\"cqa-py-2.5 cqa-px-4 cqa-bg-white cqa-text-[#374151] cqa-border cqa-border-[#d1d5db] cqa-rounded-md cqa-text-sm cqa-font-semibold cqa-cursor-pointer cqa-hover:cqa-bg-[#f9fafb]\"\n (click)=\"onCancel()\">\n {{ cancelText }}\n </button>\n <button\n type=\"button\"\n class=\"cqa-py-2.5 cqa-px-4 cqa-rounded-md cqa-text-sm cqa-font-semibold cqa-border-none cqa-cursor-pointer disabled:cqa-opacity-50 disabled:cqa-cursor-not-allowed cqa-bg-[#1a56db] cqa-text-white cqa-hover:cqa-bg-[#1647b8] disabled:cqa-bg-[#1a56db] cqa-flex cqa-items-center cqa-justify-center cqa-gap-2\"\n [style.pointer-events]=\"isUpdating ? 'none' : 'auto'\"\n [style.cursor]=\"isUpdating ? 'not-allowed' : 'pointer'\"\n [disabled]=\"isUpdateDisabled()\"\n (click)=\"onUpdate()\">\n <mat-spinner *ngIf=\"isUpdating\" diameter=\"16\" class=\"cqa-inline-block update-spinner-white\"></mat-spinner>\n <span>{{ updateText }}</span>\n </button>\n </div>\n </div>\n</ng-container>\n", components: [{ type: i1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: DynamicSelectFieldComponent, selector: "cqa-dynamic-select", inputs: ["form", "config"], outputs: ["selectionChange", "selectClick", "searchChange", "loadMore", "addCustomValue"] }, { type: i4$1.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "diameter", "strokeWidth", "mode", "value"], exportAs: ["matProgressSpinner"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { type: i6$1.DndDropzoneDirective, selector: "[dndDropzone]", inputs: ["dndDropzone", "dndEffectAllowed", "dndAllowExternal", "dndHorizontal", "dndDragoverClass", "dndDropzoneDisabledClass", "dndDisableIf", "dndDisableDropIf"], outputs: ["dndDragover", "dndDrop"] }, { type: i6$1.DndPlaceholderRefDirective, selector: "[dndPlaceholderRef]" }, { type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i6$1.DndDraggableDirective, selector: "[dndDraggable]", inputs: ["dndDraggable", "dndEffectAllowed", "dndType", "dndDraggingClass", "dndDraggingSourceClass", "dndDraggableDisabledClass", "dndDragImageOffsetFunction", "dndDisableIf", "dndDisableDragIf"], outputs: ["dndStart", "dndDrag", "dndEnd", "dndMoved", "dndCopied", "dndLinked", "dndCanceled"] }, { type: i6$1.DndHandleDirective, selector: "[dndHandle]" }, { type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
5470
5478
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: AddPrerequisiteCasesSectionComponent, decorators: [{
|
|
5471
5479
|
type: Component,
|
|
5472
|
-
args: [{ selector: 'cqa-add-prerequisite-cases-section', changeDetection: ChangeDetectionStrategy.OnPush, host: { class: 'cqa-ui-root cqa-add-prerequisite-cases-section-host' }, template: "<!-- Add Prerequisite trigger - only when collapsed and no rows (user must click to expand); hide when parent has prerequisites -->\n<ng-container *ngIf=\"rows.length === 0 && !expanded && !hideAddPrerequisite\">\n <div\n class=\"cqa-border-2 cqa-border-dashed cqa-border-[#D8D9FC] cqa-rounded-lg cqa-p-1 cqa-mt-4 cqa-bg-white cqa-cursor-pointer cqa-transition-all cqa-duration-200 cqa-ease-in-out cqa-flex cqa-items-center cqa-justify-center cqa-gap-2 cqa-w-full cqa-hover:cqa-border-[#9999ee] cqa-hover:cqa-bg-[#f8f8ff] cqa-active:cqa-border-[#7c7ce0] cqa-active:cqa-bg-[#eff6ff]\"\n (click)=\"onAddPrerequisiteClick()\">\n <mat-icon class=\"cqa-text-[12px] cqa-w-[12px] cqa-h-[12px] cqa-text-[#3F43EE]\">add</mat-icon>\n <span class=\"cqa-font-regular cqa-font-inter cqa-text-sm cqa-text-[#3F43EE]\">{{ addTriggerText }}</span>\n </div>\n</ng-container>\n\n<!-- Collapsed summary when we have rows but expanded=false -->\n<ng-container *ngIf=\"rows.length > 0 && !expanded\">\n <div\n class=\"cqa-border-2 cqa-border-dashed cqa-border-[#D8D9FC] cqa-rounded-lg cqa-p-1.5 cqa-mt-4 cqa-bg-white cqa-cursor-pointer cqa-transition-all cqa-duration-200 cqa-ease-in-out cqa-flex cqa-items-center cqa-justify-between cqa-min-h-[27px] cqa-hover:cqa-border-[#9ca3af] cqa-hover:cqa-bg-[#f9fafb] cqa-active:cqa-border-[#6366f1] cqa-active:cqa-bg-[#eff6ff]\"\n (click)=\"toggleExpanded(true)\">\n <span class=\"cqa-text-[#4a5565] cqa-font-normal cqa-font-inter cqa-text-xs\">{{ rows.length }} prerequisite{{ rows.length !== 1 ? 's' : '' }}</span>\n <mat-icon class=\"cqa-text-[14px] cqa-w-[14px] cqa-h-[14px] cqa-text-[#4a5565]\">expand_more</mat-icon>\n </div>\n</ng-container>\n\n<!-- Expanded form - when expanded=true (with or without rows; no Add Prerequisite trigger) -->\n<ng-container *ngIf=\"expanded\">\n <div class=\"cqa-p-3 cqa-bg-white cqa-border cqa-border-[#e5e7eb] cqa-rounded-lg\">\n <div class=\"cqa-flex cqa-items-center cqa-gap-1.5 cqa-mb-3\">\n <label class=\"cqa-text-sm cqa-font-medium cqa-text-[#374151] cqa-m-0 cqa-leading-none\">{{ label }}</label>\n <mat-icon class=\"cqa-inline-flex cqa-mt-1 cqa-items-center cqa-justify-center cqa-w-4 cqa-h-4 cqa-text-sm cqa-text-[#6b7280] cqa-cursor-help cqa-flex-shrink-0\" [matTooltip]=\"infoTooltip\" matTooltipPosition=\"above\" matTooltipShowDelay=\"300\">info</mat-icon>\n <button\n type=\"button\"\n class=\"cqa-ml-auto cqa-flex cqa-items-center cqa-justify-center cqa-w-7 cqa-h-7 cqa-p-0 cqa-bg-transparent cqa-border-none cqa-rounded-md cqa-text-[#6b7280] cqa-cursor-pointer cqa-hover:cqa-bg-[#f3f4f6] cqa-hover:cqa-text-[#374151]\"\n (click)=\"toggleExpanded(false)\"\n matTooltip=\"Close\">\n <mat-icon class=\"cqa-text-xl cqa-w-5 cqa-h-5\">expand_less</mat-icon>\n </button>\n </div>\n\n <div\n class=\"prerequisite-drop-list cqa-flex cqa-flex-col cqa-gap-2 cqa-mb-3\"\n [dndDropzone]=\"['prerequisite-row']\"\n dndEffectAllowed=\"move\"\n dndDragoverClass=\"dndDragover\"\n (dndDrop)=\"onDndDrop($event)\">\n <div dndPlaceholderRef class=\"prerequisite-drag-placeholder\">Drop here</div>\n <div\n *ngFor=\"let row of rows; let i = index; trackBy: trackByKey\"\n class=\"prerequisite-drag-item cqa-flex cqa-items-center cqa-gap-2\"\n [dndDraggable]=\"row\"\n [dndDisableIf]=\"rows.length <= 1\"\n dndEffectAllowed=\"move\"\n dndType=\"prerequisite-row\">\n <!-- 9-dot grid drag handle (only when multiple rows to reorder) -->\n <div *ngIf=\"rows.length > 1\" dndHandle class=\"cqa-flex cqa-flex-shrink-0 cqa-items-center cqa-justify-center cqa-cursor-grab cqa-text-[#6B7280] cqa-hover:cqa-text-[#111827] active:cqa-cursor-grabbing\" matTooltip=\"Drag to reorder\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <circle cx=\"3\" cy=\"3\" r=\"1.5\" fill=\"currentColor\"/>\n <circle cx=\"8\" cy=\"3\" r=\"1.5\" fill=\"currentColor\"/>\n <circle cx=\"13\" cy=\"3\" r=\"1.5\" fill=\"currentColor\"/>\n <circle cx=\"3\" cy=\"8\" r=\"1.5\" fill=\"currentColor\"/>\n <circle cx=\"8\" cy=\"8\" r=\"1.5\" fill=\"currentColor\"/>\n <circle cx=\"13\" cy=\"8\" r=\"1.5\" fill=\"currentColor\"/>\n <circle cx=\"3\" cy=\"13\" r=\"1.5\" fill=\"currentColor\"/>\n <circle cx=\"8\" cy=\"13\" r=\"1.5\" fill=\"currentColor\"/>\n <circle cx=\"13\" cy=\"13\" r=\"1.5\" fill=\"currentColor\"/>\n </svg>\n </div>\n\n <div class=\"cqa-flex-1 cqa-min-w-0\">\n <!-- Custom template (e.g. parent-provided cqa-dynamic-select) -->\n <ng-container *ngIf=\"selectBodyTpl\">\n <ng-container\n *ngTemplateOutlet=\"selectBodyTpl; context: {\n $implicit: row,\n index: i,\n form: form,\n config: getConfig(i)\n }\">\n </ng-container>\n </ng-container>\n <!-- Default: built-in cqa-dynamic-select -->\n <cqa-dynamic-select\n *ngIf=\"!selectBodyTpl && form\"\n [form]=\"form\"\n [config]=\"getConfig(i)\"\n (selectionChange)=\"onSelectionChange($event, i)\">\n </cqa-dynamic-select>\n </div>\n\n <button\n type=\"button\"\n class=\"cqa-flex cqa-items-center cqa-justify-center cqa-w-8 cqa-h-8 cqa-min-w-[32px] cqa-bg-transparent cqa-border-none cqa-rounded-md cqa-text-[#6b7280] cqa-cursor-pointer cqa-p-0 cqa-hover:cqa-bg-[#f3f4f6] cqa-hover:cqa-text-[#374151]\"\n (click)=\"onRemoveRow(i)\"\n matTooltip=\"
|
|
5480
|
+
args: [{ selector: 'cqa-add-prerequisite-cases-section', changeDetection: ChangeDetectionStrategy.OnPush, host: { class: 'cqa-ui-root cqa-add-prerequisite-cases-section-host' }, template: "<!-- Add Prerequisite trigger - only when collapsed and no rows (user must click to expand); hide when parent has prerequisites -->\n<ng-container *ngIf=\"rows.length === 0 && !expanded && !hideAddPrerequisite\">\n <div\n class=\"cqa-border-2 cqa-border-dashed cqa-border-[#D8D9FC] cqa-rounded-lg cqa-p-1 cqa-mt-4 cqa-bg-white cqa-cursor-pointer cqa-transition-all cqa-duration-200 cqa-ease-in-out cqa-flex cqa-items-center cqa-justify-center cqa-gap-2 cqa-w-full cqa-hover:cqa-border-[#9999ee] cqa-hover:cqa-bg-[#f8f8ff] cqa-active:cqa-border-[#7c7ce0] cqa-active:cqa-bg-[#eff6ff]\"\n (click)=\"onAddPrerequisiteClick()\">\n <mat-icon class=\"cqa-text-[12px] cqa-w-[12px] cqa-h-[12px] cqa-text-[#3F43EE]\">add</mat-icon>\n <span class=\"cqa-font-regular cqa-font-inter cqa-text-sm cqa-text-[#3F43EE]\">{{ addTriggerText }}</span>\n </div>\n</ng-container>\n\n<!-- Collapsed summary when we have rows but expanded=false -->\n<ng-container *ngIf=\"rows.length > 0 && !expanded\">\n <div\n class=\"cqa-border-2 cqa-border-dashed cqa-border-[#D8D9FC] cqa-rounded-lg cqa-p-1.5 cqa-mt-4 cqa-bg-white cqa-cursor-pointer cqa-transition-all cqa-duration-200 cqa-ease-in-out cqa-flex cqa-items-center cqa-justify-between cqa-min-h-[27px] cqa-hover:cqa-border-[#9ca3af] cqa-hover:cqa-bg-[#f9fafb] cqa-active:cqa-border-[#6366f1] cqa-active:cqa-bg-[#eff6ff]\"\n (click)=\"toggleExpanded(true)\">\n <span class=\"cqa-text-[#4a5565] cqa-font-normal cqa-font-inter cqa-text-xs\">{{ rows.length }} prerequisite{{ rows.length !== 1 ? 's' : '' }}</span>\n <mat-icon class=\"cqa-text-[14px] cqa-w-[14px] cqa-h-[14px] cqa-text-[#4a5565]\">expand_more</mat-icon>\n </div>\n</ng-container>\n\n<!-- Expanded form - when expanded=true (with or without rows; no Add Prerequisite trigger) -->\n<ng-container *ngIf=\"expanded\">\n <div class=\"cqa-p-3 cqa-bg-white cqa-border cqa-border-[#e5e7eb] cqa-rounded-lg\">\n <div class=\"cqa-flex cqa-items-center cqa-gap-1.5 cqa-mb-3\">\n <label class=\"cqa-text-sm cqa-font-medium cqa-text-[#374151] cqa-m-0 cqa-leading-none\">{{ label }}</label>\n <mat-icon class=\"cqa-inline-flex cqa-mt-1 cqa-items-center cqa-justify-center cqa-w-4 cqa-h-4 cqa-text-sm cqa-text-[#6b7280] cqa-cursor-help cqa-flex-shrink-0\" [matTooltip]=\"infoTooltip\" matTooltipPosition=\"above\" matTooltipShowDelay=\"300\">info</mat-icon>\n <button\n type=\"button\"\n class=\"cqa-ml-auto cqa-flex cqa-items-center cqa-justify-center cqa-w-7 cqa-h-7 cqa-p-0 cqa-bg-transparent cqa-border-none cqa-rounded-md cqa-text-[#6b7280] cqa-cursor-pointer cqa-hover:cqa-bg-[#f3f4f6] cqa-hover:cqa-text-[#374151]\"\n (click)=\"toggleExpanded(false)\"\n matTooltip=\"Close\">\n <mat-icon class=\"cqa-text-xl cqa-w-5 cqa-h-5\">expand_less</mat-icon>\n </button>\n </div>\n\n <div\n class=\"prerequisite-drop-list cqa-flex cqa-flex-col cqa-gap-2 cqa-mb-3\"\n [dndDropzone]=\"['prerequisite-row']\"\n dndEffectAllowed=\"move\"\n dndDragoverClass=\"dndDragover\"\n (dndDrop)=\"onDndDrop($event)\">\n <div dndPlaceholderRef class=\"prerequisite-drag-placeholder\">Drop here</div>\n <div\n *ngFor=\"let row of rows; let i = index; trackBy: trackByKey\"\n class=\"prerequisite-drag-item cqa-flex cqa-items-center cqa-gap-2\"\n [dndDraggable]=\"row\"\n [dndDisableIf]=\"rows.length <= 1\"\n dndEffectAllowed=\"move\"\n dndType=\"prerequisite-row\">\n <!-- 9-dot grid drag handle (only when multiple rows to reorder) -->\n <div *ngIf=\"rows.length > 1\" dndHandle class=\"cqa-flex cqa-flex-shrink-0 cqa-items-center cqa-justify-center cqa-cursor-grab cqa-text-[#6B7280] cqa-hover:cqa-text-[#111827] active:cqa-cursor-grabbing\" matTooltip=\"Drag to reorder\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <circle cx=\"3\" cy=\"3\" r=\"1.5\" fill=\"currentColor\"/>\n <circle cx=\"8\" cy=\"3\" r=\"1.5\" fill=\"currentColor\"/>\n <circle cx=\"13\" cy=\"3\" r=\"1.5\" fill=\"currentColor\"/>\n <circle cx=\"3\" cy=\"8\" r=\"1.5\" fill=\"currentColor\"/>\n <circle cx=\"8\" cy=\"8\" r=\"1.5\" fill=\"currentColor\"/>\n <circle cx=\"13\" cy=\"8\" r=\"1.5\" fill=\"currentColor\"/>\n <circle cx=\"3\" cy=\"13\" r=\"1.5\" fill=\"currentColor\"/>\n <circle cx=\"8\" cy=\"13\" r=\"1.5\" fill=\"currentColor\"/>\n <circle cx=\"13\" cy=\"13\" r=\"1.5\" fill=\"currentColor\"/>\n </svg>\n </div>\n\n <div class=\"cqa-flex-1 cqa-min-w-0\">\n <!-- Custom template (e.g. parent-provided cqa-dynamic-select) -->\n <ng-container *ngIf=\"selectBodyTpl\">\n <ng-container\n *ngTemplateOutlet=\"selectBodyTpl; context: {\n $implicit: row,\n index: i,\n form: form,\n config: getConfig(i)\n }\">\n </ng-container>\n </ng-container>\n <!-- Default: built-in cqa-dynamic-select -->\n <cqa-dynamic-select\n *ngIf=\"!selectBodyTpl && form\"\n [form]=\"form\"\n [config]=\"getConfig(i)\"\n (selectionChange)=\"onSelectionChange($event, i)\">\n </cqa-dynamic-select>\n </div>\n\n <button\n *ngIf=\"rowHasValue(i)\"\n type=\"button\"\n class=\"cqa-flex cqa-items-center cqa-justify-center cqa-w-8 cqa-h-8 cqa-min-w-[32px] cqa-bg-transparent cqa-border-none cqa-rounded-md cqa-text-[#6b7280] cqa-cursor-pointer cqa-p-0 cqa-hover:cqa-bg-[#f3f4f6] cqa-hover:cqa-text-[#374151]\"\n (click)=\"onRemoveRow(i)\"\n matTooltip=\"Remove Prerequisite\">\n <mat-icon class=\"cqa-text-lg cqa-w-[18px] cqa-h-[18px]\">close</mat-icon>\n </button>\n </div>\n </div>\n\n <div *ngIf=\"showAddAnotherValidation && !allRowsHaveValues()\" class=\"cqa-text-xs cqa-text-[#dc2626] cqa-mb-2\">\n {{ selectFirstValidationMessage }}\n </div>\n <!-- Add Prerequisite button only in empty state; hide when parent has prerequisites (e.g. collapsing after update) -->\n <div\n *ngIf=\"rows.length === 0 && !hideAddPrerequisite\"\n class=\"cqa-border-2 cqa-border-dashed cqa-border-[#ccccff] cqa-rounded-lg cqa-p-3 cqa-mb-3 cqa-bg-white cqa-cursor-pointer cqa-transition-all cqa-duration-200 cqa-ease-in-out cqa-flex cqa-items-center cqa-justify-center cqa-gap-2 cqa-min-h-[40px] cqa-w-full cqa-hover:cqa-border-[#9999ee] cqa-hover:cqa-bg-[#f8f8ff] cqa-active:cqa-border-[#7c7ce0] cqa-active:cqa-bg-[#eff6ff]\"\n (click)=\"onAddRow()\">\n <mat-icon class=\"cqa-text-[18px] cqa-w-[18px] cqa-h-[18px] cqa-text-[#3b82f6]\">add</mat-icon>\n <span class=\"cqa-font-medium cqa-font-inter cqa-text-sm cqa-text-[#3b82f6]\">{{ addTriggerText }}</span>\n </div>\n <!-- Add Another link when we already have at least one row -->\n <button\n *ngIf=\"rows.length > 0 && !hideAddPrerequisite\"\n type=\"button\"\n class=\"cqa-mb-3 cqa-flex cqa-items-center cqa-gap-2 cqa-bg-transparent cqa-border-none cqa-p-0 cqa-cursor-pointer cqa-font-inter cqa-text-sm cqa-text-[#4242DB] cqa-hover:cqa-underline\"\n (click)=\"onAddRow()\">\n <mat-icon class=\"cqa-text-[18px] cqa-w-[18px] cqa-h-[18px]\">add</mat-icon>\n <span>{{ addAnotherText }}</span>\n </button>\n <div class=\"cqa-flex cqa-gap-3 cqa-justify-end\">\n <button\n type=\"button\"\n class=\"cqa-py-2.5 cqa-px-4 cqa-bg-white cqa-text-[#374151] cqa-border cqa-border-[#d1d5db] cqa-rounded-md cqa-text-sm cqa-font-semibold cqa-cursor-pointer cqa-hover:cqa-bg-[#f9fafb]\"\n (click)=\"onCancel()\">\n {{ cancelText }}\n </button>\n <button\n type=\"button\"\n class=\"cqa-py-2.5 cqa-px-4 cqa-rounded-md cqa-text-sm cqa-font-semibold cqa-border-none cqa-cursor-pointer disabled:cqa-opacity-50 disabled:cqa-cursor-not-allowed cqa-bg-[#1a56db] cqa-text-white cqa-hover:cqa-bg-[#1647b8] disabled:cqa-bg-[#1a56db] cqa-flex cqa-items-center cqa-justify-center cqa-gap-2\"\n [style.pointer-events]=\"isUpdating ? 'none' : 'auto'\"\n [style.cursor]=\"isUpdating ? 'not-allowed' : 'pointer'\"\n [disabled]=\"isUpdateDisabled()\"\n (click)=\"onUpdate()\">\n <mat-spinner *ngIf=\"isUpdating\" diameter=\"16\" class=\"cqa-inline-block update-spinner-white\"></mat-spinner>\n <span>{{ updateText }}</span>\n </button>\n </div>\n </div>\n</ng-container>\n", styles: [] }]
|
|
5473
5481
|
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { expanded: [{
|
|
5474
5482
|
type: Input
|
|
5475
5483
|
}], form: [{
|