@trebco/treb 27.5.3 → 27.9.0

package/treb-grid/src/index.ts

@@ -39,4 +39,5 @@ export type { FunctionDescriptor, ArgumentDescriptor } from './editors/autocompl
 export { UA } from './util/ua';
 export type { SetRangeOptions } from './types/set_range_options';
 export type { AnnotationData, AnnotationType } from './types/annotation';
-export type { ExternalEditorType, DependencyList, ExternalEditorCallback } from './types/external_editor';
+export type { ExternalEditorConfig, DependencyList, ExternalEditorCallback } from './types/external_editor_config';
+export * from './types/conditional_format';

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

@@ -23,7 +23,7 @@ import { DOMUtilities } from '../util/dom_utilities';
 import type { DataModel, ViewModel } from '../types/data_model';
 
 import type { Tile } from '../types/tile';
-import type { Theme, Point, Extent, Size, Position, ICellAddress, Table } from 'treb-base-types';
+import type { Theme, Point, Extent, Size, Position, ICellAddress, Table, IArea } from 'treb-base-types';
 import { Style, Area, Rectangle, ThemeColor } from 'treb-base-types';
 
 import { MouseDrag } from '../types/drag_mask';
@@ -357,7 +357,7 @@ export abstract class BaseLayout {
     this.note_node = DOMUtilities.CreateDiv('treb-note');
     this.title_node = DOMUtilities.CreateDiv('treb-hover-title');
 
-    this.sort_button = DOMUtilities.Create<HTMLButtonElement>(
+    this.sort_button = DOMUtilities.Create(
       'button', 
       'treb-sort-button', undefined, undefined, { title: 'Sort table', tabindex: '-1'});
 
@@ -2160,25 +2160,33 @@ export abstract class BaseLayout {
     }
   }
 
-  public DirtyArea(area: Area): void {
+  public DirtyArea(areas: IArea|IArea[]): void {
 
     if (!this.initialized) return;
 
-    const start = { row: 0, column: 0 };
-    const end = { row: this.grid_tiles[0].length - 1, column: this.grid_tiles.length - 1 };
-
-    if (area.start.column !== Infinity) {
-      start.column = end.column = this.TileIndexForColumn(area.start.column);
-      if (area.end.column !== area.start.column) end.column = this.TileIndexForColumn(area.end.column);
-    }
-    if (area.start.row !== Infinity) {
-      start.row = end.row = this.TileIndexForRow(area.start.row);
-      if (area.end.row !== area.start.row) end.row = this.TileIndexForRow(area.end.row);
+    if (!Array.isArray(areas)) {
+      areas = [areas];
     }
-    for (let column = start.column; column <= end.column; column++) {
-      for (let row = start.row; row <= end.row; row++) {
-        this.grid_tiles[column][row].dirty = true;
+
+    for (const area of areas) {
+
+      const start = { row: 0, column: 0 };
+      const end = { row: this.grid_tiles[0].length - 1, column: this.grid_tiles.length - 1 };
+
+      if (area.start.column !== Infinity) {
+        start.column = end.column = this.TileIndexForColumn(area.start.column);
+        if (area.end.column !== area.start.column) end.column = this.TileIndexForColumn(area.end.column);
       }
+      if (area.start.row !== Infinity) {
+        start.row = end.row = this.TileIndexForRow(area.start.row);
+        if (area.end.row !== area.start.row) end.row = this.TileIndexForRow(area.end.row);
+      }
+      for (let column = start.column; column <= end.column; column++) {
+        for (let row = start.row; row <= end.row; row++) {
+          this.grid_tiles[column][row].dirty = true;
+        }
+      }
+
     }
 
   }

package/treb-grid/src/render/tile_renderer.ts

@@ -239,7 +239,7 @@ export class TileRenderer {
    */
   public OverflowDirty(full_tile = false): void {
 
-    const mutated = [];
+    const mutated: OverflowRecord[] = [];
 
     for (const overflow of this.overflow_areas) {
       const row = overflow.area.start.row;
@@ -1341,6 +1341,7 @@ export class TileRenderer {
     else {
 
       const fill = ThemeColor2(this.theme, style.fill);
+
       if (fill) {
         context.fillStyle = fill;
         context.fillRect(0, 0, width - 1, height - 1);

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

@@ -0,0 +1,168 @@
+
+import type { CellStyle, EvaluateOptions, IArea, Color, Gradient, GradientStop, UnionValue } from 'treb-base-types';
+
+interface VertexPlaceholder {
+  result: UnionValue;
+  updated: boolean;
+} 
+
+export interface CondifionalFormatExpressionOptions {
+  style: CellStyle;
+  expression: string;
+  options?: EvaluateOptions;
+}
+
+/** 
+ * conditional format predicated on an expression. if the expression 
+ * evaluates to true, we apply the style. otherwise no.
+ */
+export interface ConditionalFormatExpression extends CondifionalFormatExpressionOptions {
+  
+  type: 'expression';
+  area: IArea;
+
+  /** @internal */
+  internal?: {
+    vertex?: VertexPlaceholder;
+  };
+
+}
+
+export interface ConditionalFormatGradientOptions {
+
+  /** property defaults to fill */
+  property?: 'fill'|'text';
+
+  /** defaults to HSL */
+  color_space?: 'HSL'|'RGB';
+
+  /** gradient stops, required */
+  stops: Array<{ value: number, color: Color }>;
+  
+  /** min and max are optional. if not provided, we use the min/max of the range of data. */
+  min?: number;
+  
+  /** min and max are optional. if not provided, we use the min/max of the range of data. */
+  max?: number;
+
+}
+
+
+export const StandardGradientsList = {
+  'red-green': {
+    color_space: 'RGB',
+    stops: [
+      { value: 0, color: { theme: 5, tint: .5 }}, 
+      { value: 1, color: { theme: 9, tint: .5 }}, 
+    ] as GradientStop[],
+  },
+  'red-yellow-green': {
+    color_space: 'RGB',
+    stops: [
+      { value: 0, color: { theme: 5, tint: .5 }}, 
+      { value: 0.5, color: { theme: 7, tint: .5 }}, 
+      { value: 1, color: { theme: 9, tint: .5 }}, 
+    ] as GradientStop[],
+  },
+  'green-red': {
+    color_space: 'RGB',
+    stops: [
+      { value: 0, color: { theme: 9, tint: .5 }}, 
+      { value: 1, color: { theme: 5, tint: .5 }}, 
+    ] as GradientStop[],
+  },
+  'green-yellow-red': {
+    color_space: 'RGB',
+    stops: [
+      { value: 0, color: { theme: 9, tint: .5 }}, 
+      { value: 0.5, color: { theme: 7, tint: .5 }}, 
+      { value: 1, color: { theme: 5, tint: .5 }}, 
+    ] as GradientStop[],
+  },
+} as const; 
+export type StandardGradient = keyof typeof StandardGradientsList;
+
+export interface ConditionalFormatGradient extends ConditionalFormatGradientOptions {
+  type: 'gradient';
+  area: IArea;
+
+  /** @internal */
+  internal?: {
+    gradient?: Gradient;
+    vertex?: VertexPlaceholder;
+  };
+}
+
+export interface ConditionalFormatCellMatchOptions {
+  style: CellStyle;
+  expression: string;
+  options?: EvaluateOptions;
+}
+
+export interface ConditionalFormatCellMatch extends ConditionalFormatCellMatchOptions {
+  type: 'cell-match';
+  area: IArea;
+
+  /** @internal */
+  internal?: {
+    vertex?: VertexPlaceholder;
+  };
+}
+
+export interface ConditionalFormatCellMatchOptions {
+  style: CellStyle;
+  expression: string;
+  options?: EvaluateOptions;
+}
+
+export interface ConditionalFormatCellMatch extends ConditionalFormatCellMatchOptions {
+  type: 'cell-match';
+  area: IArea;
+
+  /** @internal */
+  internal?: {
+    vertex?: VertexPlaceholder;
+  };
+}
+
+export interface ConditionalFormatDuplicateValuesOptions {
+  style: CellStyle;
+
+  /** true to highlight unique cells, false to highlight duplicates. defaults to false. */
+  unique?: boolean;
+}
+
+export interface ConditionalFormatDuplicateValues extends ConditionalFormatDuplicateValuesOptions {
+
+  type: 'duplicate-values';
+  area: IArea;
+
+  /** @internal */
+  internal?: {
+    vertex?: VertexPlaceholder;
+  };
+
+}
+
+/** 
+ * union, plus we're adding a state used to track application.
+ * that state is serialized if it's true. 
+ * we also add an internal field that will be type-specific, and not serialized.
+ * 
+ * ...everybody has a vertex now, we could standardize it
+ * 
+ */
+export type ConditionalFormat = { internal?: unknown } & (
+    ConditionalFormatDuplicateValues |
+    ConditionalFormatExpression |
+    ConditionalFormatCellMatch |
+    ConditionalFormatGradient
+  );
+
+/**
+ * the list of formats, in reverse order of precedence. as a starting
+ * point we're using the naive approach, just applying everything in
+ * order. that may change.
+ */
+export type ConditionalFormatList = ConditionalFormat[];
+

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

@@ -23,8 +23,8 @@ import type { Sheet } from './sheet';
 import type { IArea, ICellAddress, Table, CellStyle } from 'treb-base-types';
 import type { SerializedSheet } from './sheet_types';
 import { NamedRangeCollection } from './named_range';
-import type { ExpressionUnit, UnitAddress, UnitStructuredReference, UnitRange } from 'treb-parser';
-import { Style } from 'treb-base-types';
+import { type ExpressionUnit, type UnitAddress, type UnitStructuredReference, type UnitRange, Parser, QuotedSheetNameRegex } from 'treb-parser';
+import { Area, IsCellAddress, Style } from 'treb-base-types';
 
 export interface SerializedMacroFunction {
   name: string;
@@ -159,6 +159,8 @@ export class SheetCollection {
  */
 export class DataModel {
 
+  public readonly parser: Parser = new Parser();
+
   /** document metadata */
   public document_name?: string;
 
@@ -317,7 +319,132 @@ export class DataModel {
     
     return undefined;
   }
-  
+
+  /**
+   * return an address label for this address (single cell or range)
+   * 
+   * @param address 
+   * @param active_sheet 
+   */
+  public AddressToLabel(address: ICellAddress|IArea, active_sheet?: Sheet) {
+
+    const start = IsCellAddress(address) ? address : address.start;
+    const parts = IsCellAddress(address) ? 
+      [Area.CellAddressToLabel(address)] : 
+      [Area.CellAddressToLabel(address.start), Area.CellAddressToLabel(address.end)];
+
+    const sheet = this.sheets.Find(start.sheet_id || 0);
+    const name = (sheet?.name) ? 
+        (QuotedSheetNameRegex.test(sheet.name) ? `'${sheet.name}'` : sheet.name) : '';
+    
+    return name + (name ? '!' : '') + (parts[0] === parts[1] ? parts[0] : parts.join(':'));
+    
+  }
+
+  // --- resolution api, moved from calculator ---------------------------------
+
+  /**
+   * returns false if the sheet cannot be resolved, which probably
+   * means the name changed (that's the case we are working on with
+   * this fix).
+   */
+  public ResolveSheetID(expr: UnitAddress|UnitRange, context?: ICellAddress, active_sheet?: Sheet): boolean {
+
+    const target = expr.type === 'address' ? expr : expr.start;
+
+    if (target.sheet_id) {
+      return true;
+    }
+
+    if (target.sheet) {
+      const sheet = this.sheets.Find(target.sheet);
+      if (sheet) {
+        target.sheet_id = sheet.id;
+        return true;
+      }
+
+      /*
+      const lc = target.sheet.toLowerCase();
+      for (const sheet of this.model.sheets.list) {
+        if (sheet.name.toLowerCase() === lc) {
+          target.sheet_id = sheet.id;
+          return true;
+        }
+      }
+      */
+    }
+    else if (context?.sheet_id) {
+      target.sheet_id = context.sheet_id;
+      return true;
+    }
+    else if (active_sheet?.id) {
+      target.sheet_id = active_sheet.id;
+      return true;
+    }
+
+    return false; // the error
+
+  }
+
+  /** wrapper method ensures it always returns an Area (instance, not interface) */
+  public ResolveArea(address: string|ICellAddress|IArea, active_sheet: Sheet): Area {
+    const resolved = this.ResolveAddress(address, active_sheet);
+    return IsCellAddress(resolved) ? new Area(resolved) : new Area(resolved.start, resolved.end);
+  }
+
+  /** 
+   * moved from embedded sheet. also modified to preserve ranges, so it
+   * might return a range (area). if you are expecting the old behavior
+   * you need to check (perhaps we could have a wrapper, or make it optional?)
+   * 
+   * Q: why does this not go in grid? or model? (...)
+   * Q: why are we not preserving absoute/relative? (...)
+   * 
+   */
+  public ResolveAddress(address: string|ICellAddress|IArea, active_sheet: Sheet): ICellAddress|IArea {
+    
+    if (typeof address === 'string') {
+      const parse_result = this.parser.Parse(address);
+      if (parse_result.expression && parse_result.expression.type === 'address') {
+        this.ResolveSheetID(parse_result.expression, undefined, active_sheet);
+        return {
+          row: parse_result.expression.row,
+          column: parse_result.expression.column,
+          sheet_id: parse_result.expression.sheet_id,
+        };
+      }
+      else if (parse_result.expression && parse_result.expression.type === 'range') {
+        this.ResolveSheetID(parse_result.expression, undefined, active_sheet);
+        return {
+          start: {
+            row: parse_result.expression.start.row,
+            column: parse_result.expression.start.column,
+            sheet_id: parse_result.expression.start.sheet_id,
+          },
+          end: {
+            row: parse_result.expression.end.row,
+            column: parse_result.expression.end.column,
+          }
+        };
+      }
+      else if (parse_result.expression && parse_result.expression.type === 'identifier') {
+
+        // is named range guaranteed to have a sheet ID? (I think yes...)
+
+        const named_range = this.named_ranges.Get(parse_result.expression.name);
+        if (named_range) {
+          return named_range;
+        }
+      }
+
+      return { row: 0, column: 0 }; // default for string types -- broken
+
+    }
+
+    return address; // already range or address
+
+  }
+
 }
 
 export interface ViewModel {

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

@@ -0,0 +1,47 @@
+
+import type { IArea, ICellAddress } from 'treb-base-types';
+
+export type DependencyList = Array<IArea|ICellAddress|undefined>;
+export type ExternalEditorCallback = (selection?: string) => DependencyList|undefined;
+
+// FIXME: if you want to keep the old interface, split into to separate types
+
+export interface ExternalEditorConfig {
+
+  // --- old interface ---------------------------------------------------------
+
+  /**
+   * list of dependencies to highlight. we support undefined entries in
+   * this list so you can use the result of `EmbeddedSpreadsheet.Resolve`,
+   * which may return undefined.
+   */
+  dependencies: DependencyList;
+
+  /**
+   * this callback will be called when the selection changes in the 
+   * spreadsheet and this external editor is active. return an updated
+   * list of dependencies to highlight. 
+   * 
+   * NOTE: this is currently synchronous, but don't rely on that. it
+   * might switch to async in the future depending on how it works in 
+   * practice.
+   */
+  update: ExternalEditorCallback;
+
+  // --- new interface ---------------------------------------------------------
+
+  /**  
+   * a list of nodes that will serve as editors. when you attach, we will do
+   * an initial pass of context highlighting. we highlight on text changes 
+   * and insert references if you make a selection in the spreadsheet while
+   * an editor is focused.
+   */
+  nodes: HTMLElement[];
+
+  /** 
+   * assume that we're editing a formula. does not require leading `=`.
+   * defaults to `true` for historical reasons.
+   */
+  assume_formula?: boolean;
+
+}