lib-portal-angular 0.0.80 → 0.0.82
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/esm2022/lib/components/dynamic-modal/dynamic-modal.component.mjs +26 -5
- package/esm2022/lib/components/search-customer/search-customer.component.mjs +2 -2
- package/fesm2022/lib-portal-angular.mjs +27 -6
- package/fesm2022/lib-portal-angular.mjs.map +1 -1
- package/lib/components/dynamic-modal/dynamic-modal.component.d.ts +3 -1
- package/package.json +1 -1
|
@@ -5,26 +5,47 @@ export class DynamicModalComponent {
|
|
|
5
5
|
constructor() {
|
|
6
6
|
this.modalTitle = "Modal Title";
|
|
7
7
|
this.modalSizeClass = "";
|
|
8
|
+
this.modalId = "dynamicModal"; // ID único para cada modal
|
|
9
|
+
}
|
|
10
|
+
openModal() {
|
|
11
|
+
const modalElement = document.getElementById(this.modalId);
|
|
12
|
+
if (modalElement) {
|
|
13
|
+
modalElement.classList.add("show");
|
|
14
|
+
modalElement.setAttribute("aria-hidden", "false");
|
|
15
|
+
modalElement.style.display = "block";
|
|
16
|
+
document.body.classList.add("modal-open");
|
|
17
|
+
// Adiciona o backdrop manualmente se não existir
|
|
18
|
+
if (!document.querySelector(`.modal-backdrop[data-modal-id="${this.modalId}"]`)) {
|
|
19
|
+
const backdrop = document.createElement("div");
|
|
20
|
+
backdrop.className = "modal-backdrop fade show";
|
|
21
|
+
backdrop.setAttribute("data-modal-id", this.modalId);
|
|
22
|
+
document.body.appendChild(backdrop);
|
|
23
|
+
}
|
|
24
|
+
}
|
|
8
25
|
}
|
|
9
26
|
closeModal() {
|
|
10
|
-
const modalElement = document.getElementById(
|
|
27
|
+
const modalElement = document.getElementById(this.modalId);
|
|
11
28
|
if (modalElement) {
|
|
12
29
|
modalElement.classList.remove("show");
|
|
13
30
|
modalElement.setAttribute("aria-hidden", "true");
|
|
14
31
|
modalElement.style.display = "none";
|
|
15
32
|
document.body.classList.remove("modal-open");
|
|
16
|
-
document
|
|
33
|
+
document
|
|
34
|
+
.querySelector(`.modal-backdrop[data-modal-id="${this.modalId}"]`)
|
|
35
|
+
?.remove();
|
|
17
36
|
}
|
|
18
37
|
}
|
|
19
38
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DynamicModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
20
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: DynamicModalComponent, selector: "argenta-dynamic-modal", inputs: { modalTitle: "modalTitle", modalSizeClass: "modalSizeClass" }, ngImport: i0, template: "<div\n class=\"modal fade\"\n id=\"
|
|
39
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: DynamicModalComponent, selector: "argenta-dynamic-modal", inputs: { modalTitle: "modalTitle", modalSizeClass: "modalSizeClass", modalId: "modalId" }, ngImport: i0, template: "<div\n class=\"modal fade\"\n [id]=\"modalId\"\n tabindex=\"-1\"\n [attr.aria-labelledby]=\"modalId + 'Label'\"\n aria-hidden=\"true\"\n>\n <div class=\"modal-dialog\" [ngClass]=\"modalSizeClass\">\n <div class=\"modal-content\">\n <div class=\"modal-header custom-header\">\n <h5 class=\"modal-title\" [id]=\"modalId + 'Label'\">{{ modalTitle }}</h5>\n <button\n type=\"button\"\n class=\"custom-close-button\"\n (click)=\"closeModal()\"\n aria-label=\"Close\"\n >\n ×\n </button>\n </div>\n <div class=\"modal-body custom-body\">\n <ng-content select=\"[modal-body]\"></ng-content>\n </div>\n <div class=\"modal-footer custom-footer\">\n <ng-content select=\"[modal-footer]\"></ng-content>\n </div>\n </div>\n </div>\n</div>\n", styles: [".custom-header{background-color:var(--primary-color)!important;color:var(--text-color)!important;font-size:1.25rem!important;font-family:var(--font-family)!important;padding:1rem;position:relative}.custom-header .custom-close-button{position:absolute;right:1rem;background:none;border:none;font-size:2.5rem;color:var(--text-color);cursor:pointer}.custom-header .custom-close-button:hover{color:var(--danger-color)}.custom-body{background-color:#fff;padding:1rem}.custom-footer{background-color:#fff;padding:.75rem;display:flex;justify-content:flex-end;gap:.5rem}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] }); }
|
|
21
40
|
}
|
|
22
41
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DynamicModalComponent, decorators: [{
|
|
23
42
|
type: Component,
|
|
24
|
-
args: [{ selector: "argenta-dynamic-modal", template: "<div\n class=\"modal fade\"\n id=\"
|
|
43
|
+
args: [{ selector: "argenta-dynamic-modal", template: "<div\n class=\"modal fade\"\n [id]=\"modalId\"\n tabindex=\"-1\"\n [attr.aria-labelledby]=\"modalId + 'Label'\"\n aria-hidden=\"true\"\n>\n <div class=\"modal-dialog\" [ngClass]=\"modalSizeClass\">\n <div class=\"modal-content\">\n <div class=\"modal-header custom-header\">\n <h5 class=\"modal-title\" [id]=\"modalId + 'Label'\">{{ modalTitle }}</h5>\n <button\n type=\"button\"\n class=\"custom-close-button\"\n (click)=\"closeModal()\"\n aria-label=\"Close\"\n >\n ×\n </button>\n </div>\n <div class=\"modal-body custom-body\">\n <ng-content select=\"[modal-body]\"></ng-content>\n </div>\n <div class=\"modal-footer custom-footer\">\n <ng-content select=\"[modal-footer]\"></ng-content>\n </div>\n </div>\n </div>\n</div>\n", styles: [".custom-header{background-color:var(--primary-color)!important;color:var(--text-color)!important;font-size:1.25rem!important;font-family:var(--font-family)!important;padding:1rem;position:relative}.custom-header .custom-close-button{position:absolute;right:1rem;background:none;border:none;font-size:2.5rem;color:var(--text-color);cursor:pointer}.custom-header .custom-close-button:hover{color:var(--danger-color)}.custom-body{background-color:#fff;padding:1rem}.custom-footer{background-color:#fff;padding:.75rem;display:flex;justify-content:flex-end;gap:.5rem}\n"] }]
|
|
25
44
|
}], propDecorators: { modalTitle: [{
|
|
26
45
|
type: Input
|
|
27
46
|
}], modalSizeClass: [{
|
|
28
47
|
type: Input
|
|
48
|
+
}], modalId: [{
|
|
49
|
+
type: Input
|
|
29
50
|
}] } });
|
|
30
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
51
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZHluYW1pYy1tb2RhbC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9saWItcG9ydGFsLWFuZ3VsYXIvc3JjL2xpYi9jb21wb25lbnRzL2R5bmFtaWMtbW9kYWwvZHluYW1pYy1tb2RhbC5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9saWItcG9ydGFsLWFuZ3VsYXIvc3JjL2xpYi9jb21wb25lbnRzL2R5bmFtaWMtbW9kYWwvZHluYW1pYy1tb2RhbC5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLEtBQUssRUFBRSxNQUFNLGVBQWUsQ0FBQzs7O0FBT2pELE1BQU0sT0FBTyxxQkFBcUI7SUFMbEM7UUFNVyxlQUFVLEdBQVcsYUFBYSxDQUFDO1FBQ25DLG1CQUFjLEdBQVcsRUFBRSxDQUFDO1FBQzVCLFlBQU8sR0FBVyxjQUFjLENBQUMsQ0FBQywyQkFBMkI7S0FvQ3ZFO0lBbENDLFNBQVM7UUFDUCxNQUFNLFlBQVksR0FBRyxRQUFRLENBQUMsY0FBYyxDQUFDLElBQUksQ0FBQyxPQUFPLENBQUMsQ0FBQztRQUMzRCxJQUFJLFlBQVksRUFBRTtZQUNmLFlBQW9CLENBQUMsU0FBUyxDQUFDLEdBQUcsQ0FBQyxNQUFNLENBQUMsQ0FBQztZQUM1QyxZQUFZLENBQUMsWUFBWSxDQUFDLGFBQWEsRUFBRSxPQUFPLENBQUMsQ0FBQztZQUNsRCxZQUFZLENBQUMsS0FBSyxDQUFDLE9BQU8sR0FBRyxPQUFPLENBQUM7WUFDckMsUUFBUSxDQUFDLElBQUksQ0FBQyxTQUFTLENBQUMsR0FBRyxDQUFDLFlBQVksQ0FBQyxDQUFDO1lBRTFDLGlEQUFpRDtZQUNqRCxJQUNFLENBQUMsUUFBUSxDQUFDLGFBQWEsQ0FDckIsa0NBQWtDLElBQUksQ0FBQyxPQUFPLElBQUksQ0FDbkQsRUFDRDtnQkFDQSxNQUFNLFFBQVEsR0FBRyxRQUFRLENBQUMsYUFBYSxDQUFDLEtBQUssQ0FBQyxDQUFDO2dCQUMvQyxRQUFRLENBQUMsU0FBUyxHQUFHLDBCQUEwQixDQUFDO2dCQUNoRCxRQUFRLENBQUMsWUFBWSxDQUFDLGVBQWUsRUFBRSxJQUFJLENBQUMsT0FBTyxDQUFDLENBQUM7Z0JBQ3JELFFBQVEsQ0FBQyxJQUFJLENBQUMsV0FBVyxDQUFDLFFBQVEsQ0FBQyxDQUFDO2FBQ3JDO1NBQ0Y7SUFDSCxDQUFDO0lBRUQsVUFBVTtRQUNSLE1BQU0sWUFBWSxHQUFHLFFBQVEsQ0FBQyxjQUFjLENBQUMsSUFBSSxDQUFDLE9BQU8sQ0FBQyxDQUFDO1FBQzNELElBQUksWUFBWSxFQUFFO1lBQ2YsWUFBb0IsQ0FBQyxTQUFTLENBQUMsTUFBTSxDQUFDLE1BQU0sQ0FBQyxDQUFDO1lBQy9DLFlBQVksQ0FBQyxZQUFZLENBQUMsYUFBYSxFQUFFLE1BQU0sQ0FBQyxDQUFDO1lBQ2pELFlBQVksQ0FBQyxLQUFLLENBQUMsT0FBTyxHQUFHLE1BQU0sQ0FBQztZQUNwQyxRQUFRLENBQUMsSUFBSSxDQUFDLFNBQVMsQ0FBQyxNQUFNLENBQUMsWUFBWSxDQUFDLENBQUM7WUFDN0MsUUFBUTtpQkFDTCxhQUFhLENBQUMsa0NBQWtDLElBQUksQ0FBQyxPQUFPLElBQUksQ0FBQztnQkFDbEUsRUFBRSxNQUFNLEVBQUUsQ0FBQztTQUNkO0lBQ0gsQ0FBQzsrR0F0Q1UscUJBQXFCO21HQUFyQixxQkFBcUIseUpDUGxDLGsyQkE2QkE7OzRGRHRCYSxxQkFBcUI7a0JBTGpDLFNBQVM7K0JBQ0UsdUJBQXVCOzhCQUt4QixVQUFVO3NCQUFsQixLQUFLO2dCQUNHLGNBQWM7c0JBQXRCLEtBQUs7Z0JBQ0csT0FBTztzQkFBZixLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBJbnB1dCB9IGZyb20gXCJAYW5ndWxhci9jb3JlXCI7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogXCJhcmdlbnRhLWR5bmFtaWMtbW9kYWxcIixcbiAgdGVtcGxhdGVVcmw6IFwiLi9keW5hbWljLW1vZGFsLmNvbXBvbmVudC5odG1sXCIsXG4gIHN0eWxlVXJsczogW1wiLi9keW5hbWljLW1vZGFsLmNvbXBvbmVudC5zY3NzXCJdLFxufSlcbmV4cG9ydCBjbGFzcyBEeW5hbWljTW9kYWxDb21wb25lbnQge1xuICBASW5wdXQoKSBtb2RhbFRpdGxlOiBzdHJpbmcgPSBcIk1vZGFsIFRpdGxlXCI7XG4gIEBJbnB1dCgpIG1vZGFsU2l6ZUNsYXNzOiBzdHJpbmcgPSBcIlwiO1xuICBASW5wdXQoKSBtb2RhbElkOiBzdHJpbmcgPSBcImR5bmFtaWNNb2RhbFwiOyAvLyBJRCDDum5pY28gcGFyYSBjYWRhIG1vZGFsXG5cbiAgb3Blbk1vZGFsKCkge1xuICAgIGNvbnN0IG1vZGFsRWxlbWVudCA9IGRvY3VtZW50LmdldEVsZW1lbnRCeUlkKHRoaXMubW9kYWxJZCk7XG4gICAgaWYgKG1vZGFsRWxlbWVudCkge1xuICAgICAgKG1vZGFsRWxlbWVudCBhcyBhbnkpLmNsYXNzTGlzdC5hZGQoXCJzaG93XCIpO1xuICAgICAgbW9kYWxFbGVtZW50LnNldEF0dHJpYnV0ZShcImFyaWEtaGlkZGVuXCIsIFwiZmFsc2VcIik7XG4gICAgICBtb2RhbEVsZW1lbnQuc3R5bGUuZGlzcGxheSA9IFwiYmxvY2tcIjtcbiAgICAgIGRvY3VtZW50LmJvZHkuY2xhc3NMaXN0LmFkZChcIm1vZGFsLW9wZW5cIik7XG5cbiAgICAgIC8vIEFkaWNpb25hIG8gYmFja2Ryb3AgbWFudWFsbWVudGUgc2UgbsOjbyBleGlzdGlyXG4gICAgICBpZiAoXG4gICAgICAgICFkb2N1bWVudC5xdWVyeVNlbGVjdG9yKFxuICAgICAgICAgIGAubW9kYWwtYmFja2Ryb3BbZGF0YS1tb2RhbC1pZD1cIiR7dGhpcy5tb2RhbElkfVwiXWBcbiAgICAgICAgKVxuICAgICAgKSB7XG4gICAgICAgIGNvbnN0IGJhY2tkcm9wID0gZG9jdW1lbnQuY3JlYXRlRWxlbWVudChcImRpdlwiKTtcbiAgICAgICAgYmFja2Ryb3AuY2xhc3NOYW1lID0gXCJtb2RhbC1iYWNrZHJvcCBmYWRlIHNob3dcIjtcbiAgICAgICAgYmFja2Ryb3Auc2V0QXR0cmlidXRlKFwiZGF0YS1tb2RhbC1pZFwiLCB0aGlzLm1vZGFsSWQpO1xuICAgICAgICBkb2N1bWVudC5ib2R5LmFwcGVuZENoaWxkKGJhY2tkcm9wKTtcbiAgICAgIH1cbiAgICB9XG4gIH1cblxuICBjbG9zZU1vZGFsKCkge1xuICAgIGNvbnN0IG1vZGFsRWxlbWVudCA9IGRvY3VtZW50LmdldEVsZW1lbnRCeUlkKHRoaXMubW9kYWxJZCk7XG4gICAgaWYgKG1vZGFsRWxlbWVudCkge1xuICAgICAgKG1vZGFsRWxlbWVudCBhcyBhbnkpLmNsYXNzTGlzdC5yZW1vdmUoXCJzaG93XCIpO1xuICAgICAgbW9kYWxFbGVtZW50LnNldEF0dHJpYnV0ZShcImFyaWEtaGlkZGVuXCIsIFwidHJ1ZVwiKTtcbiAgICAgIG1vZGFsRWxlbWVudC5zdHlsZS5kaXNwbGF5ID0gXCJub25lXCI7XG4gICAgICBkb2N1bWVudC5ib2R5LmNsYXNzTGlzdC5yZW1vdmUoXCJtb2RhbC1vcGVuXCIpO1xuICAgICAgZG9jdW1lbnRcbiAgICAgICAgLnF1ZXJ5U2VsZWN0b3IoYC5tb2RhbC1iYWNrZHJvcFtkYXRhLW1vZGFsLWlkPVwiJHt0aGlzLm1vZGFsSWR9XCJdYClcbiAgICAgICAgPy5yZW1vdmUoKTtcbiAgICB9XG4gIH1cbn1cbiIsIjxkaXZcbiAgY2xhc3M9XCJtb2RhbCBmYWRlXCJcbiAgW2lkXT1cIm1vZGFsSWRcIlxuICB0YWJpbmRleD1cIi0xXCJcbiAgW2F0dHIuYXJpYS1sYWJlbGxlZGJ5XT1cIm1vZGFsSWQgKyAnTGFiZWwnXCJcbiAgYXJpYS1oaWRkZW49XCJ0cnVlXCJcbj5cbiAgPGRpdiBjbGFzcz1cIm1vZGFsLWRpYWxvZ1wiIFtuZ0NsYXNzXT1cIm1vZGFsU2l6ZUNsYXNzXCI+XG4gICAgPGRpdiBjbGFzcz1cIm1vZGFsLWNvbnRlbnRcIj5cbiAgICAgIDxkaXYgY2xhc3M9XCJtb2RhbC1oZWFkZXIgY3VzdG9tLWhlYWRlclwiPlxuICAgICAgICA8aDUgY2xhc3M9XCJtb2RhbC10aXRsZVwiIFtpZF09XCJtb2RhbElkICsgJ0xhYmVsJ1wiPnt7IG1vZGFsVGl0bGUgfX08L2g1PlxuICAgICAgICA8YnV0dG9uXG4gICAgICAgICAgdHlwZT1cImJ1dHRvblwiXG4gICAgICAgICAgY2xhc3M9XCJjdXN0b20tY2xvc2UtYnV0dG9uXCJcbiAgICAgICAgICAoY2xpY2spPVwiY2xvc2VNb2RhbCgpXCJcbiAgICAgICAgICBhcmlhLWxhYmVsPVwiQ2xvc2VcIlxuICAgICAgICA+XG4gICAgICAgICAgJnRpbWVzO1xuICAgICAgICA8L2J1dHRvbj5cbiAgICAgIDwvZGl2PlxuICAgICAgPGRpdiBjbGFzcz1cIm1vZGFsLWJvZHkgY3VzdG9tLWJvZHlcIj5cbiAgICAgICAgPG5nLWNvbnRlbnQgc2VsZWN0PVwiW21vZGFsLWJvZHldXCI+PC9uZy1jb250ZW50PlxuICAgICAgPC9kaXY+XG4gICAgICA8ZGl2IGNsYXNzPVwibW9kYWwtZm9vdGVyIGN1c3RvbS1mb290ZXJcIj5cbiAgICAgICAgPG5nLWNvbnRlbnQgc2VsZWN0PVwiW21vZGFsLWZvb3Rlcl1cIj48L25nLWNvbnRlbnQ+XG4gICAgICA8L2Rpdj5cbiAgICA8L2Rpdj5cbiAgPC9kaXY+XG48L2Rpdj5cbiJdfQ==
|
|
@@ -18,11 +18,11 @@ export class SearchCustomerComponent {
|
|
|
18
18
|
this.searchTerm.emit(inputElement.value);
|
|
19
19
|
}
|
|
20
20
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SearchCustomerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
21
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SearchCustomerComponent, selector: "argenta-search-customer", inputs: { placeholder: "placeholder", id: "id", disabled: "disabled", readonly: "readonly", autofocus: "autofocus" }, outputs: { searchTerm: "searchTerm" }, ngImport: i0, template: "<div class=\"search-container\">\n <span class=\"search-icon\" [ngClass]=\"'search-icon-green'\">\n <lucide-icon name=\"search\" [size]=\"16\"></lucide-icon>\n </span>\n <input\n [id]=\"id\"\n [placeholder]=\"placeholder\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [autofocus]=\"autofocus\"\n (input)=\"onSearch($event)\"\n class=\"search-input custom-input\"\n />\n</div>\n", styles: [".search-container{display:flex;align-items:center;border:1px solid var(--
|
|
21
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SearchCustomerComponent, selector: "argenta-search-customer", inputs: { placeholder: "placeholder", id: "id", disabled: "disabled", readonly: "readonly", autofocus: "autofocus" }, outputs: { searchTerm: "searchTerm" }, ngImport: i0, template: "<div class=\"search-container\">\n <span class=\"search-icon\" [ngClass]=\"'search-icon-green'\">\n <lucide-icon name=\"search\" [size]=\"16\"></lucide-icon>\n </span>\n <input\n [id]=\"id\"\n [placeholder]=\"placeholder\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [autofocus]=\"autofocus\"\n (input)=\"onSearch($event)\"\n class=\"search-input custom-input\"\n />\n</div>\n", styles: [".search-container{display:flex;align-items:center;border:1px solid var(--primary-color);border-radius:8px;padding:5px;background-color:#f7f9fc}.search-icon{padding:0 10px;color:#b0b0b0}.search-input{border:none;outline:none;padding:8px;flex:1;background-color:transparent;font-family:var(--font-family);color:#333;font-size:.9rem;height:35px}.search-input::placeholder{color:#b0b0b0}.search-icon-green{color:var(--primary-color)}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i2.LucideAngularComponent, selector: "lucide-angular, lucide-icon, i-lucide, span-lucide", inputs: ["class", "name", "img", "color", "absoluteStrokeWidth", "size", "strokeWidth"] }] }); }
|
|
22
22
|
}
|
|
23
23
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SearchCustomerComponent, decorators: [{
|
|
24
24
|
type: Component,
|
|
25
|
-
args: [{ selector: 'argenta-search-customer', template: "<div class=\"search-container\">\n <span class=\"search-icon\" [ngClass]=\"'search-icon-green'\">\n <lucide-icon name=\"search\" [size]=\"16\"></lucide-icon>\n </span>\n <input\n [id]=\"id\"\n [placeholder]=\"placeholder\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [autofocus]=\"autofocus\"\n (input)=\"onSearch($event)\"\n class=\"search-input custom-input\"\n />\n</div>\n", styles: [".search-container{display:flex;align-items:center;border:1px solid var(--
|
|
25
|
+
args: [{ selector: 'argenta-search-customer', template: "<div class=\"search-container\">\n <span class=\"search-icon\" [ngClass]=\"'search-icon-green'\">\n <lucide-icon name=\"search\" [size]=\"16\"></lucide-icon>\n </span>\n <input\n [id]=\"id\"\n [placeholder]=\"placeholder\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [autofocus]=\"autofocus\"\n (input)=\"onSearch($event)\"\n class=\"search-input custom-input\"\n />\n</div>\n", styles: [".search-container{display:flex;align-items:center;border:1px solid var(--primary-color);border-radius:8px;padding:5px;background-color:#f7f9fc}.search-icon{padding:0 10px;color:#b0b0b0}.search-input{border:none;outline:none;padding:8px;flex:1;background-color:transparent;font-family:var(--font-family);color:#333;font-size:.9rem;height:35px}.search-input::placeholder{color:#b0b0b0}.search-icon-green{color:var(--primary-color)}\n"] }]
|
|
26
26
|
}], propDecorators: { placeholder: [{
|
|
27
27
|
type: Input
|
|
28
28
|
}], id: [{
|
|
@@ -2425,11 +2425,11 @@ class SearchCustomerComponent {
|
|
|
2425
2425
|
this.searchTerm.emit(inputElement.value);
|
|
2426
2426
|
}
|
|
2427
2427
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SearchCustomerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2428
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SearchCustomerComponent, selector: "argenta-search-customer", inputs: { placeholder: "placeholder", id: "id", disabled: "disabled", readonly: "readonly", autofocus: "autofocus" }, outputs: { searchTerm: "searchTerm" }, ngImport: i0, template: "<div class=\"search-container\">\n <span class=\"search-icon\" [ngClass]=\"'search-icon-green'\">\n <lucide-icon name=\"search\" [size]=\"16\"></lucide-icon>\n </span>\n <input\n [id]=\"id\"\n [placeholder]=\"placeholder\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [autofocus]=\"autofocus\"\n (input)=\"onSearch($event)\"\n class=\"search-input custom-input\"\n />\n</div>\n", styles: [".search-container{display:flex;align-items:center;border:1px solid var(--
|
|
2428
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SearchCustomerComponent, selector: "argenta-search-customer", inputs: { placeholder: "placeholder", id: "id", disabled: "disabled", readonly: "readonly", autofocus: "autofocus" }, outputs: { searchTerm: "searchTerm" }, ngImport: i0, template: "<div class=\"search-container\">\n <span class=\"search-icon\" [ngClass]=\"'search-icon-green'\">\n <lucide-icon name=\"search\" [size]=\"16\"></lucide-icon>\n </span>\n <input\n [id]=\"id\"\n [placeholder]=\"placeholder\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [autofocus]=\"autofocus\"\n (input)=\"onSearch($event)\"\n class=\"search-input custom-input\"\n />\n</div>\n", styles: [".search-container{display:flex;align-items:center;border:1px solid var(--primary-color);border-radius:8px;padding:5px;background-color:#f7f9fc}.search-icon{padding:0 10px;color:#b0b0b0}.search-input{border:none;outline:none;padding:8px;flex:1;background-color:transparent;font-family:var(--font-family);color:#333;font-size:.9rem;height:35px}.search-input::placeholder{color:#b0b0b0}.search-icon-green{color:var(--primary-color)}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i3.LucideAngularComponent, selector: "lucide-angular, lucide-icon, i-lucide, span-lucide", inputs: ["class", "name", "img", "color", "absoluteStrokeWidth", "size", "strokeWidth"] }] }); }
|
|
2429
2429
|
}
|
|
2430
2430
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SearchCustomerComponent, decorators: [{
|
|
2431
2431
|
type: Component,
|
|
2432
|
-
args: [{ selector: 'argenta-search-customer', template: "<div class=\"search-container\">\n <span class=\"search-icon\" [ngClass]=\"'search-icon-green'\">\n <lucide-icon name=\"search\" [size]=\"16\"></lucide-icon>\n </span>\n <input\n [id]=\"id\"\n [placeholder]=\"placeholder\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [autofocus]=\"autofocus\"\n (input)=\"onSearch($event)\"\n class=\"search-input custom-input\"\n />\n</div>\n", styles: [".search-container{display:flex;align-items:center;border:1px solid var(--
|
|
2432
|
+
args: [{ selector: 'argenta-search-customer', template: "<div class=\"search-container\">\n <span class=\"search-icon\" [ngClass]=\"'search-icon-green'\">\n <lucide-icon name=\"search\" [size]=\"16\"></lucide-icon>\n </span>\n <input\n [id]=\"id\"\n [placeholder]=\"placeholder\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [autofocus]=\"autofocus\"\n (input)=\"onSearch($event)\"\n class=\"search-input custom-input\"\n />\n</div>\n", styles: [".search-container{display:flex;align-items:center;border:1px solid var(--primary-color);border-radius:8px;padding:5px;background-color:#f7f9fc}.search-icon{padding:0 10px;color:#b0b0b0}.search-input{border:none;outline:none;padding:8px;flex:1;background-color:transparent;font-family:var(--font-family);color:#333;font-size:.9rem;height:35px}.search-input::placeholder{color:#b0b0b0}.search-icon-green{color:var(--primary-color)}\n"] }]
|
|
2433
2433
|
}], propDecorators: { placeholder: [{
|
|
2434
2434
|
type: Input
|
|
2435
2435
|
}], id: [{
|
|
@@ -3403,27 +3403,48 @@ class DynamicModalComponent {
|
|
|
3403
3403
|
constructor() {
|
|
3404
3404
|
this.modalTitle = "Modal Title";
|
|
3405
3405
|
this.modalSizeClass = "";
|
|
3406
|
+
this.modalId = "dynamicModal"; // ID único para cada modal
|
|
3407
|
+
}
|
|
3408
|
+
openModal() {
|
|
3409
|
+
const modalElement = document.getElementById(this.modalId);
|
|
3410
|
+
if (modalElement) {
|
|
3411
|
+
modalElement.classList.add("show");
|
|
3412
|
+
modalElement.setAttribute("aria-hidden", "false");
|
|
3413
|
+
modalElement.style.display = "block";
|
|
3414
|
+
document.body.classList.add("modal-open");
|
|
3415
|
+
// Adiciona o backdrop manualmente se não existir
|
|
3416
|
+
if (!document.querySelector(`.modal-backdrop[data-modal-id="${this.modalId}"]`)) {
|
|
3417
|
+
const backdrop = document.createElement("div");
|
|
3418
|
+
backdrop.className = "modal-backdrop fade show";
|
|
3419
|
+
backdrop.setAttribute("data-modal-id", this.modalId);
|
|
3420
|
+
document.body.appendChild(backdrop);
|
|
3421
|
+
}
|
|
3422
|
+
}
|
|
3406
3423
|
}
|
|
3407
3424
|
closeModal() {
|
|
3408
|
-
const modalElement = document.getElementById(
|
|
3425
|
+
const modalElement = document.getElementById(this.modalId);
|
|
3409
3426
|
if (modalElement) {
|
|
3410
3427
|
modalElement.classList.remove("show");
|
|
3411
3428
|
modalElement.setAttribute("aria-hidden", "true");
|
|
3412
3429
|
modalElement.style.display = "none";
|
|
3413
3430
|
document.body.classList.remove("modal-open");
|
|
3414
|
-
document
|
|
3431
|
+
document
|
|
3432
|
+
.querySelector(`.modal-backdrop[data-modal-id="${this.modalId}"]`)
|
|
3433
|
+
?.remove();
|
|
3415
3434
|
}
|
|
3416
3435
|
}
|
|
3417
3436
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DynamicModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3418
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: DynamicModalComponent, selector: "argenta-dynamic-modal", inputs: { modalTitle: "modalTitle", modalSizeClass: "modalSizeClass" }, ngImport: i0, template: "<div\n class=\"modal fade\"\n id=\"
|
|
3437
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: DynamicModalComponent, selector: "argenta-dynamic-modal", inputs: { modalTitle: "modalTitle", modalSizeClass: "modalSizeClass", modalId: "modalId" }, ngImport: i0, template: "<div\n class=\"modal fade\"\n [id]=\"modalId\"\n tabindex=\"-1\"\n [attr.aria-labelledby]=\"modalId + 'Label'\"\n aria-hidden=\"true\"\n>\n <div class=\"modal-dialog\" [ngClass]=\"modalSizeClass\">\n <div class=\"modal-content\">\n <div class=\"modal-header custom-header\">\n <h5 class=\"modal-title\" [id]=\"modalId + 'Label'\">{{ modalTitle }}</h5>\n <button\n type=\"button\"\n class=\"custom-close-button\"\n (click)=\"closeModal()\"\n aria-label=\"Close\"\n >\n ×\n </button>\n </div>\n <div class=\"modal-body custom-body\">\n <ng-content select=\"[modal-body]\"></ng-content>\n </div>\n <div class=\"modal-footer custom-footer\">\n <ng-content select=\"[modal-footer]\"></ng-content>\n </div>\n </div>\n </div>\n</div>\n", styles: [".custom-header{background-color:var(--primary-color)!important;color:var(--text-color)!important;font-size:1.25rem!important;font-family:var(--font-family)!important;padding:1rem;position:relative}.custom-header .custom-close-button{position:absolute;right:1rem;background:none;border:none;font-size:2.5rem;color:var(--text-color);cursor:pointer}.custom-header .custom-close-button:hover{color:var(--danger-color)}.custom-body{background-color:#fff;padding:1rem}.custom-footer{background-color:#fff;padding:.75rem;display:flex;justify-content:flex-end;gap:.5rem}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] }); }
|
|
3419
3438
|
}
|
|
3420
3439
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DynamicModalComponent, decorators: [{
|
|
3421
3440
|
type: Component,
|
|
3422
|
-
args: [{ selector: "argenta-dynamic-modal", template: "<div\n class=\"modal fade\"\n id=\"
|
|
3441
|
+
args: [{ selector: "argenta-dynamic-modal", template: "<div\n class=\"modal fade\"\n [id]=\"modalId\"\n tabindex=\"-1\"\n [attr.aria-labelledby]=\"modalId + 'Label'\"\n aria-hidden=\"true\"\n>\n <div class=\"modal-dialog\" [ngClass]=\"modalSizeClass\">\n <div class=\"modal-content\">\n <div class=\"modal-header custom-header\">\n <h5 class=\"modal-title\" [id]=\"modalId + 'Label'\">{{ modalTitle }}</h5>\n <button\n type=\"button\"\n class=\"custom-close-button\"\n (click)=\"closeModal()\"\n aria-label=\"Close\"\n >\n ×\n </button>\n </div>\n <div class=\"modal-body custom-body\">\n <ng-content select=\"[modal-body]\"></ng-content>\n </div>\n <div class=\"modal-footer custom-footer\">\n <ng-content select=\"[modal-footer]\"></ng-content>\n </div>\n </div>\n </div>\n</div>\n", styles: [".custom-header{background-color:var(--primary-color)!important;color:var(--text-color)!important;font-size:1.25rem!important;font-family:var(--font-family)!important;padding:1rem;position:relative}.custom-header .custom-close-button{position:absolute;right:1rem;background:none;border:none;font-size:2.5rem;color:var(--text-color);cursor:pointer}.custom-header .custom-close-button:hover{color:var(--danger-color)}.custom-body{background-color:#fff;padding:1rem}.custom-footer{background-color:#fff;padding:.75rem;display:flex;justify-content:flex-end;gap:.5rem}\n"] }]
|
|
3423
3442
|
}], propDecorators: { modalTitle: [{
|
|
3424
3443
|
type: Input
|
|
3425
3444
|
}], modalSizeClass: [{
|
|
3426
3445
|
type: Input
|
|
3446
|
+
}], modalId: [{
|
|
3447
|
+
type: Input
|
|
3427
3448
|
}] } });
|
|
3428
3449
|
|
|
3429
3450
|
// Select some icons (use an object, not an array)
|