@trebco/treb 25.5.0 → 25.6.0

package/dist/treb.d.ts

@@ -1,4 +1,4 @@
-/*! API v25.5. Copyright 2018-2023 trebco, llc. All rights reserved. LGPL: https://treb.app/license */
+/*! API v25.6. Copyright 2018-2023 trebco, llc. All rights reserved. LGPL: https://treb.app/license */
 
 /**
  * add our tag to the map
@@ -367,7 +367,7 @@ export declare class EmbeddedSpreadsheet {
      * @param argument_separator - the argument separator to use when evaluating
      * the function. defaults to current locale.
      */
-    InsertAnnotation(formula: string, type?: string, rect?: IRectangle | RangeReference, argument_separator?: ',' | ';'): void;
+    InsertAnnotation(formula: string, type?: AnnotationType, rect?: IRectangle | RangeReference, argument_separator?: ',' | ';'): void;
 
     /**
      * Insert an image. This method will open a file chooser and (if an image
@@ -952,6 +952,7 @@ export interface FreezePane {
     rows: number;
     columns: number;
 }
+export type AnnotationType = 'treb-chart' | 'image' | 'external';
 export declare type BorderConstants = "none" | "all" | "outside" | "top" | "bottom" | "left" | "right";
 
 /**

package/package.json

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

package/treb-base-types/src/import.ts

@@ -1,30 +1,31 @@
-/*
- * This file is part of TREB.
- *
- * TREB is free software: you can redistribute it and/or modify it under the 
- * terms of the GNU General Public License as published by the Free Software 
- * Foundation, either version 3 of the License, or (at your option) any 
- * later version.
- *
- * TREB is distributed in the hope that it will be useful, but WITHOUT ANY 
- * WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS 
- * FOR A PARTICULAR PURPOSE. See the GNU General Public License for more 
- * details.
- *
- * You should have received a copy of the GNU General Public License along 
- * with TREB. If not, see <https://www.gnu.org/licenses/>. 
- *
- * Copyright 2022-2023 trebco, llc. 
- * info@treb.app
- * 
- */
-
+/*
+ * This file is part of TREB.
+ *
+ * TREB is free software: you can redistribute it and/or modify it under the 
+ * terms of the GNU General Public License as published by the Free Software 
+ * Foundation, either version 3 of the License, or (at your option) any 
+ * later version.
+ *
+ * TREB is distributed in the hope that it will be useful, but WITHOUT ANY 
+ * WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS 
+ * FOR A PARTICULAR PURPOSE. See the GNU General Public License for more 
+ * details.
+ *
+ * You should have received a copy of the GNU General Public License along 
+ * with TREB. If not, see <https://www.gnu.org/licenses/>. 
+ *
+ * Copyright 2022-2023 trebco, llc. 
+ * info@treb.app
+ * 
+ */
+
 import type { Style } from './style';
 import type { ValueType } from './value-type';
 import type { IArea } from './area';
 import type { AnnotationLayout } from './layout';
 import type { DataValidation } from './cell';
 import type { Table } from './table';
