@polygrid/angular 0.0.2 → 0.0.3

package/ng-package.json

@@ -0,0 +1,7 @@
+{
+  "$schema": "../node_modules/ng-packagr/ng-package.schema.json",
+  "dest": "dist",
+  "lib": {
+    "entryFile": "src/public-api.ts"
+  }
+}

package/package.json

@@ -1,24 +1,23 @@
-{
-  "name": "@polygrid/angular",
-  "version": "0.0.2",
-  "peerDependencies": {
-    "@angular/core": "^21.0.6",
-    "@angular/common": "^21.0.6",
-    "@polygrid/core": "^1.0.0"
-  },
-  "module": "fesm2022/polygrid-angular.mjs",
-  "typings": "types/polygrid-angular.d.ts",
-  "exports": {
-    "./package.json": {
-      "default": "./package.json"
-    },
-    ".": {
-      "types": "./types/polygrid-angular.d.ts",
-      "default": "./fesm2022/polygrid-angular.mjs"
-    }
-  },
-  "sideEffects": false,
-  "dependencies": {
-    "tslib": "^2.3.0"
-  }
-}
+{
+  "name": "@polygrid/angular",
+  "version": "0.0.3",
+  "peerDependencies": {
+    "@angular/core": "^21.0.6",
+    "@angular/common": "^21.0.6",
+    "@polygrid/core": "^1.0.0"
+  },
+  "devDependencies": {
+    "@angular/core": "^21.0.6",
+    "@angular/common": "^21.0.6",
+    "ng-packagr": "^21.0.1"
+  },
+  "ngPackage": {
+    "$schema": "./node_modules/ng-packagr/ng-package.schema.json",
+    "lib": {
+      "entryFile": "src/public-api.ts"
+    }
+  },
+  "scripts": {
+    "build": "ng-packagr -p ng-package.json"
+  }
+}

package/src/lib/components/grid/poly-grid.css

@@ -0,0 +1,10 @@
+:host {
+  display: block;
+  width: 100%;
+  height: 100%;
+}
+
+.pg-host {
+  width: 100%;
+  height: 100%;
+}

package/src/lib/components/grid/poly-grid.html

@@ -0,0 +1 @@
+<div #host class="pg-host"></div>

package/src/lib/components/grid/poly-grid.ts

@@ -0,0 +1,66 @@
+import {
+  AfterViewInit,
+  ChangeDetectionStrategy,
+  Component,
+  EffectRef,
+  ElementRef,
+  inject,
+  Injector,
+  input,
+  OnDestroy,
+  runInInjectionContext,
+  ViewChild,
+} from "@angular/core";
+import { CommonModule } from "@angular/common";
+import * as effects from "../../effects/index";
+import { PolyGrid } from "@polygrid/core/engine/core/grid";
+import { PolyGridColumn } from "@polygrid/core/engine/services/column/interfaces/column";
+import { PolyGridOptions } from "@polygrid/core/engine/core/interfaces/grid-options";
+
+@Component({
+  selector: "pg-grid",
+  imports: [CommonModule],
+  changeDetection: ChangeDetectionStrategy.OnPush,
+  templateUrl: "./poly-grid.html",
+  styleUrl: "./poly-grid.css",
+})
+export class PolyGridComponent implements AfterViewInit, OnDestroy {
+  private grid: PolyGrid | null = null;
+
+  @ViewChild("host", { static: true }) hostRef!: ElementRef<HTMLDivElement>;
+
+  // inputs
+  id = input.required<string>();
+  columns = input<PolyGridColumn[]>([]);
+  data = input<any[]>([]);
+
+  // reactive effects
+  gridIdEffect!: EffectRef;
+  dataEffect!: EffectRef;
+  columnEffect!: EffectRef;
+
+  private injector = inject(Injector);
+
+  ngAfterViewInit(): void {
+    const host = this.hostRef.nativeElement;
+
+    const options: PolyGridOptions = {
+      id: this.id(),
+      columns: this.columns(),
+      data: this.data(),
+    };
+
+    this.grid = new PolyGrid(host, options);
+
+    runInInjectionContext(this.injector, () => {
+      this.gridIdEffect = effects.gridIdInputEffect(this.id, this.grid!);
+      this.dataEffect = effects.dataInputEffect(this.data, this.grid!);
+      this.columnEffect = effects.columnInputEffect(this.columns, this.grid!);
+    });
+  }
+
+  ngOnDestroy(): void {
+    this.grid?.destroy();
+    this.grid = null;
+  }
+}

