@trebco/treb 29.3.4 → 29.5.0

package/treb-export/src/import2.ts

@@ -30,16 +30,16 @@ import type { ParseResult } from 'treb-parser';
 import { Parser } from 'treb-parser';
 import type { RangeType, AddressType, HyperlinkType } from './address-type';
 import { is_range, ShiftRange, InRange, is_address } from './address-type';
-import type { ImportedSheetData, AnchoredAnnotation, CellParseResult, AnnotationLayout, Corner as LayoutCorner, ICellAddress, DataValidation, IArea, GradientStop, Color } from 'treb-base-types/src';
-import { ValidationType, type SerializedValueType } from 'treb-base-types/src';
+import type { ImportedSheetData, AnchoredAnnotation, CellParseResult, AnnotationLayout, Corner as LayoutCorner, IArea, GradientStop, Color, HTMLColor, ThemeColor } from 'treb-base-types';
+import type { SerializedValueType } from 'treb-base-types';
 import type { Sheet} from './workbook-sheet2';
 import { VisibleState } from './workbook-sheet2';
 import type { CellAnchor } from './drawing2/drawing2';
-import { XMLUtils } from './xml-utils';
+import { type DOMContent, XMLUtils } from './xml-utils';
 
 // import { one_hundred_pixels } from './constants';
 import { ColumnWidthToPixels } from './column-width';
-import type { AnnotationType } from 'treb-data-model';
+import type { DataValidation, AnnotationType } from 'treb-data-model';
 import { ZipWrapper } from './zip-wrapper';
 import type { ConditionalFormat } from 'treb-data-model';
 
