@trebco/treb 28.11.1 → 28.13.2

package/treb-calculator/src/primitives.ts

@@ -309,6 +309,17 @@ export const Equals = (a: UnionValue, b: UnionValue): UnionValue => {
 
   }
 
+  // this is standard (icase) string equality. we might also need
+  // to handle wildcard string matching, although it's not the 
+  // default case for = operators.
+
+  if (a.type === ValueType.string && b.type === ValueType.string) {
+    return { 
+      type: ValueType.boolean, 
+      value: a.value.toLowerCase() === b.value.toLowerCase(),
+    };
+  }
+
   return { type: ValueType.boolean, value: a.value == b.value }; // note ==
 };
 

package/treb-calculator/src/utilities.ts

@@ -302,3 +302,58 @@ export const ApplyAsArray2 = (base: (a: any, b: any, ...rest: any[]) => UnionVal
   }
 };
 
+
+/**
+ * parse a string with wildcards into a regex pattern
+ * 
+ * from
+ * https://exceljet.net/glossary/wildcard
+ * 
+ * Excel has 3 wildcards you can use in your formulas:
+ *
+ * Asterisk (*) - zero or more characters
+ * Question mark (?) - any one character
+ * Tilde (~) - escape for literal character (~*) a literal question mark (~?), or a literal tilde (~~)
+ * 
+ * they're pretty liberal with escaping, nothing is an error, just roll with it
+ * 
+ */
+export const ParseWildcards = (text: string): string => {
+
+  const result: string[] = [];
+  const length = text.length;
+
+  const escaped_chars = '[\\^$.|?*+()';
+
+  for (let i = 0; i < length; i++) {
+    let char = text[i];
+    switch (char) {
+
+      case '*':
+        result.push('.', '*');
+        break;
+
+      case '?':
+        result.push('.');
+        break;
+
+      case '~':
+        char = text[++i] || '';
+      
+      // eslint-disable-next-line no-fallthrough
+      default:
+        for (let j = 0; j < escaped_chars.length; j++) {
+          if (char === escaped_chars[j]) {
+            result.push('\\');
+            break;
+          }
+        }
+        result.push(char);
+        break;
+
+    }
+  }
+
+  return result.join('');
+
+};

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

