@one-paragon/angular-utilities 2.0.1 → 2.0.3
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.
|
@@ -835,10 +835,10 @@ class NotPersistedTableSettings {
|
|
|
835
835
|
if (tableSettings.tableSettings?.virtualScrollSettings) {
|
|
836
836
|
const currVirt = tableSettings.tableSettings?.virtualScrollSettings || newNpts.virtualSettings;
|
|
837
837
|
if (!currVirt.headerHeight) {
|
|
838
|
-
currVirt.headerHeight =
|
|
838
|
+
currVirt.headerHeight = tableSettings.headerSettings?.headerHeight || DefaultVirtualScrollOptions.headerHeight;
|
|
839
839
|
}
|
|
840
840
|
if (!currVirt.rowHeight) {
|
|
841
|
-
currVirt.rowHeight =
|
|
841
|
+
currVirt.rowHeight = tableSettings.tableSettings?.rowHeight || DefaultVirtualScrollOptions.rowHeight;
|
|
842
842
|
}
|
|
843
843
|
newNpts.virtualSettings = { ...new VirtualScrollOptions(), ...currVirt };
|
|
844
844
|
}
|
|
@@ -3974,7 +3974,7 @@ class GenericTableComponent {
|
|
|
3974
3974
|
if (val == undefined || val === 'null')
|
|
3975
3975
|
return '';
|
|
3976
3976
|
try {
|
|
3977
|
-
return this.transformCreator.createTransformer(this.state.$getMetaData(key)(), true, true)(val);
|
|
3977
|
+
return this.transformCreator.createTransformer(this.state.$getMetaData(key)(), true, true)({ [`${key}`]: val });
|
|
3978
3978
|
}
|
|
3979
3979
|
catch (error) {
|
|
3980
3980
|
return val;
|
|
@@ -5041,8 +5041,8 @@ class TableHeaderMenuComponent {
|
|
|
5041
5041
|
exportToCsvService = inject(ExportToCsvService);
|
|
5042
5042
|
tableContainer = inject(TableContainerComponent);
|
|
5043
5043
|
state = this.tableContainer.state;
|
|
5044
|
-
$rowHeightNum = computed(() => +(this.tableContainer.$genericTable()?.$rowHeight()?.replace('px', '') || 0));
|
|
5045
|
-
$headerHeightNum = computed(() => +(this.tableContainer.$genericTable()?.$headerHeight()?.replace('px', '') || 0));
|
|
5044
|
+
$rowHeightNum = computed(() => +(this.tableContainer.$genericTable()?.$rowHeight()?.replace('px', '') || 0) || undefined);
|
|
5045
|
+
$headerHeightNum = computed(() => +(this.tableContainer.$genericTable()?.$headerHeight()?.replace('px', '') || 0) || undefined);
|
|
5046
5046
|
exportToCsv() {
|
|
5047
5047
|
this.exportToCsvService.exportToCsv(this.tableContainer.$data());
|
|
5048
5048
|
}
|
|
@@ -5057,11 +5057,11 @@ class TableHeaderMenuComponent {
|
|
|
5057
5057
|
this.state.setUserDefinedHeaderHeight(+element.value);
|
|
5058
5058
|
}
|
|
5059
5059
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: TableHeaderMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
5060
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.0", type: TableHeaderMenuComponent, isStandalone: true, selector: "lib-table-header-menu", viewQueries: [{ propertyName: "menu", first: true, predicate: MatMenu, descendants: true, isSignal: true }], ngImport: i0, template: "<mat-menu #mainMenu='matMenu' [xPosition]=\"'before'\">\r\n <span [matTooltip]=\"!r.$set().length ? 'Nothing To Reset' : ''\">\r\n <button mat-menu-item [matMenuTriggerFor]=\"r.menu()\" #d=\"matMenuItem\" [disabled]=\"!r.$set().length\">\r\n <mat-icon color=\"primary\">autorenew</mat-icon>\r\n <span>Reset</span>\r\n </button>\r\n </span>\r\n @if (!tableContainer.state.$tableSettings().hideExport) {\r\n <button mat-menu-item (click)=\"exportToCsv()\">\r\n <mat-icon color=\"primary\">file_download</mat-icon>\r\n <span>Export Table</span>\r\n </button>\r\n }\r\n @if (tableContainer.$tableId(); as tableId) {\r\n <button stop-propagation mat-menu-item [matMenuTriggerFor]=\"pm.menu()\">\r\n <mat-icon color=\"primary\">people</mat-icon>\r\n <span>Profiles</span>\r\n </button>\r\n <tb-profiles-menu class=\"profiles-menu\" #pm [tableId]=\"tableId\" [isMatMenuChild]=\"true\" />\r\n }\r\n\r\n\r\n <div mat-menu-item>\r\n <div class=\"height-input-wrapper\">\r\n <span>Row Height</span>\r\n <input #i class=\"input\" stop-propagation type=\"number\" [value]=\"$rowHeightNum()\"
|
|
5060
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.0", type: TableHeaderMenuComponent, isStandalone: true, selector: "lib-table-header-menu", viewQueries: [{ propertyName: "menu", first: true, predicate: MatMenu, descendants: true, isSignal: true }], ngImport: i0, template: "<mat-menu #mainMenu='matMenu' [xPosition]=\"'before'\">\r\n <span [matTooltip]=\"!r.$set().length ? 'Nothing To Reset' : ''\">\r\n <button mat-menu-item [matMenuTriggerFor]=\"r.menu()\" #d=\"matMenuItem\" [disabled]=\"!r.$set().length\">\r\n <mat-icon color=\"primary\">autorenew</mat-icon>\r\n <span>Reset</span>\r\n </button>\r\n </span>\r\n @if (!tableContainer.state.$tableSettings().hideExport) {\r\n <button mat-menu-item (click)=\"exportToCsv()\">\r\n <mat-icon color=\"primary\">file_download</mat-icon>\r\n <span>Export Table</span>\r\n </button>\r\n }\r\n @if (tableContainer.$tableId(); as tableId) {\r\n <button stop-propagation mat-menu-item [matMenuTriggerFor]=\"pm.menu()\">\r\n <mat-icon color=\"primary\">people</mat-icon>\r\n <span>Profiles</span>\r\n </button>\r\n <tb-profiles-menu class=\"profiles-menu\" #pm [tableId]=\"tableId\" [isMatMenuChild]=\"true\" />\r\n }\r\n\r\n\r\n <div mat-menu-item>\r\n <div class=\"height-input-wrapper\">\r\n <span>Row Height</span>\r\n <input #i class=\"input\" stop-propagation type=\"number\" \r\n [value]=\"$rowHeightNum()\"\r\n (change)=\"updateHeight('row', i)\"\r\n placeholder=\"Set Size\"\r\n [min]=\"10\" [max]=\"100\" />\r\n </div>\r\n </div>\r\n @if(!state.$tableSettings().hideHeader)\r\n {\r\n <div mat-menu-item>\r\n <div class=\"height-input-wrapper\">\r\n <span>Header Height</span>\r\n <input #i2 class=\"input\" stop-propagation type=\"number\"\r\n [value]=\"$headerHeightNum()\"\r\n (change)=\"updateHeight('header', i2)\"\r\n placeholder=\"Set Size\"\r\n [min]=\"10\" [max]=\"100\"/>\r\n </div>\r\n </div>\r\n }\r\n</mat-menu>\r\n<lib-reset-menu #r/>\r\n\r\n", styles: [".input{appearance:none;outline:none;background:none;box-shadow:none;margin:0;font:inherit;color:inherit;border:1px solid black;border-radius:4px;width:50px;padding:0 0 0 4px}.input::placeholder{font-size:12px}.height-input-wrapper{display:flex;gap:4px}\n"], dependencies: [{ kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i1$4.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i1$4.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i1$4.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: ProfilesMenuComponent, selector: "tb-profiles-menu", inputs: ["tableId", "isMatMenuChild"] }, { kind: "component", type: ResetMenuComponent, selector: "lib-reset-menu", outputs: ["onStateReset"] }, { kind: "directive", type: MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: StopPropagationDirective, selector: "[stop-propagation]" }] });
|
|
5061
5061
|
}
|
|
5062
5062
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: TableHeaderMenuComponent, decorators: [{
|
|
5063
5063
|
type: Component,
|
|
5064
|
-
args: [{ selector: 'lib-table-header-menu', imports: [MatMenuModule, MatIcon, ProfilesMenuComponent, ResetMenuComponent, MatTooltip, StopPropagationDirective], template: "<mat-menu #mainMenu='matMenu' [xPosition]=\"'before'\">\r\n <span [matTooltip]=\"!r.$set().length ? 'Nothing To Reset' : ''\">\r\n <button mat-menu-item [matMenuTriggerFor]=\"r.menu()\" #d=\"matMenuItem\" [disabled]=\"!r.$set().length\">\r\n <mat-icon color=\"primary\">autorenew</mat-icon>\r\n <span>Reset</span>\r\n </button>\r\n </span>\r\n @if (!tableContainer.state.$tableSettings().hideExport) {\r\n <button mat-menu-item (click)=\"exportToCsv()\">\r\n <mat-icon color=\"primary\">file_download</mat-icon>\r\n <span>Export Table</span>\r\n </button>\r\n }\r\n @if (tableContainer.$tableId(); as tableId) {\r\n <button stop-propagation mat-menu-item [matMenuTriggerFor]=\"pm.menu()\">\r\n <mat-icon color=\"primary\">people</mat-icon>\r\n <span>Profiles</span>\r\n </button>\r\n <tb-profiles-menu class=\"profiles-menu\" #pm [tableId]=\"tableId\" [isMatMenuChild]=\"true\" />\r\n }\r\n\r\n\r\n <div mat-menu-item>\r\n <div class=\"height-input-wrapper\">\r\n <span>Row Height</span>\r\n <input #i class=\"input\" stop-propagation type=\"number\" [value]=\"$rowHeightNum()\"
|
|
5064
|
+
args: [{ selector: 'lib-table-header-menu', imports: [MatMenuModule, MatIcon, ProfilesMenuComponent, ResetMenuComponent, MatTooltip, StopPropagationDirective], template: "<mat-menu #mainMenu='matMenu' [xPosition]=\"'before'\">\r\n <span [matTooltip]=\"!r.$set().length ? 'Nothing To Reset' : ''\">\r\n <button mat-menu-item [matMenuTriggerFor]=\"r.menu()\" #d=\"matMenuItem\" [disabled]=\"!r.$set().length\">\r\n <mat-icon color=\"primary\">autorenew</mat-icon>\r\n <span>Reset</span>\r\n </button>\r\n </span>\r\n @if (!tableContainer.state.$tableSettings().hideExport) {\r\n <button mat-menu-item (click)=\"exportToCsv()\">\r\n <mat-icon color=\"primary\">file_download</mat-icon>\r\n <span>Export Table</span>\r\n </button>\r\n }\r\n @if (tableContainer.$tableId(); as tableId) {\r\n <button stop-propagation mat-menu-item [matMenuTriggerFor]=\"pm.menu()\">\r\n <mat-icon color=\"primary\">people</mat-icon>\r\n <span>Profiles</span>\r\n </button>\r\n <tb-profiles-menu class=\"profiles-menu\" #pm [tableId]=\"tableId\" [isMatMenuChild]=\"true\" />\r\n }\r\n\r\n\r\n <div mat-menu-item>\r\n <div class=\"height-input-wrapper\">\r\n <span>Row Height</span>\r\n <input #i class=\"input\" stop-propagation type=\"number\" \r\n [value]=\"$rowHeightNum()\"\r\n (change)=\"updateHeight('row', i)\"\r\n placeholder=\"Set Size\"\r\n [min]=\"10\" [max]=\"100\" />\r\n </div>\r\n </div>\r\n @if(!state.$tableSettings().hideHeader)\r\n {\r\n <div mat-menu-item>\r\n <div class=\"height-input-wrapper\">\r\n <span>Header Height</span>\r\n <input #i2 class=\"input\" stop-propagation type=\"number\"\r\n [value]=\"$headerHeightNum()\"\r\n (change)=\"updateHeight('header', i2)\"\r\n placeholder=\"Set Size\"\r\n [min]=\"10\" [max]=\"100\"/>\r\n </div>\r\n </div>\r\n }\r\n</mat-menu>\r\n<lib-reset-menu #r/>\r\n\r\n", styles: [".input{appearance:none;outline:none;background:none;box-shadow:none;margin:0;font:inherit;color:inherit;border:1px solid black;border-radius:4px;width:50px;padding:0 0 0 4px}.input::placeholder{font-size:12px}.height-input-wrapper{display:flex;gap:4px}\n"] }]
|
|
5065
5065
|
}] });
|
|
5066
5066
|
|
|
5067
5067
|
class TableVirtualScrollStrategy {
|
|
@@ -5279,7 +5279,10 @@ class VirtualScrollContainer {
|
|
|
5279
5279
|
const minAmountOfRows = virtualScrollOptions?.amountOfVisibleItems || this.defaultOptions.amountOfVisibleItems;
|
|
5280
5280
|
const amountOfVisibleItems = Math.min(Math.max(amountOfRowsThatWillFit, minAmountOfRows), this.$dataLength());
|
|
5281
5281
|
let height = (rowHeight * amountOfVisibleItems);
|
|
5282
|
-
|
|
5282
|
+
if (height < available) {
|
|
5283
|
+
height += 22;
|
|
5284
|
+
}
|
|
5285
|
+
height += (footerHeight + headerHeight);
|
|
5283
5286
|
this.setHeight(height, el);
|
|
5284
5287
|
}
|
|
5285
5288
|
setHeight(height, el) {
|