quang 19.3.0 → 19.3.1

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.
@@ -2,7 +2,7 @@ import * as i0 from '@angular/core';
2
2
  import { signal, Injectable, input, computed, output, ChangeDetectionStrategy, Component, NgModule } from '@angular/core';
3
3
  import * as i1 from '@jsverse/transloco';
4
4
  import { TranslocoPipe } from '@jsverse/transloco';
5
- import { NgIf, NgFor, NgClass, CommonModule } from '@angular/common';
5
+ import { NgClass, CommonModule } from '@angular/common';
6
6
  import { toObservable, takeUntilDestroyed } from '@angular/core/rxjs-interop';
7
7
  import { makeId } from 'quang/components/shared';
8
8
 
@@ -115,11 +115,11 @@ class QuangPaginatorComponent {
115
115
  this.changePage.emit(this._currentPage());
116
116
  }
117
117
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: QuangPaginatorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
118
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.14", type: QuangPaginatorComponent, isStandalone: true, selector: "quang-paginator", inputs: { componentId: { classPropertyName: "componentId", publicName: "componentId", isSignal: true, isRequired: false, transformFunction: null }, componentTabIndex: { classPropertyName: "componentTabIndex", publicName: "componentTabIndex", isSignal: true, isRequired: false, transformFunction: null }, componentClass: { classPropertyName: "componentClass", publicName: "componentClass", isSignal: true, isRequired: false, transformFunction: null }, page: { classPropertyName: "page", publicName: "page", isSignal: true, isRequired: true, transformFunction: null }, pageSize: { classPropertyName: "pageSize", publicName: "pageSize", isSignal: true, isRequired: true, transformFunction: null }, sizeList: { classPropertyName: "sizeList", publicName: "sizeList", isSignal: true, isRequired: false, transformFunction: null }, totalItems: { classPropertyName: "totalItems", publicName: "totalItems", isSignal: true, isRequired: true, transformFunction: null }, showTotalElementsCount: { classPropertyName: "showTotalElementsCount", publicName: "showTotalElementsCount", isSignal: true, isRequired: false, transformFunction: null }, totalItemsText: { classPropertyName: "totalItemsText", publicName: "totalItemsText", isSignal: true, isRequired: false, transformFunction: null }, sizeText: { classPropertyName: "sizeText", publicName: "sizeText", isSignal: true, isRequired: false, transformFunction: null }, pageRangeText: { classPropertyName: "pageRangeText", publicName: "pageRangeText", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { changePage: "changePage", changeSize: "changeSize" }, ngImport: i0, template: "<div\n [id]=\"componentId()\"\n [ngClass]=\"componentClass()\"\n class=\"paginatorContainer\"\n>\n <div\n *ngIf=\"showTotalElementsCount()\"\n class=\"me-3 pagination-label\"\n >\n {{ totalItemsText() | transloco }} {{ totalItems() }}\n </div>\n <div\n *ngIf=\"sizeList().length > 0\"\n class=\"me-3\"\n >\n <label\n class=\"form-label pagination-label mb-0 text-center\"\n for=\"pageSize\"\n >\n {{ sizeText() | transloco }}\n </label>\n <select\n [id]=\"componentId() + '-quang-page-size'\"\n [tabIndex]=\"componentTabIndex()\"\n (change)=\"onChangeSize($event)\"\n #input\n autocomplete=\"off\"\n class=\"form-select page-size\"\n id=\"pageSize\"\n name=\"pageSize\"\n >\n <option\n [selected]=\"pageSize === this._pageSize()\"\n *ngFor=\"let pageSize of sizeList()\"\n >\n {{ pageSize }}\n </option>\n </select>\n </div>\n <div class=\"pagination-label text-center\">\n {{ pageRangeText() | transloco: { page: page(), amountPages: _totalPages() } }}\n </div>\n <div class=\"pagination\">\n <ul>\n <li>\n <button\n [disabled]=\"_currentPage() <= 1\"\n (click)=\"goToFirstPage()\"\n class=\"page-link\"\n type=\"button\"\n >\n <svg\n fill=\"currentColor\"\n height=\"24\"\n stroke=\"currentColor\"\n viewBox=\"0 -960 960 960\"\n width=\"24\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M240-240v-480h80v480h-80Zm440 0L440-480l240-240 56 56-184 184 184 184-56 56Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n />\n </svg>\n </button>\n </li>\n <li>\n <button\n [disabled]=\"_currentPage() <= 1\"\n (click)=\"goToPreviousPage()\"\n class=\"page-link\"\n type=\"button\"\n >\n <svg\n fill=\"currentColor\"\n height=\"24\"\n stroke=\"currentColor\"\n viewBox=\"0 -960 960 960\"\n width=\"24\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M560-240 320-480l240-240 56 56-184 184 184 184-56 56Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n />\n </svg>\n </button>\n </li>\n <li>\n <button\n [disabled]=\"_currentPage() >= _totalPages()\"\n (click)=\"goToNextPage()\"\n class=\"page-link\"\n type=\"button\"\n >\n <svg\n fill=\"currentColor\"\n height=\"24\"\n stroke=\"currentColor\"\n viewBox=\"0 -960 960 960\"\n width=\"24\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M504-480 320-664l56-56 240 240-240 240-56-56 184-184Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n />\n </svg>\n </button>\n </li>\n <li>\n <button\n [disabled]=\"_currentPage() >= _totalPages()\"\n (click)=\"goToLastPage()\"\n class=\"page-link\"\n type=\"button\"\n >\n <svg\n fill=\"currentColor\"\n height=\"24\"\n stroke=\"currentColor\"\n viewBox=\"0 -960 960 960\"\n width=\"24\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"m280-240-56-56 184-184-184-184 56-56 240 240-240 240Zm360 0v-480h80v480h-80Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n />\n </svg>\n </button>\n </li>\n </ul>\n </div>\n</div>\n\n<ng-template\n #nextTemplate\n let-currentPage=\"currentPage\"\n let-disabled=\"disabled\"\n>\n <svg\n fill=\"currentColor\"\n fill=\"currentColor\"\n height=\"48\"\n stroke=\"currentColor\"\n viewBox=\"0 -960 960 960\"\n width=\"48\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M530-481 332-679l43-43 241 241-241 241-43-43 198-198Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n />\n </svg>\n</ng-template>\n\n<ng-template\n #prevTemplate\n let-currentPage=\"currentPage\"\n let-disabled=\"disabled\"\n>\n <svg\n fill=\"currentColor\"\n fill=\"currentColor\"\n height=\"48\"\n stroke=\"currentColor\"\n viewBox=\"0 -960 960 960\"\n width=\"48\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M561-240 320-481l241-241 43 43-198 198 198 198-43 43Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n />\n </svg>\n</ng-template>\n\n<ng-template\n #lastTemplate\n let-currentPage=\"currentPage\"\n let-disabled=\"disabled\"\n>\n <svg\n fill=\"currentColor\"\n fill=\"currentColor\"\n height=\"48\"\n stroke=\"currentColor\"\n viewBox=\"0 -960 960 960\"\n width=\"48\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"m272-245-43-43 192-192-192-192 43-43 235 235-235 235Zm388 5v-480h60v480h-60Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n />\n </svg>\n</ng-template>\n\n<ng-template\n #firstTemplate\n let-currentPage=\"currentPage\"\n let-disabled=\"disabled\"\n>\n <svg\n fill=\"currentColor\"\n fill=\"currentColor\"\n height=\"48\"\n stroke=\"currentColor\"\n viewBox=\"0 -960 960 960\"\n width=\"48\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M240-240v-480h60v480h-60Zm447-3L453-477l234-234 43 43-191 191 191 191-43 43Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n />\n </svg>\n</ng-template>\n", styles: [":host{display:block}.paginatorContainer{display:flex;align-items:flex-end;flex-wrap:wrap}@media (min-width: 576px){.paginatorContainer{flex-wrap:nowrap;order:2}}.paginatorContainer .page-size{display:inline-block;margin-bottom:.5rem;order:2;min-width:80px}@media (min-width: 576px){.paginatorContainer .page-size{order:1}}.pagination{margin-bottom:.5rem}.pagination ul{padding:0;margin:0;display:flex}.pagination ul li{list-style-type:none}.pagination ul li.pagination-page{display:none}.pagination ul li .page-link{border-radius:50%;padding:.375rem;border:none;gap:1.5rem;padding:.25rem;background-color:transparent;color:var(--bs-body-color)}.pagination ul li .page-link:disabled svg path{opacity:40%}.pagination ul li .page-link:focus{box-shadow:unset;background-color:unset}.pagination ul li .page-link svg{vertical-align:bottom;width:30px;height:30px}.pagination-label{margin:0;margin-bottom:1rem;font-size:.75rem}\n"], dependencies: [{ kind: "pipe", type: TranslocoPipe, name: "transloco" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
118
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.14", type: QuangPaginatorComponent, isStandalone: true, selector: "quang-paginator", inputs: { componentId: { classPropertyName: "componentId", publicName: "componentId", isSignal: true, isRequired: false, transformFunction: null }, componentTabIndex: { classPropertyName: "componentTabIndex", publicName: "componentTabIndex", isSignal: true, isRequired: false, transformFunction: null }, componentClass: { classPropertyName: "componentClass", publicName: "componentClass", isSignal: true, isRequired: false, transformFunction: null }, page: { classPropertyName: "page", publicName: "page", isSignal: true, isRequired: true, transformFunction: null }, pageSize: { classPropertyName: "pageSize", publicName: "pageSize", isSignal: true, isRequired: true, transformFunction: null }, sizeList: { classPropertyName: "sizeList", publicName: "sizeList", isSignal: true, isRequired: false, transformFunction: null }, totalItems: { classPropertyName: "totalItems", publicName: "totalItems", isSignal: true, isRequired: true, transformFunction: null }, showTotalElementsCount: { classPropertyName: "showTotalElementsCount", publicName: "showTotalElementsCount", isSignal: true, isRequired: false, transformFunction: null }, totalItemsText: { classPropertyName: "totalItemsText", publicName: "totalItemsText", isSignal: true, isRequired: false, transformFunction: null }, sizeText: { classPropertyName: "sizeText", publicName: "sizeText", isSignal: true, isRequired: false, transformFunction: null }, pageRangeText: { classPropertyName: "pageRangeText", publicName: "pageRangeText", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { changePage: "changePage", changeSize: "changeSize" }, ngImport: i0, template: "<div\n [id]=\"componentId()\"\n [ngClass]=\"componentClass()\"\n class=\"paginatorContainer\"\n>\n @if (showTotalElementsCount()) {\n <div class=\"me-3 pagination-label\">{{ totalItemsText() | transloco }} {{ totalItems() }}</div>\n }\n @if (sizeList().length > 0) {\n <div class=\"me-3\">\n <label\n class=\"form-label pagination-label mb-0 text-center\"\n for=\"pageSize\"\n >\n {{ sizeText() | transloco }}\n </label>\n <select\n [id]=\"componentId() + '-quang-page-size'\"\n [tabIndex]=\"componentTabIndex()\"\n (change)=\"onChangeSize($event)\"\n #input\n autocomplete=\"off\"\n class=\"form-select page-size\"\n id=\"pageSize\"\n name=\"pageSize\"\n >\n @for (pageSize of sizeList(); track pageSize) {\n <option [selected]=\"pageSize === this._pageSize()\">\n {{ pageSize }}\n </option>\n }\n </select>\n </div>\n }\n <div class=\"pagination-label text-center\">\n {{ pageRangeText() | transloco: { page: page(), amountPages: _totalPages() } }}\n </div>\n <div class=\"pagination\">\n <ul>\n <li>\n <button\n [disabled]=\"_currentPage() <= 1\"\n (click)=\"goToFirstPage()\"\n class=\"page-link\"\n type=\"button\"\n >\n <svg\n fill=\"currentColor\"\n height=\"24\"\n stroke=\"currentColor\"\n viewBox=\"0 -960 960 960\"\n width=\"24\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M240-240v-480h80v480h-80Zm440 0L440-480l240-240 56 56-184 184 184 184-56 56Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n />\n </svg>\n </button>\n </li>\n <li>\n <button\n [disabled]=\"_currentPage() <= 1\"\n (click)=\"goToPreviousPage()\"\n class=\"page-link\"\n type=\"button\"\n >\n <svg\n fill=\"currentColor\"\n height=\"24\"\n stroke=\"currentColor\"\n viewBox=\"0 -960 960 960\"\n width=\"24\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M560-240 320-480l240-240 56 56-184 184 184 184-56 56Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n />\n </svg>\n </button>\n </li>\n <li>\n <button\n [disabled]=\"_currentPage() >= _totalPages()\"\n (click)=\"goToNextPage()\"\n class=\"page-link\"\n type=\"button\"\n >\n <svg\n fill=\"currentColor\"\n height=\"24\"\n stroke=\"currentColor\"\n viewBox=\"0 -960 960 960\"\n width=\"24\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M504-480 320-664l56-56 240 240-240 240-56-56 184-184Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n />\n </svg>\n </button>\n </li>\n <li>\n <button\n [disabled]=\"_currentPage() >= _totalPages()\"\n (click)=\"goToLastPage()\"\n class=\"page-link\"\n type=\"button\"\n >\n <svg\n fill=\"currentColor\"\n height=\"24\"\n stroke=\"currentColor\"\n viewBox=\"0 -960 960 960\"\n width=\"24\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"m280-240-56-56 184-184-184-184 56-56 240 240-240 240Zm360 0v-480h80v480h-80Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n />\n </svg>\n </button>\n </li>\n </ul>\n </div>\n</div>\n\n<ng-template\n #nextTemplate\n let-currentPage=\"currentPage\"\n let-disabled=\"disabled\"\n>\n <svg\n fill=\"currentColor\"\n fill=\"currentColor\"\n height=\"48\"\n stroke=\"currentColor\"\n viewBox=\"0 -960 960 960\"\n width=\"48\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M530-481 332-679l43-43 241 241-241 241-43-43 198-198Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n />\n </svg>\n</ng-template>\n\n<ng-template\n #prevTemplate\n let-currentPage=\"currentPage\"\n let-disabled=\"disabled\"\n>\n <svg\n fill=\"currentColor\"\n fill=\"currentColor\"\n height=\"48\"\n stroke=\"currentColor\"\n viewBox=\"0 -960 960 960\"\n width=\"48\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M561-240 320-481l241-241 43 43-198 198 198 198-43 43Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n />\n </svg>\n</ng-template>\n\n<ng-template\n #lastTemplate\n let-currentPage=\"currentPage\"\n let-disabled=\"disabled\"\n>\n <svg\n fill=\"currentColor\"\n fill=\"currentColor\"\n height=\"48\"\n stroke=\"currentColor\"\n viewBox=\"0 -960 960 960\"\n width=\"48\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"m272-245-43-43 192-192-192-192 43-43 235 235-235 235Zm388 5v-480h60v480h-60Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n />\n </svg>\n</ng-template>\n\n<ng-template\n #firstTemplate\n let-currentPage=\"currentPage\"\n let-disabled=\"disabled\"\n>\n <svg\n fill=\"currentColor\"\n fill=\"currentColor\"\n height=\"48\"\n stroke=\"currentColor\"\n viewBox=\"0 -960 960 960\"\n width=\"48\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M240-240v-480h60v480h-60Zm447-3L453-477l234-234 43 43-191 191 191 191-43 43Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n />\n </svg>\n</ng-template>\n", styles: [":host{display:block}.paginatorContainer{display:flex;align-items:flex-end;flex-wrap:wrap}@media (min-width: 576px){.paginatorContainer{flex-wrap:nowrap;order:2}}.paginatorContainer .page-size{display:inline-block;margin-bottom:.5rem;order:2;min-width:80px}@media (min-width: 576px){.paginatorContainer .page-size{order:1}}.pagination{margin-bottom:.5rem}.pagination ul{padding:0;margin:0;display:flex}.pagination ul li{list-style-type:none}.pagination ul li.pagination-page{display:none}.pagination ul li .page-link{border-radius:50%;padding:.375rem;border:none;gap:1.5rem;padding:.25rem;background-color:transparent;color:var(--bs-body-color)}.pagination ul li .page-link:disabled svg path{opacity:40%}.pagination ul li .page-link:focus{box-shadow:unset;background-color:unset}.pagination ul li .page-link svg{vertical-align:bottom;width:30px;height:30px}.pagination-label{margin:0;margin-bottom:1rem;font-size:.75rem}\n"], dependencies: [{ kind: "pipe", type: TranslocoPipe, name: "transloco" }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
119
119
  }
