@anglr/grid
Version:
Angular module displaying grid
195 lines • 9.94 kB
JavaScript
import { __decorate, __metadata } from "tslib";
import { Component, ChangeDetectionStrategy, forwardRef, ContentChildren, signal } from '@angular/core';
import { BindThis } from '@jscrpt/common';
import { GridComponent } from '../grid/grid.component';
import { AsyncDataLoaderComponent, BasicPagingComponent, MatrixContentRendererComponent, NoGridInitializerComponent, NoMetadataSelectorComponent, NoRowSelectorComponent, SimpleNoDataRendererComponent, SingleOrderingComponent } from '../../plugins';
import { DEFAULT_OPTIONS, GRID_INSTANCE, GRID_PLUGIN_INSTANCES } from '../../misc/tokens';
import { ContentContainerTemplateDirective, ContentRowContainerTemplateDirective, FooterContainerTemplateDirective, FooterRowContainerTemplateDirective, GridContainerTemplateDirective, HeaderContainerTemplateDirective, HeaderRowContainerTemplateDirective, MatrixGridColumnDirective } from '../../directives';
import { GridPluginInstancesDef } from '../../misc/gridPluginInstancesDef';
import * as i0 from "@angular/core";
/**
* Default 'GridOptions'
*/
const defaultOptions = {
autoInitialize: true,
plugins: {
contentRenderer: {
type: forwardRef(() => MatrixContentRendererComponent),
instance: null,
instanceCallback: null,
options: null,
},
dataLoader: {
type: forwardRef(() => AsyncDataLoaderComponent),
instance: null,
instanceCallback: null,
options: null,
},
gridInitializer: {
type: forwardRef(() => NoGridInitializerComponent),
instance: null,
instanceCallback: null,
options: null,
},
metadataSelector: {
type: forwardRef(() => NoMetadataSelectorComponent),
instance: null,
instanceCallback: null,
options: null,
},
noDataRenderer: {
type: forwardRef(() => SimpleNoDataRendererComponent),
instance: null,
instanceCallback: null,
options: null,
},
ordering: {
type: forwardRef(() => SingleOrderingComponent),
instance: null,
instanceCallback: null,
options: null,
},
paging: {
type: forwardRef(() => BasicPagingComponent),
instance: null,
instanceCallback: null,
options: null,
},
rowSelector: {
type: forwardRef(() => NoRowSelectorComponent),
instance: null,
instanceCallback: null,
options: null,
},
}
};
/**
* Grid component used for rendering grid, configured with special content renderer and metadata gatherer
*/
export class MatrixGridComponent extends GridComponent {
constructor() {
super(...arguments);
//######################### protected fields #########################
/**
* Signal for metadata value
*/
this.metadataValue = signal({
columns: [],
gridContainer: null,
headerContainer: null,
contentContainer: null,
footerContainer: null,
headerRowContainer: [],
contentRowContainer: [],
footerRowContainer: [],
});
}
//######################### protected properties - overrides #########################
/**
* @inheritdoc
*/
get metadataGatherer() {
return this;
}
//######################### public properties - implementation of MetadataGatherer #########################
/**
* @inheritdoc
*/
get metadata() {
return this.metadataValue.asReadonly();
}
//######################### public methods - implementation of AfterContentInit #########################
/**
* Called when content was initialized
*/
ngAfterContentInit() {
this.gridContainer?.changes.subscribe(this.setMetadata);
this.headerContainer?.changes.subscribe(this.setMetadata);
this.contentContainer?.changes.subscribe(this.setMetadata);
this.footerContainer?.changes.subscribe(this.setMetadata);
this.headerRowContainer?.changes.subscribe(this.setMetadata);
this.contentRowContainer?.changes.subscribe(this.setMetadata);
this.footerRowContainer?.changes.subscribe(this.setMetadata);
this.columns?.changes.subscribe(this.setMetadata);
this.setMetadata();
}
//######################### protected methods #########################
/**
* Sets metadata
*/
setMetadata() {
this.metadataValue.set({
columns: this.columns?.toArray() ?? [],
gridContainer: this.gridContainer?.length ? this.gridContainer?.toArray() : null,
headerContainer: this.headerContainer?.first,
contentContainer: this.contentContainer?.first,
footerContainer: this.footerContainer?.first,
headerRowContainer: this.headerRowContainer?.toArray() ?? [],
contentRowContainer: this.contentRowContainer?.toArray() ?? [],
footerRowContainer: this.footerRowContainer?.toArray() ?? [],
});
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.0", ngImport: i0, type: MatrixGridComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.0", type: MatrixGridComponent, isStandalone: true, selector: "[ngGrid]", providers: [
{
provide: GRID_INSTANCE,
useExisting: forwardRef(() => MatrixGridComponent),
},
{
provide: GRID_PLUGIN_INSTANCES,
useFactory: () => { return new GridPluginInstancesDef(); }
},
{
provide: DEFAULT_OPTIONS,
useValue: defaultOptions,
},
], queries: [{ propertyName: "gridContainer", predicate: GridContainerTemplateDirective }, { propertyName: "headerContainer", predicate: HeaderContainerTemplateDirective }, { propertyName: "contentContainer", predicate: ContentContainerTemplateDirective }, { propertyName: "footerContainer", predicate: FooterContainerTemplateDirective }, { propertyName: "headerRowContainer", predicate: HeaderRowContainerTemplateDirective }, { propertyName: "contentRowContainer", predicate: ContentRowContainerTemplateDirective }, { propertyName: "footerRowContainer", predicate: FooterRowContainerTemplateDirective }, { propertyName: "columns", predicate: MatrixGridColumnDirective }], usesInheritance: true, ngImport: i0, template: "<ng-container #metadataSelectorContainer/>\r\n<ng-container #dataLoaderContainer/>\r\n<ng-container #rowSelectorContainer/>\r\n<ng-container #gridInitializerContainer/>\r\n<ng-container #orderingContainer/>\r\n<ng-container #contentRendererContainer/>\r\n<ng-container #noDataRendererContainer/>\r\n<ng-container #pagingContainer/>", changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
}
__decorate([
BindThis,
__metadata("design:type", Function),
__metadata("design:paramtypes", []),
__metadata("design:returntype", void 0)
], MatrixGridComponent.prototype, "setMetadata", null);
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.0", ngImport: i0, type: MatrixGridComponent, decorators: [{
type: Component,
args: [{ selector: '[ngGrid]', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
{
provide: GRID_INSTANCE,
useExisting: forwardRef(() => MatrixGridComponent),
},
{
provide: GRID_PLUGIN_INSTANCES,
useFactory: () => { return new GridPluginInstancesDef(); }
},
{
provide: DEFAULT_OPTIONS,
useValue: defaultOptions,
},
], template: "<ng-container #metadataSelectorContainer/>\r\n<ng-container #dataLoaderContainer/>\r\n<ng-container #rowSelectorContainer/>\r\n<ng-container #gridInitializerContainer/>\r\n<ng-container #orderingContainer/>\r\n<ng-container #contentRendererContainer/>\r\n<ng-container #noDataRendererContainer/>\r\n<ng-container #pagingContainer/>" }]
}], propDecorators: { gridContainer: [{
type: ContentChildren,
args: [GridContainerTemplateDirective, { emitDistinctChangesOnly: true }]
}], headerContainer: [{
type: ContentChildren,
args: [HeaderContainerTemplateDirective, { emitDistinctChangesOnly: true }]
}], contentContainer: [{
type: ContentChildren,
args: [ContentContainerTemplateDirective, { emitDistinctChangesOnly: true }]
}], footerContainer: [{
type: ContentChildren,
args: [FooterContainerTemplateDirective, { emitDistinctChangesOnly: true }]
}], headerRowContainer: [{
type: ContentChildren,
args: [HeaderRowContainerTemplateDirective, { emitDistinctChangesOnly: true }]
}], contentRowContainer: [{
type: ContentChildren,
args: [ContentRowContainerTemplateDirective, { emitDistinctChangesOnly: true }]
}], footerRowContainer: [{
type: ContentChildren,
args: [FooterRowContainerTemplateDirective, { emitDistinctChangesOnly: true }]
}], columns: [{
type: ContentChildren,
args: [MatrixGridColumnDirective, { emitDistinctChangesOnly: true }]
}], setMetadata: [] } });
//# sourceMappingURL=matrixGrid.component.js.map