From 20128eb11d5146e9f199d04a94ca9a6b5ac109d7 Mon Sep 17 00:00:00 2001 From: Nathan-SR <144961007+Nathan-SR@users.noreply.github.com> Date: Thu, 20 Jun 2024 14:33:28 -0400 Subject: some progress on eq text highlighting --- .../collectionSchema/CollectionSchemaView.scss | 5 +++ .../collectionSchema/CollectionSchemaView.tsx | 4 ++- .../collectionSchema/SchemaCellField.tsx | 37 +++++++++++++++++----- .../collections/collectionSchema/SchemaRowBox.tsx | 6 ++++ .../collectionSchema/SchemaTableCell.tsx | 6 +++- 5 files changed, 48 insertions(+), 10 deletions(-) (limited to 'src') diff --git a/src/client/views/collections/collectionSchema/CollectionSchemaView.scss b/src/client/views/collections/collectionSchema/CollectionSchemaView.scss index d1f1e3a13..6b53eb1cc 100644 --- a/src/client/views/collections/collectionSchema/CollectionSchemaView.scss +++ b/src/client/views/collections/collectionSchema/CollectionSchemaView.scss @@ -313,3 +313,8 @@ } } +.schemaField-editing { + outline: none; +} + + diff --git a/src/client/views/collections/collectionSchema/CollectionSchemaView.tsx b/src/client/views/collections/collectionSchema/CollectionSchemaView.tsx index c287b7d44..5c8a84163 100644 --- a/src/client/views/collections/collectionSchema/CollectionSchemaView.tsx +++ b/src/client/views/collections/collectionSchema/CollectionSchemaView.tsx @@ -533,7 +533,7 @@ export class CollectionSchemaView extends CollectionSubView() { return cell; } - findCellRefs = (text: string) => { + findCellRefs = (text: string, retRawMatches?: boolean) => { const pattern = /(this|d(\d+))\.(\w+)/g; interface Match { docRef: string; field: string; } @@ -545,6 +545,8 @@ export class CollectionSchemaView extends CollectionSubView() { matches.push({ docRef, field: match[3] }); } + if (retRawMatches) return matches; + const cells: Array = []; matches.forEach((match: Match) => { const {docRef, field} = match; diff --git a/src/client/views/collections/collectionSchema/SchemaCellField.tsx b/src/client/views/collections/collectionSchema/SchemaCellField.tsx index 3af3b1d61..4ba8c8469 100644 --- a/src/client/views/collections/collectionSchema/SchemaCellField.tsx +++ b/src/client/views/collections/collectionSchema/SchemaCellField.tsx @@ -15,6 +15,7 @@ export interface SchemaCellFieldProps { highlightCells?: (text: string) => void; GetValue(): string | undefined; SetValue(value: string, shiftDown?: boolean, enterKey?: boolean): boolean; + func: (text: string, raw: boolean) => HTMLDivElement[] | []; } @observer @@ -72,10 +73,25 @@ export class SchemaCellField extends ObservableReactComponent { + const matches = this._props.func(content, true); + const cells = this._props.func(content, false); + let chunkedText = content; + let matchNum = 0; + matches.forEach((docRef, field) => { + console.log('cell: ' + cells[matchNum] + ' border: ' + cells[matchNum].style.borderTop) + chunkedText = chunkedText.replace(`d5.type`, `d5.type`); + ++matchNum; + }) + return chunkedText; + } + @action setContent = (content: string) => { - this._displayedContent = content; - }; + console.log(this.chunkContent(content)); + this._displayedContent = this.chunkContent(content); + console.log('displayed: ' + this._displayedContent); + } @action setIsFocused = (value: boolean) => { @@ -126,10 +142,13 @@ export class SchemaCellField extends ObservableReactComponent) => { const cursorPos = this.cursorPosition; + const prevVal = this._content; const targVal = e.currentTarget.innerText; if (!(targVal.startsWith(':=') || targVal.startsWith('='))) { this._overlayDisposer?.(); @@ -138,8 +157,10 @@ export class SchemaCellField extends ObservableReactComponent, { x: 0, y: 0 }); } this._content = targVal; - this.setContent(targVal); - setTimeout(() => this.restoreCursorPosition(cursorPos), 0); + if (this._props.func(targVal, true).length > this._props.func(prevVal, true).length) { + this.setContent(targVal); + setTimeout(() => this.restoreCursorPosition(cursorPos), 0); + } this._props.highlightCells?.(targVal); }; @@ -208,15 +229,15 @@ export class SchemaCellField extends ObservableReactComponent : this.props.contents ? this._props.contents?.valueOf() : '' } - }; + } renderEditor = () => { return (
{ this._inputref = r; }} - style={{ overflow: 'auto', minHeight: `min(100%, ${(this._props.GetValue()?.split('\n').length || 1) * 15})`, minWidth: 20, }} + style={{ outline: 'none', overflow: 'auto', minHeight: `min(100%, ${(this._props.GetValue()?.split('\n').length || 1) * 15})`, minWidth: 20, }} onBlur={e => this.finalizeEdit(false, true, false)} autoFocus onInput={this.onChange} @@ -228,7 +249,7 @@ export class SchemaCellField extends ObservableReactComponent
); - }; + } render() { const gval = this._props.GetValue()?.replace(/\n/g, '\\r\\n'); diff --git a/src/client/views/collections/collectionSchema/SchemaRowBox.tsx b/src/client/views/collections/collectionSchema/SchemaRowBox.tsx index 4902a49ff..121605a2b 100644 --- a/src/client/views/collections/collectionSchema/SchemaRowBox.tsx +++ b/src/client/views/collections/collectionSchema/SchemaRowBox.tsx @@ -122,6 +122,10 @@ export class SchemaRowBox extends ViewBoxBaseComponent() { columnWidth = computedFn((index: number) => () => this.schemaView?.displayColumnWidths[index] ?? CollectionSchemaView._minColWidth); computeRowIndex = () => this.schemaView?.rowIndex(this.Document); highlightCells = (text: string) => this.schemaView?.highlightCells(text); + equationHighlightRef = (text: string) => { + + } + eqHighlightFunc = (text: string, raw: boolean) => {return this.schemaView.findCellRefs(text, raw)}; render() { return (
() {
{this.schemaView?.columnKeys?.map((key, index) => ( boolean; isolatedSelection: [boolean, boolean]; highlightCells: (text: string) => void; + equationHighlightRef: ObservableMap; + func: (text: string, raw: boolean) => HTMLDivElement[] | []; + } function selectedCell(props: SchemaTableCellProps) { @@ -179,6 +182,7 @@ export class SchemaTableCell extends ObservableReactComponent selectedCell(this._props) && this._props.autoFocus && r?.setIsFocused(true)} oneLine={this._props.oneLine} contents={undefined} -- cgit v1.2.3-70-g09d2