@trebco/treb 25.7.7 → 25.8.0

package/dist/treb.d.ts

@@ -1,4 +1,4 @@
-/*! API v25.7. Copyright 2018-2023 trebco, llc. All rights reserved. LGPL: https://treb.app/license */
+/*! API v25.8. Copyright 2018-2023 trebco, llc. All rights reserved. LGPL: https://treb.app/license */
 
 /**
  * add our tag to the map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@trebco/treb",
-  "version": "25.7.7",
+  "version": "25.8.0",
   "license": "LGPL-3.0-or-later",
   "homepage": "https://treb.app",
   "repository": {

package/treb-embed/src/embedded-spreadsheet.ts

@@ -653,7 +653,11 @@ export class EmbeddedSpreadsheet {
     //this.extra_calculator = //new Calculator(this.model);
     //  this.CreateCalculator(this.model);
 
-    this.grid = new Grid(grid_options, this.parser, this.model);
+    // update: tell the grid if we don't want to initialize the DOM,
+    // if we don't have a container. that's distinct (at the moment)
+    // from headless, which is a state that can change.
+
+    this.grid = new Grid(grid_options, this.parser, this.model, undefined, !!container);
 
     if (this.options.headless) {
       this.grid.headless = true; // FIXME: move into grid options
@@ -870,9 +874,9 @@ export class EmbeddedSpreadsheet {
     else {
       if (!EmbeddedSpreadsheet.one_time_warnings.headless) {
         EmbeddedSpreadsheet.one_time_warnings.headless = true;
-        console.info('not initializing grid; don\'t call UI functions');
+        console.info('not initializing layout; don\'t call UI functions');
       }
-      this.grid.headless = true; // ensure
+      // this.grid.headless = true; // ensure
     }
 
     // moved up so we can share parser w/ grid

package/treb-grid/src/layout/base_layout.ts

@@ -151,7 +151,7 @@ export abstract class BaseLayout {
     this.scroll_reference_node.scrollTop = offset.y;
   }
 
-  protected dropdown_caret: SVGSVGElement;
+  protected dropdown_caret!: SVGSVGElement;
 
   /** we have to disable mock selection for IE or it breaks key handling */
   private trident = ((typeof navigator !== 'undefined') &&
@@ -162,9 +162,9 @@ export abstract class BaseLayout {
 
   private tooltip_state?: 'up' | 'left';
 
-  private tooltip: HTMLDivElement;
+  private tooltip!: HTMLDivElement;
 
-  private dropdown_list: HTMLDivElement;
+  private dropdown_list!: HTMLDivElement;
   private dropdown_caret_visible = false;
   private dropdown_callback?: (value: CellValue) => void;
   private dropdown_selected?: HTMLElement;
@@ -174,10 +174,9 @@ export abstract class BaseLayout {
   // private error_highlight: HTMLDivElement;
   // private error_highlight_timeout?: any;
 
-  private note_node: HTMLDivElement;
-  private sort_button: HTMLButtonElement;
-
-  private title_node: HTMLDivElement;
+  private note_node!: HTMLDivElement;
+  private sort_button!: HTMLButtonElement;
+  private title_node!: HTMLDivElement;
 
   private row_cache: number[] = [];
   private column_cache: number[] = [];
@@ -188,7 +187,11 @@ export abstract class BaseLayout {
   private initialized = false;
 
 
-  constructor(protected model: DataModel, protected view: ViewModel) {
+  constructor(protected model: DataModel, protected view: ViewModel, mock = false) {
+
+    if (mock) {
+      return;
+    }
 
     // now attaching to node... no longer global
     // actually if we are not in a web component, we might as well

package/treb-grid/src/layout/mock-layout.ts

@@ -0,0 +1,33 @@
+
+import type { DataModel, ViewModel } from '../types/data_model';
+import type { Tile } from '../types/tile';
+import { BaseLayout } from './base_layout';
+
+export class MockLayout extends BaseLayout {
+
+  public constructor(model: DataModel, view: ViewModel) {
+    super(model, view, true);
+  }
+
+  public InitializeInternal(container: HTMLElement, scroll_callback: () => void): void {
+    
+  }
+
+  protected UpdateGridTemplates(columns: boolean, rows: boolean): void {
+    
+  }
+
+  protected UpdateTileGridPosition(tile: Tile): void {
+    
+  }
+
+  protected UpdateContainingGrid(): void {
+    
+  }
+
+  public ResizeCursor(resize?: 'row' | 'column' | undefined): void {
+    
+  }
+
+}
+

package/treb-grid/src/types/grid.ts

@@ -65,6 +65,7 @@ import { TabBar } from './tab_bar';
 import type { StatsEntry } from './tab_bar';
 
 import { Sheet } from './sheet';
+import { MockLayout } from '../layout/mock-layout';
 import type { BaseLayout } from '../layout/base_layout';
 import { TileRange } from '../layout/base_layout';
 
@@ -328,10 +329,10 @@ export class Grid extends GridBase {
   private render_token = 0;
 
   /** */
-  private tile_renderer: TileRenderer;
+  private tile_renderer?: TileRenderer;
 
   /** */
-  private selection_renderer: SelectionRenderer;
+  private selection_renderer?: SelectionRenderer;
 
   // FIXME: move [why?]
 
@@ -346,7 +347,8 @@ export class Grid extends GridBase {
     options: GridOptions = {}, 
     parser: Parser,
     model: DataModel,
-    theme: Theme = DefaultTheme) {
+    theme: Theme = DefaultTheme,
+    initialze_dom = true ) {
 
     super(options, parser, model);  
 
@@ -356,6 +358,12 @@ export class Grid extends GridBase {
 
     this.theme = JSON.parse(JSON.stringify(theme));
 
+    if (!initialze_dom) {
+      this.headless = true;
+      this.layout = new MockLayout(this.model, this.view);
+      return;
+    }
+
     this.layout = new GridLayout(this.model, this.view);
 
     if (options.initial_scale) {
@@ -1226,6 +1234,10 @@ export class Grid extends GridBase {
    */
   public Initialize(view_node: HTMLElement, toll_initial_render = false): void {
 
+    if (!this.tile_renderer || !this.selection_renderer) {
+      return;
+    }
+
     // grid no longer has access to the outer container, it just has 
     // the "view" container. so we need to move things like UA classes
     // outside of this class. we should move theme parsing as well, so
@@ -2125,6 +2137,10 @@ export class Grid extends GridBase {
 
   private AutoSizeColumn(sheet: Sheet, column: number, allow_shrink = true): void {
 
+    if (!this.tile_renderer) {
+      return;
+    }
+
     // const context = Sheet.measurement_canvas.getContext('2d');
     // if (!context) return;
 
@@ -2729,7 +2745,7 @@ export class Grid extends GridBase {
 
   private Repaint(force = false, full_tile = false, force_headers = false) {
 
-    if (this.headless) { return; }
+    if (this.headless || !this.tile_renderer) { return; }
 
     if (this.tile_update_pending) {
       this.tile_update_pending = false;
@@ -3497,6 +3513,10 @@ export class Grid extends GridBase {
     event.stopPropagation();
     event.preventDefault();
 
+    if (!this.selection_renderer) {
+      return;
+    }
+
     // needed for legacy
 
     if (this.cell_resize.row >= 0 || this.cell_resize.column >= 0) {
@@ -4616,7 +4636,7 @@ export class Grid extends GridBase {
     const show_primary_selection = this.hide_selection ? false :
       (!this.editing_state) || (this.editing_cell.sheet_id === this.active_sheet.id);
   
-    this.selection_renderer.RenderSelections(show_primary_selection, rerender);
+    this.selection_renderer?.RenderSelections(show_primary_selection, rerender);
   }
 
   /**
@@ -6876,7 +6896,7 @@ export class Grid extends GridBase {
       // columns. we should be able to fix this, or we can just flush
       // all overflows and force them to get recreated.
 
-      this.tile_renderer.FlushOverflows();
+      this.tile_renderer?.FlushOverflows();
 
       // note event is sent in exec command, not implicit here