@updevs/components 1.0.0-alpha.51 → 1.0.0-alpha.53
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dropdown/dropdown.component.d.ts +1 -0
- package/esm2022/dropdown/dropdown.component.mjs +11 -6
- package/esm2022/form/components/dynamic-field/dynamic-field.component.mjs +3 -3
- package/esm2022/form/models/select-field.model.mjs +1 -1
- package/esm2022/form-controls/select/components/single/select.component.mjs +9 -3
- package/esm2022/form-controls/select/models/abstractions/base-select.component.mjs +8 -5
- package/esm2022/list/list.component.mjs +4 -3
- package/esm2022/list/models/list-item.mjs +1 -1
- package/esm2022/list/models/list-item.model.mjs +7 -2
- package/esm2022/paginator/paginator.component.mjs +1 -1
- package/esm2022/popover/popover.directive.mjs +7 -5
- package/esm2022/table/components/filter-row/filter-row.component.mjs +1 -1
- package/fesm2022/updevs-components-dropdown.mjs +10 -5
- package/fesm2022/updevs-components-dropdown.mjs.map +1 -1
- package/fesm2022/updevs-components-form-controls-select.mjs +15 -6
- package/fesm2022/updevs-components-form-controls-select.mjs.map +1 -1
- package/fesm2022/updevs-components-form.mjs +2 -2
- package/fesm2022/updevs-components-form.mjs.map +1 -1
- package/fesm2022/updevs-components-list.mjs +9 -3
- package/fesm2022/updevs-components-list.mjs.map +1 -1
- package/fesm2022/updevs-components-paginator.mjs +1 -1
- package/fesm2022/updevs-components-paginator.mjs.map +1 -1
- package/fesm2022/updevs-components-popover.mjs +6 -4
- package/fesm2022/updevs-components-popover.mjs.map +1 -1
- package/fesm2022/updevs-components-table.mjs +1 -1
- package/fesm2022/updevs-components-table.mjs.map +1 -1
- package/form/models/select-field.model.d.ts +2 -1
- package/form-controls/select/components/single/select.component.d.ts +3 -1
- package/form-controls/select/models/abstractions/base-select.component.d.ts +1 -0
- package/list/models/list-item.d.ts +1 -0
- package/list/models/list-item.model.d.ts +1 -0
- package/package.json +30 -30
|
@@ -11,7 +11,12 @@ import { UpdIconsModule } from '@updevs/icons';
|
|
|
11
11
|
|
|
12
12
|
class ListItemModel {
|
|
13
13
|
get hasLeftBox() {
|
|
14
|
-
return !!this.leftBoxImage
|
|
14
|
+
return !!this.leftBoxImage
|
|
15
|
+
|| !!this.leftBoxText
|
|
16
|
+
|| !!this.badgeColor
|
|
17
|
+
|| this.hasCheckbox === true
|
|
18
|
+
|| !!this.icon
|
|
19
|
+
|| !!this.leftBoxHtml;
|
|
15
20
|
}
|
|
16
21
|
get hasLeftBadge() {
|
|
17
22
|
return !!this.badgeColor && this.badgePosition === 'left';
|
|
@@ -54,6 +59,7 @@ class ListComponent {
|
|
|
54
59
|
this.setupItems();
|
|
55
60
|
}
|
|
56
61
|
ngOnChanges(changes) {
|
|
62
|
+
this.setupStyle();
|
|
57
63
|
this.updateWrapperClasses();
|
|
58
64
|
if (!!changes['items']) {
|
|
59
65
|
this.setupItems();
|
|
@@ -100,11 +106,11 @@ class ListComponent {
|
|
|
100
106
|
}
|
|
101
107
|
}
|
|
102
108
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.0", ngImport: i0, type: ListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
103
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.1.0", type: ListComponent, selector: "upd-list", inputs: { items: "items", shouldOverflow: "shouldOverflow", isFlush: "isFlush", isVisible: "isVisible", isHoverable: "isHoverable", shouldDisplayItemsCounter: "shouldDisplayItemsCounter", wrapperClasses: "wrapperClasses", maxHeight: "maxHeight" }, outputs: { checkboxChanged: "checkboxChanged", selectedItem: "selectedItem" }, host: { properties: { "class": "this.localWrapperClasses" } }, usesOnChanges: true, ngImport: i0, template: "<ng-container *transloco=\"let t; prefix: 'UpDevs.List'\">\n @for (item of listItems; track item) {\n @if ((item.children?.length || 0) > 0) {\n <div class=\"list-group-header sticky-top\">{{ item.text }}</div>\n @for (child of item.children; track child) {\n <ng-container [ngTemplateOutlet]=\"listItemTpl\" [ngTemplateOutletContext]=\"{item:child}\"></ng-container>\n }\n } @else {\n <ng-container [ngTemplateOutlet]=\"listItemTpl\" [ngTemplateOutletContext]=\"{item:item}\"></ng-container>\n }\n } @empty {\n <div class=\"list-group-item\">\n <upd-icon tablerIcon=\"alert-triangle\" wrapperClasses=\"text-yellow\"></upd-icon>\n {{ t('NoRecordsFound') }}\n </div>\n }\n\n @if (shouldDisplayItemsCounter && listItems.length > 0) {\n <div class=\"list-items-counter bg-muted text-muted-fg\">\n {{ listItems.length }} {{ t(listItems.length === 1 ? 'Item' : 'Items') }}\n </div>\n }\n</ng-container>\n\n<ng-template #listItemTpl let-item=\"item\">\n <div class=\"list-group-item\" [class.list-group-item-action]=\"!item.hasLeftBox\" [class.active]=\"item.isActive\"\n [class.disabled]=\"item.isDisabled\" (click)=\"onSelectItem($event, item)\">\n @if (!item.hasLeftBox) {\n <span>{{ item.text }}</span>\n } @else {\n <div class=\"row\">\n <ng-container [ngTemplateOutlet]=\"leftBoxTpl\" [ngTemplateOutletContext]=\"{item:item}\"></ng-container>\n <div class=\"col text-truncate\">\n @if (!!item.text) {\n <div class=\"text-body d-block\">{{ item.text }}</div>\n }\n @if (!!item.description) {\n <div class=\"text-muted text-truncate mt-n1\">{{ item.description }}</div>\n }\n </div>\n </div>\n }\n </div>\n</ng-template>\n\n<ng-template #leftBoxTpl let-item=\"item\">\n <div class=\"col-auto\">\n @if (!!item.icon) {\n <upd-icon [model]=\"item.icon\"></upd-icon>\n } @else if (item.hasCheckbox) {\n <upd-checkbox (changed)=\"onCheckboxChange(item, $event)\" [isChecked]=\"item.isChecked || false\"\n [isSwitch]=\"item.isSwitch || false\"></upd-checkbox>\n <!-- [wrapperClasses]=\"'dropdown-item' + (item.isDisabled ? ' disabled' : '') +(item.isActive ? ' active' : '')\"-->\n\n } @else if (item.hasLeftBadge) {\n <span class=\"badge bg-{{item.badgeColor}} ms-auto\">{{ item.badgeText }}</span>\n } @else if (!!item.leftBoxImage || !!item.leftBoxText) {\n <a href=\"#\"> <!-- TODO: change. -->\n <span class=\"avatar\" style=\"background-image: url({{item.leftBoxImage}})\">{{ item.leftBoxText }}\n @if (item.hasBottomRightBadge) {\n <span class=\"badge bg-{{item.badgeColor}} ms-auto\">{{ item.badgeText }}</span>\n }\n </span>\n </a>\n }\n </div>\n</ng-template>\n", styles: ["upd-list{width:100%}.list-group-item{cursor:pointer}.list-hidden{display:none!important}.list-items-counter{position:sticky;bottom:0;right:0;float:right;border-top-left-radius:2px;opacity:.6;padding:2px 12px;margin-top:-24px}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoPrefix", "translocoLang", "translocoLoadingTpl"] }, { kind: "component", type: i3.CheckboxComponent, selector: "upd-checkbox", inputs: ["wrapperClasses", "value", "customClasses", "isChecked", "isInline", "isSwitch", "isIndeterminate"], outputs: ["changed", "isCheckedChange", "isIndeterminateChange"] }, { kind: "component", type: i4.IconComponent, selector: "upd-icon", inputs: ["model", "wrapperClasses", "color", "colorClass", "removeDefaultClasses", "customClasses", "tablerIcon", "tablerIconWeight", "tablerIconType", "tablerIconSize", "heroIcon", "heroIconSize", "heroIconType"] }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
109
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.1.0", type: ListComponent, selector: "upd-list", inputs: { items: "items", shouldOverflow: "shouldOverflow", isFlush: "isFlush", isVisible: "isVisible", isHoverable: "isHoverable", shouldDisplayItemsCounter: "shouldDisplayItemsCounter", wrapperClasses: "wrapperClasses", maxHeight: "maxHeight" }, outputs: { checkboxChanged: "checkboxChanged", selectedItem: "selectedItem" }, host: { properties: { "class": "this.localWrapperClasses" } }, usesOnChanges: true, ngImport: i0, template: "<ng-container *transloco=\"let t; prefix: 'UpDevs.List'\">\n @for (item of listItems; track item) {\n @if ((item.children?.length || 0) > 0) {\n <div class=\"list-group-header sticky-top\">{{ item.text }}</div>\n @for (child of item.children; track child) {\n <ng-container [ngTemplateOutlet]=\"listItemTpl\" [ngTemplateOutletContext]=\"{item:child}\"></ng-container>\n }\n } @else {\n <ng-container [ngTemplateOutlet]=\"listItemTpl\" [ngTemplateOutletContext]=\"{item:item}\"></ng-container>\n }\n } @empty {\n <div class=\"list-group-item\">\n <upd-icon tablerIcon=\"alert-triangle\" wrapperClasses=\"text-yellow\"></upd-icon>\n {{ t('NoRecordsFound') }}\n </div>\n }\n\n @if (shouldDisplayItemsCounter && listItems.length > 0) {\n <div class=\"list-items-counter bg-muted text-muted-fg\">\n {{ listItems.length }} {{ t(listItems.length === 1 ? 'Item' : 'Items') }}\n </div>\n }\n</ng-container>\n\n<ng-template #listItemTpl let-item=\"item\">\n <div class=\"list-group-item\" [class.list-group-item-action]=\"!item.hasLeftBox\" [class.active]=\"item.isActive\"\n [class.disabled]=\"item.isDisabled\" (click)=\"onSelectItem($event, item)\">\n @if (!item.hasLeftBox) {\n <span>{{ item.text }}</span>\n } @else {\n <div class=\"row\">\n <ng-container [ngTemplateOutlet]=\"leftBoxTpl\" [ngTemplateOutletContext]=\"{item:item}\"></ng-container>\n <div class=\"col text-truncate align-content-center\">\n @if (!!item.text) {\n <div class=\"text-body d-block\">{{ item.text }}</div>\n }\n @if (!!item.description) {\n <div class=\"text-muted text-truncate mt-n1\">{{ item.description }}</div>\n }\n </div>\n </div>\n }\n </div>\n</ng-template>\n\n<ng-template #leftBoxTpl let-item=\"item\">\n <div class=\"col-auto\">\n @if (!!item.icon) {\n <upd-icon [model]=\"item.icon\"></upd-icon>\n } @else if (item.hasCheckbox) {\n <upd-checkbox (changed)=\"onCheckboxChange(item, $event)\" [isChecked]=\"item.isChecked || false\"\n [isSwitch]=\"item.isSwitch || false\"></upd-checkbox>\n <!-- [wrapperClasses]=\"'dropdown-item' + (item.isDisabled ? ' disabled' : '') +(item.isActive ? ' active' : '')\"-->\n\n } @else if (item.hasLeftBadge) {\n <span class=\"badge bg-{{item.badgeColor}} ms-auto\">{{ item.badgeText }}</span>\n } @else if (!!item.leftBoxImage || !!item.leftBoxText) {\n <a href=\"#\"> <!-- TODO: change. -->\n <span class=\"avatar\" style=\"background-image: url({{item.leftBoxImage}})\">{{ item.leftBoxText }}\n @if (item.hasBottomRightBadge) {\n <span class=\"badge bg-{{item.badgeColor}} ms-auto\">{{ item.badgeText }}</span>\n }\n </span>\n </a>\n } @else if (!!item.leftBoxHtml) {\n <div [innerHTML]=\"item.leftBoxHtml\"></div>\n }\n </div>\n</ng-template>\n", styles: ["upd-list{width:100%}.list-group-item{cursor:pointer}.list-hidden{display:none!important}.list-items-counter{position:sticky;bottom:0;right:0;float:right;border-top-left-radius:2px;opacity:.6;padding:2px 12px;margin-top:-24px}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoPrefix", "translocoLang", "translocoLoadingTpl"] }, { kind: "component", type: i3.CheckboxComponent, selector: "upd-checkbox", inputs: ["wrapperClasses", "value", "customClasses", "isChecked", "isInline", "isSwitch", "isIndeterminate"], outputs: ["changed", "isCheckedChange", "isIndeterminateChange"] }, { kind: "component", type: i4.IconComponent, selector: "upd-icon", inputs: ["model", "wrapperClasses", "color", "colorClass", "removeDefaultClasses", "customClasses", "tablerIcon", "tablerIconWeight", "tablerIconType", "tablerIconSize", "heroIcon", "heroIconSize", "heroIconType"] }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
104
110
|
}
|
|
105
111
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.0", ngImport: i0, type: ListComponent, decorators: [{
|
|
106
112
|
type: Component,
|
|
107
|
-
args: [{ selector: 'upd-list', encapsulation: ViewEncapsulation.None, template: "<ng-container *transloco=\"let t; prefix: 'UpDevs.List'\">\n @for (item of listItems; track item) {\n @if ((item.children?.length || 0) > 0) {\n <div class=\"list-group-header sticky-top\">{{ item.text }}</div>\n @for (child of item.children; track child) {\n <ng-container [ngTemplateOutlet]=\"listItemTpl\" [ngTemplateOutletContext]=\"{item:child}\"></ng-container>\n }\n } @else {\n <ng-container [ngTemplateOutlet]=\"listItemTpl\" [ngTemplateOutletContext]=\"{item:item}\"></ng-container>\n }\n } @empty {\n <div class=\"list-group-item\">\n <upd-icon tablerIcon=\"alert-triangle\" wrapperClasses=\"text-yellow\"></upd-icon>\n {{ t('NoRecordsFound') }}\n </div>\n }\n\n @if (shouldDisplayItemsCounter && listItems.length > 0) {\n <div class=\"list-items-counter bg-muted text-muted-fg\">\n {{ listItems.length }} {{ t(listItems.length === 1 ? 'Item' : 'Items') }}\n </div>\n }\n</ng-container>\n\n<ng-template #listItemTpl let-item=\"item\">\n <div class=\"list-group-item\" [class.list-group-item-action]=\"!item.hasLeftBox\" [class.active]=\"item.isActive\"\n [class.disabled]=\"item.isDisabled\" (click)=\"onSelectItem($event, item)\">\n @if (!item.hasLeftBox) {\n <span>{{ item.text }}</span>\n } @else {\n <div class=\"row\">\n <ng-container [ngTemplateOutlet]=\"leftBoxTpl\" [ngTemplateOutletContext]=\"{item:item}\"></ng-container>\n <div class=\"col text-truncate\">\n @if (!!item.text) {\n <div class=\"text-body d-block\">{{ item.text }}</div>\n }\n @if (!!item.description) {\n <div class=\"text-muted text-truncate mt-n1\">{{ item.description }}</div>\n }\n </div>\n </div>\n }\n </div>\n</ng-template>\n\n<ng-template #leftBoxTpl let-item=\"item\">\n <div class=\"col-auto\">\n @if (!!item.icon) {\n <upd-icon [model]=\"item.icon\"></upd-icon>\n } @else if (item.hasCheckbox) {\n <upd-checkbox (changed)=\"onCheckboxChange(item, $event)\" [isChecked]=\"item.isChecked || false\"\n [isSwitch]=\"item.isSwitch || false\"></upd-checkbox>\n <!-- [wrapperClasses]=\"'dropdown-item' + (item.isDisabled ? ' disabled' : '') +(item.isActive ? ' active' : '')\"-->\n\n } @else if (item.hasLeftBadge) {\n <span class=\"badge bg-{{item.badgeColor}} ms-auto\">{{ item.badgeText }}</span>\n } @else if (!!item.leftBoxImage || !!item.leftBoxText) {\n <a href=\"#\"> <!-- TODO: change. -->\n <span class=\"avatar\" style=\"background-image: url({{item.leftBoxImage}})\">{{ item.leftBoxText }}\n @if (item.hasBottomRightBadge) {\n <span class=\"badge bg-{{item.badgeColor}} ms-auto\">{{ item.badgeText }}</span>\n }\n </span>\n </a>\n }\n </div>\n</ng-template>\n", styles: ["upd-list{width:100%}.list-group-item{cursor:pointer}.list-hidden{display:none!important}.list-items-counter{position:sticky;bottom:0;right:0;float:right;border-top-left-radius:2px;opacity:.6;padding:2px 12px;margin-top:-24px}\n"] }]
|
|
113
|
+
args: [{ selector: 'upd-list', encapsulation: ViewEncapsulation.None, template: "<ng-container *transloco=\"let t; prefix: 'UpDevs.List'\">\n @for (item of listItems; track item) {\n @if ((item.children?.length || 0) > 0) {\n <div class=\"list-group-header sticky-top\">{{ item.text }}</div>\n @for (child of item.children; track child) {\n <ng-container [ngTemplateOutlet]=\"listItemTpl\" [ngTemplateOutletContext]=\"{item:child}\"></ng-container>\n }\n } @else {\n <ng-container [ngTemplateOutlet]=\"listItemTpl\" [ngTemplateOutletContext]=\"{item:item}\"></ng-container>\n }\n } @empty {\n <div class=\"list-group-item\">\n <upd-icon tablerIcon=\"alert-triangle\" wrapperClasses=\"text-yellow\"></upd-icon>\n {{ t('NoRecordsFound') }}\n </div>\n }\n\n @if (shouldDisplayItemsCounter && listItems.length > 0) {\n <div class=\"list-items-counter bg-muted text-muted-fg\">\n {{ listItems.length }} {{ t(listItems.length === 1 ? 'Item' : 'Items') }}\n </div>\n }\n</ng-container>\n\n<ng-template #listItemTpl let-item=\"item\">\n <div class=\"list-group-item\" [class.list-group-item-action]=\"!item.hasLeftBox\" [class.active]=\"item.isActive\"\n [class.disabled]=\"item.isDisabled\" (click)=\"onSelectItem($event, item)\">\n @if (!item.hasLeftBox) {\n <span>{{ item.text }}</span>\n } @else {\n <div class=\"row\">\n <ng-container [ngTemplateOutlet]=\"leftBoxTpl\" [ngTemplateOutletContext]=\"{item:item}\"></ng-container>\n <div class=\"col text-truncate align-content-center\">\n @if (!!item.text) {\n <div class=\"text-body d-block\">{{ item.text }}</div>\n }\n @if (!!item.description) {\n <div class=\"text-muted text-truncate mt-n1\">{{ item.description }}</div>\n }\n </div>\n </div>\n }\n </div>\n</ng-template>\n\n<ng-template #leftBoxTpl let-item=\"item\">\n <div class=\"col-auto\">\n @if (!!item.icon) {\n <upd-icon [model]=\"item.icon\"></upd-icon>\n } @else if (item.hasCheckbox) {\n <upd-checkbox (changed)=\"onCheckboxChange(item, $event)\" [isChecked]=\"item.isChecked || false\"\n [isSwitch]=\"item.isSwitch || false\"></upd-checkbox>\n <!-- [wrapperClasses]=\"'dropdown-item' + (item.isDisabled ? ' disabled' : '') +(item.isActive ? ' active' : '')\"-->\n\n } @else if (item.hasLeftBadge) {\n <span class=\"badge bg-{{item.badgeColor}} ms-auto\">{{ item.badgeText }}</span>\n } @else if (!!item.leftBoxImage || !!item.leftBoxText) {\n <a href=\"#\"> <!-- TODO: change. -->\n <span class=\"avatar\" style=\"background-image: url({{item.leftBoxImage}})\">{{ item.leftBoxText }}\n @if (item.hasBottomRightBadge) {\n <span class=\"badge bg-{{item.badgeColor}} ms-auto\">{{ item.badgeText }}</span>\n }\n </span>\n </a>\n } @else if (!!item.leftBoxHtml) {\n <div [innerHTML]=\"item.leftBoxHtml\"></div>\n }\n </div>\n</ng-template>\n", styles: ["upd-list{width:100%}.list-group-item{cursor:pointer}.list-hidden{display:none!important}.list-items-counter{position:sticky;bottom:0;right:0;float:right;border-top-left-radius:2px;opacity:.6;padding:2px 12px;margin-top:-24px}\n"] }]
|
|
108
114
|
}], propDecorators: { localWrapperClasses: [{
|
|
109
115
|
type: HostBinding,
|
|
110
116
|
args: ['class']
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"updevs-components-list.mjs","sources":["../../../../libs/components/list/src/models/list-item.model.ts","../../../../libs/components/list/src/list.component.ts","../../../../libs/components/list/src/list.component.html","../../../../libs/components/list/src/upd-list.module.ts","../../../../libs/components/list/src/updevs-components-list.ts"],"sourcesContent":["import { IconModel } from '@updevs/icons';\nimport { BgColorStyleType } from '@updevs/sdk/types';\n\nimport { ListItem } from './list-item';\nimport { BadgePositionType } from './badge-position.type';\n\nexport class ListItemModel implements ListItem {\n id?: any;\n text?: string;\n description?: string;\n icon?: IconModel;\n isChecked?: boolean;\n isSwitch?: boolean;\n hasCheckbox?: boolean;\n isDisabled?: boolean;\n isActive?: boolean;\n leftBoxText?: string;\n leftBoxImage?: string;\n badgeColor?: BgColorStyleType;\n badgeText?: string;\n badgePosition?: BadgePositionType;\n children?: ListItemModel[];\n get hasLeftBox(): boolean {\n return !!this.leftBoxImage || !!this.leftBoxText || !!this.badgeColor || this.hasCheckbox === true || !!this.icon;\n }\n get hasLeftBadge(): boolean {\n return !!this.badgeColor && this.badgePosition === 'left';\n }\n get hasBottomRightBadge(): boolean {\n return !!this.badgeColor && this.badgePosition === 'left-box-bottom-right';\n }\n\n constructor(init?: ListItem) {\n Object.assign(this, init);\n }\n}\n","import {\n Component,\n HostBinding,\n Input,\n Renderer2,\n ElementRef,\n OnInit,\n RendererStyleFlags2,\n ViewEncapsulation,\n Output,\n EventEmitter,\n OnChanges,\n SimpleChanges, inject\n} from '@angular/core';\n\nimport { ListItem } from './models/list-item';\nimport { ListItemModel } from './models/list-item.model';\n\n@Component({\n selector: 'upd-list',\n templateUrl: './list.component.html',\n styleUrls: ['./list.component.scss'],\n encapsulation: ViewEncapsulation.None\n})\nexport class ListComponent implements OnInit, OnChanges {\n @HostBinding('class') localWrapperClasses = '';\n\n /**\n * List items.\n * If provided, the single will be considered static.\n */\n @Input() items?: ListItem[];\n /**\n * Whether the content should overflow or not.\n */\n @Input() shouldOverflow = false;\n /**\n * Whether the list will fit the layout of the container.\n * If set to false, the list's round borders will be visible. It'll have a detached behavior.\n */\n @Input() isFlush = true;\n @Input() isVisible = true;\n @Input() isHoverable = false;\n @Input() shouldDisplayItemsCounter = false;\n @Input() wrapperClasses = '';\n /**\n * Maximum height of the component.\n * Note: The unit should also be provided, i.e.: 350px, 35rem, etc.\n */\n @Input() maxHeight?: string;\n\n @Output() readonly checkboxChanged = new EventEmitter<ListItem>();\n @Output() readonly selectedItem = new EventEmitter<ListItem>();\n\n listItems: ListItemModel[] = [];\n currentSelection: ListItem[] = [];\n\n private localBackupItems: ListItem[] = [];\n\n private readonly renderer = inject(Renderer2);\n private readonly elementRef = inject(ElementRef);\n\n ngOnInit(): void {\n this.setupStyle();\n this.updateWrapperClasses();\n this.setupItems();\n }\n\n ngOnChanges(changes: SimpleChanges): void {\n this.updateWrapperClasses();\n\n if (!!changes['items']) {\n this.setupItems();\n }\n }\n\n onCheckboxChange(item: ListItem, isChecked: boolean): void {\n item.isChecked = isChecked;\n this.checkboxChanged.emit(item);\n }\n\n onSelectItem(evt: any, item: ListItem): void {\n evt.stopPropagation();\n this.selectedItem.emit(item);\n }\n\n private setupItems(): void {\n const tempItems: ListItemModel[] = [];\n\n this.items?.forEach(it => {\n const parent = new ListItemModel(it);\n\n if ((it.children?.length || 0) > 0) {\n parent.children = [];\n it.children?.forEach(child => parent.children!.push(new ListItemModel(child)));\n }\n\n tempItems.push(parent);\n });\n\n this.listItems = [...tempItems];\n }\n\n private setupStyle(): void {\n if (!!this.maxHeight) {\n this.renderer.setStyle(this.elementRef.nativeElement, 'max-height', this.maxHeight, RendererStyleFlags2.Important);\n }\n }\n\n private updateWrapperClasses(): void {\n this.localWrapperClasses = 'list-group' + ` ${this.wrapperClasses}`;\n\n if (this.isFlush) {\n this.localWrapperClasses += ' list-group-flush';\n }\n\n if (this.isHoverable) {\n this.localWrapperClasses += ' list-group-hoverable';\n }\n\n if (this.shouldOverflow) {\n this.localWrapperClasses += ' overflow-auto';\n }\n\n if (!this.isVisible) {\n this.localWrapperClasses += ' list-hidden';\n }\n }\n}\n","<ng-container *transloco=\"let t; prefix: 'UpDevs.List'\">\n @for (item of listItems; track item) {\n @if ((item.children?.length || 0) > 0) {\n <div class=\"list-group-header sticky-top\">{{ item.text }}</div>\n @for (child of item.children; track child) {\n <ng-container [ngTemplateOutlet]=\"listItemTpl\" [ngTemplateOutletContext]=\"{item:child}\"></ng-container>\n }\n } @else {\n <ng-container [ngTemplateOutlet]=\"listItemTpl\" [ngTemplateOutletContext]=\"{item:item}\"></ng-container>\n }\n } @empty {\n <div class=\"list-group-item\">\n <upd-icon tablerIcon=\"alert-triangle\" wrapperClasses=\"text-yellow\"></upd-icon>\n {{ t('NoRecordsFound') }}\n </div>\n }\n\n @if (shouldDisplayItemsCounter && listItems.length > 0) {\n <div class=\"list-items-counter bg-muted text-muted-fg\">\n {{ listItems.length }} {{ t(listItems.length === 1 ? 'Item' : 'Items') }}\n </div>\n }\n</ng-container>\n\n<ng-template #listItemTpl let-item=\"item\">\n <div class=\"list-group-item\" [class.list-group-item-action]=\"!item.hasLeftBox\" [class.active]=\"item.isActive\"\n [class.disabled]=\"item.isDisabled\" (click)=\"onSelectItem($event, item)\">\n @if (!item.hasLeftBox) {\n <span>{{ item.text }}</span>\n } @else {\n <div class=\"row\">\n <ng-container [ngTemplateOutlet]=\"leftBoxTpl\" [ngTemplateOutletContext]=\"{item:item}\"></ng-container>\n <div class=\"col text-truncate\">\n @if (!!item.text) {\n <div class=\"text-body d-block\">{{ item.text }}</div>\n }\n @if (!!item.description) {\n <div class=\"text-muted text-truncate mt-n1\">{{ item.description }}</div>\n }\n </div>\n </div>\n }\n </div>\n</ng-template>\n\n<ng-template #leftBoxTpl let-item=\"item\">\n <div class=\"col-auto\">\n @if (!!item.icon) {\n <upd-icon [model]=\"item.icon\"></upd-icon>\n } @else if (item.hasCheckbox) {\n <upd-checkbox (changed)=\"onCheckboxChange(item, $event)\" [isChecked]=\"item.isChecked || false\"\n [isSwitch]=\"item.isSwitch || false\"></upd-checkbox>\n <!-- [wrapperClasses]=\"'dropdown-item' + (item.isDisabled ? ' disabled' : '') +(item.isActive ? ' active' : '')\"-->\n\n } @else if (item.hasLeftBadge) {\n <span class=\"badge bg-{{item.badgeColor}} ms-auto\">{{ item.badgeText }}</span>\n } @else if (!!item.leftBoxImage || !!item.leftBoxText) {\n <a href=\"#\"> <!-- TODO: change. -->\n <span class=\"avatar\" style=\"background-image: url({{item.leftBoxImage}})\">{{ item.leftBoxText }}\n @if (item.hasBottomRightBadge) {\n <span class=\"badge bg-{{item.badgeColor}} ms-auto\">{{ item.badgeText }}</span>\n }\n </span>\n </a>\n }\n </div>\n</ng-template>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { TranslocoService, TranslocoModule } from '@jsverse/transloco';\nimport { UpdCheckboxModule } from '@updevs/components/form-controls/checkbox';\nimport { UpdIconsModule } from '@updevs/icons';\n\nimport * as en from './assets/i18n/en.json';\nimport * as pt from './assets/i18n/pt.json';\nimport { ListComponent } from './list.component';\n\n@NgModule({\n imports: [\n CommonModule,\n TranslocoModule,\n UpdCheckboxModule,\n UpdIconsModule\n ],\n declarations: [\n ListComponent\n ],\n exports: [\n ListComponent\n ]\n})\nexport class UpdListModule {\n constructor(translocoService: TranslocoService) {\n translocoService.setFallbackLangForMissingTranslation({ fallbackLang: 'en' });\n translocoService.setTranslation(en, 'en');\n translocoService.setTranslation(pt, 'pt');\n }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":["i2","en","pt","i1"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"updevs-components-list.mjs","sources":["../../../../libs/components/list/src/models/list-item.model.ts","../../../../libs/components/list/src/list.component.ts","../../../../libs/components/list/src/list.component.html","../../../../libs/components/list/src/upd-list.module.ts","../../../../libs/components/list/src/updevs-components-list.ts"],"sourcesContent":["import { IconModel } from '@updevs/icons';\nimport { BgColorStyleType } from '@updevs/sdk/types';\n\nimport { ListItem } from './list-item';\nimport { BadgePositionType } from './badge-position.type';\n\nexport class ListItemModel implements ListItem {\n id?: any;\n text?: string;\n description?: string;\n icon?: IconModel;\n isChecked?: boolean;\n isSwitch?: boolean;\n hasCheckbox?: boolean;\n isDisabled?: boolean;\n isActive?: boolean;\n leftBoxText?: string;\n leftBoxImage?: string;\n leftBoxHtml?: string;\n badgeColor?: BgColorStyleType;\n badgeText?: string;\n badgePosition?: BadgePositionType;\n children?: ListItemModel[];\n get hasLeftBox(): boolean {\n return !!this.leftBoxImage\n || !!this.leftBoxText\n || !!this.badgeColor\n || this.hasCheckbox === true\n || !!this.icon\n || !!this.leftBoxHtml;\n }\n get hasLeftBadge(): boolean {\n return !!this.badgeColor && this.badgePosition === 'left';\n }\n get hasBottomRightBadge(): boolean {\n return !!this.badgeColor && this.badgePosition === 'left-box-bottom-right';\n }\n\n constructor(init?: ListItem) {\n Object.assign(this, init);\n }\n}\n","import {\n Component,\n HostBinding,\n Input,\n Renderer2,\n ElementRef,\n OnInit,\n RendererStyleFlags2,\n ViewEncapsulation,\n Output,\n EventEmitter,\n OnChanges,\n SimpleChanges, inject\n} from '@angular/core';\n\nimport { ListItem } from './models/list-item';\nimport { ListItemModel } from './models/list-item.model';\n\n@Component({\n selector: 'upd-list',\n templateUrl: './list.component.html',\n styleUrls: ['./list.component.scss'],\n encapsulation: ViewEncapsulation.None\n})\nexport class ListComponent implements OnInit, OnChanges {\n @HostBinding('class') localWrapperClasses = '';\n\n /**\n * List items.\n * If provided, the single will be considered static.\n */\n @Input() items?: ListItem[];\n /**\n * Whether the content should overflow or not.\n */\n @Input() shouldOverflow = false;\n /**\n * Whether the list will fit the layout of the container.\n * If set to false, the list's round borders will be visible. It'll have a detached behavior.\n */\n @Input() isFlush = true;\n @Input() isVisible = true;\n @Input() isHoverable = false;\n @Input() shouldDisplayItemsCounter = false;\n @Input() wrapperClasses = '';\n /**\n * Maximum height of the component.\n * Note: The unit should also be provided, i.e.: 350px, 35rem, etc.\n */\n @Input() maxHeight?: string;\n\n @Output() readonly checkboxChanged = new EventEmitter<ListItem>();\n @Output() readonly selectedItem = new EventEmitter<ListItem>();\n\n listItems: ListItemModel[] = [];\n currentSelection: ListItem[] = [];\n\n private localBackupItems: ListItem[] = [];\n\n private readonly renderer = inject(Renderer2);\n private readonly elementRef = inject(ElementRef);\n\n ngOnInit(): void {\n this.setupStyle();\n this.updateWrapperClasses();\n this.setupItems();\n }\n\n ngOnChanges(changes: SimpleChanges): void {\n this.setupStyle();\n this.updateWrapperClasses();\n\n if (!!changes['items']) {\n this.setupItems();\n }\n }\n\n onCheckboxChange(item: ListItem, isChecked: boolean): void {\n item.isChecked = isChecked;\n this.checkboxChanged.emit(item);\n }\n\n onSelectItem(evt: any, item: ListItem): void {\n evt.stopPropagation();\n this.selectedItem.emit(item);\n }\n\n private setupItems(): void {\n const tempItems: ListItemModel[] = [];\n\n this.items?.forEach(it => {\n const parent = new ListItemModel(it);\n\n if ((it.children?.length || 0) > 0) {\n parent.children = [];\n it.children?.forEach(child => parent.children!.push(new ListItemModel(child)));\n }\n\n tempItems.push(parent);\n });\n\n this.listItems = [...tempItems];\n }\n\n private setupStyle(): void {\n if (!!this.maxHeight) {\n this.renderer.setStyle(this.elementRef.nativeElement, 'max-height', this.maxHeight, RendererStyleFlags2.Important);\n }\n }\n\n private updateWrapperClasses(): void {\n this.localWrapperClasses = 'list-group' + ` ${this.wrapperClasses}`;\n\n if (this.isFlush) {\n this.localWrapperClasses += ' list-group-flush';\n }\n\n if (this.isHoverable) {\n this.localWrapperClasses += ' list-group-hoverable';\n }\n\n if (this.shouldOverflow) {\n this.localWrapperClasses += ' overflow-auto';\n }\n\n if (!this.isVisible) {\n this.localWrapperClasses += ' list-hidden';\n }\n }\n}\n","<ng-container *transloco=\"let t; prefix: 'UpDevs.List'\">\n @for (item of listItems; track item) {\n @if ((item.children?.length || 0) > 0) {\n <div class=\"list-group-header sticky-top\">{{ item.text }}</div>\n @for (child of item.children; track child) {\n <ng-container [ngTemplateOutlet]=\"listItemTpl\" [ngTemplateOutletContext]=\"{item:child}\"></ng-container>\n }\n } @else {\n <ng-container [ngTemplateOutlet]=\"listItemTpl\" [ngTemplateOutletContext]=\"{item:item}\"></ng-container>\n }\n } @empty {\n <div class=\"list-group-item\">\n <upd-icon tablerIcon=\"alert-triangle\" wrapperClasses=\"text-yellow\"></upd-icon>\n {{ t('NoRecordsFound') }}\n </div>\n }\n\n @if (shouldDisplayItemsCounter && listItems.length > 0) {\n <div class=\"list-items-counter bg-muted text-muted-fg\">\n {{ listItems.length }} {{ t(listItems.length === 1 ? 'Item' : 'Items') }}\n </div>\n }\n</ng-container>\n\n<ng-template #listItemTpl let-item=\"item\">\n <div class=\"list-group-item\" [class.list-group-item-action]=\"!item.hasLeftBox\" [class.active]=\"item.isActive\"\n [class.disabled]=\"item.isDisabled\" (click)=\"onSelectItem($event, item)\">\n @if (!item.hasLeftBox) {\n <span>{{ item.text }}</span>\n } @else {\n <div class=\"row\">\n <ng-container [ngTemplateOutlet]=\"leftBoxTpl\" [ngTemplateOutletContext]=\"{item:item}\"></ng-container>\n <div class=\"col text-truncate align-content-center\">\n @if (!!item.text) {\n <div class=\"text-body d-block\">{{ item.text }}</div>\n }\n @if (!!item.description) {\n <div class=\"text-muted text-truncate mt-n1\">{{ item.description }}</div>\n }\n </div>\n </div>\n }\n </div>\n</ng-template>\n\n<ng-template #leftBoxTpl let-item=\"item\">\n <div class=\"col-auto\">\n @if (!!item.icon) {\n <upd-icon [model]=\"item.icon\"></upd-icon>\n } @else if (item.hasCheckbox) {\n <upd-checkbox (changed)=\"onCheckboxChange(item, $event)\" [isChecked]=\"item.isChecked || false\"\n [isSwitch]=\"item.isSwitch || false\"></upd-checkbox>\n <!-- [wrapperClasses]=\"'dropdown-item' + (item.isDisabled ? ' disabled' : '') +(item.isActive ? ' active' : '')\"-->\n\n } @else if (item.hasLeftBadge) {\n <span class=\"badge bg-{{item.badgeColor}} ms-auto\">{{ item.badgeText }}</span>\n } @else if (!!item.leftBoxImage || !!item.leftBoxText) {\n <a href=\"#\"> <!-- TODO: change. -->\n <span class=\"avatar\" style=\"background-image: url({{item.leftBoxImage}})\">{{ item.leftBoxText }}\n @if (item.hasBottomRightBadge) {\n <span class=\"badge bg-{{item.badgeColor}} ms-auto\">{{ item.badgeText }}</span>\n }\n </span>\n </a>\n } @else if (!!item.leftBoxHtml) {\n <div [innerHTML]=\"item.leftBoxHtml\"></div>\n }\n </div>\n</ng-template>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { TranslocoService, TranslocoModule } from '@jsverse/transloco';\nimport { UpdCheckboxModule } from '@updevs/components/form-controls/checkbox';\nimport { UpdIconsModule } from '@updevs/icons';\n\nimport * as en from './assets/i18n/en.json';\nimport * as pt from './assets/i18n/pt.json';\nimport { ListComponent } from './list.component';\n\n@NgModule({\n imports: [\n CommonModule,\n TranslocoModule,\n UpdCheckboxModule,\n UpdIconsModule\n ],\n declarations: [\n ListComponent\n ],\n exports: [\n ListComponent\n ]\n})\nexport class UpdListModule {\n constructor(translocoService: TranslocoService) {\n translocoService.setFallbackLangForMissingTranslation({ fallbackLang: 'en' });\n translocoService.setTranslation(en, 'en');\n translocoService.setTranslation(pt, 'pt');\n }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":["i2","en","pt","i1"],"mappings":"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"}
|
|
@@ -58,7 +58,7 @@ class PaginatorComponent {
|
|
|
58
58
|
this.changed.emit();
|
|
59
59
|
}
|
|
60
60
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.0", ngImport: i0, type: PaginatorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
61
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.1.0", type: PaginatorComponent, selector: "upd-paginator", inputs: { startPageIndex: { classPropertyName: "startPageIndex", publicName: "startPageIndex", isSignal: true, isRequired: false, transformFunction: null }, currentPage: { classPropertyName: "currentPage", publicName: "currentPage", isSignal: true, isRequired: false, transformFunction: null }, wrapperClasses: { classPropertyName: "wrapperClasses", publicName: "wrapperClasses", isSignal: true, isRequired: false, transformFunction: null }, availablePageSizes: { classPropertyName: "availablePageSizes", publicName: "availablePageSizes", isSignal: true, isRequired: false, transformFunction: null }, defaultInitPageSize: { classPropertyName: "defaultInitPageSize", publicName: "defaultInitPageSize", isSignal: true, isRequired: false, transformFunction: null }, pageSize: { classPropertyName: "pageSize", publicName: "pageSize", isSignal: true, isRequired: false, transformFunction: null }, shouldDisplayFirstIcon: { classPropertyName: "shouldDisplayFirstIcon", publicName: "shouldDisplayFirstIcon", isSignal: true, isRequired: false, transformFunction: null }, shouldDisplayFirstText: { classPropertyName: "shouldDisplayFirstText", publicName: "shouldDisplayFirstText", isSignal: true, isRequired: false, transformFunction: null }, shouldDisplayPreviousIcon: { classPropertyName: "shouldDisplayPreviousIcon", publicName: "shouldDisplayPreviousIcon", isSignal: true, isRequired: false, transformFunction: null }, shouldDisplayPreviousText: { classPropertyName: "shouldDisplayPreviousText", publicName: "shouldDisplayPreviousText", isSignal: true, isRequired: false, transformFunction: null }, shouldDisplayNextIcon: { classPropertyName: "shouldDisplayNextIcon", publicName: "shouldDisplayNextIcon", isSignal: true, isRequired: false, transformFunction: null }, shouldDisplayNextText: { classPropertyName: "shouldDisplayNextText", publicName: "shouldDisplayNextText", isSignal: true, isRequired: false, transformFunction: null }, shouldDisplayLastIcon: { classPropertyName: "shouldDisplayLastIcon", publicName: "shouldDisplayLastIcon", isSignal: true, isRequired: false, transformFunction: null }, shouldDisplayLastText: { classPropertyName: "shouldDisplayLastText", publicName: "shouldDisplayLastText", isSignal: true, isRequired: false, transformFunction: null }, previousDescription: { classPropertyName: "previousDescription", publicName: "previousDescription", isSignal: true, isRequired: false, transformFunction: null }, nextDescription: { classPropertyName: "nextDescription", publicName: "nextDescription", isSignal: true, isRequired: false, transformFunction: null }, totalRecords: { classPropertyName: "totalRecords", publicName: "totalRecords", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { changed: "changed", currentPage: "currentPageChange", pageSize: "pageSizeChange" }, host: { properties: { "class": "this.hostClasses" } }, ngImport: i0, template: "<ng-container *transloco=\"let t; prefix: 'UpDevs.Paginator'\">\n <div class=\"d-flex m-0 ms-auto align-items-center\">\n <div class=\"text-secondary me-2\">\n {{ t('ItemsPerPage') }}\n </div>\n <upd-select [items]=\"pageOptions()\" [selected]=\"selectedPageSize()\" (selectedItem)=\"onSelectPageSize($event)\"\n [shouldShowClearButton]=\"false\" [isCompact]=\"true\" [useSystemStyle]=\"true\"></upd-select>\n <p class=\"m-0 text-secondary ms-4\">\n @if (totalRecords() > 0) {\n {{ t('FromToOf', { first: currentFirstDisplayed(), last: currentLastDisplayed(), totalRecords: totalRecords() }) }}\n } @else {\n {{ t('NoRecords') }}\n }\n </p>\n <ul class=\"pagination m-0 ms-4\">\n @if (!previousDescription()) {\n <li class=\"page-item\">\n <upd-button customClasses=\"page-link\" [isLink]=\"true\" [isIcon]=\"!shouldDisplayFirstText()\" colorStyle=\"secondary\"\n [attr.tabindex]=\"isFirstDisabled() ? -1 : 0\" [attr.aria-disabled]=\"isFirstDisabled()\"\n [isDisabled]=\"isPreviousDisabled()\" (clicked)=\"selectPage(startPageIndex())\">\n @if (shouldDisplayFirstIcon()) {\n <upd-icon tablerIcon=\"chevron-left-pipe\"></upd-icon>\n }\n @if (shouldDisplayFirstText()) {\n {{ t('First') }}\n }\n </upd-button>\n </li>\n }\n\n <li class=\"page-item\" [class.page-prev]=\"!!previousDescription()\">\n <upd-button customClasses=\"page-link\" [isLink]=\"true\" [isIcon]=\"!shouldDisplayPreviousText()\" colorStyle=\"secondary\"\n [attr.tabindex]=\"isPreviousDisabled() ? -1 : 0\" [attr.aria-disabled]=\"isPreviousDisabled()\"\n [isDisabled]=\"isPreviousDisabled()\" (clicked)=\"selectPage(currentPage() - 1)\">\n @if (!!previousDescription()) {\n <div class=\"page-item-subtitle\">{{ t('Previous') }}</div>\n <div class=\"page-item-title\">{{ textService.getText(previousDescription()) }}</div>\n } @else {\n @if (shouldDisplayPreviousIcon()) {\n <upd-icon tablerIcon=\"chevron-left\"></upd-icon>\n }\n @if (shouldDisplayPreviousText()) {\n {{ t('PreviousShort') }}\n }\n }\n </upd-button>\n </li>\n\n <li class=\"page-item\" [class.page-next]=\"!!nextDescription()\">\n <upd-button customClasses=\"page-link\" [isLink]=\"true\" [isIcon]=\"!shouldDisplayNextText()\" colorStyle=\"secondary\"\n [attr.tabindex]=\"isNextDisabled() ? -1 : 0\" [attr.aria-disabled]=\"isNextDisabled()\" [isDisabled]=\"isNextDisabled()\"\n (clicked)=\"selectPage(currentPage() + 1)\">\n @if (!!nextDescription()) {\n <div class=\"page-item-subtitle\">{{ t('Next') }}</div>\n <div class=\"page-item-title\">{{ textService.getText(nextDescription()) }}</div>\n } @else {\n @if (shouldDisplayNextText()) {\n {{ t('NextShort') }}\n }\n @if (shouldDisplayNextIcon()) {\n <upd-icon tablerIcon=\"chevron-right\"></upd-icon>\n }\n }\n </upd-button>\n </li>\n\n @if (!nextDescription()) {\n <li class=\"page-item\">\n <upd-button customClasses=\"page-link\" [isLink]=\"true\" [isIcon]=\"!shouldDisplayLastText()\" colorStyle=\"secondary\"\n [attr.tabindex]=\"isLastDisabled() ? -1 : 0\" [attr.aria-disabled]=\"isLastDisabled()\" [isDisabled]=\"isNextDisabled()\"\n (clicked)=\"selectPage(totalPages() - (startPageIndex() === 0 ? 1 : 0))\">\n @if (shouldDisplayLastText()) {\n {{ t('Last') }}\n }\n @if (shouldDisplayLastIcon()) {\n <upd-icon tablerIcon=\"chevron-right-pipe\"></upd-icon>\n }\n </upd-button>\n </li>\n }\n </ul>\n </div>\n</ng-container>\n", styles: [""], dependencies: [{ kind: "component", type: i1.IconComponent, selector: "upd-icon", inputs: ["model", "wrapperClasses", "color", "colorClass", "removeDefaultClasses", "customClasses", "tablerIcon", "tablerIconWeight", "tablerIconType", "tablerIconSize", "heroIcon", "heroIconSize", "heroIconType"] }, { kind: "component", type: i2.ButtonComponent, selector: "upd-button", inputs: ["model", "text", "brandColorStyle", "customClasses", "isOutline", "isGhost", "isSquare", "isPill", "isIcon", "isLoading", "isList", "isFloating", "isAction", "isNavigationLink", "isLink", "shouldIgnoreBtnClass", "iconModel", "iconPosition", "isDisabled", "isActive", "badgeConfig", "colorStyle", "size", "title"], outputs: ["clicked"] }, { kind: "component", type: i3.SelectComponent, selector: "upd-select", inputs: ["useSystemStyle", "shouldShowClearButton", "isCompact", "selected"], outputs: ["selectedItem"] }, { kind: "directive", type: i1$1.TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoPrefix", "translocoLang", "translocoLoadingTpl"] }] }); }
|
|
61
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.1.0", type: PaginatorComponent, selector: "upd-paginator", inputs: { startPageIndex: { classPropertyName: "startPageIndex", publicName: "startPageIndex", isSignal: true, isRequired: false, transformFunction: null }, currentPage: { classPropertyName: "currentPage", publicName: "currentPage", isSignal: true, isRequired: false, transformFunction: null }, wrapperClasses: { classPropertyName: "wrapperClasses", publicName: "wrapperClasses", isSignal: true, isRequired: false, transformFunction: null }, availablePageSizes: { classPropertyName: "availablePageSizes", publicName: "availablePageSizes", isSignal: true, isRequired: false, transformFunction: null }, defaultInitPageSize: { classPropertyName: "defaultInitPageSize", publicName: "defaultInitPageSize", isSignal: true, isRequired: false, transformFunction: null }, pageSize: { classPropertyName: "pageSize", publicName: "pageSize", isSignal: true, isRequired: false, transformFunction: null }, shouldDisplayFirstIcon: { classPropertyName: "shouldDisplayFirstIcon", publicName: "shouldDisplayFirstIcon", isSignal: true, isRequired: false, transformFunction: null }, shouldDisplayFirstText: { classPropertyName: "shouldDisplayFirstText", publicName: "shouldDisplayFirstText", isSignal: true, isRequired: false, transformFunction: null }, shouldDisplayPreviousIcon: { classPropertyName: "shouldDisplayPreviousIcon", publicName: "shouldDisplayPreviousIcon", isSignal: true, isRequired: false, transformFunction: null }, shouldDisplayPreviousText: { classPropertyName: "shouldDisplayPreviousText", publicName: "shouldDisplayPreviousText", isSignal: true, isRequired: false, transformFunction: null }, shouldDisplayNextIcon: { classPropertyName: "shouldDisplayNextIcon", publicName: "shouldDisplayNextIcon", isSignal: true, isRequired: false, transformFunction: null }, shouldDisplayNextText: { classPropertyName: "shouldDisplayNextText", publicName: "shouldDisplayNextText", isSignal: true, isRequired: false, transformFunction: null }, shouldDisplayLastIcon: { classPropertyName: "shouldDisplayLastIcon", publicName: "shouldDisplayLastIcon", isSignal: true, isRequired: false, transformFunction: null }, shouldDisplayLastText: { classPropertyName: "shouldDisplayLastText", publicName: "shouldDisplayLastText", isSignal: true, isRequired: false, transformFunction: null }, previousDescription: { classPropertyName: "previousDescription", publicName: "previousDescription", isSignal: true, isRequired: false, transformFunction: null }, nextDescription: { classPropertyName: "nextDescription", publicName: "nextDescription", isSignal: true, isRequired: false, transformFunction: null }, totalRecords: { classPropertyName: "totalRecords", publicName: "totalRecords", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { changed: "changed", currentPage: "currentPageChange", pageSize: "pageSizeChange" }, host: { properties: { "class": "this.hostClasses" } }, ngImport: i0, template: "<ng-container *transloco=\"let t; prefix: 'UpDevs.Paginator'\">\n <div class=\"d-flex m-0 ms-auto align-items-center\">\n <div class=\"text-secondary me-2\">\n {{ t('ItemsPerPage') }}\n </div>\n <upd-select [items]=\"pageOptions()\" [selected]=\"selectedPageSize()\" (selectedItem)=\"onSelectPageSize($event)\"\n [shouldShowClearButton]=\"false\" [isCompact]=\"true\" [useSystemStyle]=\"true\"></upd-select>\n <p class=\"m-0 text-secondary ms-4\">\n @if (totalRecords() > 0) {\n {{ t('FromToOf', { first: currentFirstDisplayed(), last: currentLastDisplayed(), totalRecords: totalRecords() }) }}\n } @else {\n {{ t('NoRecords') }}\n }\n </p>\n <ul class=\"pagination m-0 ms-4\">\n @if (!previousDescription()) {\n <li class=\"page-item\">\n <upd-button customClasses=\"page-link\" [isLink]=\"true\" [isIcon]=\"!shouldDisplayFirstText()\" colorStyle=\"secondary\"\n [attr.tabindex]=\"isFirstDisabled() ? -1 : 0\" [attr.aria-disabled]=\"isFirstDisabled()\"\n [isDisabled]=\"isPreviousDisabled()\" (clicked)=\"selectPage(startPageIndex())\">\n @if (shouldDisplayFirstIcon()) {\n <upd-icon tablerIcon=\"chevron-left-pipe\"></upd-icon>\n }\n @if (shouldDisplayFirstText()) {\n {{ t('First') }}\n }\n </upd-button>\n </li>\n }\n\n <li class=\"page-item\" [class.page-prev]=\"!!previousDescription()\">\n <upd-button customClasses=\"page-link\" [isLink]=\"true\" [isIcon]=\"!shouldDisplayPreviousText()\" colorStyle=\"secondary\"\n [attr.tabindex]=\"isPreviousDisabled() ? -1 : 0\" [attr.aria-disabled]=\"isPreviousDisabled()\"\n [isDisabled]=\"isPreviousDisabled()\" (clicked)=\"selectPage(currentPage() - 1)\">\n @if (!!previousDescription()) {\n <div class=\"page-item-subtitle\">{{ t('Previous') }}</div>\n <div class=\"page-item-title\">{{ textService.getText(previousDescription()) }}</div>\n } @else {\n @if (shouldDisplayPreviousIcon()) {\n <upd-icon tablerIcon=\"chevron-left\"></upd-icon>\n }\n @if (shouldDisplayPreviousText()) {\n {{ t('PreviousShort') }}\n }\n }\n </upd-button>\n </li>\n\n <li class=\"page-item\" [class.page-next]=\"!!nextDescription()\">\n <upd-button customClasses=\"page-link\" [isLink]=\"true\" [isIcon]=\"!shouldDisplayNextText()\" colorStyle=\"secondary\"\n [attr.tabindex]=\"isNextDisabled() ? -1 : 0\" [attr.aria-disabled]=\"isNextDisabled()\" [isDisabled]=\"isNextDisabled()\"\n (clicked)=\"selectPage(currentPage() + 1)\">\n @if (!!nextDescription()) {\n <div class=\"page-item-subtitle\">{{ t('Next') }}</div>\n <div class=\"page-item-title\">{{ textService.getText(nextDescription()) }}</div>\n } @else {\n @if (shouldDisplayNextText()) {\n {{ t('NextShort') }}\n }\n @if (shouldDisplayNextIcon()) {\n <upd-icon tablerIcon=\"chevron-right\"></upd-icon>\n }\n }\n </upd-button>\n </li>\n\n @if (!nextDescription()) {\n <li class=\"page-item\">\n <upd-button customClasses=\"page-link\" [isLink]=\"true\" [isIcon]=\"!shouldDisplayLastText()\" colorStyle=\"secondary\"\n [attr.tabindex]=\"isLastDisabled() ? -1 : 0\" [attr.aria-disabled]=\"isLastDisabled()\" [isDisabled]=\"isNextDisabled()\"\n (clicked)=\"selectPage(totalPages() - (startPageIndex() === 0 ? 1 : 0))\">\n @if (shouldDisplayLastText()) {\n {{ t('Last') }}\n }\n @if (shouldDisplayLastIcon()) {\n <upd-icon tablerIcon=\"chevron-right-pipe\"></upd-icon>\n }\n </upd-button>\n </li>\n }\n </ul>\n </div>\n</ng-container>\n", styles: [""], dependencies: [{ kind: "component", type: i1.IconComponent, selector: "upd-icon", inputs: ["model", "wrapperClasses", "color", "colorClass", "removeDefaultClasses", "customClasses", "tablerIcon", "tablerIconWeight", "tablerIconType", "tablerIconSize", "heroIcon", "heroIconSize", "heroIconType"] }, { kind: "component", type: i2.ButtonComponent, selector: "upd-button", inputs: ["model", "text", "brandColorStyle", "customClasses", "isOutline", "isGhost", "isSquare", "isPill", "isIcon", "isLoading", "isList", "isFloating", "isAction", "isNavigationLink", "isLink", "shouldIgnoreBtnClass", "iconModel", "iconPosition", "isDisabled", "isActive", "badgeConfig", "colorStyle", "size", "title"], outputs: ["clicked"] }, { kind: "component", type: i3.SelectComponent, selector: "upd-select", inputs: ["useSystemStyle", "shouldShowClearButton", "shouldTruncateSelectedText", "isCompact", "selected"], outputs: ["selectedItem"] }, { kind: "directive", type: i1$1.TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoPrefix", "translocoLang", "translocoLoadingTpl"] }] }); }
|
|
62
62
|
}
|
|
63
63
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.0", ngImport: i0, type: PaginatorComponent, decorators: [{
|
|
64
64
|
type: Component,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"updevs-components-paginator.mjs","sources":["../../../../libs/components/paginator/src/paginator.component.ts","../../../../libs/components/paginator/src/paginator.component.html","../../../../libs/components/paginator/src/upd-paginator.module.ts","../../../../libs/components/paginator/src/updevs-components-paginator.ts"],"sourcesContent":["import { Component, inject, HostBinding, effect, input, computed, Signal, model, Output, EventEmitter } from '@angular/core';\nimport { TextModel, TextService } from '@updevs/sdk';\nimport { SelectItem } from '@updevs/components/form-controls/select';\n\n@Component({\n selector: 'upd-paginator',\n templateUrl: './paginator.component.html',\n styleUrl: './paginator.component.scss'\n})\nexport class PaginatorComponent {\n @HostBinding('class') hostClasses = '';\n @Output() readonly changed = new EventEmitter<void>();\n\n startPageIndex = input<0 | 1>(0);\n currentPage = model<number>(this.startPageIndex());\n wrapperClasses = input<string>('');\n availablePageSizes = input<number[]>([5, 10, 15, 25, 50]);\n defaultInitPageSize = input<number>(10);\n pageSize = model<number>(this.defaultInitPageSize());\n shouldDisplayFirstIcon = input<boolean>(true);\n shouldDisplayFirstText = input<boolean>(true);\n shouldDisplayPreviousIcon = input<boolean>(true);\n shouldDisplayPreviousText = input<boolean>(true);\n shouldDisplayNextIcon = input<boolean>(true);\n shouldDisplayNextText = input<boolean>(true);\n shouldDisplayLastIcon = input<boolean>(true);\n shouldDisplayLastText = input<boolean>(true);\n previousDescription = input<TextModel>();\n nextDescription = input<TextModel>();\n totalRecords = input<number>(0);\n isFirstDisabled = computed(() => this.currentPage() === this.startPageIndex() || this.totalRecords() === 0);\n isPreviousDisabled = computed(() => this.currentPage() === this.startPageIndex() || this.totalRecords() === 0);\n isNextDisabled = computed(() => this.currentPage() + 1 === this.totalPages() || this.totalRecords() === 0);\n isLastDisabled = computed(() => this.currentPage() + 1 === this.totalPages() || this.totalRecords() === 0);\n pageOptions: Signal<SelectItem[]> = computed(() => this.availablePageSizes().map(ps => ({ value: ps, text: ps.toString() })));\n selectedPageSize = computed(() => this.pageOptions().find(po => po.value === this.pageSize()));\n totalPages = computed(() => Math.ceil(this.totalRecords() / this.pageSize()));\n currentFirstDisplayed = computed(() => ((this.currentPage() - this.startPageIndex()) * this.pageSize()) + 1);\n currentLastDisplayed = computed(() => (this.expectedLast() > this.totalRecords() ? this.totalRecords() : this.expectedLast()));\n\n readonly textService = inject(TextService);\n\n private expectedLast = computed(() => (this.currentPage() + (this.startPageIndex() === 1 ? 0 : 1)) * this.pageSize());\n private readonly defaultWrapperClasses = 'd-flex align-items-center';\n\n constructor() {\n effect(() => {\n this.hostClasses = `${this.defaultWrapperClasses} ${this.wrapperClasses()}`;\n });\n }\n\n onSelectPageSize(page?: SelectItem): void {\n console.log('page', page);\n this.pageSize.set(page?.value || 1);\n this.changed.emit();\n }\n\n selectPage(page: number): void {\n this.currentPage.set(page);\n this.changed.emit();\n }\n}\n","<ng-container *transloco=\"let t; prefix: 'UpDevs.Paginator'\">\n <div class=\"d-flex m-0 ms-auto align-items-center\">\n <div class=\"text-secondary me-2\">\n {{ t('ItemsPerPage') }}\n </div>\n <upd-select [items]=\"pageOptions()\" [selected]=\"selectedPageSize()\" (selectedItem)=\"onSelectPageSize($event)\"\n [shouldShowClearButton]=\"false\" [isCompact]=\"true\" [useSystemStyle]=\"true\"></upd-select>\n <p class=\"m-0 text-secondary ms-4\">\n @if (totalRecords() > 0) {\n {{ t('FromToOf', { first: currentFirstDisplayed(), last: currentLastDisplayed(), totalRecords: totalRecords() }) }}\n } @else {\n {{ t('NoRecords') }}\n }\n </p>\n <ul class=\"pagination m-0 ms-4\">\n @if (!previousDescription()) {\n <li class=\"page-item\">\n <upd-button customClasses=\"page-link\" [isLink]=\"true\" [isIcon]=\"!shouldDisplayFirstText()\" colorStyle=\"secondary\"\n [attr.tabindex]=\"isFirstDisabled() ? -1 : 0\" [attr.aria-disabled]=\"isFirstDisabled()\"\n [isDisabled]=\"isPreviousDisabled()\" (clicked)=\"selectPage(startPageIndex())\">\n @if (shouldDisplayFirstIcon()) {\n <upd-icon tablerIcon=\"chevron-left-pipe\"></upd-icon>\n }\n @if (shouldDisplayFirstText()) {\n {{ t('First') }}\n }\n </upd-button>\n </li>\n }\n\n <li class=\"page-item\" [class.page-prev]=\"!!previousDescription()\">\n <upd-button customClasses=\"page-link\" [isLink]=\"true\" [isIcon]=\"!shouldDisplayPreviousText()\" colorStyle=\"secondary\"\n [attr.tabindex]=\"isPreviousDisabled() ? -1 : 0\" [attr.aria-disabled]=\"isPreviousDisabled()\"\n [isDisabled]=\"isPreviousDisabled()\" (clicked)=\"selectPage(currentPage() - 1)\">\n @if (!!previousDescription()) {\n <div class=\"page-item-subtitle\">{{ t('Previous') }}</div>\n <div class=\"page-item-title\">{{ textService.getText(previousDescription()) }}</div>\n } @else {\n @if (shouldDisplayPreviousIcon()) {\n <upd-icon tablerIcon=\"chevron-left\"></upd-icon>\n }\n @if (shouldDisplayPreviousText()) {\n {{ t('PreviousShort') }}\n }\n }\n </upd-button>\n </li>\n\n <li class=\"page-item\" [class.page-next]=\"!!nextDescription()\">\n <upd-button customClasses=\"page-link\" [isLink]=\"true\" [isIcon]=\"!shouldDisplayNextText()\" colorStyle=\"secondary\"\n [attr.tabindex]=\"isNextDisabled() ? -1 : 0\" [attr.aria-disabled]=\"isNextDisabled()\" [isDisabled]=\"isNextDisabled()\"\n (clicked)=\"selectPage(currentPage() + 1)\">\n @if (!!nextDescription()) {\n <div class=\"page-item-subtitle\">{{ t('Next') }}</div>\n <div class=\"page-item-title\">{{ textService.getText(nextDescription()) }}</div>\n } @else {\n @if (shouldDisplayNextText()) {\n {{ t('NextShort') }}\n }\n @if (shouldDisplayNextIcon()) {\n <upd-icon tablerIcon=\"chevron-right\"></upd-icon>\n }\n }\n </upd-button>\n </li>\n\n @if (!nextDescription()) {\n <li class=\"page-item\">\n <upd-button customClasses=\"page-link\" [isLink]=\"true\" [isIcon]=\"!shouldDisplayLastText()\" colorStyle=\"secondary\"\n [attr.tabindex]=\"isLastDisabled() ? -1 : 0\" [attr.aria-disabled]=\"isLastDisabled()\" [isDisabled]=\"isNextDisabled()\"\n (clicked)=\"selectPage(totalPages() - (startPageIndex() === 0 ? 1 : 0))\">\n @if (shouldDisplayLastText()) {\n {{ t('Last') }}\n }\n @if (shouldDisplayLastIcon()) {\n <upd-icon tablerIcon=\"chevron-right-pipe\"></upd-icon>\n }\n </upd-button>\n </li>\n }\n </ul>\n </div>\n</ng-container>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { UpdIconsModule } from '@updevs/icons';\nimport { UpdButtonModule } from '@updevs/components/button';\nimport { UpdSelectModule } from '@updevs/components/form-controls/select';\nimport { TranslocoDirective, TranslocoService } from '@jsverse/transloco';\n\nimport * as en from './assets/i18n/en.json';\nimport * as pt from './assets/i18n/pt.json';\nimport { PaginatorComponent } from './paginator.component';\n\n@NgModule({\n imports: [\n CommonModule,\n UpdIconsModule,\n UpdButtonModule,\n UpdSelectModule,\n TranslocoDirective\n ],\n declarations: [\n PaginatorComponent\n ],\n exports: [\n PaginatorComponent\n ]\n})\nexport class UpdPaginatorModule {\n constructor(translocoService: TranslocoService) {\n translocoService.setFallbackLangForMissingTranslation({ fallbackLang: 'en' });\n translocoService.setTranslation(en, 'en');\n translocoService.setTranslation(pt, 'pt');\n }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":["i4","en","pt","i1"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"updevs-components-paginator.mjs","sources":["../../../../libs/components/paginator/src/paginator.component.ts","../../../../libs/components/paginator/src/paginator.component.html","../../../../libs/components/paginator/src/upd-paginator.module.ts","../../../../libs/components/paginator/src/updevs-components-paginator.ts"],"sourcesContent":["import { Component, inject, HostBinding, effect, input, computed, Signal, model, Output, EventEmitter } from '@angular/core';\nimport { TextModel, TextService } from '@updevs/sdk';\nimport { SelectItem } from '@updevs/components/form-controls/select';\n\n@Component({\n selector: 'upd-paginator',\n templateUrl: './paginator.component.html',\n styleUrl: './paginator.component.scss'\n})\nexport class PaginatorComponent {\n @HostBinding('class') hostClasses = '';\n @Output() readonly changed = new EventEmitter<void>();\n\n startPageIndex = input<0 | 1>(0);\n currentPage = model<number>(this.startPageIndex());\n wrapperClasses = input<string>('');\n availablePageSizes = input<number[]>([5, 10, 15, 25, 50]);\n defaultInitPageSize = input<number>(10);\n pageSize = model<number>(this.defaultInitPageSize());\n shouldDisplayFirstIcon = input<boolean>(true);\n shouldDisplayFirstText = input<boolean>(true);\n shouldDisplayPreviousIcon = input<boolean>(true);\n shouldDisplayPreviousText = input<boolean>(true);\n shouldDisplayNextIcon = input<boolean>(true);\n shouldDisplayNextText = input<boolean>(true);\n shouldDisplayLastIcon = input<boolean>(true);\n shouldDisplayLastText = input<boolean>(true);\n previousDescription = input<TextModel>();\n nextDescription = input<TextModel>();\n totalRecords = input<number>(0);\n isFirstDisabled = computed(() => this.currentPage() === this.startPageIndex() || this.totalRecords() === 0);\n isPreviousDisabled = computed(() => this.currentPage() === this.startPageIndex() || this.totalRecords() === 0);\n isNextDisabled = computed(() => this.currentPage() + 1 === this.totalPages() || this.totalRecords() === 0);\n isLastDisabled = computed(() => this.currentPage() + 1 === this.totalPages() || this.totalRecords() === 0);\n pageOptions: Signal<SelectItem[]> = computed(() => this.availablePageSizes().map(ps => ({ value: ps, text: ps.toString() })));\n selectedPageSize = computed(() => this.pageOptions().find(po => po.value === this.pageSize()));\n totalPages = computed(() => Math.ceil(this.totalRecords() / this.pageSize()));\n currentFirstDisplayed = computed(() => ((this.currentPage() - this.startPageIndex()) * this.pageSize()) + 1);\n currentLastDisplayed = computed(() => (this.expectedLast() > this.totalRecords() ? this.totalRecords() : this.expectedLast()));\n\n readonly textService = inject(TextService);\n\n private expectedLast = computed(() => (this.currentPage() + (this.startPageIndex() === 1 ? 0 : 1)) * this.pageSize());\n private readonly defaultWrapperClasses = 'd-flex align-items-center';\n\n constructor() {\n effect(() => {\n this.hostClasses = `${this.defaultWrapperClasses} ${this.wrapperClasses()}`;\n });\n }\n\n onSelectPageSize(page?: SelectItem): void {\n console.log('page', page);\n this.pageSize.set(page?.value || 1);\n this.changed.emit();\n }\n\n selectPage(page: number): void {\n this.currentPage.set(page);\n this.changed.emit();\n }\n}\n","<ng-container *transloco=\"let t; prefix: 'UpDevs.Paginator'\">\n <div class=\"d-flex m-0 ms-auto align-items-center\">\n <div class=\"text-secondary me-2\">\n {{ t('ItemsPerPage') }}\n </div>\n <upd-select [items]=\"pageOptions()\" [selected]=\"selectedPageSize()\" (selectedItem)=\"onSelectPageSize($event)\"\n [shouldShowClearButton]=\"false\" [isCompact]=\"true\" [useSystemStyle]=\"true\"></upd-select>\n <p class=\"m-0 text-secondary ms-4\">\n @if (totalRecords() > 0) {\n {{ t('FromToOf', { first: currentFirstDisplayed(), last: currentLastDisplayed(), totalRecords: totalRecords() }) }}\n } @else {\n {{ t('NoRecords') }}\n }\n </p>\n <ul class=\"pagination m-0 ms-4\">\n @if (!previousDescription()) {\n <li class=\"page-item\">\n <upd-button customClasses=\"page-link\" [isLink]=\"true\" [isIcon]=\"!shouldDisplayFirstText()\" colorStyle=\"secondary\"\n [attr.tabindex]=\"isFirstDisabled() ? -1 : 0\" [attr.aria-disabled]=\"isFirstDisabled()\"\n [isDisabled]=\"isPreviousDisabled()\" (clicked)=\"selectPage(startPageIndex())\">\n @if (shouldDisplayFirstIcon()) {\n <upd-icon tablerIcon=\"chevron-left-pipe\"></upd-icon>\n }\n @if (shouldDisplayFirstText()) {\n {{ t('First') }}\n }\n </upd-button>\n </li>\n }\n\n <li class=\"page-item\" [class.page-prev]=\"!!previousDescription()\">\n <upd-button customClasses=\"page-link\" [isLink]=\"true\" [isIcon]=\"!shouldDisplayPreviousText()\" colorStyle=\"secondary\"\n [attr.tabindex]=\"isPreviousDisabled() ? -1 : 0\" [attr.aria-disabled]=\"isPreviousDisabled()\"\n [isDisabled]=\"isPreviousDisabled()\" (clicked)=\"selectPage(currentPage() - 1)\">\n @if (!!previousDescription()) {\n <div class=\"page-item-subtitle\">{{ t('Previous') }}</div>\n <div class=\"page-item-title\">{{ textService.getText(previousDescription()) }}</div>\n } @else {\n @if (shouldDisplayPreviousIcon()) {\n <upd-icon tablerIcon=\"chevron-left\"></upd-icon>\n }\n @if (shouldDisplayPreviousText()) {\n {{ t('PreviousShort') }}\n }\n }\n </upd-button>\n </li>\n\n <li class=\"page-item\" [class.page-next]=\"!!nextDescription()\">\n <upd-button customClasses=\"page-link\" [isLink]=\"true\" [isIcon]=\"!shouldDisplayNextText()\" colorStyle=\"secondary\"\n [attr.tabindex]=\"isNextDisabled() ? -1 : 0\" [attr.aria-disabled]=\"isNextDisabled()\" [isDisabled]=\"isNextDisabled()\"\n (clicked)=\"selectPage(currentPage() + 1)\">\n @if (!!nextDescription()) {\n <div class=\"page-item-subtitle\">{{ t('Next') }}</div>\n <div class=\"page-item-title\">{{ textService.getText(nextDescription()) }}</div>\n } @else {\n @if (shouldDisplayNextText()) {\n {{ t('NextShort') }}\n }\n @if (shouldDisplayNextIcon()) {\n <upd-icon tablerIcon=\"chevron-right\"></upd-icon>\n }\n }\n </upd-button>\n </li>\n\n @if (!nextDescription()) {\n <li class=\"page-item\">\n <upd-button customClasses=\"page-link\" [isLink]=\"true\" [isIcon]=\"!shouldDisplayLastText()\" colorStyle=\"secondary\"\n [attr.tabindex]=\"isLastDisabled() ? -1 : 0\" [attr.aria-disabled]=\"isLastDisabled()\" [isDisabled]=\"isNextDisabled()\"\n (clicked)=\"selectPage(totalPages() - (startPageIndex() === 0 ? 1 : 0))\">\n @if (shouldDisplayLastText()) {\n {{ t('Last') }}\n }\n @if (shouldDisplayLastIcon()) {\n <upd-icon tablerIcon=\"chevron-right-pipe\"></upd-icon>\n }\n </upd-button>\n </li>\n }\n </ul>\n </div>\n</ng-container>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { UpdIconsModule } from '@updevs/icons';\nimport { UpdButtonModule } from '@updevs/components/button';\nimport { UpdSelectModule } from '@updevs/components/form-controls/select';\nimport { TranslocoDirective, TranslocoService } from '@jsverse/transloco';\n\nimport * as en from './assets/i18n/en.json';\nimport * as pt from './assets/i18n/pt.json';\nimport { PaginatorComponent } from './paginator.component';\n\n@NgModule({\n imports: [\n CommonModule,\n UpdIconsModule,\n UpdButtonModule,\n UpdSelectModule,\n TranslocoDirective\n ],\n declarations: [\n PaginatorComponent\n ],\n exports: [\n PaginatorComponent\n ]\n})\nexport class UpdPaginatorModule {\n constructor(translocoService: TranslocoService) {\n translocoService.setFallbackLangForMissingTranslation({ fallbackLang: 'en' });\n translocoService.setTranslation(en, 'en');\n translocoService.setTranslation(pt, 'pt');\n }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":["i4","en","pt","i1"],"mappings":"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"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { Input, HostBinding, ViewEncapsulation, Component, inject, ElementRef, Renderer2, ViewContainerRef, NgZone, Injector, HostListener, Directive, NgModule } from '@angular/core';
|
|
2
|
+
import { Input, HostBinding, ViewEncapsulation, Component, inject, ElementRef, Renderer2, ViewContainerRef, NgZone, Injector, afterNextRender, HostListener, Directive, NgModule } from '@angular/core';
|
|
3
3
|
import * as i1 from '@angular/common';
|
|
4
4
|
import { CommonModule } from '@angular/common';
|
|
5
5
|
import { PositioningService, DynamicComponentLoaderService } from '@updevs/sdk/layout';
|
|
@@ -107,9 +107,11 @@ class PopoverDirective {
|
|
|
107
107
|
this.popoverComponentRef.instance.setVisible(true);
|
|
108
108
|
this.popoverComponentRef.changeDetectorRef.detectChanges();
|
|
109
109
|
const arrowElement = this.popoverComponentRef.location.nativeElement.querySelector('.popover-arrow');
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
110
|
+
afterNextRender(() => {
|
|
111
|
+
this.ngZone.runOutsideAngular(() => this.positioningService
|
|
112
|
+
.computePosition(this.elementRef, this.popoverComponentRef.location, { placement: this.placement }, arrowElement)
|
|
113
|
+
.subscribe(resp => this.updatePosition(resp)));
|
|
114
|
+
}, { injector: this.injector });
|
|
113
115
|
}
|
|
114
116
|
disposePopover() {
|
|
115
117
|
this.viewContainerRef.clear();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"updevs-components-popover.mjs","sources":["../../../../libs/components/popover/src/popover.component.ts","../../../../libs/components/popover/src/popover.component.html","../../../../libs/components/popover/src/popover.directive.ts","../../../../libs/components/popover/src/upd-popover.module.ts","../../../../libs/components/popover/src/updevs-components-popover.ts"],"sourcesContent":["import { Component, Input, HostBinding, OnInit, OnChanges, ViewEncapsulation, TemplateRef } from '@angular/core';\nimport { TopBottomLeftRightType } from '@updevs/sdk/types';\n\n@Component({\n selector: 'upd-popover',\n templateUrl: './popover.component.html',\n styleUrls: ['./popover.component.scss'],\n encapsulation: ViewEncapsulation.None\n})\nexport class PopoverComponent implements OnInit, OnChanges {\n @HostBinding('class') classes = '';\n @HostBinding('attr.data-popper-placement') popperPlacement = '';\n @HostBinding('role') readonly role = 'tooltip';\n\n @Input() title?: string;\n @Input() text?: string;\n @Input() titleTemplate?: TemplateRef<any>;\n @Input() template?: TemplateRef<any>;\n @Input() placement: TopBottomLeftRightType = 'top';\n @Input() customClasses?: string;\n\n get isVisible(): boolean {\n return this._isVisible;\n }\n\n private _isVisible = false;\n\n ngOnInit(): void {\n this.updateClasses();\n }\n\n ngOnChanges(): void {\n this.updateClasses();\n }\n\n setVisible(isVisible: boolean): void {\n this._isVisible = isVisible;\n this.updateClasses();\n }\n\n private updateClasses(): void {\n this.popperPlacement = this.placement;\n this.classes = [\n 'popover',\n 'bs-popover-auto',\n !this._isVisible ? 'fade' : '',\n this._isVisible ? 'show' : '',\n 'upd-popover',\n `-${this.placement}`,\n ...(this.customClasses?.split(' ') || [])\n ].join(' ');\n }\n}\n","<div class=\"popover-arrow upd-popover-arrow -{{placement}}\"></div>\n@if (!!title || !!titleTemplate) {\n @if (!!title) {\n <h3 [innerHTML]=\"title\" class=\"popover-header\"></h3>\n } @else {\n <div class=\"popover-header\">\n <ng-template [ngTemplateOutlet]=\"titleTemplate!\"></ng-template>\n </div>\n }\n}\n<div class=\"popover-body\">\n @if (!!text) {\n <span [innerHTML]=\"text\"></span>\n } @else {\n @if (!template) {\n <ng-content></ng-content>\n } @else {\n <ng-template [ngTemplateOutlet]=\"template!\"></ng-template>\n }\n }\n</div>\n","import {\n Directive,\n Input,\n TemplateRef,\n ViewContainerRef,\n Renderer2,\n ElementRef,\n Injector,\n NgZone,\n ComponentRef,\n HostListener, inject\n} from '@angular/core';\nimport { TopBottomLeftRightType } from '@updevs/sdk/types';\nimport { PositioningService, ComputePositionResult, DynamicComponentLoaderService } from '@updevs/sdk/layout';\n\nimport { PopoverComponent } from './popover.component';\n\n@Directive({\n selector: '[updPopover]'\n})\nexport class PopoverDirective {\n @Input('updPopover') text?: string;\n @Input('updPopoverTitle') title?: string;\n // eslint-disable-next-line @angular-eslint/no-input-rename\n @Input('updPopoverTitleTemplate') popoverTitleTemplate?: TemplateRef<any>;\n // eslint-disable-next-line @angular-eslint/no-input-rename\n @Input('updPopoverTemplate') popoverTemplate?: TemplateRef<any>;\n @Input('updPopoverPlacement') placement: TopBottomLeftRightType = 'top';\n @Input('updPopoverCustomClasses') customClasses?: string;\n /**\n * This makes the popover behave like a tooltip.\n * It means it'll show/hide depending on whether the mouse is over or not the element.\n */\n @Input('updPopoverActAsTooltip') actAsTooltip = false;\n\n private popoverComponentRef?: ComponentRef<PopoverComponent>;\n\n private readonly elementRef = inject(ElementRef);\n private readonly renderer = inject(Renderer2);\n private readonly viewContainerRef = inject(ViewContainerRef);\n private readonly ngZone = inject(NgZone);\n private readonly injector = inject(Injector);\n private readonly positioningService = inject(PositioningService);\n private readonly dynamicComponentLoaderService = inject(DynamicComponentLoaderService);\n\n @HostListener('mouseenter')\n onMouseEnter(): void {\n if (this.actAsTooltip) {\n this.initPopover();\n }\n }\n\n @HostListener('mouseleave')\n onMouseLeave(): void {\n if (this.actAsTooltip) {\n this.disposePopover();\n }\n }\n\n @HostListener('click')\n onClick(): void {\n if (!this.actAsTooltip) {\n if (this.popoverComponentRef?.instance.isVisible) {\n this.disposePopover();\n } else {\n this.initPopover();\n }\n }\n }\n\n private initPopover(): void {\n this.setupPopover();\n this.popoverComponentRef!.instance.setVisible(true);\n this.popoverComponentRef!.changeDetectorRef.detectChanges();\n\n const arrowElement = this.popoverComponentRef!.location.nativeElement.querySelector('.popover-arrow');\n\n this.ngZone.runOutsideAngular(() =>\n this.positioningService\n .computePosition(this.elementRef, this.popoverComponentRef!.location, { placement: this.placement }, arrowElement)\n .subscribe(resp => this.updatePosition(resp))\n );\n }\n\n private disposePopover(): void {\n this.viewContainerRef.clear();\n this.popoverComponentRef!.instance.setVisible(false);\n }\n\n private setupPopover(): void {\n this.viewContainerRef.clear();\n\n this.popoverComponentRef = this.dynamicComponentLoaderService.load(PopoverComponent, this.viewContainerRef, this.injector);\n this.popoverComponentRef!.instance.title = this.title;\n this.popoverComponentRef!.instance.text = this.text;\n this.popoverComponentRef!.instance.titleTemplate = this.popoverTitleTemplate;\n this.popoverComponentRef!.instance.template = this.popoverTemplate;\n this.popoverComponentRef!.instance.placement = this.placement;\n this.popoverComponentRef!.instance.customClasses = this.customClasses;\n }\n\n private updatePosition(result: ComputePositionResult): void {\n const nativeElement = this.popoverComponentRef!.location.nativeElement;\n const arrowElement = nativeElement?.querySelector('.popover-arrow');\n\n if (!arrowElement) {\n console.warn('Popover arrow element not found. Positioning may be incorrect.');\n return;\n }\n\n this.renderer.setStyle(nativeElement, 'left', `${result.x}px`);\n this.renderer.setStyle(nativeElement, 'top', `${result.y}px`);\n\n if (arrowElement && result.middlewareData.arrow) {\n const { x: arrowX, y: arrowY } = result.middlewareData.arrow;\n this.renderer.setStyle(arrowElement, 'left', arrowX !== undefined ? `${arrowX}px` : '');\n this.renderer.setStyle(arrowElement, 'top', arrowY !== undefined ? `${arrowY}px` : '');\n }\n }\n}\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\n\nimport { PopoverComponent } from './popover.component';\nimport { PopoverDirective } from './popover.directive';\n\n@NgModule({\n imports: [\n CommonModule\n ],\n declarations: [\n PopoverComponent,\n PopoverDirective\n ],\n exports: [\n PopoverComponent,\n PopoverDirective\n ]\n})\nexport class UpdPopoverModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;MASa,gBAAgB,CAAA;AAN7B,IAAA,WAAA,GAAA;QAO0B,IAAO,CAAA,OAAA,GAAG,EAAE;QACS,IAAe,CAAA,eAAA,GAAG,EAAE;QACjC,IAAI,CAAA,IAAA,GAAG,SAAS;QAMrC,IAAS,CAAA,SAAA,GAA2B,KAAK;QAO1C,IAAU,CAAA,UAAA,GAAG,KAAK;AA2B7B;AA/BG,IAAA,IAAI,SAAS,GAAA;QACT,OAAO,IAAI,CAAC,UAAU;;IAK1B,QAAQ,GAAA;QACJ,IAAI,CAAC,aAAa,EAAE;;IAGxB,WAAW,GAAA;QACP,IAAI,CAAC,aAAa,EAAE;;AAGxB,IAAA,UAAU,CAAC,SAAkB,EAAA;AACzB,QAAA,IAAI,CAAC,UAAU,GAAG,SAAS;QAC3B,IAAI,CAAC,aAAa,EAAE;;IAGhB,aAAa,GAAA;AACjB,QAAA,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,SAAS;QACrC,IAAI,CAAC,OAAO,GAAG;YACX,SAAS;YACT,iBAAiB;YACjB,CAAC,IAAI,CAAC,UAAU,GAAG,MAAM,GAAG,EAAE;YAC9B,IAAI,CAAC,UAAU,GAAG,MAAM,GAAG,EAAE;YAC7B,aAAa;YACb,CAAI,CAAA,EAAA,IAAI,CAAC,SAAS,CAAE,CAAA;YACpB,IAAI,IAAI,CAAC,aAAa,EAAE,KAAK,CAAC,GAAG,CAAC,IAAI,EAAE;AAC3C,SAAA,CAAC,IAAI,CAAC,GAAG,CAAC;;8GAzCN,gBAAgB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAhB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,gBAAgB,8VCT7B,yoBAqBA,EAAA,MAAA,EAAA,CAAA,iFAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,gBAAA,EAAA,QAAA,EAAA,oBAAA,EAAA,MAAA,EAAA,CAAA,yBAAA,EAAA,kBAAA,EAAA,0BAAA,CAAA,EAAA,CAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA,CAAA;;2FDZa,gBAAgB,EAAA,UAAA,EAAA,CAAA;kBAN5B,SAAS;+BACI,aAAa,EAAA,aAAA,EAGR,iBAAiB,CAAC,IAAI,EAAA,QAAA,EAAA,yoBAAA,EAAA,MAAA,EAAA,CAAA,iFAAA,CAAA,EAAA;8BAGf,OAAO,EAAA,CAAA;sBAA5B,WAAW;uBAAC,OAAO;gBACuB,eAAe,EAAA,CAAA;sBAAzD,WAAW;uBAAC,4BAA4B;gBACX,IAAI,EAAA,CAAA;sBAAjC,WAAW;uBAAC,MAAM;gBAEV,KAAK,EAAA,CAAA;sBAAb;gBACQ,IAAI,EAAA,CAAA;sBAAZ;gBACQ,aAAa,EAAA,CAAA;sBAArB;gBACQ,QAAQ,EAAA,CAAA;sBAAhB;gBACQ,SAAS,EAAA,CAAA;sBAAjB;gBACQ,aAAa,EAAA,CAAA;sBAArB;;;MECQ,gBAAgB,CAAA;AAH7B,IAAA,WAAA,GAAA;QAUkC,IAAS,CAAA,SAAA,GAA2B,KAAK;AAEvE;;;AAGG;QAC8B,IAAY,CAAA,YAAA,GAAG,KAAK;AAIpC,QAAA,IAAA,CAAA,UAAU,GAAG,MAAM,CAAC,UAAU,CAAC;AAC/B,QAAA,IAAA,CAAA,QAAQ,GAAG,MAAM,CAAC,SAAS,CAAC;AAC5B,QAAA,IAAA,CAAA,gBAAgB,GAAG,MAAM,CAAC,gBAAgB,CAAC;AAC3C,QAAA,IAAA,CAAA,MAAM,GAAG,MAAM,CAAC,MAAM,CAAC;AACvB,QAAA,IAAA,CAAA,QAAQ,GAAG,MAAM,CAAC,QAAQ,CAAC;AAC3B,QAAA,IAAA,CAAA,kBAAkB,GAAG,MAAM,CAAC,kBAAkB,CAAC;AAC/C,QAAA,IAAA,CAAA,6BAA6B,GAAG,MAAM,CAAC,6BAA6B,CAAC;AA4EzF;IAzEG,YAAY,GAAA;AACR,QAAA,IAAI,IAAI,CAAC,YAAY,EAAE;YACnB,IAAI,CAAC,WAAW,EAAE;;;IAK1B,YAAY,GAAA;AACR,QAAA,IAAI,IAAI,CAAC,YAAY,EAAE;YACnB,IAAI,CAAC,cAAc,EAAE;;;IAK7B,OAAO,GAAA;AACH,QAAA,IAAI,CAAC,IAAI,CAAC,YAAY,EAAE;YACpB,IAAI,IAAI,CAAC,mBAAmB,EAAE,QAAQ,CAAC,SAAS,EAAE;gBAC9C,IAAI,CAAC,cAAc,EAAE;;iBAClB;gBACH,IAAI,CAAC,WAAW,EAAE;;;;IAKtB,WAAW,GAAA;QACf,IAAI,CAAC,YAAY,EAAE;QACnB,IAAI,CAAC,mBAAoB,CAAC,QAAQ,CAAC,UAAU,CAAC,IAAI,CAAC;AACnD,QAAA,IAAI,CAAC,mBAAoB,CAAC,iBAAiB,CAAC,aAAa,EAAE;AAE3D,QAAA,MAAM,YAAY,GAAG,IAAI,CAAC,mBAAoB,CAAC,QAAQ,CAAC,aAAa,CAAC,aAAa,CAAC,gBAAgB,CAAC;QAErG,IAAI,CAAC,MAAM,CAAC,iBAAiB,CAAC,MAC1B,IAAI,CAAC;aACA,eAAe,CAAC,IAAI,CAAC,UAAU,EAAE,IAAI,CAAC,mBAAoB,CAAC,QAAQ,EAAE,EAAE,SAAS,EAAE,IAAI,CAAC,SAAS,EAAE,EAAE,YAAY;AAChH,aAAA,SAAS,CAAC,IAAI,IAAI,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,CAAC,CACpD;;IAGG,cAAc,GAAA;AAClB,QAAA,IAAI,CAAC,gBAAgB,CAAC,KAAK,EAAE;QAC7B,IAAI,CAAC,mBAAoB,CAAC,QAAQ,CAAC,UAAU,CAAC,KAAK,CAAC;;IAGhD,YAAY,GAAA;AAChB,QAAA,IAAI,CAAC,gBAAgB,CAAC,KAAK,EAAE;AAE7B,QAAA,IAAI,CAAC,mBAAmB,GAAG,IAAI,CAAC,6BAA6B,CAAC,IAAI,CAAC,gBAAgB,EAAE,IAAI,CAAC,gBAAgB,EAAE,IAAI,CAAC,QAAQ,CAAC;QAC1H,IAAI,CAAC,mBAAoB,CAAC,QAAQ,CAAC,KAAK,GAAG,IAAI,CAAC,KAAK;QACrD,IAAI,CAAC,mBAAoB,CAAC,QAAQ,CAAC,IAAI,GAAG,IAAI,CAAC,IAAI;QACnD,IAAI,CAAC,mBAAoB,CAAC,QAAQ,CAAC,aAAa,GAAG,IAAI,CAAC,oBAAoB;QAC5E,IAAI,CAAC,mBAAoB,CAAC,QAAQ,CAAC,QAAQ,GAAG,IAAI,CAAC,eAAe;QAClE,IAAI,CAAC,mBAAoB,CAAC,QAAQ,CAAC,SAAS,GAAG,IAAI,CAAC,SAAS;QAC7D,IAAI,CAAC,mBAAoB,CAAC,QAAQ,CAAC,aAAa,GAAG,IAAI,CAAC,aAAa;;AAGjE,IAAA,cAAc,CAAC,MAA6B,EAAA;QAChD,MAAM,aAAa,GAAG,IAAI,CAAC,mBAAoB,CAAC,QAAQ,CAAC,aAAa;QACtE,MAAM,YAAY,GAAG,aAAa,EAAE,aAAa,CAAC,gBAAgB,CAAC;QAEnE,IAAI,CAAC,YAAY,EAAE;AACf,YAAA,OAAO,CAAC,IAAI,CAAC,gEAAgE,CAAC;YAC9E;;AAGJ,QAAA,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,aAAa,EAAE,MAAM,EAAE,GAAG,MAAM,CAAC,CAAC,CAAA,EAAA,CAAI,CAAC;AAC9D,QAAA,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,aAAa,EAAE,KAAK,EAAE,GAAG,MAAM,CAAC,CAAC,CAAA,EAAA,CAAI,CAAC;QAE7D,IAAI,YAAY,IAAI,MAAM,CAAC,cAAc,CAAC,KAAK,EAAE;AAC7C,YAAA,MAAM,EAAE,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,EAAE,GAAG,MAAM,CAAC,cAAc,CAAC,KAAK;YAC5D,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,YAAY,EAAE,MAAM,EAAE,MAAM,KAAK,SAAS,GAAG,CAAA,EAAG,MAAM,CAAA,EAAA,CAAI,GAAG,EAAE,CAAC;YACvF,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,YAAY,EAAE,KAAK,EAAE,MAAM,KAAK,SAAS,GAAG,CAAA,EAAG,MAAM,CAAA,EAAA,CAAI,GAAG,EAAE,CAAC;;;8GAhGrF,gBAAgB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;kGAAhB,gBAAgB,EAAA,QAAA,EAAA,cAAA,EAAA,MAAA,EAAA,EAAA,IAAA,EAAA,CAAA,YAAA,EAAA,MAAA,CAAA,EAAA,KAAA,EAAA,CAAA,iBAAA,EAAA,OAAA,CAAA,EAAA,oBAAA,EAAA,CAAA,yBAAA,EAAA,sBAAA,CAAA,EAAA,eAAA,EAAA,CAAA,oBAAA,EAAA,iBAAA,CAAA,EAAA,SAAA,EAAA,CAAA,qBAAA,EAAA,WAAA,CAAA,EAAA,aAAA,EAAA,CAAA,yBAAA,EAAA,eAAA,CAAA,EAAA,YAAA,EAAA,CAAA,wBAAA,EAAA,cAAA,CAAA,EAAA,EAAA,IAAA,EAAA,EAAA,SAAA,EAAA,EAAA,YAAA,EAAA,gBAAA,EAAA,YAAA,EAAA,gBAAA,EAAA,OAAA,EAAA,WAAA,EAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA,CAAA;;2FAAhB,gBAAgB,EAAA,UAAA,EAAA,CAAA;kBAH5B,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACP,oBAAA,QAAQ,EAAE;AACb,iBAAA;8BAEwB,IAAI,EAAA,CAAA;sBAAxB,KAAK;uBAAC,YAAY;gBACO,KAAK,EAAA,CAAA;sBAA9B,KAAK;uBAAC,iBAAiB;gBAEU,oBAAoB,EAAA,CAAA;sBAArD,KAAK;uBAAC,yBAAyB;gBAEH,eAAe,EAAA,CAAA;sBAA3C,KAAK;uBAAC,oBAAoB;gBACG,SAAS,EAAA,CAAA;sBAAtC,KAAK;uBAAC,qBAAqB;gBACM,aAAa,EAAA,CAAA;sBAA9C,KAAK;uBAAC,yBAAyB;gBAKC,YAAY,EAAA,CAAA;sBAA5C,KAAK;uBAAC,wBAAwB;gBAa/B,YAAY,EAAA,CAAA;sBADX,YAAY;uBAAC,YAAY;gBAQ1B,YAAY,EAAA,CAAA;sBADX,YAAY;uBAAC,YAAY;gBAQ1B,OAAO,EAAA,CAAA;sBADN,YAAY;uBAAC,OAAO;;;MCxCZ,gBAAgB,CAAA;8GAAhB,gBAAgB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA;AAAhB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,gBAAgB,iBARrB,gBAAgB;YAChB,gBAAgB,CAAA,EAAA,OAAA,EAAA,CAJhB,YAAY,CAAA,EAAA,OAAA,EAAA,CAOZ,gBAAgB;YAChB,gBAAgB,CAAA,EAAA,CAAA,CAAA;AAGX,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,gBAAgB,YAXrB,YAAY,CAAA,EAAA,CAAA,CAAA;;2FAWP,gBAAgB,EAAA,UAAA,EAAA,CAAA;kBAb5B,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;AACN,oBAAA,OAAO,EAAE;wBACL;AACH,qBAAA;AACD,oBAAA,YAAY,EAAE;wBACV,gBAAgB;wBAChB;AACH,qBAAA;AACD,oBAAA,OAAO,EAAE;wBACL,gBAAgB;wBAChB;AACH;AACJ,iBAAA;;;AClBD;;AAEG;;;;"}
|
|
1
|
+
{"version":3,"file":"updevs-components-popover.mjs","sources":["../../../../libs/components/popover/src/popover.component.ts","../../../../libs/components/popover/src/popover.component.html","../../../../libs/components/popover/src/popover.directive.ts","../../../../libs/components/popover/src/upd-popover.module.ts","../../../../libs/components/popover/src/updevs-components-popover.ts"],"sourcesContent":["import { Component, Input, HostBinding, OnInit, OnChanges, ViewEncapsulation, TemplateRef } from '@angular/core';\nimport { TopBottomLeftRightType } from '@updevs/sdk/types';\n\n@Component({\n selector: 'upd-popover',\n templateUrl: './popover.component.html',\n styleUrls: ['./popover.component.scss'],\n encapsulation: ViewEncapsulation.None\n})\nexport class PopoverComponent implements OnInit, OnChanges {\n @HostBinding('class') classes = '';\n @HostBinding('attr.data-popper-placement') popperPlacement = '';\n @HostBinding('role') readonly role = 'tooltip';\n\n @Input() title?: string;\n @Input() text?: string;\n @Input() titleTemplate?: TemplateRef<any>;\n @Input() template?: TemplateRef<any>;\n @Input() placement: TopBottomLeftRightType = 'top';\n @Input() customClasses?: string;\n\n get isVisible(): boolean {\n return this._isVisible;\n }\n\n private _isVisible = false;\n\n ngOnInit(): void {\n this.updateClasses();\n }\n\n ngOnChanges(): void {\n this.updateClasses();\n }\n\n setVisible(isVisible: boolean): void {\n this._isVisible = isVisible;\n this.updateClasses();\n }\n\n private updateClasses(): void {\n this.popperPlacement = this.placement;\n this.classes = [\n 'popover',\n 'bs-popover-auto',\n !this._isVisible ? 'fade' : '',\n this._isVisible ? 'show' : '',\n 'upd-popover',\n `-${this.placement}`,\n ...(this.customClasses?.split(' ') || [])\n ].join(' ');\n }\n}\n","<div class=\"popover-arrow upd-popover-arrow -{{placement}}\"></div>\n@if (!!title || !!titleTemplate) {\n @if (!!title) {\n <h3 [innerHTML]=\"title\" class=\"popover-header\"></h3>\n } @else {\n <div class=\"popover-header\">\n <ng-template [ngTemplateOutlet]=\"titleTemplate!\"></ng-template>\n </div>\n }\n}\n<div class=\"popover-body\">\n @if (!!text) {\n <span [innerHTML]=\"text\"></span>\n } @else {\n @if (!template) {\n <ng-content></ng-content>\n } @else {\n <ng-template [ngTemplateOutlet]=\"template!\"></ng-template>\n }\n }\n</div>\n","import {\n Directive,\n Input,\n TemplateRef,\n ViewContainerRef,\n Renderer2,\n ElementRef,\n Injector,\n NgZone,\n ComponentRef,\n HostListener, inject,\n afterNextRender\n} from '@angular/core';\nimport { TopBottomLeftRightType } from '@updevs/sdk/types';\nimport { PositioningService, ComputePositionResult, DynamicComponentLoaderService } from '@updevs/sdk/layout';\n\nimport { PopoverComponent } from './popover.component';\n\n@Directive({\n selector: '[updPopover]'\n})\nexport class PopoverDirective {\n @Input('updPopover') text?: string;\n @Input('updPopoverTitle') title?: string;\n // eslint-disable-next-line @angular-eslint/no-input-rename\n @Input('updPopoverTitleTemplate') popoverTitleTemplate?: TemplateRef<any>;\n // eslint-disable-next-line @angular-eslint/no-input-rename\n @Input('updPopoverTemplate') popoverTemplate?: TemplateRef<any>;\n @Input('updPopoverPlacement') placement: TopBottomLeftRightType = 'top';\n @Input('updPopoverCustomClasses') customClasses?: string;\n /**\n * This makes the popover behave like a tooltip.\n * It means it'll show/hide depending on whether the mouse is over or not the element.\n */\n @Input('updPopoverActAsTooltip') actAsTooltip = false;\n\n private popoverComponentRef?: ComponentRef<PopoverComponent>;\n\n private readonly elementRef = inject(ElementRef);\n private readonly renderer = inject(Renderer2);\n private readonly viewContainerRef = inject(ViewContainerRef);\n private readonly ngZone = inject(NgZone);\n private readonly injector = inject(Injector);\n private readonly positioningService = inject(PositioningService);\n private readonly dynamicComponentLoaderService = inject(DynamicComponentLoaderService);\n\n @HostListener('mouseenter')\n onMouseEnter(): void {\n if (this.actAsTooltip) {\n this.initPopover();\n }\n }\n\n @HostListener('mouseleave')\n onMouseLeave(): void {\n if (this.actAsTooltip) {\n this.disposePopover();\n }\n }\n\n @HostListener('click')\n onClick(): void {\n if (!this.actAsTooltip) {\n if (this.popoverComponentRef?.instance.isVisible) {\n this.disposePopover();\n } else {\n this.initPopover();\n }\n }\n }\n\n private initPopover(): void {\n this.setupPopover();\n this.popoverComponentRef!.instance.setVisible(true);\n this.popoverComponentRef!.changeDetectorRef.detectChanges();\n\n const arrowElement = this.popoverComponentRef!.location.nativeElement.querySelector('.popover-arrow');\n\n afterNextRender(() => {\n this.ngZone.runOutsideAngular(() =>\n this.positioningService\n .computePosition(this.elementRef, this.popoverComponentRef!.location, { placement: this.placement }, arrowElement)\n .subscribe(resp => this.updatePosition(resp))\n );\n }, { injector: this.injector });\n }\n\n private disposePopover(): void {\n this.viewContainerRef.clear();\n this.popoverComponentRef!.instance.setVisible(false);\n }\n\n private setupPopover(): void {\n this.viewContainerRef.clear();\n\n this.popoverComponentRef = this.dynamicComponentLoaderService.load(PopoverComponent, this.viewContainerRef, this.injector);\n this.popoverComponentRef!.instance.title = this.title;\n this.popoverComponentRef!.instance.text = this.text;\n this.popoverComponentRef!.instance.titleTemplate = this.popoverTitleTemplate;\n this.popoverComponentRef!.instance.template = this.popoverTemplate;\n this.popoverComponentRef!.instance.placement = this.placement;\n this.popoverComponentRef!.instance.customClasses = this.customClasses;\n }\n\n private updatePosition(result: ComputePositionResult): void {\n const nativeElement = this.popoverComponentRef!.location.nativeElement;\n const arrowElement = nativeElement?.querySelector('.popover-arrow');\n\n if (!arrowElement) {\n console.warn('Popover arrow element not found. Positioning may be incorrect.');\n return;\n }\n\n this.renderer.setStyle(nativeElement, 'left', `${result.x}px`);\n this.renderer.setStyle(nativeElement, 'top', `${result.y}px`);\n\n if (arrowElement && result.middlewareData.arrow) {\n const { x: arrowX, y: arrowY } = result.middlewareData.arrow;\n this.renderer.setStyle(arrowElement, 'left', arrowX !== undefined ? `${arrowX}px` : '');\n this.renderer.setStyle(arrowElement, 'top', arrowY !== undefined ? `${arrowY}px` : '');\n }\n }\n}\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\n\nimport { PopoverComponent } from './popover.component';\nimport { PopoverDirective } from './popover.directive';\n\n@NgModule({\n imports: [\n CommonModule\n ],\n declarations: [\n PopoverComponent,\n PopoverDirective\n ],\n exports: [\n PopoverComponent,\n PopoverDirective\n ]\n})\nexport class UpdPopoverModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
@@ -721,7 +721,7 @@ class FilterRowComponent extends BaseComponent {
|
|
|
721
721
|
this.removed.emit();
|
|
722
722
|
}
|
|
723
723
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.0", ngImport: i0, type: FilterRowComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
724
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.1.0", type: FilterRowComponent, selector: "upd-filter-row", inputs: { activeFilters: { classPropertyName: "activeFilters", publicName: "activeFilters", isSignal: true, isRequired: true, transformFunction: null }, rowIndex: { classPropertyName: "rowIndex", publicName: "rowIndex", isSignal: true, isRequired: true, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: true, transformFunction: null }, isDisabled: { classPropertyName: "isDisabled", publicName: "isDisabled", isSignal: true, isRequired: true, transformFunction: null }, store: { classPropertyName: "store", publicName: "store", isSignal: true, isRequired: false, transformFunction: null }, currentFilter: { classPropertyName: "currentFilter", publicName: "currentFilter", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { removed: "removed", activeFilters: "activeFiltersChange" }, host: { properties: { "class": "this.wrapperClasses" } }, usesInheritance: true, ngImport: i0, template: "<upd-select class=\"w-100\" [isDisabled]=\"isDisabled()\" [items]=\"fieldsOptions()\" (selectedItem)=\"onSelectField($event)\"\n [selected]=\"selectedField\">\n</upd-select>\n<upd-select class=\"w-100\" [isDisabled]=\"isDisabled()\" [items]=\"comparisonOperatorOptions()\" (selectedItem)=\"onSelectOperand($event)\"\n [selected]=\"selectedOperand\">\n</upd-select>\n\n@if (isValueSectionEnabled()) {\n @switch (fieldType) {\n @case (DataTypeEnum.Number) {\n <upd-input wrapperClasses=\"w-100\" customClasses=\"h-100\" type=\"number\" (valueChange)=\"updateValue($event)\"\n [value]=\"selectedValue\"></upd-input>\n }\n @case (DataTypeEnum.Date) {\n\n }\n @default {\n <upd-input wrapperClasses=\"w-100\" customClasses=\"h-100\" type=\"text\" (valueChange)=\"updateValue($event)\"\n [value]=\"selectedValue\"></upd-input>\n }\n }\n} @else {\n <div class=\"w-100\">\n <input type=\"text\" class=\"form-control h-100\" disabled>\n </div>\n}\n\n<upd-button class=\"flex-shrink-1\" colorStyle=\"danger\" [isDisabled]=\"isDisabled()\" [isOutline]=\"true\" [isIcon]=\"true\"\n [iconModel]=\"{tablerIcon:'x'}\" (clicked)=\"removeFilterItem()\"></upd-button>\n", styles: [""], dependencies: [{ kind: "component", type: i4.ButtonComponent, selector: "upd-button", inputs: ["model", "text", "brandColorStyle", "customClasses", "isOutline", "isGhost", "isSquare", "isPill", "isIcon", "isLoading", "isList", "isFloating", "isAction", "isNavigationLink", "isLink", "shouldIgnoreBtnClass", "iconModel", "iconPosition", "isDisabled", "isActive", "badgeConfig", "colorStyle", "size", "title"], outputs: ["clicked"] }, { kind: "component", type: i5.InputComponent, selector: "upd-input", inputs: ["type", "mask", "maskConfig", "value", "size", "customClasses", "wrapperClasses", "maxLength", "isPlainText", "isReadOnly", "isLoading", "isRound", "isFlush", "isInputGroupFlat", "isPrependButton", "isAppendButton", "isFloating", "loaderPosition", "prependIconModel", "appendIconModel", "isValidationStatusLight", "layout"], outputs: ["valueChange", "blurred", "keyDown", "keyDownEsc", "keyUpEnter"] }, { kind: "component", type: i3$2.SelectComponent, selector: "upd-select", inputs: ["useSystemStyle", "shouldShowClearButton", "isCompact", "selected"], outputs: ["selectedItem"] }] }); }
|
|
724
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.1.0", type: FilterRowComponent, selector: "upd-filter-row", inputs: { activeFilters: { classPropertyName: "activeFilters", publicName: "activeFilters", isSignal: true, isRequired: true, transformFunction: null }, rowIndex: { classPropertyName: "rowIndex", publicName: "rowIndex", isSignal: true, isRequired: true, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: true, transformFunction: null }, isDisabled: { classPropertyName: "isDisabled", publicName: "isDisabled", isSignal: true, isRequired: true, transformFunction: null }, store: { classPropertyName: "store", publicName: "store", isSignal: true, isRequired: false, transformFunction: null }, currentFilter: { classPropertyName: "currentFilter", publicName: "currentFilter", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { removed: "removed", activeFilters: "activeFiltersChange" }, host: { properties: { "class": "this.wrapperClasses" } }, usesInheritance: true, ngImport: i0, template: "<upd-select class=\"w-100\" [isDisabled]=\"isDisabled()\" [items]=\"fieldsOptions()\" (selectedItem)=\"onSelectField($event)\"\n [selected]=\"selectedField\">\n</upd-select>\n<upd-select class=\"w-100\" [isDisabled]=\"isDisabled()\" [items]=\"comparisonOperatorOptions()\" (selectedItem)=\"onSelectOperand($event)\"\n [selected]=\"selectedOperand\">\n</upd-select>\n\n@if (isValueSectionEnabled()) {\n @switch (fieldType) {\n @case (DataTypeEnum.Number) {\n <upd-input wrapperClasses=\"w-100\" customClasses=\"h-100\" type=\"number\" (valueChange)=\"updateValue($event)\"\n [value]=\"selectedValue\"></upd-input>\n }\n @case (DataTypeEnum.Date) {\n\n }\n @default {\n <upd-input wrapperClasses=\"w-100\" customClasses=\"h-100\" type=\"text\" (valueChange)=\"updateValue($event)\"\n [value]=\"selectedValue\"></upd-input>\n }\n }\n} @else {\n <div class=\"w-100\">\n <input type=\"text\" class=\"form-control h-100\" disabled>\n </div>\n}\n\n<upd-button class=\"flex-shrink-1\" colorStyle=\"danger\" [isDisabled]=\"isDisabled()\" [isOutline]=\"true\" [isIcon]=\"true\"\n [iconModel]=\"{tablerIcon:'x'}\" (clicked)=\"removeFilterItem()\"></upd-button>\n", styles: [""], dependencies: [{ kind: "component", type: i4.ButtonComponent, selector: "upd-button", inputs: ["model", "text", "brandColorStyle", "customClasses", "isOutline", "isGhost", "isSquare", "isPill", "isIcon", "isLoading", "isList", "isFloating", "isAction", "isNavigationLink", "isLink", "shouldIgnoreBtnClass", "iconModel", "iconPosition", "isDisabled", "isActive", "badgeConfig", "colorStyle", "size", "title"], outputs: ["clicked"] }, { kind: "component", type: i5.InputComponent, selector: "upd-input", inputs: ["type", "mask", "maskConfig", "value", "size", "customClasses", "wrapperClasses", "maxLength", "isPlainText", "isReadOnly", "isLoading", "isRound", "isFlush", "isInputGroupFlat", "isPrependButton", "isAppendButton", "isFloating", "loaderPosition", "prependIconModel", "appendIconModel", "isValidationStatusLight", "layout"], outputs: ["valueChange", "blurred", "keyDown", "keyDownEsc", "keyUpEnter"] }, { kind: "component", type: i3$2.SelectComponent, selector: "upd-select", inputs: ["useSystemStyle", "shouldShowClearButton", "shouldTruncateSelectedText", "isCompact", "selected"], outputs: ["selectedItem"] }] }); }
|
|
725
725
|
}
|
|
726
726
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.0", ngImport: i0, type: FilterRowComponent, decorators: [{
|
|
727
727
|
type: Component,
|