package/src/lib/effects/column.ts

@@ -0,0 +1,12 @@
+import { effect, EffectRef, Signal } from "@angular/core";
+import { PolyGrid } from "@polygrid/core/engine/core/grid";
+import { PolyGridColumn } from "@polygrid/core/engine/services/column/interfaces/column";
+
+export function columnInputEffect(
+  value: Signal<PolyGridColumn[]>,
+  grid: PolyGrid
+): EffectRef {
+  return effect(() => {
+    if (grid) grid.api.setColumns(value());
+  });
+}

package/src/lib/effects/data.ts

@@ -0,0 +1,11 @@
+import { effect, EffectRef, Signal } from "@angular/core";
+import { PolyGrid } from "@polygrid/core/engine/core/grid";
+
+export function dataInputEffect(
+  value: Signal<any[]>,
+  grid: PolyGrid
+): EffectRef {
+  return effect(() => {
+    if (grid) grid.api.setData(value());
+  });
+}

package/src/lib/effects/grid-id.ts

@@ -0,0 +1,11 @@
+import { effect, EffectRef, Signal } from "@angular/core";
+import { PolyGrid } from "@polygrid/core/engine/core/grid";
+
+export function gridIdInputEffect(
+  value: Signal<string>,
+  grid: PolyGrid
+): EffectRef {
+  return effect(() => {
+    if (grid) grid.api.setGridId(value());
+  });
+}

package/src/lib/effects/index.ts

@@ -0,0 +1,3 @@
+export * from "./grid-id";
+export * from "./data";
+export * from "./column";

package/src/lib/modules/poly-grid.ts

@@ -0,0 +1,9 @@
+import { NgModule } from "@angular/core";
+import { PolyGridComponent } from "../../public-api";
+
+@NgModule({
+  imports: [PolyGridComponent],
+  exports: [PolyGridComponent],
+  providers: [],
+})
+export class POLY_GRID {}

package/src/public-api.ts

@@ -0,0 +1,2 @@
+export * from "./lib/components/grid/poly-grid";
+export * from "./lib/modules/poly-grid";

package/tsconfig.lib.json

@@ -0,0 +1,11 @@
+{
+  "extends": "../tsconfig.json",
+  "compilerOptions": {
+    "outDir": "./out-tsc/lib",
+    "declaration": true,
+    "declarationMap": true,
+    "inlineSources": true,
+    "types": []
+  },
+  "exclude": ["**/*.spec.ts", "src/test.ts"]
+}

package/fesm2022/polygrid-angular.mjs

