@trebco/treb 25.4.2 → 25.5.0

package/dist/treb.d.ts

@@ -1,4 +1,4 @@
-/*! API v25.4. Copyright 2018-2023 trebco, llc. All rights reserved. LGPL: https://treb.app/license */
+/*! API v25.5. Copyright 2018-2023 trebco, llc. All rights reserved. LGPL: https://treb.app/license */
 
 /**
  * add our tag to the map
@@ -1210,7 +1210,7 @@ export interface TableSortOptions {
     asc: boolean;
 }
 export type TableSortType = 'text' | 'numeric' | 'auto';
-export declare type LoadSource = "drag-and-drop" | "local-file" | "network-file" | "local-storage" | "undo";
+export declare type LoadSource = "drag-and-drop" | "local-file" | "network-file" | "local-storage" | "inline-document" | "undo";
 
 /**
  * EmbeddedSheetEvent is a discriminated union. Switch on the `type` field

package/package.json

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

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

@@ -528,17 +528,6 @@ export const LoadThemeProperties = (container: HTMLElement): Theme => {
     theme.offset_light = css.color;
   }
 
-  /*
-  css = CSS('grid-background');
-  if (css.backgroundImage) {
-    const match = css.backgroundImage.match(/url\("*(.*?)"*\)/);
-    if (match) {
-      theme.background_image = new Image();
-      theme.background_image.src = match[1];
-    }
-  }
-  */
-
   // this _is_ painted, but it doesn't necessarily need to be -- we
   // could use a node. that would require moving it around, though. 
   // let's leave it for now.

package/treb-embed/src/custom-element/spreadsheet-constructor.ts

@@ -208,6 +208,10 @@ export class SpreadsheetConstructor {
           case 'data-treb':
             continue; 
 
+          // has special handling as an attribute
+          case 'inline-document':
+            continue;
+
           // special case
           case 'src':
             attribute_options.document = this.root.getAttribute('src') || undefined;
@@ -255,6 +259,49 @@ export class SpreadsheetConstructor {
         }
       }
 
+      // inline-document means look in the tag contents for a script 
+      // element, and use that. the script must have type "application/json",
+      // and if it has a name, the name must match the value of the 
+      // inline-document attribute.
+      //
+      // so either 
+      //
+      // <treb-spreadsheet inline-document>
+      //   <script type="application/json">{ ... }</script>
+      // </treb-spreadsheet>
+      //
+      // or 
+      //
+      // <treb-spreadsheet inline-document="xyz">
+      //   <script type="application/json" name="xyz">{ ... }</script>
+      // </treb-spreadsheet>
+
+      if (this.root.hasAttribute('inline-document')) {
+        const inline_name = this.root.getAttribute('inline-document') || '';
+        for (const element of Array.from(this.root.children)) {
+          if (element instanceof HTMLScriptElement) {
+            if (element.type === 'application/json') {
+              const name = element.getAttribute('name') || '';
+              if (name === inline_name) {
+                const content = element.textContent;
+                if (content) {
+                  try {
+                    options.inline_document = JSON.parse(content);
+                  }
+                  catch (err) {
+                    console.error(err);
+                  }
+                }
+                break;
+              }
+            }
+          }
+        }
+        if (!options.inline_document) {
+          console.warn('inline document failed');
+        }
+      }
+
       this.root.innerHTML = html;
       options.container = this.root.querySelector('.treb-layout-spreadsheet') as HTMLElement;
 

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

@@ -506,11 +506,15 @@ export class EmbeddedSpreadsheet {
       }
     }
 
+    if (this.options.document && this.options.inline_document) {
+      console.warn('both document and inline-document are provided');
+    }
+
     const network_document = this.options.document;
 
     // optionally data from storage, with fallback
 
-    let data: string | undefined;
+    let data: string | undefined | TREBDocument;
     let source: LoadSource | undefined;
 
     // don't load if we're a split view. we can also skip the 
@@ -523,6 +527,14 @@ export class EmbeddedSpreadsheet {
       }
     }
 
+    // if we have an inline document, and there was nothing in local storage,
+    // load the inline document now. not for splits.
+
+    if (!data && !this.options.toll_initial_load && !options.model && options.inline_document) {
+      data = options.inline_document;
+      source = LoadSource.INLINE_DOCUMENT;
+    }
+
     // this one should not be done for a split view, but we should still
     // do it if the toll flag is set, and storage key is set. 
 
@@ -858,8 +870,12 @@ export class EmbeddedSpreadsheet {
     // FIXME: this should yield so we can subscribe to events before the initial load
 
     if (data) {
-      this.LoadDocument(JSON.parse(data), 
-        { recalculate: !!this.options.recalculate, source});
+      if (typeof data === 'string') {
+        data = JSON.parse(data);
+      }
+      if (data) {
+        this.LoadDocument(data as TREBDocument, { recalculate: !!this.options.recalculate, source});
+      }
     }
     else if (!network_document) {
 
@@ -2307,6 +2323,15 @@ export class EmbeddedSpreadsheet {
    */
   public Revert(): void {
 
+    if (this.options.inline_document) {
+      this.LoadDocument(this.options.inline_document);
+      if (this.options.storage_key) {
+        this.SaveLocalStorage('reverted_backup');
+        localStorage.removeItem(this.options.storage_key);
+      }
+      return;
+    }
+
     const canonical = this.options.document;
 
     if (canonical) {

package/treb-embed/src/options.ts

@@ -20,6 +20,7 @@
  */
 
 import type { ICellAddress } from 'treb-base-types';
+import type { TREBDocument } from './types';
 
 /**
  * options for exporting CSV/TSV
@@ -97,6 +98,16 @@ export interface EmbeddedSpreadsheetOptions {
    */
   document?: string;
 
+  /**
+   * @internal - testing
+   * 
+   * load document directly from data. obeys the same rules as `document` 
+   * regarding local storage and revert. if you provide both document and
+   * inline_document we will show a warning, but inline_document will take
+   * precedence.
+   */
+  inline_document?: TREBDocument;
+
   /** 
    * fetch network document (URI) 
    * @deprecated - use `document`

package/treb-embed/src/types.ts

@@ -74,6 +74,7 @@ export enum LoadSource {
   LOCAL_FILE = 'local-file',
   NETWORK_FILE = 'network-file',
   LOCAL_STORAGE = 'local-storage',
+  INLINE_DOCUMENT = 'inline-document',
   UNDO = 'undo',
 }
 

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

@@ -182,9 +182,14 @@ $text-reference-color-5: rgb(254, 47, 1);
     background: var(--treb-grid-background, #fff);
   }
 
+  /* 
+   * we stopped using this in favor of sheet backgrounds. although
+   * there's a case to be made for the static background as well.
+   *
   .grid-background {
     background-image: var(--treb-grid-background-image, none);
   }
+  */
 
   /**
    * this is used for freeze-area highlights