@guiexpert/angular-table 16.0.2 → 16.0.4

package/lib/angular-table/table.component.d.ts

@@ -0,0 +1,39 @@
+import { ElementRef, NgZone, OnDestroy, OnInit, Renderer2 } from "@angular/core";
+import { Subject } from "rxjs";
+import { EventListenerIf, GeModelChangeEvent, GeMouseEvent, TableApi, TableModelIf, TableOptionsIf } from "@guiexpert/table";
+import { DomService } from "./service/dom-service";
+import * as i0 from "@angular/core";
+export declare class TableComponent implements OnInit, OnDestroy, EventListenerIf {
+    private readonly renderer;
+    private readonly elementRef;
+    private readonly zone;
+    private readonly domService;
+    tableReady: Subject<TableApi>;
+    mouseMoved: Subject<GeMouseEvent>;
+    mouseDragging: Subject<GeMouseEvent>;
+    mouseDraggingEnded: Subject<GeMouseEvent>;
+    contextmenu: Subject<GeMouseEvent>;
+    mouseClicked: Subject<GeMouseEvent>;
+    modelChanged: Subject<GeModelChangeEvent>;
+    checkboxChanged: Subject<any[]>;
+    tableModel?: TableModelIf;
+    tableOptions: TableOptionsIf;
+    debounceMouseClickDelay: number;
+    private debounceMouseClick;
+    private tableScope?;
+    private alive;
+    constructor(renderer: Renderer2, elementRef: ElementRef, zone: NgZone, domService: DomService);
+    onContextmenu(evt: GeMouseEvent): void;
+    onMouseMoved(evt: GeMouseEvent): void;
+    onMouseClicked(evt: GeMouseEvent): void;
+    onCheckboxChanged(arr: any[]): void;
+    onModelChanged(evt: GeModelChangeEvent): void;
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    onMouseDragging(evt: GeMouseEvent): void;
+    onMouseDraggingEnd(evt: GeMouseEvent): void;
+    private initModel;
+    private init;
+    static ɵfac: i0.ɵɵFactoryDeclaration<TableComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<TableComponent, "guiexpert-table", never, { "tableModel": { "alias": "tableModel"; "required": false; }; "tableOptions": { "alias": "tableOptions"; "required": false; }; "debounceMouseClickDelay": { "alias": "debounceMouseClickDelay"; "required": false; }; }, { "tableReady": "tableReady"; "mouseMoved": "mouseMoved"; "mouseDragging": "mouseDragging"; "mouseDraggingEnded": "mouseDraggingEnded"; "contextmenu": "contextmenu"; "mouseClicked": "mouseClicked"; "modelChanged": "modelChanged"; "checkboxChanged": "checkboxChanged"; }, never, never, true, never>;
+}

package/package.json

@@ -1,14 +1,25 @@
 {
   "name": "@guiexpert/angular-table",
-  "version": "16.0.2",
-  "scripts": {
-    "publish": "npm publish"
-  },
+  "version": "16.0.4",
   "peerDependencies": {
     "@angular/common": "^16.0.0",
     "@angular/core": "^16.0.0"
   },
   "dependencies": {
     "tslib": "^2.3.0"
-  }
-}
+  },
+  "module": "fesm2022/guiexpert-angular-table.mjs",
+  "typings": "index.d.ts",
+  "exports": {
+    "./package.json": {
+      "default": "./package.json"
+    },
+    ".": {
+      "types": "./index.d.ts",
+      "esm2022": "./esm2022/guiexpert-angular-table.mjs",
+      "esm": "./esm2022/guiexpert-angular-table.mjs",
+      "default": "./fesm2022/guiexpert-angular-table.mjs"
+    }
+  },
+  "sideEffects": false
+}

package/.eslintrc.json

@@ -1,46 +0,0 @@
-{
-  "extends": [
-    "../../.eslintrc.json"
-  ],
-  "ignorePatterns": [
-    "!**/*"
-  ],
-  "overrides": [
-    {
-      "files": [
-        "*.ts"
-      ],
-      "extends": [
-        "plugin:@nrwl/nx/angular",
-        "plugin:@angular-eslint/template/process-inline-templates"
-      ],
-      "rules": {
-        "@angular-eslint/directive-selector": [
-          "error",
-          {
-            "type": "attribute",
-            "prefix": "guiexpert",
-            "style": "camelCase"
-          }
-        ],
-        "@angular-eslint/component-selector": [
-          "error",
-          {
-            "type": "element",
-            "prefix": "guiexpert",
-            "style": "kebab-case"
-          }
-        ]
-      }
-    },
-    {
-      "files": [
-        "*.html"
-      ],
-      "extends": [
-        "plugin:@nrwl/nx/angular-template"
-      ],
-      "rules": {}
-    }
-  ]
-}

