@trebco/treb 27.9.0 → 27.11.4

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

@@ -19,7 +19,7 @@
  * 
  */
 
-import { DOMUtilities as DOM } from '../util/dom_utilities';
+import { DOMUtilities as DOM } from 'treb-base-types';
 import { NumberFormat, NumberFormatCache, ValueParser } from 'treb-format';
 import { ValueType } from 'treb-base-types';
 import { EventSource } from 'treb-utils';
@@ -54,7 +54,7 @@ export class ScaleControl extends EventSource<ScaleEvent> {
     // const div = DOM.CreateDiv('treb-scale-control-2', container);
 
     this.input = DOM.Create('input', 'treb-scale-input', /* div */ container);
-    const popup = DOM.CreateDiv('treb-slider-container', /* div */ container);
+    const popup = DOM.Div('treb-slider-container', /* div */ container);
 
     /*
     this.input.addEventListener('keyup', (event) => {

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

@@ -26,7 +26,7 @@ import { ValueType, Cells, Style,
   type PropertyKeys,
   type Color,
   Area, IsFlatDataArray, 
-  IsNestedRowArray, IsCellAddress
+  IsNestedRowArray, IsCellAddress, DOMUtilities
 } from 'treb-base-types';
 import { NumberFormatCache } from 'treb-format';
 import { Measurement, ValidateURI } from 'treb-utils';
@@ -748,7 +748,7 @@ export class Sheet {
     if (this.background_image) {
       const resource = ValidateURI(this.background_image);
       if (resource) {
-        this._image = document.createElement('img');
+        this._image = DOMUtilities.Create('img');
         this._image.src = resource;
       }
 

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

@@ -26,6 +26,7 @@ import type { BaseLayout } from '../layout/base_layout';
 import { MouseDrag } from './drag_mask';
 import type { GridOptions } from './grid_options';
 import { type ScaleEvent, ScaleControl } from './scale-control';
+import { DOMUtilities } from 'treb-base-types';
 
 export interface ActivateSheetEvent {
   type: 'activate-sheet';
@@ -112,15 +113,11 @@ export class TabBar extends EventSource<TabEvent> {
       this.stats_panel.innerText = ''; // clear
       for (const entry of value) {
 
-        const label = document.createElement('span');
-        label.classList.add('treb-stats-label');
+        const label = DOMUtilities.Create('span', 'treb-stats-label', this.stats_panel);
         label.textContent = entry.label;
-        this.stats_panel.appendChild(label);
 
-        const figure = document.createElement('span');
-        figure.classList.add('treb-stats-value');
+        const figure = DOMUtilities.Create('span', 'treb-stats-value', this.stats_panel);
         figure.textContent = entry.value;
-        this.stats_panel.appendChild(figure);
       }
     }
   }
@@ -451,8 +448,7 @@ export class TabBar extends EventSource<TabEvent> {
       if (!sheet.visible) { continue; }
 
       const index = tabs.length;
-      // const tab = document.createElement('div');
-      const tab = document.createElement('li');
+      const tab = DOMUtilities.Create('li');
       tab.setAttribute('tabindex', '0');
 
       // tab.classList.add('tab');

package/treb-utils/src/index.ts

@@ -28,4 +28,3 @@ export * from './measurement';
 export * from './serialize_html';
 export * from './validate_uri';
 export * from './scale';
-export * from './template';

package/treb-utils/src/resizable.ts

@@ -1,24 +1,26 @@
-/*
- * 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 { DOMUtilities } from 'treb-base-types';
+
 /**
  * support for resizable node, drag handle, drag rect, mask
  * FIXME: make this composable (decorator?)
@@ -56,16 +58,14 @@ export class Resizable {
       layout_reference?: HTMLElement;
    }): void {
 
-    const resize_handle = document.createElement('div');
-    resize_handle.classList.add('treb-embed-resize-handle');
+    const resize_handle = DOMUtilities.Div('treb-embed-resize-handle');
 
     (options.layout_reference || options.container).appendChild(resize_handle);
 
     if (!Resizable.resize_mask) {
       let mask = document.querySelector('.treb-embed-mouse-mask');
       if (!mask) {
-        mask = document.createElement('div');
-        mask.classList.add('treb-embed-mouse-mask');
+        mask = DOMUtilities.Div('treb-embed-mouse-mask');
         document.body.appendChild(mask);
       }
       Resizable.resize_mask = mask as HTMLElement;
@@ -74,8 +74,7 @@ export class Resizable {
     if (!Resizable.resize_rect) {
       let rect = document.querySelector('.treb-embed-resize-rect');
       if (!rect) {
-        rect = document.createElement('div');
-        rect.classList.add('treb-embed-resize-rect');
+        rect = DOMUtilities.Div('treb-embed-resize-rect');
         Resizable.resize_mask.appendChild(rect);
       }
       Resizable.resize_rect = rect as HTMLElement;

package/treb-utils/src/template.ts

@@ -1,70 +0,0 @@
-/*
- * 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
- * 
- */
-
-export interface NodeModel {[index: string]: HTMLElement}
-
-const ParseTail = (node: HTMLElement, scope: string, model: NodeModel): void => {
-  [].forEach.call(node.children, (child: HTMLElement) => {
-    if (child.id) {
-      model[child.id] = child;
-      child.id = `${scope}-${child.id}`;
-    }
-    if (child.children && child.children.length) {
-      ParseTail(child, scope, model);
-    }
-});
-}
-
-const ParseTemplate = (template: string, container?: HTMLElement|string) => {
-
-  const scope = Math.random().toString(36).substring(2, 15);
-  const temp = document.createElement('div');
-  temp.innerHTML = template;
-
-  const model: NodeModel = {};
-  ParseTail(temp, scope, model);
-
-  if (typeof container === 'string') {
-    container = document.querySelector(container) as HTMLElement;
-  }
-  if (container) {
-    const nodes = [].map.call(temp.childNodes, child => child);
-    for (const child of nodes) { container.appendChild(child as Node); }
-  }
- 
-  return model;
-
-}
-
-export const composite = (strings: TemplateStringsArray, ...args: any[]): string => {
-  const output: string[] = [];
-  for (let i = 0; i < strings.length; i++) {
-    output.push(strings[i]);
-    if (args[i]) { output.push(args[i].toString()); }
-  }
-  return output.join('');
-}
-
-export const tmpl = (strings: TemplateStringsArray, ...args: any[]): NodeModel => {
-  return ParseTemplate(composite(strings, ...args));
-}
-
-export const css = composite;