@one-paragon/angular-utilities 2.7.2 → 2.7.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.
|
@@ -141,10 +141,10 @@ class HttpRequestStateDirective {
|
|
|
141
141
|
static ngTemplateContextGuard(dir, ctx) {
|
|
142
142
|
return true;
|
|
143
143
|
}
|
|
144
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
145
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.
|
|
144
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: HttpRequestStateDirective, deps: [{ token: i0.TemplateRef }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
145
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.2", type: HttpRequestStateDirective, isStandalone: true, selector: "[httpRequestState]", inputs: { stateStore: ["httpRequestState", "stateStore"] }, ngImport: i0 }); }
|
|
146
146
|
}
|
|
147
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
147
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: HttpRequestStateDirective, decorators: [{
|
|
148
148
|
type: Directive,
|
|
149
149
|
args: [{ selector: '[httpRequestState]', }]
|
|
150
150
|
}], ctorParameters: () => [{ type: i0.TemplateRef }, { type: i0.ViewContainerRef }], propDecorators: { stateStore: [{
|
|
@@ -174,10 +174,10 @@ class HttpStateDirectiveBase {
|
|
|
174
174
|
parent.hooks.push(this.baseRender);
|
|
175
175
|
this.baseRender(parent.ViewContext.state);
|
|
176
176
|
}
|
|
177
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
178
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.
|
|
177
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: HttpStateDirectiveBase, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
178
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.2", type: HttpStateDirectiveBase, isStandalone: true, ngImport: i0 }); }
|
|
179
179
|
}
|
|
180
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
180
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: HttpStateDirectiveBase, decorators: [{
|
|
181
181
|
type: Directive
|
|
182
182
|
}] });
|
|
183
183
|
|
|
@@ -195,10 +195,10 @@ class HttpErrorStateDirective extends HttpStateDirectiveBase {
|
|
|
195
195
|
ngOnInit() {
|
|
196
196
|
super.ngOnInit();
|
|
197
197
|
}
|
|
198
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
199
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.
|
|
198
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: HttpErrorStateDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
|
|
199
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.2", type: HttpErrorStateDirective, isStandalone: true, selector: "[httpErrorState]", usesInheritance: true, ngImport: i0 }); }
|
|
200
200
|
}
|
|
201
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
201
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: HttpErrorStateDirective, decorators: [{
|
|
202
202
|
type: Directive,
|
|
203
203
|
args: [{ selector: '[httpErrorState]', }]
|
|
204
204
|
}] });
|
|
@@ -217,10 +217,10 @@ class HttpInProgressStateDirective extends HttpStateDirectiveBase {
|
|
|
217
217
|
ngOnInit() {
|
|
218
218
|
super.ngOnInit();
|
|
219
219
|
}
|
|
220
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
221
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.
|
|
220
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: HttpInProgressStateDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
|
|
221
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.2", type: HttpInProgressStateDirective, isStandalone: true, selector: "[httpInProgressState]", usesInheritance: true, ngImport: i0 }); }
|
|
222
222
|
}
|
|
223
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
223
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: HttpInProgressStateDirective, decorators: [{
|
|
224
224
|
type: Directive,
|
|
225
225
|
args: [{ selector: '[httpInProgressState]', }]
|
|
226
226
|
}] });
|
|
@@ -239,10 +239,10 @@ class HttpNotStartedStateDirective extends HttpStateDirectiveBase {
|
|
|
239
239
|
ngOnInit() {
|
|
240
240
|
super.ngOnInit();
|
|
241
241
|
}
|
|
242
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
243
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.
|
|
242
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: HttpNotStartedStateDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
|
|
243
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.2", type: HttpNotStartedStateDirective, isStandalone: true, selector: "[httpNotStartedState]", usesInheritance: true, ngImport: i0 }); }
|
|
244
244
|
}
|
|
245
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
245
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: HttpNotStartedStateDirective, decorators: [{
|
|
246
246
|
type: Directive,
|
|
247
247
|
args: [{ selector: '[httpNotStartedState]', }]
|
|
248
248
|
}] });
|
|
@@ -264,10 +264,10 @@ class HttpSuccessStateDirective extends HttpStateDirectiveBase {
|
|
|
264
264
|
static ngTemplateContextGuard(dir, ctx) {
|
|
265
265
|
return true;
|
|
266
266
|
}
|
|
267
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
268
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.
|
|
267
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: HttpSuccessStateDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
|
|
268
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.2", type: HttpSuccessStateDirective, isStandalone: true, selector: "[httpSuccessState]", inputs: { httpSuccessStateTypeSafety: "httpSuccessStateTypeSafety" }, usesInheritance: true, ngImport: i0 }); }
|
|
269
269
|
}
|
|
270
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
270
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: HttpSuccessStateDirective, decorators: [{
|
|
271
271
|
type: Directive,
|
|
272
272
|
args: [{ selector: '[httpSuccessState]', }]
|
|
273
273
|
}], propDecorators: { httpSuccessStateTypeSafety: [{
|
|
@@ -336,8 +336,8 @@ function chainRequest(httpState$, request, requestParams) {
|
|
|
336
336
|
}
|
|
337
337
|
|
|
338
338
|
class HttpRequestModule {
|
|
339
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
340
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.0.
|
|
339
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: HttpRequestModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
340
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.0.2", ngImport: i0, type: HttpRequestModule, imports: [HttpSuccessStateDirective,
|
|
341
341
|
HttpRequestStateDirective,
|
|
342
342
|
HttpErrorStateDirective,
|
|
343
343
|
HttpInProgressStateDirective,
|
|
@@ -346,9 +346,9 @@ class HttpRequestModule {
|
|
|
346
346
|
HttpErrorStateDirective,
|
|
347
347
|
HttpInProgressStateDirective,
|
|
348
348
|
HttpNotStartedStateDirective] }); }
|
|
349
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.0.
|
|
349
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: HttpRequestModule }); }
|
|
350
350
|
}
|
|
351
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
351
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: HttpRequestModule, decorators: [{
|
|
352
352
|
type: NgModule,
|
|
353
353
|
args: [{
|
|
354
354
|
imports: [
|
|
@@ -485,10 +485,10 @@ class Subscriber {
|
|
|
485
485
|
subscription.unsubscribe();
|
|
486
486
|
});
|
|
487
487
|
}
|
|
488
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
489
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.
|
|
488
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: Subscriber, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
489
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.2", type: Subscriber, isStandalone: true, ngImport: i0 }); }
|
|
490
490
|
}
|
|
491
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
491
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: Subscriber, decorators: [{
|
|
492
492
|
type: Directive
|
|
493
493
|
}] });
|
|
494
494
|
function subscriber(obsOrSubOrInjector, actionOrInjector, injector) {
|
|
@@ -521,7 +521,7 @@ function getDestroyRef(obsOrSubOrInjector, actionOrInjector, injector) {
|
|
|
521
521
|
|
|
522
522
|
class RequestStateStore {
|
|
523
523
|
constructor(req, options, project) {
|
|
524
|
-
this._state = signal({ requestParams: null, response: notStarted }, ...(ngDevMode ?
|
|
524
|
+
this._state = signal({ requestParams: null, response: notStarted }, { ...(ngDevMode ? { debugName: "_state" } : {}) });
|
|
525
525
|
this.state = this._state.asReadonly();
|
|
526
526
|
this.injector = inject(Injector);
|
|
527
527
|
this.destroy$ = new Subject();
|
|
@@ -551,24 +551,24 @@ class RequestStateStore {
|
|
|
551
551
|
}
|
|
552
552
|
return this.requestPipeLine(value);
|
|
553
553
|
};
|
|
554
|
-
this.$selectRequestState = computed(() => this.state().response, ...(ngDevMode ?
|
|
555
|
-
this.$selectStatus = computed(() => this.$selectRequestState()?.status, ...(ngDevMode ?
|
|
556
|
-
this.$isSuccess = computed(() => isSuccessState(this.$selectRequestState()), ...(ngDevMode ?
|
|
557
|
-
this.$isError = computed(() => isErrorState(this.$selectRequestState()), ...(ngDevMode ?
|
|
558
|
-
this.$isInProgress = computed(() => this.$selectStatus() === RequestStatus.inProgress, ...(ngDevMode ?
|
|
559
|
-
this.$isNotStarted = computed(() => this.$selectStatus() === RequestStatus.notStarted, ...(ngDevMode ?
|
|
554
|
+
this.$selectRequestState = computed(() => this.state().response, { ...(ngDevMode ? { debugName: "$selectRequestState" } : {}) });
|
|
555
|
+
this.$selectStatus = computed(() => this.$selectRequestState()?.status, { ...(ngDevMode ? { debugName: "$selectStatus" } : {}) });
|
|
556
|
+
this.$isSuccess = computed(() => isSuccessState(this.$selectRequestState()), { ...(ngDevMode ? { debugName: "$isSuccess" } : {}) });
|
|
557
|
+
this.$isError = computed(() => isErrorState(this.$selectRequestState()), { ...(ngDevMode ? { debugName: "$isError" } : {}) });
|
|
558
|
+
this.$isInProgress = computed(() => this.$selectStatus() === RequestStatus.inProgress, { ...(ngDevMode ? { debugName: "$isInProgress" } : {}) });
|
|
559
|
+
this.$isNotStarted = computed(() => this.$selectStatus() === RequestStatus.notStarted, { ...(ngDevMode ? { debugName: "$isNotStarted" } : {}) });
|
|
560
560
|
this.$selectError = computed(() => {
|
|
561
561
|
const state = this.$selectRequestState();
|
|
562
562
|
if (isErrorState(state))
|
|
563
563
|
return state.error;
|
|
564
|
-
}, ...(ngDevMode ?
|
|
564
|
+
}, { ...(ngDevMode ? { debugName: "$selectError" } : {}) });
|
|
565
565
|
this.$selectResponse = computed(() => {
|
|
566
566
|
const state = this.$selectRequestState();
|
|
567
567
|
if (isSuccessState(state)) {
|
|
568
568
|
return state.body;
|
|
569
569
|
}
|
|
570
570
|
return undefined;
|
|
571
|
-
}, ...(ngDevMode ?
|
|
571
|
+
}, { ...(ngDevMode ? { debugName: "$selectResponse" } : {}) });
|
|
572
572
|
this.errorHandled = false;
|
|
573
573
|
this.#onDefaultErrorHandling = (e) => {
|
|
574
574
|
if (this.defaultErrorHandling)
|
|
@@ -609,7 +609,7 @@ class RequestStateStore {
|
|
|
609
609
|
if (allVals)
|
|
610
610
|
return p.map(({ param, isSignal }) => isSignal ? param() : param);
|
|
611
611
|
return undefined;
|
|
612
|
-
}, ...(ngDevMode ?
|
|
612
|
+
}, { ...(ngDevMode ? { debugName: "paramsArr" } : {}) });
|
|
613
613
|
effect(() => {
|
|
614
614
|
const vals = paramsArr();
|
|
615
615
|
untracked(() => {
|
|
@@ -785,10 +785,10 @@ class RequestStateFactory {
|
|
|
785
785
|
this.requestors.push(requestor);
|
|
786
786
|
return requestor;
|
|
787
787
|
}
|
|
788
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
789
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.
|
|
788
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: RequestStateFactory, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
789
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: RequestStateFactory }); }
|
|
790
790
|
}
|
|
791
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
791
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: RequestStateFactory, decorators: [{
|
|
792
792
|
type: Injectable
|
|
793
793
|
}], ctorParameters: () => [] });
|
|
794
794
|
function createRequestor(req, optionsOrProject, options) {
|
|
@@ -1131,20 +1131,20 @@ class CustomCellDirective {
|
|
|
1131
1131
|
constructor() {
|
|
1132
1132
|
this.templateRef = inject(TemplateRef, { optional: true });
|
|
1133
1133
|
this.columnDef = inject(CdkColumnDef, { optional: true });
|
|
1134
|
-
this.$customCell = input.required(...(ngDevMode ?
|
|
1135
|
-
this.$displayName = input(undefined, ...(ngDevMode ?
|
|
1136
|
-
this.$preSort = input(undefined, ...(ngDevMode ?
|
|
1137
|
-
this.$templateRef = input(this.templateRef || undefined, ...(ngDevMode ?
|
|
1138
|
-
this.$customCellOrder = input(undefined, ...(ngDevMode ?
|
|
1139
|
-
this.$customCellWidth = input(undefined, ...(ngDevMode ?
|
|
1134
|
+
this.$customCell = input.required({ ...(ngDevMode ? { debugName: "$customCell" } : {}), alias: 'customCell' });
|
|
1135
|
+
this.$displayName = input(undefined, { ...(ngDevMode ? { debugName: "$displayName" } : {}), alias: 'customCellDisplayName' });
|
|
1136
|
+
this.$preSort = input(undefined, { ...(ngDevMode ? { debugName: "$preSort" } : {}), alias: 'preSort' });
|
|
1137
|
+
this.$templateRef = input(this.templateRef || undefined, { ...(ngDevMode ? { debugName: "$templateRef" } : {}), alias: 'templateRef' });
|
|
1138
|
+
this.$customCellOrder = input(undefined, { ...(ngDevMode ? { debugName: "$customCellOrder" } : {}), alias: 'customCellOrder' });
|
|
1139
|
+
this.$customCellWidth = input(undefined, { ...(ngDevMode ? { debugName: "$customCellWidth" } : {}), alias: 'customCellWidth' });
|
|
1140
1140
|
/**
|
|
1141
1141
|
* for type safety, this is a reference to the table builder instance.
|
|
1142
1142
|
*/
|
|
1143
|
-
this.$customCellTableRef = input(undefined, ...(ngDevMode ?
|
|
1143
|
+
this.$customCellTableRef = input(undefined, { ...(ngDevMode ? { debugName: "$customCellTableRef" } : {}), alias: 'customCellTableRef' });
|
|
1144
1144
|
/**
|
|
1145
1145
|
* true if column not mapped to a property in the data source. Default is false.
|
|
1146
1146
|
*/
|
|
1147
|
-
this.$customCellNotMapped = input(false, ...(ngDevMode ?
|
|
1147
|
+
this.$customCellNotMapped = input(false, { ...(ngDevMode ? { debugName: "$customCellNotMapped" } : {}), alias: 'customCellNotMapped', transform: coerceBooleanProperty });
|
|
1148
1148
|
this.$metaData = computed(() => {
|
|
1149
1149
|
const c = this.$customCell();
|
|
1150
1150
|
if (!c)
|
|
@@ -1159,8 +1159,8 @@ class CustomCellDirective {
|
|
|
1159
1159
|
customCell: true,
|
|
1160
1160
|
noExport: true,
|
|
1161
1161
|
});
|
|
1162
|
-
}, ...(ngDevMode ?
|
|
1163
|
-
this.$inited = signal(false, ...(ngDevMode ?
|
|
1162
|
+
}, { ...(ngDevMode ? { debugName: "$metaData" } : {}) });
|
|
1163
|
+
this.$inited = signal(false, { ...(ngDevMode ? { debugName: "$inited" } : {}) });
|
|
1164
1164
|
}
|
|
1165
1165
|
ngOnInit() {
|
|
1166
1166
|
this.$inited.set(true);
|
|
@@ -1168,10 +1168,10 @@ class CustomCellDirective {
|
|
|
1168
1168
|
static ngTemplateContextGuard(dir, ctx) {
|
|
1169
1169
|
return true;
|
|
1170
1170
|
}
|
|
1171
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
1172
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.0.
|
|
1171
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: CustomCellDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
1172
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.0.2", type: CustomCellDirective, isStandalone: true, selector: "[customCell]", inputs: { $customCell: { classPropertyName: "$customCell", publicName: "customCell", isSignal: true, isRequired: true, transformFunction: null }, $displayName: { classPropertyName: "$displayName", publicName: "customCellDisplayName", isSignal: true, isRequired: false, transformFunction: null }, $preSort: { classPropertyName: "$preSort", publicName: "preSort", isSignal: true, isRequired: false, transformFunction: null }, $templateRef: { classPropertyName: "$templateRef", publicName: "templateRef", isSignal: true, isRequired: false, transformFunction: null }, $customCellOrder: { classPropertyName: "$customCellOrder", publicName: "customCellOrder", isSignal: true, isRequired: false, transformFunction: null }, $customCellWidth: { classPropertyName: "$customCellWidth", publicName: "customCellWidth", isSignal: true, isRequired: false, transformFunction: null }, $customCellTableRef: { classPropertyName: "$customCellTableRef", publicName: "customCellTableRef", isSignal: true, isRequired: false, transformFunction: null }, $customCellNotMapped: { classPropertyName: "$customCellNotMapped", publicName: "customCellNotMapped", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 }); }
|
|
1173
1173
|
}
|
|
1174
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
1174
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: CustomCellDirective, decorators: [{
|
|
1175
1175
|
type: Directive,
|
|
1176
1176
|
args: [{ selector: '[customCell]' }]
|
|
1177
1177
|
}], propDecorators: { $customCell: [{ type: i0.Input, args: [{ isSignal: true, alias: "customCell", required: true }] }], $displayName: [{ type: i0.Input, args: [{ isSignal: true, alias: "customCellDisplayName", required: false }] }], $preSort: [{ type: i0.Input, args: [{ isSignal: true, alias: "preSort", required: false }] }], $templateRef: [{ type: i0.Input, args: [{ isSignal: true, alias: "templateRef", required: false }] }], $customCellOrder: [{ type: i0.Input, args: [{ isSignal: true, alias: "customCellOrder", required: false }] }], $customCellWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "customCellWidth", required: false }] }], $customCellTableRef: [{ type: i0.Input, args: [{ isSignal: true, alias: "customCellTableRef", required: false }] }], $customCellNotMapped: [{ type: i0.Input, args: [{ isSignal: true, alias: "customCellNotMapped", required: false }] }] } });
|
|
@@ -1199,21 +1199,21 @@ class CustomGroupRowDirective {
|
|
|
1199
1199
|
* If not provided (or null), this custom row will apply to all groupings.
|
|
1200
1200
|
* Can be a single Path<T> or an array of Path<T> values.
|
|
1201
1201
|
*/
|
|
1202
|
-
this.$customGroupRow = input(null, ...(ngDevMode ?
|
|
1202
|
+
this.$customGroupRow = input(null, { ...(ngDevMode ? { debugName: "$customGroupRow" } : {}), alias: 'customGroupRow', transform: (val) => val === '' ? null : val });
|
|
1203
1203
|
/**
|
|
1204
1204
|
* For type safety, this is a reference to the table builder instance.
|
|
1205
1205
|
*/
|
|
1206
|
-
this.$customGroupRowTableRef = input(undefined, ...(ngDevMode ?
|
|
1206
|
+
this.$customGroupRowTableRef = input(undefined, { ...(ngDevMode ? { debugName: "$customGroupRowTableRef" } : {}), alias: 'customGroupRowTableRef' });
|
|
1207
1207
|
/**
|
|
1208
1208
|
* Priority order for this custom group row. Higher numbers have higher priority.
|
|
1209
1209
|
* Useful when multiple custom group rows could apply to the same grouping.
|
|
1210
1210
|
*/
|
|
1211
|
-
this.$priority = input(0, ...(ngDevMode ?
|
|
1212
|
-
this.$inited = signal(false, ...(ngDevMode ?
|
|
1211
|
+
this.$priority = input(0, { ...(ngDevMode ? { debugName: "$priority" } : {}), alias: 'customGroupRowPriority' });
|
|
1212
|
+
this.$inited = signal(false, { ...(ngDevMode ? { debugName: "$inited" } : {}) });
|
|
1213
1213
|
/**
|
|
1214
1214
|
* Gets the grouping key(s) this directive applies to, or null for all groupings
|
|
1215
1215
|
*/
|
|
1216
|
-
this.$groupingKey = computed(() => this.$customGroupRow(), ...(ngDevMode ?
|
|
1216
|
+
this.$groupingKey = computed(() => this.$customGroupRow(), { ...(ngDevMode ? { debugName: "$groupingKey" } : {}) });
|
|
1217
1217
|
/**
|
|
1218
1218
|
* Gets the template reference to use
|
|
1219
1219
|
*/
|
|
@@ -1241,10 +1241,10 @@ class CustomGroupRowDirective {
|
|
|
1241
1241
|
}
|
|
1242
1242
|
return targetKey === groupingKey;
|
|
1243
1243
|
}
|
|
1244
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
1245
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.0.
|
|
1244
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: CustomGroupRowDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
1245
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.0.2", type: CustomGroupRowDirective, isStandalone: true, selector: "[customGroupRow]", inputs: { $customGroupRow: { classPropertyName: "$customGroupRow", publicName: "customGroupRow", isSignal: true, isRequired: false, transformFunction: null }, $customGroupRowTableRef: { classPropertyName: "$customGroupRowTableRef", publicName: "customGroupRowTableRef", isSignal: true, isRequired: false, transformFunction: null }, $priority: { classPropertyName: "$priority", publicName: "customGroupRowPriority", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 }); }
|
|
1246
1246
|
}
|
|
1247
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
1247
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: CustomGroupRowDirective, decorators: [{
|
|
1248
1248
|
type: Directive,
|
|
1249
1249
|
args: [{ selector: '[customGroupRow]' }]
|
|
1250
1250
|
}], propDecorators: { $customGroupRow: [{ type: i0.Input, args: [{ isSignal: true, alias: "customGroupRow", required: false }] }], $customGroupRowTableRef: [{ type: i0.Input, args: [{ isSignal: true, alias: "customGroupRowTableRef", required: false }] }], $priority: [{ type: i0.Input, args: [{ isSignal: true, alias: "customGroupRowPriority", required: false }] }] } });
|
|
@@ -1315,10 +1315,10 @@ class ResizeColumnDirective {
|
|
|
1315
1315
|
const newTableWidth = (mouseDownData.startTableWidth + columnChange);
|
|
1316
1316
|
return ({ newTableWidth, newColumnWidth });
|
|
1317
1317
|
}
|
|
1318
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
1319
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "21.0.
|
|
1318
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: ResizeColumnDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
1319
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "21.0.2", type: ResizeColumnDirective, isStandalone: true, selector: "[resizeColumn]", inputs: { resizable: ["resizeColumn", "resizable", booleanAttribute], key: "key" }, ngImport: i0 }); }
|
|
1320
1320
|
}
|
|
1321
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
1321
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: ResizeColumnDirective, decorators: [{
|
|
1322
1322
|
type: Directive,
|
|
1323
1323
|
args: [{
|
|
1324
1324
|
selector: "[resizeColumn]",
|
|
@@ -1332,15 +1332,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImpor
|
|
|
1332
1332
|
|
|
1333
1333
|
class TableWrapperDirective {
|
|
1334
1334
|
constructor() {
|
|
1335
|
-
this.$registrations = signal([], ...(ngDevMode ?
|
|
1335
|
+
this.$registrations = signal([], { ...(ngDevMode ? { debugName: "$registrations" } : {}) });
|
|
1336
1336
|
}
|
|
1337
1337
|
register(filter) {
|
|
1338
1338
|
this.$registrations.update(registrations => [...registrations, filter]);
|
|
1339
1339
|
}
|
|
1340
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
1341
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.
|
|
1340
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: TableWrapperDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
1341
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.2", type: TableWrapperDirective, isStandalone: true, selector: "[tbWrapper]", ngImport: i0 }); }
|
|
1342
1342
|
}
|
|
1343
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
1343
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: TableWrapperDirective, decorators: [{
|
|
1344
1344
|
type: Directive,
|
|
1345
1345
|
args: [{
|
|
1346
1346
|
selector: '[tbWrapper]',
|
|
@@ -1383,10 +1383,10 @@ class TableCustomFilterDirective {
|
|
|
1383
1383
|
constructor() {
|
|
1384
1384
|
this.savable = false;
|
|
1385
1385
|
}
|
|
1386
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
1387
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.
|
|
1386
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: TableCustomFilterDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
1387
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.2", type: TableCustomFilterDirective, isStandalone: true, selector: "tb-abstract", ngImport: i0 }); }
|
|
1388
1388
|
}
|
|
1389
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
1389
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: TableCustomFilterDirective, decorators: [{
|
|
1390
1390
|
type: Directive,
|
|
1391
1391
|
args: [{
|
|
1392
1392
|
selector: 'tb-abstract'
|
|
@@ -1458,10 +1458,10 @@ class TableFilterDirective {
|
|
|
1458
1458
|
});
|
|
1459
1459
|
}
|
|
1460
1460
|
}
|
|
1461
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
1462
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.
|
|
1461
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: TableFilterDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
1462
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.2", type: TableFilterDirective, isStandalone: true, selector: "[tbFilter]", inputs: { filterType: "filterType", key: "key", fieldType: "fieldType", filterId: "filterId", active: "active", filterValue: "filterValue" }, usesOnChanges: true, ngImport: i0 }); }
|
|
1463
1463
|
}
|
|
1464
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
1464
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: TableFilterDirective, decorators: [{
|
|
1465
1465
|
type: Directive,
|
|
1466
1466
|
args: [{
|
|
1467
1467
|
selector: "[tbFilter]",
|
|
@@ -1501,10 +1501,10 @@ class TableFilterStringContainsDirective extends TableFilterDirective {
|
|
|
1501
1501
|
}
|
|
1502
1502
|
super.ngOnChanges(changes);
|
|
1503
1503
|
}
|
|
1504
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
1505
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.
|
|
1504
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: TableFilterStringContainsDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
1505
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.2", type: TableFilterStringContainsDirective, isStandalone: true, selector: "[tbFilterStringContains]", inputs: { key: ["tbFilterStringContains", "key"], filterValue: "filterValue", filterId: "filterId", active: "active" }, providers: [{ provide: TableFilterDirective, useExisting: TableFilterStringContainsDirective }], usesInheritance: true, usesOnChanges: true, ngImport: i0 }); }
|
|
1506
1506
|
}
|
|
1507
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
1507
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: TableFilterStringContainsDirective, decorators: [{
|
|
1508
1508
|
type: Directive,
|
|
1509
1509
|
args: [{
|
|
1510
1510
|
selector: '[tbFilterStringContains]',
|
|
@@ -1560,10 +1560,10 @@ class TableCustomFilterDirectiveBase extends TableCustomFilterDirective {
|
|
|
1560
1560
|
this.ready = true;
|
|
1561
1561
|
this.filter$.next(this.filter);
|
|
1562
1562
|
}
|
|
1563
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
1564
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.
|
|
1563
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: TableCustomFilterDirectiveBase, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
|
|
1564
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.2", type: TableCustomFilterDirectiveBase, isStandalone: true, selector: "[tbCustomFilter]", inputs: { predicate: ["tbCustomFilter", "predicate"], active: "active" }, usesInheritance: true, ngImport: i0 }); }
|
|
1565
1565
|
}
|
|
1566
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
1566
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: TableCustomFilterDirectiveBase, decorators: [{
|
|
1567
1567
|
type: Directive,
|
|
1568
1568
|
args: [{
|
|
1569
1569
|
selector: "[tbCustomFilter]",
|
|
@@ -1598,10 +1598,10 @@ class TbSelectedFilterDirective extends TableCustomFilterDirectiveBase {
|
|
|
1598
1598
|
this.active = this.isActive();
|
|
1599
1599
|
});
|
|
1600
1600
|
}
|
|
1601
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
1602
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.
|
|
1601
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: TbSelectedFilterDirective, deps: "invalid", target: i0.ɵɵFactoryTarget.Directive }); }
|
|
1602
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.2", type: TbSelectedFilterDirective, isStandalone: true, usesInheritance: true, ngImport: i0 }); }
|
|
1603
1603
|
}
|
|
1604
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
1604
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: TbSelectedFilterDirective, decorators: [{
|
|
1605
1605
|
type: Directive
|
|
1606
1606
|
}], ctorParameters: () => [{ type: i1.Observable }, { type: undefined }] });
|
|
1607
1607
|
// Checkbox
|
|
@@ -1616,10 +1616,10 @@ class MatCheckboxTbFilterDirective extends TbSelectedFilterDirective {
|
|
|
1616
1616
|
this.matCheckbox = inject(MatCheckbox);
|
|
1617
1617
|
this.matCheckbox = matCheckbox;
|
|
1618
1618
|
}
|
|
1619
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
1620
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.
|
|
1619
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: MatCheckboxTbFilterDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
1620
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.2", type: MatCheckboxTbFilterDirective, isStandalone: true, selector: "mat-checkbox[tbCustomFilter]", inputs: { predicate: ["tbCustomFilter", "predicate"], filterId: "filterId" }, providers: [{ provide: TableCustomFilterDirective, useExisting: MatCheckboxTbFilterDirective }], usesInheritance: true, ngImport: i0 }); }
|
|
1621
1621
|
}
|
|
1622
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
1622
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: MatCheckboxTbFilterDirective, decorators: [{
|
|
1623
1623
|
type: Directive,
|
|
1624
1624
|
args: [{
|
|
1625
1625
|
selector: 'mat-checkbox[tbCustomFilter]',
|
|
@@ -1642,10 +1642,10 @@ class MatSlideToggleTbFilterDirective extends TbSelectedFilterDirective {
|
|
|
1642
1642
|
ngOnInit() {
|
|
1643
1643
|
super.ngOnInit();
|
|
1644
1644
|
}
|
|
1645
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
1646
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.
|
|
1645
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: MatSlideToggleTbFilterDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
1646
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.2", type: MatSlideToggleTbFilterDirective, isStandalone: true, selector: "mat-slide-toggle[tbCustomFilter]", inputs: { predicate: ["tbCustomFilter", "predicate"], filterId: "filterId" }, providers: [{ provide: TableCustomFilterDirective, useExisting: MatSlideToggleTbFilterDirective }], usesInheritance: true, ngImport: i0 }); }
|
|
1647
1647
|
}
|
|
1648
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
1648
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: MatSlideToggleTbFilterDirective, decorators: [{
|
|
1649
1649
|
type: Directive,
|
|
1650
1650
|
args: [{
|
|
1651
1651
|
selector: 'mat-slide-toggle[tbCustomFilter]',
|
|
@@ -1669,10 +1669,10 @@ class MatRadioButtonTbFilterDirective extends TbSelectedFilterDirective {
|
|
|
1669
1669
|
ngOnInit() {
|
|
1670
1670
|
super.ngOnInit();
|
|
1671
1671
|
}
|
|
1672
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
1673
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.
|
|
1672
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: MatRadioButtonTbFilterDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
1673
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.2", type: MatRadioButtonTbFilterDirective, isStandalone: true, selector: "mat-radio-button[tbCustomFilter]", inputs: { predicate: ["tbCustomFilter", "predicate"] }, providers: [{ provide: TableCustomFilterDirective, useExisting: MatRadioButtonTbFilterDirective }], usesInheritance: true, ngImport: i0 }); }
|
|
1674
1674
|
}
|
|
1675
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
1675
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: MatRadioButtonTbFilterDirective, decorators: [{
|
|
1676
1676
|
type: Directive,
|
|
1677
1677
|
args: [{
|
|
1678
1678
|
selector: 'mat-radio-button[tbCustomFilter]',
|
|
@@ -1703,10 +1703,10 @@ class MatOptionTbFilterDirective extends TbSelectedFilterDirective {
|
|
|
1703
1703
|
ngOnInit() {
|
|
1704
1704
|
super.ngOnInit();
|
|
1705
1705
|
}
|
|
1706
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
1707
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.
|
|
1706
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: MatOptionTbFilterDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
1707
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.2", type: MatOptionTbFilterDirective, isStandalone: true, selector: "mat-option[tbCustomFilter]", inputs: { predicate: ["tbCustomFilter", "predicate"], filterId: "filterId" }, providers: [{ provide: TableCustomFilterDirective, useExisting: MatOptionTbFilterDirective }], usesInheritance: true, ngImport: i0 }); }
|
|
1708
1708
|
}
|
|
1709
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
1709
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: MatOptionTbFilterDirective, decorators: [{
|
|
1710
1710
|
type: Directive,
|
|
1711
1711
|
args: [{
|
|
1712
1712
|
selector: 'mat-option[tbCustomFilter]',
|
|
@@ -1730,10 +1730,10 @@ class MatButtonToggleFilterDirective extends TbSelectedFilterDirective {
|
|
|
1730
1730
|
ngOnInit() {
|
|
1731
1731
|
super.ngOnInit();
|
|
1732
1732
|
}
|
|
1733
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
1734
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.
|
|
1733
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: MatButtonToggleFilterDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
1734
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.2", type: MatButtonToggleFilterDirective, isStandalone: true, selector: "mat-button-toggle[tbCustomFilter]", inputs: { predicate: ["tbCustomFilter", "predicate"], filterId: "filterId" }, providers: [{ provide: TableCustomFilterDirective, useExisting: MatButtonToggleFilterDirective }], usesInheritance: true, ngImport: i0 }); }
|
|
1735
1735
|
}
|
|
1736
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
1736
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: MatButtonToggleFilterDirective, decorators: [{
|
|
1737
1737
|
type: Directive,
|
|
1738
1738
|
args: [{
|
|
1739
1739
|
selector: 'mat-button-toggle[tbCustomFilter]',
|
|
@@ -1748,10 +1748,10 @@ class PhoneNumberPipe {
|
|
|
1748
1748
|
transform(phoneNum) {
|
|
1749
1749
|
return phoneFormatter(phoneNum);
|
|
1750
1750
|
}
|
|
1751
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
1752
|
-
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.0.
|
|
1751
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: PhoneNumberPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
|
|
1752
|
+
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.0.2", ngImport: i0, type: PhoneNumberPipe, isStandalone: true, name: "phone" }); }
|
|
1753
1753
|
}
|
|
1754
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
1754
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: PhoneNumberPipe, decorators: [{
|
|
1755
1755
|
type: Pipe,
|
|
1756
1756
|
args: [{ name: 'phone' }]
|
|
1757
1757
|
}] });
|
|
@@ -1773,10 +1773,10 @@ class SpaceCasePipe {
|
|
|
1773
1773
|
return this.spaceCase(value);
|
|
1774
1774
|
};
|
|
1775
1775
|
}
|
|
1776
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
1777
|
-
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.0.
|
|
1776
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: SpaceCasePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
|
|
1777
|
+
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.0.2", ngImport: i0, type: SpaceCasePipe, isStandalone: true, name: "spaceCase" }); }
|
|
1778
1778
|
}
|
|
1779
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
1779
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: SpaceCasePipe, decorators: [{
|
|
1780
1780
|
type: Pipe,
|
|
1781
1781
|
args: [{ name: 'spaceCase' }]
|
|
1782
1782
|
}] });
|
|
@@ -1820,10 +1820,10 @@ class PreventEnterDirective {
|
|
|
1820
1820
|
onKeyDown() {
|
|
1821
1821
|
return false;
|
|
1822
1822
|
}
|
|
1823
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
1824
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.
|
|
1823
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: PreventEnterDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
1824
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.2", type: PreventEnterDirective, isStandalone: true, selector: "preventEnter", host: { listeners: { "keydown.enter": "onKeyDown()" } }, ngImport: i0 }); }
|
|
1825
1825
|
}
|
|
1826
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
1826
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: PreventEnterDirective, decorators: [{
|
|
1827
1827
|
type: Directive,
|
|
1828
1828
|
args: [{
|
|
1829
1829
|
selector: 'preventEnter',
|
|
@@ -1840,10 +1840,10 @@ class StopPropagationDirective {
|
|
|
1840
1840
|
onMousedown(event) {
|
|
1841
1841
|
event.stopPropagation();
|
|
1842
1842
|
}
|
|
1843
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
1844
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.
|
|
1843
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: StopPropagationDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
1844
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.2", type: StopPropagationDirective, isStandalone: true, selector: "[stop-propagation]", host: { listeners: { "click": "onClick($event)", "mousedown": "onMousedown($event)" } }, ngImport: i0 }); }
|
|
1845
1845
|
}
|
|
1846
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
1846
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: StopPropagationDirective, decorators: [{
|
|
1847
1847
|
type: Directive,
|
|
1848
1848
|
args: [{
|
|
1849
1849
|
selector: "[stop-propagation]",
|
|
@@ -1868,10 +1868,10 @@ class AutoFocusDirective {
|
|
|
1868
1868
|
});
|
|
1869
1869
|
}
|
|
1870
1870
|
}
|
|
1871
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
1872
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.
|
|
1871
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: AutoFocusDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
1872
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.2", type: AutoFocusDirective, isStandalone: true, selector: "[autoFocus]", inputs: { autoFocus: "autoFocus" }, ngImport: i0 }); }
|
|
1873
1873
|
}
|
|
1874
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
1874
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: AutoFocusDirective, decorators: [{
|
|
1875
1875
|
type: Directive,
|
|
1876
1876
|
args: [{
|
|
1877
1877
|
selector: '[autoFocus]',
|
|
@@ -1887,10 +1887,10 @@ class ClickSubjectDirective extends Subject {
|
|
|
1887
1887
|
set clickSubject(val) {
|
|
1888
1888
|
this._val = val;
|
|
1889
1889
|
}
|
|
1890
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
1891
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.
|
|
1890
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: ClickSubjectDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
1891
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.2", type: ClickSubjectDirective, isStandalone: true, selector: "[clickSubject]", inputs: { clickSubject: "clickSubject" }, host: { listeners: { "click": "next(this._val)" } }, exportAs: ["clickSubject"], usesInheritance: true, ngImport: i0 }); }
|
|
1892
1892
|
}
|
|
1893
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
1893
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: ClickSubjectDirective, decorators: [{
|
|
1894
1894
|
type: Directive,
|
|
1895
1895
|
args: [{
|
|
1896
1896
|
selector: '[clickSubject]',
|
|
@@ -1908,10 +1908,10 @@ class ClickEmitterDirective extends Subject {
|
|
|
1908
1908
|
constructor() {
|
|
1909
1909
|
super();
|
|
1910
1910
|
}
|
|
1911
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
1912
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.
|
|
1911
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: ClickEmitterDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
1912
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.2", type: ClickEmitterDirective, isStandalone: true, selector: "[clickEmitter]", host: { listeners: { "click": "next(true)" } }, exportAs: ["clickEmitter"], usesInheritance: true, ngImport: i0 }); }
|
|
1913
1913
|
}
|
|
1914
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
1914
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: ClickEmitterDirective, decorators: [{
|
|
1915
1915
|
type: Directive,
|
|
1916
1916
|
args: [{
|
|
1917
1917
|
selector: '[clickEmitter]',
|
|
@@ -1935,10 +1935,10 @@ class DialogService {
|
|
|
1935
1935
|
closeAllOpDialogs() {
|
|
1936
1936
|
this.allOpenOpDialogs.forEach(ref => ref.close());
|
|
1937
1937
|
}
|
|
1938
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
1939
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.
|
|
1938
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: DialogService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
1939
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: DialogService, providedIn: 'root' }); }
|
|
1940
1940
|
}
|
|
1941
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
1941
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: DialogService, decorators: [{
|
|
1942
1942
|
type: Injectable,
|
|
1943
1943
|
args: [{ providedIn: 'root' }]
|
|
1944
1944
|
}] });
|
|
@@ -1965,10 +1965,10 @@ class DialogWrapper {
|
|
|
1965
1965
|
this.viewContext.$implicit = value;
|
|
1966
1966
|
this.viewContext.opDialog = value;
|
|
1967
1967
|
}
|
|
1968
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
1969
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.
|
|
1968
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: DialogWrapper, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1969
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.2", type: DialogWrapper, isStandalone: true, selector: "dialog-wrapper", ngImport: i0, template: ``, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1970
1970
|
}
|
|
1971
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
1971
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: DialogWrapper, decorators: [{
|
|
1972
1972
|
type: Component,
|
|
1973
1973
|
args: [{
|
|
1974
1974
|
selector: 'dialog-wrapper',
|
|
@@ -1996,7 +1996,7 @@ class DialogDirective {
|
|
|
1996
1996
|
* If no width provided or/and height, provide a default in number (of pixels) of the not provided values.
|
|
1997
1997
|
* If no width/height provided at all, will default to 600x400.
|
|
1998
1998
|
*/
|
|
1999
|
-
this.$positionOnScreen = input(false, ...(ngDevMode ?
|
|
1999
|
+
this.$positionOnScreen = input(false, { ...(ngDevMode ? { debugName: "$positionOnScreen" } : {}), alias: 'opDialogPositionOnScreen' });
|
|
2000
2000
|
this._data = new Subject();
|
|
2001
2001
|
this.setDataAndState = (data) => {
|
|
2002
2002
|
if (data) {
|
|
@@ -2094,10 +2094,10 @@ class DialogDirective {
|
|
|
2094
2094
|
static ngTemplateContextGuard(dir, ctx) {
|
|
2095
2095
|
return true;
|
|
2096
2096
|
}
|
|
2097
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
2098
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.0.
|
|
2097
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: DialogDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
2098
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.0.2", type: DialogDirective, isStandalone: true, selector: "[opDialog]", inputs: { opDialogAddDialogClass: { classPropertyName: "opDialogAddDialogClass", publicName: "opDialogAddDialogClass", isSignal: false, isRequired: false, transformFunction: null }, opDialogConfig: { classPropertyName: "opDialogConfig", publicName: "opDialogConfig", isSignal: false, isRequired: false, transformFunction: null }, setControl: { classPropertyName: "setControl", publicName: "opDialog", isSignal: false, isRequired: false, transformFunction: null }, nativeElement: { classPropertyName: "nativeElement", publicName: "opDialogOrigin", isSignal: false, isRequired: false, transformFunction: null }, $positionOnScreen: { classPropertyName: "$positionOnScreen", publicName: "opDialogPositionOnScreen", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { opDialogClosed: "opDialogClosed" }, ngImport: i0 }); }
|
|
2099
2099
|
}
|
|
2100
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
2100
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: DialogDirective, decorators: [{
|
|
2101
2101
|
type: Directive,
|
|
2102
2102
|
args: [{ selector: '[opDialog]', }]
|
|
2103
2103
|
}], propDecorators: { opDialogClosed: [{
|
|
@@ -2118,9 +2118,9 @@ class StylerDirective {
|
|
|
2118
2118
|
constructor() {
|
|
2119
2119
|
this.el = inject(ElementRef);
|
|
2120
2120
|
this.renderer = inject(Renderer2);
|
|
2121
|
-
this.$stylesApplied = signal({}, ...(ngDevMode ?
|
|
2122
|
-
this.$element = input.required(...(ngDevMode ?
|
|
2123
|
-
this.$styler = input.required(...(ngDevMode ?
|
|
2121
|
+
this.$stylesApplied = signal({}, { ...(ngDevMode ? { debugName: "$stylesApplied" } : {}) });
|
|
2122
|
+
this.$element = input.required({ ...(ngDevMode ? { debugName: "$element" } : {}), alias: 'element' });
|
|
2123
|
+
this.$styler = input.required({ ...(ngDevMode ? { debugName: "$styler" } : {}), alias: 'styler' });
|
|
2124
2124
|
this.#stylerEffect = effect(() => {
|
|
2125
2125
|
const styles = this.$styler();
|
|
2126
2126
|
untracked(() => {
|
|
@@ -2144,13 +2144,13 @@ class StylerDirective {
|
|
|
2144
2144
|
});
|
|
2145
2145
|
this.$stylesApplied.set(toApply);
|
|
2146
2146
|
});
|
|
2147
|
-
}, ...(ngDevMode ?
|
|
2147
|
+
}, { ...(ngDevMode ? { debugName: "#stylerEffect" } : {}) });
|
|
2148
2148
|
}
|
|
2149
2149
|
#stylerEffect;
|
|
2150
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
2151
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.0.
|
|
2150
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: StylerDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
2151
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.0.2", type: StylerDirective, isStandalone: true, selector: "[styler]", inputs: { $element: { classPropertyName: "$element", publicName: "element", isSignal: true, isRequired: true, transformFunction: null }, $styler: { classPropertyName: "$styler", publicName: "styler", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0 }); }
|
|
2152
2152
|
}
|
|
2153
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
2153
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: StylerDirective, decorators: [{
|
|
2154
2154
|
type: Directive,
|
|
2155
2155
|
args: [{ selector: '[styler]' }]
|
|
2156
2156
|
}], propDecorators: { $element: [{ type: i0.Input, args: [{ isSignal: true, alias: "element", required: true }] }], $styler: [{ type: i0.Input, args: [{ isSignal: true, alias: "styler", required: true }] }] } });
|
|
@@ -2194,10 +2194,10 @@ class MatSlideToggleGroupDirective {
|
|
|
2194
2194
|
return newVal;
|
|
2195
2195
|
}, startValue), startWith$1(startValue));
|
|
2196
2196
|
}
|
|
2197
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
2198
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.
|
|
2197
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: MatSlideToggleGroupDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
2198
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.2", type: MatSlideToggleGroupDirective, isStandalone: true, selector: "[opMatSlideToggleGroup]", inputs: { allowMultiple: "allowMultiple" }, outputs: { valueEmitter: "valueEmitter" }, queries: [{ propertyName: "toggles", predicate: MatSlideToggle }], ngImport: i0 }); }
|
|
2199
2199
|
}
|
|
2200
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
2200
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: MatSlideToggleGroupDirective, decorators: [{
|
|
2201
2201
|
type: Directive,
|
|
2202
2202
|
args: [{ selector: '[opMatSlideToggleGroup]',
|
|
2203
2203
|
}]
|
|
@@ -2224,10 +2224,10 @@ class TrimWhitespaceDirective {
|
|
|
2224
2224
|
}
|
|
2225
2225
|
}
|
|
2226
2226
|
}
|
|
2227
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
2228
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.
|
|
2227
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: TrimWhitespaceDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
2228
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.2", type: TrimWhitespaceDirective, isStandalone: true, selector: "input[trimWhitespace]", host: { listeners: { "blur": "onBlur()" } }, ngImport: i0 }); }
|
|
2229
2229
|
}
|
|
2230
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
2230
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: TrimWhitespaceDirective, decorators: [{
|
|
2231
2231
|
type: Directive,
|
|
2232
2232
|
args: [{
|
|
2233
2233
|
selector: 'input[trimWhitespace]',
|
|
@@ -2246,10 +2246,10 @@ class FunctionPipe {
|
|
|
2246
2246
|
}
|
|
2247
2247
|
return func(...args);
|
|
2248
2248
|
}
|
|
2249
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
2250
|
-
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.0.
|
|
2249
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: FunctionPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
|
|
2250
|
+
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.0.2", ngImport: i0, type: FunctionPipe, isStandalone: true, name: "func" }); }
|
|
2251
2251
|
}
|
|
2252
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
2252
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: FunctionPipe, decorators: [{
|
|
2253
2253
|
type: Pipe,
|
|
2254
2254
|
args: [{
|
|
2255
2255
|
name: 'func',
|
|
@@ -2260,8 +2260,8 @@ class ConditionalClassesDirective {
|
|
|
2260
2260
|
constructor() {
|
|
2261
2261
|
this.el = inject(ElementRef);
|
|
2262
2262
|
this.renderer = inject(Renderer2);
|
|
2263
|
-
this.$element = input.required(...(ngDevMode ?
|
|
2264
|
-
this.$classes = input(undefined, ...(ngDevMode ?
|
|
2263
|
+
this.$element = input.required({ ...(ngDevMode ? { debugName: "$element" } : {}), alias: 'element' });
|
|
2264
|
+
this.$classes = input(undefined, { ...(ngDevMode ? { debugName: "$classes" } : {}), alias: 'conditionalClasses' });
|
|
2265
2265
|
this.classesApplied = [];
|
|
2266
2266
|
this.#onClasses = effect(() => {
|
|
2267
2267
|
const classes = this.$classes();
|
|
@@ -2278,13 +2278,13 @@ class ConditionalClassesDirective {
|
|
|
2278
2278
|
classesNotYetApplied.forEach(c => this.renderer.addClass(this.el.nativeElement, c));
|
|
2279
2279
|
this.classesApplied = toApply;
|
|
2280
2280
|
});
|
|
2281
|
-
}, ...(ngDevMode ?
|
|
2281
|
+
}, { ...(ngDevMode ? { debugName: "#onClasses" } : {}) });
|
|
2282
2282
|
}
|
|
2283
2283
|
#onClasses;
|
|
2284
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
2285
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.0.
|
|
2284
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: ConditionalClassesDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
2285
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.0.2", type: ConditionalClassesDirective, isStandalone: true, selector: "[conditionalClasses]", inputs: { $element: { classPropertyName: "$element", publicName: "element", isSignal: true, isRequired: true, transformFunction: null }, $classes: { classPropertyName: "$classes", publicName: "conditionalClasses", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 }); }
|
|
2286
2286
|
}
|
|
2287
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
2287
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: ConditionalClassesDirective, decorators: [{
|
|
2288
2288
|
type: Directive,
|
|
2289
2289
|
args: [{
|
|
2290
2290
|
selector: '[conditionalClasses]',
|
|
@@ -2292,8 +2292,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImpor
|
|
|
2292
2292
|
}], propDecorators: { $element: [{ type: i0.Input, args: [{ isSignal: true, alias: "element", required: true }] }], $classes: [{ type: i0.Input, args: [{ isSignal: true, alias: "conditionalClasses", required: false }] }] } });
|
|
2293
2293
|
|
|
2294
2294
|
class UtilitiesModule {
|
|
2295
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
2296
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.0.
|
|
2295
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: UtilitiesModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
2296
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.0.2", ngImport: i0, type: UtilitiesModule, imports: [SpaceCasePipe,
|
|
2297
2297
|
PhoneNumberPipe,
|
|
2298
2298
|
FunctionPipe,
|
|
2299
2299
|
StopPropagationDirective,
|
|
@@ -2318,11 +2318,11 @@ class UtilitiesModule {
|
|
|
2318
2318
|
DialogDirective,
|
|
2319
2319
|
MatSlideToggleGroupDirective,
|
|
2320
2320
|
ConditionalClassesDirective] }); }
|
|
2321
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.0.
|
|
2321
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: UtilitiesModule, providers: [
|
|
2322
2322
|
DialogService
|
|
2323
2323
|
] }); }
|
|
2324
2324
|
}
|
|
2325
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
2325
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: UtilitiesModule, decorators: [{
|
|
2326
2326
|
type: NgModule,
|
|
2327
2327
|
args: [{
|
|
2328
2328
|
exports: [
|
|
@@ -2964,7 +2964,7 @@ class TableStore extends ComponentStore {
|
|
|
2964
2964
|
this.$savableState = computed(() => {
|
|
2965
2965
|
const state = this.state();
|
|
2966
2966
|
return mapSaveableState(state);
|
|
2967
|
-
}, ...(ngDevMode ?
|
|
2967
|
+
}, { ...(ngDevMode ? { debugName: "$savableState" } : {}) });
|
|
2968
2968
|
//#region meta order and hidden
|
|
2969
2969
|
this.showColumn = this.updater((state, key) => ({
|
|
2970
2970
|
...state,
|
|
@@ -3060,7 +3060,7 @@ class TableStore extends ComponentStore {
|
|
|
3060
3060
|
};
|
|
3061
3061
|
};
|
|
3062
3062
|
this.$filters = this.selectSignal(state => state.filters);
|
|
3063
|
-
this.$filtersArray = computed(() => Object.values(this.state().filters) || [], ...(ngDevMode ?
|
|
3063
|
+
this.$filtersArray = computed(() => Object.values(this.state().filters) || [], { ...(ngDevMode ? { debugName: "$filtersArray" } : {}) });
|
|
3064
3064
|
this.filters$ = this.select(state => state.filters);
|
|
3065
3065
|
this.$getFilter = (filterId) => {
|
|
3066
3066
|
return this.selectSignal(this.$filters, filters => filters[filterId]);
|
|
@@ -3083,7 +3083,7 @@ class TableStore extends ComponentStore {
|
|
|
3083
3083
|
sorted: sortArray,
|
|
3084
3084
|
};
|
|
3085
3085
|
});
|
|
3086
|
-
this.$preSort = computed(() => createPreSort(this.$metaData()), ...(ngDevMode ?
|
|
3086
|
+
this.$preSort = computed(() => createPreSort(this.$metaData()), { ...(ngDevMode ? { debugName: "$preSort" } : {}) });
|
|
3087
3087
|
this._$selectSorted = this.selectSignal(state => state.sorted, {
|
|
3088
3088
|
equal: sortsAreSame
|
|
3089
3089
|
});
|
|
@@ -3095,7 +3095,7 @@ class TableStore extends ComponentStore {
|
|
|
3095
3095
|
const sortBy = sortLogic?.sortBy === 'use map' ? meta.map : sortLogic?.sortBy;
|
|
3096
3096
|
return ({ ...s, ...sortLogic, sortBy });
|
|
3097
3097
|
});
|
|
3098
|
-
}, ...(ngDevMode ?
|
|
3098
|
+
}, { ...(ngDevMode ? { debugName: "$selectSorted" } : {}) });
|
|
3099
3099
|
this.selectSorted$ = this.select(state => state.sorted).pipe(distinctUntilChanged(sortsAreSame));
|
|
3100
3100
|
this.$getSorts = this.selectSignal(() => this.$initializationState() !== InitializationState.Ready ? [] : this.$selectSorted());
|
|
3101
3101
|
this.sort$ = toObservable(this.$getSorts);
|
|
@@ -3391,10 +3391,10 @@ class TableStore extends ComponentStore {
|
|
|
3391
3391
|
};
|
|
3392
3392
|
}
|
|
3393
3393
|
#$groupBy;
|
|
3394
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
3395
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.
|
|
3394
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: TableStore, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
3395
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: TableStore }); }
|
|
3396
3396
|
}
|
|
3397
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
3397
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: TableStore, decorators: [{
|
|
3398
3398
|
type: Injectable
|
|
3399
3399
|
}], ctorParameters: () => [] });
|
|
3400
3400
|
const resetable = [
|
|
@@ -3426,7 +3426,7 @@ class MultiSortDirective extends MatSort {
|
|
|
3426
3426
|
untracked(() => {
|
|
3427
3427
|
this.state.setSort({ key: sortChange.active, direction: sortChange.direction });
|
|
3428
3428
|
});
|
|
3429
|
-
}, ...(ngDevMode ?
|
|
3429
|
+
}, { ...(ngDevMode ? { debugName: "#onSortChange" } : {}) });
|
|
3430
3430
|
this.#onStateSortUpdate = effect(() => {
|
|
3431
3431
|
const rules = this.state.$getSorts();
|
|
3432
3432
|
if (!rules)
|
|
@@ -3441,14 +3441,14 @@ class MultiSortDirective extends MatSort {
|
|
|
3441
3441
|
this.sortChange.emit(topRule);
|
|
3442
3442
|
}
|
|
3443
3443
|
});
|
|
3444
|
-
}, ...(ngDevMode ?
|
|
3444
|
+
}, { ...(ngDevMode ? { debugName: "#onStateSortUpdate" } : {}) });
|
|
3445
3445
|
}
|
|
3446
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
3447
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.
|
|
3446
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: MultiSortDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
3447
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.2", type: MultiSortDirective, isStandalone: true, selector: "[multiSort]", inputs: { disabled: ["matSortDisabled", "disabled"] }, providers: [
|
|
3448
3448
|
{ provide: MatSort, useExisting: MultiSortDirective }
|
|
3449
3449
|
], exportAs: ["multiSort"], usesInheritance: true, ngImport: i0 }); }
|
|
3450
3450
|
}
|
|
3451
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
3451
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: MultiSortDirective, decorators: [{
|
|
3452
3452
|
type: Directive,
|
|
3453
3453
|
args: [{
|
|
3454
3454
|
selector: '[multiSort]',
|
|
@@ -3475,7 +3475,7 @@ class InFilterComponent {
|
|
|
3475
3475
|
constructor() {
|
|
3476
3476
|
this.ref = inject(ChangeDetectorRef);
|
|
3477
3477
|
this.FieldType = FieldType;
|
|
3478
|
-
this.$type = input.required(...(ngDevMode ?
|
|
3478
|
+
this.$type = input.required({ ...(ngDevMode ? { debugName: "$type" } : {}), alias: 'type' });
|
|
3479
3479
|
this.value = [undefined];
|
|
3480
3480
|
this.onChange = (_) => { };
|
|
3481
3481
|
this.onTouched = () => { };
|
|
@@ -3510,14 +3510,14 @@ class InFilterComponent {
|
|
|
3510
3510
|
this.ref.markForCheck();
|
|
3511
3511
|
this.onChange(this.value);
|
|
3512
3512
|
}
|
|
3513
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
3514
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.
|
|
3513
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: InFilterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3514
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.2", type: InFilterComponent, isStandalone: true, selector: "lib-in-filter", inputs: { $type: { classPropertyName: "$type", publicName: "type", isSignal: true, isRequired: true, transformFunction: null } }, providers: [{
|
|
3515
3515
|
provide: NG_VALUE_ACCESSOR,
|
|
3516
3516
|
useExisting: InFilterComponent,
|
|
3517
3517
|
multi: true
|
|
3518
3518
|
}], ngImport: i0, template: "<div class=inline>\r\n @for (val of value; track $index)\r\n {\r\n <div>\r\n @if($type() === FieldType.Number || $type() === FieldType.Currency)\r\n {\r\n <input type=\"number\" [ngModel]=\"val\"\r\n [readonly]=\"$index + 1 < value.length\" [ngModelOptions]=\"{standalone:true}\"\r\n [autoFocus]=\"$index === value.length - 1\" (ngModelChange)=\"onValueChange($index, $event)\"/>\r\n }\r\n @else if($type() === FieldType.Date)\r\n {\r\n <input matInput name=\"filterValue\" [ngModel]=\"val\" [matDatepicker]=\"cal\"\r\n [readonly]=\"$index + 1 < value.length\" [ngModelOptions]=\"{standalone:true}\"\r\n [autoFocus]=\"$index === value.length - 1\" (dateChange)=\"onValueChange($index, $event.value)\"/>\r\n <mat-datepicker-toggle class=\"small-button date-toggle\" matSuffix preventEnter [for]=\"cal\" />\r\n <mat-datepicker #cal />\r\n }\r\n @else if($type() === FieldType.DateTime)\r\n {\r\n <input type=\"datetime-local\" preventEnter [ngModel]=\"val\"\r\n [readonly]=\"$index + 1 < value.length\" [ngModelOptions]=\"{standalone:true}\"\r\n [autoFocus]=\"$index === value.length - 1\" (ngModelChange)=\"onValueChange($index, $event)\"/>\r\n }\r\n @else\r\n {\r\n <input type=\"string\"\r\n [ngModel]=\"val\" [readonly]=\"$index + 1 < value.length\" [ngModelOptions]=\"{standalone:true}\"\r\n [autoFocus]=\"$index === value.length - 1\" (ngModelChange)=\"onValueChange($index ,$event)\" />\r\n }\r\n </div>\r\n <button [disabled]=\"value.length <= 1\" (click)=\"removeInput($index)\">-</button>\r\n @if ($index === value.length - 1)\r\n {\r\n <button [disabled]=\"val == undefined || val === ''\" (click)=\"addInput()\">+</button>\r\n }\r\n }\r\n</div>\r\n", styles: [".inline{display:inline-block}.small-button{height:18px;width:18px;font-size:18px;padding:0;margin:0}.small-button ::ng-deep *{line-height:initial;font-size:initial;height:18px;width:18px;font-size:18px;bottom:initial}button{cursor:pointer}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: AutoFocusDirective, selector: "[autoFocus]", inputs: ["autoFocus"] }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i2$1.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i2$1.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i2$1.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
3519
3519
|
}
|
|
3520
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
3520
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: InFilterComponent, decorators: [{
|
|
3521
3521
|
type: Component,
|
|
3522
3522
|
args: [{ selector: 'lib-in-filter', changeDetection: ChangeDetectionStrategy.OnPush, providers: [{
|
|
3523
3523
|
provide: NG_VALUE_ACCESSOR,
|
|
@@ -3532,8 +3532,8 @@ class InListFilterComponent {
|
|
|
3532
3532
|
constructor() {
|
|
3533
3533
|
this.ref = inject(ChangeDetectorRef);
|
|
3534
3534
|
this.tableState = inject(TableStore);
|
|
3535
|
-
this.$values = input([], ...(ngDevMode ?
|
|
3536
|
-
this.#e = effect(() => this.writeValue(this.$values()), ...(ngDevMode ?
|
|
3535
|
+
this.$values = input([], { ...(ngDevMode ? { debugName: "$values" } : {}), alias: 'values' });
|
|
3536
|
+
this.#e = effect(() => this.writeValue(this.$values()), { ...(ngDevMode ? { debugName: "#e" } : {}) });
|
|
3537
3537
|
this.value = [];
|
|
3538
3538
|
this.FieldType = FieldType;
|
|
3539
3539
|
this.includes = (value, values) => {
|
|
@@ -3541,20 +3541,20 @@ class InListFilterComponent {
|
|
|
3541
3541
|
};
|
|
3542
3542
|
this.onChange = (_) => { };
|
|
3543
3543
|
this.onTouched = () => { };
|
|
3544
|
-
this.$key = input.required(...(ngDevMode ?
|
|
3545
|
-
this.$selectedKeys = signal([], ...(ngDevMode ?
|
|
3546
|
-
this.$metaData = computed(() => this.tableState.$getMetaData(this.$key())(), ...(ngDevMode ?
|
|
3544
|
+
this.$key = input.required({ ...(ngDevMode ? { debugName: "$key" } : {}), alias: 'key' });
|
|
3545
|
+
this.$selectedKeys = signal([], { ...(ngDevMode ? { debugName: "$selectedKeys" } : {}) });
|
|
3546
|
+
this.$metaData = computed(() => this.tableState.$getMetaData(this.$key())(), { ...(ngDevMode ? { debugName: "$metaData" } : {}) });
|
|
3547
3547
|
this.$allValues = computed(() => {
|
|
3548
3548
|
const filterable = this.$metaData()?.additional?.filterOptions?.filterableValues;
|
|
3549
3549
|
return filterable === 'all values' || filterable?.allValues === true;
|
|
3550
|
-
}, ...(ngDevMode ?
|
|
3550
|
+
}, { ...(ngDevMode ? { debugName: "$allValues" } : {}) });
|
|
3551
3551
|
this.$specialBlank = computed(() => {
|
|
3552
3552
|
const specialBlank = this.tableState.selectSignal(s => s.allFilters)()[this.$metaData().key]?.find(k => isBlankValueFilter(k));
|
|
3553
3553
|
if (!specialBlank)
|
|
3554
3554
|
return;
|
|
3555
3555
|
return { key: specialBlank, value: 'BLANK' };
|
|
3556
|
-
}, ...(ngDevMode ?
|
|
3557
|
-
this.$specialBlankSelected = computed(() => this.$selectedKeys().some(k => isBlankValueFilter(k.value)), ...(ngDevMode ?
|
|
3556
|
+
}, { ...(ngDevMode ? { debugName: "$specialBlank" } : {}) });
|
|
3557
|
+
this.$specialBlankSelected = computed(() => this.$selectedKeys().some(k => isBlankValueFilter(k.value)), { ...(ngDevMode ? { debugName: "$specialBlankSelected" } : {}) });
|
|
3558
3558
|
this.$keyValues = computed(() => {
|
|
3559
3559
|
const metaData = this.$metaData();
|
|
3560
3560
|
if (this.$allValues()) {
|
|
@@ -3567,7 +3567,7 @@ class InListFilterComponent {
|
|
|
3567
3567
|
return Object.entries(metaData.additional.enumMap).map(([key, value]) => ({ key: value, value: +key }));
|
|
3568
3568
|
}
|
|
3569
3569
|
return [];
|
|
3570
|
-
}, ...(ngDevMode ?
|
|
3570
|
+
}, { ...(ngDevMode ? { debugName: "$keyValues" } : {}) });
|
|
3571
3571
|
}
|
|
3572
3572
|
#e;
|
|
3573
3573
|
writeValue(obj) {
|
|
@@ -3600,8 +3600,8 @@ class InListFilterComponent {
|
|
|
3600
3600
|
}
|
|
3601
3601
|
return val.key;
|
|
3602
3602
|
}
|
|
3603
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
3604
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.
|
|
3603
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: InListFilterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3604
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.2", type: InListFilterComponent, isStandalone: true, selector: "tb-in-list-filter", inputs: { $values: { classPropertyName: "$values", publicName: "values", isSignal: true, isRequired: false, transformFunction: null }, $key: { classPropertyName: "$key", publicName: "key", isSignal: true, isRequired: true, transformFunction: null } }, providers: [{
|
|
3605
3605
|
provide: NG_VALUE_ACCESSOR,
|
|
3606
3606
|
useExisting: InListFilterComponent,
|
|
3607
3607
|
multi: true
|
|
@@ -3674,7 +3674,7 @@ class InListFilterComponent {
|
|
|
3674
3674
|
}
|
|
3675
3675
|
`, isInline: true, styles: [":host{display:block;max-height:max(50vh,400px);overflow-y:auto}\n"], dependencies: [{ kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i1$1.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "directive", type: StopPropagationDirective, selector: "[stop-propagation]" }, { kind: "pipe", type: SpaceCasePipe, name: "spaceCase" }, { kind: "pipe", type: FunctionPipe, name: "func" }, { kind: "pipe", type: DatePipe, name: "date" }, { kind: "pipe", type: CurrencyPipe, name: "currency" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
3676
3676
|
}
|
|
3677
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
3677
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: InListFilterComponent, decorators: [{
|
|
3678
3678
|
type: Component,
|
|
3679
3679
|
args: [{ selector: 'tb-in-list-filter', template: `
|
|
3680
3680
|
@if($specialBlank(); as specialBlank)
|
|
@@ -3756,19 +3756,19 @@ class DateFilterComponent {
|
|
|
3756
3756
|
constructor() {
|
|
3757
3757
|
this.FilterType = FilterType;
|
|
3758
3758
|
this.FieldType = FieldType;
|
|
3759
|
-
this.$info = input.required(...(ngDevMode ?
|
|
3760
|
-
this.$currentFilterType = input.required(...(ngDevMode ?
|
|
3759
|
+
this.$info = input.required({ ...(ngDevMode ? { debugName: "$info" } : {}), alias: 'info' });
|
|
3760
|
+
this.$currentFilterType = input.required({ ...(ngDevMode ? { debugName: "$currentFilterType" } : {}), alias: 'currentFilterType' });
|
|
3761
3761
|
this.state = inject(TableStore);
|
|
3762
|
-
this.$metaData = computed(() => this.state.$getMetaData(this.$info()?.key)(), ...(ngDevMode ?
|
|
3762
|
+
this.$metaData = computed(() => this.state.$getMetaData(this.$info()?.key)(), { ...(ngDevMode ? { debugName: "$metaData" } : {}) });
|
|
3763
3763
|
this.$allValuesInMeta = computed(() => {
|
|
3764
3764
|
const filterable = this.$metaData()?.additional?.filterOptions?.filterableValues;
|
|
3765
3765
|
return filterable === 'all values' || filterable?.allValues === true;
|
|
3766
|
-
}, ...(ngDevMode ?
|
|
3766
|
+
}, { ...(ngDevMode ? { debugName: "$allValuesInMeta" } : {}) });
|
|
3767
3767
|
}
|
|
3768
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
3769
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.
|
|
3768
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: DateFilterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3769
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.2", type: DateFilterComponent, isStandalone: true, selector: "tb-date-filter", inputs: { $info: { classPropertyName: "$info", publicName: "info", isSignal: true, isRequired: true, transformFunction: null }, $currentFilterType: { classPropertyName: "$currentFilterType", publicName: "currentFilterType", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "@let currentFilterType = $currentFilterType();\r\n@let info = $info();\r\n\r\n@if (currentFilterType !== FilterType.DateBetween && currentFilterType !== FilterType.IsNull && currentFilterType !== FilterType.In)\r\n{\r\n <mat-form-field>\r\n <input matInput name=\"filterValue\" [ngModel]=\"info.filterValue\" [matDatepicker]=\"cal\"/>\r\n <mat-datepicker-toggle class=\"small-button date-toggle\" matSuffix preventEnter [for]=\"cal\" />\r\n <mat-datepicker #cal />\r\n </mat-form-field>\r\n}\r\n@if(currentFilterType === FilterType.DateBetween)\r\n{\r\n <ng-container ngModelGroup=\"filterValue\">\r\n <mat-form-field class=\"my-filter\" >\r\n <input matInput name=\"Start\" placeholder=\"From\" [ngModel]=\"info.filterValue?.Start\" [matDatepicker]=\"fromVal\"\r\n (click)=\"fromVal.open()\"/>\r\n <mat-datepicker-toggle matSuffix class=\"small-button date-toggle\" preventEnter [for]=\"fromVal\" />\r\n <mat-datepicker #fromVal />\r\n </mat-form-field>\r\n <mat-form-field>\r\n <input matInput name=\"End\" placeholder=\"To\" [ngModel]=\"info.filterValue?.End\" [matDatepicker]=\"toVal\" (click)=\"toVal.open()\"/>\r\n <mat-datepicker-toggle matSuffix class=\"small-button date-toggle\" preventEnter [for]=\"toVal\" />\r\n <mat-datepicker #toVal />\r\n </mat-form-field>\r\n </ng-container>\r\n}\r\n@if(currentFilterType === FilterType.In)\r\n{\r\n @if($allValuesInMeta())\r\n {\r\n <tb-in-list-filter name=\"filterValue\" [key]=\"info.key\" [values]=\"info.filterValue\" [(ngModel)]=\"info.filterValue\" />\r\n }\r\n @else\r\n {\r\n <lib-in-filter name=\"filterValue\" [type]=\"FieldType.Date\" [(ngModel)]=\"info.filterValue\" />\r\n }\r\n}\r\n\r\n", styles: [".filter-name{color:var(tb-filter-name);margin:10px 0;font-weight:600;display:inline-block}.switch{display:inline-block}.head-row{display:flex;width:100%;align-items:center;justify-content:space-between}.filter-row{display:flex;align-items:center;gap:1rem}mat-card.filter-card::ng-deep mat-form-field{width:150px}mat-card.filter-card::ng-deep .mat-mdc-form-field-subscript-wrapper{line-height:0}mat-card.filter-card::ng-deep .mat-mdc-form-field-subscript-wrapper:before{height:0}.inline{display:inline-block}.small-button{height:18px;width:18px;font-size:18px;padding:0;margin:0}.small-button ::ng-deep *{line-height:initial;font-size:initial;height:18px;width:18px;font-size:18px;bottom:initial}.cancel-button{font-weight:700}.date-toggle ::ng-deep svg{position:absolute;left:0;top:0}\n"], dependencies: [{ kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i1$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.NgModelGroup, selector: "[ngModelGroup]", inputs: ["ngModelGroup"], exportAs: ["ngModelGroup"] }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i2$1.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i2$1.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i2$1.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "component", type: InFilterComponent, selector: "lib-in-filter", inputs: ["type"] }, { kind: "component", type: InListFilterComponent, selector: "tb-in-list-filter", inputs: ["values", "key"] }], viewProviders: [{ provide: ControlContainer, useExisting: NgForm }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
3770
3770
|
}
|
|
3771
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
3771
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: DateFilterComponent, decorators: [{
|
|
3772
3772
|
type: Component,
|
|
3773
3773
|
args: [{ selector: 'tb-date-filter', changeDetection: ChangeDetectionStrategy.OnPush, viewProviders: [{ provide: ControlContainer, useExisting: NgForm }], imports: [
|
|
3774
3774
|
MatInputModule, FormsModule, MatDatepickerModule, InFilterComponent, InListFilterComponent
|
|
@@ -3779,19 +3779,19 @@ class NumberFilterComponent {
|
|
|
3779
3779
|
constructor() {
|
|
3780
3780
|
this.FilterType = FilterType;
|
|
3781
3781
|
this.FieldType = FieldType;
|
|
3782
|
-
this.$currentFilterType = input.required(...(ngDevMode ?
|
|
3783
|
-
this.$info = input.required(...(ngDevMode ?
|
|
3782
|
+
this.$currentFilterType = input.required({ ...(ngDevMode ? { debugName: "$currentFilterType" } : {}), alias: 'currentFilterType' });
|
|
3783
|
+
this.$info = input.required({ ...(ngDevMode ? { debugName: "$info" } : {}), alias: 'info' });
|
|
3784
3784
|
this.state = inject(TableStore);
|
|
3785
|
-
this.$metaData = computed(() => this.state.$getMetaData(this.$info()?.key)(), ...(ngDevMode ?
|
|
3785
|
+
this.$metaData = computed(() => this.state.$getMetaData(this.$info()?.key)(), { ...(ngDevMode ? { debugName: "$metaData" } : {}) });
|
|
3786
3786
|
this.$allValuesInMeta = computed(() => {
|
|
3787
3787
|
const filterable = this.$metaData()?.additional?.filterOptions?.filterableValues;
|
|
3788
3788
|
return filterable === 'all values' || filterable?.allValues === true;
|
|
3789
|
-
}, ...(ngDevMode ?
|
|
3789
|
+
}, { ...(ngDevMode ? { debugName: "$allValuesInMeta" } : {}) });
|
|
3790
3790
|
}
|
|
3791
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
3792
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.
|
|
3791
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: NumberFilterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3792
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.2", type: NumberFilterComponent, isStandalone: true, selector: "tb-number-filter", inputs: { $currentFilterType: { classPropertyName: "$currentFilterType", publicName: "currentFilterType", isSignal: true, isRequired: true, transformFunction: null }, $info: { classPropertyName: "$info", publicName: "info", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "@let currentFilterType = $currentFilterType();\r\n@let info = $info();\r\n\r\n@if(currentFilterType !== FilterType.NumberBetween && currentFilterType !== FilterType.IsNull && currentFilterType !== FilterType.In)\r\n{\r\n <mat-form-field class=\"my-filter\">\r\n <input matInput name=\"filterValue\" type=\"number\" [ngModel]=\"info.filterValue\"/>\r\n </mat-form-field>\r\n}\r\n@if(currentFilterType === FilterType.NumberBetween)\r\n{\r\n <ng-container ngModelGroup=\"filterValue\" >\r\n <mat-form-field class=\"my-filter\">\r\n <input matInput name=\"Start\" placeholder=\"Start\" type=\"number\" [ngModel]=\"info.filterValue?.Start\"/>\r\n </mat-form-field>\r\n <mat-form-field class=\"my-filter\">\r\n <input matInput name=\"End\" placeholder=\"End\" type=\"number\" [ngModel]=\"info.filterValue?.End\"/>\r\n </mat-form-field>\r\n </ng-container>\r\n}\r\n\r\n@if(currentFilterType === FilterType.In)\r\n{\r\n @if($allValuesInMeta())\r\n {\r\n <tb-in-list-filter name=\"filterValue\" [key]=\"info.key\" [values]=\"info.filterValue\" [(ngModel)]=\"info.filterValue\" />\r\n }\r\n @else\r\n {\r\n <lib-in-filter name=\"filterValue\" [type]=\"FieldType.Date\" [(ngModel)]=\"info.filterValue\" />\r\n }\r\n}\r\n", styles: [".switch{display:inline-block}.my-filter{margin-right:15px}.inline{display:inline-block}\n"], dependencies: [{ kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i1$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.NgModelGroup, selector: "[ngModelGroup]", inputs: ["ngModelGroup"], exportAs: ["ngModelGroup"] }, { kind: "component", type: InFilterComponent, selector: "lib-in-filter", inputs: ["type"] }, { kind: "component", type: InListFilterComponent, selector: "tb-in-list-filter", inputs: ["values", "key"] }], viewProviders: [{ provide: ControlContainer, useExisting: NgForm }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
3793
3793
|
}
|
|
3794
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
3794
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: NumberFilterComponent, decorators: [{
|
|
3795
3795
|
type: Component,
|
|
3796
3796
|
args: [{ selector: 'tb-number-filter', changeDetection: ChangeDetectionStrategy.OnPush, viewProviders: [{ provide: ControlContainer, useExisting: NgForm }], imports: [
|
|
3797
3797
|
MatInputModule, FormsModule, InFilterComponent, InListFilterComponent
|
|
@@ -3802,19 +3802,19 @@ class DateTimeFilterComponent {
|
|
|
3802
3802
|
constructor() {
|
|
3803
3803
|
this.FilterType = FilterType;
|
|
3804
3804
|
this.FieldType = FieldType;
|
|
3805
|
-
this.$info = input.required(...(ngDevMode ?
|
|
3806
|
-
this.$currentFilterType = input.required(...(ngDevMode ?
|
|
3805
|
+
this.$info = input.required({ ...(ngDevMode ? { debugName: "$info" } : {}), alias: 'info' });
|
|
3806
|
+
this.$currentFilterType = input.required({ ...(ngDevMode ? { debugName: "$currentFilterType" } : {}), alias: 'currentFilterType' });
|
|
3807
3807
|
this.state = inject(TableStore);
|
|
3808
|
-
this.$metaData = computed(() => this.state.$getMetaData(this.$info()?.key)(), ...(ngDevMode ?
|
|
3808
|
+
this.$metaData = computed(() => this.state.$getMetaData(this.$info()?.key)(), { ...(ngDevMode ? { debugName: "$metaData" } : {}) });
|
|
3809
3809
|
this.$allValuesInMeta = computed(() => {
|
|
3810
3810
|
const filterable = this.$metaData()?.additional?.filterOptions?.filterableValues;
|
|
3811
3811
|
return filterable === 'all values' || filterable?.allValues === true;
|
|
3812
|
-
}, ...(ngDevMode ?
|
|
3812
|
+
}, { ...(ngDevMode ? { debugName: "$allValuesInMeta" } : {}) });
|
|
3813
3813
|
}
|
|
3814
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
3815
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.
|
|
3814
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: DateTimeFilterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3815
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.2", type: DateTimeFilterComponent, isStandalone: true, selector: "tb-date-time-filter", inputs: { $info: { classPropertyName: "$info", publicName: "info", isSignal: true, isRequired: true, transformFunction: null }, $currentFilterType: { classPropertyName: "$currentFilterType", publicName: "currentFilterType", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "@let currentFilterType = $currentFilterType();\r\n@let info = $info();\r\n\r\n@if(currentFilterType !== FilterType.DateTimeBetween && currentFilterType !== FilterType.IsNull && currentFilterType !== FilterType.In)\r\n{\r\n <input type=\"datetime-local\" preventEnter name=\"filterValue\" class=\"op-date-time-input\" [ngModel]=\"info.filterValue\"/>\r\n}\r\n@if(currentFilterType === FilterType.DateTimeBetween)\r\n{\r\n <ng-container ngModelGroup=\"filterValue\">\r\n <input type=\"datetime-local\" preventEnter name=\"Start\" class=\"op-date-time-input\" [ngModel]=\"info.filterValue?.Start\"/>\r\n <input type=\"datetime-local\" preventEnter name=\"End\" class=\"op-date-time-input\" [ngModel]=\"info.filterValue?.End\"/>\r\n </ng-container>\r\n}\r\n@if(currentFilterType === FilterType.In)\r\n{\r\n @if($allValuesInMeta())\r\n {\r\n <tb-in-list-filter name=\"filterValue\" [key]=\"info.key\" [values]=\"info.filterValue\" [(ngModel)]=\"info.filterValue\" />\r\n }\r\n @else\r\n {\r\n <lib-in-filter name=\"filterValue\" [type]=\"FieldType.Date\" [(ngModel)]=\"info.filterValue\" />\r\n }\r\n}", styles: [".filter-name{color:var(tb-filter-name);margin:10px 0;font-weight:600;display:inline-block}.switch{display:inline-block}.head-row{display:flex;width:100%;align-items:center;justify-content:space-between}.filter-row{display:flex;align-items:center;gap:1rem}mat-card.filter-card::ng-deep mat-form-field{width:150px}mat-card.filter-card::ng-deep .mat-mdc-form-field-subscript-wrapper{line-height:0}mat-card.filter-card::ng-deep .mat-mdc-form-field-subscript-wrapper:before{height:0}.inline{display:inline-block}.small-button{height:18px;width:18px;font-size:18px;padding:0;margin:0}.small-button ::ng-deep *{line-height:initial;font-size:initial;height:18px;width:18px;font-size:18px;bottom:initial}.cancel-button{font-weight:700}.date-toggle ::ng-deep svg{position:absolute;left:0;top:0}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.NgModelGroup, selector: "[ngModelGroup]", inputs: ["ngModelGroup"], exportAs: ["ngModelGroup"] }, { kind: "component", type: InFilterComponent, selector: "lib-in-filter", inputs: ["type"] }, { kind: "component", type: InListFilterComponent, selector: "tb-in-list-filter", inputs: ["values", "key"] }], viewProviders: [{ provide: ControlContainer, useExisting: NgForm }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
3816
3816
|
}
|
|
3817
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
3817
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: DateTimeFilterComponent, decorators: [{
|
|
3818
3818
|
type: Component,
|
|
3819
3819
|
args: [{ selector: 'tb-date-time-filter', changeDetection: ChangeDetectionStrategy.OnPush, viewProviders: [{ provide: ControlContainer, useExisting: NgForm }], imports: [
|
|
3820
3820
|
FormsModule, InFilterComponent, InListFilterComponent
|
|
@@ -3827,23 +3827,20 @@ class FilterComponent {
|
|
|
3827
3827
|
this.filterTypes = filterTypeMap;
|
|
3828
3828
|
this.FilterType = FilterType;
|
|
3829
3829
|
this.FieldType = FieldType;
|
|
3830
|
-
this.$filter = input.required(...(ngDevMode ?
|
|
3831
|
-
|
|
3832
|
-
|
|
3833
|
-
transform: (f) => ({ ...f })
|
|
3834
|
-
}]));
|
|
3835
|
-
this.$metaData = computed(() => this.state.$getMetaData(this.$filter()?.key)(), ...(ngDevMode ? [{ debugName: "$metaData" }] : []));
|
|
3830
|
+
this.$filter = input.required({ ...(ngDevMode ? { debugName: "$filter" } : {}), alias: 'filter',
|
|
3831
|
+
transform: (f) => ({ ...f }) });
|
|
3832
|
+
this.$metaData = computed(() => this.state.$getMetaData(this.$filter()?.key)(), { ...(ngDevMode ? { debugName: "$metaData" } : {}) });
|
|
3836
3833
|
this.$allValuesInMeta = computed(() => {
|
|
3837
3834
|
const filterable = this.$metaData()?.additional?.filterOptions?.filterableValues;
|
|
3838
3835
|
return filterable === 'all values' || filterable?.allValues === true;
|
|
3839
|
-
}, ...(ngDevMode ?
|
|
3836
|
+
}, { ...(ngDevMode ? { debugName: "$allValuesInMeta" } : {}) });
|
|
3840
3837
|
this.close$ = new Subject();
|
|
3841
3838
|
this.done$ = new Subject();
|
|
3842
3839
|
this.close = outputFromObservable(this.close$);
|
|
3843
3840
|
this.done = outputFromObservable(merge(this.done$, this.close$));
|
|
3844
|
-
this.$enteredFilterType = signal(undefined, ...(ngDevMode ?
|
|
3845
|
-
this.$currentFilterType = computed(() => this.$enteredFilterType() || this.$filter()?.filterType, ...(ngDevMode ?
|
|
3846
|
-
this.$availableFilterTypes = computed(() => this.filterTypes[this.$filter()?.fieldType], ...(ngDevMode ?
|
|
3841
|
+
this.$enteredFilterType = signal(undefined, { ...(ngDevMode ? { debugName: "$enteredFilterType" } : {}) });
|
|
3842
|
+
this.$currentFilterType = computed(() => this.$enteredFilterType() || this.$filter()?.filterType, { ...(ngDevMode ? { debugName: "$currentFilterType" } : {}) });
|
|
3843
|
+
this.$availableFilterTypes = computed(() => this.filterTypes[this.$filter()?.fieldType], { ...(ngDevMode ? { debugName: "$availableFilterTypes" } : {}) });
|
|
3847
3844
|
}
|
|
3848
3845
|
onEnter(filter, event) {
|
|
3849
3846
|
event.preventDefault();
|
|
@@ -3856,10 +3853,10 @@ class FilterComponent {
|
|
|
3856
3853
|
this.state.addFilter({ ...filter });
|
|
3857
3854
|
this.done$.next();
|
|
3858
3855
|
}
|
|
3859
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
3860
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.0", type: FilterComponent, isStandalone: true, selector: "tb-filter", inputs: { $filter: { classPropertyName: "$filter", publicName: "filter", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { close: "close", done: "done" }, ngImport: i0, template: "@let filter = $filter();\r\n@let currentFilterType = $currentFilterType();\r\n\r\n@if (filter)\r\n{\r\n <mat-card appearance=\"outlined\" class=\"filter-card\">\r\n <mat-card-content>\r\n <form #form=\"ngForm\" (keydown.enter)=\"onEnter(form.value,$event)\" (keydown.escape)=\"close$.next()\">\r\n <input type=\"hidden\" name=\"filterId\" [ngModel]=\"filter.filterId\" />\r\n <input type=\"hidden\" name=\"key\" [ngModel]=\"filter.key\" />\r\n <input type=\"hidden\" name=\"fieldType\" [ngModel]=\"filter.fieldType\" />\r\n <div class=\"head-row\" >\r\n <h4 class=\"filter-name\">{{(filter.key | spaceCase)}} Filter</h4>\r\n <button class=\"cancel-button small-button\" color=\"primary\" mat-icon-button type=\"button\" [matTooltip]=\"'Close'\"\r\n (click)=\"close$.next();\">\r\n <mat-icon class=\"cancel-button\" color=\"primary\">close</mat-icon>\r\n </button>\r\n </div>\r\n <div class=\"filter-row\">\r\n <div class=\"inline\">\r\n <mat-form-field class=\"my-filter\" >\r\n <mat-select placeholder=\"Select Filter Type\" name=\"filterType\" [ngModel]=\"$currentFilterType()\" [panelWidth]=\"null\" (ngModelChange)=\"$enteredFilterType.set($event)\">\r\n @for (kvp of filterTypes[filter.fieldType]; track kvp)\r\n {\r\n <mat-option [value]=\"kvp\">\r\n {{ kvp }}\r\n </mat-option>\r\n }\r\n </mat-select>\r\n </mat-form-field>\r\n </div>\r\n @if(\r\n filter.fieldType === FieldType.String\r\n || filter.fieldType === FieldType.Array\r\n || filter.fieldType === FieldType.Link\r\n || filter.fieldType === FieldType.Unknown\r\n || filter.fieldType === FieldType.PhoneNumber)\r\n {\r\n <ng-container *ngTemplateOutlet=\"String\" />\r\n }\r\n @else if(filter.fieldType === FieldType.Number || filter.fieldType === FieldType.Currency)\r\n {\r\n <tb-number-filter [info]=\"filter\" [currentFilterType]=\"currentFilterType!\" />\r\n }\r\n @else if(filter.fieldType === FieldType.Boolean)\r\n {\r\n <ng-container *ngTemplateOutlet=\"Boolean\" />\r\n }\r\n @else if(\r\n filter.fieldType === FieldType.Date\r\n || (\r\n filter.fieldType === FieldType.DateTime\r\n && (currentFilterType === FilterType.DateIsOn || currentFilterType === FilterType.DateIsNotOn || currentFilterType === FilterType.DateTimeAtOrAfter || currentFilterType === FilterType.DateTimeAtOrBefore)\r\n ))\r\n {\r\n <tb-date-filter [info]=\"filter\" [currentFilterType]=\"currentFilterType!\" />\r\n }\r\n @else if(filter.fieldType === FieldType.DateTime)\r\n {\r\n <tb-date-time-filter [info]=\"filter\" [currentFilterType]=\"currentFilterType!\" />\r\n }\r\n @else if(filter.fieldType === FieldType.Enum)\r\n {\r\n <ng-container *ngTemplateOutlet=\"Enum\" />\r\n }\r\n\r\n @if(currentFilterType === FilterType.IsNull)\r\n {\r\n <mat-radio-group name=\"filterValue\" [ngModel]=\"filter.filterValue\">\r\n <mat-radio-button [value]=\"true\">True</mat-radio-button>\r\n <mat-radio-button [value]=\"false\">False</mat-radio-button>\r\n </mat-radio-group>\r\n }\r\n </div>\r\n <button mat-button disableRipple [disabled]=\"form.value.filterValue==undefined || !form.value.filterType\" (click)=\"addFilter(form.value)\">\r\n Apply\r\n </button>\r\n \r\n \r\n <ng-template #String>\r\n @if(currentFilterType !== FilterType.IsNull && currentFilterType !== FilterType.In)\r\n {\r\n <mat-form-field class=\"my-filter\">\r\n <input matInput name=\"filterValue\" [ngModel]=\"filter.filterValue\" />\r\n </mat-form-field>\r\n }\r\n @else if(currentFilterType === FilterType.In)\r\n {\r\n @if($allValuesInMeta())\r\n {\r\n <tb-in-list-filter name=\"filterValue\" [key]=\"filter.key\" [values]=\"filter.filterValue\" [(ngModel)]=\"filter.filterValue\" />\r\n }\r\n @else\r\n {\r\n <lib-in-filter name=\"filterValue\" [type]=\"FieldType.String\" [(ngModel)]=\"filter.filterValue\" />\r\n }\r\n }\r\n </ng-template>\r\n \r\n <ng-template #Boolean >\r\n @if(currentFilterType === FilterType.BooleanEquals)\r\n {\r\n <div class=\"switch\">\r\n <mat-radio-group name=\"filterValue\" [ngModel]=\"filter.filterValue\" >\r\n <mat-radio-button preventEnter [value]=\"true\">True</mat-radio-button>\r\n <mat-radio-button preventEnter [value]=\"false\">False</mat-radio-button>\r\n </mat-radio-group>\r\n </div>\r\n }\r\n </ng-template>\r\n <ng-template #Enum>\r\n @if(currentFilterType === FilterType.In)\r\n {\r\n <tb-in-list-filter name='filterValue' [key]=\"filter.key\" [values]=\"filter.filterValue\" [(ngModel)]=\"filter.filterValue\" />\r\n\r\n }\r\n </ng-template>\r\n </form>\r\n </mat-card-content>\r\n </mat-card>\r\n}\r\n", styles: [".filter-name{color:var(tb-filter-name);margin:10px 0;font-weight:600;display:inline-block}.switch{display:inline-block}.head-row{display:flex;width:100%;align-items:center;justify-content:space-between}.filter-row{display:flex;align-items:center;gap:1rem}mat-card.filter-card::ng-deep mat-form-field{width:150px}mat-card.filter-card::ng-deep .mat-mdc-form-field-subscript-wrapper{line-height:0}mat-card.filter-card::ng-deep .mat-mdc-form-field-subscript-wrapper:before{height:0}.inline{display:inline-block}.small-button{height:18px;width:18px;font-size:18px;padding:0;margin:0}.small-button ::ng-deep *{line-height:initial;font-size:initial;height:18px;width:18px;font-size:18px;bottom:initial}.cancel-button{font-weight:700}.date-toggle ::ng-deep svg{position:absolute;left:0;top:0}\n"], dependencies: [{ kind: "ngmodule", type: MatCardModule }, { kind: "component", type: i1$3.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i1$3.MatCardContent, selector: "mat-card-content" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.NgForm, selector: "form:not([ngNoForm]):not([formGroup]):not([formArray]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i3.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2$2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i1$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i7.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i7.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "component", type: NumberFilterComponent, selector: "tb-number-filter", inputs: ["currentFilterType", "info"] }, { kind: "component", type: DateFilterComponent, selector: "tb-date-filter", inputs: ["info", "currentFilterType"] }, { kind: "component", type: DateTimeFilterComponent, selector: "tb-date-time-filter", inputs: ["info", "currentFilterType"] }, { kind: "ngmodule", type: MatRadioModule }, { kind: "directive", type: i8.MatRadioGroup, selector: "mat-radio-group", inputs: ["color", "name", "labelPosition", "value", "selected", "disabled", "required", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioGroup"] }, { kind: "component", type: i8.MatRadioButton, selector: "mat-radio-button", inputs: ["id", "name", "aria-label", "aria-labelledby", "aria-describedby", "disableRipple", "tabIndex", "checked", "value", "labelPosition", "disabled", "required", "color", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioButton"] }, { kind: "component", type: InFilterComponent, selector: "lib-in-filter", inputs: ["type"] }, { kind: "component", type: InListFilterComponent, selector: "tb-in-list-filter", inputs: ["values", "key"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: SpaceCasePipe, name: "spaceCase" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
3856
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: FilterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3857
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.2", type: FilterComponent, isStandalone: true, selector: "tb-filter", inputs: { $filter: { classPropertyName: "$filter", publicName: "filter", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { close: "close", done: "done" }, ngImport: i0, template: "@let filter = $filter();\r\n@let currentFilterType = $currentFilterType();\r\n\r\n@if (filter)\r\n{\r\n <mat-card appearance=\"outlined\" class=\"filter-card\">\r\n <mat-card-content>\r\n <form #form=\"ngForm\" (keydown.enter)=\"onEnter(form.value,$event)\" (keydown.escape)=\"close$.next()\">\r\n <input type=\"hidden\" name=\"filterId\" [ngModel]=\"filter.filterId\" />\r\n <input type=\"hidden\" name=\"key\" [ngModel]=\"filter.key\" />\r\n <input type=\"hidden\" name=\"fieldType\" [ngModel]=\"filter.fieldType\" />\r\n <div class=\"head-row\" >\r\n <h4 class=\"filter-name\">{{(filter.key | spaceCase)}} Filter</h4>\r\n <button class=\"cancel-button small-button\" color=\"primary\" mat-icon-button type=\"button\" [matTooltip]=\"'Close'\"\r\n (click)=\"close$.next();\">\r\n <mat-icon class=\"cancel-button\" color=\"primary\">close</mat-icon>\r\n </button>\r\n </div>\r\n <div class=\"filter-row\">\r\n <div class=\"inline\">\r\n <mat-form-field class=\"my-filter\" >\r\n <mat-select placeholder=\"Select Filter Type\" name=\"filterType\" [ngModel]=\"$currentFilterType()\" [panelWidth]=\"null\" (ngModelChange)=\"$enteredFilterType.set($event)\">\r\n @for (kvp of filterTypes[filter.fieldType]; track kvp)\r\n {\r\n <mat-option [value]=\"kvp\">\r\n {{ kvp }}\r\n </mat-option>\r\n }\r\n </mat-select>\r\n </mat-form-field>\r\n </div>\r\n @if(\r\n filter.fieldType === FieldType.String\r\n || filter.fieldType === FieldType.Array\r\n || filter.fieldType === FieldType.Link\r\n || filter.fieldType === FieldType.Unknown\r\n || filter.fieldType === FieldType.PhoneNumber)\r\n {\r\n <ng-container *ngTemplateOutlet=\"String\" />\r\n }\r\n @else if(filter.fieldType === FieldType.Number || filter.fieldType === FieldType.Currency)\r\n {\r\n <tb-number-filter [info]=\"filter\" [currentFilterType]=\"currentFilterType!\" />\r\n }\r\n @else if(filter.fieldType === FieldType.Boolean)\r\n {\r\n <ng-container *ngTemplateOutlet=\"Boolean\" />\r\n }\r\n @else if(\r\n filter.fieldType === FieldType.Date\r\n || (\r\n filter.fieldType === FieldType.DateTime\r\n && (currentFilterType === FilterType.DateIsOn || currentFilterType === FilterType.DateIsNotOn || currentFilterType === FilterType.DateTimeAtOrAfter || currentFilterType === FilterType.DateTimeAtOrBefore)\r\n ))\r\n {\r\n <tb-date-filter [info]=\"filter\" [currentFilterType]=\"currentFilterType!\" />\r\n }\r\n @else if(filter.fieldType === FieldType.DateTime)\r\n {\r\n <tb-date-time-filter [info]=\"filter\" [currentFilterType]=\"currentFilterType!\" />\r\n }\r\n @else if(filter.fieldType === FieldType.Enum)\r\n {\r\n <ng-container *ngTemplateOutlet=\"Enum\" />\r\n }\r\n\r\n @if(currentFilterType === FilterType.IsNull)\r\n {\r\n <mat-radio-group name=\"filterValue\" [ngModel]=\"filter.filterValue\">\r\n <mat-radio-button [value]=\"true\">True</mat-radio-button>\r\n <mat-radio-button [value]=\"false\">False</mat-radio-button>\r\n </mat-radio-group>\r\n }\r\n </div>\r\n <button mat-button disableRipple [disabled]=\"form.value.filterValue==undefined || !form.value.filterType\" (click)=\"addFilter(form.value)\">\r\n Apply\r\n </button>\r\n \r\n \r\n <ng-template #String>\r\n @if(currentFilterType !== FilterType.IsNull && currentFilterType !== FilterType.In)\r\n {\r\n <mat-form-field class=\"my-filter\">\r\n <input matInput name=\"filterValue\" [ngModel]=\"filter.filterValue\" />\r\n </mat-form-field>\r\n }\r\n @else if(currentFilterType === FilterType.In)\r\n {\r\n @if($allValuesInMeta())\r\n {\r\n <tb-in-list-filter name=\"filterValue\" [key]=\"filter.key\" [values]=\"filter.filterValue\" [(ngModel)]=\"filter.filterValue\" />\r\n }\r\n @else\r\n {\r\n <lib-in-filter name=\"filterValue\" [type]=\"FieldType.String\" [(ngModel)]=\"filter.filterValue\" />\r\n }\r\n }\r\n </ng-template>\r\n \r\n <ng-template #Boolean >\r\n @if(currentFilterType === FilterType.BooleanEquals)\r\n {\r\n <div class=\"switch\">\r\n <mat-radio-group name=\"filterValue\" [ngModel]=\"filter.filterValue\" >\r\n <mat-radio-button preventEnter [value]=\"true\">True</mat-radio-button>\r\n <mat-radio-button preventEnter [value]=\"false\">False</mat-radio-button>\r\n </mat-radio-group>\r\n </div>\r\n }\r\n </ng-template>\r\n <ng-template #Enum>\r\n @if(currentFilterType === FilterType.In)\r\n {\r\n <tb-in-list-filter name='filterValue' [key]=\"filter.key\" [values]=\"filter.filterValue\" [(ngModel)]=\"filter.filterValue\" />\r\n\r\n }\r\n </ng-template>\r\n </form>\r\n </mat-card-content>\r\n </mat-card>\r\n}\r\n", styles: [".filter-name{color:var(tb-filter-name);margin:10px 0;font-weight:600;display:inline-block}.switch{display:inline-block}.head-row{display:flex;width:100%;align-items:center;justify-content:space-between}.filter-row{display:flex;align-items:center;gap:1rem}mat-card.filter-card::ng-deep mat-form-field{width:150px}mat-card.filter-card::ng-deep .mat-mdc-form-field-subscript-wrapper{line-height:0}mat-card.filter-card::ng-deep .mat-mdc-form-field-subscript-wrapper:before{height:0}.inline{display:inline-block}.small-button{height:18px;width:18px;font-size:18px;padding:0;margin:0}.small-button ::ng-deep *{line-height:initial;font-size:initial;height:18px;width:18px;font-size:18px;bottom:initial}.cancel-button{font-weight:700}.date-toggle ::ng-deep svg{position:absolute;left:0;top:0}\n"], dependencies: [{ kind: "ngmodule", type: MatCardModule }, { kind: "component", type: i1$3.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i1$3.MatCardContent, selector: "mat-card-content" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.NgForm, selector: "form:not([ngNoForm]):not([formGroup]):not([formArray]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i3.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2$2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i1$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i7.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i7.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "component", type: NumberFilterComponent, selector: "tb-number-filter", inputs: ["currentFilterType", "info"] }, { kind: "component", type: DateFilterComponent, selector: "tb-date-filter", inputs: ["info", "currentFilterType"] }, { kind: "component", type: DateTimeFilterComponent, selector: "tb-date-time-filter", inputs: ["info", "currentFilterType"] }, { kind: "ngmodule", type: MatRadioModule }, { kind: "directive", type: i8.MatRadioGroup, selector: "mat-radio-group", inputs: ["color", "name", "labelPosition", "value", "selected", "disabled", "required", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioGroup"] }, { kind: "component", type: i8.MatRadioButton, selector: "mat-radio-button", inputs: ["id", "name", "aria-label", "aria-labelledby", "aria-describedby", "disableRipple", "tabIndex", "checked", "value", "labelPosition", "disabled", "required", "color", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioButton"] }, { kind: "component", type: InFilterComponent, selector: "lib-in-filter", inputs: ["type"] }, { kind: "component", type: InListFilterComponent, selector: "tb-in-list-filter", inputs: ["values", "key"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: SpaceCasePipe, name: "spaceCase" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
3861
3858
|
}
|
|
3862
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
3859
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: FilterComponent, decorators: [{
|
|
3863
3860
|
type: Component,
|
|
3864
3861
|
args: [{ selector: 'tb-filter', changeDetection: ChangeDetectionStrategy.OnPush, imports: [
|
|
3865
3862
|
MatCardModule, FormsModule, SpaceCasePipe, MatButtonModule, MatTooltipModule, MatIconModule,
|
|
@@ -3876,7 +3873,7 @@ class GenColDisplayerComponent {
|
|
|
3876
3873
|
key: md.key,
|
|
3877
3874
|
displayName: md.displayName,
|
|
3878
3875
|
isVisible: !this.tableState.$hiddenKeys().includes(md.key)
|
|
3879
|
-
})), ...(ngDevMode ?
|
|
3876
|
+
})), { ...(ngDevMode ? { debugName: "$columns" } : {}) });
|
|
3880
3877
|
}
|
|
3881
3878
|
reset(displayCols) {
|
|
3882
3879
|
displayCols.forEach(c => c.isVisible = true);
|
|
@@ -3892,10 +3889,10 @@ class GenColDisplayerComponent {
|
|
|
3892
3889
|
emit(displayCols) {
|
|
3893
3890
|
this.tableState.setHiddenColumns(displayCols.map(c => ({ key: c.key, visible: c.isVisible })));
|
|
3894
3891
|
}
|
|
3895
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
3896
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.
|
|
3892
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: GenColDisplayerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3893
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.2", type: GenColDisplayerComponent, isStandalone: true, selector: "tb-col-displayer", ngImport: i0, template: "@if($columns(); as displayCols)\r\n{\r\n <span matTooltip=\"Show/hide columns\">\r\n <button color=\"primary\" mat-icon-button [matMenuTriggerFor]=\"menu\">\r\n <mat-icon color=\"primary\">visibility_off</mat-icon>\r\n </button>\r\n </span>\r\n <mat-menu #menu=\"matMenu\" class=\"my-mat-menu\">\r\n\r\n <button mat-menu-item>\r\n <span matTooltip=\"Close\">\r\n <button class=\"filter-button\" mat-icon-button>\r\n <mat-icon>close</mat-icon>\r\n </button>\r\n </span>\r\n </button>\r\n\r\n <button mat-menu-item stop-propagation>\r\n <span matTooltip=\"Show all columns\">\r\n <button color=\"primary\" mat-icon-button (click)=\"reset(displayCols)\">\r\n <mat-icon color=\"primary\">done_all</mat-icon>\r\n </button>\r\n </span>\r\n\r\n <span matTooltip=\"Hide all columns\">\r\n <button color=\"primary\" mat-icon-button (click)=\"unset(displayCols)\">\r\n <mat-icon color=\"primary\">cancel</mat-icon>\r\n </button>\r\n </span>\r\n </button>\r\n\r\n <div cdkDropList stop-propagation [cdkDropListLockAxis]=\"'y'\" (cdkDropListDropped)=\"drop($event)\">\r\n @for (col of displayCols; track col.key)\r\n {\r\n <button stop-propagation mat-menu-item cdkDrag [class.isHidden]=\"!col.isVisible\" [cdkDragData]=\"col\">\r\n <div style=\"display: flex; align-items: center;\" (click)=\"col.isVisible = !col.isVisible; emit(displayCols)\">\r\n @if(col.isVisible)\r\n {\r\n <button color=\"primary\" mat-icon-button matTooltip=\"Hide Column\" class=\"show-hide\">\r\n <mat-icon color=\"primary\">check_box</mat-icon>\r\n </button>\r\n }\r\n @else\r\n {\r\n <button mat-icon-button matTooltip=\"Show Column\" class=\"show-hide\">\r\n <mat-icon>indeterminate_check_box</mat-icon>\r\n </button>\r\n }\r\n \r\n <p class=\"label\">\r\n {{col.displayName || (col.key | spaceCase) }}\r\n </p>\r\n\r\n </div>\r\n </button>\r\n }\r\n\r\n </div>\r\n </mat-menu>\r\n}", styles: [".show-hide{margin-right:15px;height:24px;width:24px;padding:4px}.label{color:var(tb-col-display-name);text-overflow:ellipsis;overflow:hidden;white-space:nowrap;text-align:left;margin:0;font-size:17px;font-weight:700;display:inline-block;width:66%}.row{margin:0;padding:0}.isHidden{background-color:#d3d3d3;color:#a9a9a9;font-weight:700;font-size:17px;white-space:nowrap}.filter-button{margin-top:10px}.cdk-drag-preview{box-sizing:border-box;border-radius:4px;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}.cdk-drag-placeholder{opacity:0}.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}.mdc-list-item__primary-text{display:inline-block;width:100%}\n"], dependencies: [{ kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2$2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { 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: "directive", type: StopPropagationDirective, selector: "[stop-propagation]" }, { kind: "ngmodule", type: DragDropModule }, { kind: "directive", type: i5.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer", "cdkDropListHasAnchor"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i5.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "pipe", type: SpaceCasePipe, name: "spaceCase" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
3897
3894
|
}
|
|
3898
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
3895
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: GenColDisplayerComponent, decorators: [{
|
|
3899
3896
|
type: Component,
|
|
3900
3897
|
args: [{ selector: 'tb-col-displayer', changeDetection: ChangeDetectionStrategy.OnPush, imports: [
|
|
3901
3898
|
MatTooltipModule, MatIconModule, MatButtonModule, MatMenuModule, StopPropagationDirective,
|
|
@@ -3905,17 +3902,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImpor
|
|
|
3905
3902
|
|
|
3906
3903
|
class WrapperFilterStore {
|
|
3907
3904
|
constructor() {
|
|
3908
|
-
this.$filters = signal([], ...(ngDevMode ?
|
|
3905
|
+
this.$filters = signal([], { ...(ngDevMode ? { debugName: "$filters" } : {}) });
|
|
3909
3906
|
this.clearAll = () => this.$filters.set([]);
|
|
3910
3907
|
this.deleteByIndex = (index) => this.$filters.update(filters => filters.toSpliced(index, 1));
|
|
3911
3908
|
this.addFilter = (filter) => {
|
|
3912
3909
|
this.$filters.update(filters => [...filters, filter]);
|
|
3913
3910
|
};
|
|
3914
3911
|
}
|
|
3915
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
3916
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.
|
|
3912
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: WrapperFilterStore, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
3913
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: WrapperFilterStore }); }
|
|
3917
3914
|
}
|
|
3918
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
3915
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: WrapperFilterStore, decorators: [{
|
|
3919
3916
|
type: Injectable
|
|
3920
3917
|
}] });
|
|
3921
3918
|
|
|
@@ -3926,7 +3923,7 @@ class GenFilterDisplayerComponent {
|
|
|
3926
3923
|
this.$filterCols = computed(() => {
|
|
3927
3924
|
const mds = this.tableState.$metaDataArray();
|
|
3928
3925
|
return mds.filter(m => m.fieldType !== FieldType.Hidden && (m.fieldType !== FieldType.NotMapped || m.filterLogic?.filterBy) && !m.noFilter);
|
|
3929
|
-
}, ...(ngDevMode ?
|
|
3926
|
+
}, { ...(ngDevMode ? { debugName: "$filterCols" } : {}) });
|
|
3930
3927
|
}
|
|
3931
3928
|
addFilter(metaData) {
|
|
3932
3929
|
this.filterStore.addFilter({
|
|
@@ -3934,10 +3931,10 @@ class GenFilterDisplayerComponent {
|
|
|
3934
3931
|
fieldType: metaData.filterLogic?.filterType || metaData.fieldType,
|
|
3935
3932
|
});
|
|
3936
3933
|
}
|
|
3937
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
3938
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.
|
|
3934
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: GenFilterDisplayerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3935
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.2", type: GenFilterDisplayerComponent, isStandalone: true, selector: "tb-filter-displayer", ngImport: i0, template: "<button color=\"primary\" stop-propagation class=\"filter-button\" mat-icon-button [matMenuTriggerFor]=\"menu\" [matTooltip]=\"'Add Filter'\">\r\n <mat-icon class=\"filter-icon\" color=\"primary\">filter_list</mat-icon>\r\n</button>\r\n<mat-menu #menu=\"matMenu\">\r\n @for (md of $filterCols(); track md.key)\r\n {\r\n <button mat-menu-item (click)=\"addFilter(md)\">\r\n <span class=\"filter-labels\">{{md.displayName || (md.key | spaceCase)}}</span>\r\n </button>\r\n }\r\n</mat-menu>\r\n", styles: [".filter{margin:15px;display:inline-block}.filter-button{font-size:22px;font-weight:700}.cancel-button{margin-right:30px;font-weight:700}.filter-wrapper{margin-top:1em;margin-bottom:1em;float:right}.menu{margin-bottom:10px;width:109.1%}.filter-labels{font-size:17px;font-weight:600}.float{position:absolute;width:fit-content;z-index:101;top:10px;right:180px;max-width:90vw}.d-w{display:flex;flex-direction:row;justify-content:flex-end}\n"], dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { 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: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: StopPropagationDirective, selector: "[stop-propagation]" }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2$2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "pipe", type: SpaceCasePipe, name: "spaceCase" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
3939
3936
|
}
|
|
3940
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
3937
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: GenFilterDisplayerComponent, decorators: [{
|
|
3941
3938
|
type: Component,
|
|
3942
3939
|
args: [{ selector: 'tb-filter-displayer', changeDetection: ChangeDetectionStrategy.OnPush, imports: [
|
|
3943
3940
|
MatButtonModule, MatMenuModule, MatTooltipModule, StopPropagationDirective, MatIconModule,
|
|
@@ -3950,10 +3947,10 @@ class KeyDisplayPipe {
|
|
|
3950
3947
|
this.tableState = inject(TableStore);
|
|
3951
3948
|
this.transform = (key) => computed(() => this.tableState.$getMetaData(key)()?.displayName || spaceCase(key));
|
|
3952
3949
|
}
|
|
3953
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
3954
|
-
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.0.
|
|
3950
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: KeyDisplayPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
|
|
3951
|
+
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.0.2", ngImport: i0, type: KeyDisplayPipe, isStandalone: true, name: "keyDisplay" }); }
|
|
3955
3952
|
}
|
|
3956
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
3953
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: KeyDisplayPipe, decorators: [{
|
|
3957
3954
|
type: Pipe,
|
|
3958
3955
|
args: [{ name: 'keyDisplay' }]
|
|
3959
3956
|
}] });
|
|
@@ -3965,10 +3962,10 @@ class FormatFilterTypePipe {
|
|
|
3965
3962
|
}
|
|
3966
3963
|
return filterType;
|
|
3967
3964
|
}
|
|
3968
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
3969
|
-
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.0.
|
|
3965
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: FormatFilterTypePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
|
|
3966
|
+
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.0.2", ngImport: i0, type: FormatFilterTypePipe, isStandalone: true, name: "formatFilterType" }); }
|
|
3970
3967
|
}
|
|
3971
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
3968
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: FormatFilterTypePipe, decorators: [{
|
|
3972
3969
|
type: Pipe,
|
|
3973
3970
|
args: [{ name: 'formatFilterType' }]
|
|
3974
3971
|
}] });
|
|
@@ -3980,10 +3977,10 @@ class FormatFilterValuePipe {
|
|
|
3980
3977
|
transform(value, key, filterType) {
|
|
3981
3978
|
return computed(() => transform(value, this.tableState.$getMetaData(key)(), filterType));
|
|
3982
3979
|
}
|
|
3983
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
3984
|
-
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.0.
|
|
3980
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: FormatFilterValuePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
|
|
3981
|
+
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.0.2", ngImport: i0, type: FormatFilterValuePipe, isStandalone: true, name: "formatFilterValue" }); }
|
|
3985
3982
|
}
|
|
3986
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
3983
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: FormatFilterValuePipe, decorators: [{
|
|
3987
3984
|
type: Pipe,
|
|
3988
3985
|
args: [{ name: 'formatFilterValue' }]
|
|
3989
3986
|
}] });
|
|
@@ -4042,8 +4039,8 @@ class FilterChipsComponent {
|
|
|
4042
4039
|
constructor() {
|
|
4043
4040
|
this.tableState = inject(TableStore);
|
|
4044
4041
|
this.filterStore = inject(WrapperFilterStore);
|
|
4045
|
-
this.$filters = computed(() => this.tableState.$filtersArray().filter(f => isFilterInfo(f) && !f._isExternallyManaged), ...(ngDevMode ?
|
|
4046
|
-
this.$certainCustomFilters = computed(() => this.tableState.$filtersArray().filter(f => isCustomFilter(f) && f.chipLabel), ...(ngDevMode ?
|
|
4042
|
+
this.$filters = computed(() => this.tableState.$filtersArray().filter(f => isFilterInfo(f) && !f._isExternallyManaged), { ...(ngDevMode ? { debugName: "$filters" } : {}) });
|
|
4043
|
+
this.$certainCustomFilters = computed(() => this.tableState.$filtersArray().filter(f => isCustomFilter(f) && f.chipLabel), { ...(ngDevMode ? { debugName: "$certainCustomFilters" } : {}) });
|
|
4047
4044
|
this.$currentFilters = this.filterStore.$filters;
|
|
4048
4045
|
}
|
|
4049
4046
|
deleteByIndex(index) {
|
|
@@ -4055,10 +4052,10 @@ class FilterChipsComponent {
|
|
|
4055
4052
|
clearAll() {
|
|
4056
4053
|
this.filterStore.clearAll();
|
|
4057
4054
|
}
|
|
4058
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
4059
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.
|
|
4055
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: FilterChipsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4056
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.2", type: FilterChipsComponent, isStandalone: true, selector: "lib-filter-list", ngImport: i0, template: "<div class=\"d-w\">\r\n\r\n @if ($currentFilters().length)\r\n {\r\n <button class=\"cancel-button\" mat-icon-button matTooltip=\"Close all Filters Cards\" (click)=\"clearAll()\">\r\n <mat-icon class=\"cancel-button\" color=\"primary\">close</mat-icon>\r\n </button>\r\n <div class=\"float\">\r\n @for (filter of $currentFilters(); track filter.key)\r\n {\r\n <div class=\"filter\">\r\n <tb-filter [filter]=\"filter\" (close)=\"deleteByIndex($index)\" />\r\n </div>\r\n }\r\n </div>\r\n }\r\n\r\n <mat-chip-set>\r\n @for (filter of $filters(); track filter.key)\r\n {\r\n <mat-chip (dblclick)=\"addFilter(filter)\" (removed)=\"tableState.removeFilter(filter.filterId!)\">\r\n {{ (filter.key | keyDisplay)() }} {{filter.filterType | formatFilterType : filter.filterValue}} {{ (filter.filterValue | formatFilterValue: filter.key : filter.filterType)() }}\r\n <mat-icon matChipRemove>cancel</mat-icon>\r\n </mat-chip>\r\n }\r\n @for (filter of $certainCustomFilters(); track filter.filterId)\r\n {\r\n <mat-chip (removed)=\"tableState.removeFilter(filter.filterId!)\">\r\n {{filter.chipLabel}}\r\n <mat-icon matChipRemove>cancel</mat-icon>\r\n </mat-chip>\r\n }\r\n @if (($filters().length + $certainCustomFilters().length) > 1)\r\n {\r\n <mat-chip (removed)=\"tableState.clearFilters()\">\r\n Clear All\r\n <mat-icon matChipRemove>cancel</mat-icon>\r\n </mat-chip>\r\n }\r\n </mat-chip-set>\r\n\r\n</div>\r\n", styles: [".filter{margin:15px;display:inline-block}.filter-button{font-size:22px;font-weight:700}.cancel-button{margin-right:30px;font-weight:700}.filter-wrapper{margin-top:1em;margin-bottom:1em;float:right}.menu{margin-bottom:10px;width:109.1%}.filter-labels{font-size:17px;font-weight:600}.float{position:absolute;width:fit-content;z-index:101;top:10px;right:180px;max-width:90vw}.d-w{display:flex;flex-direction:row;justify-content:flex-end}\n"], dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2$2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: FilterComponent, selector: "tb-filter", inputs: ["filter"], outputs: ["close", "done"] }, { kind: "ngmodule", type: MatChipsModule }, { kind: "component", type: i4$1.MatChip, selector: "mat-basic-chip, [mat-basic-chip], mat-chip, [mat-chip]", inputs: ["role", "id", "aria-label", "aria-description", "value", "color", "removable", "highlighted", "disableRipple", "disabled"], outputs: ["removed", "destroyed"], exportAs: ["matChip"] }, { kind: "directive", type: i4$1.MatChipRemove, selector: "[matChipRemove]" }, { kind: "component", type: i4$1.MatChipSet, selector: "mat-chip-set", inputs: ["disabled", "role", "tabIndex"] }, { kind: "pipe", type: KeyDisplayPipe, name: "keyDisplay" }, { kind: "pipe", type: FormatFilterTypePipe, name: "formatFilterType" }, { kind: "pipe", type: FormatFilterValuePipe, name: "formatFilterValue" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
4060
4057
|
}
|
|
4061
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
4058
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: FilterChipsComponent, decorators: [{
|
|
4062
4059
|
type: Component,
|
|
4063
4060
|
args: [{ selector: 'lib-filter-list', changeDetection: ChangeDetectionStrategy.OnPush, imports: [
|
|
4064
4061
|
MatButtonModule, MatTooltipModule, MatIconModule, FilterComponent,
|
|
@@ -4068,14 +4065,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImpor
|
|
|
4068
4065
|
|
|
4069
4066
|
class RouterLinkColumnComponent {
|
|
4070
4067
|
constructor() {
|
|
4071
|
-
this.additional = input.required(...(ngDevMode ?
|
|
4072
|
-
this.element = input.required(...(ngDevMode ?
|
|
4073
|
-
this.queryParams = computed(() => this.additional().routerLinkOptions.queryParams(this.element()), ...(ngDevMode ?
|
|
4074
|
-
this.routerLinkOptions = computed(() => this.additional().routerLinkOptions, ...(ngDevMode ?
|
|
4075
|
-
this.link = input.required(...(ngDevMode ?
|
|
4076
|
-
}
|
|
4077
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
4078
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.0.
|
|
4068
|
+
this.additional = input.required({ ...(ngDevMode ? { debugName: "additional" } : {}) });
|
|
4069
|
+
this.element = input.required({ ...(ngDevMode ? { debugName: "element" } : {}) });
|
|
4070
|
+
this.queryParams = computed(() => this.additional().routerLinkOptions.queryParams(this.element()), { ...(ngDevMode ? { debugName: "queryParams" } : {}) });
|
|
4071
|
+
this.routerLinkOptions = computed(() => this.additional().routerLinkOptions, { ...(ngDevMode ? { debugName: "routerLinkOptions" } : {}) });
|
|
4072
|
+
this.link = input.required({ ...(ngDevMode ? { debugName: "link" } : {}) });
|
|
4073
|
+
}
|
|
4074
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: RouterLinkColumnComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4075
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.0.2", type: RouterLinkColumnComponent, isStandalone: true, selector: "tb-router-link-column", inputs: { additional: { classPropertyName: "additional", publicName: "additional", isSignal: true, isRequired: true, transformFunction: null }, element: { classPropertyName: "element", publicName: "element", isSignal: true, isRequired: true, transformFunction: null }, link: { classPropertyName: "link", publicName: "link", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: `
|
|
4079
4076
|
<a target="{{additional().target}}"
|
|
4080
4077
|
[routerLink]=" [link()]"
|
|
4081
4078
|
[queryParams]="queryParams()"
|
|
@@ -4087,7 +4084,7 @@ class RouterLinkColumnComponent {
|
|
|
4087
4084
|
</a>
|
|
4088
4085
|
`, isInline: true, dependencies: [{ kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1$5.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
4089
4086
|
}
|
|
4090
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
4087
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: RouterLinkColumnComponent, decorators: [{
|
|
4091
4088
|
type: Component,
|
|
4092
4089
|
args: [{
|
|
4093
4090
|
selector: "tb-router-link-column",
|
|
@@ -4110,18 +4107,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImpor
|
|
|
4110
4107
|
}], propDecorators: { additional: [{ type: i0.Input, args: [{ isSignal: true, alias: "additional", required: true }] }], element: [{ type: i0.Input, args: [{ isSignal: true, alias: "element", required: true }] }], link: [{ type: i0.Input, args: [{ isSignal: true, alias: "link", required: true }] }] } });
|
|
4111
4108
|
class LinkColumnComponent {
|
|
4112
4109
|
constructor() {
|
|
4113
|
-
this.element = input.required(...(ngDevMode ?
|
|
4114
|
-
this.additional = input.required(...(ngDevMode ?
|
|
4115
|
-
this.link = input.required(...(ngDevMode ?
|
|
4110
|
+
this.element = input.required({ ...(ngDevMode ? { debugName: "element" } : {}) });
|
|
4111
|
+
this.additional = input.required({ ...(ngDevMode ? { debugName: "additional" } : {}) });
|
|
4112
|
+
this.link = input.required({ ...(ngDevMode ? { debugName: "link" } : {}) });
|
|
4116
4113
|
}
|
|
4117
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
4118
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.0.
|
|
4114
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: LinkColumnComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4115
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.0.2", type: LinkColumnComponent, isStandalone: true, selector: "tb-link-column", inputs: { element: { classPropertyName: "element", publicName: "element", isSignal: true, isRequired: true, transformFunction: null }, additional: { classPropertyName: "additional", publicName: "additional", isSignal: true, isRequired: true, transformFunction: null }, link: { classPropertyName: "link", publicName: "link", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: `
|
|
4119
4116
|
<a target="{{additional().target}}" href="{{link()}}">
|
|
4120
4117
|
<ng-content></ng-content>
|
|
4121
4118
|
</a>
|
|
4122
4119
|
`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
4123
4120
|
}
|
|
4124
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
4121
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: LinkColumnComponent, decorators: [{
|
|
4125
4122
|
type: Component,
|
|
4126
4123
|
args: [{
|
|
4127
4124
|
selector: "tb-link-column",
|
|
@@ -4136,18 +4133,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImpor
|
|
|
4136
4133
|
|
|
4137
4134
|
class ArrayCommaColumnComponent {
|
|
4138
4135
|
constructor() {
|
|
4139
|
-
this.value = input.required(...(ngDevMode ?
|
|
4140
|
-
this.additional = input(3, ...(ngDevMode ?
|
|
4141
|
-
this.displayArray = computed(() => (this.value() || []).slice(0, this.additional()), ...(ngDevMode ?
|
|
4136
|
+
this.value = input.required({ ...(ngDevMode ? { debugName: "value" } : {}) });
|
|
4137
|
+
this.additional = input(3, { ...(ngDevMode ? { debugName: "additional" } : {}) });
|
|
4138
|
+
this.displayArray = computed(() => (this.value() || []).slice(0, this.additional()), { ...(ngDevMode ? { debugName: "displayArray" } : {}) });
|
|
4142
4139
|
}
|
|
4143
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
4144
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.
|
|
4140
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: ArrayCommaColumnComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4141
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.2", type: ArrayCommaColumnComponent, isStandalone: true, selector: "tb-comma-array-column", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: true, transformFunction: null }, additional: { classPropertyName: "additional", publicName: "additional", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `
|
|
4145
4142
|
@for(val of displayArray(); track $index){
|
|
4146
4143
|
{{val + (!$last ? ',' : '')}}
|
|
4147
4144
|
}
|
|
4148
4145
|
`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
4149
4146
|
}
|
|
4150
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
4147
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: ArrayCommaColumnComponent, decorators: [{
|
|
4151
4148
|
type: Component,
|
|
4152
4149
|
args: [{
|
|
4153
4150
|
selector: 'tb-comma-array-column',
|
|
@@ -4161,19 +4158,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImpor
|
|
|
4161
4158
|
}], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: true }] }], additional: [{ type: i0.Input, args: [{ isSignal: true, alias: "additional", required: false }] }] } });
|
|
4162
4159
|
class ArrayNewLineColumnComponent {
|
|
4163
4160
|
constructor() {
|
|
4164
|
-
this.value = input.required(...(ngDevMode ?
|
|
4165
|
-
this.additional = input(3, ...(ngDevMode ?
|
|
4166
|
-
this.displayArray = computed(() => (this.value() || []).slice(0, this.additional()), ...(ngDevMode ?
|
|
4161
|
+
this.value = input.required({ ...(ngDevMode ? { debugName: "value" } : {}) });
|
|
4162
|
+
this.additional = input(3, { ...(ngDevMode ? { debugName: "additional" } : {}) });
|
|
4163
|
+
this.displayArray = computed(() => (this.value() || []).slice(0, this.additional()), { ...(ngDevMode ? { debugName: "displayArray" } : {}) });
|
|
4167
4164
|
}
|
|
4168
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
4169
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.
|
|
4165
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: ArrayNewLineColumnComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4166
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.2", type: ArrayNewLineColumnComponent, isStandalone: true, selector: "tb-new-line-array-column", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: true, transformFunction: null }, additional: { classPropertyName: "additional", publicName: "additional", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `
|
|
4170
4167
|
@for(val of displayArray(); track $index){
|
|
4171
4168
|
{{val}}
|
|
4172
4169
|
@if(!$last){ <br/> }
|
|
4173
4170
|
}
|
|
4174
4171
|
`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
4175
4172
|
}
|
|
4176
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
4173
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: ArrayNewLineColumnComponent, decorators: [{
|
|
4177
4174
|
type: Component,
|
|
4178
4175
|
args: [{
|
|
4179
4176
|
selector: 'tb-new-line-array-column',
|
|
@@ -4199,10 +4196,10 @@ class InitializationComponent {
|
|
|
4199
4196
|
this.$defaultTemplate = viewChild.required('default');
|
|
4200
4197
|
this.$defaultWithIcon = viewChild.required('defaultWithIcon');
|
|
4201
4198
|
}
|
|
4202
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
4203
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.
|
|
4199
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: InitializationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4200
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.2", type: InitializationComponent, isStandalone: true, selector: "initialization", viewQueries: [{ propertyName: "$linkTemplate", first: true, predicate: ["link"], descendants: true, isSignal: true }, { propertyName: "$routerLinkTemplate", first: true, predicate: ["routerLink"], descendants: true, isSignal: true }, { propertyName: "$linkWithIconTemplate", first: true, predicate: ["linkWithIcon"], descendants: true, isSignal: true }, { propertyName: "$routerLinkWithIconTemplate", first: true, predicate: ["routerLinkWithIcon"], descendants: true, isSignal: true }, { propertyName: "$imageUrlTemplate", first: true, predicate: ["imageUrl"], descendants: true, isSignal: true }, { propertyName: "$arrayNewLineTemplate", first: true, predicate: ["arrayNewLine"], descendants: true, isSignal: true }, { propertyName: "$arrayCommaTemplate", first: true, predicate: ["arrayComma"], descendants: true, isSignal: true }, { propertyName: "$defaultTemplate", first: true, predicate: ["default"], descendants: true, isSignal: true }, { propertyName: "$defaultWithIcon", first: true, predicate: ["defaultWithIcon"], descendants: true, isSignal: true }], ngImport: i0, template: "<ng-template #link let-value='value' let-element='element' let-additional=\"additional\" let-styles=\"innerStyles\">\r\n @let link = additional.link | func : element;\r\n @if(link)\r\n {\r\n <tb-link-column [element]=\"element\" [additional]=\"additional\" [link]=\"$any(link)\">\r\n <span [styler]=\"styles\" [element]=\"element\">{{value}}</span>\r\n </tb-link-column>\r\n }\r\n @else\r\n {\r\n <span [styler]=\"styles\" [element]=\"element\">{{value}}</span>\r\n }\r\n</ng-template>\r\n\r\n<ng-template #routerLink let-value='value' let-element='element' let-additional=\"additional\" let-styles=\"innerStyles\">\r\n @let link = additional.link | func : element;\r\n @if(link)\r\n {\r\n <tb-router-link-column [element]=\"element\" [additional]=\"additional\" [link]=\"$any(link)\">\r\n <span [styler]=\"styles\" [element]=\"element\">{{value}}</span>\r\n </tb-router-link-column>\r\n }\r\n @else\r\n {\r\n <span [styler]=\"styles\" [element]=\"element\">{{value}}</span>\r\n }\r\n\r\n</ng-template>\r\n\r\n<ng-template #linkWithIcon let-value='value' let-element='element' let-additional=\"additional\" let-styles=\"innerStyles\">\r\n @let link = additional.link | func : element;\r\n @if(link)\r\n {\r\n <tb-link-column [element]=\"element\" [additional]=\"additional\" [link]=\"$any(link)\">\r\n <mat-icon [styler]=\"styles\" [element]=\"element\">{{ value}}</mat-icon>\r\n </tb-link-column>\r\n }\r\n @else\r\n {\r\n <span [styler]=\"styles\" [element]=\"element\">{{value}}</span>\r\n }\r\n</ng-template>\r\n\r\n<ng-template #routerLinkWithIcon let-value='value' let-element='element' let-additional=\"additional\" let-styles=\"innerStyles\">\r\n @let link = additional.link | func : element;\r\n @if(link)\r\n {\r\n <tb-link-column [element]=\"element\" [additional]=\"additional\" [link]=\"$any(link)\">\r\n <mat-icon [styler]=\"styles\" [element]=\"element\">{{ value}}</mat-icon>\r\n </tb-link-column>\r\n }\r\n @else\r\n {\r\n <mat-icon [styler]=\"styles\" [element]=\"element\">{{ value}}</mat-icon>\r\n }\r\n</ng-template>\r\n\r\n<ng-template #imageUrl let-value='value'>\r\n <span>\r\n <img height=\"75px\" width=\"75px\" [src]=\"value\" />\r\n </span>\r\n</ng-template>\r\n\r\n<ng-template #arrayNewLine let-value='value' let-element='element' let-additional=\"additional\" let-styles=\"innerStyles\">\r\n <tb-new-line-array-column [value]='value' [additional]='additional' [styler]=\"styles\" [element]=\"element\"/>\r\n</ng-template>\r\n\r\n<ng-template #arrayComma let-value='value' let-element='element' let-additional=\"additional\" let-styles=\"innerStyles\">\r\n <tb-comma-array-column [value]='value' [additional]='additional' [styler]=\"styles\" [element]=\"element\"/>\r\n</ng-template>\r\n\r\n<ng-template #default let-value='value' let-element='element' let-styles=\"innerStyles\">\r\n <span [styler]=\"styles\" [element]=\"element\">{{value}}</span>\r\n</ng-template>\r\n\r\n<ng-template #defaultWithIcon let-value='value' let-element='element' let-styles=\"innerStyles\">\r\n <mat-icon [styler]=\"styles\" [element]=\"element\">{{value}}</mat-icon>\r\n</ng-template>\r\n", dependencies: [{ kind: "component", type: LinkColumnComponent, selector: "tb-link-column", inputs: ["element", "additional", "link"] }, { kind: "component", type: ArrayCommaColumnComponent, selector: "tb-comma-array-column", inputs: ["value", "additional"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: RouterLinkColumnComponent, selector: "tb-router-link-column", inputs: ["additional", "element", "link"] }, { kind: "component", type: ArrayNewLineColumnComponent, selector: "tb-new-line-array-column", inputs: ["value", "additional"] }, { kind: "directive", type: StylerDirective, selector: "[styler]", inputs: ["element", "styler"] }, { kind: "pipe", type: FunctionPipe, name: "func" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
4204
4201
|
}
|
|
4205
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
4202
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: InitializationComponent, decorators: [{
|
|
4206
4203
|
type: Component,
|
|
4207
4204
|
args: [{ selector: 'initialization', imports: [
|
|
4208
4205
|
LinkColumnComponent, ArrayCommaColumnComponent, MatIcon,
|
|
@@ -4247,10 +4244,10 @@ class TableTemplateService {
|
|
|
4247
4244
|
}
|
|
4248
4245
|
return this.initializationComponentInstance.$defaultTemplate();
|
|
4249
4246
|
}
|
|
4250
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
4251
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.
|
|
4247
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: TableTemplateService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
4248
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: TableTemplateService, providedIn: 'root' }); }
|
|
4252
4249
|
}
|
|
4253
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
4250
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: TableTemplateService, decorators: [{
|
|
4254
4251
|
type: Injectable,
|
|
4255
4252
|
args: [{ providedIn: 'root' }]
|
|
4256
4253
|
}] });
|
|
@@ -4261,12 +4258,12 @@ class ColumnHeaderMenuComponent {
|
|
|
4261
4258
|
this.filterStore = inject(WrapperFilterStore, { optional: true });
|
|
4262
4259
|
this.FieldType = FieldType;
|
|
4263
4260
|
this.FilterType = FilterType;
|
|
4264
|
-
this.$metaData = input.required(...(ngDevMode ?
|
|
4265
|
-
this.$fieldType = computed(() => this.$metaData().fieldType, ...(ngDevMode ?
|
|
4266
|
-
this.$filterFieldType = computed(() => this.$metaData().filterLogic?.filterType || this.$fieldType(), ...(ngDevMode ?
|
|
4261
|
+
this.$metaData = input.required({ ...(ngDevMode ? { debugName: "$metaData" } : {}), alias: 'metaData' });
|
|
4262
|
+
this.$fieldType = computed(() => this.$metaData().fieldType, { ...(ngDevMode ? { debugName: "$fieldType" } : {}) });
|
|
4263
|
+
this.$filterFieldType = computed(() => this.$metaData().filterLogic?.filterType || this.$fieldType(), { ...(ngDevMode ? { debugName: "$filterFieldType" } : {}) });
|
|
4267
4264
|
this.$filterValue = computed(() => this.tableState.$filtersArray().filter(isFilterInfo)
|
|
4268
|
-
.find(f => f.key === this.$metaData().key && f.filterType === this.$currentFilterType())?.filterValue, ...(ngDevMode ?
|
|
4269
|
-
this.$trigger = viewChild(MatMenuTrigger, ...(ngDevMode ?
|
|
4265
|
+
.find(f => f.key === this.$metaData().key && f.filterType === this.$currentFilterType())?.filterValue, { ...(ngDevMode ? { debugName: "$filterValue" } : {}) });
|
|
4266
|
+
this.$trigger = viewChild(MatMenuTrigger, { ...(ngDevMode ? { debugName: "$trigger" } : {}) });
|
|
4270
4267
|
this.$metaFilterType = computed(() => {
|
|
4271
4268
|
if (this.$metaData().additional?.filterOptions?.filterableValues) {
|
|
4272
4269
|
return FilterType.In;
|
|
@@ -4290,9 +4287,9 @@ class ColumnHeaderMenuComponent {
|
|
|
4290
4287
|
return FilterType.In;
|
|
4291
4288
|
default: return FilterType.StringContains;
|
|
4292
4289
|
}
|
|
4293
|
-
}, ...(ngDevMode ?
|
|
4294
|
-
this.$currentFilterType = linkedSignal(() => this.$metaFilterType(), ...(ngDevMode ?
|
|
4295
|
-
this.$key = computed(() => this.$metaData().key || crypto.randomUUID(), ...(ngDevMode ?
|
|
4290
|
+
}, { ...(ngDevMode ? { debugName: "$metaFilterType" } : {}) });
|
|
4291
|
+
this.$currentFilterType = linkedSignal(() => this.$metaFilterType(), { ...(ngDevMode ? { debugName: "$currentFilterType" } : {}) });
|
|
4292
|
+
this.$key = computed(() => this.$metaData().key || crypto.randomUUID(), { ...(ngDevMode ? { debugName: "$key" } : {}) });
|
|
4296
4293
|
this.addFilter$ = new Subject();
|
|
4297
4294
|
}
|
|
4298
4295
|
hideField(key) {
|
|
@@ -4332,10 +4329,10 @@ class ColumnHeaderMenuComponent {
|
|
|
4332
4329
|
fieldType: metaData.filterLogic?.filterType || metaData.fieldType,
|
|
4333
4330
|
});
|
|
4334
4331
|
}
|
|
4335
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
4336
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.0", type: ColumnHeaderMenuComponent, isStandalone: true, selector: "tb-header-menu", inputs: { $metaData: { classPropertyName: "$metaData", publicName: "metaData", isSignal: true, isRequired: true, transformFunction: null } }, viewQueries: [{ propertyName: "$trigger", first: true, predicate: MatMenuTrigger, descendants: true, isSignal: true }], ngImport: i0, template: "@let metaData = $metaData();\r\n@let filterFieldType = $filterFieldType();\r\n@let currentFilterType = $currentFilterType();\r\n\r\n<button #b mat-icon-button class=\"open-menu-icon-button\" disableRipple [matMenuTriggerFor]=\"menu\" [matMenuTriggerRestoreFocus]=\"false\">\r\n <mat-icon class=\"menu-icon\">more_vert</mat-icon>\r\n</button>\r\n<mat-menu #menu=\"matMenu\" >\r\n @if ($fieldType() !== FieldType.NotMapped || !!$metaData().groupByLogic?.groupBy)\r\n {\r\n <button color=\"primary\" mat-menu-item (click)=\"tableState.addGroupByKey(metaData.key)\">\r\n <mat-icon color=\"primary\">group</mat-icon>\r\n <span>Group By</span>\r\n </button>\r\n }\r\n <button color=\"primary\" mat-menu-item (click)=hideField(metaData.key)>\r\n <mat-icon color=\"primary\">visibility_off</mat-icon>\r\n <span>Hide Column</span>\r\n </button>\r\n @if((metaData.fieldType === FieldType.Number || metaData.fieldType === FieldType.Currency) && !metaData.additional?.footer)\r\n {\r\n <button color=\"primary\" mat-menu-item (click)=\"tableState.addFooter(metaData.key)\">\r\n <mat-icon color=\"primary\">calculate</mat-icon>\r\n <span>Sum</span>\r\n </button>\r\n }\r\n <div (keydown)=\"$event.stopImmediatePropagation()\">\r\n @let filterValue = $filterValue();\r\n <ng-template matMenuContent>\r\n @if (filterFieldType !== FieldType.NotMapped)\r\n {\r\n <button color=\"primary\" mat-menu-item (click)=\"addFilter(metaData)\">\r\n <mat-icon color=\"primary\">filter_list</mat-icon>\r\n <span>Choose Other Filter</span>\r\n </button>\r\n <ng-form #myForm=\"ngForm\" class=\"tb-header-filter\" (keydown.enter)=\"onEnter(myForm.value, metaData)\">\r\n @if(currentFilterType === FilterType.In)\r\n {\r\n <tb-in-list-filter name=\"filterValue\" [key]=\"metaData.key\" [ngModel]=\"filterValue\" [values]=\"filterValue\" />\r\n }\r\n @else if(filterFieldType === FieldType.Link || filterFieldType === FieldType.String || filterFieldType === FieldType.Array || filterFieldType === FieldType.Unknown || filterFieldType === FieldType.PhoneNumber)\r\n {\r\n <mat-form-field stop-propagation class=\"font auto-width\">\r\n <mat-icon matPrefix class=\"search-icon\">search</mat-icon>\r\n <mat-label>{{currentFilterType === FilterType.StringDoesNotContain ? 'Does Not Contain...' : 'Contains...'}}</mat-label>\r\n <input matInput name=\"filterValue\" [ngModel]=\"undefined\"/>\r\n <span matSuffix [matTooltip]=\"currentFilterType === FilterType.StringDoesNotContain ? 'Contains' : 'Does Not Contain'\">\r\n <button mat-icon-button color=\"primary\" class=\"header-filter-icon-button\" (click)=\"setStringFilterType()\">\r\n <mat-icon [class]=\"{'chosen-icon': currentFilterType === FilterType.StringDoesNotContain }\">\r\n block\r\n </mat-icon>\r\n </button>\r\n </span>\r\n </mat-form-field>\r\n }\r\n @else if (filterFieldType === FieldType.Number || filterFieldType === FieldType.Currency)\r\n {\r\n <mat-form-field class=\"auto-width\" stop-propagation>\r\n <mat-label>{{currentFilterType === FilterType.NumberEquals ? 'Equals...' : currentFilterType === FilterType.NumberLessThan ? 'Less Than...' : 'More Than...'}}</mat-label>\r\n <input matInput type='number' name=\"filterValue\" [ngModel]=\"undefined\" />\r\n <span matPrefix class=\"tb-header-prefix\">\r\n <button mat-icon-button disableRipple class=\"header-filter-icon-button\" [class]=\"{'chosen-icon': currentFilterType === FilterType.NumberLessThan }\"\r\n (click)=\"setFilterType(FilterType.NumberLessThan)\">\r\n <mat-icon class=\"suffix-icons\"\r\n >\r\n arrow_back_ios</mat-icon>\r\n </button>\r\n <button mat-icon-button disableRipple class=\"header-filter-icon-button\" [class]=\"{'chosen-icon': currentFilterType === FilterType.NumberGreaterThan }\"\r\n (click)=\"setFilterType(FilterType.NumberGreaterThan)\" >\r\n <mat-icon class=\"suffix-icons\">arrow_forward_ios</mat-icon>\r\n </button>\r\n <button mat-icon-button disableRipple class=\"header-filter-icon-button\" [class]=\"{'chosen-icon': currentFilterType === FilterType.NumberEquals }\"\r\n (click)=\"setFilterType(FilterType.NumberEquals)\">\r\n <span class=\"suffix-icons\">=</span>\r\n </button>\r\n </span>\r\n </mat-form-field>\r\n }\r\n @else if (filterFieldType === FieldType.Boolean)\r\n {\r\n <div>\r\n <label>\r\n <mat-icon class=\"search-icon\">filter_list</mat-icon>\r\n </label>\r\n <mat-radio-group #ctrl=\"matRadioGroup\" #boolField='ngModel' stop-propagation class=\"font\" name=\"filterValue\" [ngModel]=\"undefined\" >\r\n <mat-radio-button class=\"filter-radio-button\" [value]=\"true\" (click)=\"boolField.control.setValue(true);\">True</mat-radio-button><br/>\r\n <mat-radio-button class=\"filter-radio-button\" [value]=\"false\" (click)=\"boolField.control.setValue(false)\">False</mat-radio-button><br/>\r\n </mat-radio-group>\r\n </div>\r\n }\r\n @else if (filterFieldType === FieldType.Date || filterFieldType === FieldType.DateTime)\r\n {\r\n <mat-form-field class=\"font auto-width\" stop-propagation >\r\n <span matPrefix class=\"tb-header-prefix\">\r\n <button mat-icon-button disableRipple class=\"header-filter-icon-button\" [class]=\"{'chosen-icon': currentFilterType === FilterType.DateOnOrAfter }\"\r\n (click)=\"setFilterType(FilterType.DateOnOrAfter)\">\r\n <mat-icon class=\"suffix-icons underline\">arrow_forward_ios</mat-icon>\r\n </button>\r\n <button mat-icon-button disableRipple class=\"header-filter-icon-button\" [class]=\"{'chosen-icon': currentFilterType === FilterType.DateOnOrBefore }\"\r\n (click)=\"setFilterType(FilterType.DateOnOrBefore)\">\r\n <mat-icon class=\"suffix-icons underline\">arrow_back_ios</mat-icon>\r\n </button>\r\n <button mat-icon-button disableRipple class=\"header-filter-icon-button\" [class]=\"{'chosen-icon': currentFilterType === FilterType.DateIsOn }\"\r\n (click)=\"setFilterType(FilterType.DateIsOn)\">\r\n <span class=\"suffix-icons underline\"> =</span>\r\n </button>\r\n </span>\r\n <mat-label>{{currentFilterType === FilterType.DateIsOn ? 'On...' :\r\n currentFilterType === FilterType.DateOnOrBefore ? 'On or Before...' : 'On or After...'}}</mat-label>\r\n <input matInput name=\"filterValue\" [ngModel]=\"undefined\" [matDatepicker]=\"calendar\"\r\n (click)=\"calendar.open()\"/>\r\n <mat-datepicker-toggle class=\"date-toggle header-filter-icon-button\" matSuffix preventEnter [for]=\"calendar\" />\r\n <mat-datepicker #calendar />\r\n </mat-form-field>\r\n }\r\n <button mat-button disableRipple [disabled]=\"myForm.value.filterValue == undefined\" (click)=\"onEnter(myForm.value, metaData)\">\r\n Apply\r\n </button>\r\n </ng-form>\r\n }\r\n </ng-template>\r\n </div>\r\n\r\n</mat-menu>\r\n\r\n<tb-filter\r\n *opDialog=\"addFilter$; let filter; origin b._elementRef.nativeElement; positionOnScreen { width: 300 }\"\r\n [filter]=\"filter\" (done)=\"addFilter$.next(null)\" />\r\n", styles: [":host{--mat-button-filled-container-height: 24px;--mat-button-filled-touch-target-display: none;--mat-button-outlined-container-height: 24px;--mat-button-outlined-touch-target-display: none;--mat-button-protected-container-height: 24px;--mat-button-protected-touch-target-display: none;--mat-button-text-container-height: 24px;--mat-button-text-touch-target-display: none;--mat-button-tonal-container-height: 24px;--mat-button-tonal-touch-target-display: none}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.menu-icon{font-size:16px;line-height:16px;vertical-align:top;height:16px;width:16px}.search-icon{margin-right:16px;vertical-align:middle;height:24px;width:24px;color:#0000008a;font-size:21px;line-height:1.125}.font{font-size:14px}.filter-radio-button:first-of-type{padding-left:0}.filter-radio-button{padding:10px 40px;min-width:110px}.auto-width{width:260px;margin:5px;display:block;height:55px}.open-menu-icon-button{height:28px;width:28px;padding:6px}.header-filter-icon-button{height:18px;width:18px;font-size:18px;padding:0;margin:0 2px}.header-filter-icon-button ::ng-deep *{line-height:initial;font-size:initial;height:18px;width:18px;font-size:18px;bottom:initial}.header-filter-icon-button .chosen-icon,.header-filter-icon-button.chosen-icon ::ng-deep *{height:22px;width:22px;font-size:22px;color:green}mat-icon.mat-icon.suffix-icons.underline{height:20px;text-decoration:underline .1px solid}.chosen-icon mat-icon.mat-icon.suffix-icons.underline{height:24px}::ng-deep .mat-mdc-form-field-icon-prefix:has(.tb-header-prefix),.tb-header-prefix{padding:0;flex-basis:36%}.tb-header-filter ::ng-deep .mat-mdc-form-field-subscript-wrapper{line-height:0}.tb-header-filter ::ng-deep .mat-mdc-form-field-subscript-wrapper:before{height:0}.date-toggle ::ng-deep svg{position:absolute;left:0;top:0}\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.MatMenuContent, selector: "ng-template[matMenuContent]" }, { 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: "ngmodule", type: MatIconModule }, { kind: "component", type: i2$2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i3.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.NgForm, selector: "form:not([ngNoForm]):not([formGroup]):not([formArray]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: InListFilterComponent, selector: "tb-in-list-filter", inputs: ["values", "key"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i1$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i1$2.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i1$2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: StopPropagationDirective, selector: "[stop-propagation]" }, { kind: "ngmodule", type: MatRadioModule }, { kind: "directive", type: i8.MatRadioGroup, selector: "mat-radio-group", inputs: ["color", "name", "labelPosition", "value", "selected", "disabled", "required", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioGroup"] }, { kind: "component", type: i8.MatRadioButton, selector: "mat-radio-button", inputs: ["id", "name", "aria-label", "aria-labelledby", "aria-describedby", "disableRipple", "tabIndex", "checked", "value", "labelPosition", "disabled", "required", "color", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioButton"] }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i2$1.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i2$1.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i2$1.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "directive", type: DialogDirective, selector: "[opDialog]", inputs: ["opDialogAddDialogClass", "opDialogConfig", "opDialog", "opDialogOrigin", "opDialogPositionOnScreen"], outputs: ["opDialogClosed"] }, { kind: "component", type: FilterComponent, selector: "tb-filter", inputs: ["filter"], outputs: ["close", "done"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
4332
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: ColumnHeaderMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4333
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.2", type: ColumnHeaderMenuComponent, isStandalone: true, selector: "tb-header-menu", inputs: { $metaData: { classPropertyName: "$metaData", publicName: "metaData", isSignal: true, isRequired: true, transformFunction: null } }, viewQueries: [{ propertyName: "$trigger", first: true, predicate: MatMenuTrigger, descendants: true, isSignal: true }], ngImport: i0, template: "@let metaData = $metaData();\r\n@let filterFieldType = $filterFieldType();\r\n@let currentFilterType = $currentFilterType();\r\n\r\n<button #b mat-icon-button class=\"open-menu-icon-button\" disableRipple [matMenuTriggerFor]=\"menu\" [matMenuTriggerRestoreFocus]=\"false\">\r\n <mat-icon class=\"menu-icon\">more_vert</mat-icon>\r\n</button>\r\n<mat-menu #menu=\"matMenu\" >\r\n @if ($fieldType() !== FieldType.NotMapped || !!$metaData().groupByLogic?.groupBy)\r\n {\r\n <button color=\"primary\" mat-menu-item (click)=\"tableState.addGroupByKey(metaData.key)\">\r\n <mat-icon color=\"primary\">group</mat-icon>\r\n <span>Group By</span>\r\n </button>\r\n }\r\n <button color=\"primary\" mat-menu-item (click)=hideField(metaData.key)>\r\n <mat-icon color=\"primary\">visibility_off</mat-icon>\r\n <span>Hide Column</span>\r\n </button>\r\n @if((metaData.fieldType === FieldType.Number || metaData.fieldType === FieldType.Currency) && !metaData.additional?.footer)\r\n {\r\n <button color=\"primary\" mat-menu-item (click)=\"tableState.addFooter(metaData.key)\">\r\n <mat-icon color=\"primary\">calculate</mat-icon>\r\n <span>Sum</span>\r\n </button>\r\n }\r\n <div (keydown)=\"$event.stopImmediatePropagation()\">\r\n @let filterValue = $filterValue();\r\n <ng-template matMenuContent>\r\n @if (filterFieldType !== FieldType.NotMapped)\r\n {\r\n <button color=\"primary\" mat-menu-item (click)=\"addFilter(metaData)\">\r\n <mat-icon color=\"primary\">filter_list</mat-icon>\r\n <span>Choose Other Filter</span>\r\n </button>\r\n <ng-form #myForm=\"ngForm\" class=\"tb-header-filter\" (keydown.enter)=\"onEnter(myForm.value, metaData)\">\r\n @if(currentFilterType === FilterType.In)\r\n {\r\n <tb-in-list-filter name=\"filterValue\" [key]=\"metaData.key\" [ngModel]=\"filterValue\" [values]=\"filterValue\" />\r\n }\r\n @else if(filterFieldType === FieldType.Link || filterFieldType === FieldType.String || filterFieldType === FieldType.Array || filterFieldType === FieldType.Unknown || filterFieldType === FieldType.PhoneNumber)\r\n {\r\n <mat-form-field stop-propagation class=\"font auto-width\">\r\n <mat-icon matPrefix class=\"search-icon\">search</mat-icon>\r\n <mat-label>{{currentFilterType === FilterType.StringDoesNotContain ? 'Does Not Contain...' : 'Contains...'}}</mat-label>\r\n <input matInput name=\"filterValue\" [ngModel]=\"undefined\"/>\r\n <span matSuffix [matTooltip]=\"currentFilterType === FilterType.StringDoesNotContain ? 'Contains' : 'Does Not Contain'\">\r\n <button mat-icon-button color=\"primary\" class=\"header-filter-icon-button\" (click)=\"setStringFilterType()\">\r\n <mat-icon [class]=\"{'chosen-icon': currentFilterType === FilterType.StringDoesNotContain }\">\r\n block\r\n </mat-icon>\r\n </button>\r\n </span>\r\n </mat-form-field>\r\n }\r\n @else if (filterFieldType === FieldType.Number || filterFieldType === FieldType.Currency)\r\n {\r\n <mat-form-field class=\"auto-width\" stop-propagation>\r\n <mat-label>{{currentFilterType === FilterType.NumberEquals ? 'Equals...' : currentFilterType === FilterType.NumberLessThan ? 'Less Than...' : 'More Than...'}}</mat-label>\r\n <input matInput type='number' name=\"filterValue\" [ngModel]=\"undefined\" />\r\n <span matPrefix class=\"tb-header-prefix\">\r\n <button mat-icon-button disableRipple class=\"header-filter-icon-button\" [class]=\"{'chosen-icon': currentFilterType === FilterType.NumberLessThan }\"\r\n (click)=\"setFilterType(FilterType.NumberLessThan)\">\r\n <mat-icon class=\"suffix-icons\"\r\n >\r\n arrow_back_ios</mat-icon>\r\n </button>\r\n <button mat-icon-button disableRipple class=\"header-filter-icon-button\" [class]=\"{'chosen-icon': currentFilterType === FilterType.NumberGreaterThan }\"\r\n (click)=\"setFilterType(FilterType.NumberGreaterThan)\" >\r\n <mat-icon class=\"suffix-icons\">arrow_forward_ios</mat-icon>\r\n </button>\r\n <button mat-icon-button disableRipple class=\"header-filter-icon-button\" [class]=\"{'chosen-icon': currentFilterType === FilterType.NumberEquals }\"\r\n (click)=\"setFilterType(FilterType.NumberEquals)\">\r\n <span class=\"suffix-icons\">=</span>\r\n </button>\r\n </span>\r\n </mat-form-field>\r\n }\r\n @else if (filterFieldType === FieldType.Boolean)\r\n {\r\n <div>\r\n <label>\r\n <mat-icon class=\"search-icon\">filter_list</mat-icon>\r\n </label>\r\n <mat-radio-group #ctrl=\"matRadioGroup\" #boolField='ngModel' stop-propagation class=\"font\" name=\"filterValue\" [ngModel]=\"undefined\" >\r\n <mat-radio-button class=\"filter-radio-button\" [value]=\"true\" (click)=\"boolField.control.setValue(true);\">True</mat-radio-button><br/>\r\n <mat-radio-button class=\"filter-radio-button\" [value]=\"false\" (click)=\"boolField.control.setValue(false)\">False</mat-radio-button><br/>\r\n </mat-radio-group>\r\n </div>\r\n }\r\n @else if (filterFieldType === FieldType.Date || filterFieldType === FieldType.DateTime)\r\n {\r\n <mat-form-field class=\"font auto-width\" stop-propagation >\r\n <span matPrefix class=\"tb-header-prefix\">\r\n <button mat-icon-button disableRipple class=\"header-filter-icon-button\" [class]=\"{'chosen-icon': currentFilterType === FilterType.DateOnOrAfter }\"\r\n (click)=\"setFilterType(FilterType.DateOnOrAfter)\">\r\n <mat-icon class=\"suffix-icons underline\">arrow_forward_ios</mat-icon>\r\n </button>\r\n <button mat-icon-button disableRipple class=\"header-filter-icon-button\" [class]=\"{'chosen-icon': currentFilterType === FilterType.DateOnOrBefore }\"\r\n (click)=\"setFilterType(FilterType.DateOnOrBefore)\">\r\n <mat-icon class=\"suffix-icons underline\">arrow_back_ios</mat-icon>\r\n </button>\r\n <button mat-icon-button disableRipple class=\"header-filter-icon-button\" [class]=\"{'chosen-icon': currentFilterType === FilterType.DateIsOn }\"\r\n (click)=\"setFilterType(FilterType.DateIsOn)\">\r\n <span class=\"suffix-icons underline\"> =</span>\r\n </button>\r\n </span>\r\n <mat-label>{{currentFilterType === FilterType.DateIsOn ? 'On...' :\r\n currentFilterType === FilterType.DateOnOrBefore ? 'On or Before...' : 'On or After...'}}</mat-label>\r\n <input matInput name=\"filterValue\" [ngModel]=\"undefined\" [matDatepicker]=\"calendar\"\r\n (click)=\"calendar.open()\"/>\r\n <mat-datepicker-toggle class=\"date-toggle header-filter-icon-button\" matSuffix preventEnter [for]=\"calendar\" />\r\n <mat-datepicker #calendar />\r\n </mat-form-field>\r\n }\r\n <button mat-button disableRipple [disabled]=\"myForm.value.filterValue == undefined\" (click)=\"onEnter(myForm.value, metaData)\">\r\n Apply\r\n </button>\r\n </ng-form>\r\n }\r\n </ng-template>\r\n </div>\r\n\r\n</mat-menu>\r\n\r\n<tb-filter\r\n *opDialog=\"addFilter$; let filter; origin b._elementRef.nativeElement; positionOnScreen { width: 300 }\"\r\n [filter]=\"filter\" (done)=\"addFilter$.next(null)\" />\r\n", styles: [":host{--mat-button-filled-container-height: 24px;--mat-button-filled-touch-target-display: none;--mat-button-outlined-container-height: 24px;--mat-button-outlined-touch-target-display: none;--mat-button-protected-container-height: 24px;--mat-button-protected-touch-target-display: none;--mat-button-text-container-height: 24px;--mat-button-text-touch-target-display: none;--mat-button-tonal-container-height: 24px;--mat-button-tonal-touch-target-display: none}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.menu-icon{font-size:16px;line-height:16px;vertical-align:top;height:16px;width:16px}.search-icon{margin-right:16px;vertical-align:middle;height:24px;width:24px;color:#0000008a;font-size:21px;line-height:1.125}.font{font-size:14px}.filter-radio-button:first-of-type{padding-left:0}.filter-radio-button{padding:10px 40px;min-width:110px}.auto-width{width:260px;margin:5px;display:block;height:55px}.open-menu-icon-button{height:28px;width:28px;padding:6px}.header-filter-icon-button{height:18px;width:18px;font-size:18px;padding:0;margin:0 2px}.header-filter-icon-button ::ng-deep *{line-height:initial;font-size:initial;height:18px;width:18px;font-size:18px;bottom:initial}.header-filter-icon-button .chosen-icon,.header-filter-icon-button.chosen-icon ::ng-deep *{height:22px;width:22px;font-size:22px;color:green}mat-icon.mat-icon.suffix-icons.underline{height:20px;text-decoration:underline .1px solid}.chosen-icon mat-icon.mat-icon.suffix-icons.underline{height:24px}::ng-deep .mat-mdc-form-field-icon-prefix:has(.tb-header-prefix),.tb-header-prefix{padding:0;flex-basis:36%}.tb-header-filter ::ng-deep .mat-mdc-form-field-subscript-wrapper{line-height:0}.tb-header-filter ::ng-deep .mat-mdc-form-field-subscript-wrapper:before{height:0}.date-toggle ::ng-deep svg{position:absolute;left:0;top:0}\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.MatMenuContent, selector: "ng-template[matMenuContent]" }, { 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: "ngmodule", type: MatIconModule }, { kind: "component", type: i2$2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i3.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.NgForm, selector: "form:not([ngNoForm]):not([formGroup]):not([formArray]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: InListFilterComponent, selector: "tb-in-list-filter", inputs: ["values", "key"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i1$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i1$2.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i1$2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: StopPropagationDirective, selector: "[stop-propagation]" }, { kind: "ngmodule", type: MatRadioModule }, { kind: "directive", type: i8.MatRadioGroup, selector: "mat-radio-group", inputs: ["color", "name", "labelPosition", "value", "selected", "disabled", "required", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioGroup"] }, { kind: "component", type: i8.MatRadioButton, selector: "mat-radio-button", inputs: ["id", "name", "aria-label", "aria-labelledby", "aria-describedby", "disableRipple", "tabIndex", "checked", "value", "labelPosition", "disabled", "required", "color", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioButton"] }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i2$1.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i2$1.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i2$1.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "directive", type: DialogDirective, selector: "[opDialog]", inputs: ["opDialogAddDialogClass", "opDialogConfig", "opDialog", "opDialogOrigin", "opDialogPositionOnScreen"], outputs: ["opDialogClosed"] }, { kind: "component", type: FilterComponent, selector: "tb-filter", inputs: ["filter"], outputs: ["close", "done"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
4337
4334
|
}
|
|
4338
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
4335
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: ColumnHeaderMenuComponent, decorators: [{
|
|
4339
4336
|
type: Component,
|
|
4340
4337
|
args: [{ selector: 'tb-header-menu', changeDetection: ChangeDetectionStrategy.OnPush, imports: [
|
|
4341
4338
|
MatMenuModule, MatIconModule, MatButtonModule, FormsModule, InListFilterComponent,
|
|
@@ -4352,10 +4349,10 @@ class ColumnTotalPipe {
|
|
|
4352
4349
|
return sumBy(dataToCalculate, metaData.key);
|
|
4353
4350
|
}
|
|
4354
4351
|
}
|
|
4355
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
4356
|
-
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.0.
|
|
4352
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: ColumnTotalPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
|
|
4353
|
+
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.0.2", ngImport: i0, type: ColumnTotalPipe, isStandalone: true, name: "columnTotal" }); }
|
|
4357
4354
|
}
|
|
4358
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
4355
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: ColumnTotalPipe, decorators: [{
|
|
4359
4356
|
type: Pipe,
|
|
4360
4357
|
args: [{
|
|
4361
4358
|
name: 'columnTotal',
|
|
@@ -4416,9 +4413,9 @@ class ColumnBuilderComponent {
|
|
|
4416
4413
|
this.templateService = inject(TableTemplateService);
|
|
4417
4414
|
this.tableConfig = inject(TableBuilderConfigToken);
|
|
4418
4415
|
this.injector = inject(Injector);
|
|
4419
|
-
this.$columnDef = viewChild(MatColumnDef, ...(ngDevMode ?
|
|
4420
|
-
this.$bodyTemplate = viewChild('body', ...(ngDevMode ?
|
|
4421
|
-
this.$metaData = signal(undefined, ...(ngDevMode ?
|
|
4416
|
+
this.$columnDef = viewChild(MatColumnDef, { ...(ngDevMode ? { debugName: "$columnDef" } : {}) });
|
|
4417
|
+
this.$bodyTemplate = viewChild('body', { ...(ngDevMode ? { debugName: "$bodyTemplate" } : {}) });
|
|
4418
|
+
this.$metaData = signal(undefined, { ...(ngDevMode ? { debugName: "$metaData" } : {}) });
|
|
4422
4419
|
this.$additional = computed(() => {
|
|
4423
4420
|
const metaData = this.$metaData();
|
|
4424
4421
|
if (!metaData)
|
|
@@ -4431,30 +4428,30 @@ class ColumnBuilderComponent {
|
|
|
4431
4428
|
return metaData.additional?.limit || this.tableConfig?.arrayDefaults?.limit;
|
|
4432
4429
|
}
|
|
4433
4430
|
return undefined;
|
|
4434
|
-
}, ...(ngDevMode ?
|
|
4435
|
-
this.$customCell = signal(undefined, ...(ngDevMode ?
|
|
4431
|
+
}, { ...(ngDevMode ? { debugName: "$additional" } : {}) });
|
|
4432
|
+
this.$customCell = signal(undefined, { ...(ngDevMode ? { debugName: "$customCell" } : {}) });
|
|
4436
4433
|
this.$transform = computed(() => {
|
|
4437
4434
|
const metaData = this.$metaData();
|
|
4438
4435
|
if (!metaData)
|
|
4439
4436
|
return;
|
|
4440
4437
|
return createTransformer(metaData, this.config);
|
|
4441
|
-
}, ...(ngDevMode ?
|
|
4438
|
+
}, { ...(ngDevMode ? { debugName: "$transform" } : {}) });
|
|
4442
4439
|
this.$innerTemplate = computed(() => {
|
|
4443
4440
|
const metaData = this.$metaData();
|
|
4444
4441
|
if (!metaData)
|
|
4445
4442
|
return;
|
|
4446
4443
|
return metaData.template || this.$customCell()?.$templateRef() || this.templateService.getTemplate(metaData);
|
|
4447
|
-
}, ...(ngDevMode ?
|
|
4444
|
+
}, { ...(ngDevMode ? { debugName: "$innerTemplate" } : {}) });
|
|
4448
4445
|
this.$showFilters = computed(() => {
|
|
4449
4446
|
const metaData = this.$metaData();
|
|
4450
4447
|
if (!metaData)
|
|
4451
4448
|
return;
|
|
4452
4449
|
const settings = this.state.$tableSettings();
|
|
4453
4450
|
return !(settings.hideColumnHeaderFilters || metaData.noFilter);
|
|
4454
|
-
}, ...(ngDevMode ?
|
|
4451
|
+
}, { ...(ngDevMode ? { debugName: "$showFilters" } : {}) });
|
|
4455
4452
|
this.$outerTemplate = computed(() => {
|
|
4456
4453
|
return this.$customCell()?.columnDef?.cell?.template ?? this.$bodyTemplate();
|
|
4457
|
-
}, ...(ngDevMode ?
|
|
4454
|
+
}, { ...(ngDevMode ? { debugName: "$outerTemplate" } : {}) });
|
|
4458
4455
|
this.$classes = computed(() => {
|
|
4459
4456
|
const metaData = this.$metaData();
|
|
4460
4457
|
if (!metaData)
|
|
@@ -4466,13 +4463,13 @@ class ColumnBuilderComponent {
|
|
|
4466
4463
|
});
|
|
4467
4464
|
}
|
|
4468
4465
|
return metaData.classes;
|
|
4469
|
-
}, ...(ngDevMode ?
|
|
4466
|
+
}, { ...(ngDevMode ? { debugName: "$classes" } : {}) });
|
|
4470
4467
|
this.$styles = computed(() => {
|
|
4471
4468
|
const metaData = this.$metaData();
|
|
4472
4469
|
if (!metaData)
|
|
4473
4470
|
return;
|
|
4474
4471
|
return columnStyles(metaData, this.state.$getUserDefinedWidth(metaData.key)(), this.state.$tableSettingsMinWidth());
|
|
4475
|
-
}, ...(ngDevMode ?
|
|
4472
|
+
}, { ...(ngDevMode ? { debugName: "$styles" } : {}) });
|
|
4476
4473
|
this.viewInited = false;
|
|
4477
4474
|
this.onViewInit = () => { };
|
|
4478
4475
|
this.whenViewInited = (callback) => {
|
|
@@ -4506,12 +4503,12 @@ class ColumnBuilderComponent {
|
|
|
4506
4503
|
metaData.click(element, key, event);
|
|
4507
4504
|
}
|
|
4508
4505
|
}
|
|
4509
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
4510
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.
|
|
4506
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: ColumnBuilderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4507
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.2", type: ColumnBuilderComponent, isStandalone: true, selector: "ng-component", viewQueries: [{ propertyName: "$columnDef", first: true, predicate: MatColumnDef, descendants: true, isSignal: true }, { propertyName: "$bodyTemplate", first: true, predicate: ["body"], descendants: true, isSignal: true }], ngImport: i0, template: "@let metaData = $metaData();\r\n@let customCell = $customCell();\r\n@let styles = $styles()!;\r\n\r\n@if(metaData)\r\n{\r\n <ng-container [matColumnDef]=\"metaData.key\">\r\n\r\n <!-- header -->\r\n <ng-template #myHeader matHeaderCellDef>\r\n <mat-header-cell class=\"column-head\" cdkDrag resizeColumn [style]='styles?.header' [key]=\"metaData.key\"\r\n [class]='metaData.additional?.columnPartClasses?.header'>\r\n <div class=\"header-container\" cdkDragHandle>\r\n @if(!customCell?.columnDef?.headerCell)\r\n {\r\n @if((metaData.fieldType !== FieldType.NotMapped || !!metaData.sortLogic?.sortBy) && !metaData.noSort)\r\n {\r\n <div mat-sort-header style=\"width: 100%\">\r\n {{ metaData.displayName ? metaData.displayName : ( metaData.key | spaceCase ) }}\r\n </div>\r\n }\r\n @else if(metaData.fieldType === FieldType.NotMapped || metaData.noSort)\r\n {\r\n <div style=\"width: 100%\">\r\n {{ metaData.displayName ? metaData.displayName : ( metaData.key | spaceCase ) }}\r\n </div>\r\n }\r\n @if($showFilters())\r\n {\r\n <tb-header-menu #menu [metaData]='metaData' />\r\n }\r\n }\r\n @else\r\n {\r\n <ng-container *ngTemplateOutlet=\"customCell!.columnDef!.headerCell.template; context: {metaData: metaData, styles: styles?.header} \" />\r\n }\r\n </div>\r\n </mat-header-cell>\r\n </ng-template>\r\n \r\n <!-- body -->\r\n <ng-container *matCellDef=\"let element;\">\r\n <ng-container *ngTemplateOutlet=\"$outerTemplate()!; context: { metaData: metaData, element: element , styles: styles?.body, $implicit: element }\"/>\r\n </ng-container>\r\n <ng-template #body let-element='element' >\r\n <mat-cell [matTooltip]=\"metaData.toolTip ? (getTooltip | func : element) : ''\" \r\n [conditionalClasses]='metaData.classes' [element]='element' [styler]='styles.body'\r\n (click)='cellClicked(element, metaData.key, $event)' >\r\n <ng-container *ngTemplateOutlet=\"$innerTemplate()!;\r\n context: {\r\n value: ($transform()! | func : element),\r\n element: element,\r\n additional: $additional(),\r\n innerStyles: styles.innerBody,\r\n $implicit: element\r\n }; Injector: injector\" />\r\n </mat-cell>\r\n </ng-template>\r\n \r\n <!-- footer -->\r\n <ng-template matFooterCellDef>\r\n @if(customCell?.columnDef?.footerCell)\r\n {\r\n <ng-container\r\n *ngTemplateOutlet=\"customCell!.columnDef!.footerCell.template;\r\n context: {metaData: metaData, data: $data, styles : styles.footer }\"/>\r\n }\r\n @else\r\n {\r\n @let data = $data();\r\n <mat-footer-cell [style]='styles.footer' [class]='metaData.additional?.columnPartClasses?.footer'>\r\n @if(!!data?.length && metaData.additional?.footer)\r\n {\r\n <span class=\"bold\">\r\n @switch (metaData.fieldType)\r\n {\r\n @case (FieldType.Currency) { {{ data | columnTotal: metaData | currency }} }\r\n @case (FieldType.Number) { {{ data | columnTotal: metaData | number }} }\r\n }\r\n </span>\r\n }\r\n \r\n </mat-footer-cell>\r\n }\r\n </ng-template>\r\n </ng-container>\r\n}", styles: [".header-container{display:flex;flex-direction:row;width:100%;align-items:center}.negative-currency{color:red}.column-head{position:relative}.bold,.group-footer{font-weight:900}.cdk-drag-preview{background:#fff;border-radius:4px;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}.cdk-drag-placeholder{opacity:33%;border-right-width:0px}.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}.drag-handle{color:#add8e6;cursor:move;margin-right:9px}\n"], dependencies: [{ kind: "ngmodule", type: MatTableModule }, { kind: "directive", type: i1$6.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i1$6.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i1$6.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i1$6.MatFooterCellDef, selector: "[matFooterCellDef]" }, { kind: "directive", type: i1$6.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i1$6.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "directive", type: i1$6.MatFooterCell, selector: "mat-footer-cell, td[mat-footer-cell]" }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: ResizeColumnDirective, selector: "[resizeColumn]", inputs: ["resizeColumn", "key"] }, { kind: "directive", type: StylerDirective, selector: "[styler]", inputs: ["element", "styler"] }, { kind: "directive", type: ConditionalClassesDirective, selector: "[conditionalClasses]", inputs: ["element", "conditionalClasses"] }, { kind: "ngmodule", type: DragDropModule }, { kind: "directive", type: i5.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i5.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "ngmodule", type: MatSortModule }, { kind: "component", type: i3$1.MatSortHeader, selector: "[mat-sort-header]", inputs: ["mat-sort-header", "arrowPosition", "start", "disabled", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "component", type: ColumnHeaderMenuComponent, selector: "tb-header-menu", inputs: ["metaData"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "pipe", type: FunctionPipe, name: "func" }, { kind: "pipe", type: SpaceCasePipe, name: "spaceCase" }, { kind: "pipe", type: ColumnTotalPipe, name: "columnTotal" }, { kind: "pipe", type: CurrencyPipe, name: "currency" }, { kind: "pipe", type: DecimalPipe, name: "number" }], viewProviders: [
|
|
4511
4508
|
{ provide: CDK_DROP_LIST, useExisting: CdkDropList },
|
|
4512
4509
|
], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
4513
4510
|
}
|
|
4514
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
4511
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: ColumnBuilderComponent, decorators: [{
|
|
4515
4512
|
type: Component,
|
|
4516
4513
|
args: [{ changeDetection: ChangeDetectionStrategy.OnPush, viewProviders: [
|
|
4517
4514
|
{ provide: CDK_DROP_LIST, useExisting: CdkDropList },
|
|
@@ -4561,10 +4558,10 @@ class DataStore extends ComponentStore {
|
|
|
4561
4558
|
constructor() {
|
|
4562
4559
|
super({ ...defaultDataState });
|
|
4563
4560
|
}
|
|
4564
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
4565
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.
|
|
4561
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: DataStore, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
4562
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: DataStore }); }
|
|
4566
4563
|
}
|
|
4567
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
4564
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: DataStore, decorators: [{
|
|
4568
4565
|
type: Injectable
|
|
4569
4566
|
}], ctorParameters: () => [] });
|
|
4570
4567
|
|
|
@@ -4728,17 +4725,17 @@ class GenericTableComponent {
|
|
|
4728
4725
|
this._injector = inject(Injector);
|
|
4729
4726
|
this.tableContainer = inject(TableContainerComponent, { optional: true });
|
|
4730
4727
|
this.smallFooter = 10;
|
|
4731
|
-
this.$headerRow = viewChild(MatHeaderRowDef, ...(ngDevMode ?
|
|
4732
|
-
this.$footerRow = viewChild(MatFooterRowDef, ...(ngDevMode ?
|
|
4733
|
-
this.$table = viewChild(MatTable, ...(ngDevMode ?
|
|
4734
|
-
this.$dropList = viewChild(CdkDropList, ...(ngDevMode ?
|
|
4728
|
+
this.$headerRow = viewChild(MatHeaderRowDef, { ...(ngDevMode ? { debugName: "$headerRow" } : {}) });
|
|
4729
|
+
this.$footerRow = viewChild(MatFooterRowDef, { ...(ngDevMode ? { debugName: "$footerRow" } : {}) });
|
|
4730
|
+
this.$table = viewChild(MatTable, { ...(ngDevMode ? { debugName: "$table" } : {}) });
|
|
4731
|
+
this.$dropList = viewChild(CdkDropList, { ...(ngDevMode ? { debugName: "$dropList" } : {}) });
|
|
4735
4732
|
this.selection$ = output({ alias: 'selection' });
|
|
4736
|
-
this.$displayData = input.required(...(ngDevMode ?
|
|
4737
|
-
this.$displayDataLength = computed(() => this.$displayData().length, ...(ngDevMode ?
|
|
4738
|
-
this.$data = input.required(...(ngDevMode ?
|
|
4739
|
-
this.$rows = input([], ...(ngDevMode ?
|
|
4740
|
-
this.$columnInfos = input.required(...(ngDevMode ?
|
|
4741
|
-
this.$dataSource = input.required(...(ngDevMode ?
|
|
4733
|
+
this.$displayData = input.required({ ...(ngDevMode ? { debugName: "$displayData" } : {}), alias: 'displayData' });
|
|
4734
|
+
this.$displayDataLength = computed(() => this.$displayData().length, { ...(ngDevMode ? { debugName: "$displayDataLength" } : {}) });
|
|
4735
|
+
this.$data = input.required({ ...(ngDevMode ? { debugName: "$data" } : {}), alias: 'data' });
|
|
4736
|
+
this.$rows = input([], { ...(ngDevMode ? { debugName: "$rows" } : {}), alias: 'rows' });
|
|
4737
|
+
this.$columnInfos = input.required({ ...(ngDevMode ? { debugName: "$columnInfos" } : {}), alias: 'columnInfos' });
|
|
4738
|
+
this.$dataSource = input.required({ ...(ngDevMode ? { debugName: "$dataSource" } : {}), alias: 'dataSource' });
|
|
4742
4739
|
this.$keys = computed(() => {
|
|
4743
4740
|
const displayed = this.state.$orderedVisibleColumns();
|
|
4744
4741
|
const built = this.$columns();
|
|
@@ -4750,9 +4747,9 @@ class GenericTableComponent {
|
|
|
4750
4747
|
keys.unshift('index');
|
|
4751
4748
|
}
|
|
4752
4749
|
return keys;
|
|
4753
|
-
}, ...(ngDevMode ?
|
|
4750
|
+
}, { ...(ngDevMode ? { debugName: "$keys" } : {}) });
|
|
4754
4751
|
this.keys$ = toObservable(this.$keys);
|
|
4755
|
-
this.$trackBy = input(undefined, ...(ngDevMode ?
|
|
4752
|
+
this.$trackBy = input(undefined, { ...(ngDevMode ? { debugName: "$trackBy" } : {}), alias: 'trackBy' });
|
|
4756
4753
|
this.$trackByFunction = computed(() => {
|
|
4757
4754
|
const trackBy = this.$trackBy();
|
|
4758
4755
|
if (!trackBy)
|
|
@@ -4762,17 +4759,17 @@ class GenericTableComponent {
|
|
|
4762
4759
|
return `${item.level}-${item[initIndexSymbol]}`;
|
|
4763
4760
|
return typeof trackBy === 'function' ? trackBy(item) : item[trackBy];
|
|
4764
4761
|
});
|
|
4765
|
-
}, ...(ngDevMode ?
|
|
4766
|
-
this.$hasFooterMeta = computed(() => this.state.$metaDataArray().some(md => !!md.additional?.footer), ...(ngDevMode ?
|
|
4767
|
-
this.$hasCustomFooter = computed(() => this.$columnInfos()?.some(ci => !!ci.customCell?.columnDef?.footerCell), ...(ngDevMode ?
|
|
4762
|
+
}, { ...(ngDevMode ? { debugName: "$trackByFunction" } : {}) });
|
|
4763
|
+
this.$hasFooterMeta = computed(() => this.state.$metaDataArray().some(md => !!md.additional?.footer), { ...(ngDevMode ? { debugName: "$hasFooterMeta" } : {}) });
|
|
4764
|
+
this.$hasCustomFooter = computed(() => this.$columnInfos()?.some(ci => !!ci.customCell?.columnDef?.footerCell), { ...(ngDevMode ? { debugName: "$hasCustomFooter" } : {}) });
|
|
4768
4765
|
this.$footerRowStyle = computed(() => {
|
|
4769
4766
|
const hasData = !!this.$displayDataLength();
|
|
4770
4767
|
const metaFooter = this.$hasFooterMeta();
|
|
4771
4768
|
const customFooter = this.$hasCustomFooter();
|
|
4772
4769
|
const hasSelectionColumn = this.state.$props().selectionColumn;
|
|
4773
4770
|
return customFooter || hasSelectionColumn || (hasData && metaFooter) ? 'regular-footer' : hasData ? 'no-footer' : 'small-footer';
|
|
4774
|
-
}, ...(ngDevMode ?
|
|
4775
|
-
this.$showFooterRow = computed(() => this.$footerRowStyle() !== 'no-footer', ...(ngDevMode ?
|
|
4771
|
+
}, { ...(ngDevMode ? { debugName: "$footerRowStyle" } : {}) });
|
|
4772
|
+
this.$showFooterRow = computed(() => this.$footerRowStyle() !== 'no-footer', { ...(ngDevMode ? { debugName: "$showFooterRow" } : {}) });
|
|
4776
4773
|
this.injector = Injector.create({
|
|
4777
4774
|
providers: [
|
|
4778
4775
|
{ provide: MatTable, useFactory: () => this.$table() },
|
|
@@ -4780,10 +4777,10 @@ class GenericTableComponent {
|
|
|
4780
4777
|
],
|
|
4781
4778
|
parent: this._injector
|
|
4782
4779
|
});
|
|
4783
|
-
this.$hasIndexColumn = computed(() => this.state.selectSignal(state => state.props.indexColumn)(), ...(ngDevMode ?
|
|
4784
|
-
this.$columns = signal({}, ...(ngDevMode ?
|
|
4785
|
-
this.$showHeader = computed(() => !this.state.$tableSettings().hideColumnHeader, ...(ngDevMode ?
|
|
4786
|
-
this.$paginatorHeight = signal(0, ...(ngDevMode ?
|
|
4780
|
+
this.$hasIndexColumn = computed(() => this.state.selectSignal(state => state.props.indexColumn)(), { ...(ngDevMode ? { debugName: "$hasIndexColumn" } : {}) });
|
|
4781
|
+
this.$columns = signal({}, { ...(ngDevMode ? { debugName: "$columns" } : {}) });
|
|
4782
|
+
this.$showHeader = computed(() => !this.state.$tableSettings().hideColumnHeader, { ...(ngDevMode ? { debugName: "$showHeader" } : {}) });
|
|
4783
|
+
this.$paginatorHeight = signal(0, { ...(ngDevMode ? { debugName: "$paginatorHeight" } : {}) });
|
|
4787
4784
|
this.r = new ResizeObserver(entries => this.$paginatorHeight.set(entries[0]?.contentRect.height || 0));
|
|
4788
4785
|
this.#rr = effect((cleanup) => {
|
|
4789
4786
|
const paginatorWrapper = this.tableContainer?.$paginatorWrapper();
|
|
@@ -4791,9 +4788,9 @@ class GenericTableComponent {
|
|
|
4791
4788
|
return;
|
|
4792
4789
|
this.r.observe(paginatorWrapper.nativeElement);
|
|
4793
4790
|
cleanup(() => { this.r.disconnect(); });
|
|
4794
|
-
}, ...(ngDevMode ?
|
|
4791
|
+
}, { ...(ngDevMode ? { debugName: "#rr" } : {}) });
|
|
4795
4792
|
this.$offset = this.dataStore.selectSignal(s => s.virtualScrollOffset);
|
|
4796
|
-
this.$footerOffset = computed(() => this.$useVirtualScroll() ? this.$offset() : this.$paginatorHeight(), ...(ngDevMode ?
|
|
4793
|
+
this.$footerOffset = computed(() => this.$useVirtualScroll() ? this.$offset() : this.$paginatorHeight(), { ...(ngDevMode ? { debugName: "$footerOffset" } : {}) });
|
|
4797
4794
|
this.#buildColumnsEffect = effect(() => {
|
|
4798
4795
|
const columnInfos = this.$columnInfos() || [];
|
|
4799
4796
|
const table = this.$table();
|
|
@@ -4809,7 +4806,7 @@ class GenericTableComponent {
|
|
|
4809
4806
|
});
|
|
4810
4807
|
columnInfos.forEach(ci => this.buildColumn(ci));
|
|
4811
4808
|
});
|
|
4812
|
-
}, ...(ngDevMode ?
|
|
4809
|
+
}, { ...(ngDevMode ? { debugName: "#buildColumnsEffect" } : {}) });
|
|
4813
4810
|
this.#buildRowsEffect = effect(() => {
|
|
4814
4811
|
const table = this.$table();
|
|
4815
4812
|
const rows = this.$rows();
|
|
@@ -4823,7 +4820,7 @@ class GenericTableComponent {
|
|
|
4823
4820
|
table.addRowDef(row);
|
|
4824
4821
|
});
|
|
4825
4822
|
});
|
|
4826
|
-
}, ...(ngDevMode ?
|
|
4823
|
+
}, { ...(ngDevMode ? { debugName: "#buildRowsEffect" } : {}) });
|
|
4827
4824
|
this.#buildHeaderRowEffect = effect(() => {
|
|
4828
4825
|
const headerRow = this.$headerRow();
|
|
4829
4826
|
const showHeader = this.$showHeader();
|
|
@@ -4834,7 +4831,7 @@ class GenericTableComponent {
|
|
|
4834
4831
|
else if (headerRow && table)
|
|
4835
4832
|
table.removeHeaderRowDef(headerRow);
|
|
4836
4833
|
});
|
|
4837
|
-
}, ...(ngDevMode ?
|
|
4834
|
+
}, { ...(ngDevMode ? { debugName: "#buildHeaderRowEffect" } : {}) });
|
|
4838
4835
|
this.#buildFooterEffect = effect(() => {
|
|
4839
4836
|
const footerRow = this.$footerRow();
|
|
4840
4837
|
const showFooter = this.$showFooterRow();
|
|
@@ -4845,9 +4842,9 @@ class GenericTableComponent {
|
|
|
4845
4842
|
else if (footerRow && table)
|
|
4846
4843
|
table.removeFooterRowDef(footerRow);
|
|
4847
4844
|
});
|
|
4848
|
-
}, ...(ngDevMode ?
|
|
4849
|
-
this.$usePaginator = computed(() => this.state.$tableSettings().usePaginator, ...(ngDevMode ?
|
|
4850
|
-
this.$useVirtualScroll = computed(() => this.state.$viewType().includes('virtual'), ...(ngDevMode ?
|
|
4845
|
+
}, { ...(ngDevMode ? { debugName: "#buildFooterEffect" } : {}) });
|
|
4846
|
+
this.$usePaginator = computed(() => this.state.$tableSettings().usePaginator, { ...(ngDevMode ? { debugName: "$usePaginator" } : {}) });
|
|
4847
|
+
this.$useVirtualScroll = computed(() => this.state.$viewType().includes('virtual'), { ...(ngDevMode ? { debugName: "$useVirtualScroll" } : {}) });
|
|
4851
4848
|
this.$virtualStart = this.dataStore.selectSignal(d => d.virtualEnds.start);
|
|
4852
4849
|
this.$offsetIndex = computed(() => {
|
|
4853
4850
|
const virtualStart = this.$virtualStart();
|
|
@@ -4860,8 +4857,8 @@ class GenericTableComponent {
|
|
|
4860
4857
|
return pageSize * currentPage;
|
|
4861
4858
|
}
|
|
4862
4859
|
return 0;
|
|
4863
|
-
}, ...(ngDevMode ?
|
|
4864
|
-
this.$hasSelectColumn = computed(() => this.state.selectSignal(state => state.props.selectionColumn)(), ...(ngDevMode ?
|
|
4860
|
+
}, { ...(ngDevMode ? { debugName: "$offsetIndex" } : {}) });
|
|
4861
|
+
this.$hasSelectColumn = computed(() => this.state.selectSignal(state => state.props.selectionColumn)(), { ...(ngDevMode ? { debugName: "$hasSelectColumn" } : {}) });
|
|
4865
4862
|
this.$selection = computed(() => {
|
|
4866
4863
|
const trackBy = this.$trackBy();
|
|
4867
4864
|
if (trackBy) {
|
|
@@ -4877,7 +4874,7 @@ class GenericTableComponent {
|
|
|
4877
4874
|
this.checkForPreviousSelection(model);
|
|
4878
4875
|
});
|
|
4879
4876
|
return model;
|
|
4880
|
-
}, ...(ngDevMode ?
|
|
4877
|
+
}, { ...(ngDevMode ? { debugName: "$selection" } : {}) });
|
|
4881
4878
|
this.selectionChange$ = toObservable(this.$selection).pipe(switchMap(s => s.changed));
|
|
4882
4879
|
this.$selectionChange = toSignal(this.selectionChange$);
|
|
4883
4880
|
this.onSelectionChangeEffect = effect(() => {
|
|
@@ -4885,20 +4882,20 @@ class GenericTableComponent {
|
|
|
4885
4882
|
if (!selectionChange)
|
|
4886
4883
|
return;
|
|
4887
4884
|
untracked(() => this.selection$.emit(selectionChange));
|
|
4888
|
-
}, ...(ngDevMode ?
|
|
4885
|
+
}, { ...(ngDevMode ? { debugName: "onSelectionChangeEffect" } : {}) });
|
|
4889
4886
|
this.$isAllSelected = computed(() => {
|
|
4890
4887
|
this.$selectionChange();
|
|
4891
4888
|
const selected = this.$selection()?.selected;
|
|
4892
4889
|
if (!selected?.length)
|
|
4893
4890
|
return false;
|
|
4894
4891
|
return this.$selectableData()?.length === selected.length;
|
|
4895
|
-
}, ...(ngDevMode ?
|
|
4892
|
+
}, { ...(ngDevMode ? { debugName: "$isAllSelected" } : {}) });
|
|
4896
4893
|
this.$masterToggleChecked = this.$isAllSelected;
|
|
4897
4894
|
this.$masterToggleIndeterminate = computed(() => {
|
|
4898
4895
|
this.$selectionChange();
|
|
4899
4896
|
return !!this.$selection()?.selected.length && !this.$masterToggleChecked();
|
|
4900
|
-
}, ...(ngDevMode ?
|
|
4901
|
-
this.$paginated = computed(() => this.state.$viewType() === 'virtual paginator' || this.state.$viewType() === 'paginator', ...(ngDevMode ?
|
|
4897
|
+
}, { ...(ngDevMode ? { debugName: "$masterToggleIndeterminate" } : {}) });
|
|
4898
|
+
this.$paginated = computed(() => this.state.$viewType() === 'virtual paginator' || this.state.$viewType() === 'paginator', { ...(ngDevMode ? { debugName: "$paginated" } : {}) });
|
|
4902
4899
|
this.$selectableData = computed(() => {
|
|
4903
4900
|
const isGrouped = !!this.state.$groupByData().length;
|
|
4904
4901
|
this.state.$expandGroups();
|
|
@@ -4915,7 +4912,7 @@ class GenericTableComponent {
|
|
|
4915
4912
|
return this.$data();
|
|
4916
4913
|
}
|
|
4917
4914
|
return [];
|
|
4918
|
-
}, ...(ngDevMode ?
|
|
4915
|
+
}, { ...(ngDevMode ? { debugName: "$selectableData" } : {}) });
|
|
4919
4916
|
this.$selectAllMessage = computed(() => {
|
|
4920
4917
|
if (this.$isAllSelected())
|
|
4921
4918
|
return `Deselect all ${this.$selection().selected.length} selected`;
|
|
@@ -4925,7 +4922,7 @@ class GenericTableComponent {
|
|
|
4925
4922
|
message += ' on this page';
|
|
4926
4923
|
}
|
|
4927
4924
|
return message;
|
|
4928
|
-
}, ...(ngDevMode ?
|
|
4925
|
+
}, { ...(ngDevMode ? { debugName: "$selectAllMessage" } : {}) });
|
|
4929
4926
|
this.#onSelectableDataChangeEffect = effect(() => {
|
|
4930
4927
|
const selectableData = this.$selectableData();
|
|
4931
4928
|
untracked(() => {
|
|
@@ -4942,34 +4939,20 @@ class GenericTableComponent {
|
|
|
4942
4939
|
const removed = selected.filter(trackByFunc);
|
|
4943
4940
|
this.$selection().deselect(...removed);
|
|
4944
4941
|
});
|
|
4945
|
-
}, ...(ngDevMode ?
|
|
4946
|
-
this.$tableWidth = linkedSignal(...(ngDevMode ?
|
|
4947
|
-
|
|
4948
|
-
|
|
4949
|
-
|
|
4950
|
-
|
|
4951
|
-
|
|
4952
|
-
|
|
4953
|
-
}
|
|
4954
|
-
return {};
|
|
4955
|
-
function wasReset() {
|
|
4956
|
-
return (previousUserDefinedWidth ?? 0) >= 0 && currentUserDefinedWidth == null;
|
|
4957
|
-
}
|
|
4958
|
-
} }] : [{
|
|
4959
|
-
source: this.state.$getUserDefinedTableWidth,
|
|
4960
|
-
computation: (currentUserDefinedWidth, { source: previousUserDefinedWidth } = { value: null, source: 0 }) => {
|
|
4961
|
-
if (currentUserDefinedWidth) {
|
|
4962
|
-
return ({ width: `${currentUserDefinedWidth}px`, minWidth: 'initial' });
|
|
4963
|
-
}
|
|
4964
|
-
if (wasReset()) {
|
|
4965
|
-
return ({ width: 'initial' });
|
|
4966
|
-
}
|
|
4967
|
-
return {};
|
|
4968
|
-
function wasReset() {
|
|
4969
|
-
return (previousUserDefinedWidth ?? 0) >= 0 && currentUserDefinedWidth == null;
|
|
4970
|
-
}
|
|
4942
|
+
}, { ...(ngDevMode ? { debugName: "#onSelectableDataChangeEffect" } : {}) });
|
|
4943
|
+
this.$tableWidth = linkedSignal({ ...(ngDevMode ? { debugName: "$tableWidth" } : {}), source: this.state.$getUserDefinedTableWidth,
|
|
4944
|
+
computation: (currentUserDefinedWidth, { source: previousUserDefinedWidth } = { value: null, source: 0 }) => {
|
|
4945
|
+
if (currentUserDefinedWidth) {
|
|
4946
|
+
return ({ width: `${currentUserDefinedWidth}px`, minWidth: 'initial' });
|
|
4947
|
+
}
|
|
4948
|
+
if (wasReset()) {
|
|
4949
|
+
return ({ width: 'initial' });
|
|
4971
4950
|
}
|
|
4972
|
-
|
|
4951
|
+
return {};
|
|
4952
|
+
function wasReset() {
|
|
4953
|
+
return (previousUserDefinedWidth ?? 0) >= 0 && currentUserDefinedWidth == null;
|
|
4954
|
+
}
|
|
4955
|
+
} });
|
|
4973
4956
|
this.getGroupHeaderTransform = (key, val) => computed(() => {
|
|
4974
4957
|
if (val == undefined || val === 'null')
|
|
4975
4958
|
return 'BLANK';
|
|
@@ -4997,7 +4980,7 @@ class GenericTableComponent {
|
|
|
4997
4980
|
return parseTbSizeToPixels(notPersistedTableSettings.rowHeight) + 'px';
|
|
4998
4981
|
}
|
|
4999
4982
|
return undefined;
|
|
5000
|
-
}, ...(ngDevMode ?
|
|
4983
|
+
}, { ...(ngDevMode ? { debugName: "$rowHeight" } : {}) });
|
|
5001
4984
|
this.$headerHeight = computed(() => {
|
|
5002
4985
|
if (this.state.$userDefinedHeaderHeight()) {
|
|
5003
4986
|
return this.state.$userDefinedHeaderHeight() + 'px';
|
|
@@ -5011,14 +4994,14 @@ class GenericTableComponent {
|
|
|
5011
4994
|
return parseTbSizeToPixels(notPersistedTableSettings.headerHeight) + 'px';
|
|
5012
4995
|
}
|
|
5013
4996
|
return undefined;
|
|
5014
|
-
}, ...(ngDevMode ?
|
|
4997
|
+
}, { ...(ngDevMode ? { debugName: "$headerHeight" } : {}) });
|
|
5015
4998
|
this.$groupHeaderHeight = computed(() => {
|
|
5016
4999
|
const groupHeaderHeight = this.state.$notPersistedTableSettings().groupHeaderHeight;
|
|
5017
5000
|
if (groupHeaderHeight) {
|
|
5018
5001
|
return parseTbSizeToPixels(groupHeaderHeight) + 'px';
|
|
5019
5002
|
}
|
|
5020
5003
|
return this.$rowHeight();
|
|
5021
|
-
}, ...(ngDevMode ?
|
|
5004
|
+
}, { ...(ngDevMode ? { debugName: "$groupHeaderHeight" } : {}) });
|
|
5022
5005
|
this.$footerHeight = computed(() => {
|
|
5023
5006
|
const footerStyle = this.$footerRowStyle();
|
|
5024
5007
|
switch (footerStyle) {
|
|
@@ -5029,10 +5012,10 @@ class GenericTableComponent {
|
|
|
5029
5012
|
default:
|
|
5030
5013
|
return '0px';
|
|
5031
5014
|
}
|
|
5032
|
-
}, ...(ngDevMode ?
|
|
5033
|
-
this.$stickyFooter = computed(() => this.state.$props().stickyFooter || this.state.$isVirtual(), ...(ngDevMode ?
|
|
5034
|
-
this.$rowStyles = computed(() => this.state.$tableSettings().rowStyles || {}, ...(ngDevMode ?
|
|
5035
|
-
this.$rowClasses = computed(() => this.state.$tableSettings().rowClasses || {}, ...(ngDevMode ?
|
|
5015
|
+
}, { ...(ngDevMode ? { debugName: "$footerHeight" } : {}) });
|
|
5016
|
+
this.$stickyFooter = computed(() => this.state.$props().stickyFooter || this.state.$isVirtual(), { ...(ngDevMode ? { debugName: "$stickyFooter" } : {}) });
|
|
5017
|
+
this.$rowStyles = computed(() => this.state.$tableSettings().rowStyles || {}, { ...(ngDevMode ? { debugName: "$rowStyles" } : {}) });
|
|
5018
|
+
this.$rowClasses = computed(() => this.state.$tableSettings().rowClasses || {}, { ...(ngDevMode ? { debugName: "$rowClasses" } : {}) });
|
|
5036
5019
|
this.allOfGroupSelected = (uniqueName) => computed(() => {
|
|
5037
5020
|
//make sure signal is marked dirty when selection or over all data changes
|
|
5038
5021
|
this.$selectionChange();
|
|
@@ -5088,8 +5071,8 @@ class GenericTableComponent {
|
|
|
5088
5071
|
this.$selectFilterKey = computed(() => {
|
|
5089
5072
|
const selectFilter = Object.keys(this.state.$filters()).find(key => key.startsWith('header-column-select'));
|
|
5090
5073
|
return selectFilter;
|
|
5091
|
-
}, ...(ngDevMode ?
|
|
5092
|
-
this.$hasSelectFilter = computed(() => !!this.$selectFilterKey(), ...(ngDevMode ?
|
|
5074
|
+
}, { ...(ngDevMode ? { debugName: "$selectFilterKey" } : {}) });
|
|
5075
|
+
this.$hasSelectFilter = computed(() => !!this.$selectFilterKey(), { ...(ngDevMode ? { debugName: "$hasSelectFilter" } : {}) });
|
|
5093
5076
|
this._onSelect = effect(() => {
|
|
5094
5077
|
const selectionChange = this.$selectionChange();
|
|
5095
5078
|
untracked(() => {
|
|
@@ -5099,7 +5082,7 @@ class GenericTableComponent {
|
|
|
5099
5082
|
this.state.removeFilter(selectFilterKey);
|
|
5100
5083
|
this.addSelectFilter(true);
|
|
5101
5084
|
});
|
|
5102
|
-
}, ...(ngDevMode ?
|
|
5085
|
+
}, { ...(ngDevMode ? { debugName: "_onSelect" } : {}) });
|
|
5103
5086
|
}
|
|
5104
5087
|
#rr;
|
|
5105
5088
|
drop(event) {
|
|
@@ -5191,10 +5174,10 @@ class GenericTableComponent {
|
|
|
5191
5174
|
notSavable: true,
|
|
5192
5175
|
});
|
|
5193
5176
|
}
|
|
5194
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
5195
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.0", type: GenericTableComponent, isStandalone: true, selector: "tb-generic-table", inputs: { $displayData: { classPropertyName: "$displayData", publicName: "displayData", isSignal: true, isRequired: true, transformFunction: null }, $data: { classPropertyName: "$data", publicName: "data", isSignal: true, isRequired: true, transformFunction: null }, $rows: { classPropertyName: "$rows", publicName: "rows", isSignal: true, isRequired: false, transformFunction: null }, $columnInfos: { classPropertyName: "$columnInfos", publicName: "columnInfos", isSignal: true, isRequired: true, transformFunction: null }, $dataSource: { classPropertyName: "$dataSource", publicName: "dataSource", isSignal: true, isRequired: true, transformFunction: null }, $trackBy: { classPropertyName: "$trackBy", publicName: "trackBy", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selection$: "selection" }, viewQueries: [{ propertyName: "$headerRow", first: true, predicate: MatHeaderRowDef, descendants: true, isSignal: true }, { propertyName: "$footerRow", first: true, predicate: MatFooterRowDef, descendants: true, isSignal: true }, { propertyName: "$table", first: true, predicate: MatTable, descendants: true, isSignal: true }, { propertyName: "$dropList", first: true, predicate: CdkDropList, descendants: true, isSignal: true }], ngImport: i0, template: "<mat-table\r\n #table\r\n cdkDropList\r\n cdkDropListLockAxis='x'\r\n cdkDropListOrientation=\"horizontal\"\r\n class=\"table-drag-list\"\r\n [dataSource]=\"$dataSource()\"\r\n [trackBy]=\"$trackByFunction()\"\r\n [style]=\"$tableWidth()\"\r\n (cdkDropListDropped)=\"drop($event)\"\r\n>\r\n\r\n <!-- select column -->\r\n <ng-container matColumnDef=\"select\">\r\n @let selection = $selection();\r\n <mat-header-cell *matHeaderCellDef class=\"select-column\">\r\n <mat-checkbox [checked]=\"!!($masterToggleChecked())\"\r\n [indeterminate]=\"$masterToggleIndeterminate()\"\r\n [matTooltip]=\"$selectAllMessage()\"\r\n (change)=\"$event ? masterToggle() : null\" />\r\n <button mat-icon-button class=\"open-menu-icon-button\" disableRipple [matMenuTriggerFor]=\"menu\" [matMenuTriggerRestoreFocus]=\"false\">\r\n <mat-icon class=\"menu-icon\">more_vert</mat-icon>\r\n </button>\r\n <mat-menu #menu=\"matMenu\" >\r\n <button mat-menu-item>\r\n <mat-slide-toggle [checked]=\"$hasSelectFilter()\" (change)=\"addSelectFilter($event.checked)\">\r\n Show Only Selected\r\n </mat-slide-toggle>\r\n </button>\r\n @if(this.$selection().selected.length)\r\n {\r\n <button mat-menu-item (click)=\"$selection().clear()\">\r\n Clear Selection\r\n </button>\r\n }\r\n <button mat-menu-item (click)=\"selectTop(+i.value)\">\r\n Select top \r\n <input #i class=\"input\" stop-propagation type=\"number\" \r\n placeholder=\"Set Size\"\r\n [value]=\"10\"\r\n [min]=\"1\"\r\n [max]=\"dataStore.state().sortedFilteredDataLength\" />\r\n </button>\r\n </mat-menu>\r\n </mat-header-cell>\r\n\r\n <mat-cell *matCellDef=\"let row\" class=\"select-column\">\r\n <mat-checkbox\r\n [checked]=\"selection.isSelected(row)\"\r\n (click)=\"$event.stopPropagation()\"\r\n (change)=\"$event ? selection.toggle(row) : null\"/>\r\n </mat-cell>\r\n\r\n <mat-footer-cell *matFooterCellDef class=\"select-column\">\r\n {{ selection.selected.length }}\r\n </mat-footer-cell>\r\n </ng-container>\r\n\r\n\r\n <!-- index column -->\r\n <ng-container matColumnDef=\"index\">\r\n <mat-header-cell *matHeaderCellDef class=\"f-mat-header-cell\" class=\"index-column\">#\r\n </mat-header-cell>\r\n <mat-cell *matCellDef=\"let i = index; let t\" class=\"index-column\">\r\n {{ 1 + i + $offsetIndex() }}\r\n </mat-cell>\r\n <mat-footer-cell *matFooterCellDef class=\"index-column\" />\r\n </ng-container>\r\n\r\n <!-- Grouping -->\r\n <ng-container matColumnDef=\"groupHeader\">\r\n <mat-cell *matCellDef=\"let row\">\r\n @let expanded = (state.$getIsExpanded | func : row.key : row.uniqueName );\r\n @let customTemplate = (getCustomGroupRowTemplate | func : row.key)();\r\n\r\n <!-- Default group row template -->\r\n <div [style.paddingLeft]=\"row.padding + 'px !important'\" [class]=\"'group-cell'\">\r\n @if($hasSelectColumn())\r\n {\r\n @let contains = (allOfGroupSelected | func : row.uniqueName)();\r\n <mat-checkbox [checked]=\"!!contains.containsAll\"\r\n [indeterminate]=\"!!contains.containsSome && !contains.containsAll\"\r\n [matTooltip]=\"toggleGroupMessage | func : contains.length : contains.containsAll\"\r\n (change)=\"$event ? toggleGroup(row.uniqueName, contains.containsAll) : null\" />\r\n }\r\n <button mat-icon-button (click)=\"setExpanded(row.key, row.uniqueName, !expanded());\">\r\n @if (!expanded())\r\n {\r\n <mat-icon>chevron_right</mat-icon>\r\n }\r\n @else\r\n {\r\n <mat-icon>expand_more</mat-icon>\r\n }\r\n </button>\r\n {{ row.custom ? row.groupHeaderDisplay : ((getGroupHeaderTransform | func : row.key : row.groupHeaderDisplay)() + ` (${row.length})`) }}\r\n </div>\r\n @if(customTemplate)\r\n {\r\n <ng-container *ngTemplateOutlet=\"customTemplate; context: { \r\n $implicit: row, \r\n element: row, \r\n expanded: expanded(), \r\n level: row.level, \r\n key: row.key, \r\n uniqueName: row.uniqueName, \r\n groupHeaderDisplay: row.groupHeaderDisplay, \r\n length: row.length, \r\n padding: row.padding \r\n }\" />\r\n }\r\n @else\r\n {\r\n <ng-container *ngTemplateOutlet=\"state.$props().groupHeaderTemplate!; context: { element: row }\" />\r\n }\r\n </mat-cell>\r\n </ng-container>\r\n\r\n <mat-row\r\n *matRowDef=\"let row; columns: $keys(); let i = index\"\r\n [style.height]=\"$rowHeight()\"\r\n [style.min-height]=\"$rowHeight()\"\r\n [styler]=\"$rowStyles()\"\r\n [element]=\"row\"\r\n [conditionalClasses]=\"$rowClasses()\"\r\n (click)=\"rowClicked(row, $event)\"\r\n />\r\n\r\n <!-- group row -->\r\n <mat-row *matRowDef=\"let row; columns: ['groupHeader']; when: isGroupHeader\"\r\n style=\"background-color: unset;\"\r\n [style.height]=\"state.$props().groupHeaderHeight ? state.$props().groupHeaderHeight + 'px' : $groupHeaderHeight()\"\r\n [style.min-height]=\"state.$props().groupHeaderHeight ? state.$props().groupHeaderHeight + 'px' : $groupHeaderHeight()\"/>\r\n</mat-table>\r\n\r\n<mat-header-row *matHeaderRowDef=\"$keys(); sticky: state.$props().isSticky\" [style.height]=\"$headerHeight()\"\r\n [style.min-height]=\"$headerHeight()\" [style.top.px]=\"($offset()! * -1)\"/>\r\n<mat-footer-row *matFooterRowDef=\"$keys(); sticky: false \" [style.height]=\"$footerHeight()\" [class.sticky-footer]=\"$stickyFooter()\"\r\n [style.min-height]=\"$footerHeight()\"\r\n [style.bottom.px]=\"$stickyFooter() ? ($footerOffset()) : undefined\"/>\r\n", styles: [":host{--mat-paginator-container-size: var(tb-paginator-container-size, initial)}.select-column{min-width:var(--tb-min-select-column-width, 42px)}.index-column{min-width:var(--tb-min-index-column-width, 42px)}.page-amounts{color:#0000008a;font-family:Roboto,Helvetica Neue,sans-serif;font-size:12px;margin-right:.2rem}.group-cell{display:flex;align-items:center;width:var(--tb-group-cell-width);min-width:var(--tb-group-cell-min-width);max-width:var(--tb-group-cell-max-width)}:host::ng-deep .table-drag-list.cdk-drop-list-dragging .drag-header:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}:host::ng-deep .mdc-data-table__cell,:host::ng-deep .mdc-data-table__header-cell{padding:var(--tb-cell-padding, 0 0 0 .2rem);line-height:var(--tb-cell-line-height, normal)}::ng-deep .op-date-time-input{line-height:3rem;font-size:.9rem;font-family:Roboto,Helvetica Neue,sans-serif;padding-left:.2rem;width:12rem}.sticky-footer{position:sticky;z-index:10}\n"], dependencies: [{ kind: "ngmodule", type: MatTableModule }, { kind: "component", type: i1$6.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i1$6.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i1$6.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i1$6.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i1$6.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i1$6.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i1$6.MatFooterCellDef, selector: "[matFooterCellDef]" }, { kind: "directive", type: i1$6.MatFooterRowDef, selector: "[matFooterRowDef]", inputs: ["matFooterRowDef", "matFooterRowDefSticky"] }, { kind: "directive", type: i1$6.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i1$6.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "directive", type: i1$6.MatFooterCell, selector: "mat-footer-cell, td[mat-footer-cell]" }, { kind: "component", type: i1$6.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i1$6.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "component", type: i1$6.MatFooterRow, selector: "mat-footer-row, tr[mat-footer-row]", exportAs: ["matFooterRow"] }, { kind: "ngmodule", type: DragDropModule }, { kind: "directive", type: i5.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer", "cdkDropListHasAnchor"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i1$1.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2$2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: StylerDirective, selector: "[styler]", inputs: ["element", "styler"] }, { kind: "directive", type: ConditionalClassesDirective, selector: "[conditionalClasses]", inputs: ["element", "conditionalClasses"] }, { 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: MatSlideToggle, selector: "mat-slide-toggle", inputs: ["name", "id", "labelPosition", "aria-label", "aria-labelledby", "aria-describedby", "required", "color", "disabled", "disableRipple", "tabIndex", "checked", "hideIcon", "disabledInteractive"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }, { kind: "directive", type: StopPropagationDirective, selector: "[stop-propagation]" }, { kind: "pipe", type: FunctionPipe, name: "func" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
5177
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: GenericTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5178
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.2", type: GenericTableComponent, isStandalone: true, selector: "tb-generic-table", inputs: { $displayData: { classPropertyName: "$displayData", publicName: "displayData", isSignal: true, isRequired: true, transformFunction: null }, $data: { classPropertyName: "$data", publicName: "data", isSignal: true, isRequired: true, transformFunction: null }, $rows: { classPropertyName: "$rows", publicName: "rows", isSignal: true, isRequired: false, transformFunction: null }, $columnInfos: { classPropertyName: "$columnInfos", publicName: "columnInfos", isSignal: true, isRequired: true, transformFunction: null }, $dataSource: { classPropertyName: "$dataSource", publicName: "dataSource", isSignal: true, isRequired: true, transformFunction: null }, $trackBy: { classPropertyName: "$trackBy", publicName: "trackBy", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selection$: "selection" }, viewQueries: [{ propertyName: "$headerRow", first: true, predicate: MatHeaderRowDef, descendants: true, isSignal: true }, { propertyName: "$footerRow", first: true, predicate: MatFooterRowDef, descendants: true, isSignal: true }, { propertyName: "$table", first: true, predicate: MatTable, descendants: true, isSignal: true }, { propertyName: "$dropList", first: true, predicate: CdkDropList, descendants: true, isSignal: true }], ngImport: i0, template: "<mat-table\r\n #table\r\n cdkDropList\r\n cdkDropListLockAxis='x'\r\n cdkDropListOrientation=\"horizontal\"\r\n class=\"table-drag-list\"\r\n [dataSource]=\"$dataSource()\"\r\n [trackBy]=\"$trackByFunction()\"\r\n [style]=\"$tableWidth()\"\r\n (cdkDropListDropped)=\"drop($event)\"\r\n>\r\n\r\n <!-- select column -->\r\n <ng-container matColumnDef=\"select\">\r\n @let selection = $selection();\r\n <mat-header-cell *matHeaderCellDef class=\"select-column\">\r\n <mat-checkbox [checked]=\"!!($masterToggleChecked())\"\r\n [indeterminate]=\"$masterToggleIndeterminate()\"\r\n [matTooltip]=\"$selectAllMessage()\"\r\n (change)=\"$event ? masterToggle() : null\" />\r\n <button mat-icon-button class=\"open-menu-icon-button\" disableRipple [matMenuTriggerFor]=\"menu\" [matMenuTriggerRestoreFocus]=\"false\">\r\n <mat-icon class=\"menu-icon\">more_vert</mat-icon>\r\n </button>\r\n <mat-menu #menu=\"matMenu\" >\r\n <button mat-menu-item>\r\n <mat-slide-toggle [checked]=\"$hasSelectFilter()\" (change)=\"addSelectFilter($event.checked)\">\r\n Show Only Selected\r\n </mat-slide-toggle>\r\n </button>\r\n @if(this.$selection().selected.length)\r\n {\r\n <button mat-menu-item (click)=\"$selection().clear()\">\r\n Clear Selection\r\n </button>\r\n }\r\n <button mat-menu-item (click)=\"selectTop(+i.value)\">\r\n Select top \r\n <input #i class=\"input\" stop-propagation type=\"number\" \r\n placeholder=\"Set Size\"\r\n [value]=\"10\"\r\n [min]=\"1\"\r\n [max]=\"dataStore.state().sortedFilteredDataLength\" />\r\n </button>\r\n </mat-menu>\r\n </mat-header-cell>\r\n\r\n <mat-cell *matCellDef=\"let row\" class=\"select-column\">\r\n <mat-checkbox\r\n [checked]=\"selection.isSelected(row)\"\r\n (click)=\"$event.stopPropagation()\"\r\n (change)=\"$event ? selection.toggle(row) : null\"/>\r\n </mat-cell>\r\n\r\n <mat-footer-cell *matFooterCellDef class=\"select-column\">\r\n {{ selection.selected.length }}\r\n </mat-footer-cell>\r\n </ng-container>\r\n\r\n\r\n <!-- index column -->\r\n <ng-container matColumnDef=\"index\">\r\n <mat-header-cell *matHeaderCellDef class=\"f-mat-header-cell\" class=\"index-column\">#\r\n </mat-header-cell>\r\n <mat-cell *matCellDef=\"let i = index; let t\" class=\"index-column\">\r\n {{ 1 + i + $offsetIndex() }}\r\n </mat-cell>\r\n <mat-footer-cell *matFooterCellDef class=\"index-column\" />\r\n </ng-container>\r\n\r\n <!-- Grouping -->\r\n <ng-container matColumnDef=\"groupHeader\">\r\n <mat-cell *matCellDef=\"let row\">\r\n @let expanded = (state.$getIsExpanded | func : row.key : row.uniqueName );\r\n @let customTemplate = (getCustomGroupRowTemplate | func : row.key)();\r\n\r\n <!-- Default group row template -->\r\n <div [style.paddingLeft]=\"row.padding + 'px !important'\" [class]=\"'group-cell'\">\r\n @if($hasSelectColumn())\r\n {\r\n @let contains = (allOfGroupSelected | func : row.uniqueName)();\r\n <mat-checkbox [checked]=\"!!contains.containsAll\"\r\n [indeterminate]=\"!!contains.containsSome && !contains.containsAll\"\r\n [matTooltip]=\"toggleGroupMessage | func : contains.length : contains.containsAll\"\r\n (change)=\"$event ? toggleGroup(row.uniqueName, contains.containsAll) : null\" />\r\n }\r\n <button mat-icon-button (click)=\"setExpanded(row.key, row.uniqueName, !expanded());\">\r\n @if (!expanded())\r\n {\r\n <mat-icon>chevron_right</mat-icon>\r\n }\r\n @else\r\n {\r\n <mat-icon>expand_more</mat-icon>\r\n }\r\n </button>\r\n {{ row.custom ? row.groupHeaderDisplay : ((getGroupHeaderTransform | func : row.key : row.groupHeaderDisplay)() + ` (${row.length})`) }}\r\n </div>\r\n @if(customTemplate)\r\n {\r\n <ng-container *ngTemplateOutlet=\"customTemplate; context: { \r\n $implicit: row, \r\n element: row, \r\n expanded: expanded(), \r\n level: row.level, \r\n key: row.key, \r\n uniqueName: row.uniqueName, \r\n groupHeaderDisplay: row.groupHeaderDisplay, \r\n length: row.length, \r\n padding: row.padding \r\n }\" />\r\n }\r\n @else\r\n {\r\n <ng-container *ngTemplateOutlet=\"state.$props().groupHeaderTemplate!; context: { element: row }\" />\r\n }\r\n </mat-cell>\r\n </ng-container>\r\n\r\n <mat-row\r\n *matRowDef=\"let row; columns: $keys(); let i = index\"\r\n [style.height]=\"$rowHeight()\"\r\n [style.min-height]=\"$rowHeight()\"\r\n [styler]=\"$rowStyles()\"\r\n [element]=\"row\"\r\n [conditionalClasses]=\"$rowClasses()\"\r\n (click)=\"rowClicked(row, $event)\"\r\n />\r\n\r\n <!-- group row -->\r\n <mat-row *matRowDef=\"let row; columns: ['groupHeader']; when: isGroupHeader\"\r\n style=\"background-color: unset;\"\r\n [style.height]=\"state.$props().groupHeaderHeight ? state.$props().groupHeaderHeight + 'px' : $groupHeaderHeight()\"\r\n [style.min-height]=\"state.$props().groupHeaderHeight ? state.$props().groupHeaderHeight + 'px' : $groupHeaderHeight()\"/>\r\n</mat-table>\r\n\r\n<mat-header-row *matHeaderRowDef=\"$keys(); sticky: state.$props().isSticky\" [style.height]=\"$headerHeight()\"\r\n [style.min-height]=\"$headerHeight()\" [style.top.px]=\"($offset()! * -1)\"/>\r\n<mat-footer-row *matFooterRowDef=\"$keys(); sticky: false \" [style.height]=\"$footerHeight()\" [class.sticky-footer]=\"$stickyFooter()\"\r\n [style.min-height]=\"$footerHeight()\"\r\n [style.bottom.px]=\"$stickyFooter() ? ($footerOffset()) : undefined\"/>\r\n", styles: [":host{--mat-paginator-container-size: var(tb-paginator-container-size, initial)}.select-column{min-width:var(--tb-min-select-column-width, 42px)}.index-column{min-width:var(--tb-min-index-column-width, 42px)}.page-amounts{color:#0000008a;font-family:Roboto,Helvetica Neue,sans-serif;font-size:12px;margin-right:.2rem}.group-cell{display:flex;align-items:center;width:var(--tb-group-cell-width);min-width:var(--tb-group-cell-min-width);max-width:var(--tb-group-cell-max-width)}:host::ng-deep .table-drag-list.cdk-drop-list-dragging .drag-header:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}:host::ng-deep .mdc-data-table__cell,:host::ng-deep .mdc-data-table__header-cell{padding:var(--tb-cell-padding, 0 0 0 .2rem);line-height:var(--tb-cell-line-height, normal)}::ng-deep .op-date-time-input{line-height:3rem;font-size:.9rem;font-family:Roboto,Helvetica Neue,sans-serif;padding-left:.2rem;width:12rem}.sticky-footer{position:sticky;z-index:10}\n"], dependencies: [{ kind: "ngmodule", type: MatTableModule }, { kind: "component", type: i1$6.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i1$6.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i1$6.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i1$6.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i1$6.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i1$6.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i1$6.MatFooterCellDef, selector: "[matFooterCellDef]" }, { kind: "directive", type: i1$6.MatFooterRowDef, selector: "[matFooterRowDef]", inputs: ["matFooterRowDef", "matFooterRowDefSticky"] }, { kind: "directive", type: i1$6.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i1$6.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "directive", type: i1$6.MatFooterCell, selector: "mat-footer-cell, td[mat-footer-cell]" }, { kind: "component", type: i1$6.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i1$6.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "component", type: i1$6.MatFooterRow, selector: "mat-footer-row, tr[mat-footer-row]", exportAs: ["matFooterRow"] }, { kind: "ngmodule", type: DragDropModule }, { kind: "directive", type: i5.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer", "cdkDropListHasAnchor"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i1$1.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2$2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: StylerDirective, selector: "[styler]", inputs: ["element", "styler"] }, { kind: "directive", type: ConditionalClassesDirective, selector: "[conditionalClasses]", inputs: ["element", "conditionalClasses"] }, { 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: MatSlideToggle, selector: "mat-slide-toggle", inputs: ["name", "id", "labelPosition", "aria-label", "aria-labelledby", "aria-describedby", "required", "color", "disabled", "disableRipple", "tabIndex", "checked", "hideIcon", "disabledInteractive"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }, { kind: "directive", type: StopPropagationDirective, selector: "[stop-propagation]" }, { kind: "pipe", type: FunctionPipe, name: "func" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
5196
5179
|
}
|
|
5197
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
5180
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: GenericTableComponent, decorators: [{
|
|
5198
5181
|
type: Component,
|
|
5199
5182
|
args: [{ selector: 'tb-generic-table', changeDetection: ChangeDetectionStrategy.OnPush, imports: [
|
|
5200
5183
|
MatTableModule, DragDropModule, MatCheckboxModule, MatButtonModule, MatIconModule, NgTemplateOutlet,
|
|
@@ -5226,7 +5209,7 @@ class ExportToCsvService {
|
|
|
5226
5209
|
|| {};
|
|
5227
5210
|
const tableSettings = (this.state.$notPersistedTableSettings()?.exportSettings || {});
|
|
5228
5211
|
return merge$1({}, globalSettings, tableSettings);
|
|
5229
|
-
}, ...(ngDevMode ?
|
|
5212
|
+
}, { ...(ngDevMode ? { debugName: "$exportSettings" } : {}) });
|
|
5230
5213
|
this.exportToCsv = (data) => {
|
|
5231
5214
|
const hiddenKeys = this.state.selectSignal(s => s.hiddenKeys)();
|
|
5232
5215
|
const meta = this.state.$metaDataArray().filter(md => !md.noExport && !hiddenKeys.includes(md.key));
|
|
@@ -5322,10 +5305,10 @@ class ExportToCsvService {
|
|
|
5322
5305
|
}
|
|
5323
5306
|
return this.datePipe.transform(val, dateFormat);
|
|
5324
5307
|
}
|
|
5325
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
5326
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.
|
|
5308
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: ExportToCsvService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
5309
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: ExportToCsvService }); }
|
|
5327
5310
|
}
|
|
5328
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
5311
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: ExportToCsvService, decorators: [{
|
|
5329
5312
|
type: Injectable
|
|
5330
5313
|
}] });
|
|
5331
5314
|
|
|
@@ -5540,10 +5523,10 @@ class TableBuilderStateStore extends ComponentStore {
|
|
|
5540
5523
|
this.deleteLocalProfilesState({ key, stateKey });
|
|
5541
5524
|
};
|
|
5542
5525
|
}
|
|
5543
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
5544
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.
|
|
5526
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: TableBuilderStateStore, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
5527
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: TableBuilderStateStore, providedIn: 'root' }); }
|
|
5545
5528
|
}
|
|
5546
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
5529
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: TableBuilderStateStore, decorators: [{
|
|
5547
5530
|
type: Injectable,
|
|
5548
5531
|
args: [{ providedIn: 'root' }]
|
|
5549
5532
|
}], ctorParameters: () => [] });
|
|
@@ -5763,13 +5746,13 @@ class PaginatorComponent {
|
|
|
5763
5746
|
constructor() {
|
|
5764
5747
|
this.state = inject(TableStore);
|
|
5765
5748
|
this.data = inject(DataStore);
|
|
5766
|
-
this.$paginator = viewChild(MatPaginator, ...(ngDevMode ?
|
|
5749
|
+
this.$paginator = viewChild(MatPaginator, { ...(ngDevMode ? { debugName: "$paginator" } : {}) });
|
|
5767
5750
|
this.$dataLength = this.data.selectSignal(d => d.sortedFilteredDataLength);
|
|
5768
5751
|
this.$viewableDataLength = this.data.selectSignal(d => d.sortedFilteredGroupedDataLength);
|
|
5769
5752
|
this.pageEvent$ = toObservable(this.$paginator).pipe(notNull(), switchMap(p => p.page));
|
|
5770
5753
|
this.$pageEvent = toSignal(this.pageEvent$);
|
|
5771
|
-
this.$pageIndexChangeEvent = computed(() => this.$pageEvent()?.pageIndex, ...(ngDevMode ?
|
|
5772
|
-
this.$pageSizeChangeEvent = computed(() => this.$pageEvent()?.pageSize, ...(ngDevMode ?
|
|
5754
|
+
this.$pageIndexChangeEvent = computed(() => this.$pageEvent()?.pageIndex, { ...(ngDevMode ? { debugName: "$pageIndexChangeEvent" } : {}) });
|
|
5755
|
+
this.$pageSizeChangeEvent = computed(() => this.$pageEvent()?.pageSize, { ...(ngDevMode ? { debugName: "$pageSizeChangeEvent" } : {}) });
|
|
5773
5756
|
this.$currentPageData = computed(() => {
|
|
5774
5757
|
const pageEvent = this.$pageEvent();
|
|
5775
5758
|
if (!pageEvent)
|
|
@@ -5782,20 +5765,20 @@ class PaginatorComponent {
|
|
|
5782
5765
|
const pageDetails = mapPaginationEventToCurrentPageDetails(pageEvent);
|
|
5783
5766
|
const dataLength = this.$dataLength();
|
|
5784
5767
|
return ({ ...pageDetails, total: dataLength });
|
|
5785
|
-
}, ...(ngDevMode ?
|
|
5768
|
+
}, { ...(ngDevMode ? { debugName: "$currentPageData" } : {}) });
|
|
5786
5769
|
this.#onPageIndexEffect = effect(() => {
|
|
5787
5770
|
const index = this.$pageIndexChangeEvent();
|
|
5788
5771
|
if (index === undefined)
|
|
5789
5772
|
return;
|
|
5790
5773
|
untracked(() => this.state.setCurrentPage(index));
|
|
5791
|
-
}, ...(ngDevMode ?
|
|
5774
|
+
}, { ...(ngDevMode ? { debugName: "#onPageIndexEffect" } : {}) });
|
|
5792
5775
|
this.#onPageSizeEffect = effect(() => {
|
|
5793
5776
|
const size = this.$pageSizeChangeEvent();
|
|
5794
5777
|
const initialized = this.state.$initializationState() >= InitializationState.Ready;
|
|
5795
5778
|
if (!size || !initialized)
|
|
5796
5779
|
return;
|
|
5797
5780
|
untracked(() => this.state.setUserDefinedPageSize(size));
|
|
5798
|
-
}, ...(ngDevMode ?
|
|
5781
|
+
}, { ...(ngDevMode ? { debugName: "#onPageSizeEffect" } : {}) });
|
|
5799
5782
|
this.#onMetaPageSizeEffect = effect(() => {
|
|
5800
5783
|
const paginator = this.$paginator();
|
|
5801
5784
|
if (!paginator)
|
|
@@ -5803,7 +5786,7 @@ class PaginatorComponent {
|
|
|
5803
5786
|
const metaPageSize = this.state.$pageSize();
|
|
5804
5787
|
const initialized = this.state.$initializationState() >= InitializationState.Ready;
|
|
5805
5788
|
untracked(() => initialized && paginator._changePageSize(metaPageSize));
|
|
5806
|
-
}, ...(ngDevMode ?
|
|
5789
|
+
}, { ...(ngDevMode ? { debugName: "#onMetaPageSizeEffect" } : {}) });
|
|
5807
5790
|
this.onDataLengthEffect = effect(() => {
|
|
5808
5791
|
const paginator = this.$paginator();
|
|
5809
5792
|
const dataLength = this.$viewableDataLength();
|
|
@@ -5817,8 +5800,8 @@ class PaginatorComponent {
|
|
|
5817
5800
|
}
|
|
5818
5801
|
}
|
|
5819
5802
|
});
|
|
5820
|
-
}, ...(ngDevMode ?
|
|
5821
|
-
this.$collapseFooter = computed(() => this.state.selectSignal(state => state.persistedTableSettings.collapseFooter)(), ...(ngDevMode ?
|
|
5803
|
+
}, { ...(ngDevMode ? { debugName: "onDataLengthEffect" } : {}) });
|
|
5804
|
+
this.$collapseFooter = computed(() => this.state.selectSignal(state => state.persistedTableSettings.collapseFooter)(), { ...(ngDevMode ? { debugName: "$collapseFooter" } : {}) });
|
|
5822
5805
|
this.$showAllOption = this.state.selectSignal(s => s.notPersistedTableSettings?.paginatorSettings?.includeAllInOptions);
|
|
5823
5806
|
this.$showAll = this.state.$showAll;
|
|
5824
5807
|
}
|
|
@@ -5832,8 +5815,8 @@ class PaginatorComponent {
|
|
|
5832
5815
|
this.state.toggleCollapseFooter({ collapseFooter: true });
|
|
5833
5816
|
}
|
|
5834
5817
|
}
|
|
5835
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
5836
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.
|
|
5818
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: PaginatorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5819
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.2", type: PaginatorComponent, isStandalone: true, selector: "tb-paginator", viewQueries: [{ propertyName: "$paginator", first: true, predicate: MatPaginator, descendants: true, isSignal: true }], ngImport: i0, template: `
|
|
5837
5820
|
<div class="paginator-row">
|
|
5838
5821
|
@if($currentPageData(); as pageData)
|
|
5839
5822
|
{
|
|
@@ -5862,7 +5845,7 @@ class PaginatorComponent {
|
|
|
5862
5845
|
</div>
|
|
5863
5846
|
`, isInline: true, styles: [":host{--mat-paginator-container-size: var(tb-paginator-container-size, initial)}.select-column{min-width:var(--tb-min-select-column-width, 42px)}.index-column{min-width:var(--tb-min-index-column-width, 42px)}.page-amounts{color:#0000008a;font-family:Roboto,Helvetica Neue,sans-serif;font-size:12px;margin-right:.2rem}.group-cell{display:flex;align-items:center;width:var(--tb-group-cell-width);min-width:var(--tb-group-cell-min-width);max-width:var(--tb-group-cell-max-width)}:host::ng-deep .table-drag-list.cdk-drop-list-dragging .drag-header:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}:host::ng-deep .mdc-data-table__cell,:host::ng-deep .mdc-data-table__header-cell{padding:var(--tb-cell-padding, 0 0 0 .2rem);line-height:var(--tb-cell-line-height, normal)}::ng-deep .op-date-time-input{line-height:3rem;font-size:.9rem;font-family:Roboto,Helvetica Neue,sans-serif;padding-left:.2rem;width:12rem}.sticky-footer{position:sticky;z-index:10}\n", ".collapse-icon{font-size:16px;height:16px;color:#3f51b5;align-self:flex-start}.collapse-icon:hover{cursor:pointer}.hide{display:none}.paginator-row{display:flex;align-items:center}\n"], dependencies: [{ kind: "ngmodule", type: MatPaginatorModule }, { kind: "component", type: i1$7.MatPaginator, selector: "mat-paginator", inputs: ["color", "pageIndex", "length", "pageSize", "pageSizeOptions", "hidePageSize", "showFirstLastButtons", "selectConfig", "disabled"], outputs: ["page"], exportAs: ["matPaginator"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
5864
5847
|
}
|
|
5865
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
5848
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: PaginatorComponent, decorators: [{
|
|
5866
5849
|
type: Component,
|
|
5867
5850
|
args: [{ selector: 'tb-paginator', imports: [MatPaginatorModule, MatButtonModule], template: `
|
|
5868
5851
|
<div class="paginator-row">
|
|
@@ -5908,19 +5891,17 @@ class TableBuilderDataSource extends MatTableDataSource {
|
|
|
5908
5891
|
}
|
|
5909
5892
|
constructor(state, data) {
|
|
5910
5893
|
super([]);
|
|
5911
|
-
this.#$dataSrc = signal([], ...(ngDevMode ?
|
|
5912
|
-
this.$dataSize = signal({ start: 0, end: 0 }, ...(ngDevMode ?
|
|
5913
|
-
equal: (a, b) => a.start === b.start && a.end === b.end
|
|
5914
|
-
}]));
|
|
5894
|
+
this.#$dataSrc = signal([], { ...(ngDevMode ? { debugName: "#$dataSrc" } : {}) });
|
|
5895
|
+
this.$dataSize = signal({ start: 0, end: 0 }, { ...(ngDevMode ? { debugName: "$dataSize" } : {}), equal: (a, b) => a.start === b.start && a.end === b.end });
|
|
5915
5896
|
this._ = effect(() => {
|
|
5916
5897
|
const data = this.#$dataSrc();
|
|
5917
5898
|
const dataSize = this.$dataSize();
|
|
5918
5899
|
untracked(() => this.data = data.slice(dataSize.start, dataSize.end));
|
|
5919
|
-
}, ...(ngDevMode ?
|
|
5900
|
+
}, { ...(ngDevMode ? { debugName: "_" } : {}) });
|
|
5920
5901
|
const $currentPage = state.$currentPage;
|
|
5921
5902
|
const $pageSize = state.$pageSize;
|
|
5922
5903
|
const $virtualEnds = data.selectSignal(d => d.virtualEnds);
|
|
5923
|
-
const $dataLength = computed(() => this.#$dataSrc().length, ...(ngDevMode ?
|
|
5904
|
+
const $dataLength = computed(() => this.#$dataSrc().length, { ...(ngDevMode ? { debugName: "$dataLength" } : {}) });
|
|
5924
5905
|
this.$dataSize = computed(() => {
|
|
5925
5906
|
const viewType = state.$viewType();
|
|
5926
5907
|
const dataLength = $dataLength();
|
|
@@ -5938,7 +5919,7 @@ class TableBuilderDataSource extends MatTableDataSource {
|
|
|
5938
5919
|
return ({ start: 0, end: dataLength });
|
|
5939
5920
|
}
|
|
5940
5921
|
return ({ start: virtualEnds.start, end: virtualEnds.end });
|
|
5941
|
-
}, ...(ngDevMode ?
|
|
5922
|
+
}, { ...(ngDevMode ? { debugName: "$dataSize" } : {}) });
|
|
5942
5923
|
}
|
|
5943
5924
|
connect() {
|
|
5944
5925
|
return super.connect();
|
|
@@ -5981,12 +5962,12 @@ class GroupByListComponent {
|
|
|
5981
5962
|
name: dict[gbk.key].displayName || gbk.key,
|
|
5982
5963
|
sort: this.tableStore.getGroupBySortDirection(gbk.key)(),
|
|
5983
5964
|
}));
|
|
5984
|
-
}, ...(ngDevMode ?
|
|
5965
|
+
}, { ...(ngDevMode ? { debugName: "$groups" } : {}) });
|
|
5985
5966
|
}
|
|
5986
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
5987
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.
|
|
5967
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: GroupByListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5968
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.2", type: GroupByListComponent, isStandalone: true, selector: "group-by-list", ngImport: i0, template: "<span class=\"tb-group-label\">Group By:</span>\r\n<mat-chip-set>\r\n @for (groupBy of $groups(); track groupBy.key)\r\n {\r\n @if($index > 0)\r\n {\r\n <mat-icon class=\"nested-arrow\">arrow_right</mat-icon>\r\n }\r\n <mat-chip (removed)=\"tableStore.removeGroupByKey(groupBy.key)\">\r\n <span class=\"chip-c\">\r\n {{groupBy.name | spaceCase}}\r\n <mat-icon stop-propagation class=\"sort-icon\" (click)=\"tableStore.cycleGroupBySortDirection(groupBy.key)\">\r\n @if (groupBy.sort === 'asc'){ arrow_upward }\r\n @else if (groupBy.sort === 'desc') { arrow_downward } \r\n @else { swap_vert }\r\n </mat-icon>\r\n </span>\r\n <mat-icon matChipRemove>cancel</mat-icon>\r\n </mat-chip>\r\n }\r\n</mat-chip-set>\r\n", styles: [".tb-group-label{font-weight:bolder;padding-right:15px}:host{display:flex;padding-left:8px;align-items:center}:host mat-chip-set mat-chip{margin:0}:host mat-chip-set .nested-arrow{display:flex;width:15px;justify-content:center}.chip-c{display:flex;align-items:center}.sort-icon{cursor:pointer}\n"], dependencies: [{ kind: "ngmodule", type: MatChipsModule }, { kind: "component", type: i4$1.MatChip, selector: "mat-basic-chip, [mat-basic-chip], mat-chip, [mat-chip]", inputs: ["role", "id", "aria-label", "aria-description", "value", "color", "removable", "highlighted", "disableRipple", "disabled"], outputs: ["removed", "destroyed"], exportAs: ["matChip"] }, { kind: "directive", type: i4$1.MatChipRemove, selector: "[matChipRemove]" }, { kind: "component", type: i4$1.MatChipSet, selector: "mat-chip-set", inputs: ["disabled", "role", "tabIndex"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2$2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: StopPropagationDirective, selector: "[stop-propagation]" }, { kind: "pipe", type: SpaceCasePipe, name: "spaceCase" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
5988
5969
|
}
|
|
5989
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
5970
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: GroupByListComponent, decorators: [{
|
|
5990
5971
|
type: Component,
|
|
5991
5972
|
args: [{ selector: 'group-by-list', changeDetection: ChangeDetectionStrategy.OnPush, imports: [
|
|
5992
5973
|
MatChipsModule, MatIconModule, SpaceCasePipe, StopPropagationDirective
|
|
@@ -5997,15 +5978,15 @@ class ProfilesMenuComponent {
|
|
|
5997
5978
|
constructor() {
|
|
5998
5979
|
this.stateService = inject(TableBuilderStateStore);
|
|
5999
5980
|
this.tableStore = inject(TableStore);
|
|
6000
|
-
this.$tableId = input.required(...(ngDevMode ?
|
|
6001
|
-
this.$isMatMenuChild = input(false, ...(ngDevMode ?
|
|
6002
|
-
this.trigger = viewChild('trigger', ...(ngDevMode ?
|
|
5981
|
+
this.$tableId = input.required({ ...(ngDevMode ? { debugName: "$tableId" } : {}), alias: 'tableId' });
|
|
5982
|
+
this.$isMatMenuChild = input(false, { ...(ngDevMode ? { debugName: "$isMatMenuChild" } : {}), alias: 'isMatMenuChild' });
|
|
5983
|
+
this.trigger = viewChild('trigger', { ...(ngDevMode ? { debugName: "trigger" } : {}) });
|
|
6003
5984
|
this.menu = viewChild.required(MatMenu);
|
|
6004
|
-
this.allProfilesPanelOpened = signal(false, ...(ngDevMode ?
|
|
6005
|
-
this.newProfilePanelOpened = signal(false, ...(ngDevMode ?
|
|
6006
|
-
this.$currentProfile = computed(() => this.stateService.$selectLocalProfileCurrentKey(this.$tableId())(), ...(ngDevMode ?
|
|
6007
|
-
this.$defaultProfile = computed(() => this.stateService.$selectLocalProfileDefaultKey(this.$tableId())(), ...(ngDevMode ?
|
|
6008
|
-
this.$keys = computed(() => this.stateService.$selectLocalProfileKeys(this.$tableId())(), ...(ngDevMode ?
|
|
5985
|
+
this.allProfilesPanelOpened = signal(false, { ...(ngDevMode ? { debugName: "allProfilesPanelOpened" } : {}) });
|
|
5986
|
+
this.newProfilePanelOpened = signal(false, { ...(ngDevMode ? { debugName: "newProfilePanelOpened" } : {}) });
|
|
5987
|
+
this.$currentProfile = computed(() => this.stateService.$selectLocalProfileCurrentKey(this.$tableId())(), { ...(ngDevMode ? { debugName: "$currentProfile" } : {}) });
|
|
5988
|
+
this.$defaultProfile = computed(() => this.stateService.$selectLocalProfileDefaultKey(this.$tableId())(), { ...(ngDevMode ? { debugName: "$defaultProfile" } : {}) });
|
|
5989
|
+
this.$keys = computed(() => this.stateService.$selectLocalProfileKeys(this.$tableId())(), { ...(ngDevMode ? { debugName: "$keys" } : {}) });
|
|
6009
5990
|
this.defaultName = 'My Profile';
|
|
6010
5991
|
this.position$ = new Subject();
|
|
6011
5992
|
this.setPosition = (e) => {
|
|
@@ -6033,10 +6014,10 @@ class ProfilesMenuComponent {
|
|
|
6033
6014
|
unsetDefault() {
|
|
6034
6015
|
this.stateService.unsetDefaultFromLocalAndStorage(this.$tableId());
|
|
6035
6016
|
}
|
|
6036
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
6037
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.
|
|
6017
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: ProfilesMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
6018
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.2", type: ProfilesMenuComponent, isStandalone: true, selector: "tb-profiles-menu", inputs: { $tableId: { classPropertyName: "$tableId", publicName: "tableId", isSignal: true, isRequired: true, transformFunction: null }, $isMatMenuChild: { classPropertyName: "$isMatMenuChild", publicName: "isMatMenuChild", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "trigger", first: true, predicate: ["trigger"], descendants: true, isSignal: true }, { propertyName: "menu", first: true, predicate: MatMenu, descendants: true, isSignal: true }], ngImport: i0, template: "@if(!$isMatMenuChild())\r\n{\r\n <button #trigger=\"matMenuTrigger\" color=\"primary\" mat-icon-button [matMenuTriggerFor]=\"menu\" [matTooltip]=\"'Profiles'\">\r\n <mat-icon color=\"primary\">people</mat-icon>\r\n </button>\r\n}\r\n<mat-menu #menu=\"matMenu\" (closed)=\"addedKey.value = null; allProfilesPanelOpened.set(false); newProfilePanelOpened.set(false)\">\r\n @if(!!$currentProfile())\r\n {\r\n <div mat-menu-item mat-stroked-button [matTooltip]=\"'Save Profile'\" (click)=\"saveState($currentProfile()!)\">\r\n <mat-icon color=\"primary\">save</mat-icon>\r\n <span>{{$currentProfile()}}</span>\r\n </div>\r\n }\r\n @else\r\n {\r\n <div class=\"profile-line\">\r\n <button color=\"primary\" class=\"first-in-line first-button\" mat-stroked-button (click)=\"addState(defaultName, m.checked);\">\r\n <mat-icon class=\"save-for-default-icon button-save-icon\" color=\"primary\">save</mat-icon>\r\n <span>Save as <span class=\"current-name\">{{defaultName}}</span> </span>\r\n </button>\r\n <button stop-propagation mat-icon-button [matTooltip]=\"'Toggle Profile Being Created As Default'\" (click)=\"m.toggle()\" >\r\n <mat-icon style=\"color: green;\">{{m.checked ? 'star' : 'star_border'}}</mat-icon>\r\n </button>\r\n <mat-checkbox #m class=\"display-none\" [checked]=\"true\" />\r\n </div>\r\n }\r\n @if (allProfilesPanelOpened()) {<hr class=\"divider\"/>}\r\n <div mat-menu-item stop-propagation [class]=\"{ hide: !$keys().length, 'all-profile-row': true }\" (click)=\"allProfilesPanelOpened.set(!allProfilesPanelOpened())\">\r\n <div class=\"all-profiles\">\r\n <span>All Profiles</span>\r\n <span class=\"arrow\" [class]=\"`${(allProfilesPanelOpened() ? 'all-profile-arrow-close' : 'all-profile-arrow-open')} all-profile-arrow`\"></span>\r\n </div>\r\n </div>\r\n <div [class]=\"{ hide: !allProfilesPanelOpened(), panel: true }\">\r\n @for (key of $keys() ; track key)\r\n {\r\n <div class=\"profile-line\" [class]=\"key === $currentProfile() ? 'current-in-list' : 'not-current-in-list'\">\r\n <button class=\"menu-item first-in-line\" mat-stroked-button [matTooltip]=\"'Select Profile'\" (click)='stateService.setLocalCurrentState({ tableId: $tableId(), currentStateKey: key})'>\r\n <span>{{key}}</span>\r\n </button>\r\n @if(key !== $defaultProfile())\r\n {\r\n <button stop-propagation mat-icon-button [matTooltip]=\"'Toggle Profile Being Default'\" (click)=\"setDefault(key)\">\r\n <mat-icon style=\"color: green;\">star_border</mat-icon>\r\n </button>\r\n }\r\n @else\r\n {\r\n <button stop-propagation mat-icon-button [matTooltip]=\"'Toggle Profile Being Default'\" (click)=\"unsetDefault()\">\r\n <mat-icon style=\"color: green;\">star</mat-icon>\r\n </button>\r\n }\r\n <button color=\"warn\" class=\"last-in-line\" stop-propagation mat-icon-button [matTooltip]=\"'Delete Profile'\" (click)='stateService.deleteProfileFromLocalAndStorage($tableId(), key)'>\r\n <mat-icon color='warn'>delete_forever</mat-icon>\r\n </button>\r\n </div>\r\n }\r\n <hr class=\"divider\"/>\r\n </div>\r\n <div class=\"add-new-profile-row\" mat-menu-item stop-propagation (click)=\"newProfilePanelOpened.set(!newProfilePanelOpened()); addedKey.focus()\">Add New Profile</div>\r\n <div [class]=\"{ hide: !newProfilePanelOpened(), panel: true }\" >\r\n <div class=\"profile-line\" stop-propagation>\r\n <div class=\"new-name-input\">\r\n <i class=\"input-hint\">Enter New Name</i>\r\n <input #addedKey=\"matInput\" matInput [name]=\"'key'\" />\r\n </div>\r\n <button stop-propagation mat-icon-button [matTooltip]=\"'Toggle Profile Being Created As Default'\" (click)=\"m2.toggle()\" >\r\n <mat-icon style=\"color: green;\">{{m2.checked ? 'star' : 'star_border'}}</mat-icon>\r\n </button>\r\n <mat-checkbox #m2 class=\"display-none\" [ngModel]=\"!$defaultProfile()\" />\r\n </div>\r\n <button class=\"add-button\" color=\"primary\" mat-raised-button [matTooltip]=\"'Create New Profile'\" [disabled]=\"!addedKey.value\" (click)=\"addState(addedKey.value, m2.checked); addedKey.value = null\">\r\n Add\r\n </button>\r\n </div>\r\n</mat-menu>\r\n", styles: [":host ::ng-deep .mat-expansion-panel-header{padding:0}.current-name{color:var(tb-current-profile, blue)}.menu-item{display:inline-flex;width:initial;flex-grow:1}.profile-line{display:flex;justify-content:space-between;align-items:center}.first-in-line{--f-b: 2rem;margin-left:var(--mat-menu-item-with-icon-leading-spacing)}.first-in-line.first-button{height:var(--f-b);margin:.2rem}.first-in-line .button-save-icon{height:var(--f-b);width:var(--f-b);font-size:var(--f-b)}.main-save-button{height:4rem;width:4rem;padding:.5rem}.main-save-button mat-icon{height:3rem;width:3rem;font-size:3rem}.save-for-default-icon{margin:0}.display-none{display:none}.last-in-line{padding-right:var(--mat-menu-item-with-icon-trailing-spacing)}.default-cursor{cursor:default}.as-def{padding-left:var(--mat-menu-item-with-icon-leading-spacing)}.divider{margin:.2px 0}.add-key{max-width:8.5rem;margin-left:2px}.add-key ::ng-deep .mdc-text-field{padding:0}.panel{transition:height .1s}.hide{height:0;min-height:0;overflow:hidden}.open-panel-button{width:100%;height:2.5rem}.current-in-list{border-left:3px solid blue;background-color:#0000ff0d}.not-current-in-list{border-left:3px solid rgba(255,255,255,0)}.add-new-profile-row,.all-profile-row{border-top:rgba(128,128,128,.25) solid 1px}.all-profiles{display:flex;justify-content:space-between}.all-profiles:has(.all-profile-arrow-close){align-items:center}.all-profile-arrow{display:inline-block;height:.7rem;width:.7rem;border-color:#000;transform:rotate(-45deg)}.all-profile-arrow-open{border-left:solid 2px;border-bottom:solid 2px}.all-profile-arrow-close{border-right:solid 2px;border-top:solid 2px}.new-name-input{margin-left:3px;display:flex;flex-direction:column}.new-name-input .input-hint{font-size:smaller;font-weight:200;color:gray}.add-button{height:20px;line-height:20px;margin:3px 0 0 3px}\n"], dependencies: [{ kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { 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: MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "directive", type: MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "component", type: MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "directive", type: StopPropagationDirective, selector: "[stop-propagation]" }, { kind: "ngmodule", type: MatInputModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
6038
6019
|
}
|
|
6039
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
6020
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: ProfilesMenuComponent, decorators: [{
|
|
6040
6021
|
type: Component,
|
|
6041
6022
|
args: [{ selector: 'tb-profiles-menu', imports: [MatIcon, MatTooltip, MatIconButton, MatMenuModule, MatButton, MatInput,
|
|
6042
6023
|
MatCheckbox, StopPropagationDirective, MatInputModule, FormsModule
|
|
@@ -6053,7 +6034,7 @@ class SortMenuComponentStore extends ComponentStore {
|
|
|
6053
6034
|
return;
|
|
6054
6035
|
this.tableState.$selectSorted();
|
|
6055
6036
|
untracked(() => this.setStateFromTableStore());
|
|
6056
|
-
}, ...(ngDevMode ?
|
|
6037
|
+
}, { ...(ngDevMode ? { debugName: "setStoreStateEffect" } : {}) });
|
|
6057
6038
|
this.setStateFromTableStore = () => {
|
|
6058
6039
|
const metaData = this.tableState.$metaData();
|
|
6059
6040
|
const sorted = [...this.tableState.$selectSorted()].map(s => ({
|
|
@@ -6079,10 +6060,10 @@ class SortMenuComponentStore extends ComponentStore {
|
|
|
6079
6060
|
this.setStateFromTableStore();
|
|
6080
6061
|
};
|
|
6081
6062
|
}
|
|
6082
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
6083
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.
|
|
6063
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: SortMenuComponentStore, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
6064
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: SortMenuComponentStore }); }
|
|
6084
6065
|
}
|
|
6085
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
6066
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: SortMenuComponentStore, decorators: [{
|
|
6086
6067
|
type: Injectable
|
|
6087
6068
|
}], ctorParameters: () => [] });
|
|
6088
6069
|
|
|
@@ -6091,9 +6072,9 @@ class SortMenuComponent {
|
|
|
6091
6072
|
this.SortDirection = SortDirection;
|
|
6092
6073
|
this.tableState = inject(TableStore);
|
|
6093
6074
|
this.store = inject(SortMenuComponentStore);
|
|
6094
|
-
this.$sorted = computed(() => [...this.store.$sorted()], ...(ngDevMode ?
|
|
6095
|
-
this.$notSorted = computed(() => [...this.store.$notSorted()], ...(ngDevMode ?
|
|
6096
|
-
this.$dirty = signal(false, ...(ngDevMode ?
|
|
6075
|
+
this.$sorted = computed(() => [...this.store.$sorted()], { ...(ngDevMode ? { debugName: "$sorted" } : {}) });
|
|
6076
|
+
this.$notSorted = computed(() => [...this.store.$notSorted()], { ...(ngDevMode ? { debugName: "$notSorted" } : {}) });
|
|
6077
|
+
this.$dirty = signal(false, { ...(ngDevMode ? { debugName: "$dirty" } : {}) });
|
|
6097
6078
|
this.apply = () => {
|
|
6098
6079
|
this.$dirty.set(false);
|
|
6099
6080
|
this.tableState.setAllSort(this.store.$sorted());
|
|
@@ -6136,10 +6117,10 @@ class SortMenuComponent {
|
|
|
6136
6117
|
this.$dirty.set(true);
|
|
6137
6118
|
this.store.setDirection(sort);
|
|
6138
6119
|
}
|
|
6139
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
6140
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.
|
|
6120
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: SortMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
6121
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.2", type: SortMenuComponent, isStandalone: true, selector: "tb-sort-menu", providers: [SortMenuComponentStore], ngImport: i0, template: "@let dirty = $dirty();\r\n@let sorted = $sorted();\r\n@let notSorted = $notSorted();\r\n\r\n<!-- Menu Trigger -->\r\n<span matTooltip=\"Sort\">\r\n <button color=\"primary\" mat-icon-button [matMenuTriggerFor]=\"menu\">\r\n <mat-icon color=\"primary\">swap_vert</mat-icon>\r\n </button>\r\n</span>\r\n\r\n<!-- Menu -->\r\n<mat-menu #menu=\"matMenu\" class=\"my-mat-menu\" (closed)=\"reset()\">\r\n <div mat-menu-item class=\"menu-button\">\r\n <div class=\"close-button-wrapper\">\r\n <span matTooltip=\"Close\">\r\n <mat-icon>close</mat-icon>\r\n </span>\r\n @if(dirty)\r\n {\r\n <span matTooltip=\"Undo\" stop-propagation (click)=\"reset()\">\r\n <mat-icon>undo</mat-icon>\r\n </span>\r\n }\r\n \r\n </div>\r\n </div>\r\n\r\n <!-- Apply Button -->\r\n <div class=\"apply-button-wrapper\">\r\n <button mat-button color=\"primary\" stop-propagation\r\n [class.apply-border]=\"dirty\" [disabled]=\"!dirty\"\r\n (click)=\"apply()\">\r\n Apply @if (dirty) { Unsaved Changes }\r\n </button>\r\n </div>\r\n\r\n <!-- Default Sorting Text -->\r\n @if (!sorted.length)\r\n {\r\n <div class=\"tip\" >\r\n Sorting List\r\n </div>\r\n }\r\n\r\n <!-- Sorted Menu List -->\r\n <div #sortedGroup=\"cdkDropList\"\r\n class=\"list\"\r\n cdkDropList\r\n [cdkDropListConnectedTo]=\"[notSortedGroup]\"\r\n [cdkDropListData]=\"sorted\"\r\n (cdkDropListDropped)=\"dropIntoSorted($event)\">\r\n\r\n <!-- Menu Item Wrapper -->\r\n @for (sort of sorted; track sort.active)\r\n {\r\n <!-- Menu Item Headers -->\r\n @if (sorted.length > 1)\r\n {\r\n <span class=\"description sort-header\">{{$index === 0 ? 'First By' : 'Then By'}}</span>\r\n }\r\n\r\n <!-- Menu Item -->\r\n <div mat-menu-item cdkDrag class=\"menu-item\">\r\n <div class=\"sort-item\">\r\n <span class=\"sorted-name\">\r\n {{sort.displayName || (sort.active | spaceCase)}}\r\n <span class=\"direction-text\">{{sort.direction}}</span>\r\n </span>\r\n\r\n <!-- Sort Direction Buttons -->\r\n <div class=\"up-down-buttons-wrapper\">\r\n <button class=\"up-down-button up-button\" stop-propagation\r\n (click)=\"setDirection({active:sort.active,direction:SortDirection.asc,displayName:sort.displayName})\">\r\n <mat-icon class=\"up-down-icon\" [class]=\"sort.direction !== SortDirection.asc ? 'light-arrow' : 'dark-arrow'\">\r\n arrow_upward\r\n </mat-icon>\r\n </button>\r\n\r\n <button class=\"up-down-button\" stop-propagation\r\n (click)=\"setDirection({active:sort.active,direction:SortDirection.desc,displayName:sort.displayName})\">\r\n <mat-icon class=\"up-down-icon\" [class]=\"sort.direction === SortDirection.asc ? 'light-arrow' : 'dark-arrow'\">\r\n arrow_downward\r\n </mat-icon>\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n }\r\n\r\n </div>\r\n\r\n <!-- Default Not Sorted Text -->\r\n @if(!notSorted.length)\r\n {\r\n <div class=\"tip\" >\r\n Not Sorted List\r\n </div>\r\n }\r\n\r\n <!-- Not Sorted Menu List -->\r\n <div #notSortedGroup=\"cdkDropList\"\r\n class=\"list\"\r\n cdkDropList\r\n [cdkDropListConnectedTo]=\"[sortedGroup]\"\r\n [cdkDropListData]=\"notSorted\"\r\n (cdkDropListDropped)=\"dropIntoNotSorted($event)\">\r\n @for (sort of notSorted; track sort.active)\r\n {\r\n <div mat-menu-item class=\"menu-item\" cdkDrag>\r\n <span class=\"not-sorted-name\">{{sort.displayName || (sort.active | spaceCase)}}</span>\r\n </div>\r\n }\r\n </div>\r\n</mat-menu>\r\n", styles: [".cdk-drag-preview{box-sizing:border-box;border-radius:4px;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}.cdk-drag-placeholder{opacity:0}.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}.list{padding:5px 2px;border-bottom:solid 1px #ccc;color:#000000de;background:#fff}.light-arrow{color:#93b1ea78}.dark-arrow{color:#224e9c}.up-down-button{background-color:#fff;border-radius:30%;border-color:#0ff;padding:1px 1px 0;border-width:.5px;cursor:pointer;height:27px}.mat-icon.up-down-icon{margin-right:0;font-size:20px;font-weight:lighter}.sort-item{display:flex;align-items:center;justify-content:space-between}.up-down-buttons-wrapper{margin-left:2rem}.up-button{margin-right:.3rem}.mat-mdc-menu-item.menu-item,.mat-mdc-menu-item.menu-button{min-height:initial;padding:0 3px;line-height:25px;height:30px}.mat-mdc-menu-item.menu-item{cursor:move}.sorted-name{color:#224e9c;font-size:17px;font-weight:700}.not-sorted-name{color:#93b1ea;font-size:17px;font-weight:700}.apply-border{border:#224e9c solid .5px}.apply-border:hover{background-color:#faebd7}.apply-button-wrapper{display:grid;justify-content:center}.sort-header{font-size:10px;font-style:italic}.tip{padding:0 3px;color:#d3d3d3}.direction-text{font-size:small;font-weight:400}.close-button-wrapper{display:flex;flex-direction:row-reverse}\n"], dependencies: [{ kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i3.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2$2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { 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: "directive", type: StopPropagationDirective, selector: "[stop-propagation]" }, { kind: "ngmodule", type: DragDropModule }, { kind: "directive", type: i5.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer", "cdkDropListHasAnchor"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i5.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "pipe", type: SpaceCasePipe, name: "spaceCase" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
6141
6122
|
}
|
|
6142
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
6123
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: SortMenuComponent, decorators: [{
|
|
6143
6124
|
type: Component,
|
|
6144
6125
|
args: [{ selector: 'tb-sort-menu', providers: [SortMenuComponentStore], changeDetection: ChangeDetectionStrategy.OnPush, imports: [
|
|
6145
6126
|
MatTooltipModule, MatButtonModule, MatIconModule, MatMenuModule, StopPropagationDirective, DragDropModule,
|
|
@@ -6157,7 +6138,7 @@ class ResetMenuComponent {
|
|
|
6157
6138
|
return Object.values(this.state.$filters())
|
|
6158
6139
|
.filter(f => (isCustomFilter(f) && f.active) || f.filterValue != undefined)
|
|
6159
6140
|
.length;
|
|
6160
|
-
}, ...(ngDevMode ?
|
|
6141
|
+
}, { ...(ngDevMode ? { debugName: "$filtersSet" } : {}) });
|
|
6161
6142
|
this.$sortSet = computed(() => {
|
|
6162
6143
|
const sorts = this.state.$selectSorted();
|
|
6163
6144
|
if (!sorts.length)
|
|
@@ -6166,14 +6147,14 @@ class ResetMenuComponent {
|
|
|
6166
6147
|
if (!preSorts.length)
|
|
6167
6148
|
return true;
|
|
6168
6149
|
return !sortsAreSame(preSorts, sorts);
|
|
6169
|
-
}, ...(ngDevMode ?
|
|
6170
|
-
this.$groupBySet = computed(() => this.state.$groupByData().length || this.state.$userDefinedNoGroups(), ...(ngDevMode ?
|
|
6171
|
-
this.$hiddenSet = computed(() => this.state.$hiddenKeys().length, ...(ngDevMode ?
|
|
6172
|
-
this.$orderSet = computed(() => Object.keys(this.state.$userDefinedOrder()).length, ...(ngDevMode ?
|
|
6173
|
-
this.$widthsSet = computed(() => Object.keys(this.state.$getUserDefinedWidths()).length, ...(ngDevMode ?
|
|
6150
|
+
}, { ...(ngDevMode ? { debugName: "$sortSet" } : {}) });
|
|
6151
|
+
this.$groupBySet = computed(() => this.state.$groupByData().length || this.state.$userDefinedNoGroups(), { ...(ngDevMode ? { debugName: "$groupBySet" } : {}) });
|
|
6152
|
+
this.$hiddenSet = computed(() => this.state.$hiddenKeys().length, { ...(ngDevMode ? { debugName: "$hiddenSet" } : {}) });
|
|
6153
|
+
this.$orderSet = computed(() => Object.keys(this.state.$userDefinedOrder()).length, { ...(ngDevMode ? { debugName: "$orderSet" } : {}) });
|
|
6154
|
+
this.$widthsSet = computed(() => Object.keys(this.state.$getUserDefinedWidths()).length, { ...(ngDevMode ? { debugName: "$widthsSet" } : {}) });
|
|
6174
6155
|
this.$rowHeightSet = this.state.$userDefinedRowHeight;
|
|
6175
6156
|
this.headerHeightSet = this.state.$userDefinedHeaderHeight;
|
|
6176
|
-
this.pageSizeSet = computed(() => this.state.$userDefinedPageSize() && this.state.$userDefinedPageSize() !== this.state.selectSignal(s => s.pageSize)(), ...(ngDevMode ?
|
|
6157
|
+
this.pageSizeSet = computed(() => this.state.$userDefinedPageSize() && this.state.$userDefinedPageSize() !== this.state.selectSignal(s => s.pageSize)(), { ...(ngDevMode ? { debugName: "pageSizeSet" } : {}) });
|
|
6177
6158
|
this.showAllSet = this.state.selectSignal(s => s.userDefined.showAll);
|
|
6178
6159
|
this.$set = computed(() => {
|
|
6179
6160
|
const arr = [];
|
|
@@ -6208,7 +6189,7 @@ class ResetMenuComponent {
|
|
|
6208
6189
|
arr.push('Show All');
|
|
6209
6190
|
}
|
|
6210
6191
|
return arr;
|
|
6211
|
-
}, ...(ngDevMode ?
|
|
6192
|
+
}, { ...(ngDevMode ? { debugName: "$set" } : {}) });
|
|
6212
6193
|
this.resetable = resetable;
|
|
6213
6194
|
}
|
|
6214
6195
|
resetState() {
|
|
@@ -6220,10 +6201,10 @@ class ResetMenuComponent {
|
|
|
6220
6201
|
reset(s) {
|
|
6221
6202
|
this.state.resetPart(s);
|
|
6222
6203
|
}
|
|
6223
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
6224
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.
|
|
6204
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: ResetMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
6205
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.2", type: ResetMenuComponent, isStandalone: true, selector: "lib-reset-menu", outputs: { onStateReset$: "onStateReset" }, viewQueries: [{ propertyName: "menu", first: true, predicate: MatMenu, descendants: true, isSignal: true }], ngImport: i0, template: "<mat-menu #menu2=\"matMenu\">\r\n @if($set().length > 1)\r\n {\r\n <button mat-menu-item (click)=\"state.resetState()\">All</button>\r\n }\r\n @for (item of $set(); track $index)\r\n {\r\n <button mat-menu-item (click)=\"state.resetPart(item)\">Reset {{item}}</button>\r\n }\r\n</mat-menu>", styles: [":host{display:contents}\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: "ngmodule", type: MatButtonModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
6225
6206
|
}
|
|
6226
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
6207
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: ResetMenuComponent, decorators: [{
|
|
6227
6208
|
type: Component,
|
|
6228
6209
|
args: [{ selector: 'lib-reset-menu', imports: [MatMenuModule, MatButtonModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<mat-menu #menu2=\"matMenu\">\r\n @if($set().length > 1)\r\n {\r\n <button mat-menu-item (click)=\"state.resetState()\">All</button>\r\n }\r\n @for (item of $set(); track $index)\r\n {\r\n <button mat-menu-item (click)=\"state.resetPart(item)\">Reset {{item}}</button>\r\n }\r\n</mat-menu>", styles: [":host{display:contents}\n"] }]
|
|
6229
6210
|
}], propDecorators: { menu: [{ type: i0.ViewChild, args: [i0.forwardRef(() => MatMenu), { isSignal: true }] }], onStateReset$: [{ type: i0.Output, args: ["onStateReset"] }] } });
|
|
@@ -6234,8 +6215,8 @@ class TableHeaderMenuComponent {
|
|
|
6234
6215
|
this.exportToCsvService = inject(ExportToCsvService);
|
|
6235
6216
|
this.tableContainer = inject(TableContainerComponent);
|
|
6236
6217
|
this.state = this.tableContainer.state;
|
|
6237
|
-
this.$rowHeightNum = computed(() => +(this.tableContainer.$genericTable()?.$rowHeight()?.replace('px', '') || 0) || undefined, ...(ngDevMode ?
|
|
6238
|
-
this.$headerHeightNum = computed(() => +(this.tableContainer.$genericTable()?.$headerHeight()?.replace('px', '') || 0) || undefined, ...(ngDevMode ?
|
|
6218
|
+
this.$rowHeightNum = computed(() => +(this.tableContainer.$genericTable()?.$rowHeight()?.replace('px', '') || 0) || undefined, { ...(ngDevMode ? { debugName: "$rowHeightNum" } : {}) });
|
|
6219
|
+
this.$headerHeightNum = computed(() => +(this.tableContainer.$genericTable()?.$headerHeight()?.replace('px', '') || 0) || undefined, { ...(ngDevMode ? { debugName: "$headerHeightNum" } : {}) });
|
|
6239
6220
|
}
|
|
6240
6221
|
exportToCsv() {
|
|
6241
6222
|
this.exportToCsvService.exportToCsv(this.tableContainer.$data());
|
|
@@ -6250,10 +6231,10 @@ class TableHeaderMenuComponent {
|
|
|
6250
6231
|
if (v === 'header')
|
|
6251
6232
|
this.state.setUserDefinedHeaderHeight(+element.value);
|
|
6252
6233
|
}
|
|
6253
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
6254
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.
|
|
6234
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: TableHeaderMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
6235
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.2", type: TableHeaderMenuComponent, isStandalone: true, selector: "lib-table-header-menu", viewQueries: [{ propertyName: "menu", first: true, predicate: MatMenu, descendants: true, isSignal: true }], ngImport: i0, template: "<span [matTooltip]=\"!r.$set().length ? 'Nothing To Reset' : ''\">\r\n <button #d=\"matMenuItem\" mat-menu-item [matMenuTriggerFor]=\"r.menu()\" [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{\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{\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 #pm class=\"profiles-menu\" [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 placeholder=\"Set Size\"\r\n [value]=\"$rowHeightNum()\"\r\n [min]=\"10\"\r\n [max]=\"100\" (change)=\"updateHeight('row', i)\" />\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 placeholder=\"Set Size\"\r\n [value]=\"$headerHeightNum()\"\r\n [min]=\"10\"\r\n [max]=\"100\" (change)=\"updateHeight('header', i2)\"/>\r\n </div>\r\n </div>\r\n}\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.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]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
6255
6236
|
}
|
|
6256
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
6237
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: TableHeaderMenuComponent, decorators: [{
|
|
6257
6238
|
type: Component,
|
|
6258
6239
|
args: [{ selector: 'lib-table-header-menu', imports: [MatMenuModule, MatIcon, ProfilesMenuComponent, ResetMenuComponent, MatTooltip, StopPropagationDirective], changeDetection: ChangeDetectionStrategy.OnPush, template: "<span [matTooltip]=\"!r.$set().length ? 'Nothing To Reset' : ''\">\r\n <button #d=\"matMenuItem\" mat-menu-item [matMenuTriggerFor]=\"r.menu()\" [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{\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{\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 #pm class=\"profiles-menu\" [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 placeholder=\"Set Size\"\r\n [value]=\"$rowHeightNum()\"\r\n [min]=\"10\"\r\n [max]=\"100\" (change)=\"updateHeight('row', i)\" />\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 placeholder=\"Set Size\"\r\n [value]=\"$headerHeightNum()\"\r\n [min]=\"10\"\r\n [max]=\"100\" (change)=\"updateHeight('header', i2)\"/>\r\n </div>\r\n </div>\r\n}\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"] }]
|
|
6259
6240
|
}], propDecorators: { menu: [{ type: i0.ViewChild, args: [i0.forwardRef(() => MatMenu), { isSignal: true }] }] } });
|
|
@@ -6262,25 +6243,14 @@ class TableVirtualScrollStrategy {
|
|
|
6262
6243
|
constructor(scrollContainer, dataStore) {
|
|
6263
6244
|
this.indexChange = new Subject();
|
|
6264
6245
|
this.scrolledIndexChange = this.indexChange.pipe(distinctUntilChanged());
|
|
6265
|
-
this.$dataLengthChange = linkedSignal(...(ngDevMode ?
|
|
6266
|
-
|
|
6267
|
-
|
|
6268
|
-
|
|
6269
|
-
|
|
6270
|
-
|
|
6271
|
-
|
|
6272
|
-
|
|
6273
|
-
} }] : [{
|
|
6274
|
-
source: () => this.$rowHeight(),
|
|
6275
|
-
computation: (curr, previous) => {
|
|
6276
|
-
return ({ curr, previous: previous == undefined ? curr : previous.source });
|
|
6277
|
-
}
|
|
6278
|
-
}]));
|
|
6279
|
-
this.$headerHeightChange = linkedSignal(...(ngDevMode ? [{ debugName: "$headerHeightChange", source: () => this.$headerHeight(),
|
|
6280
|
-
computation: (curr, previous) => ({ curr, previous: previous == undefined ? curr : previous.source }) }] : [{
|
|
6281
|
-
source: () => this.$headerHeight(),
|
|
6282
|
-
computation: (curr, previous) => ({ curr, previous: previous == undefined ? curr : previous.source })
|
|
6283
|
-
}]));
|
|
6246
|
+
this.$dataLengthChange = linkedSignal({ ...(ngDevMode ? { debugName: "$dataLengthChange" } : {}), source: () => this.$dataLength(),
|
|
6247
|
+
computation: (curr, previous) => ({ curr, previous: previous == undefined ? curr : previous.source }) });
|
|
6248
|
+
this.$rowHeightChange = linkedSignal({ ...(ngDevMode ? { debugName: "$rowHeightChange" } : {}), source: () => this.$rowHeight(),
|
|
6249
|
+
computation: (curr, previous) => {
|
|
6250
|
+
return ({ curr, previous: previous == undefined ? curr : previous.source });
|
|
6251
|
+
} });
|
|
6252
|
+
this.$headerHeightChange = linkedSignal({ ...(ngDevMode ? { debugName: "$headerHeightChange" } : {}), source: () => this.$headerHeight(),
|
|
6253
|
+
computation: (curr, previous) => ({ curr, previous: previous == undefined ? curr : previous.source }) });
|
|
6284
6254
|
this.contentScrolled$ = new Subject();
|
|
6285
6255
|
this.sub = subscriber(this.contentScrolled$.pipe(debounceTime(20), distinctUntilChanged()), offset => {
|
|
6286
6256
|
this.updateContent('scroll');
|
|
@@ -6292,7 +6262,7 @@ class TableVirtualScrollStrategy {
|
|
|
6292
6262
|
return;
|
|
6293
6263
|
this.updateContent('data length');
|
|
6294
6264
|
});
|
|
6295
|
-
}, ...(ngDevMode ?
|
|
6265
|
+
}, { ...(ngDevMode ? { debugName: "#onDataLengthChange" } : {}) });
|
|
6296
6266
|
this.#onHeaderChange = effect(() => {
|
|
6297
6267
|
const headerHeightChange = this.$headerHeightChange();
|
|
6298
6268
|
untracked(() => {
|
|
@@ -6300,7 +6270,7 @@ class TableVirtualScrollStrategy {
|
|
|
6300
6270
|
return;
|
|
6301
6271
|
this.updateContent('header height');
|
|
6302
6272
|
});
|
|
6303
|
-
}, ...(ngDevMode ?
|
|
6273
|
+
}, { ...(ngDevMode ? { debugName: "#onHeaderChange" } : {}) });
|
|
6304
6274
|
this.#onRowChange = effect(() => {
|
|
6305
6275
|
const rowHeightChange = this.$rowHeightChange();
|
|
6306
6276
|
untracked(() => {
|
|
@@ -6308,8 +6278,8 @@ class TableVirtualScrollStrategy {
|
|
|
6308
6278
|
return;
|
|
6309
6279
|
this.updateContent('row height');
|
|
6310
6280
|
});
|
|
6311
|
-
}, ...(ngDevMode ?
|
|
6312
|
-
this.$currentRange = signal({ start: 0, end: 0 }, ...(ngDevMode ?
|
|
6281
|
+
}, { ...(ngDevMode ? { debugName: "#onRowChange" } : {}) });
|
|
6282
|
+
this.$currentRange = signal({ start: 0, end: 0 }, { ...(ngDevMode ? { debugName: "$currentRange" } : {}) });
|
|
6313
6283
|
this.$rowHeight = scrollContainer.computedRowHeight;
|
|
6314
6284
|
this.$headerHeight = scrollContainer.computedHeaderHeight;
|
|
6315
6285
|
this.viewport = scrollContainer.viewport;
|
|
@@ -6383,7 +6353,7 @@ class VirtualScrollContainer {
|
|
|
6383
6353
|
this.state = inject(TableStore);
|
|
6384
6354
|
this.dataStore = inject(DataStore);
|
|
6385
6355
|
this.viewport = viewChild.required(CdkVirtualScrollViewport);
|
|
6386
|
-
this.genericTable = contentChild(GenericTableComponent, ...(ngDevMode ?
|
|
6356
|
+
this.genericTable = contentChild(GenericTableComponent, { ...(ngDevMode ? { debugName: "genericTable" } : {}) });
|
|
6387
6357
|
this.tableContainer = inject(TableContainerComponent);
|
|
6388
6358
|
this.defaultOptions = new VirtualScrollOptions();
|
|
6389
6359
|
this.$usePaginator = this.state.selectSignal(s => s.notPersistedTableSettings.usePaginator);
|
|
@@ -6399,8 +6369,8 @@ class VirtualScrollContainer {
|
|
|
6399
6369
|
return this.state.$tableSettings().virtualSettings;
|
|
6400
6370
|
else
|
|
6401
6371
|
return undefined;
|
|
6402
|
-
}, ...(ngDevMode ?
|
|
6403
|
-
this.$optionsSet = computed(() => !!this.$virtualScrollOptions(), ...(ngDevMode ?
|
|
6372
|
+
}, { ...(ngDevMode ? { debugName: "$virtualScrollOptions" } : {}) });
|
|
6373
|
+
this.$optionsSet = computed(() => !!this.$virtualScrollOptions(), { ...(ngDevMode ? { debugName: "$optionsSet" } : {}) });
|
|
6404
6374
|
this.$dataLength = computed(() => {
|
|
6405
6375
|
const paginated = this.$usePaginator() && !this.$showAll();
|
|
6406
6376
|
const pageSize = this.$pageSize();
|
|
@@ -6409,7 +6379,7 @@ class VirtualScrollContainer {
|
|
|
6409
6379
|
if (paginated)
|
|
6410
6380
|
return Math.min(dataLen - (pageNumber * pageSize), pageSize);
|
|
6411
6381
|
return dataLen;
|
|
6412
|
-
}, ...(ngDevMode ?
|
|
6382
|
+
}, { ...(ngDevMode ? { debugName: "$dataLength" } : {}) });
|
|
6413
6383
|
this.#setViewportEffect = effect(() => {
|
|
6414
6384
|
const viewport = this.viewport();
|
|
6415
6385
|
const options = this.$optionsSet();
|
|
@@ -6418,7 +6388,7 @@ class VirtualScrollContainer {
|
|
|
6418
6388
|
this.setSize(this.viewport().elementRef, 'initial');
|
|
6419
6389
|
}
|
|
6420
6390
|
});
|
|
6421
|
-
}, ...(ngDevMode ?
|
|
6391
|
+
}, { ...(ngDevMode ? { debugName: "#setViewportEffect" } : {}) });
|
|
6422
6392
|
this.#onRenderedRangeEffect = effect(() => {
|
|
6423
6393
|
const renderedRange = this.$renderedRange();
|
|
6424
6394
|
const viewport = this.viewport();
|
|
@@ -6435,7 +6405,7 @@ class VirtualScrollContainer {
|
|
|
6435
6405
|
return;
|
|
6436
6406
|
this.setSize(viewport.elementRef, 'rendered range');
|
|
6437
6407
|
});
|
|
6438
|
-
}, ...(ngDevMode ?
|
|
6408
|
+
}, { ...(ngDevMode ? { debugName: "#onRenderedRangeEffect" } : {}) });
|
|
6439
6409
|
this.resizeHandler = () => {
|
|
6440
6410
|
if (this.viewport() && this.$virtualScrollOptions()?.dynamicHeight) {
|
|
6441
6411
|
this.setSize(this.viewport().elementRef, 'resize');
|
|
@@ -6445,23 +6415,23 @@ class VirtualScrollContainer {
|
|
|
6445
6415
|
const virtualScrollOptions = this.state.$tableSettings().virtualSettings;
|
|
6446
6416
|
const rowHeight = this.state.$userDefinedRowHeight() || virtualScrollOptions?.rowHeight || this.state.$tableSettings().rowHeight || this.defaultOptions.rowHeight;
|
|
6447
6417
|
return parseTbSizeToPixels(rowHeight) || 0;
|
|
6448
|
-
}, ...(ngDevMode ?
|
|
6418
|
+
}, { ...(ngDevMode ? { debugName: "computedRowHeight" } : {}) });
|
|
6449
6419
|
this.computedHeaderHeight = computed(() => {
|
|
6450
6420
|
if (this.state.$tableSettings().hideHeader)
|
|
6451
6421
|
return 0;
|
|
6452
6422
|
const virtualScrollOptions = this.state.$tableSettings().virtualSettings;
|
|
6453
6423
|
const headerHeight = this.state.$userDefinedHeaderHeight() || virtualScrollOptions?.headerHeight || this.state.$tableSettings().headerHeight || this.defaultOptions.headerHeight;
|
|
6454
6424
|
return parseTbSizeToPixels(headerHeight) || 0;
|
|
6455
|
-
}, ...(ngDevMode ?
|
|
6425
|
+
}, { ...(ngDevMode ? { debugName: "computedHeaderHeight" } : {}) });
|
|
6456
6426
|
this.computedFooterHeight = computed(() => {
|
|
6457
6427
|
return parseFloat(this.genericTable()?.$footerHeight()?.replace('px', '') || '0');
|
|
6458
|
-
}, ...(ngDevMode ?
|
|
6428
|
+
}, { ...(ngDevMode ? { debugName: "computedFooterHeight" } : {}) });
|
|
6459
6429
|
this.computedBuffer = computed(() => {
|
|
6460
6430
|
const virtualScrollOptions = this.state.$tableSettings().virtualSettings;
|
|
6461
6431
|
if (!virtualScrollOptions.dynamicalHeightBuffer)
|
|
6462
6432
|
return 0;
|
|
6463
6433
|
return parseTbSizeToPixels(virtualScrollOptions.dynamicalHeightBuffer) || 0;
|
|
6464
|
-
}, ...(ngDevMode ?
|
|
6434
|
+
}, { ...(ngDevMode ? { debugName: "computedBuffer" } : {}) });
|
|
6465
6435
|
this.scrollStrategy = new TableVirtualScrollStrategy(this, this.dataStore);
|
|
6466
6436
|
addEventListener('resize', this.resizeHandler);
|
|
6467
6437
|
}
|
|
@@ -6527,8 +6497,8 @@ class VirtualScrollContainer {
|
|
|
6527
6497
|
const virtualScrollOffset = this.viewport()?.getOffsetToRenderedContentStart() ?? 0;
|
|
6528
6498
|
this.dataStore.patchState({ virtualScrollOffset });
|
|
6529
6499
|
}
|
|
6530
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
6531
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.0.
|
|
6500
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: VirtualScrollContainer, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
6501
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.0.2", type: VirtualScrollContainer, isStandalone: true, selector: "tb-virtual-scroll-container", queries: [{ propertyName: "genericTable", first: true, predicate: GenericTableComponent, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "viewport", first: true, predicate: CdkVirtualScrollViewport, descendants: true, isSignal: true }], ngImport: i0, template: `
|
|
6532
6502
|
<cdk-virtual-scroll-viewport>
|
|
6533
6503
|
<ng-content/>
|
|
6534
6504
|
</cdk-virtual-scroll-viewport>
|
|
@@ -6540,7 +6510,7 @@ class VirtualScrollContainer {
|
|
|
6540
6510
|
},
|
|
6541
6511
|
], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
6542
6512
|
}
|
|
6543
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
6513
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: VirtualScrollContainer, decorators: [{
|
|
6544
6514
|
type: Component,
|
|
6545
6515
|
args: [{
|
|
6546
6516
|
selector: 'tb-virtual-scroll-container',
|
|
@@ -6572,45 +6542,45 @@ class TableContainerComponent {
|
|
|
6572
6542
|
this.exportToCsvService = inject(ExportToCsvService);
|
|
6573
6543
|
this.config = inject(TableBuilderConfigToken);
|
|
6574
6544
|
this.dataSource = new TableBuilderDataSource(this.state, this.dataStore);
|
|
6575
|
-
this.$filterDirectives = contentChildren(TableFilterDirective, ...(ngDevMode ?
|
|
6576
|
-
this.$customFilterDirectives = contentChildren(TableCustomFilterDirective, ...(ngDevMode ?
|
|
6577
|
-
this.$paginatorComponent = viewChild(PaginatorComponent, ...(ngDevMode ?
|
|
6578
|
-
this.$paginatorWrapper = viewChild('paginatorWrapper', ...(ngDevMode ?
|
|
6579
|
-
this.$genericTable = viewChild(GenericTableComponent, ...(ngDevMode ?
|
|
6580
|
-
this._$customRows = contentChildren((MatRowDef), ...(ngDevMode ?
|
|
6581
|
-
this.$customRows = computed(() => [...this._$customRows()], ...(ngDevMode ?
|
|
6582
|
-
this.$customCells = contentChildren(CustomCellDirective, ...(ngDevMode ?
|
|
6583
|
-
this.$customGroupRows = contentChildren(CustomGroupRowDirective, ...(ngDevMode ?
|
|
6545
|
+
this.$filterDirectives = contentChildren(TableFilterDirective, { ...(ngDevMode ? { debugName: "$filterDirectives" } : {}), descendants: true });
|
|
6546
|
+
this.$customFilterDirectives = contentChildren(TableCustomFilterDirective, { ...(ngDevMode ? { debugName: "$customFilterDirectives" } : {}), descendants: true });
|
|
6547
|
+
this.$paginatorComponent = viewChild(PaginatorComponent, { ...(ngDevMode ? { debugName: "$paginatorComponent" } : {}) });
|
|
6548
|
+
this.$paginatorWrapper = viewChild('paginatorWrapper', { ...(ngDevMode ? { debugName: "$paginatorWrapper" } : {}) });
|
|
6549
|
+
this.$genericTable = viewChild(GenericTableComponent, { ...(ngDevMode ? { debugName: "$genericTable" } : {}) });
|
|
6550
|
+
this._$customRows = contentChildren((MatRowDef), { ...(ngDevMode ? { debugName: "_$customRows" } : {}) });
|
|
6551
|
+
this.$customRows = computed(() => [...this._$customRows()], { ...(ngDevMode ? { debugName: "$customRows" } : {}) });
|
|
6552
|
+
this.$customCells = contentChildren(CustomCellDirective, { ...(ngDevMode ? { debugName: "$customCells" } : {}) });
|
|
6553
|
+
this.$customGroupRows = contentChildren(CustomGroupRowDirective, { ...(ngDevMode ? { debugName: "$customGroupRows" } : {}) });
|
|
6584
6554
|
this.$menu = viewChild.required(MatMenu);
|
|
6585
6555
|
this.menuInjector = Injector.create({
|
|
6586
6556
|
providers: [{ provide: MatMenu, useFactory: () => this.$menu() }],
|
|
6587
6557
|
parent: this.injector
|
|
6588
6558
|
});
|
|
6589
|
-
this.$tableBuilder = input.required(...(ngDevMode ?
|
|
6590
|
-
this.$tableIdInput = input(undefined, ...(ngDevMode ?
|
|
6591
|
-
this.$trackByInput = input(undefined, ...(ngDevMode ?
|
|
6592
|
-
this.$inputFilters = input([], ...(ngDevMode ?
|
|
6593
|
-
this.$filterInfoInputs = computed(() => this.$inputFilters().filter(i => !isFunction(i)), ...(ngDevMode ?
|
|
6594
|
-
this.$indexColumnInput = input(false, ...(ngDevMode ?
|
|
6595
|
-
this.$selectionColumnInput = input(false, ...(ngDevMode ?
|
|
6596
|
-
this.$stickyHeaderInput = input(true, ...(ngDevMode ?
|
|
6597
|
-
this.$stickyFooterInput = input(
|
|
6598
|
-
this.$groupHeaderTemplate = input(undefined, ...(ngDevMode ?
|
|
6599
|
-
this.$groupHeaderHeight = input(undefined, ...(ngDevMode ?
|
|
6600
|
-
this.$pageSize = input(undefined, ...(ngDevMode ?
|
|
6559
|
+
this.$tableBuilder = input.required({ ...(ngDevMode ? { debugName: "$tableBuilder" } : {}), alias: 'tableBuilder' });
|
|
6560
|
+
this.$tableIdInput = input(undefined, { ...(ngDevMode ? { debugName: "$tableIdInput" } : {}), alias: 'tableId' });
|
|
6561
|
+
this.$trackByInput = input(undefined, { ...(ngDevMode ? { debugName: "$trackByInput" } : {}), alias: 'trackBy' });
|
|
6562
|
+
this.$inputFilters = input([], { ...(ngDevMode ? { debugName: "$inputFilters" } : {}), alias: 'inputFilters' });
|
|
6563
|
+
this.$filterInfoInputs = computed(() => this.$inputFilters().filter(i => !isFunction(i)), { ...(ngDevMode ? { debugName: "$filterInfoInputs" } : {}) });
|
|
6564
|
+
this.$indexColumnInput = input(false, { ...(ngDevMode ? { debugName: "$indexColumnInput" } : {}), alias: 'indexColumn' });
|
|
6565
|
+
this.$selectionColumnInput = input(false, { ...(ngDevMode ? { debugName: "$selectionColumnInput" } : {}), alias: 'selectionColumn' });
|
|
6566
|
+
this.$stickyHeaderInput = input(true, { ...(ngDevMode ? { debugName: "$stickyHeaderInput" } : {}), alias: 'stickyHeader' });
|
|
6567
|
+
this.$stickyFooterInput = input(undefined, { ...(ngDevMode ? { debugName: "$stickyFooterInput" } : {}), alias: 'stickyFooter' });
|
|
6568
|
+
this.$groupHeaderTemplate = input(undefined, { ...(ngDevMode ? { debugName: "$groupHeaderTemplate" } : {}), alias: 'groupHeaderTemplate' });
|
|
6569
|
+
this.$groupHeaderHeight = input(undefined, { ...(ngDevMode ? { debugName: "$groupHeaderHeight" } : {}), alias: 'groupHeaderHeight' });
|
|
6570
|
+
this.$pageSize = input(undefined, { ...(ngDevMode ? { debugName: "$pageSize" } : {}), alias: 'pageSize' });
|
|
6601
6571
|
this._selection$ = new BehaviorSubject(null);
|
|
6602
6572
|
this.selection$ = outputFromObservable(this._selection$.pipe(notNull()), { alias: 'selection' });
|
|
6603
6573
|
this.onStateReset$ = output({ alias: 'onStateReset' });
|
|
6604
6574
|
this.onSaveState$ = output({ alias: 'onSaveState' });
|
|
6605
6575
|
this.state$ = outputFromObservable(toObservable(this.state.$savableState), { alias: 'state' });
|
|
6606
|
-
this.$data = computed(() => this.$sortedAndFilteredData()?.value || [], ...(ngDevMode ?
|
|
6576
|
+
this.$data = computed(() => this.$sortedAndFilteredData()?.value || [], { ...(ngDevMode ? { debugName: "$data" } : {}) });
|
|
6607
6577
|
this.data$ = outputFromObservable(toObservable(this.$data), { alias: 'data' });
|
|
6608
6578
|
/**
|
|
6609
6579
|
* Will be different than $data if grouping is applied
|
|
6610
6580
|
*/
|
|
6611
|
-
this.$sortedAndFilteredAndGroupedData = computed(() => this.$filteredSortedAndGrouped()?.displayData || [], ...(ngDevMode ?
|
|
6581
|
+
this.$sortedAndFilteredAndGroupedData = computed(() => this.$filteredSortedAndGrouped()?.displayData || [], { ...(ngDevMode ? { debugName: "$sortedAndFilteredAndGroupedData" } : {}) });
|
|
6612
6582
|
this.sortedAndFilteredAndGroupedData$ = outputFromObservable(toObservable(this.$sortedAndFilteredAndGroupedData), { alias: 'sortedAndFilteredAndGroupedData' });
|
|
6613
|
-
this.$displayData = computed(() => this.$tableBuilder() && this.$filteredSortedAndGrouped()?.displayData, ...(ngDevMode ?
|
|
6583
|
+
this.$displayData = computed(() => this.$tableBuilder() && this.$filteredSortedAndGrouped()?.displayData, { ...(ngDevMode ? { debugName: "$displayData" } : {}) });
|
|
6614
6584
|
this.expandAllGroups = () => {
|
|
6615
6585
|
const groupHeaders = getAllGroupHeaderNames(this.$displayData());
|
|
6616
6586
|
this.state.expandOfGroup(groupHeaders.map(g => ({ groupKey: g.groupKey, uniqueNameOfHeadersToExpand: g.headers })));
|
|
@@ -6626,24 +6596,32 @@ class TableContainerComponent {
|
|
|
6626
6596
|
metaData,
|
|
6627
6597
|
customCell: this.$customCells().filter(cc => cc.$inited()).find(cc => cc.$customCell() === metaData.key)
|
|
6628
6598
|
}));
|
|
6629
|
-
}, ...(ngDevMode ?
|
|
6599
|
+
}, { ...(ngDevMode ? { debugName: "$myColumns" } : {}) });
|
|
6630
6600
|
this.$useVirtual = this.state.$isVirtual;
|
|
6631
6601
|
this.$collapsedFooter = this.state.$footerCollapsed;
|
|
6632
6602
|
this.$collapsedHeader = this.state.$headerCollapsed;
|
|
6633
|
-
this.$displayDataLength = computed(() => this.$displayData()?.length || 0, ...(ngDevMode ?
|
|
6634
|
-
this.$tableBuilderSettings = computed(() => this.$tableBuilder().$settings(), ...(ngDevMode ?
|
|
6635
|
-
this.$trackBy = computed(() => this.$trackByInput() || this.$tableBuilderSettings()?.tableSettings?.trackBy, ...(ngDevMode ?
|
|
6636
|
-
this.$tableId = computed(() => this.$tableIdInput() || this.$tableBuilderSettings()?.tableSettings?.tableId, ...(ngDevMode ?
|
|
6637
|
-
this.$includeSelectionColumn = computed(() => this.$selectionColumnInput() || !!this.$tableBuilderSettings()?.tableSettings?.includeSelectionColumn, ...(ngDevMode ?
|
|
6638
|
-
this.$includeIndexColumn = computed(() => this.$indexColumnInput() || !!this.$tableBuilderSettings()?.tableSettings?.includeIndexColumn, ...(ngDevMode ?
|
|
6603
|
+
this.$displayDataLength = computed(() => this.$displayData()?.length || 0, { ...(ngDevMode ? { debugName: "$displayDataLength" } : {}) });
|
|
6604
|
+
this.$tableBuilderSettings = computed(() => this.$tableBuilder().$settings(), { ...(ngDevMode ? { debugName: "$tableBuilderSettings" } : {}) });
|
|
6605
|
+
this.$trackBy = computed(() => this.$trackByInput() || this.$tableBuilderSettings()?.tableSettings?.trackBy, { ...(ngDevMode ? { debugName: "$trackBy" } : {}) });
|
|
6606
|
+
this.$tableId = computed(() => this.$tableIdInput() || this.$tableBuilderSettings()?.tableSettings?.tableId, { ...(ngDevMode ? { debugName: "$tableId" } : {}) });
|
|
6607
|
+
this.$includeSelectionColumn = computed(() => this.$selectionColumnInput() || !!this.$tableBuilderSettings()?.tableSettings?.includeSelectionColumn, { ...(ngDevMode ? { debugName: "$includeSelectionColumn" } : {}) });
|
|
6608
|
+
this.$includeIndexColumn = computed(() => this.$indexColumnInput() || !!this.$tableBuilderSettings()?.tableSettings?.includeIndexColumn, { ...(ngDevMode ? { debugName: "$includeIndexColumn" } : {}) });
|
|
6639
6609
|
this.$stickyHeader = computed(() => {
|
|
6640
6610
|
const settings = this.$tableBuilderSettings()?.columnHeaderSettings?.stickyHeaderRow;
|
|
6641
6611
|
if (settings != null) {
|
|
6642
6612
|
return settings;
|
|
6643
6613
|
}
|
|
6644
6614
|
return this.$stickyHeaderInput();
|
|
6645
|
-
}, ...(ngDevMode ?
|
|
6646
|
-
this.$stickyFooter = computed(() =>
|
|
6615
|
+
}, { ...(ngDevMode ? { debugName: "$stickyHeader" } : {}) });
|
|
6616
|
+
this.$stickyFooter = computed(() => {
|
|
6617
|
+
if (this.$stickyFooterInput() != null) {
|
|
6618
|
+
return !!this.$stickyFooterInput();
|
|
6619
|
+
}
|
|
6620
|
+
if (this.$tableBuilderSettings()?.columnFooterSettings?.stickyFooterRow != null) {
|
|
6621
|
+
return !!this.$tableBuilderSettings()?.columnFooterSettings?.stickyFooterRow;
|
|
6622
|
+
}
|
|
6623
|
+
return this.config.defaultTableSettings?.columnFooterSettings?.stickyFooterRow || false;
|
|
6624
|
+
}, { ...(ngDevMode ? { debugName: "$stickyFooter" } : {}) });
|
|
6647
6625
|
this.$props = computed(() => {
|
|
6648
6626
|
const indexColumn = this.$includeIndexColumn();
|
|
6649
6627
|
const selectionColumn = this.$includeSelectionColumn();
|
|
@@ -6653,7 +6631,7 @@ class TableContainerComponent {
|
|
|
6653
6631
|
const groupHeaderHeight = this.$groupHeaderHeight();
|
|
6654
6632
|
const customGroupRows = this.$customGroupRows().filter(cgr => cgr.$inited());
|
|
6655
6633
|
return ({ indexColumn, selectionColumn, isSticky: stickHeader, stickyFooter, groupHeaderTemplate, groupHeaderHeight, customGroupRows });
|
|
6656
|
-
}, ...(ngDevMode ?
|
|
6634
|
+
}, { ...(ngDevMode ? { debugName: "$props" } : {}) });
|
|
6657
6635
|
this.#initTableBuilder = effect(() => {
|
|
6658
6636
|
const tb = this.$tableBuilder();
|
|
6659
6637
|
untracked(() => {
|
|
@@ -6662,7 +6640,7 @@ class TableContainerComponent {
|
|
|
6662
6640
|
tb._container.set(this);
|
|
6663
6641
|
}
|
|
6664
6642
|
});
|
|
6665
|
-
}, ...(ngDevMode ?
|
|
6643
|
+
}, { ...(ngDevMode ? { debugName: "#initTableBuilder" } : {}) });
|
|
6666
6644
|
this.#initializeTableSettingsFromTableBuilderAndPersistedStateEffect = effect(() => {
|
|
6667
6645
|
const metaLoaded = this.$isInitializationState(InitializationState.MetaDataLoaded)();
|
|
6668
6646
|
if (!metaLoaded)
|
|
@@ -6677,14 +6655,14 @@ class TableContainerComponent {
|
|
|
6677
6655
|
}
|
|
6678
6656
|
this.state.setInitializationState(InitializationState.Ready);
|
|
6679
6657
|
});
|
|
6680
|
-
}, ...(ngDevMode ?
|
|
6658
|
+
}, { ...(ngDevMode ? { debugName: "#initializeTableSettingsFromTableBuilderAndPersistedStateEffect" } : {}) });
|
|
6681
6659
|
this.#setPageSizeFromInputEffect = effect(() => {
|
|
6682
6660
|
const pageSize = this.$pageSize();
|
|
6683
6661
|
const userDefinedPageSize = this.state.$userDefinedPageSize();
|
|
6684
6662
|
if (pageSize && !userDefinedPageSize) {
|
|
6685
6663
|
untracked(() => this.state.setPageSize(pageSize));
|
|
6686
6664
|
}
|
|
6687
|
-
}, ...(ngDevMode ?
|
|
6665
|
+
}, { ...(ngDevMode ? { debugName: "#setPageSizeFromInputEffect" } : {}) });
|
|
6688
6666
|
this.#patchedFilters = [];
|
|
6689
6667
|
this.#patchSavableFilterDirectivesFromPersistedStateEffect = effect(() => {
|
|
6690
6668
|
const loaded = this.$isInitializationState(InitializationState.TableSettingsLoaded)();
|
|
@@ -6700,7 +6678,7 @@ class TableContainerComponent {
|
|
|
6700
6678
|
this.state.addFilter(f.filter$);
|
|
6701
6679
|
});
|
|
6702
6680
|
});
|
|
6703
|
-
}, ...(ngDevMode ?
|
|
6681
|
+
}, { ...(ngDevMode ? { debugName: "#patchSavableFilterDirectivesFromPersistedStateEffect" } : {}) });
|
|
6704
6682
|
this.#patchSavableFilterInputsFromPersistedStateEffect = effect(() => {
|
|
6705
6683
|
const loaded = this.$isInitializationState(InitializationState.TableSettingsLoaded)();
|
|
6706
6684
|
const inputFilters = this.$filterInfoInputs();
|
|
@@ -6721,11 +6699,11 @@ class TableContainerComponent {
|
|
|
6721
6699
|
this.#patchedFilters.push(f.filterId);
|
|
6722
6700
|
});
|
|
6723
6701
|
});
|
|
6724
|
-
}, ...(ngDevMode ?
|
|
6702
|
+
}, { ...(ngDevMode ? { debugName: "#patchSavableFilterInputsFromPersistedStateEffect" } : {}) });
|
|
6725
6703
|
this.#addPropsToStoreFromInputsEffect = effect(() => {
|
|
6726
6704
|
const props = this.$props();
|
|
6727
6705
|
untracked(() => this.state.setProps(props));
|
|
6728
|
-
}, ...(ngDevMode ?
|
|
6706
|
+
}, { ...(ngDevMode ? { debugName: "#addPropsToStoreFromInputsEffect" } : {}) });
|
|
6729
6707
|
this.#addMetaDataToStoreEffect = effect(() => {
|
|
6730
6708
|
const allMetaDatas = this.$allMetaDatas();
|
|
6731
6709
|
if (!allMetaDatas)
|
|
@@ -6734,7 +6712,7 @@ class TableContainerComponent {
|
|
|
6734
6712
|
this.state.setMetaData(allMetaDatas);
|
|
6735
6713
|
this.state.setLinkMaps(createLinkCreatorDict(allMetaDatas));
|
|
6736
6714
|
});
|
|
6737
|
-
}, ...(ngDevMode ?
|
|
6715
|
+
}, { ...(ngDevMode ? { debugName: "#addMetaDataToStoreEffect" } : {}) });
|
|
6738
6716
|
this.#setFilteredDataLengthEffect = effect(() => {
|
|
6739
6717
|
const tableBuilder = this.$tableBuilder();
|
|
6740
6718
|
const data = this.$sortedAndFilteredData();
|
|
@@ -6743,7 +6721,7 @@ class TableContainerComponent {
|
|
|
6743
6721
|
untracked(() => {
|
|
6744
6722
|
this.dataStore.patchState({ sortedFilteredDataLength: data.value.length });
|
|
6745
6723
|
});
|
|
6746
|
-
}, ...(ngDevMode ?
|
|
6724
|
+
}, { ...(ngDevMode ? { debugName: "#setFilteredDataLengthEffect" } : {}) });
|
|
6747
6725
|
this.#setDataSourceDataEffect = effect(() => {
|
|
6748
6726
|
const tableBuilder = this.$tableBuilder();
|
|
6749
6727
|
const flat = this.$filteredSortedAndGrouped();
|
|
@@ -6754,7 +6732,7 @@ class TableContainerComponent {
|
|
|
6754
6732
|
this.dataSource.setData(data);
|
|
6755
6733
|
this.dataStore.patchState({ sortedFilteredGroupedDataLength: data.length });
|
|
6756
6734
|
});
|
|
6757
|
-
}, ...(ngDevMode ?
|
|
6735
|
+
}, { ...(ngDevMode ? { debugName: "#setDataSourceDataEffect" } : {}) });
|
|
6758
6736
|
this.#destroyRef = inject(DestroyRef).onDestroy(() => {
|
|
6759
6737
|
const tableId = this.$tableId();
|
|
6760
6738
|
if (tableId) {
|
|
@@ -6767,14 +6745,14 @@ class TableContainerComponent {
|
|
|
6767
6745
|
return this.stateService.$selectLocalTableStateForView(tableId)();
|
|
6768
6746
|
}
|
|
6769
6747
|
return undefined;
|
|
6770
|
-
}, ...(ngDevMode ?
|
|
6748
|
+
}, { ...(ngDevMode ? { debugName: "$persistedState" } : {}) });
|
|
6771
6749
|
this.$allFilterDirectives = computed(() => {
|
|
6772
6750
|
if (this.wrapper) {
|
|
6773
6751
|
return [...this.$filterDirectives(), ...this.$customFilterDirectives(), ...this.wrapper.$registrations()];
|
|
6774
6752
|
}
|
|
6775
6753
|
return [...this.$filterDirectives(), ...this.$customFilterDirectives()];
|
|
6776
|
-
}, ...(ngDevMode ?
|
|
6777
|
-
this.$tableBuilderMetaData = computed(() => this.$tableBuilder()?.$metaData(), ...(ngDevMode ?
|
|
6754
|
+
}, { ...(ngDevMode ? { debugName: "$allFilterDirectives" } : {}) });
|
|
6755
|
+
this.$tableBuilderMetaData = computed(() => this.$tableBuilder()?.$metaData(), { ...(ngDevMode ? { debugName: "$tableBuilderMetaData" } : {}) });
|
|
6778
6756
|
this.$allMetaDatas = computed(() => {
|
|
6779
6757
|
const tableBuilderMetaData = this.$tableBuilderMetaData();
|
|
6780
6758
|
if (!tableBuilderMetaData)
|
|
@@ -6782,16 +6760,11 @@ class TableContainerComponent {
|
|
|
6782
6760
|
const customCellMetaDatas = this.$customCells().filter(cc => cc.$inited()).map(cc => cc.$metaData()).filter(d => !!d);
|
|
6783
6761
|
const mappedCustomCellMetaDatas = customCellMetaDatas.map(md => mergeCustomCellMetaData(md, tableBuilderMetaData.find(item => item.key === md.key)));
|
|
6784
6762
|
return [...tableBuilderMetaData, ...mappedCustomCellMetaDatas];
|
|
6785
|
-
}, ...(ngDevMode ?
|
|
6786
|
-
this.$allMetaDataTimeStamped = linkedSignal(...(ngDevMode ?
|
|
6787
|
-
|
|
6788
|
-
|
|
6789
|
-
|
|
6790
|
-
source: this.$allMetaDatas,
|
|
6791
|
-
computation: (curr, previous) => {
|
|
6792
|
-
return { timestamp: Date.now(), value: curr || [], previous: previous?.value.value || [] };
|
|
6793
|
-
}
|
|
6794
|
-
}]));
|
|
6763
|
+
}, { ...(ngDevMode ? { debugName: "$allMetaDatas" } : {}) });
|
|
6764
|
+
this.$allMetaDataTimeStamped = linkedSignal({ ...(ngDevMode ? { debugName: "$allMetaDataTimeStamped" } : {}), source: this.$allMetaDatas,
|
|
6765
|
+
computation: (curr, previous) => {
|
|
6766
|
+
return { timestamp: Date.now(), value: curr || [], previous: previous?.value.value || [] };
|
|
6767
|
+
} });
|
|
6795
6768
|
this.#setUpAllValuesFilters = effect(() => {
|
|
6796
6769
|
const data = this.$allDataTimeStamped();
|
|
6797
6770
|
const allMeta = this.$allMetaDataTimeStamped();
|
|
@@ -6802,7 +6775,7 @@ class TableContainerComponent {
|
|
|
6802
6775
|
const mapped = buildInAllValuesFilter(this.config, allMeta.previous, allMeta.value, data.value, allMeta.timestamp, data.timestamp, currentAll);
|
|
6803
6776
|
this.state.patchState({ allFilters: mapped });
|
|
6804
6777
|
});
|
|
6805
|
-
}, ...(ngDevMode ?
|
|
6778
|
+
}, { ...(ngDevMode ? { debugName: "#setUpAllValuesFilters" } : {}) });
|
|
6806
6779
|
this.$preds = computed(() => {
|
|
6807
6780
|
const predicateInputFilters = this.$inputFilters().filter(isFunction);
|
|
6808
6781
|
const notSavableFilterDirectives = this.$allFilterDirectives()
|
|
@@ -6811,56 +6784,33 @@ class TableContainerComponent {
|
|
|
6811
6784
|
.filter(d => !!d && needsFilterCreation(d))
|
|
6812
6785
|
.map(d => createFilterFunc(d));
|
|
6813
6786
|
return [...predicateInputFilters, ...notSavableFilterDirectives];
|
|
6814
|
-
}, ...(ngDevMode ?
|
|
6815
|
-
this.$predicateFiltersState = linkedSignal(...(ngDevMode ?
|
|
6816
|
-
|
|
6817
|
-
|
|
6818
|
-
|
|
6819
|
-
|
|
6820
|
-
|
|
6821
|
-
|
|
6822
|
-
|
|
6823
|
-
|
|
6824
|
-
|
|
6825
|
-
|
|
6826
|
-
|
|
6827
|
-
}]));
|
|
6828
|
-
this.$savableFiltersState = linkedSignal(...(ngDevMode ? [{ debugName: "$savableFiltersState", source: this.state.$filters,
|
|
6829
|
-
computation: (curr, previous) => {
|
|
6830
|
-
if (!previous?.value)
|
|
6831
|
-
return ({ value: updateFilterInfoState({ allFilters: {} }, curr), timestamp: Date.now() });
|
|
6832
|
-
return ({ value: updateFilterInfoState(previous.value.value, curr), timestamp: Date.now() });
|
|
6833
|
-
} }] : [{
|
|
6834
|
-
source: this.state.$filters,
|
|
6835
|
-
computation: (curr, previous) => {
|
|
6836
|
-
if (!previous?.value)
|
|
6837
|
-
return ({ value: updateFilterInfoState({ allFilters: {} }, curr), timestamp: Date.now() });
|
|
6838
|
-
return ({ value: updateFilterInfoState(previous.value.value, curr), timestamp: Date.now() });
|
|
6839
|
-
}
|
|
6840
|
-
}]));
|
|
6787
|
+
}, { ...(ngDevMode ? { debugName: "$preds" } : {}) });
|
|
6788
|
+
this.$predicateFiltersState = linkedSignal({ ...(ngDevMode ? { debugName: "$predicateFiltersState" } : {}), source: this.$preds,
|
|
6789
|
+
computation: (curr, previous) => {
|
|
6790
|
+
if (!previous?.value)
|
|
6791
|
+
return ({ value: updateFilterPredicateState({ allFilters: [] }, curr), timestamp: Date.now() });
|
|
6792
|
+
return ({ value: updateFilterPredicateState(previous.value.value, curr), timestamp: Date.now() });
|
|
6793
|
+
} });
|
|
6794
|
+
this.$savableFiltersState = linkedSignal({ ...(ngDevMode ? { debugName: "$savableFiltersState" } : {}), source: this.state.$filters,
|
|
6795
|
+
computation: (curr, previous) => {
|
|
6796
|
+
if (!previous?.value)
|
|
6797
|
+
return ({ value: updateFilterInfoState({ allFilters: {} }, curr), timestamp: Date.now() });
|
|
6798
|
+
return ({ value: updateFilterInfoState(previous.value.value, curr), timestamp: Date.now() });
|
|
6799
|
+
} });
|
|
6841
6800
|
this.$allFilterStatesTimeStamped = computed(() => {
|
|
6842
6801
|
if (!this.$isInitializationState(InitializationState.Ready)())
|
|
6843
6802
|
return undefined;
|
|
6844
6803
|
return ({ value: updateFilterState(this.$savableFiltersState(), this.$predicateFiltersState()), timestamp: Date.now() });
|
|
6845
|
-
}, ...(ngDevMode ?
|
|
6846
|
-
this.$sortStateTimeStamped = linkedSignal(...(ngDevMode ?
|
|
6847
|
-
|
|
6848
|
-
|
|
6849
|
-
|
|
6850
|
-
|
|
6851
|
-
|
|
6852
|
-
|
|
6853
|
-
|
|
6854
|
-
|
|
6855
|
-
computation: (curr, prev) => {
|
|
6856
|
-
if (!curr)
|
|
6857
|
-
return undefined;
|
|
6858
|
-
if (!prev?.value)
|
|
6859
|
-
return ({ value: updateSortState(initialSortState, curr), timestamp: Date.now() });
|
|
6860
|
-
return ({ value: updateSortState(prev.value.value, curr), timestamp: Date.now() });
|
|
6861
|
-
}
|
|
6862
|
-
}]));
|
|
6863
|
-
this.$allData = computed(() => (this.$tableBuilder()?.$initialized() && this.$tableBuilder()?.$data()) || [], ...(ngDevMode ? [{ debugName: "$allData" }] : []));
|
|
6804
|
+
}, { ...(ngDevMode ? { debugName: "$allFilterStatesTimeStamped" } : {}) });
|
|
6805
|
+
this.$sortStateTimeStamped = linkedSignal({ ...(ngDevMode ? { debugName: "$sortStateTimeStamped" } : {}), source: computed(() => this.$isInitializationState(InitializationState.Ready)() && this.state.$getSorts()),
|
|
6806
|
+
computation: (curr, prev) => {
|
|
6807
|
+
if (!curr)
|
|
6808
|
+
return undefined;
|
|
6809
|
+
if (!prev?.value)
|
|
6810
|
+
return ({ value: updateSortState(initialSortState, curr), timestamp: Date.now() });
|
|
6811
|
+
return ({ value: updateSortState(prev.value.value, curr), timestamp: Date.now() });
|
|
6812
|
+
} });
|
|
6813
|
+
this.$allData = computed(() => (this.$tableBuilder()?.$initialized() && this.$tableBuilder()?.$data()) || [], { ...(ngDevMode ? { debugName: "$allData" } : {}) });
|
|
6864
6814
|
this.$allDataTimeStamped = computed(() => {
|
|
6865
6815
|
const data = this.$allData();
|
|
6866
6816
|
if (!data)
|
|
@@ -6869,7 +6819,7 @@ class TableContainerComponent {
|
|
|
6869
6819
|
value: data,
|
|
6870
6820
|
timestamp: Date.now()
|
|
6871
6821
|
});
|
|
6872
|
-
}, ...(ngDevMode ?
|
|
6822
|
+
}, { ...(ngDevMode ? { debugName: "$allDataTimeStamped" } : {}) });
|
|
6873
6823
|
this.$allTimeStamped = computed(() => {
|
|
6874
6824
|
const data = this.$allDataTimeStamped();
|
|
6875
6825
|
const sort = this.$sortStateTimeStamped();
|
|
@@ -6881,31 +6831,20 @@ class TableContainerComponent {
|
|
|
6881
6831
|
sort,
|
|
6882
6832
|
filter
|
|
6883
6833
|
});
|
|
6884
|
-
}, ...(ngDevMode ?
|
|
6885
|
-
this.$sortedAndFilteredData = linkedSignal(...(ngDevMode ?
|
|
6886
|
-
|
|
6887
|
-
|
|
6888
|
-
|
|
6889
|
-
|
|
6890
|
-
|
|
6891
|
-
|
|
6892
|
-
|
|
6893
|
-
|
|
6894
|
-
|
|
6895
|
-
|
|
6896
|
-
|
|
6897
|
-
|
|
6898
|
-
if (!values || !init)
|
|
6899
|
-
return undefined;
|
|
6900
|
-
const { data, filter, sort } = values;
|
|
6901
|
-
const val = prev?.value?.value || data.value;
|
|
6902
|
-
const filteredData = sortAndFilterData(data, filter, sort, !prev?.value, val);
|
|
6903
|
-
return ({ value: filteredData, timestamp: Date.now() });
|
|
6904
|
-
}
|
|
6905
|
-
}]));
|
|
6906
|
-
this.$timestampedGroups = computed(() => ({ value: this.state.$groupByData(), timestamp: Date.now() }), ...(ngDevMode ? [{ debugName: "$timestampedGroups" }] : []));
|
|
6907
|
-
this.$timestampedExpanded = computed(() => ({ value: this.state.$expandGroups(), timestamp: Date.now() }), ...(ngDevMode ? [{ debugName: "$timestampedExpanded" }] : []));
|
|
6908
|
-
this.$timestampedGroupSortUpdated = computed(() => ({ value: this.state.$sortedGroupsUpdates(), timestamp: Date.now() }), ...(ngDevMode ? [{ debugName: "$timestampedGroupSortUpdated" }] : []));
|
|
6834
|
+
}, { ...(ngDevMode ? { debugName: "$allTimeStamped" } : {}) });
|
|
6835
|
+
this.$sortedAndFilteredData = linkedSignal({ ...(ngDevMode ? { debugName: "$sortedAndFilteredData" } : {}), source: this.$allTimeStamped,
|
|
6836
|
+
computation: (values, prev) => {
|
|
6837
|
+
const init = this.$isInitializationState(InitializationState.Ready);
|
|
6838
|
+
if (!values || !init)
|
|
6839
|
+
return undefined;
|
|
6840
|
+
const { data, filter, sort } = values;
|
|
6841
|
+
const val = prev?.value?.value || data.value;
|
|
6842
|
+
const filteredData = sortAndFilterData(data, filter, sort, !prev?.value, val);
|
|
6843
|
+
return ({ value: filteredData, timestamp: Date.now() });
|
|
6844
|
+
} });
|
|
6845
|
+
this.$timestampedGroups = computed(() => ({ value: this.state.$groupByData(), timestamp: Date.now() }), { ...(ngDevMode ? { debugName: "$timestampedGroups" } : {}) });
|
|
6846
|
+
this.$timestampedExpanded = computed(() => ({ value: this.state.$expandGroups(), timestamp: Date.now() }), { ...(ngDevMode ? { debugName: "$timestampedExpanded" } : {}) });
|
|
6847
|
+
this.$timestampedGroupSortUpdated = computed(() => ({ value: this.state.$sortedGroupsUpdates(), timestamp: Date.now() }), { ...(ngDevMode ? { debugName: "$timestampedGroupSortUpdated" } : {}) });
|
|
6909
6848
|
this.$dataAndGroupsTimestamped = computed(() => {
|
|
6910
6849
|
const data = this.$sortedAndFilteredData();
|
|
6911
6850
|
const groups = this.$timestampedGroups();
|
|
@@ -6919,22 +6858,14 @@ class TableContainerComponent {
|
|
|
6919
6858
|
expanded,
|
|
6920
6859
|
groupSorts,
|
|
6921
6860
|
});
|
|
6922
|
-
}, ...(ngDevMode ?
|
|
6923
|
-
this.$filteredSortedAndGrouped = linkedSignal(...(ngDevMode ?
|
|
6924
|
-
|
|
6925
|
-
|
|
6926
|
-
|
|
6927
|
-
|
|
6928
|
-
|
|
6929
|
-
|
|
6930
|
-
source: this.$dataAndGroupsTimestamped,
|
|
6931
|
-
computation: (curr, prev) => {
|
|
6932
|
-
if (!curr)
|
|
6933
|
-
return undefined;
|
|
6934
|
-
const val = prev?.value?.groupedData || [];
|
|
6935
|
-
return updateGroupByState(val, curr, !prev?.value, this.state.$metaData());
|
|
6936
|
-
}
|
|
6937
|
-
}]));
|
|
6861
|
+
}, { ...(ngDevMode ? { debugName: "$dataAndGroupsTimestamped" } : {}) });
|
|
6862
|
+
this.$filteredSortedAndGrouped = linkedSignal({ ...(ngDevMode ? { debugName: "$filteredSortedAndGrouped" } : {}), source: this.$dataAndGroupsTimestamped,
|
|
6863
|
+
computation: (curr, prev) => {
|
|
6864
|
+
if (!curr)
|
|
6865
|
+
return undefined;
|
|
6866
|
+
const val = prev?.value?.groupedData || [];
|
|
6867
|
+
return updateGroupByState(val, curr, !prev?.value, this.state.$metaData());
|
|
6868
|
+
} });
|
|
6938
6869
|
this.$isInitializationState = (state) => computed(() => this.state.selectSignal(s => s.initializationState >= state)());
|
|
6939
6870
|
this.headerId = TableContainerComponent.headerId;
|
|
6940
6871
|
}
|
|
@@ -6960,10 +6891,10 @@ class TableContainerComponent {
|
|
|
6960
6891
|
#destroyRef;
|
|
6961
6892
|
#setUpAllValuesFilters;
|
|
6962
6893
|
static { this.headerId = 'tb-header-wrapper'; }
|
|
6963
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
6964
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.0", type: TableContainerComponent, isStandalone: true, selector: "tb-table-container", inputs: { $tableBuilder: { classPropertyName: "$tableBuilder", publicName: "tableBuilder", isSignal: true, isRequired: true, transformFunction: null }, $tableIdInput: { classPropertyName: "$tableIdInput", publicName: "tableId", isSignal: true, isRequired: false, transformFunction: null }, $trackByInput: { classPropertyName: "$trackByInput", publicName: "trackBy", isSignal: true, isRequired: false, transformFunction: null }, $inputFilters: { classPropertyName: "$inputFilters", publicName: "inputFilters", isSignal: true, isRequired: false, transformFunction: null }, $indexColumnInput: { classPropertyName: "$indexColumnInput", publicName: "indexColumn", isSignal: true, isRequired: false, transformFunction: null }, $selectionColumnInput: { classPropertyName: "$selectionColumnInput", publicName: "selectionColumn", isSignal: true, isRequired: false, transformFunction: null }, $stickyHeaderInput: { classPropertyName: "$stickyHeaderInput", publicName: "stickyHeader", isSignal: true, isRequired: false, transformFunction: null }, $stickyFooterInput: { classPropertyName: "$stickyFooterInput", publicName: "stickyFooter", isSignal: true, isRequired: false, transformFunction: null }, $groupHeaderTemplate: { classPropertyName: "$groupHeaderTemplate", publicName: "groupHeaderTemplate", isSignal: true, isRequired: false, transformFunction: null }, $groupHeaderHeight: { classPropertyName: "$groupHeaderHeight", publicName: "groupHeaderHeight", isSignal: true, isRequired: false, transformFunction: null }, $pageSize: { classPropertyName: "$pageSize", publicName: "pageSize", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selection$: "selection", onStateReset$: "onStateReset", onSaveState$: "onSaveState", state$: "state", data$: "data", sortedAndFilteredAndGroupedData$: "sortedAndFilteredAndGroupedData" }, providers: [TableStore, ExportToCsvService, WrapperFilterStore, DataStore], queries: [{ propertyName: "$filterDirectives", predicate: TableFilterDirective, descendants: true, isSignal: true }, { propertyName: "$customFilterDirectives", predicate: TableCustomFilterDirective, descendants: true, isSignal: true }, { propertyName: "_$customRows", predicate: (MatRowDef), isSignal: true }, { propertyName: "$customCells", predicate: CustomCellDirective, isSignal: true }, { propertyName: "$customGroupRows", predicate: CustomGroupRowDirective, isSignal: true }], viewQueries: [{ propertyName: "$paginatorComponent", first: true, predicate: PaginatorComponent, descendants: true, isSignal: true }, { propertyName: "$paginatorWrapper", first: true, predicate: ["paginatorWrapper"], descendants: true, isSignal: true }, { propertyName: "$genericTable", first: true, predicate: GenericTableComponent, descendants: true, isSignal: true }, { propertyName: "$menu", first: true, predicate: MatMenu, descendants: true, isSignal: true }], ngImport: i0, template: "@let tableId = $tableId();\r\n@let tableSettings = state.$tableSettings();\r\n\r\n<ng-content select=\"[before]\" />\r\n<ng-container multiSort>\r\n <div class=\"tb-header-wrapper\" [id]=\"headerId\">\r\n <div class=\"title\">\r\n @if ((!$collapsedHeader()) || tableSettings.showTitleWhenHeaderCollapsed)\r\n {\r\n <ng-content select=\".tb-header-title\"/>\r\n @if (tableSettings.title)\r\n {\r\n @switch (tableSettings.title.level)\r\n {\r\n @case (1) { <h1 class=\"tb-container-title\" [style]=\"tableSettings.title.styles\">{{tableSettings.title.text}}</h1>}\r\n @case (2) { <h2 class=\"tb-container-title\" [style]=\"tableSettings.title.styles\">{{tableSettings.title.text}}</h2>}\r\n @case (4) { <h4 class=\"tb-container-title\" [style]=\"tableSettings.title.styles\">{{tableSettings.title.text}}</h4>}\r\n @case (5) { <h5 class=\"tb-container-title\" [style]=\"tableSettings.title.styles\">{{tableSettings.title.text}}</h5>}\r\n @case (6) { <h6 class=\"tb-container-title\" [style]=\"tableSettings.title.styles\">{{tableSettings.title.text}}</h6>}\r\n @default { <h3 class=\"tb-container-title\" [style]=\"tableSettings.title.styles\">{{tableSettings.title.text}}</h3>}\r\n }\r\n }\r\n }\r\n </div>\r\n @if(state.$groupByData().length)\r\n {\r\n <group-by-list />\r\n }\r\n <div class=\"flx-row-end\">\r\n <lib-filter-list />\r\n @if (!tableSettings.hideHeader)\r\n {\r\n @if (!$collapsedHeader())\r\n {\r\n <ng-container *ngTemplateOutlet=\"headerMenu\"/>\r\n <button mat-icon-button color='primary' [matMenuTriggerFor]=\"mainMenu\">\r\n <mat-icon>more_vert</mat-icon>\r\n </button>\r\n <mat-menu #mainMenu='matMenu' [xPosition]=\"'before'\">\r\n <lib-table-header-menu #l/>\r\n </mat-menu>\r\n\r\n }\r\n @else\r\n {\r\n <mat-icon color=\"primary\" class=\"flat-menu-button pointer\" [matMenuTriggerFor]=\"mainMenu\">more_horiz</mat-icon>\r\n <mat-menu #mainMenu='matMenu'>\r\n <div class=\"collapsed-head-row\">\r\n <ng-container *ngTemplateOutlet=\"headerMenu; injector menuInjector\"/>\r\n </div>\r\n <lib-table-header-menu />\r\n </mat-menu>\r\n }\r\n <mat-icon class=\"collapse-icon header\" [matTooltip]=\"$collapsedHeader() ? 'expand' : 'collapse'\"\r\n (click)=\"state.toggleCollapseHeader()\">\r\n {{$collapsedHeader() ? 'expand_less' : 'expand_more'}}\r\n </mat-icon>\r\n }\r\n\r\n </div>\r\n </div>\r\n\r\n @if($useVirtual())\r\n {\r\n <tb-virtual-scroll-container class=\"scrollable\">\r\n <tb-generic-table [rows]=\"$customRows()\" [data]=\"$data()!\" [displayData]=\"$filteredSortedAndGrouped()?.displayData || []\"\r\n [columnInfos]='$myColumns()' [trackBy]=\"$trackBy()\" [dataSource]=\"dataSource\" (selection)='_selection$.next($event)' />\r\n </tb-virtual-scroll-container>\r\n }\r\n @else\r\n {\r\n <tb-generic-table [rows]=\"$customRows()\" [data]=\"$data()!\" [displayData]=\"$filteredSortedAndGrouped()?.displayData || []\"\r\n [columnInfos]='$myColumns()' [trackBy]=\"$trackBy()\" [dataSource]=\"dataSource\" (selection)='_selection$.next($event)' />\r\n }\r\n @if(tableSettings.usePaginator)\r\n {\r\n <div #paginatorWrapper class=\"paginator tb-paginator-wrapper\">\r\n <tb-paginator #tbPaginator />\r\n\r\n <mat-icon class=\"collapse-icon footer\" [matTooltip]=\"$collapsedFooter() ? 'expand' : 'collapse'\"\r\n (click)=\"state.toggleCollapseFooter()\">\r\n {{$collapsedFooter() ? 'expand_more' : 'expand_less'}}\r\n </mat-icon>\r\n </div>\r\n }\r\n</ng-container>\r\n\r\n<ng-template #headerMenu>\r\n @if (!tableSettings.hideFilter) {<tb-filter-displayer/>}\r\n @if (!tableSettings.hideColumnSettings) {<tb-col-displayer/>}\r\n @if (!tableSettings.hideSort) {<tb-sort-menu/>}\r\n @if (!!tableId && !$collapsedHeader()) {<tb-profiles-menu [tableId]=\"tableId\"/>}\r\n</ng-template>\r\n", styles: [".tb-header-wrapper{display:flex;flex-direction:row;width:100%}.flx-row-end{display:flex;flex-direction:row;justify-content:flex-end;align-items:center;margin-left:auto}.flat-menu{line-height:initial;height:initial}.pointer{cursor:pointer}.add-key{width:90%}.paginator{display:flex;flex-direction:row;justify-content:flex-end;align-items:center;background-color:#fff;bottom:0;position:sticky;border-top:.5px solid rgba(0,0,0,.12)}.profiles-menu{visibility:hidden;width:0px;height:0px;display:block;overflow:hidden;position:absolute;top:50px}.collapsed-head-row{display:flex;justify-content:space-evenly}::ng-deep tb-generic-table .mat-mdc-row:nth-child(odd):not(.no-stripe){background-color:var(--tb-odd-row-background-color, #cdeefe)}.tb-container-title{padding-left:var(--tb-container-title-padding-left, 10px);margin:var(--tb-container-title-margin, 0)}\n", ".collapse-icon{font-size:16px;height:16px;color:#3f51b5;align-self:flex-start}.collapse-icon:hover{cursor:pointer}.hide{display:none}.paginator-row{display:flex;align-items:center}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: PaginatorComponent, selector: "tb-paginator" }, { kind: "directive", type: MultiSortDirective, selector: "[multiSort]", inputs: ["matSortDisabled"], exportAs: ["multiSort"] }, { kind: "component", type: GroupByListComponent, selector: "group-by-list" }, { kind: "component", type: FilterChipsComponent, selector: "lib-filter-list" }, { kind: "component", type: GenFilterDisplayerComponent, selector: "tb-filter-displayer" }, { kind: "component", type: GenColDisplayerComponent, selector: "tb-col-displayer" }, { kind: "component", type: SortMenuComponent, selector: "tb-sort-menu" }, { kind: "component", type: GenericTableComponent, selector: "tb-generic-table", inputs: ["displayData", "data", "rows", "columnInfos", "dataSource", "trackBy"], outputs: ["selection"] }, { kind: "component", type: ProfilesMenuComponent, selector: "tb-profiles-menu", inputs: ["tableId", "isMatMenuChild"] }, { kind: "component", type: TableHeaderMenuComponent, selector: "lib-table-header-menu" }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { 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: "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: "ngmodule", type: MatIconModule }, { kind: "component", type: i2$2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: VirtualScrollContainer, selector: "tb-virtual-scroll-container" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
6894
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: TableContainerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
6895
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.2", type: TableContainerComponent, isStandalone: true, selector: "tb-table-container", inputs: { $tableBuilder: { classPropertyName: "$tableBuilder", publicName: "tableBuilder", isSignal: true, isRequired: true, transformFunction: null }, $tableIdInput: { classPropertyName: "$tableIdInput", publicName: "tableId", isSignal: true, isRequired: false, transformFunction: null }, $trackByInput: { classPropertyName: "$trackByInput", publicName: "trackBy", isSignal: true, isRequired: false, transformFunction: null }, $inputFilters: { classPropertyName: "$inputFilters", publicName: "inputFilters", isSignal: true, isRequired: false, transformFunction: null }, $indexColumnInput: { classPropertyName: "$indexColumnInput", publicName: "indexColumn", isSignal: true, isRequired: false, transformFunction: null }, $selectionColumnInput: { classPropertyName: "$selectionColumnInput", publicName: "selectionColumn", isSignal: true, isRequired: false, transformFunction: null }, $stickyHeaderInput: { classPropertyName: "$stickyHeaderInput", publicName: "stickyHeader", isSignal: true, isRequired: false, transformFunction: null }, $stickyFooterInput: { classPropertyName: "$stickyFooterInput", publicName: "stickyFooter", isSignal: true, isRequired: false, transformFunction: null }, $groupHeaderTemplate: { classPropertyName: "$groupHeaderTemplate", publicName: "groupHeaderTemplate", isSignal: true, isRequired: false, transformFunction: null }, $groupHeaderHeight: { classPropertyName: "$groupHeaderHeight", publicName: "groupHeaderHeight", isSignal: true, isRequired: false, transformFunction: null }, $pageSize: { classPropertyName: "$pageSize", publicName: "pageSize", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selection$: "selection", onStateReset$: "onStateReset", onSaveState$: "onSaveState", state$: "state", data$: "data", sortedAndFilteredAndGroupedData$: "sortedAndFilteredAndGroupedData" }, providers: [TableStore, ExportToCsvService, WrapperFilterStore, DataStore], queries: [{ propertyName: "$filterDirectives", predicate: TableFilterDirective, descendants: true, isSignal: true }, { propertyName: "$customFilterDirectives", predicate: TableCustomFilterDirective, descendants: true, isSignal: true }, { propertyName: "_$customRows", predicate: (MatRowDef), isSignal: true }, { propertyName: "$customCells", predicate: CustomCellDirective, isSignal: true }, { propertyName: "$customGroupRows", predicate: CustomGroupRowDirective, isSignal: true }], viewQueries: [{ propertyName: "$paginatorComponent", first: true, predicate: PaginatorComponent, descendants: true, isSignal: true }, { propertyName: "$paginatorWrapper", first: true, predicate: ["paginatorWrapper"], descendants: true, isSignal: true }, { propertyName: "$genericTable", first: true, predicate: GenericTableComponent, descendants: true, isSignal: true }, { propertyName: "$menu", first: true, predicate: MatMenu, descendants: true, isSignal: true }], ngImport: i0, template: "@let tableId = $tableId();\r\n@let tableSettings = state.$tableSettings();\r\n\r\n<ng-content select=\"[before]\" />\r\n<ng-container multiSort>\r\n <div class=\"tb-header-wrapper\" [id]=\"headerId\">\r\n <div class=\"title\">\r\n @if ((!$collapsedHeader()) || tableSettings.showTitleWhenHeaderCollapsed)\r\n {\r\n <ng-content select=\".tb-header-title\"/>\r\n @if (tableSettings.title)\r\n {\r\n @switch (tableSettings.title.level)\r\n {\r\n @case (1) { <h1 class=\"tb-container-title\" [style]=\"tableSettings.title.styles\">{{tableSettings.title.text}}</h1>}\r\n @case (2) { <h2 class=\"tb-container-title\" [style]=\"tableSettings.title.styles\">{{tableSettings.title.text}}</h2>}\r\n @case (4) { <h4 class=\"tb-container-title\" [style]=\"tableSettings.title.styles\">{{tableSettings.title.text}}</h4>}\r\n @case (5) { <h5 class=\"tb-container-title\" [style]=\"tableSettings.title.styles\">{{tableSettings.title.text}}</h5>}\r\n @case (6) { <h6 class=\"tb-container-title\" [style]=\"tableSettings.title.styles\">{{tableSettings.title.text}}</h6>}\r\n @default { <h3 class=\"tb-container-title\" [style]=\"tableSettings.title.styles\">{{tableSettings.title.text}}</h3>}\r\n }\r\n }\r\n }\r\n </div>\r\n @if(state.$groupByData().length)\r\n {\r\n <group-by-list />\r\n }\r\n <div class=\"flx-row-end\">\r\n <lib-filter-list />\r\n @if (!tableSettings.hideHeader)\r\n {\r\n @if (!$collapsedHeader())\r\n {\r\n <ng-container *ngTemplateOutlet=\"headerMenu\"/>\r\n <button mat-icon-button color='primary' [matMenuTriggerFor]=\"mainMenu\">\r\n <mat-icon>more_vert</mat-icon>\r\n </button>\r\n <mat-menu #mainMenu='matMenu' [xPosition]=\"'before'\">\r\n <lib-table-header-menu #l/>\r\n </mat-menu>\r\n\r\n }\r\n @else\r\n {\r\n <mat-icon color=\"primary\" class=\"flat-menu-button pointer\" [matMenuTriggerFor]=\"mainMenu\">more_horiz</mat-icon>\r\n <mat-menu #mainMenu='matMenu'>\r\n <div class=\"collapsed-head-row\">\r\n <ng-container *ngTemplateOutlet=\"headerMenu; injector menuInjector\"/>\r\n </div>\r\n <lib-table-header-menu />\r\n </mat-menu>\r\n }\r\n <mat-icon class=\"collapse-icon header\" [matTooltip]=\"$collapsedHeader() ? 'expand' : 'collapse'\"\r\n (click)=\"state.toggleCollapseHeader()\">\r\n {{$collapsedHeader() ? 'expand_less' : 'expand_more'}}\r\n </mat-icon>\r\n }\r\n\r\n </div>\r\n </div>\r\n\r\n @if($useVirtual())\r\n {\r\n <tb-virtual-scroll-container class=\"scrollable\">\r\n <tb-generic-table [rows]=\"$customRows()\" [data]=\"$data()!\" [displayData]=\"$filteredSortedAndGrouped()?.displayData || []\"\r\n [columnInfos]='$myColumns()' [trackBy]=\"$trackBy()\" [dataSource]=\"dataSource\" (selection)='_selection$.next($event)' />\r\n </tb-virtual-scroll-container>\r\n }\r\n @else\r\n {\r\n <tb-generic-table [rows]=\"$customRows()\" [data]=\"$data()!\" [displayData]=\"$filteredSortedAndGrouped()?.displayData || []\"\r\n [columnInfos]='$myColumns()' [trackBy]=\"$trackBy()\" [dataSource]=\"dataSource\" (selection)='_selection$.next($event)' />\r\n }\r\n @if(tableSettings.usePaginator)\r\n {\r\n <div #paginatorWrapper class=\"paginator tb-paginator-wrapper\">\r\n <tb-paginator #tbPaginator />\r\n\r\n <mat-icon class=\"collapse-icon footer\" [matTooltip]=\"$collapsedFooter() ? 'expand' : 'collapse'\"\r\n (click)=\"state.toggleCollapseFooter()\">\r\n {{$collapsedFooter() ? 'expand_more' : 'expand_less'}}\r\n </mat-icon>\r\n </div>\r\n }\r\n</ng-container>\r\n\r\n<ng-template #headerMenu>\r\n @if (!tableSettings.hideFilter) {<tb-filter-displayer/>}\r\n @if (!tableSettings.hideColumnSettings) {<tb-col-displayer/>}\r\n @if (!tableSettings.hideSort) {<tb-sort-menu/>}\r\n @if (!!tableId && !$collapsedHeader()) {<tb-profiles-menu [tableId]=\"tableId\"/>}\r\n</ng-template>\r\n", styles: [".tb-header-wrapper{display:flex;flex-direction:row;width:100%}.flx-row-end{display:flex;flex-direction:row;justify-content:flex-end;align-items:center;margin-left:auto}.flat-menu{line-height:initial;height:initial}.pointer{cursor:pointer}.add-key{width:90%}.paginator{display:flex;flex-direction:row;justify-content:flex-end;align-items:center;background-color:#fff;bottom:0;position:sticky;border-top:.5px solid rgba(0,0,0,.12)}.profiles-menu{visibility:hidden;width:0px;height:0px;display:block;overflow:hidden;position:absolute;top:50px}.collapsed-head-row{display:flex;justify-content:space-evenly}::ng-deep tb-generic-table .mat-mdc-row:nth-child(odd):not(.no-stripe){background-color:var(--tb-odd-row-background-color, #cdeefe)}.tb-container-title{padding-left:var(--tb-container-title-padding-left, 10px);margin:var(--tb-container-title-margin, 0)}\n", ".collapse-icon{font-size:16px;height:16px;color:#3f51b5;align-self:flex-start}.collapse-icon:hover{cursor:pointer}.hide{display:none}.paginator-row{display:flex;align-items:center}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: PaginatorComponent, selector: "tb-paginator" }, { kind: "directive", type: MultiSortDirective, selector: "[multiSort]", inputs: ["matSortDisabled"], exportAs: ["multiSort"] }, { kind: "component", type: GroupByListComponent, selector: "group-by-list" }, { kind: "component", type: FilterChipsComponent, selector: "lib-filter-list" }, { kind: "component", type: GenFilterDisplayerComponent, selector: "tb-filter-displayer" }, { kind: "component", type: GenColDisplayerComponent, selector: "tb-col-displayer" }, { kind: "component", type: SortMenuComponent, selector: "tb-sort-menu" }, { kind: "component", type: GenericTableComponent, selector: "tb-generic-table", inputs: ["displayData", "data", "rows", "columnInfos", "dataSource", "trackBy"], outputs: ["selection"] }, { kind: "component", type: ProfilesMenuComponent, selector: "tb-profiles-menu", inputs: ["tableId", "isMatMenuChild"] }, { kind: "component", type: TableHeaderMenuComponent, selector: "lib-table-header-menu" }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { 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: "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: "ngmodule", type: MatIconModule }, { kind: "component", type: i2$2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: VirtualScrollContainer, selector: "tb-virtual-scroll-container" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
6965
6896
|
}
|
|
6966
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
6897
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: TableContainerComponent, decorators: [{
|
|
6967
6898
|
type: Component,
|
|
6968
6899
|
args: [{ selector: 'tb-table-container', changeDetection: ChangeDetectionStrategy.OnPush, providers: [TableStore, ExportToCsvService, WrapperFilterStore, DataStore], imports: [
|
|
6969
6900
|
NgTemplateOutlet,
|
|
@@ -6986,8 +6917,8 @@ class TableBuilderModule {
|
|
|
6986
6917
|
]
|
|
6987
6918
|
};
|
|
6988
6919
|
}
|
|
6989
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
6990
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.0.
|
|
6920
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: TableBuilderModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
6921
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.0.2", ngImport: i0, type: TableBuilderModule, imports: [TableContainerComponent,
|
|
6991
6922
|
CustomCellDirective,
|
|
6992
6923
|
CustomGroupRowDirective,
|
|
6993
6924
|
TableFilterDirective,
|
|
@@ -6998,11 +6929,11 @@ class TableBuilderModule {
|
|
|
6998
6929
|
TableFilterStringContainsDirective,
|
|
6999
6930
|
TableWrapperDirective,
|
|
7000
6931
|
UtilitiesModule] }); }
|
|
7001
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.0.
|
|
6932
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: TableBuilderModule, providers: [
|
|
7002
6933
|
MultiSortDirective,
|
|
7003
6934
|
], imports: [TableContainerComponent, UtilitiesModule] }); }
|
|
7004
6935
|
}
|
|
7005
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
6936
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: TableBuilderModule, decorators: [{
|
|
7006
6937
|
type: NgModule,
|
|
7007
6938
|
args: [{
|
|
7008
6939
|
imports: [
|
|
@@ -7059,21 +6990,21 @@ class TableBuilder {
|
|
|
7059
6990
|
this.data = data;
|
|
7060
6991
|
this.metaData = metaData;
|
|
7061
6992
|
this.settings = settings;
|
|
7062
|
-
this._container = signal(undefined, ...(ngDevMode ?
|
|
6993
|
+
this._container = signal(undefined, { ...(ngDevMode ? { debugName: "_container" } : {}) });
|
|
7063
6994
|
this.container = this._container.asReadonly();
|
|
7064
|
-
this.$metaData = computed(() => this.$initialized() ? this.#$metaData() : undefined, ...(ngDevMode ?
|
|
7065
|
-
this.$settings = computed(() => this.$initialized() ? this.#$settings() : undefined, ...(ngDevMode ?
|
|
7066
|
-
this.#$metaNeedsPrep = signal(false, ...(ngDevMode ?
|
|
7067
|
-
this.#$dataIsObservable = signal(false, ...(ngDevMode ?
|
|
7068
|
-
this.#$settingsIsObservable = signal(false, ...(ngDevMode ?
|
|
7069
|
-
this.#$needsPrep = computed(() => this.#$dataIsObservable() || this.#$metaNeedsPrep() || this.#$settingsIsObservable(), ...(ngDevMode ?
|
|
7070
|
-
this.$initialized = signal(false, ...(ngDevMode ?
|
|
6995
|
+
this.$metaData = computed(() => this.$initialized() ? this.#$metaData() : undefined, { ...(ngDevMode ? { debugName: "$metaData" } : {}) });
|
|
6996
|
+
this.$settings = computed(() => this.$initialized() ? this.#$settings() : undefined, { ...(ngDevMode ? { debugName: "$settings" } : {}) });
|
|
6997
|
+
this.#$metaNeedsPrep = signal(false, { ...(ngDevMode ? { debugName: "#$metaNeedsPrep" } : {}) });
|
|
6998
|
+
this.#$dataIsObservable = signal(false, { ...(ngDevMode ? { debugName: "#$dataIsObservable" } : {}) });
|
|
6999
|
+
this.#$settingsIsObservable = signal(false, { ...(ngDevMode ? { debugName: "#$settingsIsObservable" } : {}) });
|
|
7000
|
+
this.#$needsPrep = computed(() => this.#$dataIsObservable() || this.#$metaNeedsPrep() || this.#$settingsIsObservable(), { ...(ngDevMode ? { debugName: "#$needsPrep" } : {}) });
|
|
7001
|
+
this.$initialized = signal(false, { ...(ngDevMode ? { debugName: "$initialized" } : {}) });
|
|
7071
7002
|
this.#dataCleaners = computed(() => {
|
|
7072
7003
|
const metaData = this.$metaData();
|
|
7073
7004
|
if (!metaData)
|
|
7074
7005
|
return undefined;
|
|
7075
7006
|
return createDataCleaners(metaData);
|
|
7076
|
-
}, ...(ngDevMode ?
|
|
7007
|
+
}, { ...(ngDevMode ? { debugName: "#dataCleaners" } : {}) });
|
|
7077
7008
|
this.$data = computed(() => {
|
|
7078
7009
|
const data = this.#$data();
|
|
7079
7010
|
const cleaners = this.#dataCleaners();
|
|
@@ -7085,7 +7016,7 @@ class TableBuilder {
|
|
|
7085
7016
|
return cleaned;
|
|
7086
7017
|
});
|
|
7087
7018
|
return cleanedData;
|
|
7088
|
-
}, ...(ngDevMode ?
|
|
7019
|
+
}, { ...(ngDevMode ? { debugName: "$data" } : {}) });
|
|
7089
7020
|
if (isObservable(data)) {
|
|
7090
7021
|
this.#$dataIsObservable.set(true);
|
|
7091
7022
|
}
|
|
@@ -7128,7 +7059,7 @@ class TableBuilder {
|
|
|
7128
7059
|
this.#$metaData = toSignal(this.metaData, { injector, initialValue: [] });
|
|
7129
7060
|
}
|
|
7130
7061
|
else {
|
|
7131
|
-
this.#$metaData = computed(() => this.createMetaData(this.#$data()[0]), ...(ngDevMode ?
|
|
7062
|
+
this.#$metaData = computed(() => this.createMetaData(this.#$data()[0]), { ...(ngDevMode ? { debugName: "#$metaData" } : {}) });
|
|
7132
7063
|
}
|
|
7133
7064
|
}
|
|
7134
7065
|
this.$initialized.set(true);
|
|
@@ -7188,12 +7119,12 @@ function actionStatusReducer(state = initialState, action) {
|
|
|
7188
7119
|
}
|
|
7189
7120
|
|
|
7190
7121
|
class NgrxExtModule {
|
|
7191
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
7192
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.0.
|
|
7193
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.0.
|
|
7122
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: NgrxExtModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
7123
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.0.2", ngImport: i0, type: NgrxExtModule, imports: [CommonModule, i1$9.StoreFeatureModule] }); }
|
|
7124
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: NgrxExtModule, imports: [CommonModule,
|
|
7194
7125
|
StoreModule.forFeature('ActionStatus', actionStatusReducer)] }); }
|
|
7195
7126
|
}
|
|
7196
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
7127
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: NgrxExtModule, decorators: [{
|
|
7197
7128
|
type: NgModule,
|
|
7198
7129
|
args: [{
|
|
7199
7130
|
declarations: [],
|
|
@@ -7211,10 +7142,10 @@ class ActionStateSpinnerComponent {
|
|
|
7211
7142
|
ngOnInit() {
|
|
7212
7143
|
this.serverActionStatus$ = this.status$.pipe(delayOn(a => a.status === serverStatusTypes.inProgress, 500));
|
|
7213
7144
|
}
|
|
7214
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
7215
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.
|
|
7145
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: ActionStateSpinnerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
7146
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.2", type: ActionStateSpinnerComponent, isStandalone: true, selector: "lib-action-state-spinner", inputs: { status$: "status$" }, ngImport: i0, template: "@if((serverActionStatus$ | async)?.status === serverStatusTypes.inProgress)\r\n{\r\n <div id=\"blocker\">\r\n <mat-spinner class=\"spinner\" [diameter]=\"200\" />\r\n </div>\r\n}\r\n\r\n", styles: ["#blocker{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#0e0d0d69;z-index:999999}.spinner{position:absolute;top:50%;left:40%;transform:translate(-50%,-50%)}\n"], dependencies: [{ kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i1$a.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
7216
7147
|
}
|
|
7217
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
7148
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: ActionStateSpinnerComponent, decorators: [{
|
|
7218
7149
|
type: Component,
|
|
7219
7150
|
args: [{ selector: 'lib-action-state-spinner', imports: [AsyncPipe, MatProgressSpinnerModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if((serverActionStatus$ | async)?.status === serverStatusTypes.inProgress)\r\n{\r\n <div id=\"blocker\">\r\n <mat-spinner class=\"spinner\" [diameter]=\"200\" />\r\n </div>\r\n}\r\n\r\n", styles: ["#blocker{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#0e0d0d69;z-index:999999}.spinner{position:absolute;top:50%;left:40%;transform:translate(-50%,-50%)}\n"] }]
|
|
7220
7151
|
}], propDecorators: { status$: [{
|
|
@@ -7222,11 +7153,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImpor
|
|
|
7222
7153
|
}] } });
|
|
7223
7154
|
|
|
7224
7155
|
class ActionStateUiModule {
|
|
7225
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
7226
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.0.
|
|
7227
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.0.
|
|
7156
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: ActionStateUiModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
7157
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.0.2", ngImport: i0, type: ActionStateUiModule, imports: [ActionStateSpinnerComponent], exports: [ActionStateSpinnerComponent] }); }
|
|
7158
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: ActionStateUiModule, imports: [ActionStateSpinnerComponent] }); }
|
|
7228
7159
|
}
|
|
7229
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
7160
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: ActionStateUiModule, decorators: [{
|
|
7230
7161
|
type: NgModule,
|
|
7231
7162
|
args: [{
|
|
7232
7163
|
imports: [
|