@@ -1,81 +0,0 @@
-import * as i0 from '@angular/core';
-import { effect, input, ViewChild, ChangeDetectionStrategy, Component, NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { PolyGrid } from '@polygrid/core';
-
-function gridIdInputEffect(value, grid) {
-    return effect(() => {
-        if (grid)
-            grid.api.setGridId(value());
-    });
-}
-
-function dataInputEffect(value, grid) {
-    return effect(() => {
-        if (grid)
-            grid.api.setData(value());
-    });
-}
-
-function columnInputEffect(value, grid) {
-    return effect(() => {
-        if (grid)
-            grid.api.setColumns(value());
-    });
-}
-
-class PolyGridComponent {
-    grid = null;
-    hostRef;
-    // inputs
-    id = input.required(...(ngDevMode ? [{ debugName: "id" }] : []));
-    columns = input([], ...(ngDevMode ? [{ debugName: "columns" }] : []));
-    data = input([], ...(ngDevMode ? [{ debugName: "data" }] : []));
-    // reactive effects
-    gridIdEffect = gridIdInputEffect(this.id, this.grid);
-    dataEffect = dataInputEffect(this.data, this.grid);
-    columnEffect = columnInputEffect(this.columns, this.grid);
-    ngAfterViewInit() {
-        const host = this.hostRef.nativeElement;
-        const options = {
-            id: this.id(),
-            columns: this.columns(),
-            data: this.data(),
-        };
-        this.grid = new PolyGrid(host, options);
-    }
-    ngOnDestroy() {
-        this.grid?.destroy();
-        this.grid = null;
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: PolyGridComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.0.6", type: PolyGridComponent, isStandalone: true, selector: "pg-grid", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: true, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "hostRef", first: true, predicate: ["host"], descendants: true, static: true }], ngImport: i0, template: "<div #host class=\"pg-host\"></div>\r\n", styles: [":host{display:block;width:100%;height:100%}.pg-host{width:100%;height:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: PolyGridComponent, decorators: [{
-            type: Component,
-            args: [{ selector: "pg-grid", imports: [CommonModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div #host class=\"pg-host\"></div>\r\n", styles: [":host{display:block;width:100%;height:100%}.pg-host{width:100%;height:100%}\n"] }]
-        }], propDecorators: { hostRef: [{
-                type: ViewChild,
-                args: ["host", { static: true }]
-            }], id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: true }] }], columns: [{ type: i0.Input, args: [{ isSignal: true, alias: "columns", required: false }] }], data: [{ type: i0.Input, args: [{ isSignal: true, alias: "data", required: false }] }] } });
-
-class POLY_GRID {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: POLY_GRID, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.0.6", ngImport: i0, type: POLY_GRID, imports: [PolyGridComponent], exports: [PolyGridComponent] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: POLY_GRID, imports: [PolyGridComponent] });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: POLY_GRID, decorators: [{
-            type: NgModule,
-            args: [{
-                    imports: [PolyGridComponent],
-                    exports: [PolyGridComponent],
-                    providers: [],
-                }]
-        }] });
-
-/**
- * Generated bundle index. Do not edit.
- */
-
-export { POLY_GRID, PolyGridComponent };
-//# sourceMappingURL=polygrid-angular.mjs.map

