@one-paragon/angular-utilities 2.0.0 → 2.0.2
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/action-state/ngrx.d.ts +1 -1
- package/fesm2022/one-paragon-angular-utilities.mjs +19 -16
- package/fesm2022/one-paragon-angular-utilities.mjs.map +1 -1
- package/package.json +1 -1
- package/table-builder/classes/TableState.d.ts +1 -1
- package/table-builder/classes/table-store.d.ts +1 -0
- package/table-builder/components/table-header-menu/table-header-menu.component.d.ts +2 -2
package/action-state/ngrx.d.ts
CHANGED
|
@@ -26,6 +26,6 @@ export interface State extends EntityState<ActionStatus> {
|
|
|
26
26
|
}
|
|
27
27
|
export declare const initialState: StatusState;
|
|
28
28
|
export declare const getStatusState: import("@ngrx/store").MemoizedSelector<object, State, import("@ngrx/store").DefaultProjectorFn<State>>;
|
|
29
|
-
export declare const selectIds: import("@ngrx/store").MemoizedSelector<object,
|
|
29
|
+
export declare const selectIds: import("@ngrx/store").MemoizedSelector<object, string[] | number[], (entityState: EntityState<ActionStatus>) => string[] | number[]>, selectEntities: import("@ngrx/store").MemoizedSelector<object, import("@ngrx/entity").Dictionary<ActionStatus>, (entityState: EntityState<ActionStatus>) => import("@ngrx/entity").Dictionary<ActionStatus>>, selectAll: import("@ngrx/store").MemoizedSelector<object, ActionStatus[], (entityState: EntityState<ActionStatus>) => ActionStatus[]>, selectTotal: import("@ngrx/store").MemoizedSelector<object, number, (entityState: EntityState<ActionStatus>) => number>;
|
|
30
30
|
export declare const selectEntity: (id: string) => import("@ngrx/store").MemoizedSelector<object, any, (s1: import("@ngrx/entity").Dictionary<ActionStatus>) => any>;
|
|
31
31
|
export declare function actionStatusReducer(state: StatusState | undefined, action: Action): StatusState;
|
|
@@ -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
|
}
|
|
@@ -934,7 +934,7 @@ var InitializationState;
|
|
|
934
934
|
(function (InitializationState) {
|
|
935
935
|
InitializationState[InitializationState["Created"] = 0] = "Created";
|
|
936
936
|
InitializationState[InitializationState["MetaDataLoaded"] = 1] = "MetaDataLoaded";
|
|
937
|
-
InitializationState[InitializationState["
|
|
937
|
+
InitializationState[InitializationState["TableSettingsLoaded"] = 2] = "TableSettingsLoaded";
|
|
938
938
|
InitializationState[InitializationState["Ready"] = 3] = "Ready";
|
|
939
939
|
})(InitializationState || (InitializationState = {}));
|
|
940
940
|
const defaultTableState = {
|
|
@@ -1916,6 +1916,7 @@ class TableStore extends ComponentStore {
|
|
|
1916
1916
|
getUserDefinedTableWidth$ = this.select(state => state.userDefined.table.width);
|
|
1917
1917
|
$userDefinedRowHeight = this.selectSignal(state => (state.userDefined.rowHeight));
|
|
1918
1918
|
$userDefinedHeaderHeight = this.selectSignal(state => (state.userDefined.headerHeight));
|
|
1919
|
+
$userDefinedPageSize = this.selectSignal(state => (state.userDefined.pageSize));
|
|
1919
1920
|
$footerCollapsed = this.selectSignal(state => state.persistedTableSettings.collapseFooter);
|
|
1920
1921
|
$headerCollapsed = this.selectSignal(state => state.persistedTableSettings.collapseHeader);
|
|
1921
1922
|
$groupBy = this.selectSignal(state => state.groupBy);
|
|
@@ -2007,13 +2008,13 @@ class TableStore extends ComponentStore {
|
|
|
2007
2008
|
updateStateFromPersistedState = this.updater((state, persistedState) => {
|
|
2008
2009
|
const incomingTableState = cleanPersistedState(state, persistedState);
|
|
2009
2010
|
const newState = this.updateStateFunc(state, incomingTableState);
|
|
2010
|
-
newState.initializationState = state.initializationState
|
|
2011
|
+
newState.initializationState = state.initializationState <= InitializationState.MetaDataLoaded ? InitializationState.TableSettingsLoaded : state.initializationState;
|
|
2011
2012
|
return newState;
|
|
2012
2013
|
});
|
|
2013
2014
|
updateStateFunc = (state, incomingTableState) => {
|
|
2014
2015
|
const metaData = state.metaData;
|
|
2015
2016
|
const sorted = incomingTableState.sorted?.length ? incomingTableState.sorted
|
|
2016
|
-
: state.initializationState
|
|
2017
|
+
: state.initializationState <= InitializationState.Created ? this.$preSort() : state.sorted;
|
|
2017
2018
|
return { ...state, ...incomingTableState, metaData, sorted };
|
|
2018
2019
|
};
|
|
2019
2020
|
setTableSettings = this.updater((state, settings) => {
|
|
@@ -2021,7 +2022,7 @@ class TableStore extends ComponentStore {
|
|
|
2021
2022
|
...state,
|
|
2022
2023
|
persistedTableSettings: state.persistedTableSettings.merge(settings),
|
|
2023
2024
|
notPersistedTableSettings: state.notPersistedTableSettings.merge(settings),
|
|
2024
|
-
initializationState: InitializationState.
|
|
2025
|
+
initializationState: InitializationState.TableSettingsLoaded
|
|
2025
2026
|
};
|
|
2026
2027
|
s.pageSize = settings.tableSettings?.paginatorSettings?.pageSize ?? s.pageSize;
|
|
2027
2028
|
s.showAll = settings.tableSettings?.paginatorSettings?.defaultAll ?? s.showAll;
|
|
@@ -4668,7 +4669,8 @@ class PaginatorComponent {
|
|
|
4668
4669
|
if (!paginator)
|
|
4669
4670
|
return;
|
|
4670
4671
|
const metaPageSize = this.state.$pageSize();
|
|
4671
|
-
|
|
4672
|
+
const initialized = this.state.$initializationState() >= InitializationState.Ready;
|
|
4673
|
+
untracked(() => initialized && paginator._changePageSize(metaPageSize));
|
|
4672
4674
|
});
|
|
4673
4675
|
onDataLengthEffect = effect(() => {
|
|
4674
4676
|
const paginator = this.$paginator();
|
|
@@ -4986,7 +4988,7 @@ class ResetMenuComponent {
|
|
|
4986
4988
|
$widthsSet = computed(() => Object.keys(this.state.$getUserDefinedWidths()).length);
|
|
4987
4989
|
$rowHeightSet = this.state.$userDefinedRowHeight;
|
|
4988
4990
|
headerHeightSet = this.state.$userDefinedHeaderHeight;
|
|
4989
|
-
pageSizeSet = this.state
|
|
4991
|
+
pageSizeSet = this.state.$userDefinedPageSize;
|
|
4990
4992
|
showAllSet = this.state.selectSignal(s => s.userDefined.showAll);
|
|
4991
4993
|
$set = computed(() => {
|
|
4992
4994
|
const arr = [];
|
|
@@ -5039,8 +5041,8 @@ class TableHeaderMenuComponent {
|
|
|
5039
5041
|
exportToCsvService = inject(ExportToCsvService);
|
|
5040
5042
|
tableContainer = inject(TableContainerComponent);
|
|
5041
5043
|
state = this.tableContainer.state;
|
|
5042
|
-
$rowHeightNum = computed(() => +(this.tableContainer.$genericTable()?.$rowHeight()?.replace('px', '') || 0));
|
|
5043
|
-
$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);
|
|
5044
5046
|
exportToCsv() {
|
|
5045
5047
|
this.exportToCsvService.exportToCsv(this.tableContainer.$data());
|
|
5046
5048
|
}
|
|
@@ -5055,11 +5057,11 @@ class TableHeaderMenuComponent {
|
|
|
5055
5057
|
this.state.setUserDefinedHeaderHeight(+element.value);
|
|
5056
5058
|
}
|
|
5057
5059
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: TableHeaderMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
5058
|
-
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]" }] });
|
|
5059
5061
|
}
|
|
5060
5062
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: TableHeaderMenuComponent, decorators: [{
|
|
5061
5063
|
type: Component,
|
|
5062
|
-
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"] }]
|
|
5063
5065
|
}] });
|
|
5064
5066
|
|
|
5065
5067
|
class TableVirtualScrollStrategy {
|
|
@@ -5427,18 +5429,19 @@ class TableContainerComponent {
|
|
|
5427
5429
|
persistedState.persistedTableSettings = new PersistedTableSettings(persistedState.persistedTableSettings);
|
|
5428
5430
|
this.state.updateStateFromPersistedState(persistedState);
|
|
5429
5431
|
}
|
|
5430
|
-
this.state.setInitializationState(InitializationState.
|
|
5432
|
+
this.state.setInitializationState(InitializationState.Ready);
|
|
5431
5433
|
});
|
|
5432
5434
|
});
|
|
5433
5435
|
#setPageSizeFromInputEffect = effect(() => {
|
|
5434
5436
|
const pageSize = this.$pageSize();
|
|
5435
|
-
|
|
5437
|
+
const userDefinedPageSize = this.state.$userDefinedPageSize();
|
|
5438
|
+
if (pageSize && !userDefinedPageSize) {
|
|
5436
5439
|
untracked(() => this.state.setPageSize(pageSize));
|
|
5437
5440
|
}
|
|
5438
5441
|
});
|
|
5439
5442
|
#patchedFilters = [];
|
|
5440
5443
|
#patchSavableFilterDirectivesFromPersistedStateEffect = effect(() => {
|
|
5441
|
-
const loaded = this.$isInitializationState(InitializationState.
|
|
5444
|
+
const loaded = this.$isInitializationState(InitializationState.TableSettingsLoaded)();
|
|
5442
5445
|
const filterDirectives = this.$allFilterDirectives();
|
|
5443
5446
|
if (!loaded || !filterDirectives.length)
|
|
5444
5447
|
return;
|
|
@@ -5453,7 +5456,7 @@ class TableContainerComponent {
|
|
|
5453
5456
|
});
|
|
5454
5457
|
});
|
|
5455
5458
|
#patchSavableFilterInputsFromPersistedStateEffect = effect(() => {
|
|
5456
|
-
const loaded = this.$isInitializationState(InitializationState.
|
|
5459
|
+
const loaded = this.$isInitializationState(InitializationState.TableSettingsLoaded)();
|
|
5457
5460
|
const inputFilters = this.$filterInfoInputs();
|
|
5458
5461
|
if (!loaded || !inputFilters.length)
|
|
5459
5462
|
return;
|