package/.idea/angular-table.iml

@@ -1,12 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<module type="WEB_MODULE" version="4">
-  <component name="NewModuleRootManager">
-    <content url="file://$MODULE_DIR$">
-      <excludeFolder url="file://$MODULE_DIR$/.tmp" />
-      <excludeFolder url="file://$MODULE_DIR$/temp" />
-      <excludeFolder url="file://$MODULE_DIR$/tmp" />
-    </content>
-    <orderEntry type="inheritedJdk" />
-    <orderEntry type="sourceFolder" forTests="false" />
-  </component>
-</module>

package/.idea/modules.xml

@@ -1,8 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<project version="4">
-  <component name="ProjectModuleManager">
-    <modules>
-      <module fileurl="file://$PROJECT_DIR$/.idea/angular-table.iml" filepath="$PROJECT_DIR$/.idea/angular-table.iml" />
-    </modules>
-  </component>
-</project>

package/.idea/vcs.xml

@@ -1,6 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<project version="4">
-  <component name="VcsDirectoryMappings">
-    <mapping directory="" vcs="Git" />
-  </component>
-</project>

package/ng-package.json

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

package/project.json

@@ -1,37 +0,0 @@
-{
-  "name": "@guiexpert/angular-table",
-  "$schema": "../../node_modules/nx/schemas/project-schema.json",
-  "projectType": "library",
-  "sourceRoot": "libs/angular-table/src",
-  "prefix": "guiexpert",
-  "targets": {
-    "build": {
-      "executor": "@nrwl/angular:package",
-      "outputs": [
-        "dist/libs/angular-table"
-      ],
-      "options": {
-        "project": "libs/angular-table/ng-package.json"
-      },
-      "configurations": {
-        "production": {
-          "tsConfig": "libs/angular-table/tsconfig.lib.prod.json"
-        },
-        "development": {
-          "tsConfig": "libs/angular-table/tsconfig.lib.json"
-        }
-      },
-      "defaultConfiguration": "production"
-    },
-    "lint": {
-      "executor": "@nrwl/linter:eslint",
-      "options": {
-        "lintFilePatterns": [
-          "libs/angular-table/**/*.ts",
-          "libs/angular-table/**/*.html"
-        ]
-      }
-    }
-  },
-  "tags": []
-}

package/src/lib/angular-table/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/src/lib/angular-table/service/dom-service.ts

@@ -1,54 +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;
-  }
-
-  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/src/lib/angular-table/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/src/lib/angular-table/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/src/lib/angular-table/table-color-classes.css