120
120
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: QuangPaginatorComponent, decorators: [{
121
121
  type: Component,
122
- args: [{ selector: 'quang-paginator', imports: [TranslocoPipe, NgIf, NgFor, NgClass], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n [id]=\"componentId()\"\n [ngClass]=\"componentClass()\"\n class=\"paginatorContainer\"\n>\n <div\n *ngIf=\"showTotalElementsCount()\"\n class=\"me-3 pagination-label\"\n >\n {{ totalItemsText() | transloco }} {{ totalItems() }}\n </div>\n <div\n *ngIf=\"sizeList().length > 0\"\n class=\"me-3\"\n >\n <label\n class=\"form-label pagination-label mb-0 text-center\"\n for=\"pageSize\"\n >\n {{ sizeText() | transloco }}\n </label>\n <select\n [id]=\"componentId() + '-quang-page-size'\"\n [tabIndex]=\"componentTabIndex()\"\n (change)=\"onChangeSize($event)\"\n #input\n autocomplete=\"off\"\n class=\"form-select page-size\"\n id=\"pageSize\"\n name=\"pageSize\"\n >\n <option\n [selected]=\"pageSize === this._pageSize()\"\n *ngFor=\"let pageSize of sizeList()\"\n >\n {{ pageSize }}\n </option>\n </select>\n </div>\n <div class=\"pagination-label text-center\">\n {{ pageRangeText() | transloco: { page: page(), amountPages: _totalPages() } }}\n </div>\n <div class=\"pagination\">\n <ul>\n <li>\n <button\n [disabled]=\"_currentPage() <= 1\"\n (click)=\"goToFirstPage()\"\n class=\"page-link\"\n type=\"button\"\n >\n <svg\n fill=\"currentColor\"\n height=\"24\"\n stroke=\"currentColor\"\n viewBox=\"0 -960 960 960\"\n width=\"24\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M240-240v-480h80v480h-80Zm440 0L440-480l240-240 56 56-184 184 184 184-56 56Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n />\n </svg>\n </button>\n </li>\n <li>\n <button\n [disabled]=\"_currentPage() <= 1\"\n (click)=\"goToPreviousPage()\"\n class=\"page-link\"\n type=\"button\"\n >\n <svg\n fill=\"currentColor\"\n height=\"24\"\n stroke=\"currentColor\"\n viewBox=\"0 -960 960 960\"\n width=\"24\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M560-240 320-480l240-240 56 56-184 184 184 184-56 56Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n />\n </svg>\n </button>\n </li>\n <li>\n <button\n [disabled]=\"_currentPage() >= _totalPages()\"\n (click)=\"goToNextPage()\"\n class=\"page-link\"\n type=\"button\"\n >\n <svg\n fill=\"currentColor\"\n height=\"24\"\n stroke=\"currentColor\"\n viewBox=\"0 -960 960 960\"\n width=\"24\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M504-480 320-664l56-56 240 240-240 240-56-56 184-184Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n />\n </svg>\n </button>\n </li>\n <li>\n <button\n [disabled]=\"_currentPage() >= _totalPages()\"\n (click)=\"goToLastPage()\"\n class=\"page-link\"\n type=\"button\"\n >\n <svg\n fill=\"currentColor\"\n height=\"24\"\n stroke=\"currentColor\"\n viewBox=\"0 -960 960 960\"\n width=\"24\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"m280-240-56-56 184-184-184-184 56-56 240 240-240 240Zm360 0v-480h80v480h-80Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n />\n </svg>\n </button>\n </li>\n </ul>\n </div>\n</div>\n\n<ng-template\n #nextTemplate\n let-currentPage=\"currentPage\"\n let-disabled=\"disabled\"\n>\n <svg\n fill=\"currentColor\"\n fill=\"currentColor\"\n height=\"48\"\n stroke=\"currentColor\"\n viewBox=\"0 -960 960 960\"\n width=\"48\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M530-481 332-679l43-43 241 241-241 241-43-43 198-198Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n />\n </svg>\n</ng-template>\n\n<ng-template\n #prevTemplate\n let-currentPage=\"currentPage\"\n let-disabled=\"disabled\"\n>\n <svg\n fill=\"currentColor\"\n fill=\"currentColor\"\n height=\"48\"\n stroke=\"currentColor\"\n viewBox=\"0 -960 960 960\"\n width=\"48\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M561-240 320-481l241-241 43 43-198 198 198 198-43 43Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n />\n </svg>\n</ng-template>\n\n<ng-template\n #lastTemplate\n let-currentPage=\"currentPage\"\n let-disabled=\"disabled\"\n>\n <svg\n fill=\"currentColor\"\n fill=\"currentColor\"\n height=\"48\"\n stroke=\"currentColor\"\n viewBox=\"0 -960 960 960\"\n width=\"48\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"m272-245-43-43 192-192-192-192 43-43 235 235-235 235Zm388 5v-480h60v480h-60Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n />\n </svg>\n</ng-template>\n\n<ng-template\n #firstTemplate\n let-currentPage=\"currentPage\"\n let-disabled=\"disabled\"\n>\n <svg\n fill=\"currentColor\"\n fill=\"currentColor\"\n height=\"48\"\n stroke=\"currentColor\"\n viewBox=\"0 -960 960 960\"\n width=\"48\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M240-240v-480h60v480h-60Zm447-3L453-477l234-234 43 43-191 191 191 191-43 43Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n />\n </svg>\n</ng-template>\n", styles: [":host{display:block}.paginatorContainer{display:flex;align-items:flex-end;flex-wrap:wrap}@media (min-width: 576px){.paginatorContainer{flex-wrap:nowrap;order:2}}.paginatorContainer .page-size{display:inline-block;margin-bottom:.5rem;order:2;min-width:80px}@media (min-width: 576px){.paginatorContainer .page-size{order:1}}.pagination{margin-bottom:.5rem}.pagination ul{padding:0;margin:0;display:flex}.pagination ul li{list-style-type:none}.pagination ul li.pagination-page{display:none}.pagination ul li .page-link{border-radius:50%;padding:.375rem;border:none;gap:1.5rem;padding:.25rem;background-color:transparent;color:var(--bs-body-color)}.pagination ul li .page-link:disabled svg path{opacity:40%}.pagination ul li .page-link:focus{box-shadow:unset;background-color:unset}.pagination ul li .page-link svg{vertical-align:bottom;width:30px;height:30px}.pagination-label{margin:0;margin-bottom:1rem;font-size:.75rem}\n"] }]
122
+ args: [{ selector: 'quang-paginator', imports: [TranslocoPipe, NgClass], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n [id]=\"componentId()\"\n [ngClass]=\"componentClass()\"\n class=\"paginatorContainer\"\n>\n @if (showTotalElementsCount()) {\n <div class=\"me-3 pagination-label\">{{ totalItemsText() | transloco }} {{ totalItems() }}</div>\n }\n @if (sizeList().length > 0) {\n <div class=\"me-3\">\n <label\n class=\"form-label pagination-label mb-0 text-center\"\n for=\"pageSize\"\n >\n {{ sizeText() | transloco }}\n </label>\n <select\n [id]=\"componentId() + '-quang-page-size'\"\n [tabIndex]=\"componentTabIndex()\"\n (change)=\"onChangeSize($event)\"\n #input\n autocomplete=\"off\"\n class=\"form-select page-size\"\n id=\"pageSize\"\n name=\"pageSize\"\n >\n @for (pageSize of sizeList(); track pageSize) {\n <option [selected]=\"pageSize === this._pageSize()\">\n {{ pageSize }}\n </option>\n }\n </select>\n </div>\n }\n <div class=\"pagination-label text-center\">\n {{ pageRangeText() | transloco: { page: page(), amountPages: _totalPages() } }}\n </div>\n <div class=\"pagination\">\n <ul>\n <li>\n <button\n [disabled]=\"_currentPage() <= 1\"\n (click)=\"goToFirstPage()\"\n class=\"page-link\"\n type=\"button\"\n >\n <svg\n fill=\"currentColor\"\n height=\"24\"\n stroke=\"currentColor\"\n viewBox=\"0 -960 960 960\"\n width=\"24\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M240-240v-480h80v480h-80Zm440 0L440-480l240-240 56 56-184 184 184 184-56 56Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n />\n </svg>\n </button>\n </li>\n <li>\n <button\n [disabled]=\"_currentPage() <= 1\"\n (click)=\"goToPreviousPage()\"\n class=\"page-link\"\n type=\"button\"\n >\n <svg\n fill=\"currentColor\"\n height=\"24\"\n stroke=\"currentColor\"\n viewBox=\"0 -960 960 960\"\n width=\"24\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M560-240 320-480l240-240 56 56-184 184 184 184-56 56Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n />\n </svg>\n </button>\n </li>\n <li>\n <button\n [disabled]=\"_currentPage() >= _totalPages()\"\n (click)=\"goToNextPage()\"\n class=\"page-link\"\n type=\"button\"\n >\n <svg\n fill=\"currentColor\"\n height=\"24\"\n stroke=\"currentColor\"\n viewBox=\"0 -960 960 960\"\n width=\"24\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M504-480 320-664l56-56 240 240-240 240-56-56 184-184Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n />\n </svg>\n </button>\n </li>\n <li>\n <button\n [disabled]=\"_currentPage() >= _totalPages()\"\n (click)=\"goToLastPage()\"\n class=\"page-link\"\n type=\"button\"\n >\n <svg\n fill=\"currentColor\"\n height=\"24\"\n stroke=\"currentColor\"\n viewBox=\"0 -960 960 960\"\n width=\"24\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"m280-240-56-56 184-184-184-184 56-56 240 240-240 240Zm360 0v-480h80v480h-80Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n />\n </svg>\n </button>\n </li>\n </ul>\n </div>\n</div>\n\n<ng-template\n #nextTemplate\n let-currentPage=\"currentPage\"\n let-disabled=\"disabled\"\n>\n <svg\n fill=\"currentColor\"\n fill=\"currentColor\"\n height=\"48\"\n stroke=\"currentColor\"\n viewBox=\"0 -960 960 960\"\n width=\"48\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M530-481 332-679l43-43 241 241-241 241-43-43 198-198Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n />\n </svg>\n</ng-template>\n\n<ng-template\n #prevTemplate\n let-currentPage=\"currentPage\"\n let-disabled=\"disabled\"\n>\n <svg\n fill=\"currentColor\"\n fill=\"currentColor\"\n height=\"48\"\n stroke=\"currentColor\"\n viewBox=\"0 -960 960 960\"\n width=\"48\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M561-240 320-481l241-241 43 43-198 198 198 198-43 43Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n />\n </svg>\n</ng-template>\n\n<ng-template\n #lastTemplate\n let-currentPage=\"currentPage\"\n let-disabled=\"disabled\"\n>\n <svg\n fill=\"currentColor\"\n fill=\"currentColor\"\n height=\"48\"\n stroke=\"currentColor\"\n viewBox=\"0 -960 960 960\"\n width=\"48\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"m272-245-43-43 192-192-192-192 43-43 235 235-235 235Zm388 5v-480h60v480h-60Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n />\n </svg>\n</ng-template>\n\n<ng-template\n #firstTemplate\n let-currentPage=\"currentPage\"\n let-disabled=\"disabled\"\n>\n <svg\n fill=\"currentColor\"\n fill=\"currentColor\"\n height=\"48\"\n stroke=\"currentColor\"\n viewBox=\"0 -960 960 960\"\n width=\"48\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M240-240v-480h60v480h-60Zm447-3L453-477l234-234 43 43-191 191 191 191-43 43Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n />\n </svg>\n</ng-template>\n", styles: [":host{display:block}.paginatorContainer{display:flex;align-items:flex-end;flex-wrap:wrap}@media (min-width: 576px){.paginatorContainer{flex-wrap:nowrap;order:2}}.paginatorContainer .page-size{display:inline-block;margin-bottom:.5rem;order:2;min-width:80px}@media (min-width: 576px){.paginatorContainer .page-size{order:1}}.pagination{margin-bottom:.5rem}.pagination ul{padding:0;margin:0;display:flex}.pagination ul li{list-style-type:none}.pagination ul li.pagination-page{display:none}.pagination ul li .page-link{border-radius:50%;padding:.375rem;border:none;gap:1.5rem;padding:.25rem;background-color:transparent;color:var(--bs-body-color)}.pagination ul li .page-link:disabled svg path{opacity:40%}.pagination ul li .page-link:focus{box-shadow:unset;background-color:unset}.pagination ul li .page-link svg{vertical-align:bottom;width:30px;height:30px}.pagination-label{margin:0;margin-bottom:1rem;font-size:.75rem}\n"] }]
123
123
  }] });
124
124
 
125
125
  class PaginatorModule {
@@ -1 +1 @@
1
- {"version":3,"file":"quang-components-paginator.mjs","sources":["../../../projects/quang/components/paginator/paginatorIntl.ts","../../../projects/quang/components/paginator/paginator-language.service.ts","../../../projects/quang/components/paginator/paginator.component.ts","../../../projects/quang/components/paginator/paginator.component.html","../../../projects/quang/components/paginator/paginator.module.ts","../../../projects/quang/components/paginator/paginator.service.ts","../../../projects/quang/components/paginator/quang-components-paginator.ts"],"sourcesContent":["import { signal, ɵɵFactoryDeclaration, ɵɵInjectableDeclaration } from '@angular/core'\n\nexport class PaginatorIntl {\n readonly changes = signal<any | undefined>(undefined)\n\n itemsPerPageLabel = ''\n\n nextPageLabel = ''\n\n previousPageLabel = ''\n\n firstPageLabel = ''\n\n lastPageLabel = ''\n\n static ɵfac: ɵɵFactoryDeclaration<PaginatorIntl, never>\n\n static ɵprov: ɵɵInjectableDeclaration<PaginatorIntl>\n\n getRangeLabel: ((page: number, pageSize: number, length: number) => string) | undefined\n}\n","import { Injectable } from '@angular/core'\n\nimport { TranslocoService } from '@jsverse/transloco'\n\nimport { PaginatorIntl } from './paginatorIntl'\n\n@Injectable({\n providedIn: 'root',\n})\nexport class QuangPaginatorLanguageService extends PaginatorIntl {\n constructor(private readonly transloco: TranslocoService) {\n super()\n this.transloco.langChanges$.subscribe(() => {\n this.getAndInitTranslations()\n })\n this.getAndInitTranslations()\n }\n\n getAndInitTranslations(): void {\n this.transloco\n .selectTranslate([\n 'quangPaginator.itemsPerPage',\n 'quangPaginator.nextPage',\n 'quangPaginator.previousPage',\n 'quangPaginator.firstPage',\n 'quangPaginator.lastPage',\n ])\n .subscribe((t) => {\n ;[this.itemsPerPageLabel, this.nextPageLabel, this.previousPageLabel, this.firstPageLabel, this.lastPageLabel] =\n t\n this.changes.update((x) => x)\n })\n }\n}\n","import { NgClass, NgFor, NgIf } from '@angular/common'\nimport { ChangeDetectionStrategy, Component, OnInit, computed, input, output, signal } from '@angular/core'\nimport { takeUntilDestroyed, toObservable } from '@angular/core/rxjs-interop'\n\nimport { TranslocoPipe } from '@jsverse/transloco'\n\nimport { makeId } from 'quang/components/shared'\n\n@Component({\n selector: 'quang-paginator',\n imports: [TranslocoPipe, NgIf, NgFor, NgClass],\n templateUrl: './paginator.component.html',\n styleUrl: './paginator.component.scss',\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\n/**\n * Paginator component for handling pagination in lists and tables.\n *\n * This component provides a user interface for navigating through pages of data.\n *\n * @usageNotes\n * `showTotalElementsCount` can be used to show or hide the total number of items.\n */\nexport class QuangPaginatorComponent implements OnInit {\n componentId = input<string>(makeId(10))\n\n componentTabIndex = input<number>(0)\n\n componentClass = input<string | string[]>('')\n\n page = input.required<number>()\n\n pageSize = input.required<number>()\n\n sizeList = input<number[]>([])\n\n totalItems = input.required<number>()\n\n showTotalElementsCount = input<boolean>(true)\n\n totalItemsText = input<string>('quangPaginator.totalItems')\n\n sizeText = input<string>('quangPaginator.size')\n\n pageRangeText = input<string>('quangPaginator.pageRange')\n\n _currentPage = signal<number>(1)\n\n page$ = toObservable(this.page)\n .pipe(takeUntilDestroyed())\n .subscribe((page) => {\n this._currentPage.set(page)\n })\n\n _pageSize = signal<number>(0)\n\n pageSize$ = toObservable(this.pageSize)\n .pipe(takeUntilDestroyed())\n .subscribe((pageSize) => {\n this._pageSize.set(pageSize)\n })\n\n _totalPages = computed(() => Math.ceil(this.totalItems() / this._pageSize()))\n\n changePage = output<number>()\n\n changeSize = output<number>()\n\n ngOnInit(): void {\n this._currentPage.set(this.page())\n this._pageSize.set(this.pageSize())\n }\n\n onChangeSize(event: any): void {\n this._pageSize.set(parseInt(event.target.value))\n this.changeSize.emit(this._pageSize())\n this.goToFirstPage()\n }\n\n goToNextPage(): void {\n this._currentPage.update((page) => page + 1)\n this.changePage.emit(this._currentPage())\n }\n\n goToPreviousPage(): void {\n this._currentPage.update((page) => page - 1)\n this.changePage.emit(this._currentPage())\n }\n\n goToFirstPage(): void {\n this._currentPage.set(1)\n this.changePage.emit(this._currentPage())\n }\n\n goToLastPage(): void {\n this._currentPage.set(this._totalPages())\n this.changePage.emit(this._currentPage())\n }\n}\n","<div\n [id]=\"componentId()\"\n [ngClass]=\"componentClass()\"\n class=\"paginatorContainer\"\n>\n <div\n *ngIf=\"showTotalElementsCount()\"\n class=\"me-3 pagination-label\"\n >\n {{ totalItemsText() | transloco }} {{ totalItems() }}\n </div>\n <div\n *ngIf=\"sizeList().length > 0\"\n class=\"me-3\"\n >\n <label\n class=\"form-label pagination-label mb-0 text-center\"\n for=\"pageSize\"\n >\n {{ sizeText() | transloco }}\n </label>\n <select\n [id]=\"componentId() + '-quang-page-size'\"\n [tabIndex]=\"componentTabIndex()\"\n (change)=\"onChangeSize($event)\"\n #input\n autocomplete=\"off\"\n class=\"form-select page-size\"\n id=\"pageSize\"\n name=\"pageSize\"\n >\n <option\n [selected]=\"pageSize === this._pageSize()\"\n *ngFor=\"let pageSize of sizeList()\"\n >\n {{ pageSize }}\n </option>\n </select>\n </div>\n <div class=\"pagination-label text-center\">\n {{ pageRangeText() | transloco: { page: page(), amountPages: _totalPages() } }}\n </div>\n <div class=\"pagination\">\n <ul>\n <li>\n <button\n [disabled]=\"_currentPage() <= 1\"\n (click)=\"goToFirstPage()\"\n class=\"page-link\"\n type=\"button\"\n >\n <svg\n fill=\"currentColor\"\n height=\"24\"\n stroke=\"currentColor\"\n viewBox=\"0 -960 960 960\"\n width=\"24\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M240-240v-480h80v480h-80Zm440 0L440-480l240-240 56 56-184 184 184 184-56 56Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n />\n </svg>\n </button>\n </li>\n <li>\n <button\n [disabled]=\"_currentPage() <= 1\"\n (click)=\"goToPreviousPage()\"\n class=\"page-link\"\n type=\"button\"\n >\n <svg\n fill=\"currentColor\"\n height=\"24\"\n stroke=\"currentColor\"\n viewBox=\"0 -960 960 960\"\n width=\"24\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M560-240 320-480l240-240 56 56-184 184 184 184-56 56Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n />\n </svg>\n </button>\n </li>\n <li>\n <button\n [disabled]=\"_currentPage() >= _totalPages()\"\n (click)=\"goToNextPage()\"\n class=\"page-link\"\n type=\"button\"\n >\n <svg\n fill=\"currentColor\"\n height=\"24\"\n stroke=\"currentColor\"\n viewBox=\"0 -960 960 960\"\n width=\"24\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M504-480 320-664l56-56 240 240-240 240-56-56 184-184Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n />\n </svg>\n </button>\n </li>\n <li>\n <button\n [disabled]=\"_currentPage() >= _totalPages()\"\n (click)=\"goToLastPage()\"\n class=\"page-link\"\n type=\"button\"\n >\n <svg\n fill=\"currentColor\"\n height=\"24\"\n stroke=\"currentColor\"\n viewBox=\"0 -960 960 960\"\n width=\"24\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"m280-240-56-56 184-184-184-184 56-56 240 240-240 240Zm360 0v-480h80v480h-80Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n />\n </svg>\n </button>\n </li>\n </ul>\n </div>\n</div>\n\n<ng-template\n #nextTemplate\n let-currentPage=\"currentPage\"\n let-disabled=\"disabled\"\n>\n <svg\n fill=\"currentColor\"\n fill=\"currentColor\"\n height=\"48\"\n stroke=\"currentColor\"\n viewBox=\"0 -960 960 960\"\n width=\"48\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M530-481 332-679l43-43 241 241-241 241-43-43 198-198Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n />\n </svg>\n</ng-template>\n\n<ng-template\n #prevTemplate\n let-currentPage=\"currentPage\"\n let-disabled=\"disabled\"\n>\n <svg\n fill=\"currentColor\"\n fill=\"currentColor\"\n height=\"48\"\n stroke=\"currentColor\"\n viewBox=\"0 -960 960 960\"\n width=\"48\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M561-240 320-481l241-241 43 43-198 198 198 198-43 43Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n />\n </svg>\n</ng-template>\n\n<ng-template\n #lastTemplate\n let-currentPage=\"currentPage\"\n let-disabled=\"disabled\"\n>\n <svg\n fill=\"currentColor\"\n fill=\"currentColor\"\n height=\"48\"\n stroke=\"currentColor\"\n viewBox=\"0 -960 960 960\"\n width=\"48\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"m272-245-43-43 192-192-192-192 43-43 235 235-235 235Zm388 5v-480h60v480h-60Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n />\n </svg>\n</ng-template>\n\n<ng-template\n #firstTemplate\n let-currentPage=\"currentPage\"\n let-disabled=\"disabled\"\n>\n <svg\n fill=\"currentColor\"\n fill=\"currentColor\"\n height=\"48\"\n stroke=\"currentColor\"\n viewBox=\"0 -960 960 960\"\n width=\"48\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M240-240v-480h60v480h-60Zm447-3L453-477l234-234 43 43-191 191 191 191-43 43Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n />\n </svg>\n</ng-template>\n","import { CommonModule } from '@angular/common'\nimport { NgModule } from '@angular/core'\n\n@NgModule({\n declarations: [],\n imports: [CommonModule],\n})\nexport class PaginatorModule {}\n","import { Injectable } from '@angular/core'\n\n@Injectable()\nexport class QuangPaginatorService {\n // Returns the portion of the list given the page and the number of items per page\n getPage(list: any[], pageNumber: number, pageSize: number): any[] {\n const start = pageNumber * pageSize\n const end = (pageNumber + 1) * pageSize\n return list.slice(start, end)\n }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"quang-components-paginator.mjs","sources":["../../../projects/quang/components/paginator/paginatorIntl.ts","../../../projects/quang/components/paginator/paginator-language.service.ts","../../../projects/quang/components/paginator/paginator.component.ts","../../../projects/quang/components/paginator/paginator.component.html","../../../projects/quang/components/paginator/paginator.module.ts","../../../projects/quang/components/paginator/paginator.service.ts","../../../projects/quang/components/paginator/quang-components-paginator.ts"],"sourcesContent":["import { signal, ɵɵFactoryDeclaration, ɵɵInjectableDeclaration } from '@angular/core'\n\nexport class PaginatorIntl {\n readonly changes = signal<any | undefined>(undefined)\n\n itemsPerPageLabel = ''\n\n nextPageLabel = ''\n\n previousPageLabel = ''\n\n firstPageLabel = ''\n\n lastPageLabel = ''\n\n static ɵfac: ɵɵFactoryDeclaration<PaginatorIntl, never>\n\n static ɵprov: ɵɵInjectableDeclaration<PaginatorIntl>\n\n getRangeLabel: ((page: number, pageSize: number, length: number) => string) | undefined\n}\n","import { Injectable } from '@angular/core'\n\nimport { TranslocoService } from '@jsverse/transloco'\n\nimport { PaginatorIntl } from './paginatorIntl'\n\n@Injectable({\n providedIn: 'root',\n})\nexport class QuangPaginatorLanguageService extends PaginatorIntl {\n constructor(private readonly transloco: TranslocoService) {\n super()\n this.transloco.langChanges$.subscribe(() => {\n this.getAndInitTranslations()\n })\n this.getAndInitTranslations()\n }\n\n getAndInitTranslations(): void {\n this.transloco\n .selectTranslate([\n 'quangPaginator.itemsPerPage',\n 'quangPaginator.nextPage',\n 'quangPaginator.previousPage',\n 'quangPaginator.firstPage',\n 'quangPaginator.lastPage',\n ])\n .subscribe((t) => {\n ;[this.itemsPerPageLabel, this.nextPageLabel, this.previousPageLabel, this.firstPageLabel, this.lastPageLabel] =\n t\n this.changes.update((x) => x)\n })\n }\n}\n","import { NgClass } from '@angular/common'\nimport { ChangeDetectionStrategy, Component, OnInit, computed, input, output, signal } from '@angular/core'\nimport { takeUntilDestroyed, toObservable } from '@angular/core/rxjs-interop'\n\nimport { TranslocoPipe } from '@jsverse/transloco'\n\nimport { makeId } from 'quang/components/shared'\n\n@Component({\n selector: 'quang-paginator',\n imports: [TranslocoPipe, NgClass],\n templateUrl: './paginator.component.html',\n styleUrl: './paginator.component.scss',\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\n/**\n * Paginator component for handling pagination in lists and tables.\n *\n * This component provides a user interface for navigating through pages of data.\n *\n * @usageNotes\n * `showTotalElementsCount` can be used to show or hide the total number of items.\n */\nexport class QuangPaginatorComponent implements OnInit {\n componentId = input<string>(makeId(10))\n\n componentTabIndex = input<number>(0)\n\n componentClass = input<string | string[]>('')\n\n page = input.required<number>()\n\n pageSize = input.required<number>()\n\n sizeList = input<number[]>([])\n\n totalItems = input.required<number>()\n\n showTotalElementsCount = input<boolean>(true)\n\n totalItemsText = input<string>('quangPaginator.totalItems')\n\n sizeText = input<string>('quangPaginator.size')\n\n pageRangeText = input<string>('quangPaginator.pageRange')\n\n _currentPage = signal<number>(1)\n\n page$ = toObservable(this.page)\n .pipe(takeUntilDestroyed())\n .subscribe((page) => {\n this._currentPage.set(page)\n })\n\n _pageSize = signal<number>(0)\n\n pageSize$ = toObservable(this.pageSize)\n .pipe(takeUntilDestroyed())\n .subscribe((pageSize) => {\n this._pageSize.set(pageSize)\n })\n\n _totalPages = computed(() => Math.ceil(this.totalItems() / this._pageSize()))\n\n changePage = output<number>()\n\n changeSize = output<number>()\n\n ngOnInit(): void {\n this._currentPage.set(this.page())\n this._pageSize.set(this.pageSize())\n }\n\n onChangeSize(event: any): void {\n this._pageSize.set(parseInt(event.target.value))\n this.changeSize.emit(this._pageSize())\n this.goToFirstPage()\n }\n\n goToNextPage(): void {\n this._currentPage.update((page) => page + 1)\n this.changePage.emit(this._currentPage())\n }\n\n goToPreviousPage(): void {\n this._currentPage.update((page) => page - 1)\n this.changePage.emit(this._currentPage())\n }\n\n goToFirstPage(): void {\n this._currentPage.set(1)\n this.changePage.emit(this._currentPage())\n }\n\n goToLastPage(): void {\n this._currentPage.set(this._totalPages())\n this.changePage.emit(this._currentPage())\n }\n}\n","<div\n [id]=\"componentId()\"\n [ngClass]=\"componentClass()\"\n class=\"paginatorContainer\"\n>\n @if (showTotalElementsCount()) {\n <div class=\"me-3 pagination-label\">{{ totalItemsText() | transloco }} {{ totalItems() }}</div>\n }\n @if (sizeList().length > 0) {\n <div class=\"me-3\">\n <label\n class=\"form-label pagination-label mb-0 text-center\"\n for=\"pageSize\"\n >\n {{ sizeText() | transloco }}\n </label>\n <select\n [id]=\"componentId() + '-quang-page-size'\"\n [tabIndex]=\"componentTabIndex()\"\n (change)=\"onChangeSize($event)\"\n #input\n autocomplete=\"off\"\n class=\"form-select page-size\"\n id=\"pageSize\"\n name=\"pageSize\"\n >\n @for (pageSize of sizeList(); track pageSize) {\n <option [selected]=\"pageSize === this._pageSize()\">\n {{ pageSize }}\n </option>\n }\n </select>\n </div>\n }\n <div class=\"pagination-label text-center\">\n {{ pageRangeText() | transloco: { page: page(), amountPages: _totalPages() } }}\n </div>\n <div class=\"pagination\">\n <ul>\n <li>\n <button\n [disabled]=\"_currentPage() <= 1\"\n (click)=\"goToFirstPage()\"\n class=\"page-link\"\n type=\"button\"\n >\n <svg\n fill=\"currentColor\"\n height=\"24\"\n stroke=\"currentColor\"\n viewBox=\"0 -960 960 960\"\n width=\"24\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M240-240v-480h80v480h-80Zm440 0L440-480l240-240 56 56-184 184 184 184-56 56Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n />\n </svg>\n </button>\n </li>\n <li>\n <button\n [disabled]=\"_currentPage() <= 1\"\n (click)=\"goToPreviousPage()\"\n class=\"page-link\"\n type=\"button\"\n >\n <svg\n fill=\"currentColor\"\n height=\"24\"\n stroke=\"currentColor\"\n viewBox=\"0 -960 960 960\"\n width=\"24\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M560-240 320-480l240-240 56 56-184 184 184 184-56 56Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n />\n </svg>\n </button>\n </li>\n <li>\n <button\n [disabled]=\"_currentPage() >= _totalPages()\"\n (click)=\"goToNextPage()\"\n class=\"page-link\"\n type=\"button\"\n >\n <svg\n fill=\"currentColor\"\n height=\"24\"\n stroke=\"currentColor\"\n viewBox=\"0 -960 960 960\"\n width=\"24\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M504-480 320-664l56-56 240 240-240 240-56-56 184-184Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n />\n </svg>\n </button>\n </li>\n <li>\n <button\n [disabled]=\"_currentPage() >= _totalPages()\"\n (click)=\"goToLastPage()\"\n class=\"page-link\"\n type=\"button\"\n >\n <svg\n fill=\"currentColor\"\n height=\"24\"\n stroke=\"currentColor\"\n viewBox=\"0 -960 960 960\"\n width=\"24\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"m280-240-56-56 184-184-184-184 56-56 240 240-240 240Zm360 0v-480h80v480h-80Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n />\n </svg>\n </button>\n </li>\n </ul>\n </div>\n</div>\n\n<ng-template\n #nextTemplate\n let-currentPage=\"currentPage\"\n let-disabled=\"disabled\"\n>\n <svg\n fill=\"currentColor\"\n fill=\"currentColor\"\n height=\"48\"\n stroke=\"currentColor\"\n viewBox=\"0 -960 960 960\"\n width=\"48\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M530-481 332-679l43-43 241 241-241 241-43-43 198-198Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n />\n </svg>\n</ng-template>\n\n<ng-template\n #prevTemplate\n let-currentPage=\"currentPage\"\n let-disabled=\"disabled\"\n>\n <svg\n fill=\"currentColor\"\n fill=\"currentColor\"\n height=\"48\"\n stroke=\"currentColor\"\n viewBox=\"0 -960 960 960\"\n width=\"48\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M561-240 320-481l241-241 43 43-198 198 198 198-43 43Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n />\n </svg>\n</ng-template>\n\n<ng-template\n #lastTemplate\n let-currentPage=\"currentPage\"\n let-disabled=\"disabled\"\n>\n <svg\n fill=\"currentColor\"\n fill=\"currentColor\"\n height=\"48\"\n stroke=\"currentColor\"\n viewBox=\"0 -960 960 960\"\n width=\"48\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"m272-245-43-43 192-192-192-192 43-43 235 235-235 235Zm388 5v-480h60v480h-60Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n />\n </svg>\n</ng-template>\n\n<ng-template\n #firstTemplate\n let-currentPage=\"currentPage\"\n let-disabled=\"disabled\"\n>\n <svg\n fill=\"currentColor\"\n fill=\"currentColor\"\n height=\"48\"\n stroke=\"currentColor\"\n viewBox=\"0 -960 960 960\"\n width=\"48\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M240-240v-480h60v480h-60Zm447-3L453-477l234-234 43 43-191 191 191 191-43 43Z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n />\n </svg>\n</ng-template>\n","import { CommonModule } from '@angular/common'\nimport { NgModule } from '@angular/core'\n\n@NgModule({\n declarations: [],\n imports: [CommonModule],\n})\nexport class PaginatorModule {}\n","import { Injectable } from '@angular/core'\n\n@Injectable()\nexport class QuangPaginatorService {\n // Returns the portion of the list given the page and the number of items per page\n getPage(list: any[], pageNumber: number, pageSize: number): any[] {\n const start = pageNumber * pageSize\n const end = (pageNumber + 1) * pageSize\n return list.slice(start, end)\n }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
@@ -1,4 +1,4 @@
1
- import { NgIf, NgFor, NgClass } from '@angular/common';
1
+ import { NgClass } from '@angular/common';
2
2
  import * as i0 from '@angular/core';
3
3
  import { input, viewChild, signal, computed, forwardRef, ChangeDetectionStrategy, Component } from '@angular/core';
4
4
  import { toObservable, takeUntilDestroyed } from '@angular/core/rxjs-interop';
@@ -108,7 +108,7 @@ class QuangSelectComponent extends QuangBaseComponent {
108
108
  provide: QuangOptionListComponent,
109
109
  multi: false,
110
110
  },
111
- ], viewQueries: [{ propertyName: "selectButton", first: true, predicate: ["selectButton"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div\n (mouseleave)=\"onMouseLeaveCallback()\"\n class=\"mb-3\"\n>\n <label\n [htmlFor]=\"componentId()\"\n *ngIf=\"componentLabel()\"\n class=\"form-label w-100\"\n >\n {{ componentLabel() | transloco }}\n <span [hidden]=\"!_isRequired()\">*</span>\n </label>\n <div\n [class.is-invalid]=\"_ngControl()?.invalid && (_ngControl()?.dirty || _ngControl()?.touched) && errorMap().length\"\n [class.is-valid]=\"_ngControl()?.valid && (_ngControl()?.dirty || _ngControl()?.touched) && successMessage()\"\n class=\"option-list-container\"\n >\n <button\n [attr.required]=\"getIsRequiredControl()\"\n [class.is-invalid]=\"_ngControl()?.invalid && (_ngControl()?.dirty || _ngControl()?.touched) && errorMap().length\"\n [class.is-valid]=\"_ngControl()?.valid && (_ngControl()?.dirty || _ngControl()?.touched) && successMessage()\"\n [disabled]=\"_isDisabled()\"\n [id]=\"componentId()\"\n [ngClass]=\"componentClass()\"\n [tabIndex]=\"componentTabIndex()\"\n (click)=\"changeOptionsVisibility()\"\n #selectButton\n class=\"form-select\"\n type=\"button\"\n >\n <div class=\"content\">\n @if (_selectedItems()?.length) {\n <ng-container *ngFor=\"let val of _selectedItems(); let last = last\">\n {{ translateValue() ? (val.label | transloco) : val.label }}{{ !last ? ', ' : '' }}\n </ng-container>\n } @else {\n <ng-container>{{ componentPlaceholder() | transloco }}</ng-container>\n }\n </div>\n </button>\n\n <quang-option-list\n [_isDisabled]=\"_isDisabled()\"\n [_value]=\"_value()\"\n [componentClass]=\"componentClass()\"\n [componentLabel]=\"componentLabel()\"\n [componentTabIndex]=\"componentTabIndex()\"\n [nullOption]=\"nullOption()\"\n [optionListMaxHeight]=\"optionListMaxHeight()\"\n [parentType]=\"ParentType\"\n [scrollBehaviorOnOpen]=\"scrollBehaviorOnOpen()\"\n [selectButtonRef]=\"selectButton\"\n [selectionMode]=\"selectionMode()\"\n [selectOptions]=\"selectOptions()\"\n [translateValue]=\"translateValue()\"\n (blurHandler)=\"onBlurHandler()\"\n (changedHandler)=\"onChangedHandler($event)\"\n *ngIf=\"_showOptions()\"\n #optionList\n ></quang-option-list>\n </div>\n <div class=\"valid-feedback\">\n {{ successMessage() | transloco }}\n </div>\n <div class=\"invalid-feedback\">\n {{ _currentErrorMessage() | transloco: _currentErrorMessageExtraData() }}\n </div>\n <small\n [hidden]=\"_showSuccess() || _showErrors()\"\n *ngIf=\"helpMessage()\"\n aria-live=\"assertive\"\n class=\"form-text text-muted\"\n >\n {{ helpMessage() | transloco }}\n </small>\n</div>\n", styles: [":host{display:block}:host .option-list-container{position:relative}.form-select{height:2.375rem}.form-select:disabled{background-image:unset}.content{text-align:left;text-overflow:ellipsis;overflow:hidden;white-space:nowrap}\n"], dependencies: [{ kind: "pipe", type: TranslocoPipe, name: "transloco" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: QuangOptionListComponent, selector: "quang-option-list", inputs: ["selectionMode", "optionListMaxHeight", "selectOptions", "selectButtonRef", "_value", "_isDisabled", "componentClass", "componentLabel", "componentTabIndex", "translateValue", "nullOption", "scrollBehaviorOnOpen", "parentType", "parentID"], outputs: ["changedHandler", "blurHandler"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
111
+ ], viewQueries: [{ propertyName: "selectButton", first: true, predicate: ["selectButton"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div\n (mouseleave)=\"onMouseLeaveCallback()\"\n class=\"mb-3\"\n>\n @if (componentLabel()) {\n <label\n [htmlFor]=\"componentId()\"\n class=\"form-label w-100\"\n >\n {{ componentLabel() | transloco }}\n <span [hidden]=\"!_isRequired()\">*</span>\n </label>\n }\n <div\n [class.is-invalid]=\"_ngControl()?.invalid && (_ngControl()?.dirty || _ngControl()?.touched) && errorMap().length\"\n [class.is-valid]=\"_ngControl()?.valid && (_ngControl()?.dirty || _ngControl()?.touched) && successMessage()\"\n class=\"option-list-container\"\n >\n <button\n [attr.required]=\"getIsRequiredControl()\"\n [class.is-invalid]=\"_ngControl()?.invalid && (_ngControl()?.dirty || _ngControl()?.touched) && errorMap().length\"\n [class.is-valid]=\"_ngControl()?.valid && (_ngControl()?.dirty || _ngControl()?.touched) && successMessage()\"\n [disabled]=\"_isDisabled()\"\n [id]=\"componentId()\"\n [ngClass]=\"componentClass()\"\n [tabIndex]=\"componentTabIndex()\"\n (click)=\"changeOptionsVisibility()\"\n #selectButton\n class=\"form-select\"\n type=\"button\"\n >\n <div class=\"content\">\n @if (_selectedItems()?.length) {\n @for (val of _selectedItems(); track val; let last = $last) {\n {{ translateValue() ? (val.label | transloco) : val.label }}{{ !last ? ', ' : '' }}\n }\n } @else {\n <ng-container>{{ componentPlaceholder() | transloco }}</ng-container>\n }\n </div>\n </button>\n\n @if (_showOptions()) {\n <quang-option-list\n [_isDisabled]=\"_isDisabled()\"\n [_value]=\"_value()\"\n [componentClass]=\"componentClass()\"\n [componentLabel]=\"componentLabel()\"\n [componentTabIndex]=\"componentTabIndex()\"\n [nullOption]=\"nullOption()\"\n [optionListMaxHeight]=\"optionListMaxHeight()\"\n [parentType]=\"ParentType\"\n [scrollBehaviorOnOpen]=\"scrollBehaviorOnOpen()\"\n [selectButtonRef]=\"selectButton\"\n [selectionMode]=\"selectionMode()\"\n [selectOptions]=\"selectOptions()\"\n [translateValue]=\"translateValue()\"\n (blurHandler)=\"onBlurHandler()\"\n (changedHandler)=\"onChangedHandler($event)\"\n #optionList\n ></quang-option-list>\n }\n </div>\n <div class=\"valid-feedback\">\n {{ successMessage() | transloco }}\n </div>\n <div class=\"invalid-feedback\">\n {{ _currentErrorMessage() | transloco: _currentErrorMessageExtraData() }}\n </div>\n @if (helpMessage()) {\n <small\n [hidden]=\"_showSuccess() || _showErrors()\"\n aria-live=\"assertive\"\n class=\"form-text text-muted\"\n >\n {{ helpMessage() | transloco }}\n </small>\n }\n</div>\n", styles: [":host{display:block}:host .option-list-container{position:relative}.form-select{height:2.375rem}.form-select:disabled{background-image:unset}.content{text-align:left;text-overflow:ellipsis;overflow:hidden;white-space:nowrap}\n"], dependencies: [{ kind: "pipe", type: TranslocoPipe, name: "transloco" }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: QuangOptionListComponent, selector: "quang-option-list", inputs: ["selectionMode", "optionListMaxHeight", "selectOptions", "selectButtonRef", "_value", "_isDisabled", "componentClass", "componentLabel", "componentTabIndex", "translateValue", "nullOption", "scrollBehaviorOnOpen", "parentType", "parentID"], outputs: ["changedHandler", "blurHandler"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
112
112
  }
113
113
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: QuangSelectComponent, decorators: [{
114
114
  type: Component,
@@ -122,7 +122,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
122
122
  provide: QuangOptionListComponent,
123
123
  multi: false,
124
124
  },
125
- ], imports: [TranslocoPipe, NgIf, NgFor, NgClass, QuangOptionListComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n (mouseleave)=\"onMouseLeaveCallback()\"\n class=\"mb-3\"\n>\n <label\n [htmlFor]=\"componentId()\"\n *ngIf=\"componentLabel()\"\n class=\"form-label w-100\"\n >\n {{ componentLabel() | transloco }}\n <span [hidden]=\"!_isRequired()\">*</span>\n </label>\n <div\n [class.is-invalid]=\"_ngControl()?.invalid && (_ngControl()?.dirty || _ngControl()?.touched) && errorMap().length\"\n [class.is-valid]=\"_ngControl()?.valid && (_ngControl()?.dirty || _ngControl()?.touched) && successMessage()\"\n class=\"option-list-container\"\n >\n <button\n [attr.required]=\"getIsRequiredControl()\"\n [class.is-invalid]=\"_ngControl()?.invalid && (_ngControl()?.dirty || _ngControl()?.touched) && errorMap().length\"\n [class.is-valid]=\"_ngControl()?.valid && (_ngControl()?.dirty || _ngControl()?.touched) && successMessage()\"\n [disabled]=\"_isDisabled()\"\n [id]=\"componentId()\"\n [ngClass]=\"componentClass()\"\n [tabIndex]=\"componentTabIndex()\"\n (click)=\"changeOptionsVisibility()\"\n #selectButton\n class=\"form-select\"\n type=\"button\"\n >\n <div class=\"content\">\n @if (_selectedItems()?.length) {\n <ng-container *ngFor=\"let val of _selectedItems(); let last = last\">\n {{ translateValue() ? (val.label | transloco) : val.label }}{{ !last ? ', ' : '' }}\n </ng-container>\n } @else {\n <ng-container>{{ componentPlaceholder() | transloco }}</ng-container>\n }\n </div>\n </button>\n\n <quang-option-list\n [_isDisabled]=\"_isDisabled()\"\n [_value]=\"_value()\"\n [componentClass]=\"componentClass()\"\n [componentLabel]=\"componentLabel()\"\n [componentTabIndex]=\"componentTabIndex()\"\n [nullOption]=\"nullOption()\"\n [optionListMaxHeight]=\"optionListMaxHeight()\"\n [parentType]=\"ParentType\"\n [scrollBehaviorOnOpen]=\"scrollBehaviorOnOpen()\"\n [selectButtonRef]=\"selectButton\"\n [selectionMode]=\"selectionMode()\"\n [selectOptions]=\"selectOptions()\"\n [translateValue]=\"translateValue()\"\n (blurHandler)=\"onBlurHandler()\"\n (changedHandler)=\"onChangedHandler($event)\"\n *ngIf=\"_showOptions()\"\n #optionList\n ></quang-option-list>\n </div>\n <div class=\"valid-feedback\">\n {{ successMessage() | transloco }}\n </div>\n <div class=\"invalid-feedback\">\n {{ _currentErrorMessage() | transloco: _currentErrorMessageExtraData() }}\n </div>\n <small\n [hidden]=\"_showSuccess() || _showErrors()\"\n *ngIf=\"helpMessage()\"\n aria-live=\"assertive\"\n class=\"form-text text-muted\"\n >\n {{ helpMessage() | transloco }}\n </small>\n</div>\n", styles: [":host{display:block}:host .option-list-container{position:relative}.form-select{height:2.375rem}.form-select:disabled{background-image:unset}.content{text-align:left;text-overflow:ellipsis;overflow:hidden;white-space:nowrap}\n"] }]
125
+ ], imports: [TranslocoPipe, NgClass, QuangOptionListComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n (mouseleave)=\"onMouseLeaveCallback()\"\n class=\"mb-3\"\n>\n @if (componentLabel()) {\n <label\n [htmlFor]=\"componentId()\"\n class=\"form-label w-100\"\n >\n {{ componentLabel() | transloco }}\n <span [hidden]=\"!_isRequired()\">*</span>\n </label>\n }\n <div\n [class.is-invalid]=\"_ngControl()?.invalid && (_ngControl()?.dirty || _ngControl()?.touched) && errorMap().length\"\n [class.is-valid]=\"_ngControl()?.valid && (_ngControl()?.dirty || _ngControl()?.touched) && successMessage()\"\n class=\"option-list-container\"\n >\n <button\n [attr.required]=\"getIsRequiredControl()\"\n [class.is-invalid]=\"_ngControl()?.invalid && (_ngControl()?.dirty || _ngControl()?.touched) && errorMap().length\"\n [class.is-valid]=\"_ngControl()?.valid && (_ngControl()?.dirty || _ngControl()?.touched) && successMessage()\"\n [disabled]=\"_isDisabled()\"\n [id]=\"componentId()\"\n [ngClass]=\"componentClass()\"\n [tabIndex]=\"componentTabIndex()\"\n (click)=\"changeOptionsVisibility()\"\n #selectButton\n class=\"form-select\"\n type=\"button\"\n >\n <div class=\"content\">\n @if (_selectedItems()?.length) {\n @for (val of _selectedItems(); track val; let last = $last) {\n {{ translateValue() ? (val.label | transloco) : val.label }}{{ !last ? ', ' : '' }}\n }\n } @else {\n <ng-container>{{ componentPlaceholder() | transloco }}</ng-container>\n }\n </div>\n </button>\n\n @if (_showOptions()) {\n <quang-option-list\n [_isDisabled]=\"_isDisabled()\"\n [_value]=\"_value()\"\n [componentClass]=\"componentClass()\"\n [componentLabel]=\"componentLabel()\"\n [componentTabIndex]=\"componentTabIndex()\"\n [nullOption]=\"nullOption()\"\n [optionListMaxHeight]=\"optionListMaxHeight()\"\n [parentType]=\"ParentType\"\n [scrollBehaviorOnOpen]=\"scrollBehaviorOnOpen()\"\n [selectButtonRef]=\"selectButton\"\n [selectionMode]=\"selectionMode()\"\n [selectOptions]=\"selectOptions()\"\n [translateValue]=\"translateValue()\"\n (blurHandler)=\"onBlurHandler()\"\n (changedHandler)=\"onChangedHandler($event)\"\n #optionList\n ></quang-option-list>\n }\n </div>\n <div class=\"valid-feedback\">\n {{ successMessage() | transloco }}\n </div>\n <div class=\"invalid-feedback\">\n {{ _currentErrorMessage() | transloco: _currentErrorMessageExtraData() }}\n </div>\n @if (helpMessage()) {\n <small\n [hidden]=\"_showSuccess() || _showErrors()\"\n aria-live=\"assertive\"\n class=\"form-text text-muted\"\n >\n {{ helpMessage() | transloco }}\n </small>\n }\n</div>\n", styles: [":host{display:block}:host .option-list-container{position:relative}.form-select{height:2.375rem}.form-select:disabled{background-image:unset}.content{text-align:left;text-overflow:ellipsis;overflow:hidden;white-space:nowrap}\n"] }]
126
126
  }], ctorParameters: () => [] });
127
127
 
128
128
  /**
@@ -1 +1 @@
1
- {"version":3,"file":"quang-components-select.mjs","sources":["../../../projects/quang/components/select/select.component.ts","../../../projects/quang/components/select/select.component.html","../../../projects/quang/components/select/quang-components-select.ts"],"sourcesContent":["import { NgClass, NgFor, NgIf } from '@angular/common'\nimport {\n AfterViewInit,\n ChangeDetectionStrategy,\n Component,\n ElementRef,\n computed,\n forwardRef,\n input,\n signal,\n viewChild,\n} from '@angular/core'\nimport { takeUntilDestroyed, toObservable } from '@angular/core/rxjs-interop'\nimport { NG_VALUE_ACCESSOR } from '@angular/forms'\n\nimport { TranslocoPipe } from '@jsverse/transloco'\nimport { combineLatest, filter } from 'rxjs'\n\nimport {\n OptionListParentType,\n QuangBaseComponent,\n QuangOptionListComponent,\n SelectOption,\n} from 'quang/components/shared'\n\n@Component({\n selector: 'quang-select',\n templateUrl: './select.component.html',\n styleUrl: './select.component.scss',\n providers: [\n {\n provide: NG_VALUE_ACCESSOR,\n useExisting: forwardRef(() => QuangSelectComponent),\n multi: true,\n },\n {\n provide: QuangOptionListComponent,\n multi: false,\n },\n ],\n imports: [TranslocoPipe, NgIf, NgFor, NgClass, QuangOptionListComponent],\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\n/**\n * Select component for choosing one or multiple options from a dropdown.\n *\n * @usageNotes\n * This component supports both single and multiple selection modes. It can be configured\n * to display a list of options and allows users to select one or more of them by setting the `selectionMode` property to either `single` or `multiple`.\n */\nexport class QuangSelectComponent\n extends QuangBaseComponent<string | number | string[] | number[] | null>\n implements AfterViewInit\n{\n selectionMode = input<'single' | 'multiple'>('single')\n\n /**\n * Set the max height of the selection list before scrolling.\n * Default: 18rem\n * @default 18rem\n */\n optionListMaxHeight = input<string>('18rem')\n\n selectOptions = input.required<SelectOption[]>()\n\n scrollBehaviorOnOpen = input<ScrollBehavior>('smooth')\n\n selectButton = viewChild<ElementRef<HTMLButtonElement>>('selectButton')\n\n _showOptions = signal<boolean>(false)\n\n _optionHideTimeout = signal<any | undefined>(undefined)\n\n _selectedItems = computed(() => {\n if (this._value() !== null) {\n const targetValue = this._value()\n return this.selectOptions().filter((x) => {\n if (Array.isArray(targetValue)) {\n return targetValue.some((k) => k === x.value)\n }\n return targetValue === x.value\n })\n }\n return null\n })\n\n translateValue = input<boolean>(true)\n\n nullOption = input<boolean>(true)\n\n autoSelectSingleOption = input<boolean>(false)\n\n readonly ParentType = OptionListParentType.SELECT\n\n constructor() {\n super()\n combineLatest([toObservable(this.autoSelectSingleOption), toObservable(this.selectOptions)])\n .pipe(\n takeUntilDestroyed(this.destroyRef),\n filter(([autoselect, options]) => autoselect === true && options.length === 1)\n )\n .subscribe(([_, options]) => {\n if (this._value() === null || this._value() === undefined || this._value() === '') {\n this.onChangedHandler(options[0].value)\n }\n })\n }\n\n changeOptionsVisibility(skipTimeout = false): void {\n if (this.isReadonly()) return\n if (this._showOptions()) {\n this._showOptions.set(skipTimeout)\n } else {\n this.showOptionVisibility()\n }\n }\n\n showOptionVisibility(): void {\n if (this._optionHideTimeout()) {\n clearTimeout(this._optionHideTimeout())\n this._optionHideTimeout.set(null)\n }\n this._showOptions.set(true)\n }\n\n hideOptionVisibility(skipTimeout = false): void {\n if (this._optionHideTimeout()) {\n clearTimeout(this._optionHideTimeout())\n }\n this._optionHideTimeout.set(\n setTimeout(\n () => {\n this._showOptions.set(false)\n },\n skipTimeout ? 0 : 50\n )\n )\n }\n\n override onBlurHandler() {\n if (this.selectionMode() === 'single') {\n setTimeout(() => {\n this.hideOptionVisibility()\n super.onBlurHandler()\n }, 100)\n }\n }\n\n override onChangedHandler(value: string | number | string[] | number[] | null): void {\n super.onChangedHandler(value)\n if (this.selectionMode() === 'single') {\n this.hideOptionVisibility()\n }\n }\n\n onMouseLeaveCallback() {\n if (this.selectionMode() === 'multiple') {\n this.hideOptionVisibility()\n }\n }\n}\n","<div\n (mouseleave)=\"onMouseLeaveCallback()\"\n class=\"mb-3\"\n>\n <label\n [htmlFor]=\"componentId()\"\n *ngIf=\"componentLabel()\"\n class=\"form-label w-100\"\n >\n {{ componentLabel() | transloco }}\n <span [hidden]=\"!_isRequired()\">*</span>\n </label>\n <div\n [class.is-invalid]=\"_ngControl()?.invalid && (_ngControl()?.dirty || _ngControl()?.touched) && errorMap().length\"\n [class.is-valid]=\"_ngControl()?.valid && (_ngControl()?.dirty || _ngControl()?.touched) && successMessage()\"\n class=\"option-list-container\"\n >\n <button\n [attr.required]=\"getIsRequiredControl()\"\n [class.is-invalid]=\"_ngControl()?.invalid && (_ngControl()?.dirty || _ngControl()?.touched) && errorMap().length\"\n [class.is-valid]=\"_ngControl()?.valid && (_ngControl()?.dirty || _ngControl()?.touched) && successMessage()\"\n [disabled]=\"_isDisabled()\"\n [id]=\"componentId()\"\n [ngClass]=\"componentClass()\"\n [tabIndex]=\"componentTabIndex()\"\n (click)=\"changeOptionsVisibility()\"\n #selectButton\n class=\"form-select\"\n type=\"button\"\n >\n <div class=\"content\">\n @if (_selectedItems()?.length) {\n <ng-container *ngFor=\"let val of _selectedItems(); let last = last\">\n {{ translateValue() ? (val.label | transloco) : val.label }}{{ !last ? ', ' : '' }}\n </ng-container>\n } @else {\n <ng-container>{{ componentPlaceholder() | transloco }}</ng-container>\n }\n </div>\n </button>\n\n <quang-option-list\n [_isDisabled]=\"_isDisabled()\"\n [_value]=\"_value()\"\n [componentClass]=\"componentClass()\"\n [componentLabel]=\"componentLabel()\"\n [componentTabIndex]=\"componentTabIndex()\"\n [nullOption]=\"nullOption()\"\n [optionListMaxHeight]=\"optionListMaxHeight()\"\n [parentType]=\"ParentType\"\n [scrollBehaviorOnOpen]=\"scrollBehaviorOnOpen()\"\n [selectButtonRef]=\"selectButton\"\n [selectionMode]=\"selectionMode()\"\n [selectOptions]=\"selectOptions()\"\n [translateValue]=\"translateValue()\"\n (blurHandler)=\"onBlurHandler()\"\n (changedHandler)=\"onChangedHandler($event)\"\n *ngIf=\"_showOptions()\"\n #optionList\n ></quang-option-list>\n </div>\n <div class=\"valid-feedback\">\n {{ successMessage() | transloco }}\n </div>\n <div class=\"invalid-feedback\">\n {{ _currentErrorMessage() | transloco: _currentErrorMessageExtraData() }}\n </div>\n <small\n [hidden]=\"_showSuccess() || _showErrors()\"\n *ngIf=\"helpMessage()\"\n aria-live=\"assertive\"\n class=\"form-text text-muted\"\n >\n {{ helpMessage() | transloco }}\n </small>\n</div>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"quang-components-select.mjs","sources":["../../../projects/quang/components/select/select.component.ts","../../../projects/quang/components/select/select.component.html","../../../projects/quang/components/select/quang-components-select.ts"],"sourcesContent":["import { NgClass } from '@angular/common'\nimport {\n AfterViewInit,\n ChangeDetectionStrategy,\n Component,\n ElementRef,\n computed,\n forwardRef,\n input,\n signal,\n viewChild,\n} from '@angular/core'\nimport { takeUntilDestroyed, toObservable } from '@angular/core/rxjs-interop'\nimport { NG_VALUE_ACCESSOR } from '@angular/forms'\n\nimport { TranslocoPipe } from '@jsverse/transloco'\nimport { combineLatest, filter } from 'rxjs'\n\nimport {\n OptionListParentType,\n QuangBaseComponent,\n QuangOptionListComponent,\n SelectOption,\n} from 'quang/components/shared'\n\n@Component({\n selector: 'quang-select',\n templateUrl: './select.component.html',\n styleUrl: './select.component.scss',\n providers: [\n {\n provide: NG_VALUE_ACCESSOR,\n useExisting: forwardRef(() => QuangSelectComponent),\n multi: true,\n },\n {\n provide: QuangOptionListComponent,\n multi: false,\n },\n ],\n imports: [TranslocoPipe, NgClass, QuangOptionListComponent],\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\n/**\n * Select component for choosing one or multiple options from a dropdown.\n *\n * @usageNotes\n * This component supports both single and multiple selection modes. It can be configured\n * to display a list of options and allows users to select one or more of them by setting the `selectionMode` property to either `single` or `multiple`.\n */\nexport class QuangSelectComponent\n extends QuangBaseComponent<string | number | string[] | number[] | null>\n implements AfterViewInit\n{\n selectionMode = input<'single' | 'multiple'>('single')\n\n /**\n * Set the max height of the selection list before scrolling.\n * Default: 18rem\n * @default 18rem\n */\n optionListMaxHeight = input<string>('18rem')\n\n selectOptions = input.required<SelectOption[]>()\n\n scrollBehaviorOnOpen = input<ScrollBehavior>('smooth')\n\n selectButton = viewChild<ElementRef<HTMLButtonElement>>('selectButton')\n\n _showOptions = signal<boolean>(false)\n\n _optionHideTimeout = signal<any | undefined>(undefined)\n\n _selectedItems = computed(() => {\n if (this._value() !== null) {\n const targetValue = this._value()\n return this.selectOptions().filter((x) => {\n if (Array.isArray(targetValue)) {\n return targetValue.some((k) => k === x.value)\n }\n return targetValue === x.value\n })\n }\n return null\n })\n\n translateValue = input<boolean>(true)\n\n nullOption = input<boolean>(true)\n\n autoSelectSingleOption = input<boolean>(false)\n\n readonly ParentType = OptionListParentType.SELECT\n\n constructor() {\n super()\n combineLatest([toObservable(this.autoSelectSingleOption), toObservable(this.selectOptions)])\n .pipe(\n takeUntilDestroyed(this.destroyRef),\n filter(([autoselect, options]) => autoselect === true && options.length === 1)\n )\n .subscribe(([_, options]) => {\n if (this._value() === null || this._value() === undefined || this._value() === '') {\n this.onChangedHandler(options[0].value)\n }\n })\n }\n\n changeOptionsVisibility(skipTimeout = false): void {\n if (this.isReadonly()) return\n if (this._showOptions()) {\n this._showOptions.set(skipTimeout)\n } else {\n this.showOptionVisibility()\n }\n }\n\n showOptionVisibility(): void {\n if (this._optionHideTimeout()) {\n clearTimeout(this._optionHideTimeout())\n this._optionHideTimeout.set(null)\n }\n this._showOptions.set(true)\n }\n\n hideOptionVisibility(skipTimeout = false): void {\n if (this._optionHideTimeout()) {\n clearTimeout(this._optionHideTimeout())\n }\n this._optionHideTimeout.set(\n setTimeout(\n () => {\n this._showOptions.set(false)\n },\n skipTimeout ? 0 : 50\n )\n )\n }\n\n override onBlurHandler() {\n if (this.selectionMode() === 'single') {\n setTimeout(() => {\n this.hideOptionVisibility()\n super.onBlurHandler()\n }, 100)\n }\n }\n\n override onChangedHandler(value: string | number | string[] | number[] | null): void {\n super.onChangedHandler(value)\n if (this.selectionMode() === 'single') {\n this.hideOptionVisibility()\n }\n }\n\n onMouseLeaveCallback() {\n if (this.selectionMode() === 'multiple') {\n this.hideOptionVisibility()\n }\n }\n}\n","<div\n (mouseleave)=\"onMouseLeaveCallback()\"\n class=\"mb-3\"\n>\n @if (componentLabel()) {\n <label\n [htmlFor]=\"componentId()\"\n class=\"form-label w-100\"\n >\n {{ componentLabel() | transloco }}\n <span [hidden]=\"!_isRequired()\">*</span>\n </label>\n }\n <div\n [class.is-invalid]=\"_ngControl()?.invalid && (_ngControl()?.dirty || _ngControl()?.touched) && errorMap().length\"\n [class.is-valid]=\"_ngControl()?.valid && (_ngControl()?.dirty || _ngControl()?.touched) && successMessage()\"\n class=\"option-list-container\"\n >\n <button\n [attr.required]=\"getIsRequiredControl()\"\n [class.is-invalid]=\"_ngControl()?.invalid && (_ngControl()?.dirty || _ngControl()?.touched) && errorMap().length\"\n [class.is-valid]=\"_ngControl()?.valid && (_ngControl()?.dirty || _ngControl()?.touched) && successMessage()\"\n [disabled]=\"_isDisabled()\"\n [id]=\"componentId()\"\n [ngClass]=\"componentClass()\"\n [tabIndex]=\"componentTabIndex()\"\n (click)=\"changeOptionsVisibility()\"\n #selectButton\n class=\"form-select\"\n type=\"button\"\n >\n <div class=\"content\">\n @if (_selectedItems()?.length) {\n @for (val of _selectedItems(); track val; let last = $last) {\n {{ translateValue() ? (val.label | transloco) : val.label }}{{ !last ? ', ' : '' }}\n }\n } @else {\n <ng-container>{{ componentPlaceholder() | transloco }}</ng-container>\n }\n </div>\n </button>\n\n @if (_showOptions()) {\n <quang-option-list\n [_isDisabled]=\"_isDisabled()\"\n [_value]=\"_value()\"\n [componentClass]=\"componentClass()\"\n [componentLabel]=\"componentLabel()\"\n [componentTabIndex]=\"componentTabIndex()\"\n [nullOption]=\"nullOption()\"\n [optionListMaxHeight]=\"optionListMaxHeight()\"\n [parentType]=\"ParentType\"\n [scrollBehaviorOnOpen]=\"scrollBehaviorOnOpen()\"\n [selectButtonRef]=\"selectButton\"\n [selectionMode]=\"selectionMode()\"\n [selectOptions]=\"selectOptions()\"\n [translateValue]=\"translateValue()\"\n (blurHandler)=\"onBlurHandler()\"\n (changedHandler)=\"onChangedHandler($event)\"\n #optionList\n ></quang-option-list>\n }\n </div>\n <div class=\"valid-feedback\">\n {{ successMessage() | transloco }}\n </div>\n <div class=\"invalid-feedback\">\n {{ _currentErrorMessage() | transloco: _currentErrorMessageExtraData() }}\n </div>\n @if (helpMessage()) {\n <small\n [hidden]=\"_showSuccess() || _showErrors()\"\n aria-live=\"assertive\"\n class=\"form-text text-muted\"\n >\n {{ helpMessage() | transloco }}\n </small>\n }\n</div>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
@@ -1,4 +1,4 @@
1
- import { NgIf, NgClass } from '@angular/common';
1
+ import { NgClass } from '@angular/common';
2
2
  import * as i0 from '@angular/core';
3
3
  import { viewChild, input, signal, inject, ChangeDetectorRef, effect, forwardRef, ChangeDetectionStrategy, Component } from '@angular/core';
4
4
  import { toObservable, takeUntilDestroyed } from '@angular/core/rxjs-interop';
@@ -202,13 +202,13 @@ class QuangWysiwygComponent extends QuangBaseComponent {
202
202
  return buttonList;
203
203
  }
204
204
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: QuangWysiwygComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
205
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "19.2.14", type: QuangWysiwygComponent, isStandalone: true, selector: "quang-wysiwyg", inputs: { minHeight: { classPropertyName: "minHeight", publicName: "minHeight", isSignal: true, isRequired: false, transformFunction: null }, font: { classPropertyName: "font", publicName: "font", isSignal: true, isRequired: false, transformFunction: null }, fontSize: { classPropertyName: "fontSize", publicName: "fontSize", isSignal: true, isRequired: false, transformFunction: null }, formatBlock: { classPropertyName: "formatBlock", publicName: "formatBlock", isSignal: true, isRequired: false, transformFunction: null }, paragraphStyle: { classPropertyName: "paragraphStyle", publicName: "paragraphStyle", isSignal: true, isRequired: false, transformFunction: null }, blockquote: { classPropertyName: "blockquote", publicName: "blockquote", isSignal: true, isRequired: false, transformFunction: null }, bold: { classPropertyName: "bold", publicName: "bold", isSignal: true, isRequired: false, transformFunction: null }, underline: { classPropertyName: "underline", publicName: "underline", isSignal: true, isRequired: false, transformFunction: null }, italic: { classPropertyName: "italic", publicName: "italic", isSignal: true, isRequired: false, transformFunction: null }, strike: { classPropertyName: "strike", publicName: "strike", isSignal: true, isRequired: false, transformFunction: null }, fontColor: { classPropertyName: "fontColor", publicName: "fontColor", isSignal: true, isRequired: false, transformFunction: null }, highlightColor: { classPropertyName: "highlightColor", publicName: "highlightColor", isSignal: true, isRequired: false, transformFunction: null }, textStyle: { classPropertyName: "textStyle", publicName: "textStyle", isSignal: true, isRequired: false, transformFunction: null }, removeFormat: { classPropertyName: "removeFormat", publicName: "removeFormat", isSignal: true, isRequired: false, transformFunction: null }, align: { classPropertyName: "align", publicName: "align", isSignal: true, isRequired: false, transformFunction: null }, list: { classPropertyName: "list", publicName: "list", isSignal: true, isRequired: false, transformFunction: null }, table: { classPropertyName: "table", publicName: "table", isSignal: true, isRequired: false, transformFunction: null }, link: { classPropertyName: "link", publicName: "link", isSignal: true, isRequired: false, transformFunction: null }, image: { classPropertyName: "image", publicName: "image", isSignal: true, isRequired: false, transformFunction: null }, fullScreen: { classPropertyName: "fullScreen", publicName: "fullScreen", isSignal: true, isRequired: false, transformFunction: null }, showBlocks: { classPropertyName: "showBlocks", publicName: "showBlocks", isSignal: true, isRequired: false, transformFunction: null }, onImageUploadError: { classPropertyName: "onImageUploadError", publicName: "onImageUploadError", isSignal: true, isRequired: false, transformFunction: null }, onFileDrop: { classPropertyName: "onFileDrop", publicName: "onFileDrop", isSignal: true, isRequired: false, transformFunction: null }, wysiwygOptions: { classPropertyName: "wysiwygOptions", publicName: "wysiwygOptions", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
205
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.14", type: QuangWysiwygComponent, isStandalone: true, selector: "quang-wysiwyg", inputs: { minHeight: { classPropertyName: "minHeight", publicName: "minHeight", isSignal: true, isRequired: false, transformFunction: null }, font: { classPropertyName: "font", publicName: "font", isSignal: true, isRequired: false, transformFunction: null }, fontSize: { classPropertyName: "fontSize", publicName: "fontSize", isSignal: true, isRequired: false, transformFunction: null }, formatBlock: { classPropertyName: "formatBlock", publicName: "formatBlock", isSignal: true, isRequired: false, transformFunction: null }, paragraphStyle: { classPropertyName: "paragraphStyle", publicName: "paragraphStyle", isSignal: true, isRequired: false, transformFunction: null }, blockquote: { classPropertyName: "blockquote", publicName: "blockquote", isSignal: true, isRequired: false, transformFunction: null }, bold: { classPropertyName: "bold", publicName: "bold", isSignal: true, isRequired: false, transformFunction: null }, underline: { classPropertyName: "underline", publicName: "underline", isSignal: true, isRequired: false, transformFunction: null }, italic: { classPropertyName: "italic", publicName: "italic", isSignal: true, isRequired: false, transformFunction: null }, strike: { classPropertyName: "strike", publicName: "strike", isSignal: true, isRequired: false, transformFunction: null }, fontColor: { classPropertyName: "fontColor", publicName: "fontColor", isSignal: true, isRequired: false, transformFunction: null }, highlightColor: { classPropertyName: "highlightColor", publicName: "highlightColor", isSignal: true, isRequired: false, transformFunction: null }, textStyle: { classPropertyName: "textStyle", publicName: "textStyle", isSignal: true, isRequired: false, transformFunction: null }, removeFormat: { classPropertyName: "removeFormat", publicName: "removeFormat", isSignal: true, isRequired: false, transformFunction: null }, align: { classPropertyName: "align", publicName: "align", isSignal: true, isRequired: false, transformFunction: null }, list: { classPropertyName: "list", publicName: "list", isSignal: true, isRequired: false, transformFunction: null }, table: { classPropertyName: "table", publicName: "table", isSignal: true, isRequired: false, transformFunction: null }, link: { classPropertyName: "link", publicName: "link", isSignal: true, isRequired: false, transformFunction: null }, image: { classPropertyName: "image", publicName: "image", isSignal: true, isRequired: false, transformFunction: null }, fullScreen: { classPropertyName: "fullScreen", publicName: "fullScreen", isSignal: true, isRequired: false, transformFunction: null }, showBlocks: { classPropertyName: "showBlocks", publicName: "showBlocks", isSignal: true, isRequired: false, transformFunction: null }, onImageUploadError: { classPropertyName: "onImageUploadError", publicName: "onImageUploadError", isSignal: true, isRequired: false, transformFunction: null }, onFileDrop: { classPropertyName: "onFileDrop", publicName: "onFileDrop", isSignal: true, isRequired: false, transformFunction: null }, wysiwygOptions: { classPropertyName: "wysiwygOptions", publicName: "wysiwygOptions", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
206
206
  {
207
207
  provide: NG_VALUE_ACCESSOR,
208
208
  useExisting: forwardRef(() => QuangWysiwygComponent),
209
209
  multi: true,
210
210
  },
211
- ], viewQueries: [{ propertyName: "_inputForWysiwyg", first: true, predicate: ["inputForWysiwyg"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"mb-3\">\n <label\n [htmlFor]=\"componentId()\"\n *ngIf=\"componentLabel()\"\n class=\"form-label\"\n >\n {{ componentLabel() | transloco }}\n <span [hidden]=\"!_isRequired()\">*</span>\n </label>\n <div\n [class.is-invalid]=\"_showErrors()\"\n [class.is-valid]=\"_showSuccess()\"\n class=\"input-wysiwyg-container is-invalid\"\n >\n <textarea\n [disabled]=\"_isDisabled()\"\n [id]=\"componentId()\"\n [ngClass]=\"componentClass()\"\n [placeholder]=\"componentPlaceholder() | transloco\"\n [readOnly]=\"isReadonly()\"\n [tabIndex]=\"componentTabIndex()\"\n [value]=\"_value()\"\n #inputForWysiwyg\n class=\"form-control\"\n ></textarea>\n </div>\n <div class=\"valid-feedback\">\n {{ successMessage() | transloco }}\n </div>\n <div class=\"invalid-feedback\">\n {{ _currentErrorMessage() | transloco: _currentErrorMessageExtraData() }}\n </div>\n <small\n [hidden]=\"_showSuccess() || _showErrors()\"\n *ngIf=\"helpMessage()\"\n aria-live=\"assertive\"\n class=\"form-text text-muted\"\n >\n {{ helpMessage() | transloco }}\n </small>\n</div>\n", styles: [":host{display:block}::ng-deep .se-toolbar{color:var(--bs-body-color)!important;background-color:var(--bs-body-bg)!important;z-index:unset!important}::ng-deep .se-wrapper-inner{color:var(--bs-body-color)!important;background-color:var(--bs-body-bg)!important}::ng-deep .se-btn{color:var(--bs-body-color)!important}::ng-deep .se-btn:enabled.active{color:var(--bs-primary)!important}::ng-deep .se-btn:hover{background-color:var(--bs-secondary-bg)!important}::ng-deep .se-resizing-bar{color:var(--bs-body-color)!important;background-color:var(--bs-body-bg)!important}::ng-deep .se-navigation{color:var(--bs-body-color)!important;background-color:var(--bs-body-bg)!important}::ng-deep .sun-editor input{display:none}::ng-deep .sun-editor .se-container{border-radius:var(--bs-border-radius)}::ng-deep .se-wrapper{z-index:unset!important}::ng-deep .se-wrapper textarea:disabled+.se-wrapper-wysiwyg{background-color:var(--bs-secondary-bg)}::ng-deep .se-wrapper .se-wrapper-inner{border-top:1px solid var(--bs-border-color)}::ng-deep .is-invalid .sun-editor .se-container .se-toolbar{border-bottom:1px solid var(--bs-danger)}::ng-deep .is-invalid .sun-editor .se-container .se-wrapper .se-wrapper-inner{--bs-form-bg-icon: url(\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23dc3545'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e\");border:1px solid var(--bs-danger);padding-right:3rem;background-position:right .75rem center,center right 2.25rem;background-size:1.5rem,calc(.75em + .375rem) calc(.75em + .375rem);background-image:var(--bs-form-bg-icon);background-repeat:no-repeat}::ng-deep .is-valid .sun-editor .se-container .se-toolbar{border-bottom:1px solid var(--bs-success)}::ng-deep .is-valid .sun-editor .se-container .se-wrapper .se-wrapper-inner{--bs-form-bg-icon: url(\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%23198754' d='M2.3 6.73.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e\");border:1px solid var(--bs-success);padding-right:3rem;background-position:right .75rem center,center right 2.25rem;background-size:1.5rem,calc(.75em + .375rem) calc(.75em + .375rem);background-image:var(--bs-form-bg-icon);background-repeat:no-repeat}\n"], dependencies: [{ kind: "pipe", type: TranslocoPipe, name: "transloco" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
211
+ ], viewQueries: [{ propertyName: "_inputForWysiwyg", first: true, predicate: ["inputForWysiwyg"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"mb-3\">\n @if (componentLabel()) {\n <label\n [htmlFor]=\"componentId()\"\n class=\"form-label\"\n >\n {{ componentLabel() | transloco }}\n <span [hidden]=\"!_isRequired()\">*</span>\n </label>\n }\n <div\n [class.is-invalid]=\"_showErrors()\"\n [class.is-valid]=\"_showSuccess()\"\n class=\"input-wysiwyg-container is-invalid\"\n >\n <textarea\n [disabled]=\"_isDisabled()\"\n [id]=\"componentId()\"\n [ngClass]=\"componentClass()\"\n [placeholder]=\"componentPlaceholder() | transloco\"\n [readOnly]=\"isReadonly()\"\n [tabIndex]=\"componentTabIndex()\"\n [value]=\"_value()\"\n #inputForWysiwyg\n class=\"form-control\"\n ></textarea>\n </div>\n <div class=\"valid-feedback\">\n {{ successMessage() | transloco }}\n </div>\n <div class=\"invalid-feedback\">\n {{ _currentErrorMessage() | transloco: _currentErrorMessageExtraData() }}\n </div>\n @if (helpMessage()) {\n <small\n [hidden]=\"_showSuccess() || _showErrors()\"\n aria-live=\"assertive\"\n class=\"form-text text-muted\"\n >\n {{ helpMessage() | transloco }}\n </small>\n }\n</div>\n", styles: [":host{display:block}::ng-deep .se-toolbar{color:var(--bs-body-color)!important;background-color:var(--bs-body-bg)!important;z-index:unset!important}::ng-deep .se-wrapper-inner{color:var(--bs-body-color)!important;background-color:var(--bs-body-bg)!important}::ng-deep .se-btn{color:var(--bs-body-color)!important}::ng-deep .se-btn:enabled.active{color:var(--bs-primary)!important}::ng-deep .se-btn:hover{background-color:var(--bs-secondary-bg)!important}::ng-deep .se-resizing-bar{color:var(--bs-body-color)!important;background-color:var(--bs-body-bg)!important}::ng-deep .se-navigation{color:var(--bs-body-color)!important;background-color:var(--bs-body-bg)!important}::ng-deep .sun-editor input{display:none}::ng-deep .sun-editor .se-container{border-radius:var(--bs-border-radius)}::ng-deep .se-wrapper{z-index:unset!important}::ng-deep .se-wrapper textarea:disabled+.se-wrapper-wysiwyg{background-color:var(--bs-secondary-bg)}::ng-deep .se-wrapper .se-wrapper-inner{border-top:1px solid var(--bs-border-color)}::ng-deep .is-invalid .sun-editor .se-container .se-toolbar{border-bottom:1px solid var(--bs-danger)}::ng-deep .is-invalid .sun-editor .se-container .se-wrapper .se-wrapper-inner{--bs-form-bg-icon: url(\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23dc3545'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e\");border:1px solid var(--bs-danger);padding-right:3rem;background-position:right .75rem center,center right 2.25rem;background-size:1.5rem,calc(.75em + .375rem) calc(.75em + .375rem);background-image:var(--bs-form-bg-icon);background-repeat:no-repeat}::ng-deep .is-valid .sun-editor .se-container .se-toolbar{border-bottom:1px solid var(--bs-success)}::ng-deep .is-valid .sun-editor .se-container .se-wrapper .se-wrapper-inner{--bs-form-bg-icon: url(\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%23198754' d='M2.3 6.73.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e\");border:1px solid var(--bs-success);padding-right:3rem;background-position:right .75rem center,center right 2.25rem;background-size:1.5rem,calc(.75em + .375rem) calc(.75em + .375rem);background-image:var(--bs-form-bg-icon);background-repeat:no-repeat}\n"], dependencies: [{ kind: "pipe", type: TranslocoPipe, name: "transloco" }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
212
212
  }
213
213
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: QuangWysiwygComponent, decorators: [{
214
214
  type: Component,
@@ -218,7 +218,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
218
218
  useExisting: forwardRef(() => QuangWysiwygComponent),
219
219
  multi: true,
220
220
  },
221
- ], imports: [TranslocoPipe, NgIf, NgClass], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"mb-3\">\n <label\n [htmlFor]=\"componentId()\"\n *ngIf=\"componentLabel()\"\n class=\"form-label\"\n >\n {{ componentLabel() | transloco }}\n <span [hidden]=\"!_isRequired()\">*</span>\n </label>\n <div\n [class.is-invalid]=\"_showErrors()\"\n [class.is-valid]=\"_showSuccess()\"\n class=\"input-wysiwyg-container is-invalid\"\n >\n <textarea\n [disabled]=\"_isDisabled()\"\n [id]=\"componentId()\"\n [ngClass]=\"componentClass()\"\n [placeholder]=\"componentPlaceholder() | transloco\"\n [readOnly]=\"isReadonly()\"\n [tabIndex]=\"componentTabIndex()\"\n [value]=\"_value()\"\n #inputForWysiwyg\n class=\"form-control\"\n ></textarea>\n </div>\n <div class=\"valid-feedback\">\n {{ successMessage() | transloco }}\n </div>\n <div class=\"invalid-feedback\">\n {{ _currentErrorMessage() | transloco: _currentErrorMessageExtraData() }}\n </div>\n <small\n [hidden]=\"_showSuccess() || _showErrors()\"\n *ngIf=\"helpMessage()\"\n aria-live=\"assertive\"\n class=\"form-text text-muted\"\n >\n {{ helpMessage() | transloco }}\n </small>\n</div>\n", styles: [":host{display:block}::ng-deep .se-toolbar{color:var(--bs-body-color)!important;background-color:var(--bs-body-bg)!important;z-index:unset!important}::ng-deep .se-wrapper-inner{color:var(--bs-body-color)!important;background-color:var(--bs-body-bg)!important}::ng-deep .se-btn{color:var(--bs-body-color)!important}::ng-deep .se-btn:enabled.active{color:var(--bs-primary)!important}::ng-deep .se-btn:hover{background-color:var(--bs-secondary-bg)!important}::ng-deep .se-resizing-bar{color:var(--bs-body-color)!important;background-color:var(--bs-body-bg)!important}::ng-deep .se-navigation{color:var(--bs-body-color)!important;background-color:var(--bs-body-bg)!important}::ng-deep .sun-editor input{display:none}::ng-deep .sun-editor .se-container{border-radius:var(--bs-border-radius)}::ng-deep .se-wrapper{z-index:unset!important}::ng-deep .se-wrapper textarea:disabled+.se-wrapper-wysiwyg{background-color:var(--bs-secondary-bg)}::ng-deep .se-wrapper .se-wrapper-inner{border-top:1px solid var(--bs-border-color)}::ng-deep .is-invalid .sun-editor .se-container .se-toolbar{border-bottom:1px solid var(--bs-danger)}::ng-deep .is-invalid .sun-editor .se-container .se-wrapper .se-wrapper-inner{--bs-form-bg-icon: url(\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23dc3545'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e\");border:1px solid var(--bs-danger);padding-right:3rem;background-position:right .75rem center,center right 2.25rem;background-size:1.5rem,calc(.75em + .375rem) calc(.75em + .375rem);background-image:var(--bs-form-bg-icon);background-repeat:no-repeat}::ng-deep .is-valid .sun-editor .se-container .se-toolbar{border-bottom:1px solid var(--bs-success)}::ng-deep .is-valid .sun-editor .se-container .se-wrapper .se-wrapper-inner{--bs-form-bg-icon: url(\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%23198754' d='M2.3 6.73.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e\");border:1px solid var(--bs-success);padding-right:3rem;background-position:right .75rem center,center right 2.25rem;background-size:1.5rem,calc(.75em + .375rem) calc(.75em + .375rem);background-image:var(--bs-form-bg-icon);background-repeat:no-repeat}\n"] }]
221
+ ], imports: [TranslocoPipe, NgClass], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"mb-3\">\n @if (componentLabel()) {\n <label\n [htmlFor]=\"componentId()\"\n class=\"form-label\"\n >\n {{ componentLabel() | transloco }}\n <span [hidden]=\"!_isRequired()\">*</span>\n </label>\n }\n <div\n [class.is-invalid]=\"_showErrors()\"\n [class.is-valid]=\"_showSuccess()\"\n class=\"input-wysiwyg-container is-invalid\"\n >\n <textarea\n [disabled]=\"_isDisabled()\"\n [id]=\"componentId()\"\n [ngClass]=\"componentClass()\"\n [placeholder]=\"componentPlaceholder() | transloco\"\n [readOnly]=\"isReadonly()\"\n [tabIndex]=\"componentTabIndex()\"\n [value]=\"_value()\"\n #inputForWysiwyg\n class=\"form-control\"\n ></textarea>\n </div>\n <div class=\"valid-feedback\">\n {{ successMessage() | transloco }}\n </div>\n <div class=\"invalid-feedback\">\n {{ _currentErrorMessage() | transloco: _currentErrorMessageExtraData() }}\n </div>\n @if (helpMessage()) {\n <small\n [hidden]=\"_showSuccess() || _showErrors()\"\n aria-live=\"assertive\"\n class=\"form-text text-muted\"\n >\n {{ helpMessage() | transloco }}\n </small>\n }\n</div>\n", styles: [":host{display:block}::ng-deep .se-toolbar{color:var(--bs-body-color)!important;background-color:var(--bs-body-bg)!important;z-index:unset!important}::ng-deep .se-wrapper-inner{color:var(--bs-body-color)!important;background-color:var(--bs-body-bg)!important}::ng-deep .se-btn{color:var(--bs-body-color)!important}::ng-deep .se-btn:enabled.active{color:var(--bs-primary)!important}::ng-deep .se-btn:hover{background-color:var(--bs-secondary-bg)!important}::ng-deep .se-resizing-bar{color:var(--bs-body-color)!important;background-color:var(--bs-body-bg)!important}::ng-deep .se-navigation{color:var(--bs-body-color)!important;background-color:var(--bs-body-bg)!important}::ng-deep .sun-editor input{display:none}::ng-deep .sun-editor .se-container{border-radius:var(--bs-border-radius)}::ng-deep .se-wrapper{z-index:unset!important}::ng-deep .se-wrapper textarea:disabled+.se-wrapper-wysiwyg{background-color:var(--bs-secondary-bg)}::ng-deep .se-wrapper .se-wrapper-inner{border-top:1px solid var(--bs-border-color)}::ng-deep .is-invalid .sun-editor .se-container .se-toolbar{border-bottom:1px solid var(--bs-danger)}::ng-deep .is-invalid .sun-editor .se-container .se-wrapper .se-wrapper-inner{--bs-form-bg-icon: url(\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23dc3545'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e\");border:1px solid var(--bs-danger);padding-right:3rem;background-position:right .75rem center,center right 2.25rem;background-size:1.5rem,calc(.75em + .375rem) calc(.75em + .375rem);background-image:var(--bs-form-bg-icon);background-repeat:no-repeat}::ng-deep .is-valid .sun-editor .se-container .se-toolbar{border-bottom:1px solid var(--bs-success)}::ng-deep .is-valid .sun-editor .se-container .se-wrapper .se-wrapper-inner{--bs-form-bg-icon: url(\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%23198754' d='M2.3 6.73.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e\");border:1px solid var(--bs-success);padding-right:3rem;background-position:right .75rem center,center right 2.25rem;background-size:1.5rem,calc(.75em + .375rem) calc(.75em + .375rem);background-image:var(--bs-form-bg-icon);background-repeat:no-repeat}\n"] }]
222
222
  }] });
223
223
 
224
224
  /**
@@ -1 +1 @@
1
- {"version":3,"file":"quang-components-wysiwyg.mjs","sources":["../../../projects/quang/components/wysiwyg/wysiwyg.component.ts","../../../projects/quang/components/wysiwyg/wysiwyg.component.html","../../../projects/quang/components/wysiwyg/quang-components-wysiwyg.ts"],"sourcesContent":["import { NgClass, NgIf } from '@angular/common'\nimport {\n AfterViewInit,\n ChangeDetectionStrategy,\n ChangeDetectorRef,\n Component,\n ElementRef,\n effect,\n forwardRef,\n inject,\n input,\n signal,\n viewChild,\n} from '@angular/core'\nimport { takeUntilDestroyed, toObservable } from '@angular/core/rxjs-interop'\nimport { AbstractControl, NG_VALUE_ACCESSOR, ValidationErrors, Validators } from '@angular/forms'\n\nimport { TranslocoPipe } from '@jsverse/transloco'\nimport { filter, take } from 'rxjs'\nimport sunEditor from 'suneditor'\nimport SunEditorCore from 'suneditor/src/lib/core'\nimport { SunEditorOptions } from 'suneditor/src/options'\nimport plugins from 'suneditor/src/plugins'\n\nimport { QuangBaseComponent } from 'quang/components/shared'\n\nexport type QuangWysiwygOptions = SunEditorOptions\n\n@Component({\n selector: 'quang-wysiwyg',\n templateUrl: './wysiwyg.component.html',\n styleUrl: './wysiwyg.component.scss',\n providers: [\n {\n provide: NG_VALUE_ACCESSOR,\n useExisting: forwardRef(() => QuangWysiwygComponent),\n multi: true,\n },\n ],\n imports: [TranslocoPipe, NgIf, NgClass],\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\n/**\n * WYSIWYG (What You See Is What You Get) component based on {@link https://github.com/JiHong88/SunEditor}.\n *\n * This component provides a rich text editor for users to create and edit HTML content.\n * It supports a wide range of formatting options.\n *\n * @usageNotes\n * The component allows you to show or hide buttons from the WYSIWYG editor.\n * By default, all the available buttons are shown in the editor bar.\n *\n * The height of the editor can be customized by setting the `minHeight` property. By default, it is `200px`.\n */\nexport class QuangWysiwygComponent extends QuangBaseComponent<string> implements AfterViewInit {\n _inputForWysiwyg = viewChild<ElementRef>('inputForWysiwyg')\n\n minHeight = input<string | undefined>('200px')\n\n font = input<boolean>(true)\n\n fontSize = input<boolean>(true)\n\n formatBlock = input<boolean>(true)\n\n paragraphStyle = input<boolean>(true)\n\n blockquote = input<boolean>(true)\n\n bold = input<boolean>(true)\n\n underline = input<boolean>(true)\n\n italic = input<boolean>(true)\n\n strike = input<boolean>(true)\n\n fontColor = input<boolean>(true)\n\n highlightColor = input<boolean>(true)\n\n textStyle = input<boolean>(true)\n\n removeFormat = input<boolean>(true)\n\n align = input<boolean>(true)\n\n list = input<boolean>(true)\n\n table = input<boolean>(true)\n\n link = input<boolean>(true)\n\n image = input<boolean>(true)\n\n fullScreen = input<boolean>(true)\n\n showBlocks = input<boolean>(true)\n\n onImageUploadError = input<(errorMessage: any, result: any, core: any) => boolean>()\n onFileDrop = input<(e: any, cleanData: any, maxCharCount: any, core: any) => boolean>()\n\n wysiwygOptions = input<QuangWysiwygOptions | undefined>(undefined)\n\n _sunEditorWysiwygInstance = signal<SunEditorCore | undefined>(undefined)\n _sunEditorWysiwygInstance$ = toObservable(this._sunEditorWysiwygInstance)\n\n changeDetectorRef = signal(inject(ChangeDetectorRef))\n\n _generateSunEditorWysiwygEffect = effect(() => {\n try {\n const inputForWysiwyg = this._inputForWysiwyg()?.nativeElement\n if (inputForWysiwyg) {\n const sunEditorOptions: SunEditorOptions = {\n plugins,\n defaultTag: 'div',\n buttonList: this._ngControl()?.control?.enabled && !this.isReadonly() ? [this.getButtonList()] : [],\n minHeight: this.minHeight(),\n width: '100%',\n ...(this.wysiwygOptions() ?? {}),\n }\n\n let sunEditorWysiwygInstance = this._sunEditorWysiwygInstance()\n const ngControl = this._ngControl()\n\n if (sunEditorWysiwygInstance) {\n if (ngControl?.control?.enabled) {\n sunEditorWysiwygInstance.enable()\n }\n sunEditorWysiwygInstance.setOptions(sunEditorOptions)\n } else {\n sunEditorWysiwygInstance = sunEditor.create(inputForWysiwyg, sunEditorOptions)\n this._sunEditorWysiwygInstance.set(sunEditorWysiwygInstance)\n }\n\n const imageUploadError = this.onImageUploadError()\n const onFileDrop = this.onFileDrop()\n\n if (imageUploadError && sunEditorWysiwygInstance) {\n sunEditorWysiwygInstance.onImageUploadError = imageUploadError\n }\n if (onFileDrop && sunEditorWysiwygInstance) {\n sunEditorWysiwygInstance.onDrop = onFileDrop\n }\n\n this.registerEvents()\n }\n } catch (_) {\n // we usually end up here when we are in a modal and then it starts in the right way\n }\n })\n\n STRIP_HTML_REGEX = /<[^>]*>/g\n\n registerEvents(): void {\n const sunEditorInstance = this._sunEditorWysiwygInstance()\n if (sunEditorInstance) {\n sunEditorInstance.onChange = (contents) => {\n this.onChangedHandler(contents)\n this.changeDetectorRef().markForCheck()\n }\n sunEditorInstance.onBlur = () => {\n this.onBlurHandler()\n }\n if (this._isDisabled()) {\n sunEditorInstance.disable()\n }\n }\n }\n\n override writeValue(val: string): void {\n super.writeValue(val)\n this._sunEditorWysiwygInstance$\n .pipe(\n takeUntilDestroyed(this.destroyRef),\n filter((x) => !!x),\n take(1)\n )\n .subscribe((sunEditorWysiwygInstance) => {\n if (sunEditorWysiwygInstance) {\n try {\n sunEditorWysiwygInstance.setContents(val)\n } catch (_) {\n // we usually end up here when we are in a modal and then it starts in the right way\n }\n }\n })\n }\n\n validate(control: AbstractControl): ValidationErrors | null {\n if (control.hasValidator(Validators.required) && control.value?.replace(this.STRIP_HTML_REGEX, '') === '') {\n return { required: true }\n }\n return null\n }\n\n override onChangedHandler(value: string): void {\n super.onChangedHandler(value)\n const control = this._ngControl()\n if (control?.control) {\n if (this.validate(control.control)) control.control.setErrors(this.validate(control.control))\n }\n }\n\n getButtonList(): string[] {\n const buttonList: string[] = []\n if (this.font()) {\n buttonList.push('font')\n }\n if (this.fontSize()) {\n buttonList.push('fontSize')\n }\n if (this.formatBlock()) {\n buttonList.push('formatBlock')\n }\n if (this.paragraphStyle()) {\n buttonList.push('paragraphStyle')\n }\n if (this.blockquote()) {\n buttonList.push('blockquote')\n }\n if (this.bold()) {\n buttonList.push('bold')\n }\n if (this.underline()) {\n buttonList.push('underline')\n }\n if (this.italic()) {\n buttonList.push('italic')\n }\n if (this.strike()) {\n buttonList.push('strike')\n }\n if (this.fontColor()) {\n buttonList.push('fontColor')\n }\n if (this.highlightColor()) {\n buttonList.push('hiliteColor')\n }\n if (this.textStyle()) {\n buttonList.push('textStyle')\n }\n if (this.removeFormat()) {\n buttonList.push('removeFormat')\n }\n if (this.align()) {\n buttonList.push('align')\n }\n if (this.list()) {\n buttonList.push('list')\n }\n if (this.table()) {\n buttonList.push('table')\n }\n if (this.link()) {\n buttonList.push('link')\n }\n if (this.image()) {\n buttonList.push('image')\n }\n if (this.fullScreen()) {\n buttonList.push('fullScreen')\n }\n if (this.showBlocks()) {\n buttonList.push('showBlocks')\n }\n return buttonList\n }\n}\n","<div class=\"mb-3\">\n <label\n [htmlFor]=\"componentId()\"\n *ngIf=\"componentLabel()\"\n class=\"form-label\"\n >\n {{ componentLabel() | transloco }}\n <span [hidden]=\"!_isRequired()\">*</span>\n </label>\n <div\n [class.is-invalid]=\"_showErrors()\"\n [class.is-valid]=\"_showSuccess()\"\n class=\"input-wysiwyg-container is-invalid\"\n >\n <textarea\n [disabled]=\"_isDisabled()\"\n [id]=\"componentId()\"\n [ngClass]=\"componentClass()\"\n [placeholder]=\"componentPlaceholder() | transloco\"\n [readOnly]=\"isReadonly()\"\n [tabIndex]=\"componentTabIndex()\"\n [value]=\"_value()\"\n #inputForWysiwyg\n class=\"form-control\"\n ></textarea>\n </div>\n <div class=\"valid-feedback\">\n {{ successMessage() | transloco }}\n </div>\n <div class=\"invalid-feedback\">\n {{ _currentErrorMessage() | transloco: _currentErrorMessageExtraData() }}\n </div>\n <small\n [hidden]=\"_showSuccess() || _showErrors()\"\n *ngIf=\"helpMessage()\"\n aria-live=\"assertive\"\n class=\"form-text text-muted\"\n >\n {{ helpMessage() | transloco }}\n </small>\n</div>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"quang-components-wysiwyg.mjs","sources":["../../../projects/quang/components/wysiwyg/wysiwyg.component.ts","../../../projects/quang/components/wysiwyg/wysiwyg.component.html","../../../projects/quang/components/wysiwyg/quang-components-wysiwyg.ts"],"sourcesContent":["import { NgClass } from '@angular/common'\nimport {\n AfterViewInit,\n ChangeDetectionStrategy,\n ChangeDetectorRef,\n Component,\n ElementRef,\n effect,\n forwardRef,\n inject,\n input,\n signal,\n viewChild,\n} from '@angular/core'\nimport { takeUntilDestroyed, toObservable } from '@angular/core/rxjs-interop'\nimport { AbstractControl, NG_VALUE_ACCESSOR, ValidationErrors, Validators } from '@angular/forms'\n\nimport { TranslocoPipe } from '@jsverse/transloco'\nimport { filter, take } from 'rxjs'\nimport sunEditor from 'suneditor'\nimport SunEditorCore from 'suneditor/src/lib/core'\nimport { SunEditorOptions } from 'suneditor/src/options'\nimport plugins from 'suneditor/src/plugins'\n\nimport { QuangBaseComponent } from 'quang/components/shared'\n\nexport type QuangWysiwygOptions = SunEditorOptions\n\n@Component({\n selector: 'quang-wysiwyg',\n templateUrl: './wysiwyg.component.html',\n styleUrl: './wysiwyg.component.scss',\n providers: [\n {\n provide: NG_VALUE_ACCESSOR,\n useExisting: forwardRef(() => QuangWysiwygComponent),\n multi: true,\n },\n ],\n imports: [TranslocoPipe, NgClass],\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\n/**\n * WYSIWYG (What You See Is What You Get) component based on {@link https://github.com/JiHong88/SunEditor}.\n *\n * This component provides a rich text editor for users to create and edit HTML content.\n * It supports a wide range of formatting options.\n *\n * @usageNotes\n * The component allows you to show or hide buttons from the WYSIWYG editor.\n * By default, all the available buttons are shown in the editor bar.\n *\n * The height of the editor can be customized by setting the `minHeight` property. By default, it is `200px`.\n */\nexport class QuangWysiwygComponent extends QuangBaseComponent<string> implements AfterViewInit {\n _inputForWysiwyg = viewChild<ElementRef>('inputForWysiwyg')\n\n minHeight = input<string | undefined>('200px')\n\n font = input<boolean>(true)\n\n fontSize = input<boolean>(true)\n\n formatBlock = input<boolean>(true)\n\n paragraphStyle = input<boolean>(true)\n\n blockquote = input<boolean>(true)\n\n bold = input<boolean>(true)\n\n underline = input<boolean>(true)\n\n italic = input<boolean>(true)\n\n strike = input<boolean>(true)\n\n fontColor = input<boolean>(true)\n\n highlightColor = input<boolean>(true)\n\n textStyle = input<boolean>(true)\n\n removeFormat = input<boolean>(true)\n\n align = input<boolean>(true)\n\n list = input<boolean>(true)\n\n table = input<boolean>(true)\n\n link = input<boolean>(true)\n\n image = input<boolean>(true)\n\n fullScreen = input<boolean>(true)\n\n showBlocks = input<boolean>(true)\n\n onImageUploadError = input<(errorMessage: any, result: any, core: any) => boolean>()\n onFileDrop = input<(e: any, cleanData: any, maxCharCount: any, core: any) => boolean>()\n\n wysiwygOptions = input<QuangWysiwygOptions | undefined>(undefined)\n\n _sunEditorWysiwygInstance = signal<SunEditorCore | undefined>(undefined)\n _sunEditorWysiwygInstance$ = toObservable(this._sunEditorWysiwygInstance)\n\n changeDetectorRef = signal(inject(ChangeDetectorRef))\n\n _generateSunEditorWysiwygEffect = effect(() => {\n try {\n const inputForWysiwyg = this._inputForWysiwyg()?.nativeElement\n if (inputForWysiwyg) {\n const sunEditorOptions: SunEditorOptions = {\n plugins,\n defaultTag: 'div',\n buttonList: this._ngControl()?.control?.enabled && !this.isReadonly() ? [this.getButtonList()] : [],\n minHeight: this.minHeight(),\n width: '100%',\n ...(this.wysiwygOptions() ?? {}),\n }\n\n let sunEditorWysiwygInstance = this._sunEditorWysiwygInstance()\n const ngControl = this._ngControl()\n\n if (sunEditorWysiwygInstance) {\n if (ngControl?.control?.enabled) {\n sunEditorWysiwygInstance.enable()\n }\n sunEditorWysiwygInstance.setOptions(sunEditorOptions)\n } else {\n sunEditorWysiwygInstance = sunEditor.create(inputForWysiwyg, sunEditorOptions)\n this._sunEditorWysiwygInstance.set(sunEditorWysiwygInstance)\n }\n\n const imageUploadError = this.onImageUploadError()\n const onFileDrop = this.onFileDrop()\n\n if (imageUploadError && sunEditorWysiwygInstance) {\n sunEditorWysiwygInstance.onImageUploadError = imageUploadError\n }\n if (onFileDrop && sunEditorWysiwygInstance) {\n sunEditorWysiwygInstance.onDrop = onFileDrop\n }\n\n this.registerEvents()\n }\n } catch (_) {\n // we usually end up here when we are in a modal and then it starts in the right way\n }\n })\n\n STRIP_HTML_REGEX = /<[^>]*>/g\n\n registerEvents(): void {\n const sunEditorInstance = this._sunEditorWysiwygInstance()\n if (sunEditorInstance) {\n sunEditorInstance.onChange = (contents) => {\n this.onChangedHandler(contents)\n this.changeDetectorRef().markForCheck()\n }\n sunEditorInstance.onBlur = () => {\n this.onBlurHandler()\n }\n if (this._isDisabled()) {\n sunEditorInstance.disable()\n }\n }\n }\n\n override writeValue(val: string): void {\n super.writeValue(val)\n this._sunEditorWysiwygInstance$\n .pipe(\n takeUntilDestroyed(this.destroyRef),\n filter((x) => !!x),\n take(1)\n )\n .subscribe((sunEditorWysiwygInstance) => {\n if (sunEditorWysiwygInstance) {\n try {\n sunEditorWysiwygInstance.setContents(val)\n } catch (_) {\n // we usually end up here when we are in a modal and then it starts in the right way\n }\n }\n })\n }\n\n validate(control: AbstractControl): ValidationErrors | null {\n if (control.hasValidator(Validators.required) && control.value?.replace(this.STRIP_HTML_REGEX, '') === '') {\n return { required: true }\n }\n return null\n }\n\n override onChangedHandler(value: string): void {\n super.onChangedHandler(value)\n const control = this._ngControl()\n if (control?.control) {\n if (this.validate(control.control)) control.control.setErrors(this.validate(control.control))\n }\n }\n\n getButtonList(): string[] {\n const buttonList: string[] = []\n if (this.font()) {\n buttonList.push('font')\n }\n if (this.fontSize()) {\n buttonList.push('fontSize')\n }\n if (this.formatBlock()) {\n buttonList.push('formatBlock')\n }\n if (this.paragraphStyle()) {\n buttonList.push('paragraphStyle')\n }\n if (this.blockquote()) {\n buttonList.push('blockquote')\n }\n if (this.bold()) {\n buttonList.push('bold')\n }\n if (this.underline()) {\n buttonList.push('underline')\n }\n if (this.italic()) {\n buttonList.push('italic')\n }\n if (this.strike()) {\n buttonList.push('strike')\n }\n if (this.fontColor()) {\n buttonList.push('fontColor')\n }\n if (this.highlightColor()) {\n buttonList.push('hiliteColor')\n }\n if (this.textStyle()) {\n buttonList.push('textStyle')\n }\n if (this.removeFormat()) {\n buttonList.push('removeFormat')\n }\n if (this.align()) {\n buttonList.push('align')\n }\n if (this.list()) {\n buttonList.push('list')\n }\n if (this.table()) {\n buttonList.push('table')\n }\n if (this.link()) {\n buttonList.push('link')\n }\n if (this.image()) {\n buttonList.push('image')\n }\n if (this.fullScreen()) {\n buttonList.push('fullScreen')\n }\n if (this.showBlocks()) {\n buttonList.push('showBlocks')\n }\n return buttonList\n }\n}\n","<div class=\"mb-3\">\n @if (componentLabel()) {\n <label\n [htmlFor]=\"componentId()\"\n class=\"form-label\"\n >\n {{ componentLabel() | transloco }}\n <span [hidden]=\"!_isRequired()\">*</span>\n </label>\n }\n <div\n [class.is-invalid]=\"_showErrors()\"\n [class.is-valid]=\"_showSuccess()\"\n class=\"input-wysiwyg-container is-invalid\"\n >\n <textarea\n [disabled]=\"_isDisabled()\"\n [id]=\"componentId()\"\n [ngClass]=\"componentClass()\"\n [placeholder]=\"componentPlaceholder() | transloco\"\n [readOnly]=\"isReadonly()\"\n [tabIndex]=\"componentTabIndex()\"\n [value]=\"_value()\"\n #inputForWysiwyg\n class=\"form-control\"\n ></textarea>\n </div>\n <div class=\"valid-feedback\">\n {{ successMessage() | transloco }}\n </div>\n <div class=\"invalid-feedback\">\n {{ _currentErrorMessage() | transloco: _currentErrorMessageExtraData() }}\n </div>\n @if (helpMessage()) {\n <small\n [hidden]=\"_showSuccess() || _showErrors()\"\n aria-live=\"assertive\"\n class=\"form-text text-muted\"\n >\n {{ helpMessage() | transloco }}\n </small>\n }\n</div>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
@@ -3,7 +3,6 @@ import { computed, Injectable, InjectionToken, inject, input, ChangeDetectionStr
3
3
  import { getExcludedUrlsByMethod, isHttpMethod } from 'quang/shared';
4
4
  import { finalize, map, of, timer, switchAll } from 'rxjs';
5
5
  import { signalState, patchState } from '@ngrx/signals';
6
- import { NgIf } from '@angular/common';
7
6
  import { toObservable, toSignal } from '@angular/core/rxjs-interop';
8
7
  import { quangFeature } from 'quang';
9
8
 
@@ -71,11 +70,11 @@ class QuangLoaderComponent {
71
70
  this.showLoader = toSignal(this.showLoaderBuffer$);
72
71
  }
73
72
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: QuangLoaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
74
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.14", type: QuangLoaderComponent, isStandalone: true, selector: "quang-loader", inputs: { showAtLeastFor: { classPropertyName: "showAtLeastFor", publicName: "showAtLeastFor", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div\n *ngIf=\"showLoader()\"\n class=\"loader-container\"\n>\n <ng-container *ngIf=\"!ref?.children?.length\">\n <span class=\"loader\"></span>\n </ng-container>\n <div #ref>\n <ng-content></ng-content>\n </div>\n</div>\n", styles: [":host{display:block}.loader-container{position:fixed;width:100%;height:100%;display:flex;top:0;left:0;background-color:#00000080;align-items:center;justify-content:center;z-index:99999}.loader-container .loader{width:48px;height:48px;border-radius:50%;display:inline-block;position:relative;border:3px solid;border-color:rgba(255,255,255,.7607843137) rgba(255,255,255,.7607843137) rgba(255,255,255,.7607843137) transparent;box-sizing:border-box;animation:rotation 1s linear infinite}@keyframes rotation{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes rotationBack{0%{transform:rotate(0)}to{transform:rotate(-360deg)}}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
73
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.14", type: QuangLoaderComponent, isStandalone: true, selector: "quang-loader", inputs: { showAtLeastFor: { classPropertyName: "showAtLeastFor", publicName: "showAtLeastFor", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@if (showLoader()) {\n <div class=\"loader-container\">\n @if (!ref?.children?.length) {\n <span class=\"loader\"></span>\n }\n <div #ref>\n <ng-content></ng-content>\n </div>\n </div>\n}\n", styles: [":host{display:block}.loader-container{position:fixed;width:100%;height:100%;display:flex;top:0;left:0;background-color:#00000080;align-items:center;justify-content:center;z-index:99999}.loader-container .loader{width:48px;height:48px;border-radius:50%;display:inline-block;position:relative;border:3px solid;border-color:rgba(255,255,255,.7607843137) rgba(255,255,255,.7607843137) rgba(255,255,255,.7607843137) transparent;box-sizing:border-box;animation:rotation 1s linear infinite}@keyframes rotation{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes rotationBack{0%{transform:rotate(0)}to{transform:rotate(-360deg)}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
75
74
  }
76
75
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: QuangLoaderComponent, decorators: [{
77
76
  type: Component,
78
- args: [{ selector: 'quang-loader', imports: [NgIf], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n *ngIf=\"showLoader()\"\n class=\"loader-container\"\n>\n <ng-container *ngIf=\"!ref?.children?.length\">\n <span class=\"loader\"></span>\n </ng-container>\n <div #ref>\n <ng-content></ng-content>\n </div>\n</div>\n", styles: [":host{display:block}.loader-container{position:fixed;width:100%;height:100%;display:flex;top:0;left:0;background-color:#00000080;align-items:center;justify-content:center;z-index:99999}.loader-container .loader{width:48px;height:48px;border-radius:50%;display:inline-block;position:relative;border:3px solid;border-color:rgba(255,255,255,.7607843137) rgba(255,255,255,.7607843137) rgba(255,255,255,.7607843137) transparent;box-sizing:border-box;animation:rotation 1s linear infinite}@keyframes rotation{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes rotationBack{0%{transform:rotate(0)}to{transform:rotate(-360deg)}}\n"] }]
77
+ args: [{ selector: 'quang-loader', imports: [], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (showLoader()) {\n <div class=\"loader-container\">\n @if (!ref?.children?.length) {\n <span class=\"loader\"></span>\n }\n <div #ref>\n <ng-content></ng-content>\n </div>\n </div>\n}\n", styles: [":host{display:block}.loader-container{position:fixed;width:100%;height:100%;display:flex;top:0;left:0;background-color:#00000080;align-items:center;justify-content:center;z-index:99999}.loader-container .loader{width:48px;height:48px;border-radius:50%;display:inline-block;position:relative;border:3px solid;border-color:rgba(255,255,255,.7607843137) rgba(255,255,255,.7607843137) rgba(255,255,255,.7607843137) transparent;box-sizing:border-box;animation:rotation 1s linear infinite}@keyframes rotation{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes rotationBack{0%{transform:rotate(0)}to{transform:rotate(-360deg)}}\n"] }]
79
78
  }] });
80
79
 
81
80
  /**