2 files changed, 24 insertions, 16 deletions
diff --git a/src/client/views/nodes/DataVizBox/components/TableBox.tsx b/src/client/views/nodes/DataVizBox/components/TableBox.tsx
index d422a7536..0e766e5f0 100644
--- a/src/client/views/nodes/DataVizBox/components/TableBox.tsx
+++ b/src/client/views/nodes/DataVizBox/components/TableBox.tsx
@@ -1,5 +1,5 @@
 import { Button, Type } from 'browndash-components';
-import { action, computed, IReactionDisposer, observable, reaction } from 'mobx';
+import { action, computed, IReactionDisposer, observable, reaction, trace } from 'mobx';
 import { observer } from 'mobx-react';
 import * as React from 'react';
 import { Doc, Field, NumListCast } from '../../../../../fields/Doc';
@@ -12,7 +12,7 @@ import { DocumentView } from '../../DocumentView';
 import { DataVizView } from '../DataVizBox';
 import './Chart.scss';
 //import { DATA_VIZ_TABLE_ROW_HEIGHT } from '../../../global/globalCssVariables.scss';
-const DATA_VIZ_TABLE_ROW_HEIGHT = '30px';
+const DATA_VIZ_TABLE_ROW_HEIGHT = '30';
 
 interface TableBoxProps {
     Document: Doc;
@@ -80,12 +80,14 @@ export class TableBox extends React.Component<TableBoxProps> {
         return this.props.docView?.()?.props.ScreenToLocalTransform().Scale || 1;
     }
     @computed get rowHeight() {
+        console.log('scale = ' + this.viewScale + '  table = ' + this._tableHeight + ' ids = ' + this._tableDataIds.length);
         return (this.viewScale * this._tableHeight) / this._tableDataIds.length;
     }
     @computed get startID() {
         return this.rowHeight ? Math.floor(this._scrollTop / this.rowHeight) : 0;
     }
     @computed get endID() {
+        console.log('start = ' + this.startID + '  container = ' + this._tableContainerHeight + ' scale = ' + this.viewScale + ' row = ' + this.rowHeight);
         return Math.ceil(this.startID + (this._tableContainerHeight * this.viewScale) / (this.rowHeight || 1));
     }
     @action handleScroll = () => {
@@ -160,6 +162,8 @@ export class TableBox extends React.Component<TableBoxProps> {
     };
 
     render() {
+        console.log(this.endID);
+        trace();
         if (this._tableData.length > 0) {
             return (
                 <div
diff --git a/src/client/views/nodes/LabelBox.tsx b/src/client/views/nodes/LabelBox.tsx
index 71f9c000b..f8140af93 100644
--- a/src/client/views/nodes/LabelBox.tsx
+++ b/src/client/views/nodes/LabelBox.tsx
@@ -84,18 +84,22 @@ export class LabelBox extends ViewBoxBaseComponent<FieldViewProps & LabelBoxProp
         return this._mouseOver ? StrCast(this.layoutDoc._hoverBackgroundColor) : this.props.styleProvider?.(this.layoutDoc, this.props, StyleProp.BackgroundColor);
     }
 
-    fitTextToBox = (r: any): NodeJS.Timeout | {
-        rotateText: null;
-        fontSizeFactor: number;
-        minimumFontSize: number;
-        maximumFontSize: number;
-        limitingDimension: string;
-        horizontalAlign: string;
-        verticalAlign: string;
-        textAlign: string;
-        singleLine: boolean;
-        whiteSpace: string;
-    } => {
+    fitTextToBox = (
+        r: any
+    ):
+        | NodeJS.Timeout
+        | {
+              rotateText: null;
+              fontSizeFactor: number;
+              minimumFontSize: number;
+              maximumFontSize: number;
+              limitingDimension: string;
+              horizontalAlign: string;
+              verticalAlign: string;
+              textAlign: string;
+              singleLine: boolean;
+              whiteSpace: string;
+          } => {
         const singleLine = BoolCast(this.layoutDoc._singleLine, true);
         const params = {
             rotateText: null,
@@ -154,9 +158,9 @@ export class LabelBox extends ViewBoxBaseComponent<FieldViewProps & LabelBoxProp
                         paddingBottom: NumCast(this.layoutDoc._yPadding),
                         width: this.props.PanelWidth(),
                         height: this.props.PanelHeight(),
-                        whiteSpace:  !(boxParams instanceof NodeJS.Timeout) && boxParams.singleLine ? 'pre' : 'pre-wrap',
+                        whiteSpace: 'singleLine' in boxParams && boxParams.singleLine ? 'pre' : 'pre-wrap',
                     }}>
-                    <span style={{ width: !(boxParams instanceof NodeJS.Timeout) && boxParams.singleLine ? '' : '100%' }} ref={action((r: any) => this.fitTextToBox(r))}>
+                    <span style={{ width: 'singleLine' in boxParams ? '' : '100%' }} ref={action((r: any) => this.fitTextToBox(r))}>
                         {label.startsWith('#') ? null : label.replace(/([^a-zA-Z])/g, '$1\u200b')}
                     </span>
                 </div>