package/fesm2022/polygrid-angular.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"polygrid-angular.mjs","sources":["../../src/lib/effects/grid-id.ts","../../src/lib/effects/data.ts","../../src/lib/effects/column.ts","../../src/lib/components/grid/poly-grid.ts","../../src/lib/components/grid/poly-grid.html","../../src/lib/modules/poly-grid.ts","../../src/polygrid-angular.ts"],"sourcesContent":["import { effect, EffectRef, Signal } from \"@angular/core\";\r\nimport { PolyGrid } from \"@polygrid/core\";\r\n\r\nexport function gridIdInputEffect(\r\n  value: Signal<string>,\r\n  grid: PolyGrid\r\n): EffectRef {\r\n  return effect(() => {\r\n    if (grid) grid.api.setGridId(value());\r\n  });\r\n}\r\n","import { effect, EffectRef, Signal } from \"@angular/core\";\r\nimport { PolyGrid } from \"@polygrid/core\";\r\n\r\nexport function dataInputEffect(\r\n  value: Signal<any[]>,\r\n  grid: PolyGrid\r\n): EffectRef {\r\n  return effect(() => {\r\n    if (grid) grid.api.setData(value());\r\n  });\r\n}\r\n","import { effect, EffectRef, Signal } from \"@angular/core\";\r\nimport { PolyGrid, PolyGridColumn } from \"@polygrid/core\";\r\n\r\nexport function columnInputEffect(\r\n  value: Signal<PolyGridColumn[]>,\r\n  grid: PolyGrid\r\n): EffectRef {\r\n  return effect(() => {\r\n    if (grid) grid.api.setColumns(value());\r\n  });\r\n}\r\n","import {\r\n  AfterViewInit,\r\n  ChangeDetectionStrategy,\r\n  Component,\r\n  ElementRef,\r\n  input,\r\n  OnDestroy,\r\n  ViewChild,\r\n} from \"@angular/core\";\r\nimport { CommonModule } from \"@angular/common\";\r\nimport { PolyGrid, PolyGridOptions, PolyGridColumn } from \"@polygrid/core\";\r\nimport * as effects from \"../../effects/index\";\r\n\r\n@Component({\r\n  selector: \"pg-grid\",\r\n  imports: [CommonModule],\r\n  changeDetection: ChangeDetectionStrategy.OnPush,\r\n  templateUrl: \"./poly-grid.html\",\r\n  styleUrl: \"./poly-grid.css\",\r\n})\r\nexport class PolyGridComponent implements AfterViewInit, OnDestroy {\r\n  private grid: PolyGrid | null = null;\r\n\r\n  @ViewChild(\"host\", { static: true }) hostRef!: ElementRef<HTMLDivElement>;\r\n\r\n  // inputs\r\n  id = input.required<string>();\r\n  columns = input<PolyGridColumn[]>([]);\r\n  data = input<any[]>([]);\r\n\r\n  // reactive effects\r\n  gridIdEffect = effects.gridIdInputEffect(this.id, this.grid!);\r\n  dataEffect = effects.dataInputEffect(this.data, this.grid!);\r\n  columnEffect = effects.columnInputEffect(this.columns, this.grid!);\r\n\r\n  ngAfterViewInit(): void {\r\n    const host = this.hostRef.nativeElement;\r\n\r\n    const options: PolyGridOptions = {\r\n      id: this.id(),\r\n      columns: this.columns(),\r\n      data: this.data(),\r\n    };\r\n\r\n    this.grid = new PolyGrid(host, options);\r\n  }\r\n\r\n  ngOnDestroy(): void {\r\n    this.grid?.destroy();\r\n    this.grid = null;\r\n  }\r\n}\r\n","<div #host class=\"pg-host\"></div>\r\n","import { NgModule } from \"@angular/core\";\r\nimport { PolyGridComponent } from \"../../public-api\";\r\n\r\n@NgModule({\r\n  imports: [PolyGridComponent],\r\n  exports: [PolyGridComponent],\r\n  providers: [],\r\n})\r\nexport class POLY_GRID {}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":["effects.gridIdInputEffect","effects.dataInputEffect","effects.columnInputEffect"],"mappings":";;;;;AAGM,SAAU,iBAAiB,CAC/B,KAAqB,EACrB,IAAc,EAAA;IAEd,OAAO,MAAM,CAAC,MAAK;AACjB,QAAA,IAAI,IAAI;YAAE,IAAI,CAAC,GAAG,CAAC,SAAS,CAAC,KAAK,EAAE,CAAC;AACvC,IAAA,CAAC,CAAC;AACJ;;ACPM,SAAU,eAAe,CAC7B,KAAoB,EACpB,IAAc,EAAA;IAEd,OAAO,MAAM,CAAC,MAAK;AACjB,QAAA,IAAI,IAAI;YAAE,IAAI,CAAC,GAAG,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC;AACrC,IAAA,CAAC,CAAC;AACJ;;ACPM,SAAU,iBAAiB,CAC/B,KAA+B,EAC/B,IAAc,EAAA;IAEd,OAAO,MAAM,CAAC,MAAK;AACjB,QAAA,IAAI,IAAI;YAAE,IAAI,CAAC,GAAG,CAAC,UAAU,CAAC,KAAK,EAAE,CAAC;AACxC,IAAA,CAAC,CAAC;AACJ;;MCUa,iBAAiB,CAAA;IACpB,IAAI,GAAoB,IAAI;AAEC,IAAA,OAAO;;AAG5C,IAAA,EAAE,GAAG,KAAK,CAAC,QAAQ,6CAAU;AAC7B,IAAA,OAAO,GAAG,KAAK,CAAmB,EAAE,mDAAC;AACrC,IAAA,IAAI,GAAG,KAAK,CAAQ,EAAE,gDAAC;;AAGvB,IAAA,YAAY,GAAGA,iBAAyB,CAAC,IAAI,CAAC,EAAE,EAAE,IAAI,CAAC,IAAK,CAAC;AAC7D,IAAA,UAAU,GAAGC,eAAuB,CAAC,IAAI,CAAC,IAAI,EAAE,IAAI,CAAC,IAAK,CAAC;AAC3D,IAAA,YAAY,GAAGC,iBAAyB,CAAC,IAAI,CAAC,OAAO,EAAE,IAAI,CAAC,IAAK,CAAC;IAElE,eAAe,GAAA;AACb,QAAA,MAAM,IAAI,GAAG,IAAI,CAAC,OAAO,CAAC,aAAa;AAEvC,QAAA,MAAM,OAAO,GAAoB;AAC/B,YAAA,EAAE,EAAE,IAAI,CAAC,EAAE,EAAE;AACb,YAAA,OAAO,EAAE,IAAI,CAAC,OAAO,EAAE;AACvB,YAAA,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE;SAClB;QAED,IAAI,CAAC,IAAI,GAAG,IAAI,QAAQ,CAAC,IAAI,EAAE,OAAO,CAAC;IACzC;IAEA,WAAW,GAAA;AACT,QAAA,IAAI,CAAC,IAAI,EAAE,OAAO,EAAE;AACpB,QAAA,IAAI,CAAC,IAAI,GAAG,IAAI;IAClB;uGA9BW,iBAAiB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;2FAAjB,iBAAiB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,SAAA,EAAA,MAAA,EAAA,EAAA,EAAA,EAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,OAAA,EAAA,EAAA,iBAAA,EAAA,SAAA,EAAA,UAAA,EAAA,SAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,IAAA,EAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,UAAA,EAAA,MAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,WAAA,EAAA,CAAA,EAAA,YAAA,EAAA,SAAA,EAAA,KAAA,EAAA,IAAA,EAAA,SAAA,EAAA,CAAA,MAAA,CAAA,EAAA,WAAA,EAAA,IAAA,EAAA,MAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECpB9B,yCACA,EAAA,MAAA,EAAA,CAAA,+EAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EDcY,YAAY,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA;;2FAKX,iBAAiB,EAAA,UAAA,EAAA,CAAA;kBAP7B,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,SAAS,WACV,CAAC,YAAY,CAAC,EAAA,eAAA,EACN,uBAAuB,CAAC,MAAM,EAAA,QAAA,EAAA,yCAAA,EAAA,MAAA,EAAA,CAAA,+EAAA,CAAA,EAAA;;sBAO9C,SAAS;AAAC,gBAAA,IAAA,EAAA,CAAA,MAAM,EAAE,EAAE,MAAM,EAAE,IAAI,EAAE;;;MEfxB,SAAS,CAAA;uGAAT,SAAS,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA;wGAAT,SAAS,EAAA,OAAA,EAAA,CAJV,iBAAiB,CAAA,EAAA,OAAA,EAAA,CACjB,iBAAiB,CAAA,EAAA,CAAA;AAGhB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,SAAS,YAJV,iBAAiB,CAAA,EAAA,CAAA;;2FAIhB,SAAS,EAAA,UAAA,EAAA,CAAA;kBALrB,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;oBACR,OAAO,EAAE,CAAC,iBAAiB,CAAC;oBAC5B,OAAO,EAAE,CAAC,iBAAiB,CAAC;AAC5B,oBAAA,SAAS,EAAE,EAAE;AACd,iBAAA;;;ACPD;;AAEG;;;;"}

