@datagrok/helm 2.1.34 → 2.2.0

package/src/package.ts

@@ -3,6 +3,14 @@ import * as grok from 'datagrok-api/grok';
 import * as ui from 'datagrok-api/ui';
 import * as DG from 'datagrok-api/dg';
 
+// import '@datagrok-libraries/bio/src/types/dojo';
+// import * as dojo from 'DOJO';
+import '@datagrok-libraries/bio/src/types/helm';
+import * as scil from 'scil';
+import * as org from 'org';
+import '@datagrok-libraries/bio/src/types/jsdraw2';
+import * as JSDraw2 from 'JSDraw2';
+
 import $ from 'cash-dom';
 
 import {errorToConsole} from '@datagrok-libraries/utils/src/to-console';
@@ -10,16 +18,19 @@ import {NOTATION} from '@datagrok-libraries/bio/src/utils/macromolecule';
 import {GapOriginals, SeqHandler} from '@datagrok-libraries/bio/src/utils/seq-handler';
 import {IMonomerLib, Monomer} from '@datagrok-libraries/bio/src/types';
 import {IHelmHelper} from '@datagrok-libraries/bio/src/helm/helm-helper';
+import {HelmServiceBase} from '@datagrok-libraries/bio/src/viewers/helm-service';
 
 import {findMonomers, parseHelm} from './utils';
 import {HelmCellRenderer} from './cell-renderer';
 import {HelmHelper} from './helm-helper';
 import {getPropertiesWidget} from './widgets/properties-widget';
-
-let monomerLib: IMonomerLib | null = null;
+import {HelmGridCellRenderer, HelmGridCellRendererBack} from './utils/helm-grid-cell-renderer';
+import {_getHelmService} from './package-utils';
 
 import {WebEditorMonomer, RGROUP_CAP_GROUP_NAME, RGROUP_LABEL, SMILES} from './constants';
 
