@datagrok/bio 2.19.0 → 2.20.0

package/package.json

@@ -5,7 +5,7 @@
     "name": "Leonid Stolbov",
     "email": "lstolbov@datagrok.ai"
   },
-  "version": "2.19.0",
+  "version": "2.20.0",
   "description": "Bioinformatics support (import/export of sequences, conversion, visualization, analysis). [See more](https://github.com/datagrok-ai/public/blob/master/packages/Bio/README.md) for details.",
   "repository": {
     "type": "git",
@@ -47,10 +47,10 @@
     "@datagrok-libraries/bio": "^5.50.1",
     "@datagrok-libraries/chem-meta": "^1.2.7",
     "@datagrok-libraries/math": "^1.2.4",
-    "@datagrok-libraries/ml": "^6.7.6",
-    "@datagrok-libraries/tutorials": "^1.4.3",
-    "@datagrok-libraries/utils": "^4.4.0",
-    "datagrok-api": "^1.24.0",
+    "@datagrok-libraries/ml": "^6.10.0",
+    "@datagrok-libraries/tutorials": "^1.6.0",
+    "@datagrok-libraries/utils": "^4.5.0",
+    "datagrok-api": "^1.25.0",
     "@webgpu/types": "^0.1.40",
     "ajv": "^8.12.0",
     "ajv-errors": "^3.0.0",
@@ -109,7 +109,7 @@
     "analyze": "webpack --profile --json > ./stats.json && npx webpack-bundle-analyzer ./stats.json"
   },
   "canEdit": [
-    "Developers"
+    "Administrators"
   ],
   "canView": [
     "All users"

package/src/analysis/sequence-diversity-viewer.ts

@@ -5,12 +5,13 @@ import * as grok from 'datagrok-api/grok';
 import {getDiverseSubset} from '@datagrok-libraries/utils/src/similarity-metrics';
 import {SequenceSearchBaseViewer} from './sequence-search-base-viewer';
 import {getMonomericMols} from '../calculations/monomerLevelMols';
-import {updateDivInnerHTML} from '../utils/ui-utils';
+import {adjustGridcolAfterRender, updateDivInnerHTML} from '../utils/ui-utils';
 import {Subject} from 'rxjs';
 import {ISeqHelper} from '@datagrok-libraries/bio/src/utils/seq-helper';
 import {getEncodedSeqSpaceCol} from './sequence-space';
 import {MmDistanceFunctionsNames} from '@datagrok-libraries/ml/src/macromolecule-distance-functions';
 import {DistanceMatrixService, dmLinearIndex} from '@datagrok-libraries/ml/src/distance-matrix';
+import {MmcrTemps} from '@datagrok-libraries/bio/src/utils/cell-renderer-consts';
 
 export class SequenceDiversityViewer extends SequenceSearchBaseViewer {
   diverseColumnLabel: string | null; // Use postfix Label to prevent activating table column selection editor
@@ -22,7 +23,7 @@ export class SequenceDiversityViewer extends SequenceSearchBaseViewer {
   constructor(
     private readonly seqHelper: ISeqHelper,
   ) {
-    super('diversity');
+    super('diversity', DG.SEMTYPE.MACROMOLECULE);
     this.diverseColumnLabel = this.string('diverseColumnLabel', null);
   }
 
@@ -30,27 +31,34 @@ export class SequenceDiversityViewer extends SequenceSearchBaseViewer {
     if (!this.beforeRender())
       return;
     if (this.dataFrame) {
-      if (computeData && this.moleculeColumn) {
-        const sh = this.seqHelper.getSeqHandler(this.moleculeColumn);
+      if (computeData && this.targetColumn) {
+        const sh = this.seqHelper.getSeqHandler(this.targetColumn);
         await (sh.isFasta() ? this.computeByMM() : this.computeByChem());
 
         const diverseColumnName: string = this.diverseColumnLabel != null ? this.diverseColumnLabel :
-          `diverse (${this.moleculeColumnName})`;
+          `diverse (${this.targetColumnName})`;
         const resCol = DG.Column.string(diverseColumnName, this.renderMolIds!.length)
-          .init((i) => this.moleculeColumn?.get(this.renderMolIds![i]));
+          .init((i) => this.targetColumn?.get(this.renderMolIds![i]));
         resCol.semType = DG.SEMTYPE.MACROMOLECULE;
-        this.tags.forEach((tag) => resCol.setTag(tag, this.moleculeColumn!.getTag(tag)));
+        this.tags.forEach((tag) => resCol.setTag(tag, this.targetColumn!.getTag(tag)));
         const resDf = DG.DataFrame.fromColumns([resCol]);
-        resDf.onCurrentRowChanged.subscribe(
-          (_: any) => { this.dataFrame.currentRowIdx = this.renderMolIds![resDf.currentRowIdx]; });
-        updateDivInnerHTML(this.root, resDf.plot.grid().root);
+        resCol.temp[MmcrTemps.maxMonomerLength] = 4;
+
+        const _ = resDf.onCurrentRowChanged.subscribe((_: any) => {
+          this.dataFrame.currentRowIdx = this.renderMolIds![resDf.currentRowIdx];
+        });
+
+        const grid = resDf.plot.grid();
+        adjustGridcolAfterRender(grid, resCol.name, 450, 30);
+
+        updateDivInnerHTML(this.root, grid.root);
         this.computeCompleted.next(true);
       }
     }
   }
 
   private async computeByChem() {
-    const monomericMols = await getMonomericMols(this.moleculeColumn!, this.seqHelper);
+    const monomericMols = await getMonomericMols(this.targetColumn!, this.seqHelper);
     //need to create df to calculate fingerprints
     const _monomericMolsDf = DG.DataFrame.fromColumns([monomericMols]);
     this.renderMolIds = await grok.functions.call('Chem:callChemDiversitySearch', {
@@ -63,15 +71,15 @@ export class SequenceDiversityViewer extends SequenceSearchBaseViewer {
 
   private async computeByMM() {
     const encodedSequences =
-      (await getEncodedSeqSpaceCol(this.moleculeColumn!, MmDistanceFunctionsNames.LEVENSHTEIN)).seqList;
+      (await getEncodedSeqSpaceCol(this.targetColumn!, MmDistanceFunctionsNames.LEVENSHTEIN)).seqList;
     const distanceMatrixService = new DistanceMatrixService(true, false);
     const distanceMatrixData = await distanceMatrixService.calc(encodedSequences, MmDistanceFunctionsNames.LEVENSHTEIN);
     distanceMatrixService.terminate();
-    const len = this.moleculeColumn!.length;
+    const len = this.targetColumn!.length;
     const linearizeFunc = dmLinearIndex(len);
     this.renderMolIds = getDiverseSubset(len, Math.min(len, this.limit),
       (i1: number, i2: number) => {
-        return this.moleculeColumn!.isNone(i1) || this.moleculeColumn!.isNone(i2) ? 0 :
+        return this.targetColumn!.isNone(i1) || this.targetColumn!.isNone(i2) ? 0 :
           distanceMatrixData[linearizeFunc(i1, i2)];
       });
   }

package/src/analysis/sequence-search-base-viewer.ts

@@ -4,94 +4,28 @@ import * as grok from 'datagrok-api/grok';
 
 import {CHEM_SIMILARITY_METRICS} from '@datagrok-libraries/ml/src/distance-metrics-methods';
 import {TAGS as bioTAGS} from '@datagrok-libraries/bio/src/utils/macromolecule';
+import {SearchBaseViewer} from '@datagrok-libraries/ml/src/viewers/search-base-viewer';
 
 const MAX_ROWS_FOR_DISTANCE_MATRIX = 22000;
 
-export class SequenceSearchBaseViewer extends DG.JsViewer {
-  name: string = '';
+export class SequenceSearchBaseViewer extends SearchBaseViewer {
   distanceMetric: string;
-  limit: number;
   fingerprint: string;
   metricsProperties = ['distanceMetric', 'fingerprint'];
   fingerprintChoices = ['Morgan', 'Pattern'];
-  moleculeColumn?: DG.Column<string>;
-  moleculeColumnName: string;
-  initialized: boolean = false;
   tags = [DG.TAGS.UNITS, bioTAGS.aligned, bioTAGS.separator, bioTAGS.alphabet];
   preComputeDistanceMatrix: boolean = false;
 
-  constructor(name: string) {
-    super();
+  constructor(name: string, semType: string) {
+    super(name, semType);
     this.fingerprint = this.string('fingerprint', this.fingerprintChoices[0], {choices: this.fingerprintChoices});
-    this.limit = this.int('limit', 10);
     this.distanceMetric = this.string('distanceMetric', CHEM_SIMILARITY_METRICS[0], {choices: CHEM_SIMILARITY_METRICS});
-    this.moleculeColumnName = this.string('moleculeColumnName');
-    this.name = name;
-  }
-
-  init(): void {
-    this.initialized = true;
-  }
-
-  detach(): void {
-    this.subs.forEach((sub) => sub.unsubscribe());
   }
 
   async onTableAttached(): Promise<void> {
-    this.init();
+    super.onTableAttached();
 
-    if (this.dataFrame) {
+    if (this.dataFrame)
       this.preComputeDistanceMatrix = this.dataFrame.rowCount <= MAX_ROWS_FOR_DISTANCE_MATRIX;
-      this.subs.push(DG.debounce(this.dataFrame.onRowsRemoved, 50)
-        .subscribe((_: any) => this.render(true)));
-      const compute = this.name !== 'diversity';
-      this.subs.push(DG.debounce(this.dataFrame.onCurrentRowChanged, 50)
-        .subscribe((_: any) => this.render(compute)));
-      this.subs.push(DG.debounce(this.dataFrame.selection.onChanged, 50)
-        .subscribe((_: any) => this.render(false)));
-      this.subs.push(DG.debounce(ui.onSizeChanged(this.root), 50)
-        .subscribe((_: any) => this.render(false)));
-      this.moleculeColumn = this.dataFrame.columns.bySemType(DG.SEMTYPE.MACROMOLECULE) as DG.Column<string>;
-      this.moleculeColumnName = this.moleculeColumn?.name!;
-      this.getProperty('limit')!.fromOptions({min: 1, max: this.dataFrame.rowCount});
-    }
-    this.render();
-  }
-
-  onPropertyChanged(property: DG.Property): void {
-    super.onPropertyChanged(property);
-    if (!this.initialized)
-      return;
-    if (property.name === 'moleculeColumnName') {
-      const col = this.dataFrame.col(property.get(this))!;
-      if (col.semType === DG.SEMTYPE.MACROMOLECULE)
-        this.moleculeColumn = col;
-    }
-    this.render();
-  }
-
-  /** For tests */ public computeRequested: boolean = false;
-  public renderPromise: Promise<void> = Promise.resolve();
-
-  protected render(computeData = true): void {
-    this.renderPromise = this.renderPromise.then(async () => {
-      this.computeRequested = this.computeRequested || computeData;
-      await this.renderInt(computeData);
-    });
-  }
-
-  async renderInt(_computeData: boolean): Promise<void> {
-
-  }
-
-  beforeRender() {
-    if (!this.initialized)
-      return false;
-    if (this.dataFrame && this.moleculeColumnName &&
-          this.dataFrame.col(this.moleculeColumnName)!.semType !== DG.SEMTYPE.MACROMOLECULE) {
-      grok.shell.error(`${this.moleculeColumnName} is not Macromolecule type`);
-      return false;
-    }
-    return true;
   }
 }

package/src/analysis/sequence-similarity-viewer.ts

@@ -5,13 +5,14 @@ import * as DG from 'datagrok-api/dg';
 import {SequenceSearchBaseViewer} from './sequence-search-base-viewer';
 import {getMonomericMols} from '../calculations/monomerLevelMols';
 import {createDifferenceCanvas, createDifferencesWithPositions} from './sequence-activity-cliffs';
-import {updateDivInnerHTML} from '../utils/ui-utils';
+import {adjustGridcolAfterRender, updateDivInnerHTML} from '../utils/ui-utils';
 import {Subject} from 'rxjs';
 import {ISeqHelper} from '@datagrok-libraries/bio/src/utils/seq-helper';
 import {alignSequencePair} from '@datagrok-libraries/bio/src/utils/macromolecule/alignment';
 import {KnnResult, SparseMatrixService} from '@datagrok-libraries/ml/src/distance-matrix/sparse-matrix-service';
 import {getEncodedSeqSpaceCol} from './sequence-space';
 import {MmDistanceFunctionsNames} from '@datagrok-libraries/ml/src/macromolecule-distance-functions';
+import {MmcrTemps, tempTAGS} from '@datagrok-libraries/bio/src/utils/cell-renderer-consts';
 
 export class SequenceSimilarityViewer extends SequenceSearchBaseViewer {
   cutoff: number;
@@ -31,12 +32,14 @@ export class SequenceSimilarityViewer extends SequenceSearchBaseViewer {
   knn?: KnnResult;
   kPrevNeighbors: number = 0;
   demo?: boolean;
+  analysisGrid?: DG.Grid;
+  subInited: boolean = false;
 
   constructor(
     private readonly seqHelper: ISeqHelper,
     demo?: boolean,
   ) {
-    super('similarity');
+    super('similarity', DG.SEMTYPE.MACROMOLECULE);
     this.cutoff = this.float('cutoff', 0.01, {min: 0, max: 1});
     this.hotSearch = this.bool('hotSearch', true);
     this.similarColumnLabel = this.string('similarColumnLabel', null);
@@ -51,42 +54,57 @@ export class SequenceSimilarityViewer extends SequenceSearchBaseViewer {
   override async renderInt(computeData: boolean): Promise<void> {
     if (!this.beforeRender())
       return;
-    if (this.moleculeColumn) {
+    if (this.targetColumn) {
       this.curIdx = this.dataFrame!.currentRowIdx == -1 ? 0 : this.dataFrame!.currentRowIdx;
       if (computeData && !this.gridSelect) {
         this.targetMoleculeIdx = this.dataFrame!.currentRowIdx == -1 ? 0 : this.dataFrame!.currentRowIdx;
-        const sh = this.seqHelper.getSeqHandler(this.moleculeColumn!);
+        const sh = this.seqHelper.getSeqHandler(this.targetColumn!);
 
-        await (!sh.isHelm() ? this.computeByMM() : this.computeByChem());
+        await this.computeByMM();
         const similarColumnName: string = this.similarColumnLabel != null ? this.similarColumnLabel :
-          `similar (${this.moleculeColumnName})`;
+          `similar (${this.targetColumn})`;
         this.molCol = DG.Column.string(similarColumnName,
-          this.idxs!.length).init((i) => this.moleculeColumn?.get(this.idxs?.get(i)));
+          this.idxs!.length).init((i) => this.targetColumn?.get(this.idxs?.get(i)));
         this.molCol.semType = DG.SEMTYPE.MACROMOLECULE;
-        this.tags.forEach((tag) => this.molCol!.setTag(tag, this.moleculeColumn!.getTag(tag)));
+        this.tags.forEach((tag) => this.molCol!.setTag(tag, this.targetColumn!.getTag(tag)));
         const resDf = DG.DataFrame.fromColumns([this.idxs!, this.molCol!, this.scores!]);
-        resDf.onCurrentRowChanged.subscribe((_: any) => {
+        await resDf.meta.detectSemanticTypes();
+        await grok.data.detectSemanticTypes(resDf);
+        this.molCol.temp[tempTAGS.referenceSequence] = this.targetColumn!.get(this.targetMoleculeIdx);
+        this.molCol.temp[MmcrTemps.maxMonomerLength] = 4;
+        let prevTimer: any = null;
+        const _ = resDf.onCurrentRowChanged.subscribe((_: any) => {
+          prevTimer && clearTimeout(prevTimer);
           this.dataFrame.currentRowIdx = resDf.col('indexes')!.get(resDf.currentRowIdx);
-          setTimeout(() => { this.createPropertyPanel(resDf); }, 1000);
+          prevTimer = setTimeout(() => { this.createPropertyPanel(resDf); }, 300);
           this.gridSelect = true;
         });
-        const grid = resDf.plot.grid();
-        grid.col('indexes')!.visible = false;
+        if (!this.analysisGrid) {
+          this.analysisGrid = resDf.plot.grid();
+          updateDivInnerHTML(this.root, this.analysisGrid.root);
+        } else {
+          this.analysisGrid.dataFrame = resDf;
+          this.analysisGrid.invalidate();
+        }
+        this.analysisGrid.col('indexes')!.visible = false;
+        adjustGridcolAfterRender(this.analysisGrid, this.molCol!.name, 450, 30, true);
         const targetMolRow = this.idxs?.getRawData().findIndex((it) => it == this.targetMoleculeIdx);
-        const targetScoreCell = grid.cell('score', targetMolRow!);
+        const targetScoreCell = this.analysisGrid.cell('score', targetMolRow!);
         targetScoreCell.cell.value = null;
-        const view = this.demo ? (grok.shell.view('Browse')! as DG.BrowseView)!.preview! as DG.TableView : grok.shell.v as DG.TableView;
-        view.grid.root.addEventListener('click', (_event: MouseEvent) => {
-          this.gridSelect = false;
-        });
-        updateDivInnerHTML(this.root, grid.root);
+        const view = grok.shell.tv;
+        if (!this.subInited) {
+          view.grid.root.addEventListener('click', (_event: MouseEvent) => {
+            this.gridSelect = false;
+          });
+          this.subInited = true;
+        }
         this.computeCompleted.next(true);
       }
     }
   }
 
   private async computeByChem() {
-    const monomericMols = await getMonomericMols(this.moleculeColumn!, this.seqHelper);
+    const monomericMols = await getMonomericMols(this.targetColumn!, this.seqHelper);
     //need to create df to calculate fingerprints
     const _monomericMolsDf = DG.DataFrame.fromColumns([monomericMols]);
     const df = await grok.functions.call('Chem:callChemSimilaritySearch', {
@@ -103,11 +121,11 @@ export class SequenceSimilarityViewer extends SequenceSearchBaseViewer {
   }
 
   private async computeByMM() {
-    const len = this.moleculeColumn!.length;
+    const len = this.targetColumn!.length;
     const actualLimit = Math.min(this.limit, len - 1);
     if (!this.knn || this.kPrevNeighbors !== actualLimit) {
       const encodedSequences =
-        (await getEncodedSeqSpaceCol(this.moleculeColumn!, MmDistanceFunctionsNames.LEVENSHTEIN)).seqList;
+        (await getEncodedSeqSpaceCol(this.targetColumn!, MmDistanceFunctionsNames.LEVENSHTEIN)).seqList;
 
       this.kPrevNeighbors = actualLimit;
       this.knn = await (new SparseMatrixService()
@@ -128,12 +146,13 @@ export class SequenceSimilarityViewer extends SequenceSearchBaseViewer {
     const molDifferences: { [key: number]: HTMLCanvasElement } = {};
     const molColName = this.molCol?.name!;
     const resCol: DG.Column<string> = resDf.col(molColName)!;
-    const molColSh = this.seqHelper.getSeqHandler(this.moleculeColumn!);
+    const molColSh = this.seqHelper.getSeqHandler(this.targetColumn!);
     const resSh = this.seqHelper.getSeqHandler(resCol);
     const subParts1 = molColSh.getSplitted(this.targetMoleculeIdx);
     const subParts2 = resSh.getSplitted(resDf.currentRowIdx);
     const alignment = alignSequencePair(subParts1, subParts2);
-    const canvas = createDifferenceCanvas(alignment.seq1Splitted, alignment.seq2Splitted, resSh.defaultBiotype, molDifferences);
+    const canvas =
+      createDifferenceCanvas(alignment.seq1Splitted, alignment.seq2Splitted, resSh.defaultBiotype, molDifferences);
     propPanel.append(ui.div(canvas, {style: {width: '300px', overflow: 'scroll'}}));
     if (subParts1.length !== subParts2.length) {
       propPanel.append(ui.divV([

package/src/demo/bio01-similarity-diversity.ts

@@ -8,11 +8,30 @@ import {handleError} from './utils';
 import {SequenceDiversityViewer} from '../analysis/sequence-diversity-viewer';
 import {SequenceSimilarityViewer} from '../analysis/sequence-similarity-viewer';
 import {getSeqHelper, ISeqHelper} from '@datagrok-libraries/bio/src/utils/seq-helper';
+import {adjustGridcolAfterRender} from '../utils/ui-utils';
+import {MmcrTemps} from '@datagrok-libraries/bio/src/utils/cell-renderer-consts';
 
 const dataFn: string = 'samples/FASTA_PT_activity.csv';
 
-export async function demoBio01UI() {
-  let seqHelper: ISeqHelper = await getSeqHelper();
+export async function demoBioSimDiv() {
+  const t = await _package.files.readCsv('samples/peptides-non-natural.csv');
+  t.name = 'Similarity and Diversity Demo';
+  t.col('activity')!.setTag('format', '3 significant digits');
+  t.col('sequence')!.temp[MmcrTemps.maxMonomerLength] = 4;
+  const tv = grok.shell.addTableView(t);
+  await t.meta.detectSemanticTypes();
+  await grok.data.detectSemanticTypes(t);
+  const simV = tv.addViewer('Sequence Similarity Search', {limit: 20});
+  const dn = tv.dockManager.dock(simV, DG.DOCK_TYPE.RIGHT, null, 'Similarity search', 0.45);
+  adjustGridcolAfterRender(tv.grid, 'sequence', 500, 30);
+  const divV = tv.addViewer('Sequence Diversity Search', {limit: 20});
+  tv.dockManager.dock(divV, DG.DOCK_TYPE.DOWN, dn, 'Diversity search', 0.4);
+  grok.functions.call('Dendrogram:HierarchicalClustering',
+    {df: grok.shell.t, colNameList: ['sequence'], distance: 'euclidian', linkage: 'complete'});
+}
+
+export async function demoBio01UISteps() {
+  const seqHelper: ISeqHelper = await getSeqHelper();
 
   let view: DG.TableView;
   let df: DG.DataFrame;

package/src/demo/bio01a-hierarchical-clustering-and-sequence-space.ts

@@ -12,6 +12,13 @@ import {getClusterMatrixWorker} from '@datagrok-libraries/math';
 const dataFn = 'samples/FASTA_PT_activity.csv';
 const seqColName = 'sequence';
 
+export async function demoSeqSpace() {
+  const p = await grok.functions.eval('Bio:SeqSpaceDemo');
+  const project = await grok.dapi.projects.find(p.id);
+  await project.open();
+  grok.shell.windows.help.showHelp('/help/datagrok/solutions/domains/bio/bio.md#sequence-space');
+}
+
 export async function demoBio01aUI() {
   let treeHelper: ITreeHelper;
   let dendrogramSvc: IDendrogramService;

package/src/demo/bio01b-hierarchical-clustering-and-activity-cliffs.ts

@@ -28,7 +28,7 @@ export async function demoBio01bUI() {
 
   try {
     const demoScript = new DemoScript('Activity Cliffs', 'Activity Cliffs analysis on Macromolecules data', false,
-      {autoStartFirstStep: true});
+      {autoStartFirstStep: true, path: 'Bioinformatics/Activity Cliffs'});
     await demoScript
       .step(`Load DNA sequences`, async () => {
         grok.shell.windows.showContextPanel = false;

package/src/demo/bio03-atomic-level.ts

@@ -5,6 +5,21 @@ import {_package, toAtomicLevel} from '../package';
 import {handleError} from './utils';
 import {DemoScript} from '@datagrok-libraries/tutorials/src/demo-script';
 import {delay} from '@datagrok-libraries/utils/src/test';
+import {adjustGridcolAfterRender} from '../utils/ui-utils';
+
+export async function demoToAtomicLevel(): Promise<void> {
+  const data = await _package.files.readCsv('samples/HELM_BI_CYCLIC.csv');
+  data.name = 'To Atomic Level';
+  await data.meta.detectSemanticTypes();
+  await grok.data.detectSemanticTypes(data);
+  const view = grok.shell.addTableView(data);
+  const seqCol = data.col('HELM')!;
+  await toAtomicLevel(data, seqCol, true, false);
+  adjustGridcolAfterRender(view.grid, 'molfile(HELM)', 500, 300, true);
+  adjustGridcolAfterRender(view.grid, 'HELM', 500, undefined, true);
+  grok.shell.info('Hover over monomers in HELM column to highlight them in molecular structure.', {timeout: 10});
+  grok.shell.windows.help.showHelp('/help/datagrok/solutions/domains/bio/bio.md#get-atomic-level-structure');
+}
 
 export async function demoBio03UI(): Promise<void> {
   const dataFn: string = 'samples/HELM.csv';

package/src/package.ts

@@ -47,11 +47,10 @@ import {BioSubstructureFilter} from './widgets/bio-substructure-filter';
 import {WebLogoViewer} from './viewers/web-logo-viewer';
 import {MonomerLibManager} from './utils/monomer-lib/lib-manager';
 import {getMonomerLibraryManagerLink, showManageLibrariesDialog, showManageLibrariesView} from './utils/monomer-lib/library-file-manager/ui';
-import {demoBio01UI} from './demo/bio01-similarity-diversity';
-import {demoBio01aUI} from './demo/bio01a-hierarchical-clustering-and-sequence-space';
+import {demoBioSimDiv} from './demo/bio01-similarity-diversity';
+import {demoSeqSpace} from './demo/bio01a-hierarchical-clustering-and-sequence-space';
 import {demoBio01bUI} from './demo/bio01b-hierarchical-clustering-and-activity-cliffs';
-import {demoBio03UI} from './demo/bio03-atomic-level';
-import {demoBio05UI} from './demo/bio05-helm-msa-sequence-space';
+import {demoToAtomicLevel} from './demo/bio03-atomic-level';
 import {checkInputColumnUI} from './utils/check-input-column';
 import {MsaWarning} from './utils/multiple-sequence-alignment';
 import {multipleSequenceAlignmentUI} from './utils/multiple-sequence-alignment-ui';
@@ -587,7 +586,7 @@ export async function sequenceSpaceTopMenu(table: DG.DataFrame, molecules: DG.Co
   plotEmbeddings: boolean, preprocessingFunction?: DG.Func, options?: (IUMAPOptions | ITSNEOptions) & Options,
   clusterEmbeddings?: boolean, isDemo?: boolean
 ): Promise<DG.ScatterPlotViewer | undefined> {
-  const tableView = isDemo ? (grok.shell.view('Browse')! as DG.BrowseView)!.preview! as DG.TableView :
+  const tableView =
     grok.shell.tv.dataFrame == table ? grok.shell.tv : undefined;
   if (!checkInputColumnUI(molecules, 'Sequence Space'))
     return;
@@ -967,21 +966,14 @@ export async function manageLibrariesApp(): Promise<DG.View> {
 
 //name: Monomer Manager Tree Browser
 //input: dynamic treeNode
-//input: view browseView
-export async function manageLibrariesAppTreeBrowser(treeNode: DG.TreeViewGroup, browseView: DG.BrowseView) {
+//input: dynamic browsePanel
+export async function manageLibrariesAppTreeBrowser(treeNode: DG.TreeViewGroup, browsePanel: DG.BrowsePanel) {
   const libraries = (await (await MonomerLibManager.getInstance()).getFileManager()).getValidLibraryPaths();
   libraries.forEach((libName) => {
     const nodeName = libName.endsWith('.json') ? libName.substring(0, libName.length - 5) : libName;
     const libNode = treeNode.item(nodeName);
     // eslint-disable-next-line rxjs/no-ignored-subscription, rxjs/no-async-subscribe
     libNode.onSelected.subscribe(async () => {
-      const monomerManager = await MonomerManager.getNewInstance();
-      browseView.preview = await monomerManager.getViewRoot(libName, false);
-    });
-
-    libNode.root.addEventListener('dblclick', async (e) => {
-      e.preventDefault();
-      e.stopImmediatePropagation();
       const monomerManager = await MonomerManager.getInstance();
       await monomerManager.getViewRoot(libName, true);
       monomerManager.resetCurrentRowFollowing();
@@ -1103,10 +1095,9 @@ export function addCopyMenu(cell: DG.Cell, menu: DG.Menu): void {
 //meta.demoPath: Bioinformatics | Similarity, Diversity
 //description: Sequence similarity tracking and evaluation dataset diversity
 //meta.path: /apps/Tutorials/Demo/Bioinformatics/Similarity,%20Diversity
-//meta.isDemoScript: True
 //meta.demoSkip: GROK-14320
 export async function demoBioSimilarityDiversity(): Promise<void> {
-  await demoBio01UI();
+  await demoBioSimDiv();
 }
 
 // demoBio01a
@@ -1114,10 +1105,9 @@ export async function demoBioSimilarityDiversity(): Promise<void> {
 //meta.demoPath: Bioinformatics | Sequence Space
 //description: Exploring sequence space of Macromolecules, comparison with hierarchical clustering results
 //meta.path: /apps/Tutorials/Demo/Bioinformatics/Sequence%20Space
-//meta.isDemoScript: True
 //meta.demoSkip: GROK-14320
 export async function demoBioSequenceSpace(): Promise<void> {
-  await demoBio01aUI();
+  await demoSeqSpace();
 }
 
 // demoBio01b
@@ -1136,21 +1126,9 @@ export async function demoBioActivityCliffs(): Promise<void> {
 //meta.demoPath: Bioinformatics | Atomic Level
 //description: Atomic level structure of Macromolecules
 //meta.path: /apps/Tutorials/Demo/Bioinformatics/Atomic%20Level
-//meta.isDemoScript: True
 //meta.demoSkip: GROK-14320
 export async function demoBioAtomicLevel(): Promise<void> {
-  await demoBio03UI();
-}
-
-// demoBio05
-//name: demoBioHelmMsaSequenceSpace
-//meta.demoPath: Bioinformatics | Helm, MSA, Sequence Space
-//description: MSA and composition analysis on Helm data
-//meta.path: /apps/Tutorials/Demo/Bioinformatics/Helm,%20MSA,%20Sequence%20Space
-//meta.isDemoScript: True
-//meta.demoSkip: GROK-14320
-export async function demoBioHelmMsaSequenceSpace(): Promise<void> {
-  await demoBio05UI();
+  await demoToAtomicLevel();
 }
 
 //name: SDF to JSON Library

package/src/tests/activity-cliffs-utils.ts

@@ -1,7 +1,7 @@
 import * as DG from 'datagrok-api/dg';
 import * as grok from 'datagrok-api/grok';
 
-import {expect} from '@datagrok-libraries/utils/src/test';
+import {awaitCheck, expect} from '@datagrok-libraries/utils/src/test';
 import {MmDistanceFunctionsNames} from '@datagrok-libraries/ml/src/macromolecule-distance-functions';
 import {BitArrayMetrics} from '@datagrok-libraries/ml/src/typed-metrics';
 import {BYPASS_LARGE_DATA_WARNING} from '@datagrok-libraries/ml/src/functionEditors/consts';
@@ -25,9 +25,10 @@ export async function _testActivityCliffsOpen(df: DG.DataFrame, drMethod: DimRed
   })) as DG.Viewer | undefined;
   expect(scatterPlot != null, true);
 
-  const cliffsLink = Array.from(scatterPlot!.root.children).find((el) => {
-    const classList: string[] = el.className.split(' ');
-    return ['ui-btn', 'ui-btn-ok'].every((reqClassName) => classList.includes(reqClassName));
-  });
-  expect((cliffsLink as HTMLElement).innerText.toLowerCase(), `${tgtNumberCliffs} cliffs`);
+  await awaitCheck(() => {
+    const link = Array.from(scatterPlot!.root.getElementsByClassName('scatter_plot_link'));
+    if (link.length)
+      return (link[0] as HTMLElement).innerText.toLowerCase() === `${tgtNumberCliffs} cliffs`;
+    return true;
+  }, 'incorrect cliffs link', 3000);
 }

package/src/tests/similarity-diversity-tests.ts

@@ -37,7 +37,7 @@ async function _testSimilaritySearchViewer() {
   await awaitCheck(() => getSearchViewer(moleculesView, 'Sequence Similarity Search') !== undefined,
     'Sequence Similarity Search viewer has not been created', 100);
   if (!viewer.initialized) throw new Error('The viewer is not initialized.');
-  if (!viewer.moleculeColumn) throw new Error('The viewer has not molecule column (onTableAttached).');
+  if (!viewer.targetColumn) throw new Error('The viewer has not molecule column (onTableAttached).');
   if (!viewer.beforeRender()) throw new Error('The viewer is not able to render.');
   if (!viewer.computeRequested) throw new Error('The viewer has not compute requested even.');
   if (!computeCompleted) throw new Error('The viewer has not compute completed.');
@@ -87,7 +87,7 @@ async function _testDiversitySearchViewer() {
   await awaitCheck(() => getSearchViewer(moleculesView, 'Sequence Diversity Search') !== undefined,
     'Sequence Diversity Search viewer has not been created', 100);
   if (!viewer.initialized) throw new Error('The viewer is not initialized.');
-  if (!viewer.moleculeColumn) throw new Error('The viewer has not molecule column (onTableAttached).');
+  if (!viewer.targetColumn) throw new Error('The viewer has not molecule column (onTableAttached).');
   if (!viewer.beforeRender()) throw new Error('The viewer is not able to render.');
   if (!viewer.computeRequested) throw new Error('The viewer has not compute requested even.');
   if (!computeCompleted) throw new Error('The viewer has not compute completed.');

package/src/utils/cell-renderer.ts

@@ -58,7 +58,6 @@ export function processSequence(subParts: string[]): [string[], boolean] {
 type RendererGridCellTemp = {
   [MmcrTemps.monomerPlacer]: MonomerPlacer
 }
-
 export class MacromoleculeSequenceCellRenderer extends DG.GridCellRenderer {
   private readonly seqHelper: ISeqHelper;
 
@@ -70,6 +69,8 @@ export class MacromoleculeSequenceCellRenderer extends DG.GridCellRenderer {
 
   get defaultWidth(): number | null { return 230; }
 
+  hasMouseOver: boolean = false;
+
   constructor() {
     super();
     this.seqHelper = _package.seqHelper;
@@ -101,6 +102,7 @@ export class MacromoleculeSequenceCellRenderer extends DG.GridCellRenderer {
   override onMouseEnter(gridCell: DG.GridCell, e: MouseEvent) {
     const back = this.getRendererBack(gridCell);
     back?.onMouseEnter(gridCell, e);
+    this.hasMouseOver = true;
   }
 
   override onMouseMove(gridCell: DG.GridCell, e: MouseEvent): void {
@@ -110,6 +112,14 @@ export class MacromoleculeSequenceCellRenderer extends DG.GridCellRenderer {
 
   override onMouseLeave(gridCell: DG.GridCell, _e: MouseEvent) {
     execMonomerHoverLinks(gridCell, null);
+    if (gridCell?.grid) {
+      const sub = gridCell.grid.onEvent('d4-grid-show-tooltip').subscribe((e) => {
+        sub.unsubscribe();
+        if (this.hasMouseOver)
+          e.preventDefault();
+      });
+    }
+    this.hasMouseOver = false;
   }
 
   override onDoubleClick(gridCell: DG.GridCell, e: MouseEvent) {

package/src/utils/helm-to-molfile/converter/monomer-wrapper.ts

@@ -10,7 +10,7 @@ import {MolfileWrapperFactory} from './mol-wrapper-factory';
 export class MonomerWrapper {
   private readonly molfileWrapper: MolfileWrapper;
   private capGroupElements: string[] = [];
-
+  private static molfileV2KToV3KCache: Map<string, string> = new Map();
   constructor(
     public readonly monomerSymbol: string,
     public readonly monomerIdx: number,
@@ -39,12 +39,16 @@ export class MonomerWrapper {
   public get bondCount() { return this.molfileWrapper.bondCount; }
 
   private convertMolfileToV3KFormat(molfileV2K: string, monomerSymbol: string, rdKitModule: RDModule): string {
+    if (MonomerWrapper.molfileV2KToV3KCache.has(molfileV2K))
+      return MonomerWrapper.molfileV2KToV3KCache.get(molfileV2K)!;
     let mol: RDMol | null = null;
     try {
       mol = rdKitModule.get_mol(molfileV2K, JSON.stringify({mergeQueryHs: true}));
-      if (mol)
-        return mol.get_v3Kmolblock();
-      else
+      if (mol) {
+        const res = mol.get_v3Kmolblock();
+        MonomerWrapper.molfileV2KToV3KCache.set(molfileV2K, res);
+        return res;
+      } else
         throw new Error(`Cannot convert ${monomerSymbol} to molV3000`);
     } finally {
       mol?.delete();