package/types/polygrid-angular.d.ts

@@ -1,26 +0,0 @@
-import * as _angular_core from '@angular/core';
-import { AfterViewInit, OnDestroy, ElementRef } from '@angular/core';
-import { PolyGridColumn } from '@polygrid/core';
-
-declare class PolyGridComponent implements AfterViewInit, OnDestroy {
-    private grid;
-    hostRef: ElementRef<HTMLDivElement>;
-    id: _angular_core.InputSignal<string>;
-    columns: _angular_core.InputSignal<PolyGridColumn[]>;
-    data: _angular_core.InputSignal<any[]>;
-    gridIdEffect: _angular_core.EffectRef;
-    dataEffect: _angular_core.EffectRef;
-    columnEffect: _angular_core.EffectRef;
-    ngAfterViewInit(): void;
-    ngOnDestroy(): void;
-    static ɵfac: _angular_core.ɵɵFactoryDeclaration<PolyGridComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<PolyGridComponent, "pg-grid", never, { "id": { "alias": "id"; "required": true; "isSignal": true; }; "columns": { "alias": "columns"; "required": false; "isSignal": true; }; "data": { "alias": "data"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
-}
-
-declare class POLY_GRID {
-    static ɵfac: _angular_core.ɵɵFactoryDeclaration<POLY_GRID, never>;
-    static ɵmod: _angular_core.ɵɵNgModuleDeclaration<POLY_GRID, never, [typeof PolyGridComponent], [typeof PolyGridComponent]>;
-    static ɵinj: _angular_core.ɵɵInjectorDeclaration<POLY_GRID>;
-}
-
-export { POLY_GRID, PolyGridComponent };