@guiexpert/angular-table 15.0.7 → 15.0.18

package/projects/angular-table/README.md

@@ -1,117 +0,0 @@
-# @guiexpert/angular-table
-
-This is the angular component of the GuiExpert Table Project.
-
-## Become a master at creating web applications with large tables
-
-This is the UI-agnostic table component for your next web app. 😊
-
-<img src="https://raw.githubusercontent.com/guiexperttable/ge-table/main/apps/table-website/src/assets/screens/heatmap.png" width="50%">
-
-### Version compatibility
-
-
-| Angular                | @guiexpert/angular-table |
-|:-----------------------|:-------------------------|
-| 17.x.x                 | ^17.0.0                  |
-| 16.x.x                 | ^16.0.7                  |
-| 15.x.x                 | ^15.0.2                  |
-| 14.x.x                 | ^14.0.3                  |
-|
-
-
-### Features
-- Handle large datasets easily
-- Excellent performance for large tables by vertical and horizontal virtual scrolling
-- Fully-featured (advanced sorting and filtering)
-- Highly customizable orderData grid
-- Outstanding performance
-- No third-party dependencies
-- UI-agnostic
-- Column Interactions (resize, reorder)
-- Sorting Rows
-- Row, Column, and Range Selection
-- Single and Multi Selection
-- UI-agnostic
-- Row and Column Spanning
-- Fixed Columns (Left and Right)
-- Tree table (Hierarchical View)
-- Accessibility support: Keyboard Shortcuts
-- Custom Filtering
-- In-place Cell Editing
-- Userdefined Key and Mouse Events
-- Customizable Look & Feel (via CSS variables)
-- Row sorting
-- Column Reordering (Drag and Drop)
-- State Persistence (Row Sorting, Column Order, Selection)
-- Customizable Cell Contents via Renderer for Header, Body and Footer
-- Full control over the HTML structure and style
-
-
-## Links
-
-- [Demos](https://gui.expert/demos)
-- [Documentation](https://gui.expert/doc)
-- [API](https://gui.expert/api)
-
-## Get Started
-
-Add the following two NPM packages to your existing angular project (run this in your project root directory):
-
-```
-npm install --save @guiexpert/table @guiexpert/angular-table
-```
-
-Import the (standalone) TableComponent in your angular module:
-
-```
-@NgModule({
-    imports: [
-      CommonModule,
-      TableComponent, ...
-```
-
-Add guiexpert-table component to a template:
-
-```
-<guiexpert-table
-  [tableModel]="tableModel"
-  [tableOptions]="tableOptions"
-  class="table-div"
-></guiexpert-table>
-```
-
-
-Add two properties (tableModel and tableOptions) to the component:
-
-```
-import {
-  TableFactory,
-  TableModelIf,
-  TableOptions,
-  TableOptionsIf
-} from "@guiexpert/table";
-
-tableModel: TableModelIf = TableFactory.createTableModel({
-  headerData: [
-    ['Header 1', 'Header 2']
-  ],
-  bodyData: [
-    ['Text 1a', 'Text 2a'],
-    ['Text 1b', 'Text 2b'],
-  ]
-});
-
-tableOptions = {
-  ...new TableOptions(),
-  hoverColumnVisible: false,
-  defaultRowHeights: {
-  header: 40,
-  body: 34,
-  footer: 0
-}
-
-```
-
-There are numerous possibilities to create table models.
-Please refer to the [Documentation](https://gui.expert/doc) for further information or the [Demo](https://gui.expert/demos) section for examples.

package/projects/angular-table/ng-package.json

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

package/projects/angular-table/package.json

@@ -1,16 +0,0 @@
-{
-  "name": "@guiexpert/angular-table",
-  "version": "15.0.6",
-  "peerDependencies": {
-    "@angular/common": "^15.2.12",
-    "@angular/core": "^15.2.12"
-  },
-  "scripts": {
-    "git-config": "git config --global url.\"https://\".insteadOf ssh://",
-    "npm-pub:angular-table": "npm publish ../../dist/angular-table --access public --tag a15"
-  },
-  "dependencies": {
-    "tslib": "^2.3.0"
-  },
-  "sideEffects": false
-}

package/projects/angular-table/src/lib/angular-table.component.spec.ts

@@ -1,23 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { AngularTableComponent } from './angular-table.component';
-
-describe('AngularTableComponent', () => {
-  let component: AngularTableComponent;
-  let fixture: ComponentFixture<AngularTableComponent>;
-
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      imports: [AngularTableComponent]
-    })
-    .compileComponents();
-    
-    fixture = TestBed.createComponent(AngularTableComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});

package/projects/angular-table/src/lib/angular-table.service.spec.ts

@@ -1,16 +0,0 @@
-import { TestBed } from '@angular/core/testing';
-
-import { AngularTableService } from './angular-table.service';
-
-describe('AngularTableService', () => {
-  let service: AngularTableService;
-
-  beforeEach(() => {
-    TestBed.configureTestingModule({});
-    service = TestBed.inject(AngularTableService);
-  });
-
-  it('should be created', () => {
-    expect(service).toBeTruthy();
-  });
-});

package/projects/angular-table/src/lib/component-renderer.if.ts

@@ -1,12 +0,0 @@
-import {AreaIdent, AreaModelIf, RendererCleanupFnType} from "@guiexpert/table";
-
-export interface ComponentRendererIf<T> {
-
-  setData(
-    rowIndex: number,
-    columnIndex: number,
-    areaIdent: AreaIdent,
-    areaModel: AreaModelIf,
-    cellValue: any): RendererCleanupFnType | undefined;
-
-}

package/projects/angular-table/src/lib/service/dom-service.ts

@@ -1,63 +0,0 @@
-import {Injectable, Renderer2} from "@angular/core";
-import {DomServiceIf} from "@guiexpert/table";
-
-
-@Injectable({
-  providedIn: "root"
-})
-export class DomService implements DomServiceIf {
-
-  constructor(
-    readonly renderer: Renderer2,
-  ) {
-  }
-
-  setStyle(el: any, style: string, value: any): any {
-    this.renderer.setStyle(el, style, value);
-    return el;
-  };
-
-
-  appendText(parent: HTMLDivElement, text: string): HTMLDivElement {
-    const div = this.renderer.createText(text);
-    this.renderer.appendChild(parent, div);
-    return div;
-  }
-
-
-  addClass(div: HTMLDivElement, clazz: string) {
-    if (clazz.includes(' ')) {
-      clazz.split(' ').forEach(c => this.renderer.addClass(div, c))
-    } else {
-      this.renderer.addClass(div, clazz);
-    }
-    return div;
-  }
-
-  removeClass(div: HTMLDivElement, clazz: string) {
-    if (clazz.includes(" ")) {
-      clazz.split(" ").forEach(c => div.classList.remove(c));
-    } else {
-      div.classList.remove(clazz);
-    }
-    return div;
-  }
-
-  appendChild(parent: HTMLElement, child: HTMLElement): void {
-    this.renderer.appendChild(parent, child);
-  }
-
-  createElement<T>(name: string): T {
-    return this.renderer.createElement(name);
-  }
-
-  createText(text: string): HTMLElement {
-    return this.renderer.createText(text);
-  }
-
-  setAttribute(ele: HTMLElement, key: string, value: string): void {
-    this.renderer.setAttribute(ele, key, value);
-  }
-
-
-}

package/projects/angular-table/src/lib/service/render-wrapper-factory.ts

@@ -1,24 +0,0 @@
-import {ApplicationRef, ChangeDetectorRef, EnvironmentInjector, Injectable, NgZone, Type} from "@angular/core";
-import {ComponentRendererIf} from "../component-renderer.if";
-import {RendererWrapper} from "./renderer-wrapper";
-
-@Injectable({
-  providedIn: "root"
-})
-export class RenderWrapperFactory {
-
-  constructor(
-    private readonly appRef: ApplicationRef,
-    private readonly injector: EnvironmentInjector,
-    private readonly zone: NgZone
-  ) {
-  }
-
-  create<T>(
-    componentType: Type<ComponentRendererIf<T>>,
-    cdr: ChangeDetectorRef
-  ) {
-    return new RendererWrapper(componentType, this.appRef, this.injector, cdr, this.zone);
-  }
-
-}

package/projects/angular-table/src/lib/service/renderer-wrapper.ts

@@ -1,86 +0,0 @@
-import {AreaIdent, AreaModelIf, CellRendererIf, DomServiceIf, RendererCleanupFnType} from "@guiexpert/table";
-import {
-  ApplicationRef,
-  ChangeDetectorRef,
-  createComponent,
-  EnvironmentInjector,
-  EventEmitter,
-  NgZone,
-  Type
-} from "@angular/core";
-import {ComponentRendererIf} from "../component-renderer.if";
-import {Subject, takeUntil} from "rxjs";
-import {Observable} from "rxjs/internal/Observable";
-
-
-export class RendererWrapper<T extends ComponentRendererIf<T>>
-  implements CellRendererIf {
-
-  public readonly event$ = new EventEmitter<any>();
-  private readonly closed$ = new Subject<number>();
-
-  constructor(
-    private componentType: Type<ComponentRendererIf<T>>,
-    private appRef: ApplicationRef,
-    private injector: EnvironmentInjector,
-    private cdr: ChangeDetectorRef,
-    private readonly zone: NgZone
-  ) {
-  }
-
-  render(
-    cellDiv: HTMLDivElement,
-    rowIndex: number,
-    columnIndex: number,
-    areaIdent: AreaIdent,
-    areaModel: AreaModelIf,
-    cellValue: any,
-    domService: DomServiceIf): RendererCleanupFnType | undefined {
-
-    const componentRef = createComponent(this.componentType, {
-      environmentInjector: this.injector
-    });
-    componentRef.instance.setData(
-      rowIndex,
-      columnIndex,
-      areaIdent,
-      areaModel,
-      cellValue);
-
-
-    const emmiterNames = Object.keys(componentRef.instance)
-      .filter(key => {
-        // @ts-ignore
-        const t = componentRef.instance[key];
-        return t['subscribe']
-      });
-
-    // @ts-ignore
-    const observables: Observable[] = (emmiterNames.map(key => (componentRef.instance[key] as Observable)));
-    observables.forEach(obs => obs
-      .pipe(
-        takeUntil(this.closed$)
-      )
-      .subscribe((event: any) => {
-        console.info('RendererWrapper event >', event); // TODO hmm?
-        this.event$.next(event);
-      })
-    );
-
-    cellDiv.appendChild(componentRef.location.nativeElement);
-
-    this.appRef.attachView(componentRef.hostView);
-
-    this.zone.run(() => {
-      this.cdr.detectChanges();
-    });
-
-    return () => {
-      // clean up:
-      this.appRef.detachView(componentRef.hostView);
-      this.closed$.next(Date.now());
-    };
-  }
-
-
-}

package/projects/angular-table/src/lib/table.component.css

@@ -1 +0,0 @@
-@import "node_modules/@guiexpert/table/css/main.css";

package/projects/angular-table/src/lib/table.component.ts

@@ -1,170 +0,0 @@
-import {
-  ChangeDetectionStrategy,
-  Component,
-  ElementRef,
-  Input,
-  NgZone,
-  OnDestroy,
-  OnInit,
-  Output,
-  Renderer2,
-  ViewEncapsulation
-} from "@angular/core";
-import { CommonModule } from "@angular/common";
-import { debounceTime, Subject, takeWhile } from "rxjs";
-import {
-  EventListenerIf, FocusModelIf,
-  GeModelChangeEvent,
-  GeMouseEvent, SelectionModelIf,
-  TableApi,
-  TableModelIf,
-  TableOptions,
-  TableOptionsIf,
-  TableScope
-} from '@guiexpert/table';
-import { DomService } from "./service/dom-service";
-
-
-@Component({
-  selector: "guiexpert-table",
-  standalone: true,
-  imports: [CommonModule],
-  providers: [DomService],
-  template: "",
-  styleUrls: [
-    "./table.component.css"
-  ],
-  encapsulation: ViewEncapsulation.None,
-  changeDetection: ChangeDetectionStrategy.OnPush
-})
-export class TableComponent implements OnInit, OnDestroy, EventListenerIf {
-
-  @Output()
-  tableReady = new Subject<TableApi>();
-
-  @Output()
-  mouseMoved: Subject<GeMouseEvent> = new Subject<GeMouseEvent>();
-
-  @Output()
-  mouseDragging: Subject<GeMouseEvent> = new Subject<GeMouseEvent>();
-
-  @Output()
-  mouseDraggingEnded: Subject<GeMouseEvent> = new Subject<GeMouseEvent>();
-
-  @Output()
-  contextmenu: Subject<GeMouseEvent> = new Subject<GeMouseEvent>();
-
-  @Output()
-  mouseClicked: Subject<GeMouseEvent> = new Subject<GeMouseEvent>();
-
-  @Output()
-  modelChanged: Subject<GeModelChangeEvent> = new Subject<GeModelChangeEvent>();
-
-
-  @Output()
-  selectionChanged: Subject<SelectionModelIf> = new Subject<SelectionModelIf>();
-
-  @Output()
-  focusChanged: Subject<FocusModelIf> = new Subject<FocusModelIf>();
-
-  @Output()
-  checkboxChanged: Subject<any[]> = new Subject<any[]>();
-
-  @Input()
-  tableModel?: TableModelIf;
-
-  @Input()
-  tableOptions: TableOptionsIf = new TableOptions();
-
-  @Input()
-  debounceMouseClickDelay: number = 150;
-
-  private debounceMouseClick: Subject<GeMouseEvent> = new Subject<GeMouseEvent>();
-
-  private tableScope?: TableScope;
-  private alive = true;
-
-
-  constructor(
-    private readonly renderer: Renderer2,
-    private readonly elementRef: ElementRef,
-    private readonly zone: NgZone,
-    private readonly domService: DomService
-  ) {
-  }
-
-
-  onSelectionChanged(model: SelectionModelIf): void {
-    this.selectionChanged.next(model);
-  }
-
-  onFocusChanged(model: FocusModelIf): void {
-    this.focusChanged.next(model);
-  }
-
-
-  onContextmenu(evt: GeMouseEvent): void {
-    this.contextmenu.next(evt);
-  }
-
-  onMouseMoved(evt: GeMouseEvent): void {
-    this.mouseMoved.next(evt);
-  }
-
-  // will be called by table-scope:
-  onMouseClicked(evt: GeMouseEvent): void {
-    this.debounceMouseClick.next(evt);
-  }
-
-  onCheckboxChanged(arr: any[]): void {
-    this.checkboxChanged.next(arr);
-  }
-
-  onModelChanged(evt: GeModelChangeEvent): void {
-    this.modelChanged.next(evt);
-  }
-
-  ngOnInit(): void {
-    this.initModel();
-    this.debounceMouseClick
-      .pipe(
-        debounceTime(this.debounceMouseClickDelay),
-        takeWhile(() => this.alive)
-      )
-      .subscribe((value) => {
-        this.zone.run(() => {
-          this.mouseClicked.next(value);
-        });
-      });
-  }
-
-  ngOnDestroy(): void {
-    this.alive = false;
-  }
-
-
-  onMouseDragging(evt: GeMouseEvent): void {
-    this.mouseDragging.next(evt);
-  }
-
-  onMouseDraggingEnd(evt: GeMouseEvent): void {
-    this.mouseDraggingEnded.next(evt);
-  }
-
-
-  private initModel() {
-    this.zone.runOutsideAngular(this.init.bind(this));
-  }
-
-  private init() {
-    if (this.tableModel) {
-      this.tableScope = new TableScope(
-        this.elementRef.nativeElement, this.tableModel, this.domService, this.tableOptions, this
-      );
-      this.tableScope.firstInit();
-      this.tableReady.next(this.tableScope.getApi());
-    }
-  }
-
-
-}

package/projects/angular-table/tsconfig.lib.json

@@ -1,14 +0,0 @@
-/* To learn more about this file see: https://angular.io/config/tsconfig. */
-{
-  "extends": "../../tsconfig.json",
-  "compilerOptions": {
-    "outDir": "../../out-tsc/lib",
-    "declaration": true,
-    "declarationMap": true,
-    "inlineSources": true,
-    "types": []
-  },
-  "exclude": [
-    "**/*.spec.ts"
-  ]
-}

package/projects/angular-table/tsconfig.lib.prod.json

@@ -1,10 +0,0 @@
-/* To learn more about this file see: https://angular.io/config/tsconfig. */
-{
-  "extends": "./tsconfig.lib.json",
-  "compilerOptions": {
-    "declarationMap": false
-  },
-  "angularCompilerOptions": {
-    "compilationMode": "partial"
-  }
-}

package/projects/angular-table/tsconfig.spec.json

@@ -1,14 +0,0 @@
-/* To learn more about this file see: https://angular.io/config/tsconfig. */
-{
-  "extends": "../../tsconfig.json",
-  "compilerOptions": {
-    "outDir": "../../out-tsc/spec",
-    "types": [
-      "jasmine"
-    ]
-  },
-  "include": [
-    "**/*.spec.ts",
-    "**/*.d.ts"
-  ]
-}

package/tsconfig.json

@@ -1,39 +0,0 @@
-/* To learn more about this file see: https://angular.io/config/tsconfig. */
-{
-  "compileOnSave": false,
-  "compilerOptions": {
-    "baseUrl": "./",
-    "paths": {
-      "angular-table": [
-        "./dist/angular-table"
-      ]
-    },
-    "outDir": "./dist/out-tsc",
-    "forceConsistentCasingInFileNames": true,
-    "strict": true,
-    "noImplicitOverride": true,
-    "noPropertyAccessFromIndexSignature": true,
-    "noImplicitReturns": true,
-    "noFallthroughCasesInSwitch": true,
-    "skipLibCheck": true,
-    "esModuleInterop": true,
-    "sourceMap": true,
-    "declaration": false,
-    "experimentalDecorators": true,
-    "moduleResolution": "node",
-    "importHelpers": true,
-    "target": "ES2022",
-    "module": "ES2022",
-    "useDefineForClassFields": false,
-    "lib": [
-      "ES2022",
-      "dom"
-    ]
-  },
-  "angularCompilerOptions": {
-    "enableI18nLegacyMessageIdFormat": false,
-    "strictInjectionParameters": true,
-    "strictInputAccessModifiers": true,
-    "strictTemplates": true
-  }
-}