@@ -1,90 +0,0 @@
-
-
-.ge-table { background-color: var(--ge-table-bg); }
-
-.ge-table-header-west { background-color: var(--ge-table-header-west-bg); }
-.ge-table-header-center { background-color: var(--ge-table-header-center-bg); }
-.ge-table-header-east { background-color: var(--ge-table-header-east-bg); }
-.ge-table-header-west { color: var(--ge-table-header-west-text); }
-.ge-table-header-center { color: var(--ge-table-header-center-text); }
-.ge-table-header-east { color: var(--ge-table-header-east-text); }
-
-.ge-table-header-west-horizontal-border { background-color: var(--ge-table-header-west-horizontal-border); }
-.ge-table-header-west-vertical-border { background-color: var(--ge-table-header-west-vertical-border); }
-.ge-table-header-center-horizontal-border { background-color: var(--ge-table-header-center-horizontal-border); }
-.ge-table-header-center-vertical-border { background-color: var(--ge-table-header-center-vertical-border); }
-.ge-table-header-east-horizontal-border { background-color: var(--ge-table-header-east-horizontal-border); }
-.ge-table-header-east-vertical-border { background-color: var(--ge-table-header-east-vertical-border); }
-
-
-.ge-table-body-west { background-color: var(--ge-table-body-west-bg); }
-.ge-table-body-center { background-color: var(--ge-table-body-center-bg); }
-.ge-table-body-east { background-color: var(--ge-table-body-east-bg); }
-.ge-table-body-west { color: var(--ge-table-body-west-text); }
-.ge-table-body-center { color: var(--ge-table-body-center-text); }
-.ge-table-body-east { color: var(--ge-table-body-east-text); }
-
-.ge-table-body-west-horizontal-border { background-color: var(--ge-table-body-west-horizontal-border); }
-.ge-table-body-west-vertical-border { background-color: var(--ge-table-body-west-vertical-border); }
-.ge-table-body-center-horizontal-border { background-color: var(--ge-table-body-center-horizontal-border); }
-.ge-table-body-center-vertical-border { background-color: var(--ge-table-body-center-vertical-border); }
-.ge-table-body-east-horizontal-border { background-color: var(--ge-table-body-east-horizontal-border); }
-.ge-table-body-east-vertical-border { background-color: var(--ge-table-body-east-vertical-border); }
-
-.ge-table-body-west-selected-range { background-color: var(--ge-table-body-west-selected-range-bg); }
-.ge-table-body-center-selected-range { background-color: var(--ge-table-body-center-selected-range-bg); }
-.ge-table-body-east-selected-range { background-color: var(--ge-table-body-east-selected-range-bg); }
-.ge-table-body-west-selected-range { color: var(--ge-table-body-west-selected-range-text); }
-.ge-table-body-center-selected-range { color: var(--ge-table-body-center-selected-range-text); }
-.ge-table-body-east-selected-range { color: var(--ge-table-body-east-selected-range-text); }
-
-
-
-
-
-
-.ge-table-footer-west { background-color: var(--ge-table-footer-west-bg); }
-.ge-table-footer-center { background-color: var(--ge-table-footer-center-bg); }
-.ge-table-footer-east { background-color: var(--ge-table-footer-east-bg); }
-
-.ge-table-footer-west { color: var(--ge-table-footer-west-text); }
-.ge-table-footer-center { color: var(--ge-table-footer-center-text); }
-.ge-table-footer-east { color: var(--ge-table-footer-east-text); }
-
-.ge-table-footer-west-horizontal-border { background-color: var(--ge-table-footer-west-horizontal-border); }
-.ge-table-footer-west-vertical-border { background-color: var(--ge-table-footer-west-vertical-border); }
-.ge-table-footer-center-horizontal-border { background-color: var(--ge-table-footer-center-horizontal-border); }
-.ge-table-footer-center-vertical-border { background-color: var(--ge-table-footer-center-vertical-border); }
-.ge-table-footer-east-horizontal-border { background-color: var(--ge-table-footer-east-horizontal-border); }
-.ge-table-footer-east-vertical-border { background-color: var(--ge-table-footer-east-vertical-border); }
-
-
-
-
-.ge-table-border { background-color: var(--ge-table-border); }
-.ge-table-row-odd {background-color: var(--ge-table-row-odd-bg); }
-.ge-table-row-even {background-color: var(--ge-table-row-even-bg); }
-.ge-table-column-odd {background-color: var(--ge-table-column-odd-bg); }
-.ge-table-column-even {background-color: var(--ge-table-column-even-bg); }
-
-.ge-table-hover-column { background-color: var(--ge-table-hover-column-bg); }
-.ge-table-hover-row { background-color: var(--ge-table-hover-row-bg); }
-
-.ge-table-focus-border { background-color: var(--ge-table-focus-border); }
-.ge-table-color-col-resize-handle-hover { background-color: var(--ge-table-color-col-resize-handle-hover-bg); }
-.ge-table-color-dragged-col-div { background-color: var(--ge-table-color-dragged-col-div-bg); }
-.ge-table-color-drop-zone { background-color: var(--ge-table-color-drop-zone-bg); }
-.ge-table-color-drop-zone { background-color: var(--ge-table-color-drop-zone); }
-.ge-table-color-tree-arrow-collapsed-color { background-color: var(--ge-table-color-tree-arrow-collapsed-color); }
-.ge-table-color-error { color: var(--ge-table-color-error-text); }
-.ge-table-tree-arrow-collapsed { color: var(--ge-table-tree-arrow-collapsed-color);}
-.ge-table-column-resize-handle:hover { background-color: var(--ge-table-column-resize-handle-border) }
-
-.ge-table-drop-zone { background-color: var(--ge-table-drop-zone-bg); }
-.ge-table-dragged-col-div { background-color: var(--ge-table-dragged-col-div-bg); }
-
- /*TODO geht das überhaupt?*/
-.ge-table-cell-editor-input,
-.ge-table-cell-editor-input:focus-within {
-  border: none;
-}