@@ -42,6 +42,8 @@ import type {
   CondifionalFormatExpressionOptions,
   ConditionalFormatCellMatchOptions,
   ConditionalFormatCellMatch,
+  MacroFunction,
+  SerializedNamedExpression,
 } from 'treb-grid';
 
 import {
@@ -413,7 +415,7 @@ export class EmbeddedSpreadsheet<USER_DATA_TYPE = unknown> {
   }
 
   /** for destruction */
-  protected view?: HTMLElement;
+  protected view_node?: HTMLElement;
 
   /** for destruction */
   protected key_listener?: (event: KeyboardEvent) => void;
@@ -844,7 +846,7 @@ export class EmbeddedSpreadsheet<USER_DATA_TYPE = unknown> {
       // elements. but we don't add a default; rather we use a template
 
       const template = container.querySelector('.treb-view-template') as HTMLTemplateElement;
-      this.view = template.content.firstElementChild?.cloneNode(true) as HTMLElement;
+      this.view_node = template.content.firstElementChild?.cloneNode(true) as HTMLElement;
 
       // this is a little weird but we're inserting at the front. the 
       // reason for this is that we only want to use one resize handle,
@@ -852,13 +854,13 @@ export class EmbeddedSpreadsheet<USER_DATA_TYPE = unknown> {
 
       // we could work around this, really we're just being lazy.
 
-      container.prepend(this.view);
+      container.prepend(this.view_node);
 
       
       // this.node = container;
       // this.node = this.view;
 
-      this.view.addEventListener('focusin', () => {
+      this.view_node.addEventListener('focusin', () => {
         if (this.focus_target !== this) {
           this.Publish({ type: 'focus-view' });
           this.focus_target = this;
@@ -878,14 +880,14 @@ export class EmbeddedSpreadsheet<USER_DATA_TYPE = unknown> {
 
       // const view = container.querySelector('.treb-view') as HTMLElement;
 
-      this.grid.Initialize(this.view, toll_initial_render);
+      this.grid.Initialize(this.view_node, toll_initial_render);
 
       // dnd
 
       if (this.options.dnd) {
-        this.view.addEventListener('dragenter', (event) => this.HandleDrag(event));
-        this.view.addEventListener('dragover', (event) => this.HandleDrag(event));
-        this.view.addEventListener('drop', (event) => this.HandleDrop(event));
+        this.view_node.addEventListener('dragenter', (event) => this.HandleDrag(event));
+        this.view_node.addEventListener('dragover', (event) => this.HandleDrag(event));
+        this.view_node.addEventListener('drop', (event) => this.HandleDrop(event));
       }
 
       // set up grid events
@@ -1244,19 +1246,19 @@ export class EmbeddedSpreadsheet<USER_DATA_TYPE = unknown> {
       sheet.grid.grid_events.CancelAll();
       sheet.events.CancelAll();
       
-      if (sheet.view?.parentElement) {
+      if (sheet.view_node?.parentElement) {
 
         // remove listener
         if (sheet.key_listener) {
-          sheet.view.parentElement.removeEventListener('keydown', sheet.key_listener);
+          sheet.view_node.parentElement.removeEventListener('keydown', sheet.key_listener);
         }
 
         // remove node
-        sheet.view.parentElement.removeChild(sheet.view);
+        sheet.view_node.parentElement.removeChild(sheet.view_node);
       }            
 
       // in case other view was focused
-      this.view?.focus();
+      this.view_node?.focus();
 
       // usually this results in us getting larger, we may need to update
       this.Resize();
@@ -1285,7 +1287,7 @@ export class EmbeddedSpreadsheet<USER_DATA_TYPE = unknown> {
     const view = this.CreateView();
     view.grid.EnsureActiveSheet(true);
 
-    view.view?.addEventListener('focusin', () => {
+    view.view_node?.addEventListener('focusin', () => {
       if (this.focus_target !== view) {
         this.Publish({ type: 'focus-view' });
         this.focus_target = view;
@@ -2244,12 +2246,16 @@ export class EmbeddedSpreadsheet<USER_DATA_TYPE = unknown> {
     this.parser.flags.r1c1 = r1c1;
 
     if (argument_separator === ',') {
-      this.parser.argument_separator = ArgumentSeparatorType.Comma;
-      this.parser.decimal_mark = DecimalMarkType.Period;
+      this.parser.SetLocaleSettings(DecimalMarkType.Period);
+
+      // this.parser.argument_separator = ArgumentSeparatorType.Comma;
+      // this.parser.decimal_mark = DecimalMarkType.Period;
     }
     else {
-      this.parser.argument_separator = ArgumentSeparatorType.Semicolon;
-      this.parser.decimal_mark = DecimalMarkType.Comma;
+      this.parser.SetLocaleSettings(DecimalMarkType.Comma);
+
+      // this.parser.argument_separator = ArgumentSeparatorType.Semicolon;
+      // this.parser.decimal_mark = DecimalMarkType.Comma;
     }
 
     const result = this.parser.Parse(formula);
@@ -2354,12 +2360,16 @@ export class EmbeddedSpreadsheet<USER_DATA_TYPE = unknown> {
       */
 
       if (argument_separator === ',') {
-        this.parser.argument_separator = ArgumentSeparatorType.Comma;
-        this.parser.decimal_mark = DecimalMarkType.Period;
+        this.parser.SetLocaleSettings(DecimalMarkType.Period);
+
+        // this.parser.argument_separator = ArgumentSeparatorType.Comma;
+        // this.parser.decimal_mark = DecimalMarkType.Period;
       }
       else {
-        this.parser.argument_separator = ArgumentSeparatorType.Semicolon;
-        this.parser.decimal_mark = DecimalMarkType.Comma;
+        this.parser.SetLocaleSettings(DecimalMarkType.Comma);
+
+        // this.parser.argument_separator = ArgumentSeparatorType.Semicolon;
+        // this.parser.decimal_mark = DecimalMarkType.Comma;
       }
 
       // const r1c1_state = this.parser.flags.r1c1;
@@ -2749,13 +2759,14 @@ export class EmbeddedSpreadsheet<USER_DATA_TYPE = unknown> {
 
         // FIXME: type
 
-        const serialized: SerializedModel = this.grid.Serialize({
+        const serialized: SerializedModel = this.Serialize({ // this.grid.Serialize({
           rendered_values: true,
           expand_arrays: true,
           export_colors: true,
           decorated_cells: true,
           tables: true,
           share_resources: false,
+          export_functions: true,
         });
 
         // why do _we_ put this in, instead of the grid method? 
@@ -3523,6 +3534,9 @@ export class EmbeddedSpreadsheet<USER_DATA_TYPE = unknown> {
   /**
    * Create a macro function.
    * 
+   * FIXME: this needs a control for argument separator, like other
+   * functions that use formulas (@see SetRange)
+   * 
    * @public
    */
   public DefineFunction(name: string, argument_names: string | string[] = '', function_def = '0'): void {
@@ -3592,7 +3606,8 @@ export class EmbeddedSpreadsheet<USER_DATA_TYPE = unknown> {
       ...options,
     };
 
-    const grid_data = this.grid.Serialize(options);
+    // const grid_data = this.grid.Serialize(options);
+    const grid_data = this.Serialize(options);
 
     // NOTE: these are not really env vars. we replace them at build time
     // via a webpack plugin. using the env syntax lets them look "real" at
@@ -4405,6 +4420,121 @@ export class EmbeddedSpreadsheet<USER_DATA_TYPE = unknown> {
 
   // --- internal (protected) methods ------------------------------------------
 
+  // --- moved from grid/grid base ---------------------------------------------
+
+  
+  /**
+   * serialize data model. moved from grid/grid base. this is moved so we 
+   * have access to the calculator, which we want so we can do function 
+   * translation on some new functions that don't necessarily map 1:1 to 
+   * XLSX functions. we can also do cleanup on functions where we're less
+   * strict about arguments (ROUND, for example).
+   * 
+   */
+  protected Serialize(options: SerializeOptions = {}): SerializedModel {
+
+    const active_sheet = this.grid.active_sheet; // I thought this was in view? (...)
+
+    active_sheet.selection = JSON.parse(JSON.stringify(this.grid.GetSelection()));
+
+    // same for scroll offset
+
+    const scroll_offset = this.grid.ScrollOffset();
+    if (scroll_offset) {
+      active_sheet.scroll_offset = scroll_offset; // this.grid.layout.scroll_offset;
+    }    
+
+    // NOTE: annotations moved to sheets, they will be serialized in the sheets
+
+    const sheet_data = this.model.sheets.list.map((sheet) => sheet.toJSON(options));
+
+    // OK, not serializing tables in cells anymore. old comment about this:
+    // 
+    // at the moment, tables are being serialized in cells. if we put them
+    // in here, then we have two records of the same data. that would be bad.
+    // I think this is probably the correct place, but if we put them here
+    // we need to stop serializing in cells. and I'm not sure that there are 
+    // not some side-effects to that. hopefully not, but (...)
+    // 
+
+    let tables: Table[] | undefined;
+    if (this.model.tables.size > 0) {
+      tables = Array.from(this.model.tables.values());
+    }
+
+    // NOTE: moving into a structured object (the sheet data is also structured,
+    // of course) but we are moving things out of sheet (just  named ranges atm))
+
+    let macro_functions: MacroFunction[] | undefined;
+
+    if (this.model.macro_functions.size) {
+      macro_functions = [];
+      for (const macro of this.model.macro_functions.values()) {
+        macro_functions.push({
+          ...macro,
+          expression: undefined,
+        });
+      }
+    }
+
+    // when serializing named expressions, we have to make sure
+    // that there's a sheet name in any address/range. 
+
+    const named_expressions: SerializedNamedExpression[] = [];
+    if (this.model.named_expressions) {
+
+      for (const [name, expr] of this.model.named_expressions) {
+        this.parser.Walk(expr, unit => {
+          if (unit.type === 'address' || unit.type === 'range') {
+            const test = unit.type === 'range' ? unit.start : unit;
+
+            test.absolute_column = test.absolute_row = true;
+
+            if (!test.sheet) {
+              if (test.sheet_id) {
+                const sheet = this.model.sheets.Find(test.sheet_id);
+                if (sheet) {
+                  test.sheet = sheet.name;
+                }
+              }
+              if (!test.sheet) {
+                test.sheet = active_sheet.name;
+              }
+            }
+
+            if (unit.type === 'range') {
+              unit.end.absolute_column = unit.end.absolute_row = true;
+            }
+
+            return false;
+          }
+          else if (unit.type === 'call' && options.export_functions) {
+            // ...
+          }
+          return true;
+        });
+        const rendered = this.parser.Render(expr, { missing: '' });
+        named_expressions.push({
+          name, expression: rendered
+        });
+      }
+    }
+
+    return {
+      sheet_data,
+      active_sheet: active_sheet.id,
+      named_ranges: this.model.named_ranges.Count() ?
+        this.model.named_ranges.Serialize() :
+        undefined,
+      macro_functions,
+      tables,
+      named_expressions: named_expressions.length ? named_expressions : undefined,
+    };
+
+  }
+
+  // --- /moved ----------------------------------------------------------------
+
   /**
    * 
    */
@@ -5531,14 +5661,18 @@ export class EmbeddedSpreadsheet<USER_DATA_TYPE = unknown> {
     // FIXME: also we should unify on types for decimal, argument separator
 
     if (data.decimal_mark === '.') {
-      parser.decimal_mark = DecimalMarkType.Period;
-      parser.argument_separator = ArgumentSeparatorType.Comma;
+      // parser.decimal_mark = DecimalMarkType.Period;
+      // parser.argument_separator = ArgumentSeparatorType.Comma;
+      parser.SetLocaleSettings(DecimalMarkType.Period);
+
       target_decimal_mark = DecimalMarkType.Comma;
       target_argument_separator = ArgumentSeparatorType.Semicolon;
     }
     else {
-      parser.decimal_mark = DecimalMarkType.Comma;
-      parser.argument_separator = ArgumentSeparatorType.Semicolon;
+      // parser.decimal_mark = DecimalMarkType.Comma;
+      // parser.argument_separator = ArgumentSeparatorType.Semicolon;
+      parser.SetLocaleSettings(DecimalMarkType.Comma);
+
       target_decimal_mark = DecimalMarkType.Period;
       target_argument_separator = ArgumentSeparatorType.Comma;
     }

package/treb-embed/style/dark-theme.scss

@@ -33,6 +33,7 @@
   --treb-autocomplete-tooltip-color: #fff;
   --treb-chart-background: #000;
   --treb-chart-grid-color: #976;
+  --treb-chart-grid-zero-color: #fdd;
   --treb-chart-text-color: #fff;
   --treb-dialog-background: #000;
   --treb-dialog-color: #fff;

package/treb-export/src/export-worker/export-worker.ts

@@ -57,6 +57,7 @@ const ImportSheet = (data: any) => {
         results.sheets.push(result);
       }
     }
+
     ctx.postMessage({ status: 'complete', results });
 
   }

package/treb-export/src/import2.ts

@@ -81,7 +81,10 @@ export class Importer {
         t?: string;
         s?: string;
       };
-      v?: string|number; // is this never an object? (note: booleans are numbers in Excel)
+      v?: string|number|{
+        t$: string;
+        a$?: any;
+      }; 
       f?: string|{ 
         t$: string;
         a$?: {
@@ -214,14 +217,17 @@ export class Importer {
         }
 
         if (typeof element.v !== 'undefined') {
-          const num = Number(element.v.toString());
+
+          const V = (typeof element.v === 'object') ? element.v?.t$ : element.v;
+
+          const num = Number(V.toString());
           if (!isNaN(num)) {
             calculated_type = 'number'; // ValueType.number;
             calculated_value = num;
           }
           else {
             calculated_type = 'string'; // ValueType.string;
-            calculated_value = element.v.toString();
+            calculated_value = V.toString();
           }
         }
 

package/treb-export/src/workbook-style2.ts

@@ -29,6 +29,9 @@ import { XMLUtils } from './xml-utils';
 
 import { Unescape } from './unescape_xml';
 
+// what's the default font size? ... 11pt?
+const DEFAULT_FONT_SIZE = 11;
+
 export interface Font {
   size?: number;
   name?: string;
@@ -269,13 +272,24 @@ export class StyleCache {
 
     }
 
+
     if (composite.font_size?.unit && composite.font_size.value) {
-      if (composite.font_size.unit !== 'pt') {
-        console.warn(`can't handle non-point font (FIXME)`);
+      if (composite.font_size.unit === 'em') {
+        font.size = composite.font_size.value * DEFAULT_FONT_SIZE;
       }
-      else {
+      else if (composite.font_size.unit === '%') {
+        font.size = composite.font_size.value * DEFAULT_FONT_SIZE / 100;
+      }
+      else if (composite.font_size.unit === 'pt' ){
         font.size = composite.font_size.value;
       }
+      else if (composite.font_size.unit === 'px' ){
+        font.size = composite.font_size.value * .75; // ?
+      }
+      else {
+        console.warn(`Unhandled font size unit`, composite.font_size);
+      }
+
     }
 
     if (composite.bold) font.bold = true;
@@ -657,6 +671,19 @@ export class StyleCache {
 
     // borders
 
+    const BorderEdgeToColor = (edge: BorderEdge): Color|undefined => {
+
+      // TODO: indexed
+
+      if (typeof edge.theme !== 'undefined') {
+        return {
+          theme: edge.theme,
+          tint: edge.tint,
+        };
+      }
+
+    };
+
     const border = this.borders[xf.border || 0];
     if (border) {
       if (border.bottom.style) {
@@ -666,10 +693,20 @@ export class StyleCache {
         else {
           props.border_bottom = 1;
         }
+        props.border_bottom_fill = BorderEdgeToColor(border.bottom);
+      }
+      if (border.left.style) {
+        props.border_left = 1;
+        props.border_left_fill = BorderEdgeToColor(border.left);
+      }
+      if (border.top.style) {
+        props.border_top = 1;
+        props.border_top_fill = BorderEdgeToColor(border.top);
+      }
+      if (border.right.style) {
+        props.border_right = 1;
+        props.border_right_fill = BorderEdgeToColor(border.right);
       }
-      if (border.left.style) props.border_left = 1;
-      if (border.top.style) props.border_top = 1;
-      if (border.right.style) props.border_right = 1;
     }
 
     return props;
@@ -1144,31 +1181,58 @@ export class StyleCache {
 
     composite = FindAll('styleSheet/borders/border');
 
+    const ElementToBorderEdge = (element: any, edge: BorderEdge) => {
+
+      if (element?.a$) {
+        edge.style = element.a$.style;
+        if (typeof element.color === 'object') {
+          if (typeof element.color.a$?.indexed !== 'undefined') {
+            edge.color = Number(element.color.a$.indexed);
+          }
+          if (typeof element.color.a$?.theme !== 'undefined') {
+            edge.theme = Number(element.color.a$.theme);
+          }
+          if (typeof element.color.a$?.tint !== 'undefined') {
+            edge.tint = Number(element.color.a$.tint);
+          }
+        }
+      }
+
+    };
+    
+
     this.borders = composite.map(element => {
 
       const border: BorderStyle = JSON.parse(JSON.stringify(default_border));
 
+      /*
       // we're relying on these being empty strings -> falsy, not a good look
 
       if (element.left) {
-        border.left.style = element.left.a$.style;
-        border.left.color = Number(element.left.color?.a$?.indexed);
+        // border.left.style = element.left.a$.style;
+        // border.left.color = Number(element.left.color?.a$?.indexed);
       }
 
       if (element.right) {
-        border.right.style = element.right.a$.style;
-        border.right.color = Number(element.right.color?.a$?.indexed);
+        // border.right.style = element.right.a$.style;
+        // border.right.color = Number(element.right.color?.a$?.indexed);
       }
 
       if (element.top) {
-        border.top.style = element.top.a$.style;
-        border.top.color = Number(element.top.color?.a$?.indexed);
+        // border.top.style = element.top.a$.style;
+        // border.top.color = Number(element.top.color?.a$?.indexed);
       }
 
       if (element.bottom) {
-        border.bottom.style = element.bottom.a$.style;
-        border.bottom.color = Number(element.bottom.color?.a$?.indexed);
+        // border.bottom.style = element.bottom.a$.style;
+        // border.bottom.color = Number(element.bottom.color?.a$?.indexed);
       }
+      */
+
+      ElementToBorderEdge(element.left, border.left);
+      ElementToBorderEdge(element.right, border.right);
+      ElementToBorderEdge(element.top, border.top);
+      ElementToBorderEdge(element.bottom, border.bottom);
       
       return border;
 

package/treb-grid/src/editors/editor.ts

@@ -789,6 +789,13 @@ export class Editor<E = FormulaEditorEvent> extends EventSource<E|FormulaEditorE
 
     if (this.active_editor && !this.assume_formula) {
       this.active_editor.node.spellcheck = !(this.text_formula);
+
+      // if not assuming formula, and it's not a formula, then exit.
+
+      if (!this.text_formula) {
+        return;
+      }
+
     }
 
     // this is a short-circuit so we don't format the same text twice. 

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

@@ -835,9 +835,9 @@ export class Grid extends GridBase {
     }
   }
 
-  /**
+  /* *
    * specialization: update selection, scroll offset
-   */
+   * /
   public Serialize(options: SerializeOptions = {}): SerializedModel {
 
     // selection moved to sheet, but it's not "live"; so we need to
@@ -855,6 +855,7 @@ export class Grid extends GridBase {
     return super.Serialize(options);
 
   }
+  */
 
   /**
    * show or hide headers
@@ -1830,18 +1831,23 @@ export class Grid extends GridBase {
         argument_separator: this.parser.argument_separator,
         decimal_mark: this.parser.decimal_mark,
       }
+
+      this.parser.Save();
+
       let convert = false;
 
       if (options.argument_separator === ',' && this.parser.argument_separator !== ArgumentSeparatorType.Comma) {
-        this.parser.argument_separator = ArgumentSeparatorType.Comma;
-        this.parser.decimal_mark = DecimalMarkType.Period;
+        // this.parser.argument_separator = ArgumentSeparatorType.Comma;
+        // this.parser.decimal_mark = DecimalMarkType.Period;
+        this.parser.SetLocaleSettings(DecimalMarkType.Period);
 
         convert = true;
       }
        
       if (options.argument_separator === ';' && this.parser.argument_separator !== ArgumentSeparatorType.Semicolon) {
-        this.parser.argument_separator = ArgumentSeparatorType.Semicolon;
-        this.parser.decimal_mark = DecimalMarkType.Comma;
+        // this.parser.argument_separator = ArgumentSeparatorType.Semicolon;
+        // this.parser.decimal_mark = DecimalMarkType.Comma;
+        this.parser.SetLocaleSettings(DecimalMarkType.Comma);
 
         convert = true;
       }
@@ -1882,8 +1888,10 @@ export class Grid extends GridBase {
 
       // reset
 
-      this.parser.argument_separator = current.argument_separator;
-      this.parser.decimal_mark = current.decimal_mark;
+      // this.parser.argument_separator = current.argument_separator;
+      // this.parser.decimal_mark = current.decimal_mark;
+
+      this.parser.Restore();
 
     }
       
@@ -4439,7 +4447,10 @@ export class Grid extends GridBase {
 
           if (this.overlay_editor?.selection) {
             const value = this.overlay_editor?.edit_node.textContent || undefined;
-            const array = (event.key === 'Enter' && event.ctrlKey && event.shiftKey);
+
+            // let's support command+shift+enter on mac
+            const array = (event.key === 'Enter' && (event.ctrlKey || (UA.is_mac && event.metaKey)) && event.shiftKey);
+
             this.SetInferredType(this.overlay_editor.selection, value, array);
           }