@@ -84,7 +84,7 @@ export class Importer {
       };
       v?: string|number|{
         t$: string;
-        a$?: any;
+        a$?: DOMContent;
       }; 
       f?: string|{ 
         t$: string;
@@ -99,7 +99,7 @@ export class Importer {
     arrays: RangeType[],
     merges: RangeType[],
     links: HyperlinkType[],
-    validations: Array<{ address: ICellAddress, validation: DataValidation }>,
+    // validations: Array<{ address: ICellAddress, validation: DataValidation }>,
     ): CellParseResult | undefined {
 
     // must have, at minimum, an address (must be a single cell? FIXME)
@@ -285,12 +285,14 @@ export class Importer {
       }
     }
 
+    /*
     for (const validation of validations) {
       if (validation.address.row === shifted.row && validation.address.column === shifted.col) {
         result.validation = validation.validation;
         break;
       }
     }
+    */
 
     for (const range of merges) {
       if (InRange(range, shifted)) {
@@ -445,12 +447,12 @@ export class Importer {
 
             const color_element = rule.colorScale.color[index];
             if (color_element.a$.rgb) {
-              color.text = '#' + color_element.a$.rgb.substring(2);
+              (color as HTMLColor).text = '#' + color_element.a$.rgb.substring(2);
             } 
             else if (color_element.a$.theme) {
-              color.theme = Number(color_element.a$.theme) || 0;
+              (color as ThemeColor).theme = Number(color_element.a$.theme) || 0;
               if (color_element.a$.tint) {
-                color.tint = Math.round(color_element.a$.tint * 1000) / 1000;
+                (color as ThemeColor).tint = Math.round(color_element.a$.tint * 1000) / 1000;
               }
             }           
 
@@ -512,10 +514,15 @@ export class Importer {
     const conditional_formats: ConditionalFormat[] = [];
     const links: HyperlinkType[] = [];
     const row_styles: number[] = []; // may be sparse
+
+    /*
     const validations: Array<{
       address: ICellAddress,
       validation: DataValidation,
     }> = [];
+    */
+    const validations: DataValidation[] = [];
+
     const annotations: AnchoredAnnotation[] = [];
 
     const FindAll: (path: string) => any[] = XMLUtils.FindAll.bind(XMLUtils, sheet.sheet_data);
@@ -569,33 +576,68 @@ export class Importer {
       const formula = entry.formula1;
 
       if (ref && formula && type === 'list') {
-        let address: ICellAddress|undefined;
+        // let address: ICellAddress|undefined;
         let validation: DataValidation|undefined;
         let parse_result = this.parser.Parse(ref);
+        const target: IArea[] = [];
 
         // apparently these are encoded as ranges for merged cells...
 
+        // NOTE: actually you can have a range, then validation applies
+        // to every cell in the range. also you can have multiple ranges,
+        // apparently separated by spaces.
+
         if (parse_result.expression) {
           if (parse_result.expression.type === 'address') {
-            address = parse_result.expression;
+            // address = parse_result.expression;
+            target.push({start: parse_result.expression, end: parse_result.expression});
           }
           else if (parse_result.expression.type === 'range') {
-            address = parse_result.expression.start;
+            // address = parse_result.expression.start;
+            target.push(parse_result.expression);
           }
         }
 
         parse_result = this.parser.Parse(formula);
+
         if (parse_result.expression) {
           if (parse_result.expression.type === 'range') {
             validation = {
-              type: ValidationType.Range,
+              type: 'range',
               area: parse_result.expression,
+              target,
             };
           }
           else if (parse_result.expression.type === 'literal') {
             validation = {
-              type: ValidationType.List,
+              type: 'list',
+              target,
               list: parse_result.expression.value.toString().split(/,/).map(value => {
+
+                // there are no formulas here. value is a string, separated
+                // by commas. there is no way to escape a comma (AFAICT; not
+                // official, but search). if you did want a comma, you'd need
+                // to use a range.
+
+                // but the uptake is split on commas. after that you can try
+                // to check for numbers or bools, but they will be in the string.
+
+                // I think excel might sort the entries? not sure. don't do it
+                // for now.
+
+                const num = Number(value);
+                if (!isNaN(num)) {
+                  return num;
+                }
+                if (value.toLowerCase() === 'true') {
+                  return true;
+                }
+                if (value.toLowerCase() === 'false') {
+                  return false;
+                }
+                return value; // string
+
+                /*
                 const tmp = this.parser.Parse(value);
                 
                 // if type is "group", that means we saw some spaces. this 
@@ -612,13 +654,16 @@ export class Importer {
                   return tmp.expression.name;
                 }
                 return undefined;
+                */
+
               }),
             };
           }
         }
 
-        if (address && validation) {
-          validations.push({address, validation});
+        if (target.length && validation) {
+          // validations.push({address, validation});
+          validations.push(validation);
         }
 
       }
@@ -717,20 +762,11 @@ export class Importer {
         row_heights[row_index - 1] = height;
       }
 
-      /*
-      if (row.a$?.ht && row.a$?.customHeight) {
-        const num = Number(row.a$.ht);
-        if (!isNaN(num)) {
-          row_heights[row_index - 1] = Math.round(num * 4 / 3); // seems to be the excel unit -> pixel ratio
-        }
-      }
-      */
-
       let cells = row.c || [];
       if (!Array.isArray(cells)) { cells = [cells]; }
 
       for (const element of cells) {
-        const cell = this.ParseCell(sheet, element, shared_formulae, arrays, merges, links, validations);
+        const cell = this.ParseCell(sheet, element, shared_formulae, arrays, merges, links); // , validations);
         if (cell) {
           data.push(cell);
         }
@@ -1178,6 +1214,7 @@ export class Importer {
       row_styles,
       annotations,
       conditional_formats,
+      data_validations: validations,
       styles: this.workbook?.style_cache?.CellXfToStyles() || [],
     };
 

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

@@ -22,7 +22,7 @@
 // import * as ElementTree from 'elementtree';
 // import { Element, ElementTree as Tree } from 'elementtree';
 
-import { type CompositeBorderEdge, Style, type CellStyle, type PropertyKeys, type Color } from 'treb-base-types';
+import { type CompositeBorderEdge, Style, type CellStyle, type PropertyKeys, type Color, IsHTMLColor, IsThemeColor, type ThemeColor, type HTMLColor, ThemeColorIndex } from 'treb-base-types';
 import { Theme } from './workbook-theme2';
 import { NumberFormatCache } from 'treb-format';
 import { XMLUtils } from './xml-utils';
@@ -85,12 +85,14 @@ export interface CellXf {
 
 }
 
+/*
 interface ColorAttributes {
   indexed?: string;
   rgb?: string;
   theme?: string;
   tint?: string;
 }
+*/
 
 export interface BorderEdge {
   style?: string;
@@ -303,11 +305,11 @@ export class StyleCache {
     //}
 
     if (composite.text) {
-      if (composite.text.text) {
+      if (IsHTMLColor(composite.text)) {
         font.color_argb = composite.text.text;
       }
-      else if (typeof composite.text.theme === 'number') {
-        font.color_theme = composite.text.theme;
+      else if (IsThemeColor(composite.text)) {
+        font.color_theme = ThemeColorIndex(composite.text);
         if (composite.text.tint) {
           font.color_tint = composite.text.tint;
         }
@@ -317,11 +319,11 @@ export class StyleCache {
     const TranslateBorder = (src: CompositeBorderEdge, dest: BorderEdge) => {
       if (src.width) {
         dest.style = 'thin';
-        if (src.color.text) {
+        if (IsHTMLColor(src.color)) {
           dest.rgba =src.color.text;
         }
-        else if (typeof src.color.theme === 'number') {
-          dest.theme = src.color.theme;
+        else if (IsThemeColor(src.color)) {
+          dest.theme = ThemeColorIndex(src.color);
           if (src.color.tint) {
             dest.tint = src.color.tint;
           }
@@ -440,12 +442,12 @@ export class StyleCache {
 
     if (composite.fill) {
       fill.pattern_type = 'solid';
-      if (composite.fill.text) {
+      if (IsHTMLColor(composite.fill)) {
         fill.fg_color = { argb: composite.fill.text };  
         options.fill = fill;
       }
-      else if (typeof composite.fill.theme === 'number') {
-        fill.fg_color = { theme: composite.fill.theme };
+      else if (IsThemeColor(composite.fill)) {
+        fill.fg_color = { theme: ThemeColorIndex(composite.fill) };
         if (composite.fill.tint) {
           fill.fg_color.tint = composite.fill.tint;
         }
@@ -619,7 +621,7 @@ export class StyleCache {
             };
 
             if (fill.fg_color.tint) {
-              props.fill.tint = Math.round(fill.fg_color.tint * 1000) / 1000;
+              (props.fill as ThemeColor).tint = Math.round(fill.fg_color.tint * 1000) / 1000;
             }
 
             /*
@@ -1317,12 +1319,12 @@ export class StyleCache {
     const ParseDXFColor = (element: any) => {
       const color: Color = {};
       if (element.a$.rgb) {
-        color.text = '#' + element.a$.rgb.substring(2);
+        (color as HTMLColor).text = '#' + element.a$.rgb.substring(2);
       }
       else if (element.a$.theme) {
-        color.theme = Number(element.a$.theme) || 0;
+        (color as ThemeColor).theme = Number(element.a$.theme) || 0;
         if (element.a$.tint) {
-          color.tint = Math.round(element.a$.tint * 1000) / 1000;
+          (color as ThemeColor).tint = Math.round(element.a$.tint * 1000) / 1000;
         }
       }
       return color;

package/treb-export/src/workbook2.ts

@@ -28,33 +28,17 @@ const xmlparser2 = new XMLParser(XMLOptions2);
 
 // import * as he from 'he';
 
-//import { Drawing, TwoCellAnchor, CellAnchor } from './drawing/drawing';
 import type { TwoCellAnchor, CellAnchor } from './drawing2/drawing2';
 
-// import { ImportedSheetData, IArea } from 'treb-base-types/src';
 import { SharedStrings } from './shared-strings2';
 import { StyleCache } from './workbook-style2';
 import { Theme } from './workbook-theme2';
 import { Sheet, VisibleState } from './workbook-sheet2';
 import type { RelationshipMap } from './relationship';
 import { ZipWrapper } from './zip-wrapper';
-import type { CellStyle } from 'treb-base-types';
+import type { CellStyle, ThemeColor } from 'treb-base-types';
 import type { SerializedNamed } from 'treb-data-model';
 
-
-/*
-const XMLTypeMap = {
-  'sheet':          'application/vnd.openxmlformats-officedocument.spreadsheetml.worksheet+xml',
-  'theme':          'application/vnd.openxmlformats-officedocument.theme+xml',
-  'drawing':        'application/vnd.openxmlformats-officedocument.drawing+xml',
-  'chart':          'application/vnd.openxmlformats-officedocument.drawingml.chart+xml',
-  'themeOverride':  'application/vnd.openxmlformats-officedocument.themeOverride+xml',
-  'ctrlProp':       'application/vnd.ms-excel.controlproperties+xml',
-  'style':          'application/vnd.ms-office.chartstyle+xml',
-  'colors':         'application/vnd.ms-office.chartcolorstyle+xml',
-};
-*/
-
 export const ConditionalFormatOperators: Record<string, string> = {
   greaterThan: '>',
   greaterThanOrEquals: '>=',
@@ -413,7 +397,7 @@ export class Workbook {
                   if (fill['a:schemeClr']['a:lumOff']?.a$?.val) {
                     const num = Number(fill['a:schemeClr']['a:lumOff'].a$.val);
                     if (!isNaN(num)) {
-                      style.fill.tint = num / 1e5;
+                      (style.fill as ThemeColor).tint = num / 1e5;
                     }
                   }
                 }

package/treb-export/src/xml-utils.ts

@@ -20,14 +20,62 @@
  */
 
 import { Unescape } from './unescape_xml';
-import type { X2jOptions } from 'fast-xml-parser';
+import { type X2jOptions, XMLBuilder, type XmlBuilderOptions } from 'fast-xml-parser';
 
 export const XMLTagProcessor = (name: string, value: string): string => Unescape(value);
 
 export interface DOMContent {
-  [index: string]: string|DOMContent|string[]|DOMContent[]|number|number[];
+  [index: string]: string|DOMContent|string[]|DOMContent[]|number|number[]|undefined;
 }
 
+/**
+ * not sure why we have to do this, but filter attributes that 
+ * have value === undefined
+ */
+export const ScrubXML = (dom: DOMContent) => {
+  if (dom) {
+    if (Array.isArray(dom)) {
+      for (const entry of dom) {
+        ScrubXML(entry);
+      }
+    }
+    else if (typeof dom === 'object') {
+      for (const [key, value] of Object.entries(dom)) {
+        if (key === 'a$') {
+          if (typeof value === 'object') {
+            const replacement: DOMContent = {};
+            for (const [attr_name, attr_value] of Object.entries(value)) {
+              if (attr_value !== undefined) {
+                replacement[attr_name] = attr_value;
+              }
+            }
+            dom[key] = replacement;
+          }
+        }
+        else {
+          ScrubXML(value as DOMContent);
+        }
+      }
+    }
+  }
+  return dom;
+};
+
+export const PatchXMLBuilder = (options: Partial<XmlBuilderOptions>) => {
+
+  const builder = new XMLBuilder(options);
+  const build = builder.build;
+
+  builder.build = (arg: DOMContent) => {
+    return build.call(builder, ScrubXML(arg)); // get the "this" value right
+  }
+
+  return builder;
+
+};
+
+//////////////////
+
 export const XMLOptions: Partial<X2jOptions> = {
   ignoreAttributes: false,
   attributeNamePrefix: '__',

package/treb-export/src/zip-wrapper.ts

@@ -58,7 +58,7 @@ export class ZipWrapper {
   public Set(path: string, text: string) {
 
     this.text.set(path, text);
-    if (!!this.records[path]) {
+    if (this.records[path]) {
       delete this.records[path];
     }
   }

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

@@ -20,7 +20,7 @@
  */
 
 import { Editor, type NodeDescriptor } from './editor';
-import { Area, Cell, type CellStyle, type CellValue, Rectangle, Style, type Theme, ThemeColor2 } from 'treb-base-types';
+import { Area, Cell, type CellStyle, type CellValue, Rectangle, Style, type Theme, ResolveThemeColor } from 'treb-base-types';
 import { DataModel, type ViewModel, type GridSelection } from 'treb-data-model';
 import { Autocomplete } from './autocomplete';
 import { UA } from '../util/ua';
@@ -287,8 +287,8 @@ export class OverlayEditor extends Editor<ResetSelectionEvent> {
     const style: CellStyle = cell.style || {};
 
     this.edit_node.style.font = Style.Font(style, this.scale);
-    this.edit_node.style.color = ThemeColor2(this.theme, style.text, 1);
-    this.edit_inset.style.backgroundColor = ThemeColor2(this.theme, style.fill, 0);
+    this.edit_node.style.color = ResolveThemeColor(this.theme, style.text, 1);
+    this.edit_inset.style.backgroundColor = ResolveThemeColor(this.theme, style.fill, 0);
 
     // NOTE: now that we dropped support for IE11, we can probably 
     // remove more than one class at the same time.

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

@@ -24,7 +24,7 @@ import type { DataModel, ViewModel, Annotation } from 'treb-data-model';
 
 import type { Tile } from '../types/tile';
 import type { Theme, Point, Extent, Size, Position, ICellAddress, Table, IArea } from 'treb-base-types';
-import { Style, Area, Rectangle, ThemeColor } from 'treb-base-types';
+import { Style, Area, Rectangle, ResolveThemeColor } from 'treb-base-types';
 
 import { MouseDrag } from '../types/drag_mask';
 import type { GridEvent } from '../types/grid_events';
@@ -1279,7 +1279,7 @@ export abstract class BaseLayout {
     this.row_header.style.backgroundColor =
       this.column_header.style.backgroundColor =
       this.corner.style.backgroundColor =
-      theme.headers?.fill ? ThemeColor(theme, theme.headers.fill) : '';
+      theme.headers?.fill ? ResolveThemeColor(theme, theme.headers.fill, 0) : '';
 
     // theme.headers?.background || '';
     // theme.header_background_color || ''; // this.theme.header_background;
@@ -1291,23 +1291,12 @@ export abstract class BaseLayout {
 
     for (const row of this.grid_tiles) {
       for (const tile of row) {
-        tile.style.backgroundColor = ThemeColor(theme, theme.grid_cell?.fill) || '#fff';
+        tile.style.backgroundColor = ResolveThemeColor(theme, theme.grid_cell?.fill, 0) || '#fff';
       }
     }
 
-    /*
-    this.tooltip.style.fontFamily = theme.tooltip_font_face || '';
-    this.tooltip.style.fontSize = theme.tooltip_font_size ? `${theme.tooltip_font_size}pt` : '';
-    this.tooltip.style.backgroundColor = theme.tooltip_background || '';
-    this.tooltip.style.borderColor = theme.tooltip_background || ''; // for arrow
-    this.tooltip.style.color = theme.tooltip_color || '';
-    */
-
     // TODO: dropdown caret
 
-    // this.dropdown_list.style.fontFamily = theme.cell_font || '';
-    // const font_size = (theme.cell_font_size_value || 10) * this.scale;
-    // this.dropdown_list.style.fontSize = (font_size) + (theme.cell_font_size_unit || 'pt');
     this.dropdown_list.style.font = Style.Font(theme.grid_cell || {});
 
   }
@@ -1415,6 +1404,8 @@ export abstract class BaseLayout {
     this.dropdown_list.style.left = `${target_rect.left + 2}px`;
     this.dropdown_list.style.minWidth = `${target_rect.width}px`;
 
+    this.dropdown_list.style.fontSize = (this.scale.toFixed(2) + 'em');
+
     this.dropdown_list.textContent = '';
     for (const value of list) {
       const entry = this.DOM.Div(undefined, this.dropdown_list);