package/src/lib/angular-table/table-color-vars.css

@@ -1,141 +0,0 @@
-
-:root [data-theme= "light"] {
-  --ge-table-bg: #fff;
-  --ge-table-header-west-bg: var(--ge-table-header-center-bg);
-  --ge-table-header-center-bg: rgba(233, 233, 233, 0.5);
-  --ge-table-header-east-bg: var(--ge-table-header-center-bg);
-  --ge-table-header-west-text: var(--ge-table-header-center-text);
-  --ge-table-header-center-text: #000;
-  --ge-table-header-east-text: var(--ge-table-header-center-text);
-
-  --ge-table-header-west-horizontal-border: var(--ge-table-header-center-horizontal-border);
-  --ge-table-header-west-vertical-border: var(--ge-table-header-center-vertical-border);
-  --ge-table-header-center-horizontal-border: #ddd;
-  --ge-table-header-center-vertical-border: #ccc;
-  --ge-table-header-east-horizontal-border: var(--ge-table-header-center-horizontal-border);
-  --ge-table-header-east-vertical-border: var(--ge-table-header-center-vertical-border);
-
-
-  --ge-table-body-west-bg: var(--ge-table-header-center-bg);
-  --ge-table-body-center-bg: rgba(255,255,255, 0.5);
-  --ge-table-body-east-bg: var(--ge-table-header-center-bg);
-
-  --ge-table-body-west-text: var(--ge-table-header-center-text);
-  --ge-table-body-center-text: var(--ge-table-header-center-text);
-  --ge-table-body-east-text: var(--ge-table-header-center-text);
-
-  --ge-table-body-west-horizontal-border: var(--ge-table-header-west-horizontal-border);
-  --ge-table-body-west-vertical-border: var(--ge-table-header-west-vertical-border);
-  --ge-table-body-center-horizontal-border: #bbb;
-  --ge-table-body-center-vertical-border: #ddd;
-  --ge-table-body-east-horizontal-border: var(--ge-table-header-east-horizontal-border);
-  --ge-table-body-east-vertical-border: var(--ge-table-header-east-vertical-border);;
-
-
-  --ge-table-footer-west-bg: var(--ge-table-header-center-bg);
-  --ge-table-footer-center-bg: var(--ge-table-header-center-bg);
-  --ge-table-footer-east-bg: var(--ge-table-header-center-bg);
-
-  --ge-table-footer-west-text: var(--ge-table-header-center-text);
-  --ge-table-footer-center-text: var(--ge-table-header-center-text);
-  --ge-table-footer-east-text: var(--ge-table-header-center-text);
-
-  --ge-table-footer-west-horizontal-border: var(--ge-table-header-west-horizontal-border);
-  --ge-table-footer-west-vertical-border: var(--ge-table-header-west-vertical-border);
-  --ge-table-footer-center-horizontal-border: var(--ge-table-header-center-horizontal-border);
-  --ge-table-footer-center-vertical-border: var(--ge-table-header-center-vertical-border);
-  --ge-table-footer-east-horizontal-border: var(--ge-table-header-east-horizontal-border);
-  --ge-table-footer-east-vertical-border: var(--ge-table-header-east-vertical-border);
-
-
-  --ge-table-body-west-selected-range-bg: rgba(0, 152, 219, 0.4);
-  --ge-table-body-center-selected-range-bg: rgba(0, 152, 219, 0.4);
-  --ge-table-body-east-selected-range-bg: rgba(0, 152, 219, 0.4);
-  --ge-table-body-west-selected-range-text: #000;
-  --ge-table-body-center-selected-range-text: #000;
-  --ge-table-body-east-selected-range-text: #000;
-
-
-  --ge-table-border : #ccc;
-
-  --ge-table-row-odd-bg: transparent;
-  --ge-table-row-even-bg: transparent;
-  --ge-table-column-odd-bg: transparent;
-  --ge-table-column-even-bg: transparent;
-
-  --ge-table-hover-column-bg: rgba(0, 224, 255, 0.27);
-  --ge-table-hover-row-bg: rgba(0, 224, 255, 0.27);
-  --ge-table-focus-border: rgb(0, 255, 255);
-
-  --ge-table-color-error-text: #e00034;
-  --ge-table-tree-arrow-collapsed-color: #e00034;
-  --ge-table-column-resize-handle-border: rgb(0, 255, 255);
-
-  --ge-table-dragged-col-div-bg: lightcyan;
-  --ge-table-drop-zone-bg: rgba(244, 255, 242, 0.6);
-}
-
-
-
-
-:root [data-theme= "dark"] {
-  --ge-table-bg: #000;
-  --ge-table-header-west-bg: oklch(0% 0 0);
-  --ge-table-header-center-bg: oklch(0% 0 0);
-  --ge-table-header-east-bg: oklch(0% 0 0);
-  --ge-table-header-west-text: oklch(100% 0 0);
-  --ge-table-header-center-text: oklch(100% 0 0);
-  --ge-table-header-east-text: oklch(100% 0 0);
-  --ge-table-header-west-horizontal-border: oklch(30% 0 0);
-  --ge-table-header-west-vertical-border: oklch(32% 0 0);
-  --ge-table-header-center-horizontal-border: oklch(30% 0 0);
-  --ge-table-header-center-vertical-border: oklch(32% 0 0);
-  --ge-table-header-east-horizontal-border: oklch(30% 0 0);
-  --ge-table-header-east-vertical-border: oklch(32% 0 0);
-  --ge-table-body-west-bg: oklch(0% 0 0);
-  --ge-table-body-center-bg: oklch(0% 0 0);
-  --ge-table-body-east-bg: oklch(0% 0 0);
-  --ge-table-body-west-text: oklch(100% 0 0);
-  --ge-table-body-center-text: oklch(100% 0 0);
-  --ge-table-body-east-text: oklch(100% 0 0);
-  --ge-table-body-west-horizontal-border: oklch(30% 0 0);
-  --ge-table-body-west-vertical-border: oklch(32% 0 0);
-  --ge-table-body-center-horizontal-border: oklch(30% 0 0);
-  --ge-table-body-center-vertical-border: oklch(32% 0 0);
-  --ge-table-body-east-horizontal-border: oklch(30% 0 0);
-  --ge-table-body-east-vertical-border: oklch(32% 0 0);
-  --ge-table-footer-west-bg: oklch(0% 0 0);
-  --ge-table-footer-center-bg: oklch(0% 0 0);
-  --ge-table-footer-east-bg: oklch(0% 0 0);
-  --ge-table-footer-west-text: var(--ge-table-header-center-text);;
-  --ge-table-footer-center-text: var(--ge-table-header-center-text);;
-  --ge-table-footer-east-text: var(--ge-table-header-center-text);;
-  --ge-table-footer-west-horizontal-border: oklch(30% 0 0);
-  --ge-table-footer-west-vertical-border: oklch(32% 0 0);
-  --ge-table-footer-center-horizontal-border: oklch(30% 0 0);
-  --ge-table-footer-center-vertical-border: oklch(32% 0 0);
-  --ge-table-footer-east-horizontal-border: oklch(30% 0 0);
-  --ge-table-footer-east-vertical-border: oklch(32% 0 0);
-  --ge-table-border: oklch(32% 0 0);
-  --ge-table-row-odd-bg: oklch(0% 0 0);
-  --ge-table-row-even-bg: oklch(0% 0 0);
-  --ge-table-column-odd-bg: oklch(0% 0 0);
-  --ge-table-column-even-bg: oklch(0% 0 0);
-  --ge-table-hover-column-bg: oklch(0% 0 0);
-  --ge-table-hover-row-bg: oklch(0% 0 0);
-  --ge-table-focus-border: rgb(0, 255, 255);;
-  --ge-table-color-error-text: #ffa8b5;
-  --ge-table-tree-arrow-collapsed-color: #ffa8b5;
-  --ge-table-column-resize-handle-border: rgb(0, 255, 255);;
-  --ge-table-dragged-col-div-bg: oklch(0% 0 0);
-  --ge-table-drop-zone-bg: oklch(0% 0 0);
-
-
-
-  --ge-table-body-west-selected-range-bg: oklch(19% 0.2 205.2);
-  --ge-table-body-center-selected-range-bg: oklch(19% 0.2 205.2);
-  --ge-table-body-east-selected-range-bg: oklch(19% 0.2 205.2);
-  --ge-table-body-west-selected-range-text: #000;
-  --ge-table-body-center-selected-range-text: #000;
-  --ge-table-body-east-selected-range-text: #000;
-}