+import type { AnnotationType } from 'treb-grid';
 
 export interface CellParseResult {
   row: number,
@@ -43,7 +44,7 @@ export interface CellParseResult {
 
 export interface AnchoredAnnotation {
   layout: AnnotationLayout;
-  type?: string;
+  type?: AnnotationType;
   formula?: string;
 }
 

package/treb-base-types/src/table.ts

@@ -63,10 +63,6 @@ export interface Table {
    */
   name: string;
 
-  /**
-   * column names. these are the same (icase) as text in the first row
-   */
-
   /** table area */
   area: IArea;
 

package/treb-calculator/src/calculator.ts

@@ -1774,13 +1774,13 @@ export class Calculator extends Graph {
     }
 
     for (const entry of list) {
-      if (entry.formula) {
+      if (entry.data.formula) {
         if (!entry.temp.vertex) {
           entry.temp.vertex = new LeafVertex();
         }
         const vertex = entry.temp.vertex as LeafVertex;
         this.AddLeafVertex(vertex);
-        this.UpdateLeafVertex(vertex, entry.formula, context);
+        this.UpdateLeafVertex(vertex, entry.data.formula, context);
       }
     }
 

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

@@ -29,7 +29,8 @@ import type {
   SerializedModel, FreezePane, SerializedSheet,
   SheetChangeEvent, GridOptions, 
   GridSelection, CellEvent, FunctionDescriptor, 
-  AnnotationViewData, 
+  AnnotationViewData,
+  AnnotationType, 
 } from 'treb-grid';
 
 import {
@@ -1891,7 +1892,7 @@ export class EmbeddedSpreadsheet {
    * @param argument_separator - the argument separator to use when evaluating
    * the function. defaults to current locale.
    */
-  public InsertAnnotation(formula: string, type = 'treb-chart', rect?: IRectangle|RangeReference, argument_separator?: ','|';'): void {
+  public InsertAnnotation(formula: string, type: AnnotationType = 'treb-chart', rect?: IRectangle|RangeReference, argument_separator?: ','|';'): void {
 
     let target: IRectangle | Partial<Area> | undefined;
 
@@ -3171,7 +3172,7 @@ export class EmbeddedSpreadsheet {
         }
 
         for (const annotation of sheet.annotations || []) {
-          if (annotation.type === 'image' && annotation.data.src) {
+          if (annotation.type === 'image' && annotation.data?.src) {
             annotation.data.src = Store(annotation.data.src);
           }
         }
@@ -4350,15 +4351,20 @@ export class EmbeddedSpreadsheet {
             const annotation = this.grid.CreateAnnotation({
               type: 'image',
               formula: '',
+              data: {
+                scale: '',
+                src: contents,
+                original_size: { width: img.width || 300, height: img.height || 300 },
+              },
             }, undefined, undefined, {
               top: 30,
               left: 30,
               width: img.width || 300,
-              height: img.height || 300
+              height: img.height || 300,
             });
 
-            annotation.data.src = contents;
-            annotation.data.original_size = { width: img.width || 300, height: img.height || 300 };
+            // annotation.data.src = contents;
+            // annotation.data.original_size = { width: img.width || 300, height: img.height || 300 };
 
           }
 
@@ -4613,9 +4619,12 @@ export class EmbeddedSpreadsheet {
       annotation.dirty = false;
     }
 
-    if (view.content_node && annotation.data) {
+    // why was this testing for data? that would always exist on an annotation
+    // instance (but not in our new data type). maybe some legacy thing? 
 
-      if (annotation.type === 'treb-chart') {
+    if (view.content_node ) { // && annotation.annotation_data.data) {
+
+      if (annotation.data.type === 'treb-chart') {
 
         // if (!(self as any).TREB || !(self as any).TREB.CreateChart2) {
         //    console.warn('missing chart library');
@@ -4633,8 +4642,8 @@ export class EmbeddedSpreadsheet {
 
           const update_chart = () => {
 
-            if (annotation.formula) {
-              const parse_result = this.parser.Parse(annotation.formula);
+            if (annotation.data.formula) {
+              const parse_result = this.parser.Parse(annotation.data.formula);
               if (parse_result &&
                 parse_result.expression &&
                 parse_result.expression.type === 'call') {
@@ -4686,16 +4695,16 @@ export class EmbeddedSpreadsheet {
         }
 
       }
-      else if (annotation.type === 'image') {
-        if (typeof annotation.data.src === 'string') {
+      else if (annotation.data.type === 'image') {
+        if (typeof annotation.data.data?.src === 'string') {
 
-          const reference = ValidateURI(annotation.data.src);
+          const reference = ValidateURI(annotation.data.data.src);
           if (reference) {
  
             const img = document.createElement('img');
             img.src = reference;
 
-            if (annotation.data.scale === 'fixed') {
+            if (annotation.data.data.scale === 'fixed') {
               img.style.position = 'relative';
               img.style.left = '50%';
               img.style.top = '50%';
@@ -5044,7 +5053,7 @@ export class EmbeddedSpreadsheet {
       for (const sheet_data of sheets) {
 
         if (sheet_data.annotations) {
-          for (const annotation of (sheet_data.annotations as Annotation[])) {
+          for (const annotation of (sheet_data.annotations)) {
             if (annotation.formula) {
               const translated = translate(annotation.formula);
               if (translated) {
@@ -5161,7 +5170,7 @@ export class EmbeddedSpreadsheet {
           sheet.background_image = Unshare(sheet.background_image);
         }
         for (const annotation of sheet.annotations || []) {
-          if (annotation.type === 'image' && annotation.data.src) {
+          if (annotation.type === 'image' && annotation.data?.src) {
             annotation.data.src = Unshare(annotation.data.src);
           }
         }

package/treb-export/src/export2.ts

@@ -35,7 +35,7 @@ import { template } from './template-2';
 import type { SerializedSheet } from 'treb-grid';
 
 import type { IArea, ICellAddress, CellValue, DataValidation,
-         AnnotationLayout, Corner as LayoutCorner, Cell } from 'treb-base-types';
+         AnnotationLayout, Corner as LayoutCorner, Cell, Rectangle } from 'treb-base-types';
 import { Area, Cells, ValueType, Style, ValidationType } from 'treb-base-types';
 
 // import * as xmlparser from 'fast-xml-parser';
@@ -61,6 +61,7 @@ import type { ImageOptions } from './drawing2/embedded-image';
 import type { TwoCellAnchor } from './drawing2/drawing2';
 import { Drawing } from './drawing2/drawing2';
 import type { TableDescription, TableFooterType } from './workbook2';
+import type { AnnotationData } from 'treb-grid/src/types/annotation';
 
 export class Exporter {
 
@@ -651,12 +652,7 @@ export class Exporter {
    * the target units are.
    */
   public AnnotationRectToAnchor(
-      annotation_rect: { 
-        left: number; 
-        top: number; 
-        width: number; 
-        height: number; 
-      }, 
+      src_rect: Partial<Rectangle>, 
       sheet: SerializedSheet): TwoCellAnchor {
     
     const anchor: TwoCellAnchor = {
@@ -664,6 +660,11 @@ export class Exporter {
       to: {row: -1, column: -1},
     };
 
+    const annotation_rect = {
+      top: 0, left: 0, width: 301, height: 301,
+      ...src_rect,
+    };
+
     const rect = {
       ...annotation_rect,  // {top, left, width, height}
       right: annotation_rect.left + annotation_rect.width,
@@ -706,7 +707,7 @@ export class Exporter {
 
     const images: Array<{ anchor: TwoCellAnchor, options: ImageOptions }> = [];
 
-    for (const annotation of sheet_source.annotations || []) {
+    for (const annotation of (sheet_source.annotations as Array<AnnotationData & {rect?: Partial<Rectangle>}>) || []) {
       if (annotation.type === 'image' && annotation.data?.src) {
 
         // this is (should be) a data URI in base64. at least (atm) 
@@ -940,9 +941,14 @@ export class Exporter {
             }
           }
 
-          if (annotation.rect) {
+          // FIXME: fix this type (this happened when we switched from annotation
+          // class to a data interface)
+
+          const rect = (annotation as AnnotationData & { rect?: Partial<Rectangle>}).rect;
+
+          if (rect) {
             charts.push({
-              anchor: this.AnnotationRectToAnchor(annotation.rect, sheet_source), options});
+              anchor: this.AnnotationRectToAnchor(rect, sheet_source), options});
             // sheet.AddChart(this.AnnotationRectToAnchor(annotation.rect, sheet_source), options);
           }
           else if (annotation.layout) {

package/treb-export/src/import2.ts

@@ -37,6 +37,7 @@ import { XMLUtils } from './xml-utils';
 
 // import { one_hundred_pixels } from './constants';
 import { ColumnWidthToPixels } from './column-width';
+import type { AnnotationType } from 'treb-grid';
 
 interface SharedFormula {
   row: number;
@@ -697,7 +698,7 @@ export class Importer {
           br: AnchorToCorner(descriptor.anchor.to),
         };
 
-        let type: string|undefined;
+        let type: AnnotationType|undefined;
         const args: Array<string|undefined> = [];
         let func = '';        
         const series = descriptor.chart?.series;

package/treb-grid/src/index.ts

@@ -37,4 +37,5 @@ export { BorderConstants } from './types/border_constants';
 export type { SerializeOptions } from './types/serialize_options';
 export type { FunctionDescriptor, ArgumentDescriptor } from './editors/autocomplete_matcher';
 export { UA } from './util/ua';
-export type { SetRangeOptions } from './types/set_range_options';
+export type { SetRangeOptions } from './types/set_range_options';
+export type { AnnotationData, AnnotationType } from './types/annotation';

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

@@ -672,21 +672,21 @@ export abstract class BaseLayout {
         // be persisted (assuming it's saved). eventually this should
         // be superfluous...
 
-        if (annotation.rect && !annotation.layout) {
+        if (annotation.rect && !annotation.data.layout) {
 
           // this is breaking on freeze when the spreadsheet is scrolled because
           // the top-left uses the freeze panes. stop doing that.
 
           annotation.scaled_rect = annotation.rect.Scale(this.scale);
-          annotation.layout = this.RectToAnnotationLayout(annotation.scaled_rect);
+          annotation.data.layout = this.RectToAnnotationLayout(annotation.scaled_rect);
         }
 
 
         // FIXME: merge cells? [...]
 
-        if (annotation.layout) {
+        if (annotation.data.layout) {
 
-          const rect = this.AnnotationLayoutToRect(annotation.layout);
+          const rect = this.AnnotationLayoutToRect(annotation.data.layout);
           rect.ApplyStyle(view.node);
 
           // NOTE: we still set the scaled rect, because that's used in 
@@ -949,9 +949,9 @@ export abstract class BaseLayout {
           }
 
         }, () => {
-          annotation.extent = undefined; // reset
+          annotation.data.extent = undefined; // reset
           // annotation.rect = rect.Scale(1/this.scale);
-          annotation.layout = this.RectToAnnotationLayout(rect);
+          annotation.data.layout = this.RectToAnnotationLayout(rect);
           // this.grid_events.Publish({ type: 'annotation', annotation, event: 'move' });
           resolve({ type: 'annotation', annotation, event: 'move' })
         });
@@ -969,11 +969,14 @@ export abstract class BaseLayout {
         node.focus();
 
         let aspect = 0;
-        if (annotation.data?.original_size
-          && annotation.data.original_size.width
-          && annotation.data.original_size.height) {
-          aspect = annotation.data.original_size.width /
-            annotation.data.original_size.height;
+        if (annotation.data.type === 'image') {
+          if (annotation.data.data
+            && annotation.data.data.original_size
+            && annotation.data.data.original_size.width
+            && annotation.data.data.original_size.height) {
+            aspect = annotation.data.data.original_size.width /
+              annotation.data.data.original_size.height;
+          }
         }
 
         const bounds = node.getBoundingClientRect();
@@ -1029,9 +1032,9 @@ export abstract class BaseLayout {
           }
 
         }, () => {
-          annotation.extent = undefined; // reset
+          annotation.data.extent = undefined; // reset
           // annotation.rect = rect.Scale(1/this.scale);
-          annotation.layout = this.RectToAnnotationLayout(rect);
+          annotation.data.layout = this.RectToAnnotationLayout(rect);
 
           // this.grid_events.Publish({ type: 'annotation', annotation, event: 'resize' });
           resolve({ type: 'annotation', annotation, event: 'resize' });

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

@@ -79,74 +79,66 @@ export interface ViewData {
 
 }
 
-/**
- * why is this a class? it doesn't do anything.
- * FIXME: -> interface
- */
-export class Annotation {
-
-  /** 
-   * the key field is used to identify and coordinate annotations when we 
-   * have freeze panes. when an annotation crosses a freeze pane, we need
-   * two copies of the rendered node so that we can scroll. we use the key
-   * to match the frozen/unfrozen instances.
-   */
-  public get key(): number { return this.key_; }
-
-  /** coordinates, in sheet space */
-  public rect?: Rectangle;
+export interface ImageAnnotationData {
+  src: string;
+  scale: string;
+  original_size: { 
+    width: number; 
+    height: number;
+  };
+}
 
-  // public get rect(): Rectangle|undefined { return this.rect_; }
+export type AnnotationType = 'treb-chart'|'image'|'external';
 
-  /** display coordinates, possibly scaled. not persisted. */
-  public scaled_rect?: Rectangle;
+/**
+ * splitting persisted data from the annotation class. that class might
+ * disappear in the future in favor of just a type. this interface should
+ * fully match the old Partial<Annotation> we used before. note that we 
+ * used to define values for all members, but they may now be undefined
+ * because the Annotation class as a Partial instance of this data.
+ * 
+ * conceptually annotation was originally intended to support types other
+ * than our own charts and images, but no one ever used it. so we could 
+ * lock down the `type` field if we wanted to. or perhaps have an `external`
+ * type with opaque data. TODO.
+ * 
+ */
+export interface AnnotationDataBase {
 
   /** the new layout, persisted and takes preference over the old one */
-  public layout?: AnnotationLayout;
+  layout?: AnnotationLayout;
 
-  /** opaque data. this is serialized, so it's persistent data */
-  public data: any = {};
-
-  // opaque string which will be added to the class of any containing node 
-  // public class_name?: string;
-
-  /** type, for filtering. ensure a value */
-  public type = '';
-
-  /** also opaque data, but not serialized. */
-  public temp: any = {};
+  /** 
+   * the old layout used rectangles, and we need to keep support for
+   * that. this is not the layout rectangle. this rectangle is just
+   * for serialization/deserialization. the actual rectangle is maintained
+   * in the Annotation class.
+   */
+  rect?: Partial<Rectangle>;
 
   /** annotation can be resized. this is advisory, for UI */
-  public resizable = true;
+  resizable: boolean;
 
   /** annotation can be moved. this is advisory, for UI */
-  public movable = true;
+  movable: boolean;
 
   /** annotation can be removed/deleted. this is advisory, for UI */
-  public removable = true;
+  removable: boolean;
 
   /** annotation can be selected. this is advisory, for UI */
-  public selectable = true;
+  selectable: boolean;
 
   /** move when resizing/inserting rows/columns */
-  public move_with_cells = true;
+  move_with_cells: boolean;
 
   /** resize when resizing/inserting rows/columns */
-  public resize_with_cells = true;
-
-  public view: ViewData[] = [];
-
-  /**
-   * advisory, meaning we probably need an update if there's an opportunity.
-   * only advisory and not persisted.
-   */
-  public dirty?: boolean;
+  resize_with_cells: boolean;
 
   /**
    * optional formula. the formula will be updated on structure events
    * (insert/delete row/column).
    */
-  public formula = '';
+  formula: string;
 
   /** 
    * extent, useful for exporting. we could probably serialize this,
@@ -159,54 +151,90 @@ export class Annotation {
    * dynamically but since it won't change all that often, we might 
    * as well precalculate.
    */
-  public extent?: ICellAddress;
+  extent: ICellAddress;
 
-  private key_ = (key_generator++);
+}
+
+export interface AnnotationImageData extends AnnotationDataBase {
+  type: 'image';
+  data: ImageAnnotationData;
+}
+
+export interface AnnotationChartData extends AnnotationDataBase {
+  type: 'treb-chart';
+}
+
+export interface AnnotationExternalData extends AnnotationDataBase {
+  type: 'external';
+  data: Record<string, string>;
+}
+
+export type AnnotationData = AnnotationChartData | AnnotationImageData | AnnotationExternalData;
+
+/**
+ * why is this a class? it doesn't do anything.
+ * FIXME: -> interface
+ */
+export class Annotation {
+
+  public data: Partial<AnnotationData> = {};
+
+  /** 
+   * the key field is used to identify and coordinate annotations when we 
+   * have freeze panes. when an annotation crosses a freeze pane, we need
+   * two copies of the rendered node so that we can scroll. we use the key
+   * to match the frozen/unfrozen instances.
+   */
+  public get key(): number { return this.key_; }
+
+  /** coordinates, in sheet space */
+  public rect?: Rectangle;
+
+  // public get rect(): Rectangle|undefined { return this.rect_; }
+
+  /** display coordinates, possibly scaled. not persisted. */
+  public scaled_rect?: Rectangle;
+
+  /** also opaque data, but not serialized. */
+  public temp: any = {};
+
+  public view: ViewData[] = [];
 
   /**
-   * constructor takes a property bag (from json, generally). note that
-   * if you are iterating keys on `this`, there has to be an initial value
-   * or the key won't exist.
+   * advisory, meaning we probably need an update if there's an opportunity.
+   * only advisory and not persisted.
    */
-  constructor(opts: Partial<Annotation>&{rect?: Partial<Rectangle>} = {}) {
-    for (const key of Object.keys(this) as Array<keyof Annotation>){
-      if (key !== 'layout' // && key !== 'rect' 
-          && opts[key]) { // key !== 'cell_address' && opts[key]) {
-        (this as any)[key] = opts[key];
-      }
-    }
+  public dirty?: boolean;
 
-    if (opts.layout) {
-      this.layout = JSON.parse(JSON.stringify(opts.layout));
-    }
+  private key_ = (key_generator++);
+
+  /**
+   * constructor takes persisted data
+   */
+  constructor(opts: Partial<AnnotationData> = {}) {
+    this.data = JSON.parse(JSON.stringify(opts)); // why clone?
     if (opts.rect) {
       this.rect = Rectangle.Create(opts.rect);
     }
   }
 
   /**
-   * serialization method drops node and trims
+   * serialization just returns persisted data, plus we update the 
+   * rectangle. 
+   * 
+   * anyone serializing annotations should just be fetching the data
+   * object, but we're leaving this in place because we can't trace 
+   * it back using tooling. that's a real drawback of toJSON, we 
+   * should stop using it.
+   * 
+   * although as long as we need to support `rect` here, it's not bad
+   * that we do it this way. perhaps change the function name, and 
+   * call it directly?
+   * 
    */
-  public toJSON(): Partial<Annotation> {
-    const result: Partial<Annotation> = {}; // { rect: this.rect };
-
-    if (this.data) result.data = this.data;
-    if (this.formula) result.formula = this.formula;
-    if (this.type) result.type = this.type;
-    // if (this.class_name) result.class_name = this.class_name;
-
-    if (!this.resizable) result.resizable = this.resizable;
-    if (!this.movable) result.movable = this.movable;
-    if (!this.removable) result.removable = this.removable;
-    if (!this.selectable) result.selectable = this.selectable;
-
-    if (!this.move_with_cells) result.move_with_cells = this.move_with_cells;
-    if (!this.resize_with_cells) result.resize_with_cells = this.resize_with_cells;
-
-    if (this.layout) result.layout = this.layout;
-    if (this.extent) result.extent = this.extent;
-
-    return result;
+  public toJSON(): Partial<AnnotationData> {
+    return {
+      ...this.data, rect: this.rect };
   }
 
 }