@paperless/angular 2.18.6 → 2.19.0
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/esm2020/lib/modules/table/components/table/table.component.mjs +90 -90
- package/esm2020/lib/modules/table/components/table-column/table-column.component.mjs +4 -2
- package/fesm2015/paperless-angular.mjs +80 -78
- package/fesm2015/paperless-angular.mjs.map +1 -1
- package/fesm2020/paperless-angular.mjs +80 -78
- package/fesm2020/paperless-angular.mjs.map +1 -1
- package/lib/modules/table/components/table/table.component.d.ts +12 -12
- package/lib/modules/table/components/table-column/table-column.component.d.ts +1 -1
- package/package.json +1 -1
|
@@ -3106,12 +3106,13 @@ let TableColumn = class TableColumn {
|
|
|
3106
3106
|
}
|
|
3107
3107
|
};
|
|
3108
3108
|
TableColumn.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: TableColumn, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
|
|
3109
|
-
TableColumn.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: TableColumn, selector: "p-table-column", inputs: { align: "align", flex: "flex", name: "name", path: "path", sizes: "sizes", variant: "variant", useSlot: "useSlot", hasCheckbox: "hasCheckbox", sticky: "sticky" }, queries: [{ propertyName: "template", first: true, predicate: TemplateRef, descendants: true, read: TemplateRef, static: true }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3109
|
+
TableColumn.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: TableColumn, selector: "p-table-column", inputs: { align: "align", headerAlign: "headerAlign", flex: "flex", name: "name", path: "path", sizes: "sizes", variant: "variant", useSlot: "useSlot", hasCheckbox: "hasCheckbox", sticky: "sticky" }, queries: [{ propertyName: "template", first: true, predicate: TemplateRef, descendants: true, read: TemplateRef, static: true }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3110
3110
|
TableColumn = __decorate([
|
|
3111
3111
|
ProxyCmp({
|
|
3112
3112
|
defineCustomElementFn: undefined,
|
|
3113
3113
|
inputs: [
|
|
3114
3114
|
'align',
|
|
3115
|
+
'headerAlign',
|
|
3115
3116
|
'flex',
|
|
3116
3117
|
'name',
|
|
3117
3118
|
'path',
|
|
@@ -3131,6 +3132,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
|
|
|
3131
3132
|
template: '<ng-content></ng-content>',
|
|
3132
3133
|
inputs: [
|
|
3133
3134
|
'align',
|
|
3135
|
+
'headerAlign',
|
|
3134
3136
|
'flex',
|
|
3135
3137
|
'name',
|
|
3136
3138
|
'path',
|
|
@@ -3615,7 +3617,7 @@ const defaultSizeOptions = [12, 24, 68, 136];
|
|
|
3615
3617
|
let Table = class Table {
|
|
3616
3618
|
constructor(_cd) {
|
|
3617
3619
|
this._cd = _cd;
|
|
3618
|
-
this.className =
|
|
3620
|
+
this.className = 'flex flex-col z-0';
|
|
3619
3621
|
this.theme = state.theme;
|
|
3620
3622
|
/**
|
|
3621
3623
|
* Wether data is loading
|
|
@@ -3660,7 +3662,7 @@ let Table = class Table {
|
|
|
3660
3662
|
/**
|
|
3661
3663
|
* The floating menu amount item text
|
|
3662
3664
|
*/
|
|
3663
|
-
this.floatingMenuAmountSelectedText =
|
|
3665
|
+
this.floatingMenuAmountSelectedText = '0 items selected';
|
|
3664
3666
|
/**
|
|
3665
3667
|
* Wether the floating menu has been shown atleast once
|
|
3666
3668
|
*/
|
|
@@ -3709,7 +3711,7 @@ let Table = class Table {
|
|
|
3709
3711
|
/**
|
|
3710
3712
|
* The action button icon
|
|
3711
3713
|
*/
|
|
3712
|
-
this.actionButtonIcon =
|
|
3714
|
+
this.actionButtonIcon = 'pencil';
|
|
3713
3715
|
/**
|
|
3714
3716
|
* Wether the action button is enabled
|
|
3715
3717
|
*/
|
|
@@ -3776,11 +3778,11 @@ let Table = class Table {
|
|
|
3776
3778
|
*/
|
|
3777
3779
|
this.hideOnSinglePage = true;
|
|
3778
3780
|
/* Empty state start */
|
|
3779
|
-
this.emptyStateType =
|
|
3780
|
-
this.emptyStateIllustration =
|
|
3781
|
-
this.emptyStateActionIcon =
|
|
3781
|
+
this.emptyStateType = 'no_filter';
|
|
3782
|
+
this.emptyStateIllustration = 'table';
|
|
3783
|
+
this.emptyStateActionIcon = 'plus';
|
|
3782
3784
|
this.enableEmptyStateAction = true;
|
|
3783
|
-
this.emptyStateFilteredIllustration =
|
|
3785
|
+
this.emptyStateFilteredIllustration = 'search';
|
|
3784
3786
|
/**
|
|
3785
3787
|
* Wether to enable scrolling
|
|
3786
3788
|
*/
|
|
@@ -3806,10 +3808,10 @@ let Table = class Table {
|
|
|
3806
3808
|
this._ctrlDown = false;
|
|
3807
3809
|
this.filterModalShow$ = new BehaviorSubject(false);
|
|
3808
3810
|
this._rowActionsSubscriptions = [];
|
|
3809
|
-
this.filterModalHeaderText =
|
|
3810
|
-
this.filterModalSaveText =
|
|
3811
|
-
this.filterModalCancelText =
|
|
3812
|
-
this.filterModalResetText =
|
|
3811
|
+
this.filterModalHeaderText = 'Filters';
|
|
3812
|
+
this.filterModalSaveText = 'Save';
|
|
3813
|
+
this.filterModalCancelText = 'Cancel';
|
|
3814
|
+
this.filterModalResetText = 'Reset filters';
|
|
3813
3815
|
this.filterModalShowReset = false;
|
|
3814
3816
|
this.filterModalShowResetMobile = false;
|
|
3815
3817
|
this.filterModalShow = new EventEmitter();
|
|
@@ -3841,37 +3843,37 @@ let Table = class Table {
|
|
|
3841
3843
|
}
|
|
3842
3844
|
ngOnInit() {
|
|
3843
3845
|
this._parseItems(this.items);
|
|
3844
|
-
onStateChange(
|
|
3846
|
+
onStateChange('theme', value => this._checkTheme(value));
|
|
3845
3847
|
this.loadingRows = Array.from({
|
|
3846
3848
|
length: this.amountOfLoadingRows,
|
|
3847
3849
|
});
|
|
3848
3850
|
this.filterModalShow$
|
|
3849
3851
|
.pipe(untilDestroyed(this), distinctUntilChanged())
|
|
3850
|
-
.subscribe(
|
|
3852
|
+
.subscribe(value => this.filterModalShow.next(value));
|
|
3851
3853
|
}
|
|
3852
3854
|
ngOnChanges(changes) {
|
|
3853
|
-
if (changes[
|
|
3854
|
-
this._parseItems(changes[
|
|
3855
|
+
if (changes['items']) {
|
|
3856
|
+
this._parseItems(changes['items'].currentValue);
|
|
3855
3857
|
}
|
|
3856
|
-
if (changes[
|
|
3858
|
+
if (changes['amountOfLoadingRows']) {
|
|
3857
3859
|
this.loadingRows = Array.from({
|
|
3858
|
-
length: changes[
|
|
3860
|
+
length: changes['amountOfLoadingRows'].currentValue,
|
|
3859
3861
|
});
|
|
3860
3862
|
}
|
|
3861
3863
|
let calculateRowSelectionData = false;
|
|
3862
|
-
if (changes[
|
|
3864
|
+
if (changes['enableRowSelection']) {
|
|
3863
3865
|
this._inputEnableRowSelection =
|
|
3864
|
-
changes[
|
|
3866
|
+
changes['enableRowSelection'].currentValue;
|
|
3865
3867
|
calculateRowSelectionData = true;
|
|
3866
3868
|
}
|
|
3867
|
-
if (changes[
|
|
3868
|
-
this._inputRowSelectionLimit = changes[
|
|
3869
|
+
if (changes['rowSelectionLimit']) {
|
|
3870
|
+
this._inputRowSelectionLimit = changes['rowSelectionLimit'].currentValue;
|
|
3869
3871
|
calculateRowSelectionData = true;
|
|
3870
3872
|
}
|
|
3871
|
-
if (calculateRowSelectionData || changes[
|
|
3873
|
+
if (calculateRowSelectionData || changes['selectedRows']) {
|
|
3872
3874
|
this._setRowSelectionData();
|
|
3873
3875
|
}
|
|
3874
|
-
if (changes[
|
|
3876
|
+
if (changes['enableScroll']?.currentValue) {
|
|
3875
3877
|
this._checkChangesSubscriptions();
|
|
3876
3878
|
}
|
|
3877
3879
|
}
|
|
@@ -3897,19 +3899,19 @@ let Table = class Table {
|
|
|
3897
3899
|
this._calculateColumnWidths();
|
|
3898
3900
|
}
|
|
3899
3901
|
keyDown({ key }) {
|
|
3900
|
-
if (key !==
|
|
3902
|
+
if (key !== 'Control' || this._ctrlDown === true) {
|
|
3901
3903
|
return;
|
|
3902
3904
|
}
|
|
3903
3905
|
this._ctrlDown = true;
|
|
3904
3906
|
}
|
|
3905
3907
|
keyUp({ key }) {
|
|
3906
|
-
if (key !==
|
|
3908
|
+
if (key !== 'Control' || this._ctrlDown === false) {
|
|
3907
3909
|
return;
|
|
3908
3910
|
}
|
|
3909
3911
|
this._ctrlDown = false;
|
|
3910
3912
|
}
|
|
3911
3913
|
visibilityChange() {
|
|
3912
|
-
if (document.visibilityState !==
|
|
3914
|
+
if (document.visibilityState !== 'hidden' || this._ctrlDown === false) {
|
|
3913
3915
|
return;
|
|
3914
3916
|
}
|
|
3915
3917
|
this._ctrlDown = false;
|
|
@@ -3950,7 +3952,7 @@ let Table = class Table {
|
|
|
3950
3952
|
if (!actions?.length) {
|
|
3951
3953
|
return [];
|
|
3952
3954
|
}
|
|
3953
|
-
return actions.filter(
|
|
3955
|
+
return actions.filter(a => !a.showFunction || a.showFunction(this.parsedItems[rowIndex]));
|
|
3954
3956
|
}
|
|
3955
3957
|
onContainerXScroll(ev) {
|
|
3956
3958
|
if (!this.enableScroll) {
|
|
@@ -3978,7 +3980,7 @@ let Table = class Table {
|
|
|
3978
3980
|
let definitionsArray = Array.from(this.extraHeaderDefinitions);
|
|
3979
3981
|
definitionsArray = this._parseDefinitions(definitionsArray);
|
|
3980
3982
|
for (const col of definitionsArray) {
|
|
3981
|
-
col.sticky = col.sticky === true ?
|
|
3983
|
+
col.sticky = col.sticky === true ? 'secondary' : false;
|
|
3982
3984
|
}
|
|
3983
3985
|
this.extraHeaders$.next(definitionsArray);
|
|
3984
3986
|
}
|
|
@@ -4020,7 +4022,7 @@ let Table = class Table {
|
|
|
4020
4022
|
}
|
|
4021
4023
|
for (let i = 0; i < this.selectedRows.length; i++) {
|
|
4022
4024
|
const value = this.selectedRows[i];
|
|
4023
|
-
const row = this.parsedItems.find(
|
|
4025
|
+
const row = this.parsedItems.find(d => this._getSelectionValue(d, i) === this._getSelectionValue(value, i));
|
|
4024
4026
|
if (!row) {
|
|
4025
4027
|
continue;
|
|
4026
4028
|
}
|
|
@@ -4069,7 +4071,7 @@ let Table = class Table {
|
|
|
4069
4071
|
return this.selectionKey ? row?.[this.selectionKey] || index : index;
|
|
4070
4072
|
}
|
|
4071
4073
|
_selectionContains(row, index, returnIndex = false) {
|
|
4072
|
-
const returnValue = this.selectedRows.findIndex(
|
|
4074
|
+
const returnValue = this.selectedRows.findIndex(item => this._getSelectionValue(row, index) ===
|
|
4073
4075
|
this._getSelectionValue(item, index));
|
|
4074
4076
|
return !returnIndex ? returnValue >= 0 : returnValue;
|
|
4075
4077
|
}
|
|
@@ -4112,8 +4114,8 @@ let Table = class Table {
|
|
|
4112
4114
|
}
|
|
4113
4115
|
_rowClick($event, index) {
|
|
4114
4116
|
const target = $event.target;
|
|
4115
|
-
if (target.tagName.toLowerCase() ===
|
|
4116
|
-
target.type ===
|
|
4117
|
+
if (target.tagName.toLowerCase() === 'input' ||
|
|
4118
|
+
target.type === 'checkbox') {
|
|
4117
4119
|
return;
|
|
4118
4120
|
}
|
|
4119
4121
|
const row = this._findRow(target);
|
|
@@ -4140,17 +4142,17 @@ let Table = class Table {
|
|
|
4140
4142
|
this._checkboxChange(checkbox, index);
|
|
4141
4143
|
}
|
|
4142
4144
|
_getActionRouterLink(routerLink, rowIndex) {
|
|
4143
|
-
if (typeof routerLink ===
|
|
4145
|
+
if (typeof routerLink === 'function') {
|
|
4144
4146
|
const item = this.parsedItems[rowIndex];
|
|
4145
4147
|
return this._getActionRouterLink(routerLink(item), rowIndex);
|
|
4146
4148
|
}
|
|
4147
|
-
if (typeof routerLink ===
|
|
4149
|
+
if (typeof routerLink === 'string' || Array.isArray(routerLink)) {
|
|
4148
4150
|
return new BehaviorSubject(routerLink);
|
|
4149
4151
|
}
|
|
4150
4152
|
return routerLink;
|
|
4151
4153
|
}
|
|
4152
4154
|
_getActionQueryParams(queryParams, rowIndex) {
|
|
4153
|
-
if (typeof queryParams ===
|
|
4155
|
+
if (typeof queryParams === 'function') {
|
|
4154
4156
|
const item = this.parsedItems[rowIndex];
|
|
4155
4157
|
return this._getActionQueryParams(queryParams(item), rowIndex);
|
|
4156
4158
|
}
|
|
@@ -4169,8 +4171,8 @@ let Table = class Table {
|
|
|
4169
4171
|
if (!action.action) {
|
|
4170
4172
|
return;
|
|
4171
4173
|
}
|
|
4172
|
-
if (action.type ===
|
|
4173
|
-
(action.type ===
|
|
4174
|
+
if (action.type === 'multi' ||
|
|
4175
|
+
(action.type === 'both' && rowIndex === undefined)) {
|
|
4174
4176
|
action.action.emit({
|
|
4175
4177
|
items: this.selectedRows,
|
|
4176
4178
|
multi: true,
|
|
@@ -4195,7 +4197,7 @@ let Table = class Table {
|
|
|
4195
4197
|
if (!el) {
|
|
4196
4198
|
return el;
|
|
4197
4199
|
}
|
|
4198
|
-
if (el?.tagName?.toLowerCase() ===
|
|
4200
|
+
if (el?.tagName?.toLowerCase() === 'p-table-row') {
|
|
4199
4201
|
return el;
|
|
4200
4202
|
}
|
|
4201
4203
|
return this._findRow(el?.parentElement);
|
|
@@ -4204,11 +4206,11 @@ let Table = class Table {
|
|
|
4204
4206
|
if (!el) {
|
|
4205
4207
|
return null;
|
|
4206
4208
|
}
|
|
4207
|
-
if (el.getAttribute(
|
|
4208
|
-
el.getAttribute(
|
|
4209
|
+
if (el.getAttribute('data-is-action') !== null &&
|
|
4210
|
+
el.getAttribute('data-is-action') !== 'false') {
|
|
4209
4211
|
return el;
|
|
4210
4212
|
}
|
|
4211
|
-
if (el?.tagName?.toLowerCase() ===
|
|
4213
|
+
if (el?.tagName?.toLowerCase() === 'p-table-row') {
|
|
4212
4214
|
return null;
|
|
4213
4215
|
}
|
|
4214
4216
|
return this._findRowAction(el?.parentElement);
|
|
@@ -4228,14 +4230,14 @@ let Table = class Table {
|
|
|
4228
4230
|
subscription.unsubscribe();
|
|
4229
4231
|
}
|
|
4230
4232
|
}
|
|
4231
|
-
this._rowActionsSubscriptions = actions.map(
|
|
4233
|
+
this._rowActionsSubscriptions = actions.map(action => action._loadingChanged
|
|
4232
4234
|
.pipe(untilDestroyed(this))
|
|
4233
4235
|
.subscribe(() => this._cd.detectChanges()));
|
|
4234
4236
|
// we hack this to any[] to make it work..
|
|
4235
|
-
const rowActionsRow = actions.filter(
|
|
4236
|
-
const rowActionsFloating = actions.filter(
|
|
4237
|
-
(a.type ===
|
|
4238
|
-
(mobile && a.type ===
|
|
4237
|
+
const rowActionsRow = actions.filter(a => a.type === 'both' || a.type === 'single');
|
|
4238
|
+
const rowActionsFloating = actions.filter(a => (this._inputEnableRowSelection &&
|
|
4239
|
+
(a.type === 'both' || a.type === 'multi')) ||
|
|
4240
|
+
(mobile && a.type === 'single' && !a.routerLink));
|
|
4239
4241
|
let rowSelectionLimit = this._inputRowSelectionLimit;
|
|
4240
4242
|
if (mobile && // we're mobile
|
|
4241
4243
|
rowActionsFloating?.length && // we have atleast 1 item in _rowActionsFloating
|
|
@@ -4254,15 +4256,15 @@ let Table = class Table {
|
|
|
4254
4256
|
this.rowActionsRow$.next(rowActionsRow);
|
|
4255
4257
|
this.rowActionsFloatingAll$.next(rowActionsFloating);
|
|
4256
4258
|
this.floatingMenuShown$
|
|
4257
|
-
.pipe(take(1), filter(
|
|
4259
|
+
.pipe(take(1), filter(v => !!v))
|
|
4258
4260
|
.subscribe(() => this._showFloatingMenu());
|
|
4259
4261
|
}, 200);
|
|
4260
4262
|
}
|
|
4261
4263
|
_showFloatingMenu() {
|
|
4262
|
-
this.rowActionsFloatingAll$.pipe(take(1)).subscribe(
|
|
4264
|
+
this.rowActionsFloatingAll$.pipe(take(1)).subscribe(actions => {
|
|
4263
4265
|
if (this.rowSelectionLimit === 1 &&
|
|
4264
|
-
actions.findIndex(
|
|
4265
|
-
actions = actions.filter(
|
|
4266
|
+
actions.findIndex(a => (a.type === 'single' || a.type === 'both') && a.showFunction) >= 0) {
|
|
4267
|
+
actions = actions.filter(a => a.type === 'multi' ||
|
|
4266
4268
|
!a.showFunction ||
|
|
4267
4269
|
a.showFunction(this.selectedRows[0]));
|
|
4268
4270
|
}
|
|
@@ -4271,18 +4273,18 @@ let Table = class Table {
|
|
|
4271
4273
|
});
|
|
4272
4274
|
}
|
|
4273
4275
|
_parseDefinitions(definitionsArray) {
|
|
4274
|
-
return definitionsArray.map(
|
|
4276
|
+
return definitionsArray.map(definition => this._parseDefinitionSizes(definition));
|
|
4275
4277
|
}
|
|
4276
4278
|
_parseDefinitionSizes(definition) {
|
|
4277
4279
|
const definitionAny = definition;
|
|
4278
|
-
let parsedSizes = { default:
|
|
4280
|
+
let parsedSizes = { default: 'full' };
|
|
4279
4281
|
for (const [index, size] of tableColumSizesOptions.entries()) {
|
|
4280
|
-
if (definitionAny.sizes ===
|
|
4281
|
-
definitionAny.sizes ===
|
|
4282
|
-
definitionAny.sizes ===
|
|
4283
|
-
typeof definitionAny.sizes ===
|
|
4282
|
+
if (definitionAny.sizes === 'auto' ||
|
|
4283
|
+
definitionAny.sizes === 'hidden' ||
|
|
4284
|
+
definitionAny.sizes === 'full' ||
|
|
4285
|
+
typeof definitionAny.sizes === 'number') {
|
|
4284
4286
|
parsedSizes[size] =
|
|
4285
|
-
definitionAny.sizes ===
|
|
4287
|
+
definitionAny.sizes === 'auto' ? 'full' : definitionAny.sizes;
|
|
4286
4288
|
continue;
|
|
4287
4289
|
}
|
|
4288
4290
|
parsedSizes[size] =
|
|
@@ -4315,23 +4317,23 @@ let Table = class Table {
|
|
|
4315
4317
|
clearTimeout(this._calculateColumnWidthsTimeout);
|
|
4316
4318
|
this._calculateColumnWidthsTimeout = 0;
|
|
4317
4319
|
}
|
|
4318
|
-
const rows = this.tableRows.map(
|
|
4319
|
-
const cells = rows.flatMap(
|
|
4320
|
+
const rows = this.tableRows.map(c => c.nativeElement);
|
|
4321
|
+
const cells = rows.flatMap(row => Array.from(row.querySelectorAll('p-table-cell-ngx')));
|
|
4320
4322
|
this._calculateColumnWidthsTimeout = setTimeout(async () => {
|
|
4321
4323
|
this._setRowsWidth(rows);
|
|
4322
4324
|
const promises = [];
|
|
4323
4325
|
for (const cell of cells) {
|
|
4324
4326
|
if (cell.style.width?.length) {
|
|
4325
|
-
cell.style.width =
|
|
4327
|
+
cell.style.width = 'unset';
|
|
4326
4328
|
}
|
|
4327
|
-
promises.push(new Promise(
|
|
4329
|
+
promises.push(new Promise(resolve => setTimeout(() => {
|
|
4328
4330
|
const rect = cell.getBoundingClientRect();
|
|
4329
|
-
cell.setAttribute(
|
|
4331
|
+
cell.setAttribute('style', `width: ${rect.width}px !important`);
|
|
4330
4332
|
resolve();
|
|
4331
4333
|
}, 100)));
|
|
4332
4334
|
}
|
|
4333
4335
|
await Promise.all(promises);
|
|
4334
|
-
this._setRowsWidth(rows,
|
|
4336
|
+
this._setRowsWidth(rows, 'min-content');
|
|
4335
4337
|
this._resetScrollPosition();
|
|
4336
4338
|
}, 200);
|
|
4337
4339
|
}
|
|
@@ -4342,21 +4344,21 @@ let Table = class Table {
|
|
|
4342
4344
|
if (!shadow) {
|
|
4343
4345
|
continue;
|
|
4344
4346
|
}
|
|
4345
|
-
const firstDiv = shadow.querySelector(
|
|
4347
|
+
const firstDiv = shadow.querySelector('*:nth-child(1)');
|
|
4346
4348
|
if (!firstDiv) {
|
|
4347
4349
|
continue;
|
|
4348
4350
|
}
|
|
4349
|
-
const secondDiv = firstDiv.querySelector(
|
|
4351
|
+
const secondDiv = firstDiv.querySelector('*:nth-child(1)');
|
|
4350
4352
|
if (!secondDiv) {
|
|
4351
4353
|
continue;
|
|
4352
4354
|
}
|
|
4353
4355
|
if (value === null) {
|
|
4354
|
-
firstDiv.setAttribute(
|
|
4355
|
-
secondDiv.setAttribute(
|
|
4356
|
+
firstDiv.setAttribute('style', '');
|
|
4357
|
+
secondDiv.setAttribute('style', '');
|
|
4356
4358
|
continue;
|
|
4357
4359
|
}
|
|
4358
|
-
firstDiv.setAttribute(
|
|
4359
|
-
secondDiv.setAttribute(
|
|
4360
|
+
firstDiv.setAttribute('style', 'width: min-content;');
|
|
4361
|
+
secondDiv.setAttribute('style', 'width: min-content;');
|
|
4360
4362
|
if (i === 0) {
|
|
4361
4363
|
this._totalWidth = firstDiv.getBoundingClientRect().width;
|
|
4362
4364
|
}
|
|
@@ -4395,13 +4397,13 @@ Table = __decorate([
|
|
|
4395
4397
|
], Table);
|
|
4396
4398
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: Table, decorators: [{
|
|
4397
4399
|
type: Component,
|
|
4398
|
-
args: [{ selector: "p-table-ngx", changeDetection: ChangeDetectionStrategy.OnPush, template: "<p-table-container>\n\t<p-table-header\n\t\t*ngIf=\"enableHeader\"\n\t\tclass=\"mb-8\"\n\t\t[quickFilters]=\"quickFilters\"\n\t\t[activeQuickFilterIdentifier]=\"activeQuickFilterIdentifier\"\n\t\t(quickFilter)=\"onQuickFilter($event)\"\n\t\t[enableSearch]=\"enableSearch\"\n\t\t[query]=\"query\"\n\t\t(queryChange)=\"onQueryChange($event)\"\n\t\t[enableFilter]=\"enableFilter\"\n\t\t[enableFilterDesktop]=\"enableFilterDesktop\"\n\t\t[selectedFiltersAmount]=\"selectedFiltersAmount\"\n\t\t[filterButtonTemplate]=\"filterButtonTemplate\"\n\t\t(filter)=\"filterModalShow$.next(true)\"\n\t\t[enableAction]=\"enableAction\"\n\t\t[canUseAction]=\"actionButtonEnabled\"\n\t\t[actionButtonTemplate]=\"actionButtonTemplate\"\n\t\t[actionLoading]=\"actionButtonLoading\"\n\t\t[actionText]=\"actionButtonText\"\n\t\t[actionIcon]=\"actionButtonIcon\"\n\t\t(action)=\"action.emit()\"\n\t\t[itemsSelectedAmount]=\"selectedRows.length\"\n\t\t[enableExport]=\"enableExport\"\n\t\t(export)=\"export.emit()\"\n\t\t[loading]=\"headerLoading\"\n\t>\n\t\t<ng-container *ngIf=\"headerCustomFilterTemplate\">\n\t\t\t<ng-container\n\t\t\t\t*ngTemplateOutlet=\"headerCustomFilterTemplate\"\n\t\t\t></ng-container>\n\t\t</ng-container>\n\n\t\t<ng-container *ngIf=\"headerCustomActionsTemplate\">\n\t\t\t<ng-container\n\t\t\t\t*ngTemplateOutlet=\"headerCustomActionsTemplate\"\n\t\t\t></ng-container>\n\t\t</ng-container>\n\t</p-table-header>\n\n\t<div\n\t\tclass=\"relative flex-1\"\n\t\t*ngIf=\"enableScroll; else rowsTemplate\"\n\t>\n\t\t<div\n\t\t\tclass=\"flex flex-col overflow-x-auto\"\n\t\t\t#scrollContainer\n\t\t\t[class]=\"\n\t\t\t\tcn(\n\t\t\t\t\t'before:absolute before:top-0 before:left-0 before:z-[1] before:pointer-events-none',\n\t\t\t\t\t'before:w-24 before:h-full before:transition-opacity',\n\t\t\t\t\t'before:bg-gradient-to-r before:from-white dark:before:from-hurricane-700 before:via-white/80 dark:before:via-hurricane-700/90 before:to-transparent',\n\t\t\t\t\t'after:absolute after:top-0 after:right-0 after:z-[0] before:pointer-events-none',\n\t\t\t\t\t'after:w-24 after:h-full after:transition-opacity',\n\t\t\t\t\t'after:bg-gradient-to-l after:from-white after:dark:from-hurricane-700 after:via-white/80 dark:after:via-hurricane-700/90 after:to-transparent',\n\t\t\t\t\t{\n\t\t\t\t\t\t'before:opacity-0': reachedScrollStart$ | async,\n\t\t\t\t\t\t'after:opacity-0': reachedScrollEnd$ | async,\n\t\t\t\t\t\t'before:opacity-100': (reachedScrollStart$ | async) === false,\n\t\t\t\t\t\t'after:opacity-100': (reachedScrollEnd$ | async) === false\n\t\t\t\t\t}\n\t\t\t\t)\n\t\t\t\"\n\t\t\t(scroll)=\"onContainerXScroll($event)\"\n\t\t>\n\t\t\t<ng-container *ngTemplateOutlet=\"rowsTemplate\"></ng-container>\n\t\t</div>\n\t</div>\n\n\t<ng-container *ngIf=\"enableFloatingMenu && enableRowSelection\">\n\t\t<p-floating-menu-container\n\t\t\t[usedInTable]=\"true\"\n\t\t\t[class]=\"\n\t\t\t\tfloatingMenuContainerClass({\n\t\t\t\t\thasFooter: enableFooter && (footerHidden$ | async) === false,\n\t\t\t\t\tactive: selectedRows.length > 0,\n\t\t\t\t\tshown: $any(floatingMenuShown$ | async)\n\t\t\t\t})\n\t\t\t\"\n\t\t\t[amount]=\"floatingMenuAmountSelectedText\"\n\t\t\t[enableAmountSelected]=\"!!(rowActionsFloating$ | async)?.length\"\n\t\t\t(close)=\"_selectAllChange(null, false)\"\n\t\t>\n\t\t\t<p-floating-menu-item\n\t\t\t\t*ngFor=\"let action of rowActionsFloating$ | async\"\n\t\t\t\tslot=\"floating-menu-item\"\n\t\t\t\t[disabled]=\"\n\t\t\t\t\t(action['type'] === 'single' && selectedRows.length > 1) ||\n\t\t\t\t\taction['disabled']\n\t\t\t\t\"\n\t\t\t\t[loading]=\"action['loading']\"\n\t\t\t\t[icon]=\"action['icon']\"\n\t\t\t\t[iconRotate]=\"action['iconRotate']\"\n\t\t\t\t[iconFlip]=\"action['iconFlip']\"\n\t\t\t\t(click)=\"_rowActionClick(action)\"\n\t\t\t>\n\t\t\t\t{{ action['label'] }}\n\t\t\t</p-floating-menu-item>\n\t\t</p-floating-menu-container>\n\t</ng-container>\n\n\t<p-table-footer\n\t\t*ngIf=\"enableFooter\"\n\t\t[hideOnSinglePage]=\"hideOnSinglePage\"\n\t\t[enablePaginationSize]=\"enablePaginationSize\"\n\t\t[pageSize]=\"pageSize\"\n\t\t[pageSizeOptions]=\"pageSizeOptions\"\n\t\t(pageSizeChange)=\"onPageSizeChange($event)\"\n\t\t[enablePaginationPages]=\"enablePaginationPages\"\n\t\t[page]=\"page\"\n\t\t[total]=\"total\"\n\t\t(pageChange)=\"onPageChange($event)\"\n\t\t[loading]=\"footerLoading\"\n\t\t(hiddenChange)=\"footerHidden$.next($event.detail)\"\n\t\t[tableHeaderHasAction]=\"enableHeader && enableAction && actionButtonEnabled\"\n\t></p-table-footer>\n</p-table-container>\n\n<ng-template #rowsTemplate>\n\t<p-table-row\n\t\t*ngIf=\"(extraHeaders$ | async)?.length\"\n\t\tvariant=\"header-secondary\"\n\t\tclass=\"z-[2]\"\n\t\t[isLast]=\"true\"\n\t>\n\t\t<ng-container *ngFor=\"let col of extraHeaders$ | async; let index = index\">\n\t\t\t<p-table-cell-ngx\n\t\t\t\t[definition]=\"col\"\n\t\t\t\tvariant=\"header-secondary\"\n\t\t\t\t[index]=\"index\"\n\t\t\t\t[checkboxOffset]=\"index === 0 && enableRowSelection\"\n\t\t\t\t[scrollable]=\"this.enableScroll\"\n\t\t\t>\n\t\t\t\t<b>{{ col.name }}</b>\n\t\t\t</p-table-cell-ngx>\n\t\t</ng-container>\n\t</p-table-row>\n\n\t<p-table-row variant=\"header\">\n\t\t<ng-container *ngFor=\"let col of columns$ | async; let index = index\">\n\t\t\t<p-table-cell-ngx\n\t\t\t\t[definition]=\"col\"\n\t\t\t\t[value]=\"col.name\"\n\t\t\t\tvariant=\"header\"\n\t\t\t\t[index]=\"index\"\n\t\t\t\t[checkbox]=\"\n\t\t\t\t\t(index === 0 || col.hasCheckbox) && enableRowSelection\n\t\t\t\t\t\t? checkboxTemplate\n\t\t\t\t\t\t: undefined\n\t\t\t\t\"\n\t\t\t\t[scrollable]=\"this.enableScroll\"\n\t\t\t></p-table-cell-ngx>\n\t\t\t<ng-template #checkboxTemplate>\n\t\t\t\t<p-checkbox\n\t\t\t\t\t(checkedChange)=\"_selectAllChange($event)\"\n\t\t\t\t\t[checked]=\"_selectionContainsAll()\"\n\t\t\t\t\t[indeterminate]=\"_selectionIndeterminate()\"\n\t\t\t\t\t[class.opacity-0]=\"rowSelectionLimit !== undefined\"\n\t\t\t\t\t[disabled]=\"rowSelectionLimit !== undefined\"\n\t\t\t\t></p-checkbox>\n\t\t\t</ng-template>\n\t\t</ng-container>\n\t</p-table-row>\n\n\t<div class=\"flex flex-1 flex-col\">\n\t\t<ng-container *ngIf=\"loading; else contentTemplate\">\n\t\t\t<p-table-row\n\t\t\t\t*ngFor=\"let r of loadingRows; let rowIndex = index\"\n\t\t\t\tclass=\"group\"\n\t\t\t\t[enableHover]=\"enableRowSelection || enableRowClick\"\n\t\t\t\t[isLast]=\"rowIndex === loadingRows.length - 1\"\n\t\t\t>\n\t\t\t\t<ng-container *ngFor=\"let col of columns$ | async; let index = index\">\n\t\t\t\t\t<p-table-cell-ngx\n\t\t\t\t\t\t[definition]=\"col\"\n\t\t\t\t\t\tvariant=\"loading\"\n\t\t\t\t\t\t[checkbox]=\"\n\t\t\t\t\t\t\t(index === 0 || col.hasCheckbox) && enableRowSelection\n\t\t\t\t\t\t\t\t? checkboxTemplate\n\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t\"\n\t\t\t\t\t\t[index]=\"index\"\n\t\t\t\t\t\t[rowIndex]=\"rowIndex\"\n\t\t\t\t\t\t[scrollable]=\"this.enableScroll\"\n\t\t\t\t\t></p-table-cell-ngx>\n\t\t\t\t\t<ng-template #checkboxTemplate>\n\t\t\t\t\t\t<p-loader\n\t\t\t\t\t\t\tvariant=\"ghost\"\n\t\t\t\t\t\t\tclass=\"h-6 w-6 rounded\"\n\t\t\t\t\t\t></p-loader>\n\t\t\t\t\t</ng-template>\n\t\t\t\t</ng-container>\n\t\t\t</p-table-row>\n\t\t</ng-container>\n\n\t\t<ng-template #contentTemplate>\n\t\t\t<ng-container *ngIf=\"parsedItems?.length; else emptyStateTemplate\">\n\t\t\t\t<p-table-row\n\t\t\t\t\t*ngFor=\"let item of parsedItems; let rowIndex = index\"\n\t\t\t\t\tclass=\"group\"\n\t\t\t\t\t[enableHover]=\"enableRowSelection || enableRowClick\"\n\t\t\t\t\t[checked]=\"_selectionContains(item, rowIndex)\"\n\t\t\t\t\t[isLast]=\"rowIndex === parsedItems.length - 1\"\n\t\t\t\t\t(click)=\"_rowClick($event, rowIndex)\"\n\t\t\t\t>\n\t\t\t\t\t<ng-container\n\t\t\t\t\t\t*ngIf=\"\n\t\t\t\t\t\t\tparseRowActionsRow(\n\t\t\t\t\t\t\t\trowActionsRow$ | async,\n\t\t\t\t\t\t\t\trowIndex\n\t\t\t\t\t\t\t) as rowActionsRow\n\t\t\t\t\t\t\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<ng-container\n\t\t\t\t\t\t\t*ngFor=\"let col of columns$ | async; let index = index\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<p-table-cell-ngx\n\t\t\t\t\t\t\t\t[definition]=\"col\"\n\t\t\t\t\t\t\t\t[item]=\"item\"\n\t\t\t\t\t\t\t\t[checkbox]=\"\n\t\t\t\t\t\t\t\t\t(index === 0 || col.hasCheckbox) && enableRowSelection\n\t\t\t\t\t\t\t\t\t\t? checkboxTemplate\n\t\t\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t\t\t\"\n\t\t\t\t\t\t\t\t[index]=\"index\"\n\t\t\t\t\t\t\t\t[rowIndex]=\"rowIndex\"\n\t\t\t\t\t\t\t\t[template]=\"col.template\"\n\t\t\t\t\t\t\t\t[scrollable]=\"this.enableScroll\"\n\t\t\t\t\t\t\t></p-table-cell-ngx>\n\n\t\t\t\t\t\t\t<ng-template #checkboxTemplate>\n\t\t\t\t\t\t\t\t<p-checkbox\n\t\t\t\t\t\t\t\t\t(checkedChange)=\"_checkboxChange($event.target, rowIndex)\"\n\t\t\t\t\t\t\t\t\t[disabled]=\"_checkboxDisabled(item, rowIndex)\"\n\t\t\t\t\t\t\t\t\t[checked]=\"_selectionContains(item, rowIndex)\"\n\t\t\t\t\t\t\t\t></p-checkbox>\n\t\t\t\t\t\t\t</ng-template>\n\t\t\t\t\t\t</ng-container>\n\n\t\t\t\t\t\t<p-table-row-actions-container\n\t\t\t\t\t\t\t*ngIf=\"!!rowActionsRow?.length && !(isMobile$ | async)\"\n\t\t\t\t\t\t\t[checked]=\"_selectionContains(item, rowIndex)\"\n\t\t\t\t\t\t\tslot=\"actions\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<ng-container *ngFor=\"let action of rowActionsRow\">\n\t\t\t\t\t\t\t\t<p-tooltip\n\t\t\t\t\t\t\t\t\t*ngIf=\"\n\t\t\t\t\t\t\t\t\t\taction.showFunction\n\t\t\t\t\t\t\t\t\t\t\t? action.showFunction(parsedItems[rowIndex])\n\t\t\t\t\t\t\t\t\t\t\t: true\n\t\t\t\t\t\t\t\t\t\"\n\t\t\t\t\t\t\t\t\t[content]=\"action['label']\"\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<p-button\n\t\t\t\t\t\t\t\t\t\tdata-is-action\n\t\t\t\t\t\t\t\t\t\tvariant=\"secondary\"\n\t\t\t\t\t\t\t\t\t\tslot=\"trigger\"\n\t\t\t\t\t\t\t\t\t\t[icon]=\"action['icon']\"\n\t\t\t\t\t\t\t\t\t\t[iconRotate]=\"action['iconRotate']\"\n\t\t\t\t\t\t\t\t\t\ticonFlip=\"action.iconFlip\"\n\t\t\t\t\t\t\t\t\t\ticonOnly=\"true\"\n\t\t\t\t\t\t\t\t\t\tsize=\"sm\"\n\t\t\t\t\t\t\t\t\t\t[loading]=\"action['loading']\"\n\t\t\t\t\t\t\t\t\t\t[disabled]=\"action['disabled']\"\n\t\t\t\t\t\t\t\t\t\t[routerLink]=\"\n\t\t\t\t\t\t\t\t\t\t\taction.routerLink\n\t\t\t\t\t\t\t\t\t\t\t\t? (_getActionRouterLink(action.routerLink, rowIndex)\n\t\t\t\t\t\t\t\t\t\t\t\t | async)\n\t\t\t\t\t\t\t\t\t\t\t\t: null\n\t\t\t\t\t\t\t\t\t\t\"\n\t\t\t\t\t\t\t\t\t\t[queryParams]=\"\n\t\t\t\t\t\t\t\t\t\t\taction.queryParams\n\t\t\t\t\t\t\t\t\t\t\t\t? (_getActionQueryParams(action.queryParams, rowIndex)\n\t\t\t\t\t\t\t\t\t\t\t\t | async)\n\t\t\t\t\t\t\t\t\t\t\t\t: null\n\t\t\t\t\t\t\t\t\t\t\"\n\t\t\t\t\t\t\t\t\t\t(onClick)=\"_rowActionClick(action, rowIndex)\"\n\t\t\t\t\t\t\t\t\t></p-button>\n\t\t\t\t\t\t\t\t</p-tooltip>\n\t\t\t\t\t\t\t</ng-container>\n\t\t\t\t\t\t</p-table-row-actions-container>\n\t\t\t\t\t</ng-container>\n\t\t\t\t</p-table-row>\n\t\t\t</ng-container>\n\t\t</ng-template>\n\n\t\t<ng-container *ngFor=\"let customRow of customRows\">\n\t\t\t<p-table-row\n\t\t\t\t[variant]=\"customRow.variant\"\n\t\t\t\t[class]=\"{\n\t\t\t\t\t'z-[2]': customRow.variant === 'secondary'\n\t\t\t\t}\"\n\t\t\t>\n\t\t\t\t<ng-container *ngTemplateOutlet=\"customRow.templateRef\"></ng-container>\n\t\t\t</p-table-row>\n\t\t</ng-container>\n\t</div>\n</ng-template>\n\n<ng-container *ngIf=\"filterModalTemplate\">\n\t<p-modal\n\t\t[header]=\"filterModalHeaderText\"\n\t\t[show]=\"filterModalShow$ | async\"\n\t\t(closed)=\"filterModalShow$.next(false)\"\n\t>\n\t\t<div\n\t\t\tslot=\"content\"\n\t\t\tclass=\"flex flex-col gap-6\"\n\t\t>\n\t\t\t<ng-container *ngTemplateOutlet=\"filterModalTemplate\"></ng-container>\n\t\t</div>\n\t\t<div\n\t\t\tslot=\"footer\"\n\t\t\tclass=\"flex w-full justify-between gap-4\"\n\t\t>\n\t\t\t<p-button\n\t\t\t\t*ngIf=\"filterModalShowResetMobile\"\n\t\t\t\tclass=\"flex w-full tablet:w-auto desktop-xs:hidden\"\n\t\t\t\tvariant=\"secondary\"\n\t\t\t\t(onClick)=\"onFilterModalReset(true)\"\n\t\t\t>\n\t\t\t\t{{ filterModalResetText }}\n\t\t\t</p-button>\n\t\t\t<p-button\n\t\t\t\t*ngIf=\"filterModalShowReset\"\n\t\t\t\tclass=\"hidden w-full tablet:w-auto desktop-xs:flex\"\n\t\t\t\tvariant=\"secondary\"\n\t\t\t\t(onClick)=\"onFilterModalReset()\"\n\t\t\t>\n\t\t\t\t{{ filterModalResetText }}\n\t\t\t</p-button>\n\t\t\t<p-button\n\t\t\t\tclass=\"ml-auto w-full tablet:w-auto\"\n\t\t\t\ticon=\"checkmark\"\n\t\t\t\t(onClick)=\"onFilterModalSave()\"\n\t\t\t>\n\t\t\t\t{{ filterModalSaveText }}\n\t\t\t</p-button>\n\t\t</div>\n\t</p-modal>\n</ng-container>\n\n<ng-template #emptyStateTemplate>\n\t<p-empty-state\n\t\t*ngIf=\"emptyStateType === 'filtered'; else emptyStateNonFilterTemplate\"\n\t\tclass=\"my-16 self-center\"\n\t\t[illustration]=\"emptyStateFilteredIllustration\"\n\t\t[header]=\"emptyStateFilteredHeader\"\n\t\t[content]=\"emptyStateFilteredContent\"\n\t\t[enableAction]=\"false\"\n\t></p-empty-state>\n</ng-template>\n\n<ng-template #emptyStateNonFilterTemplate>\n\t<p-empty-state\n\t\tclass=\"my-16 self-center\"\n\t\t[illustration]=\"emptyStateIllustration\"\n\t\t[header]=\"emptyStateHeader\"\n\t\t[content]=\"emptyStateContent\"\n\t\t[enableAction]=\"enableEmptyStateAction\"\n\t\t[actionText]=\"emptyStateAction\"\n\t\t[actionIcon]=\"emptyStateActionIcon\"\n\t\t(action)=\"emptyStateClicked()\"\n\t></p-empty-state>\n</ng-template>\n" }]
|
|
4400
|
+
args: [{ selector: 'p-table-ngx', changeDetection: ChangeDetectionStrategy.OnPush, template: "<p-table-container>\n\t<p-table-header\n\t\t*ngIf=\"enableHeader\"\n\t\tclass=\"mb-8\"\n\t\t[quickFilters]=\"quickFilters\"\n\t\t[activeQuickFilterIdentifier]=\"activeQuickFilterIdentifier\"\n\t\t(quickFilter)=\"onQuickFilter($event)\"\n\t\t[enableSearch]=\"enableSearch\"\n\t\t[query]=\"query\"\n\t\t(queryChange)=\"onQueryChange($event)\"\n\t\t[enableFilter]=\"enableFilter\"\n\t\t[enableFilterDesktop]=\"enableFilterDesktop\"\n\t\t[selectedFiltersAmount]=\"selectedFiltersAmount\"\n\t\t[filterButtonTemplate]=\"filterButtonTemplate\"\n\t\t(filter)=\"filterModalShow$.next(true)\"\n\t\t[enableAction]=\"enableAction\"\n\t\t[canUseAction]=\"actionButtonEnabled\"\n\t\t[actionButtonTemplate]=\"actionButtonTemplate\"\n\t\t[actionLoading]=\"actionButtonLoading\"\n\t\t[actionText]=\"actionButtonText\"\n\t\t[actionIcon]=\"actionButtonIcon\"\n\t\t(action)=\"action.emit()\"\n\t\t[itemsSelectedAmount]=\"selectedRows.length\"\n\t\t[enableExport]=\"enableExport\"\n\t\t(export)=\"export.emit()\"\n\t\t[loading]=\"headerLoading\"\n\t>\n\t\t<ng-container *ngIf=\"headerCustomFilterTemplate\">\n\t\t\t<ng-container\n\t\t\t\t*ngTemplateOutlet=\"headerCustomFilterTemplate\"\n\t\t\t></ng-container>\n\t\t</ng-container>\n\n\t\t<ng-container *ngIf=\"headerCustomActionsTemplate\">\n\t\t\t<ng-container\n\t\t\t\t*ngTemplateOutlet=\"headerCustomActionsTemplate\"\n\t\t\t></ng-container>\n\t\t</ng-container>\n\t</p-table-header>\n\n\t<div\n\t\tclass=\"relative flex-1\"\n\t\t*ngIf=\"enableScroll; else rowsTemplate\"\n\t>\n\t\t<div\n\t\t\tclass=\"flex flex-col overflow-x-auto\"\n\t\t\t#scrollContainer\n\t\t\t[class]=\"\n\t\t\t\tcn(\n\t\t\t\t\t'before:absolute before:top-0 before:left-0 before:z-[1] before:pointer-events-none',\n\t\t\t\t\t'before:w-24 before:h-full before:transition-opacity',\n\t\t\t\t\t'before:bg-gradient-to-r before:from-white dark:before:from-hurricane-700 before:via-white/80 dark:before:via-hurricane-700/90 before:to-transparent',\n\t\t\t\t\t'after:absolute after:top-0 after:right-0 after:z-[0] before:pointer-events-none',\n\t\t\t\t\t'after:w-24 after:h-full after:transition-opacity',\n\t\t\t\t\t'after:bg-gradient-to-l after:from-white after:dark:from-hurricane-700 after:via-white/80 dark:after:via-hurricane-700/90 after:to-transparent',\n\t\t\t\t\t{\n\t\t\t\t\t\t'before:opacity-0': reachedScrollStart$ | async,\n\t\t\t\t\t\t'after:opacity-0': reachedScrollEnd$ | async,\n\t\t\t\t\t\t'before:opacity-100': (reachedScrollStart$ | async) === false,\n\t\t\t\t\t\t'after:opacity-100': (reachedScrollEnd$ | async) === false\n\t\t\t\t\t}\n\t\t\t\t)\n\t\t\t\"\n\t\t\t(scroll)=\"onContainerXScroll($event)\"\n\t\t>\n\t\t\t<ng-container *ngTemplateOutlet=\"rowsTemplate\"></ng-container>\n\t\t</div>\n\t</div>\n\n\t<ng-container *ngIf=\"enableFloatingMenu && enableRowSelection\">\n\t\t<p-floating-menu-container\n\t\t\t[usedInTable]=\"true\"\n\t\t\t[class]=\"\n\t\t\t\tfloatingMenuContainerClass({\n\t\t\t\t\thasFooter: enableFooter && (footerHidden$ | async) === false,\n\t\t\t\t\tactive: selectedRows.length > 0,\n\t\t\t\t\tshown: $any(floatingMenuShown$ | async)\n\t\t\t\t})\n\t\t\t\"\n\t\t\t[amount]=\"floatingMenuAmountSelectedText\"\n\t\t\t[enableAmountSelected]=\"!!(rowActionsFloating$ | async)?.length\"\n\t\t\t(close)=\"_selectAllChange(null, false)\"\n\t\t>\n\t\t\t<p-floating-menu-item\n\t\t\t\t*ngFor=\"let action of rowActionsFloating$ | async\"\n\t\t\t\tslot=\"floating-menu-item\"\n\t\t\t\t[disabled]=\"\n\t\t\t\t\t(action['type'] === 'single' && selectedRows.length > 1) ||\n\t\t\t\t\taction['disabled']\n\t\t\t\t\"\n\t\t\t\t[loading]=\"action['loading']\"\n\t\t\t\t[icon]=\"action['icon']\"\n\t\t\t\t[iconRotate]=\"action['iconRotate']\"\n\t\t\t\t[iconFlip]=\"action['iconFlip']\"\n\t\t\t\t(click)=\"_rowActionClick(action)\"\n\t\t\t>\n\t\t\t\t{{ action['label'] }}\n\t\t\t</p-floating-menu-item>\n\t\t</p-floating-menu-container>\n\t</ng-container>\n\n\t<p-table-footer\n\t\t*ngIf=\"enableFooter\"\n\t\t[hideOnSinglePage]=\"hideOnSinglePage\"\n\t\t[enablePaginationSize]=\"enablePaginationSize\"\n\t\t[pageSize]=\"pageSize\"\n\t\t[pageSizeOptions]=\"pageSizeOptions\"\n\t\t(pageSizeChange)=\"onPageSizeChange($event)\"\n\t\t[enablePaginationPages]=\"enablePaginationPages\"\n\t\t[page]=\"page\"\n\t\t[total]=\"total\"\n\t\t(pageChange)=\"onPageChange($event)\"\n\t\t[loading]=\"footerLoading\"\n\t\t(hiddenChange)=\"footerHidden$.next($event.detail)\"\n\t\t[tableHeaderHasAction]=\"enableHeader && enableAction && actionButtonEnabled\"\n\t></p-table-footer>\n</p-table-container>\n\n<ng-template #rowsTemplate>\n\t<p-table-row\n\t\t*ngIf=\"(extraHeaders$ | async)?.length\"\n\t\tvariant=\"header-secondary\"\n\t\tclass=\"z-[2]\"\n\t\t[isLast]=\"true\"\n\t>\n\t\t<ng-container *ngFor=\"let col of extraHeaders$ | async; let index = index\">\n\t\t\t<p-table-cell-ngx\n\t\t\t\t[definition]=\"col\"\n\t\t\t\tvariant=\"header-secondary\"\n\t\t\t\t[index]=\"index\"\n\t\t\t\t[checkboxOffset]=\"index === 0 && enableRowSelection\"\n\t\t\t\t[scrollable]=\"this.enableScroll\"\n\t\t\t>\n\t\t\t\t<b>{{ col.name }}</b>\n\t\t\t</p-table-cell-ngx>\n\t\t</ng-container>\n\t</p-table-row>\n\n\t<p-table-row variant=\"header\">\n\t\t<ng-container *ngFor=\"let col of columns$ | async; let index = index\">\n\t\t\t<p-table-cell-ngx\n\t\t\t\t[definition]=\"col\"\n\t\t\t\t[value]=\"col.name\"\n\t\t\t\tvariant=\"header\"\n\t\t\t\t[index]=\"index\"\n\t\t\t\t[checkbox]=\"\n\t\t\t\t\t(index === 0 || col.hasCheckbox) && enableRowSelection\n\t\t\t\t\t\t? checkboxTemplate\n\t\t\t\t\t\t: undefined\n\t\t\t\t\"\n\t\t\t\t[scrollable]=\"this.enableScroll\"\n\t\t\t></p-table-cell-ngx>\n\t\t\t<ng-template #checkboxTemplate>\n\t\t\t\t<p-checkbox\n\t\t\t\t\t(checkedChange)=\"_selectAllChange($event)\"\n\t\t\t\t\t[checked]=\"_selectionContainsAll()\"\n\t\t\t\t\t[indeterminate]=\"_selectionIndeterminate()\"\n\t\t\t\t\t[class.opacity-0]=\"rowSelectionLimit !== undefined\"\n\t\t\t\t\t[disabled]=\"rowSelectionLimit !== undefined\"\n\t\t\t\t></p-checkbox>\n\t\t\t</ng-template>\n\t\t</ng-container>\n\t</p-table-row>\n\n\t<div class=\"flex flex-1 flex-col\">\n\t\t<ng-container *ngIf=\"loading; else contentTemplate\">\n\t\t\t<p-table-row\n\t\t\t\t*ngFor=\"let r of loadingRows; let rowIndex = index\"\n\t\t\t\tclass=\"group\"\n\t\t\t\t[enableHover]=\"enableRowSelection || enableRowClick\"\n\t\t\t\t[isLast]=\"rowIndex === loadingRows.length - 1\"\n\t\t\t>\n\t\t\t\t<ng-container *ngFor=\"let col of columns$ | async; let index = index\">\n\t\t\t\t\t<p-table-cell-ngx\n\t\t\t\t\t\t[definition]=\"col\"\n\t\t\t\t\t\tvariant=\"loading\"\n\t\t\t\t\t\t[checkbox]=\"\n\t\t\t\t\t\t\t(index === 0 || col.hasCheckbox) && enableRowSelection\n\t\t\t\t\t\t\t\t? checkboxTemplate\n\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t\"\n\t\t\t\t\t\t[index]=\"index\"\n\t\t\t\t\t\t[rowIndex]=\"rowIndex\"\n\t\t\t\t\t\t[scrollable]=\"this.enableScroll\"\n\t\t\t\t\t></p-table-cell-ngx>\n\t\t\t\t\t<ng-template #checkboxTemplate>\n\t\t\t\t\t\t<p-loader\n\t\t\t\t\t\t\tvariant=\"ghost\"\n\t\t\t\t\t\t\tclass=\"h-6 w-6 rounded\"\n\t\t\t\t\t\t></p-loader>\n\t\t\t\t\t</ng-template>\n\t\t\t\t</ng-container>\n\t\t\t</p-table-row>\n\t\t</ng-container>\n\n\t\t<ng-template #contentTemplate>\n\t\t\t<ng-container *ngIf=\"parsedItems?.length; else emptyStateTemplate\">\n\t\t\t\t<p-table-row\n\t\t\t\t\t*ngFor=\"let item of parsedItems; let rowIndex = index\"\n\t\t\t\t\tclass=\"group\"\n\t\t\t\t\t[enableHover]=\"enableRowSelection || enableRowClick\"\n\t\t\t\t\t[checked]=\"_selectionContains(item, rowIndex)\"\n\t\t\t\t\t[isLast]=\"rowIndex === parsedItems.length - 1\"\n\t\t\t\t\t(click)=\"_rowClick($event, rowIndex)\"\n\t\t\t\t>\n\t\t\t\t\t<ng-container\n\t\t\t\t\t\t*ngIf=\"\n\t\t\t\t\t\t\tparseRowActionsRow(\n\t\t\t\t\t\t\t\trowActionsRow$ | async,\n\t\t\t\t\t\t\t\trowIndex\n\t\t\t\t\t\t\t) as rowActionsRow\n\t\t\t\t\t\t\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<ng-container\n\t\t\t\t\t\t\t*ngFor=\"let col of columns$ | async; let index = index\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<p-table-cell-ngx\n\t\t\t\t\t\t\t\t[definition]=\"col\"\n\t\t\t\t\t\t\t\t[item]=\"item\"\n\t\t\t\t\t\t\t\t[checkbox]=\"\n\t\t\t\t\t\t\t\t\t(index === 0 || col.hasCheckbox) && enableRowSelection\n\t\t\t\t\t\t\t\t\t\t? checkboxTemplate\n\t\t\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t\t\t\"\n\t\t\t\t\t\t\t\t[index]=\"index\"\n\t\t\t\t\t\t\t\t[rowIndex]=\"rowIndex\"\n\t\t\t\t\t\t\t\t[template]=\"col.template\"\n\t\t\t\t\t\t\t\t[scrollable]=\"this.enableScroll\"\n\t\t\t\t\t\t\t></p-table-cell-ngx>\n\n\t\t\t\t\t\t\t<ng-template #checkboxTemplate>\n\t\t\t\t\t\t\t\t<p-checkbox\n\t\t\t\t\t\t\t\t\t(checkedChange)=\"_checkboxChange($event.target, rowIndex)\"\n\t\t\t\t\t\t\t\t\t[disabled]=\"_checkboxDisabled(item, rowIndex)\"\n\t\t\t\t\t\t\t\t\t[checked]=\"_selectionContains(item, rowIndex)\"\n\t\t\t\t\t\t\t\t></p-checkbox>\n\t\t\t\t\t\t\t</ng-template>\n\t\t\t\t\t\t</ng-container>\n\n\t\t\t\t\t\t<p-table-row-actions-container\n\t\t\t\t\t\t\t*ngIf=\"!!rowActionsRow?.length && !(isMobile$ | async)\"\n\t\t\t\t\t\t\t[checked]=\"_selectionContains(item, rowIndex)\"\n\t\t\t\t\t\t\tslot=\"actions\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<ng-container *ngFor=\"let action of rowActionsRow\">\n\t\t\t\t\t\t\t\t<p-tooltip\n\t\t\t\t\t\t\t\t\t*ngIf=\"\n\t\t\t\t\t\t\t\t\t\taction.showFunction\n\t\t\t\t\t\t\t\t\t\t\t? action.showFunction(parsedItems[rowIndex])\n\t\t\t\t\t\t\t\t\t\t\t: true\n\t\t\t\t\t\t\t\t\t\"\n\t\t\t\t\t\t\t\t\t[content]=\"action['label']\"\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<p-button\n\t\t\t\t\t\t\t\t\t\tdata-is-action\n\t\t\t\t\t\t\t\t\t\tvariant=\"secondary\"\n\t\t\t\t\t\t\t\t\t\tslot=\"trigger\"\n\t\t\t\t\t\t\t\t\t\t[icon]=\"action['icon']\"\n\t\t\t\t\t\t\t\t\t\t[iconRotate]=\"action['iconRotate']\"\n\t\t\t\t\t\t\t\t\t\ticonFlip=\"action.iconFlip\"\n\t\t\t\t\t\t\t\t\t\ticonOnly=\"true\"\n\t\t\t\t\t\t\t\t\t\tsize=\"sm\"\n\t\t\t\t\t\t\t\t\t\t[loading]=\"action['loading']\"\n\t\t\t\t\t\t\t\t\t\t[disabled]=\"action['disabled']\"\n\t\t\t\t\t\t\t\t\t\t[routerLink]=\"\n\t\t\t\t\t\t\t\t\t\t\taction.routerLink\n\t\t\t\t\t\t\t\t\t\t\t\t? (_getActionRouterLink(action.routerLink, rowIndex)\n\t\t\t\t\t\t\t\t\t\t\t\t | async)\n\t\t\t\t\t\t\t\t\t\t\t\t: null\n\t\t\t\t\t\t\t\t\t\t\"\n\t\t\t\t\t\t\t\t\t\t[queryParams]=\"\n\t\t\t\t\t\t\t\t\t\t\taction.queryParams\n\t\t\t\t\t\t\t\t\t\t\t\t? (_getActionQueryParams(action.queryParams, rowIndex)\n\t\t\t\t\t\t\t\t\t\t\t\t | async)\n\t\t\t\t\t\t\t\t\t\t\t\t: null\n\t\t\t\t\t\t\t\t\t\t\"\n\t\t\t\t\t\t\t\t\t\t(onClick)=\"_rowActionClick(action, rowIndex)\"\n\t\t\t\t\t\t\t\t\t></p-button>\n\t\t\t\t\t\t\t\t</p-tooltip>\n\t\t\t\t\t\t\t</ng-container>\n\t\t\t\t\t\t</p-table-row-actions-container>\n\t\t\t\t\t</ng-container>\n\t\t\t\t</p-table-row>\n\t\t\t</ng-container>\n\t\t</ng-template>\n\n\t\t<ng-container *ngFor=\"let customRow of customRows\">\n\t\t\t<p-table-row\n\t\t\t\t[variant]=\"customRow.variant\"\n\t\t\t\t[class]=\"{\n\t\t\t\t\t'z-[2]': customRow.variant === 'secondary'\n\t\t\t\t}\"\n\t\t\t>\n\t\t\t\t<ng-container *ngTemplateOutlet=\"customRow.templateRef\"></ng-container>\n\t\t\t</p-table-row>\n\t\t</ng-container>\n\t</div>\n</ng-template>\n\n<ng-container *ngIf=\"filterModalTemplate\">\n\t<p-modal\n\t\t[header]=\"filterModalHeaderText\"\n\t\t[show]=\"filterModalShow$ | async\"\n\t\t(closed)=\"filterModalShow$.next(false)\"\n\t>\n\t\t<div\n\t\t\tslot=\"content\"\n\t\t\tclass=\"flex flex-col gap-6\"\n\t\t>\n\t\t\t<ng-container *ngTemplateOutlet=\"filterModalTemplate\"></ng-container>\n\t\t</div>\n\t\t<div\n\t\t\tslot=\"footer\"\n\t\t\tclass=\"flex w-full justify-between gap-4\"\n\t\t>\n\t\t\t<p-button\n\t\t\t\t*ngIf=\"filterModalShowResetMobile\"\n\t\t\t\tclass=\"flex w-full tablet:w-auto desktop-xs:hidden\"\n\t\t\t\tvariant=\"secondary\"\n\t\t\t\t(onClick)=\"onFilterModalReset(true)\"\n\t\t\t>\n\t\t\t\t{{ filterModalResetText }}\n\t\t\t</p-button>\n\t\t\t<p-button\n\t\t\t\t*ngIf=\"filterModalShowReset\"\n\t\t\t\tclass=\"hidden w-full tablet:w-auto desktop-xs:flex\"\n\t\t\t\tvariant=\"secondary\"\n\t\t\t\t(onClick)=\"onFilterModalReset()\"\n\t\t\t>\n\t\t\t\t{{ filterModalResetText }}\n\t\t\t</p-button>\n\t\t\t<p-button\n\t\t\t\tclass=\"ml-auto w-full tablet:w-auto\"\n\t\t\t\ticon=\"checkmark\"\n\t\t\t\t(onClick)=\"onFilterModalSave()\"\n\t\t\t>\n\t\t\t\t{{ filterModalSaveText }}\n\t\t\t</p-button>\n\t\t</div>\n\t</p-modal>\n</ng-container>\n\n<ng-template #emptyStateTemplate>\n\t<p-empty-state\n\t\t*ngIf=\"emptyStateType === 'filtered'; else emptyStateNonFilterTemplate\"\n\t\tclass=\"my-16 self-center\"\n\t\t[illustration]=\"emptyStateFilteredIllustration\"\n\t\t[header]=\"emptyStateFilteredHeader\"\n\t\t[content]=\"emptyStateFilteredContent\"\n\t\t[enableAction]=\"false\"\n\t></p-empty-state>\n</ng-template>\n\n<ng-template #emptyStateNonFilterTemplate>\n\t<p-empty-state\n\t\tclass=\"my-16 self-center\"\n\t\t[illustration]=\"emptyStateIllustration\"\n\t\t[header]=\"emptyStateHeader\"\n\t\t[content]=\"emptyStateContent\"\n\t\t[enableAction]=\"enableEmptyStateAction\"\n\t\t[actionText]=\"emptyStateAction\"\n\t\t[actionIcon]=\"emptyStateActionIcon\"\n\t\t(action)=\"emptyStateClicked()\"\n\t></p-empty-state>\n</ng-template>\n" }]
|
|
4399
4401
|
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { className: [{
|
|
4400
4402
|
type: HostBinding,
|
|
4401
|
-
args: [
|
|
4403
|
+
args: ['class']
|
|
4402
4404
|
}], theme: [{
|
|
4403
4405
|
type: HostBinding,
|
|
4404
|
-
args: [
|
|
4406
|
+
args: ['attr.data-theme']
|
|
4405
4407
|
}], items: [{
|
|
4406
4408
|
type: Input
|
|
4407
4409
|
}], loading: [{
|
|
@@ -4530,7 +4532,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
|
|
|
4530
4532
|
args: [TableCell, { read: ElementRef }]
|
|
4531
4533
|
}], scrollContainer: [{
|
|
4532
4534
|
type: ViewChild,
|
|
4533
|
-
args: [
|
|
4535
|
+
args: ['scrollContainer']
|
|
4534
4536
|
}], emptyStateActionClick: [{
|
|
4535
4537
|
type: Output
|
|
4536
4538
|
}], shadow: [{
|
|
@@ -4585,16 +4587,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
|
|
|
4585
4587
|
type: Output
|
|
4586
4588
|
}], onResize: [{
|
|
4587
4589
|
type: HostListener,
|
|
4588
|
-
args: [
|
|
4590
|
+
args: ['window:resize', ['$event']]
|
|
4589
4591
|
}], keyDown: [{
|
|
4590
4592
|
type: HostListener,
|
|
4591
|
-
args: [
|
|
4593
|
+
args: ['document:keydown', ['$event']]
|
|
4592
4594
|
}], keyUp: [{
|
|
4593
4595
|
type: HostListener,
|
|
4594
|
-
args: [
|
|
4596
|
+
args: ['document:keyup', ['$event']]
|
|
4595
4597
|
}], visibilityChange: [{
|
|
4596
4598
|
type: HostListener,
|
|
4597
|
-
args: [
|
|
4599
|
+
args: ['document:visibilitychange', ['$event']]
|
|
4598
4600
|
}] } });
|
|
4599
4601
|
|
|
4600
4602
|
const TABLE_COMPONENTS = [
|