+let monomerLib: IMonomerLib | null = null;
+
 export const _package = new DG.Package();
 
 function initHelmPatchDojo(): void {
@@ -56,7 +67,8 @@ function initHelmPatchDojo(): void {
 
 //tags: init
 export async function initHelm(): Promise<void> {
-  //@ts-ignore
+  const logPrefix: string = 'Helm: initHelm()';
+  _package.logger.debug(`${logPrefix}, start`);
   org.helm.webeditor.kCaseSensitive = true; // GROK-13880
 
   return Promise.all([
@@ -69,19 +81,22 @@ export async function initHelm(): Promise<void> {
     grok.functions.call('Bio:getBioLib'),
   ])
     .then(([_, lib]: [unknown, IMonomerLib]) => {
+      _package.logger.debug(`${logPrefix}, then(), lib loaded`);
       monomerLib = lib;
       rewriteLibraries(); // initHelm()
       monomerLib.onChanged.subscribe((_) => {
         try {
+          const logPrefixInt = `${logPrefix} monomerLib.onChanged()`;
+          _package.logger.debug(`${logPrefixInt}, start, org,helm.webeditor.Monomers updating`);
           rewriteLibraries(); // initHelm()
 
-          const monTypeList: string[] = monomerLib!.getPolymerTypes();
-          const msgStr: string = 'Monomer lib updated:<br />' + (
-            monTypeList.length == 0 ? 'empty' : monTypeList.map((monType) => {
-              return `${monType} ${monomerLib!.getMonomerSymbolsByType(monType).length}`;
-            }).join('<br />'));
+          const libSummary: string = monomerLib!.getSummary()
+            .replaceAll('\n', '<br />\n')
+            .replaceAll(',', ' ');
+          const libMsg: string = `Monomer lib updated:<br /> ${libSummary}'`;
+          grok.shell.info(libMsg);
 
-          grok.shell.info(msgStr);
+          _package.logger.debug(`${logPrefixInt}, end, org.helm.webeditor.Monomers completed`);
         } catch (err: any) {
           const errMsg = errorToConsole(err);
           console.error('Helm: initHelm monomerLib.onChanged() error:\n' + errMsg);
@@ -104,7 +119,6 @@ export function getMonomerLib(): IMonomerLib {
 
 /** Fills org.helm.webeditor.Monomers dictionary for WebEditor */
 function rewriteLibraries() {
-  // @ts-ignore
   org.helm.webeditor.Monomers.clear();
   monomerLib!.getPolymerTypes().forEach((polymerType) => {
     const monomerSymbols = monomerLib!.getMonomerSymbolsByType(polymerType);
@@ -136,7 +150,6 @@ function rewriteLibraries() {
         isBroken = true;
 
       if (!isBroken) {
-        // @ts-ignore
         org.helm.webeditor.Monomers.addOneMonomer(webEditorMonomer);
       }
     });
@@ -147,13 +160,20 @@ function rewriteLibraries() {
   if (grid) grid.invalidate();
 }
 
+//name: getHelmService
+//output: object result
+export function getHelmService(): HelmServiceBase {
+  return _getHelmService();
+}
+
 //name: helmCellRenderer
 //tags: cellRenderer
 //meta.cellType: helm
 //meta.columnTags: quality=Macromolecule, units=helm
 //output: grid_cell_renderer result
 export function helmCellRenderer(): HelmCellRenderer {
-  return new HelmCellRenderer();
+  // return new HelmCellRenderer(); // old
+  return new HelmGridCellRenderer(); // new
 }
 
 function checkMonomersAndOpenWebEditor(cell: DG.Cell, value?: string, units?: string) {
@@ -166,9 +186,9 @@ function checkMonomersAndOpenWebEditor(cell: DG.Cell, value?: string, units?: st
     grok.shell.warning(`WebEditor doesn't support Helm with gaps '${GapOriginals[NOTATION.HELM]}'.`);
   else {
     grok.shell.warning(
-      `Monomers ${Array.from(missedMonomerSet).map((m) => `'${m}'`).join(', ')} are absent! <br/>` +
-      `Please, upload the monomer library! <br/>` +
-      `<a href="https://datagrok.ai/help/domains/bio/macromolecules" target="_blank">Learn more</a>`);
+      `Monomers ${Array.from(missedMonomerSet).map((m) => `'${m}'`).join(', ')} are not found. <br/>` +
+      `Please specify the monomer library to use. <br/>` +
+      `<a href="https://datagrok.ai/help/datagrok/solutions/domains/bio/#manage-monomer-libraries" target="_blank">Learn more</a>`);
   }
 }
 
@@ -186,7 +206,7 @@ export function editMoleculeCell(cell: DG.GridCell): void {
 //input: string mol { semType: Macromolecule }
 export function openEditor(mol: string): void {
   const df = grok.shell.tv.grid.dataFrame;
-  const col = df.columns.bySemType('Macromolecule')!;
+  const col = df.columns.bySemType('Macromolecule')! as DG.Column<string>;
   const colSh = SeqHandler.forColumn(col);
   const colUnits = col.getTag(DG.TAGS.UNITS);
   if (colUnits === NOTATION.HELM)
@@ -208,13 +228,11 @@ function webEditor(cell: DG.Cell, value?: string, units?: string) {
   const view = ui.div();
   // const df = grok.shell.tv.grid.dataFrame;
   // const col = df.columns.bySemType('Macromolecule')!;
-  const col = cell.column;
+  const col = cell.column as DG.Column<string>;
   const sh = SeqHandler.forColumn(col);
   const rowIdx = cell.rowIndex;
-  // @ts-ignore
   org.helm.webeditor.MolViewer.molscale = 0.8;
-  // @ts-ignore
-  const app = new scil.helm.App(view, {
+  const app = new org.helm.webeditor.App(view, {
     showabout: false,
     mexfontsize: '90%',
     mexrnapinontab: true,
@@ -227,12 +245,9 @@ function webEditor(cell: DG.Cell, value?: string, units?: string) {
   const sizes = app.calculateSizes();
   app.canvas.resize(sizes.rightwidth - 100, sizes.topheight - 210);
   let s = {width: sizes.rightwidth - 100 + 'px', height: sizes.bottomheight + 'px'};
-  //@ts-ignore
   scil.apply(app.sequence.style, s);
-  //@ts-ignore
   scil.apply(app.notation.style, s);
   s = {width: sizes.rightwidth + 'px', height: (sizes.bottomheight + app.toolbarheight) + 'px'};
-  //@ts-ignore
   scil.apply(app.properties.parent.style, s);
   app.structureview.resize(sizes.rightwidth, sizes.bottomheight + app.toolbarheight);
   app.mex.resize(sizes.topheight - 80);
@@ -240,9 +255,8 @@ function webEditor(cell: DG.Cell, value?: string, units?: string) {
     if (!!cell && units === undefined)
       app.canvas.helm.setSequence(cell.value, 'HELM');
     else
-      app.canvas.helm.setSequence(value, 'HELM');
+      app.canvas.helm.setSequence(value!, 'HELM');
   }, 200);
-  //@ts-ignore
   ui.dialog({showHeader: false, showFooter: true})
     .add(view)
     .onOK(() => {
@@ -312,3 +326,39 @@ export function getMolfiles(col: DG.Column): DG.Column {
 export async function getHelmHelper(): Promise<IHelmHelper> {
   return HelmHelper.getInstance();
 }
+
+import {testEvent} from '@datagrok-libraries/utils/src/test';
+import {CellRendererBackAsyncBase} from '@datagrok-libraries/bio/src/utils/cell-renderer-async-base';
+
+//name: measureCellRenderer
+export async function measureCellRenderer(): Promise<void> {
+  const grid = grok.shell.tv.grid;
+  const gridCol = grid.columns.byName('sequence')!;
+  const back = gridCol.temp['rendererBack'] as HelmGridCellRendererBack;
+
+  let etSum: number = 0;
+  let etCount: number = 0;
+  for (let i = 0; i < 20; ++i) {
+    const t1 = window.performance.now();
+    let t2: number;
+    if (!back.cacheEnabled) {
+      await testEvent(back.onRendered, () => {
+        t2 = window.performance.now();
+        _package.logger.info(`measureCellRenderer() cache disabled , ET: ${t2 - t1} ms`);
+      }, () => {
+        back.invalidate(); // grid.invalidate();
+      }, 5000);
+    } else {
+      await testEvent(grid.onAfterDrawContent, () => {
+        t2 = window.performance.now();
+        _package.logger.info(`measureCellRenderer() cache enabled, ET: ${t2! - t1} ms`);
+      }, () => {
+        grid.invalidate();
+      }, 5000);
+    }
+
+    etSum += (t2! - t1);
+    etCount++;
+  }
+  _package.logger.info(`measureCellRenderer(), avg ET: ${etSum / etCount} ms`);
+}

package/src/tests/helm-service-tests.ts

@@ -0,0 +1,97 @@
+import * as grok from 'datagrok-api/grok';
+import * as ui from 'datagrok-api/ui';
+import * as DG from 'datagrok-api/dg';
+
+import {Subject} from 'rxjs';
+
+import {
+  category, expect, test, awaitCheck, delay, testEvent, before, after
+} from '@datagrok-libraries/utils/src/test';
+import {
+  getHelmService, HelmServiceBase, HelmAux, HelmProps
+} from '@datagrok-libraries/bio/src/viewers/helm-service';
+import {RenderTask} from '@datagrok-libraries/bio/src/utils/cell-renderer-async-base';
+
+import {getMonomerLibHelper, IMonomerLibHelper} from '@datagrok-libraries/bio/src/monomer-works/monomer-utils';
+import {UserLibSettings} from '@datagrok-libraries/bio/src/monomer-works/types';
+import {
+  getUserLibSettings, setUserLibSettings, setUserLibSettingsForTests
+} from '@datagrok-libraries/bio/src/monomer-works/lib-settings';
+
+import {_package} from '../package-test';
+
+category('HelmService', () => {
+  let monomerLibHelper: IMonomerLibHelper;
+  /** Backup actual user's monomer libraries settings */
+  let userLibSettings: UserLibSettings;
+
+  let helmSvc: HelmServiceBase;
+
+  before(async () => {
+    const logPrefix = `Helm: tests: HelmService: before`;
+    _package.logger.debug(`${logPrefix}, start`);
+    try {
+      monomerLibHelper = await getMonomerLibHelper();
+      userLibSettings = await getUserLibSettings();
+
+      await delay(1000); // for loading monomer libraries files
+      // Test 'helm' requires default monomer library loaded
+      await setUserLibSettingsForTests();
+      await monomerLibHelper.loadLibraries(true); // load default libraries
+      const libSummary = monomerLibHelper.getBioLib().getSummary();
+
+      helmSvc = await getHelmService();
+      await helmSvc.reset();
+
+      _package.logger.debug(`${logPrefix}, end`);
+    } finally {
+      _package.logger.debug(`${logPrefix}, fina`);
+    }
+  });
+
+  after(async () => {
+    const logPrefix = `Helm: tests: HelmService: after`;
+    _package.logger.debug(`${logPrefix}, start`);
+
+    await helmSvc.reset();
+
+    await setUserLibSettings(userLibSettings);
+    await monomerLibHelper.loadLibraries(true); // load user settings libraries
+    _package.logger.debug(`${logPrefix}, end`);
+  });
+
+  test('helm', async () => {
+    const logPrefix: string = `Helm: tests: HelmService: helm`;
+    _package.logger.debug(`${logPrefix}, start`);
+    const helmStr: string = 'PEPTIDE1{I.H.A.N.T.Thr_PO3H2.Aca.D-Tyr_Et}$$$$';
+    let consumerId: number | null = null;
+    let taskAux: HelmAux | null = null;
+    const event = new Subject<void>();
+    await testEvent(event,
+      () => {
+      },
+      () => {
+        const task: RenderTask<HelmProps, HelmAux> = {
+          name: 'test1',
+          props: {
+            helm: helmStr,
+            backColor: DG.Color.fromHtml('#FFFFFF'),
+            width: 300, height: 100,
+          },
+          onAfterRender: (canvas: HTMLCanvasElement, aux: HelmAux) => {
+            taskAux = aux;
+            event.next();
+          }
+        };
+        helmSvc.reset();
+        consumerId = helmSvc.render(consumerId, task, 0);
+      }, 7000);
+    expect(taskAux !== null, true, 'Helm task aux is null');
+    expect(taskAux!.mol.atoms.length > 0, true, 'Polymer mol atoms empty');
+    expect(taskAux!.mol.atoms.length, 8);
+    expect(taskAux!.mol.bonds.length, 7);
+    expect(helmSvc.errorCount, 0, 'There was errors in NglGlService.');
+    expect(consumerId !== null, true, 'consumerId not assigned');
+    _package.logger.debug(`${logPrefix}, end`);
+  }, {timeout: 10000});
+});

package/src/tests/properties-widget-tests.ts

@@ -5,7 +5,9 @@ import * as grok from 'datagrok-api/grok';
 import {after, before, category, expect, expectObject, test} from '@datagrok-libraries/utils/src/test';
 import {ALPHABET, NOTATION, TAGS as bioTAGS} from '@datagrok-libraries/bio/src/utils/macromolecule';
 import {SeqHandler} from '@datagrok-libraries/bio/src/utils/seq-handler';
-import {getUserLibSettings, setUserLibSettings, setUserLibSettingsForTests} from '@datagrok-libraries/bio/src/monomer-works/lib-settings';
+import {
+  getUserLibSettings, setUserLibSettings, setUserLibSettingsForTests
+} from '@datagrok-libraries/bio/src/monomer-works/lib-settings';
 import {getMonomerLibHelper, IMonomerLibHelper} from '@datagrok-libraries/bio/src/monomer-works/monomer-utils';
 
 import {getPropertiesDict} from '../widgets/properties-widget';
@@ -88,7 +90,7 @@ category('properties-widget', () => {
 function testPropertiesDict(
   seq: string, units: NOTATION, separator: string | undefined, alphabet: ALPHABET | undefined, expPropDict: {}
 ) {
-  const col = DG.Column.fromList(DG.COLUMN_TYPE.STRING, 'seq', [seq]);
+  const col = DG.Column.fromStrings('seq', [seq]) as DG.Column<string>;
   col.semType = DG.SEMTYPE.MACROMOLECULE;
   col.setTag(DG.TAGS.UNITS, units);
   if (separator) col.setTag(bioTAGS.separator, separator);

package/src/tests/renderers-tests.ts

@@ -3,33 +3,108 @@ import * as ui from 'datagrok-api/ui';
 import * as DG from 'datagrok-api/dg';
 
 import $ from 'cash-dom';
+import {fromEvent} from 'rxjs';
 
-import {category, expect, test, awaitCheck, delay} from '@datagrok-libraries/utils/src/test';
+import {
+  after, before, category, test, expect, awaitCheck, delay, testEvent
+} from '@datagrok-libraries/utils/src/test';
 import {NOTATION} from '@datagrok-libraries/bio/src/utils/macromolecule';
+import {getMonomerLibHelper, IMonomerLibHelper} from '@datagrok-libraries/bio/src/monomer-works/monomer-utils';
+import {UserLibSettings} from '@datagrok-libraries/bio/src/monomer-works/types';
+import {
+  getUserLibSettings, setUserLibSettings, setUserLibSettingsForTests
+} from '@datagrok-libraries/bio/src/monomer-works/lib-settings';
+
+import {awaitGrid} from './utils';
 import {TAGS as helmTAGS} from '../constants';
 
+import {_package} from '../package-test';
+
 category('renderers', () => {
+  let monomerLibHelper: IMonomerLibHelper;
+  /** Backup actual user's monomer libraries settings */
+  let userLibSettings: UserLibSettings;
+
+  before(async () => {
+    monomerLibHelper = await getMonomerLibHelper();
+    userLibSettings = await getUserLibSettings();
+
+    // Test 'helm' requires default monomer library loaded
+    await setUserLibSettingsForTests();
+    await monomerLibHelper.loadLibraries(true); // load default libraries
+  });
+
+  after(async () => {
+    // UserDataStorage.put() replaces existing data
+    await setUserLibSettings(userLibSettings);
+    await monomerLibHelper.loadLibraries(true); // load user settings libraries
+  });
+
+
   test('missedInLib', async () => { await _testMissedInLib(); });
-});
 
-async function _testMissedInLib() {
-  const df: DG.DataFrame = await grok.dapi.files.readCsv('System:AppData/Helm/tests/sample_HELM-missedInLib.csv');
-  const helmCol: DG.Column<string> = df.getCol('HELM');
-
-  const tv: DG.TableView = grok.shell.addTableView(df);
-  await awaitCheck(() => {
-    return $(tv.root).find('.d4-grid canvas').length > 0;
-  }, 'Table view canvas not found', 100);
-
-  expect(helmCol.semType, DG.SEMTYPE.MACROMOLECULE);
-  expect(helmCol.getTag(DG.TAGS.UNITS), NOTATION.HELM);
-  expect(helmCol.getTag(DG.TAGS.CELL_RENDERER), 'helm');
-
-  const cellRendererErrorJson: string = helmCol.getTag(helmTAGS.cellRendererRenderError);
-  if (!!cellRendererErrorJson) {
-    const cellRendererError: any = JSON.parse(cellRendererErrorJson);
-    const err = new Error(cellRendererError['message']);
-    err.stack = cellRendererError['stack'];
-    throw err;
+  test('scatterPlotTooltip', async () => { await _testScatterPlotTooltip(); });
+
+  async function _testMissedInLib() {
+    const df: DG.DataFrame = await grok.dapi.files.readCsv('System:AppData/Helm/tests/sample_HELM-missedInLib.csv');
+    const helmCol: DG.Column<string> = df.getCol('HELM');
+
+    const tv: DG.TableView = grok.shell.addTableView(df);
+    await awaitCheck(() => {
+      return $(tv.root).find('.d4-grid canvas').length > 0;
+    }, 'Table view canvas not found', 100);
+
+    expect(helmCol.semType, DG.SEMTYPE.MACROMOLECULE);
+    expect(helmCol.getTag(DG.TAGS.UNITS), NOTATION.HELM);
+    expect(helmCol.getTag(DG.TAGS.CELL_RENDERER), 'helm');
+
+    const cellRendererErrorJson: string = helmCol.getTag(helmTAGS.cellRendererRenderError);
+    if (!!cellRendererErrorJson) {
+      const cellRendererError: any = JSON.parse(cellRendererErrorJson);
+      const err = new Error(cellRendererError['message']);
+      err.stack = cellRendererError['stack'];
+      throw err;
+    }
+  }
+
+  const helmCoordsCsv = `seq,x,y
+PEPTIDE1{I.H.A.N.T.Thr_PO3H2.Aca.D-Tyr_Et}$$$$,0,0
+RNA1{r(A)p.r(C)p.r(G)p.r(U)p}$$$$,1,0
+RNA1{d(A)p.d(C)p.d(G)p.d(U)p}|PEPTIDE1{I.H.A.N.T.Thr_PO3H2}$$$$,0,1
+`;
+
+  async function _testScatterPlotTooltip(): Promise<void> {
+    const df = DG.DataFrame.fromCsv(helmCoordsCsv);
+    df.currentRowIdx = 0;
+    const view = grok.shell.addTableView(df);
+    const sp: DG.ScatterPlotViewer = df.plot.scatter({x: 'x', y: 'y'});
+    view.dockManager.dock(sp, DG.DOCK_TYPE.RIGHT, null);
+    await Promise.all([
+      testEvent(sp.onAfterDrawScene, () => {}, () => { sp.invalidateCanvas(); }, 1000),
+      awaitGrid(view.grid, 500)
+    ]);
+
+    const spBcr = sp.root.getBoundingClientRect();
+    const wp = sp.worldToScreen(1, 0);
+    const ev = new MouseEvent('mousemove', {
+      cancelable: true, bubbles: true, view: window, button: 0,
+      clientX: spBcr.left + wp.x, clientY: spBcr.top + wp.y
+    });
+    const spCanvas = $(sp.root).find('canvas').get()[0] as HTMLCanvasElement;
+    await testEvent(fromEvent(spCanvas, 'mousemove'), () => {
+      _package.logger.debug(`Test: event, currentRowIdx=${df.currentRowIdx}`);
+      expect($(ui.tooltip.root).find('div table.d4-row-tooltip-table tr td canvas').length, 1);
+      expect(sp.hitTest(wp.x, wp.y), 1);
+    }, () => {
+      spCanvas.dispatchEvent(ev);
+    }, 500);
+    // TODO: Any error occurred become 'Cannot read properties of null (reading 'get$columns')' because of scatter plot
+    //await testEvent(sp.onAfterDrawScene, () => {}, () => { sp.invalidateCanvas(); }, 200);
+    await awaitGrid(view.grid, 500);
   }
-}
+});
+
+
+
+
+

package/src/types/dojo.ts

@@ -0,0 +1,3 @@
+declare module 'dojo' {
+  export function ready(callback: () => void): void;
+}

package/src/utils/dummy-monomer.ts

@@ -0,0 +1,69 @@
+import * as grok from 'datagrok-api/grok';
+import * as ui from 'datagrok-api/ui';
+import * as DG from 'datagrok-api/dg';
+import {_package} from '../package';
+
+/* eslint-disable camelcase */
+export class DummyWebEditorMonomer {
+  public readonly backgroundcolor: string = '#FF4444';
+  public readonly linecolor: string = '#800000';
+  public readonly textcolor: string = '#FFFFFF';
+
+  // no effect
+  // public readonly na: string = 'NA';
+  // public readonly nature: string = 'NA';
+
+  /** R-Group index os single digit only is allowed in Pistoia code */
+  public readonly at: { [rg: string]: string } = {
+    R1: 'H', R2: 'H', R3: 'H', R4: 'H', R5: 'H', R6: 'H', R7: 'H', R8: 'H', R9: 'H'
+  };
+
+  constructor(
+    public readonly biotype: string,
+    /** symbol, elem */ public readonly id: string,
+    /** name */ public readonly n: string = 'missing',
+    /** molfile*/ public readonly m?: string,
+  ) {
+    if (!this.id)
+      throw new Error('Not supported undefined [id].');
+
+    return new Proxy(this, {
+      get: (target: any, prop: string | symbol, _receiver: any) => {
+        const logPrefix = `${this.toLog()}.proxy.get( '${String(prop)}' )`;
+        switch (prop) {
+        case 'id':
+        case 'at':
+        case 'na':
+        case 'nature':
+        case 'backgroundcolor':
+        case 'linecolor':
+        case 'textcolor': {
+          // these attributes are known and handled
+          return target[prop];
+        }
+        case 'rs': {
+          /* R-Group count (?), 2 is default for monomer "?" */
+          throw new Error('Not supported get "rs" attribute.');
+        }
+        default:
+          // Unexpected attribute requested
+          _package.logger.warning(`${logPrefix}`);
+          return target[prop];
+        }
+      },
+      set: (target, prop, value: any, _receiver: any): boolean => {
+        throw new Error(`Not supported set '${String(prop)}' attribute, any.`);
+      },
+      apply: (target: any, thisArg: any, argArray: any[]): any | undefined => {
+        throw new Error(`Not supported call (apply) '${thisArg.toString()}' method, any.`);
+      }
+    });
+  }
+
+  private static objCounter: number = -1;
+  private readonly objId: number = ++DummyWebEditorMonomer.objCounter;
+
+  protected toLog(): string {
+    return `Helm: DummyWebEditorMonomer<${this.objId}>`;
+  }
+}

package/src/utils/get-hovered.ts

@@ -0,0 +1,115 @@
+import * as grok from 'datagrok-api/grok';
+import * as DG from 'datagrok-api/dg';
+import * as ui from 'datagrok-api/ui';
+
+import * as org from 'org';
+import * as JSDraw2 from 'JSDraw2';
+
+import {IMonomerLib} from '@datagrok-libraries/bio/src/types/index';
+
+import {HelmMonomerPlacer, ISeqMonomer} from '../helm-monomer-placer';
+
+export function getHoveredMonomerFromEditorMol(
+  argsX: number, argsY: number, gridCell: DG.GridCell, mol: JSDraw2.IEditorMol
+): ISeqMonomer | null {
+  let hoveredSeqMonomer: ISeqMonomer | null = null;
+
+  /** @return {[number, number]} [atom, distance] */
+  function getNearest(excluded: (number | undefined)[]): [number | undefined, number | undefined] {
+    let atom: number | undefined = undefined;
+    let distance: number | undefined = undefined;
+    for (let atomI = 0; atomI < mol.atoms.length; ++atomI) {
+      if (!excluded.includes(atomI)) {
+        const aX: number = mol.atoms[atomI].p.x;
+        const aY: number = mol.atoms[atomI].p.y;
+        const distanceToAtomI: number = Math.sqrt((argsX - aX) ** 2 + (argsY - aY) ** 2);
+        if (distance === undefined || distance > distanceToAtomI) {
+          atom = atomI;
+          distance = distanceToAtomI;
+        }
+      }
+    }
+    return [atom, distance];
+  }
+
+  const [firstAtomI, firstDistance] = getNearest([]);
+  const [secondAtomI, secondDistance] = getNearest([firstAtomI]);
+
+  if (firstAtomI !== undefined && firstDistance !== undefined) {
+    const firstAtom = mol.atoms[firstAtomI];
+    const firstSeqMonomer = getSeqMonomerFromHelmAtom(firstAtom);
+    if (secondAtomI !== undefined && secondDistance !== undefined) {
+      if (firstDistance < secondDistance * 0.45)
+        hoveredSeqMonomer = firstSeqMonomer;
+    } else {
+      if (firstDistance < 0.35 * gridCell.bounds.height)
+        hoveredSeqMonomer = firstSeqMonomer;
+    }
+  }
+  return hoveredSeqMonomer;
+}
+
+export function getHoveredMonomerFallback(
+  argsX: number, _argsY: number, gridCell: DG.GridCell, helmPlacer: HelmMonomerPlacer
+): ISeqMonomer | null {
+  let hoveredSeqMonomer: ISeqMonomer | null = null;
+  const [allParts, lengths, sumLengths] = helmPlacer.getCellAllPartsLengths(gridCell.tableRowIndex!);
+  const maxIndex = Object.values(lengths).length - 1;
+  let left = 0;
+  let right = maxIndex;
+  let found = false;
+  let iterCount: number = 0;
+
+  let mid = 0;
+  if (argsX > sumLengths[0]) {
+    while (!found && iterCount < sumLengths.length) {
+      mid = Math.floor((right + left) / 2);
+      if (argsX >= sumLengths[mid] && argsX <= sumLengths[mid + 1]) {
+        left = mid;
+        found = true;
+      } else if (argsX < sumLengths[mid])
+        right = mid - 1;
+      else if (argsX > sumLengths[mid + 1])
+        left = mid + 1;
+
+      if (left == right)
+        found = true;
+
+      iterCount++;
+    }
+  }
+  left = (argsX >= sumLengths[left]) ? left : left - 1; // correct left to between sumLengths
+  if (left >= 0)
+    hoveredSeqMonomer = getSeqMonomerFromHelm(allParts[0], allParts[left], helmPlacer.monomerLib);
+  return hoveredSeqMonomer;
+}
+
+function getSeqMonomerFromHelmAtom(atom: JSDraw2.IEditorMolAtom): ISeqMonomer {
+  let polymerType: string | undefined = undefined;
+  switch (atom.bio.type) {
+  case 'HELM_BASE':
+  case 'HELM_SUGAR': // r - ribose, d - deoxyribose
+  case 'HELM_LINKER': // p - phosphate
+    polymerType = 'RNA';
+    break;
+  case 'HELM_AA':
+    polymerType = 'PEPTIDE';
+    break;
+  default:
+    polymerType = 'PEPTIDE';
+  }
+  return {symbol: atom.elem, polymerType: polymerType};
+}
+
+function getSeqMonomerFromHelm(
+  helmPrefix: string, symbol: string, monomerLib: IMonomerLib
+): ISeqMonomer {
+  let resSeqMonomer: ISeqMonomer | undefined = undefined;
+  for (const polymerType of monomerLib.getPolymerTypes()) {
+    if (helmPrefix.startsWith(polymerType))
+      resSeqMonomer = {symbol: symbol, polymerType: polymerType};
+  }
+  if (!resSeqMonomer)
+    throw new Error(`Monomer not found for symbol = '${symbol}' and helmPrefix = '${helmPrefix}'.`);
+  return resSeqMonomer;
+}