1 files changed, 22 insertions, 4 deletions
diff --git a/src/client/views/nodes/DataVizBox/components/TableBox.tsx b/src/client/views/nodes/DataVizBox/components/TableBox.tsx
index aaedba202..64c6dc940 100644
--- a/src/client/views/nodes/DataVizBox/components/TableBox.tsx
+++ b/src/client/views/nodes/DataVizBox/components/TableBox.tsx
@@ -9,14 +9,24 @@ import { DragManager } from '../../../../util/DragManager';
 import { DocumentView } from '../../DocumentView';
 import { DataVizView } from '../DataVizBox';
 import { LinkManager } from '../../../../util/LinkManager';
-import { DocCast } from '../../../../../fields/Types';
+import { Cast, DocCast } from '../../../../../fields/Types';
 import { EditableText, Size, Type } from 'browndash-components';
+import './Chart.scss';
+import { listSpec } from '../../../../../fields/Schema';
 
 interface TableBoxProps {
     rootDoc: Doc;
     pairs: { [key: string]: any }[];
     selectAxes: (axes: string[]) => void;
     axes: string[];
+    width: number;
+    height: number;
+    margin: {
+        top: number;
+        right: number;
+        bottom: number;
+        left: number;
+    };
     docView?: () => DocumentView | undefined;
 }
 
@@ -27,6 +37,7 @@ export class TableBox extends React.Component<TableBoxProps> {
 
     @computed get _tableData() {
         if (this.incomingLinks.length! <= 0) return this.props.pairs;
+        /// StrListCast(this.incomingLinks[0].anchor_1.selected) ==> list of guids that the parent has selected
         return this.props.pairs?.filter(pair => (Array.from(Object.keys(pair)).some(key => pair[key] && key.startsWith('select'))))
     }
 
@@ -44,7 +55,7 @@ export class TableBox extends React.Component<TableBoxProps> {
 
     // render() {
     //     return (
-    //         <div className="table-container">
+    //         <div className="table-container" style={{height: this.props.height+this.props.margin.top+this.props.margin.bottom}}>
     //             <table className="table">
     //                 <thead>
     //                     <tr className="table-row">
@@ -144,7 +155,7 @@ export class TableBox extends React.Component<TableBoxProps> {
 
     render() {
         return (
-            <div className="table-container">
+            <div className="table-container" style={{height: this.props.height+this.props.margin.top+this.props.margin.bottom}}>
                 <table className="table">
                     <thead>
                         <tr className="table-row">
@@ -214,7 +225,14 @@ export class TableBox extends React.Component<TableBoxProps> {
                     <tbody>
                         {this._tableData?.map((p, i) => {
                             return (
-                                <tr key={i} className="table-row" onClick={action(e => (p['select' + this.props.docView?.()?.rootDoc![Id]] = !p['select' + this.props.docView?.()?.rootDoc![Id]]))}>
+                                <tr key={i} className="table-row" onClick={action(e => {
+                                        // if (!this.props.docView?.()!.layoutDoc.selected) 
+                                        //     this.props.docView!.()!.layoutDoc.selected = new List<string>();
+                                        // const selected = Cast(this.props.docView?.()!.layoutDoc.selected, listSpec("string"), null);
+                                        //                    // StrListCast(this.props.docView?.()!.layoutDoc.selected)
+                                        // selected.push(p.guid);
+                                        (p['select' + this.props.docView?.()?.rootDoc![Id]] = !p['select' + this.props.docView?.()?.rootDoc![Id]])
+                                    })}>
                                     {this.columns.map(col => (
                                         <td key={this.columns.indexOf(col)} style={{ fontWeight: p['select' + this.props.docView?.()?.rootDoc![Id]] ? 'bold' : '' }}>
                                             {p[col]}