@datagrok/bio 2.15.7 → 2.15.9

package/src/utils/monomer-cell-renderer.ts

@@ -1,15 +1,15 @@
-import * as grok from 'datagrok-api/grok';
 import * as DG from 'datagrok-api/dg';
+import {GridCell} from 'datagrok-api/dg';
 import * as ui from 'datagrok-api/ui';
-
-import {PolymerType} from '@datagrok-libraries/bio/src/helm/types';
-import {ALPHABET, getPaletteByType, monomerToShort} from '@datagrok-libraries/bio/src/utils/macromolecule';
-import {TAGS as bioTAGS, } from '@datagrok-libraries/bio/src/utils/macromolecule/consts';
+import {ALPHABET, monomerToShort} from '@datagrok-libraries/bio/src/utils/macromolecule';
+import {GAP_SYMBOL, TAGS as bioTAGS,} from '@datagrok-libraries/bio/src/utils/macromolecule/consts';
 import {MONOMER_RENDERER_TAGS} from '@datagrok-libraries/bio/src/utils/cell-renderer';
-import {MonomerWorks} from '@datagrok-libraries/bio/src/monomer-works/monomer-works';
+import {getGridCellColTemp} from '@datagrok-libraries/bio/src/utils/cell-renderer-back-base';
 
+import {CellRendererWithMonomerLibBackBase} from './monomer-cell-renderer-base';
 import * as C from './constants';
-import {getMonomerLib} from '../package';
+import {undefinedColor} from '@datagrok-libraries/bio/src/utils/cell-renderer-monomer-placer';
+import {HelmTypes} from '@datagrok-libraries/js-draw-lite/src/types/org';
 
 const Tags = new class {
   tooltipHandlerTemp = 'tooltip-handler.Monomer';
@@ -17,17 +17,50 @@ const Tags = new class {
 
 const svgMolOptions = {autoCrop: true, autoCropMargin: 0, suppressChiralText: true};
 
-export class MonomerTooltipHandler {
-  private readonly gridCol: DG.GridColumn;
+export class MonomerCellRendererBack extends CellRendererWithMonomerLibBackBase {
+  constructor(gridCol: DG.GridColumn | null, tableCol: DG.Column) {
+    super(gridCol, tableCol);
+  }
 
-  constructor(gridCol: DG.GridColumn) {
-    this.gridCol = gridCol;
-    this.gridCol.grid.onCellTooltip(this.onCellTooltip.bind(this));
+  render(g: CanvasRenderingContext2D,
+    x: number, y: number, w: number, h: number, gridCell: DG.GridCell, cellStyle: DG.GridCellStyle
+  ): void {
+    g.save();
+    try {
+      if (gridCell.gridRow < 0) return;
+      const applyToBackground = gridCell.cell?.column && gridCell.cell.column.getTag(MONOMER_RENDERER_TAGS.applyToBackground) === 'true';
+
+      g.font = `12px monospace`;
+      g.textBaseline = 'middle';
+      g.textAlign = 'center';
+
+      const symbol: string = gridCell.cell.value;
+      if (!symbol || symbol == GAP_SYMBOL) return;
+
+      let color = undefinedColor;
+      if (this.monomerLib) {
+        const alphabet = this.tableCol.getTag(bioTAGS.alphabet);
+        const biotype = alphabet === ALPHABET.RNA || alphabet === ALPHABET.DNA ? HelmTypes.NUCLEOTIDE : HelmTypes.AA;
+        color = this.monomerLib.getMonomerTextColor(biotype, symbol);
+      }
+
+      //cell width of monomer should dictate how many characters can be displayed
+      // for width 40, 6 characters can be displayed (0.15 is 6 / 40)
+      const maxChars = Math.max(2, Math.floor(w * 0.15));
+      g.fillStyle = color;
+      if (applyToBackground) {
+        g.fillRect(x, y, w, h);
+        g.fillStyle = DG.Color.toHtml(DG.Color.getContrastColor(DG.Color.fromHtml(color)));
+      }
+      g.fillText(monomerToShort(symbol, maxChars), x + (w / 2), y + (h / 2), w);
+    } finally {
+      g.restore();
+    }
   }
 
-  private onCellTooltip(gridCell: DG.GridCell, x: number, y: number): any {
+  override onMouseMove(gridCell: GridCell, e: MouseEvent) {
     if (
-      gridCell.grid.dart != this.gridCol.grid.dart || gridCell.gridColumn.dart != this.gridCol.dart ||
+      gridCell.grid.dart != this.gridCol?.grid.dart || gridCell.gridColumn.dart != this.gridCol?.dart ||
       !gridCell.tableColumn || !gridCell.isTableCell
     ) return false;
 
@@ -37,32 +70,33 @@ export class MonomerTooltipHandler {
     const x1 = gridCell.bounds.right + canvasClientRect.left - 4;
     const y1 = gridCell.bounds.bottom + canvasClientRect.top - 4;
 
-    const monomerLib = getMonomerLib();
-    if (!monomerLib) {
-      ui.tooltip.show(ui.divText('Monomer library is not available.'), x1, y1);
+    if (monomerName == GAP_SYMBOL) {
+      ui.tooltip.show(ui.divText('gap'), x1, y1);
       return true;
     }
 
-    const mw = new MonomerWorks(monomerLib);
-    const polymerType: PolymerType = (alphabet === ALPHABET.DNA || alphabet === ALPHABET.RNA) ? 'RNA' :
-      alphabet === ALPHABET.PT ? 'PEPTIDE' : 'PEPTIDE';
-    // const biotype: HelmType = [ALPHABET.RNA, ALPHABET.DNA].includes(alphabet) ? HelmTypes.NUCLEOTIDE :
-    //   [ALPHABET.PT].includes(alphabet) ? HelmTypes.AA : HelmTypes.AA;
-
-    const monomerMol: string | null = mw.getCappedRotatedMonomer(polymerType, monomerName);
-    const nameDiv = ui.div(monomerName);
-    const molDiv = !monomerMol ? null :
-      grok.chem.svgMol(monomerMol, undefined, undefined, svgMolOptions);
+    if (!this.monomerLib) {
+      ui.tooltip.show(ui.divText('Monomer library is not available.'), x1, y1);
+      return true;
+    }
 
-    ui.tooltip.show(ui.divV([nameDiv, ...(molDiv ? [molDiv] : [])]), x1, y1);
+    const biotype = alphabet === ALPHABET.RNA || alphabet === ALPHABET.DNA ? HelmTypes.NUCLEOTIDE : HelmTypes.AA;
+    const tooltipEl = this.monomerLib.getTooltip(biotype, monomerName);
+    ui.tooltip.show(tooltipEl, x1, y1);
 
     return true; // To prevent default tooltip behaviour
   }
 
-  public static getOrCreate(gridCol: DG.GridColumn): MonomerTooltipHandler {
-    let res = gridCol.temp[Tags.tooltipHandlerTemp];
-    if (!res)
-      res = gridCol.temp[Tags.tooltipHandlerTemp] = new MonomerTooltipHandler(gridCol);
+  override async awaitRendered(timeout: number = 10000, reason: string = `${timeout} timeout`): Promise<void> {
+    return Promise.resolve();
+  }
+
+  static getOrCreate(gridCell: DG.GridCell): MonomerCellRendererBack {
+    const [gridCol, tableCol, temp] =
+      getGridCellColTemp<string, MonomerCellRendererBack>(gridCell);
+
+    let res: MonomerCellRendererBack = temp.rendererBack;
+    if (!res) res = temp.rendererBack = new MonomerCellRendererBack(gridCol, tableCol);
     return res;
   }
 }
@@ -91,27 +125,12 @@ export class MonomerCellRenderer extends DG.GridCellRenderer {
     g: CanvasRenderingContext2D, x: number, y: number, w: number, h: number, gridCell: DG.GridCell,
     _cellStyle: DG.GridCellStyle
   ): void {
-    if (gridCell.gridRow < 0) return;
-    MonomerTooltipHandler.getOrCreate(gridCell.gridColumn);
-    const applyToBackground = gridCell.cell?.column && gridCell.cell.column.getTag(MONOMER_RENDERER_TAGS.applyToBackground) === 'true';
-
-    g.font = `12px monospace`;
-    g.textBaseline = 'middle';
-    g.textAlign = 'center';
-
-    const palette = getPaletteByType(gridCell.cell.column.getTag(bioTAGS.alphabet));
-    const s: string = gridCell.cell.value;
-    if (!s)
-      return;
-    const color = palette.get(s);
-    //cell width of monomer should dictate how many characters can be displayed
-    // for width 40, 6 characters can be displayed (0.15 is 6 / 40)
-    const maxChars = Math.max(2, Math.floor(w * 0.15));
-    g.fillStyle = color;
-    if (applyToBackground) {
-      g.fillRect(x, y, w, h);
-      g.fillStyle = DG.Color.toHtml(DG.Color.getContrastColor(DG.Color.fromHtml(color)));
-    }
-    g.fillText(monomerToShort(s, maxChars), x + (w / 2), y + (h / 2), w);
+    const back = MonomerCellRendererBack.getOrCreate(gridCell);
+    back.render(g, x, y, w, h, gridCell, _cellStyle);
+  }
+
+  onMouseMove(gridCell: GridCell, e: MouseEvent) {
+    const back = MonomerCellRendererBack.getOrCreate(gridCell);
+    back.onMouseMove(gridCell, e);
   }
 }

package/src/utils/monomer-lib/lib-manager.ts

@@ -95,7 +95,7 @@ export class MonomerLibManager implements IMonomerLibHelper {
   }
 
   assignDuplicatePreferances(settings: UserLibSettings) {
-    this._monomerLib.assignDuplicatePreferances(settings);
+    this._monomerLib.assignDuplicatePreferences(settings);
   }
 
   /** Instance promise of {@link getFileManager} */

package/src/utils/monomer-lib/monomer-colors.ts

@@ -7,19 +7,21 @@ import {HelmType} from '@datagrok-libraries/bio/src/helm/types';
  */
 export const naturalMonomerColors = {
   [HelmTypes.BASE]: {
-    A: "#A0A0FF",
-    G: "#FF7070",
-    T: "#A0FFA0",
-    C: "#FF8C4B",
-    U: "#FF8080"
+    // Chromatogram palette  // HELMWebEditor monomerColors
+    A: "green",              // "#A0A0FF",
+    G: "black",              // "#FF7070",
+    T: "red",                // "#A0FFA0",
+    C: "blue",               // "#FF8C4B",
+    U: "red",                // "#FF8080"
   },
 
   [HelmTypes.NUCLEOTIDE]: {
-    A: "#A0A0FF",
-    G: "#FF7070",
-    T: "#A0FFA0",
-    C: "#FF8C4B",
-    U: "#FF8080"
+    // Chromatogram palette  // HELMWebEditor monomerColors
+    A: "green",              // "#A0A0FF",
+    G: "black",              // "#FF7070",
+    T: "red",                // "#A0FFA0",
+    C: "blue",               // "#FF8C4B",
+    U: "red",                // "#FF8080"
   },
 
   [HelmTypes.LINKER]: {
@@ -34,26 +36,27 @@ export const naturalMonomerColors = {
   },
 
   [HelmTypes.AA]: {
-    A: "#C8C8C8",
-    R: "#145AFF",
-    N: "#00DCDC",
-    D: "#E60A0A",
-    C: "#E6E600",
-    E: "#00DCDC",
-    Q: "#E60A0A",
-    G: "#EBEBEB",
-    H: "#8282D2",
-    I: "#0F820F",
-    L: "#0F820F",
-    K: "#145AFF",
-    M: "#E6E600",
-    F: "#3232AA",
-    P: "#DC9682",
-    S: "#FA9600",
-    T: "#FA9600",
-    W: "#B45AB4",
-    Y: "#3232AA",
-    V: "#0F820F"
+    // GrokGroups palette    // HELMWebEditor monomerColors
+    A: "rgb(44,160,44)",     // "#C8C8C8",
+    R: "rgb(23,190,207)",    // "#145AFF",
+    N: "rgb(235,137,70)",    // "#00DCDC",
+    D: "rgb(31,119,180)",    // "#E60A0A",
+    C: "rgb(188,189,34)",    // "#E6E600",
+    E: "rgb(31, 120, 150)",  // "#00DCDC",
+    Q: "rgb(205, 111, 71)",  // "#E60A0A",
+    G: "rgb(214,39,40)",     // "#EBEBEB",
+    H: "rgb(158,218,229)",   // "#8282D2",
+    I: "rgb(23,103,57)",     // "#0F820F",
+    L: "rgb(30,110,96)",     // "#0F820F",
+    K: "rgb(108, 218, 229)", //"#145AFF",
+    M: "rgb(60,131,95)",     // "#E6E600",
+    F: "rgb(24,110,79)",     // "#3232AA",
+    P: "rgb(255,152,150)",   // "#DC9682",
+    S: "rgb(255,187,120)",   // "#FA9600",
+    T: "rgb(245,167,100)",   // "#FA9600",
+    W: "rgb(182, 223, 138)", // "#B45AB4",
+    Y: "rgb(152,223,138)",   // "#3232AA",
+    V: "rgb(74,160,74)",     // "#0F820F",
   },
 
   [HelmTypes.CHEM]: {

package/src/utils/monomer-lib/monomer-lib-base.ts

@@ -3,20 +3,23 @@ import * as ui from 'datagrok-api/ui';
 import * as DG from 'datagrok-api/dg';
 
 import wu from 'wu';
+import {Observable, Subject} from 'rxjs';
 
 import {IMonomerLibBase, Monomer, RGroup} from '@datagrok-libraries/bio/src/types/index';
-import {HelmAtom, HelmType, IWebEditorMonomer, MonomerType, PolymerType} from '@datagrok-libraries/bio/src/helm/types';
+import {HelmAtom, HelmType, IMonomerColors, IWebEditorMonomer, MonomerType, PolymerType} from '@datagrok-libraries/bio/src/helm/types';
 import {getMonomerHandleArgs} from '@datagrok-libraries/bio/src/helm/helm-helper';
 import {helmTypeToPolymerType} from '@datagrok-libraries/bio/src/monomer-works/monomer-works';
 import {HelmTypes, PolymerTypes} from '@datagrok-libraries/bio/src/helm/consts';
-import {HELM_REQUIRED_FIELD as REQ, HELM_RGROUP_FIELDS as RGP} from '@datagrok-libraries/bio/src/utils/const';
-import {GapOriginals, NOTATION} from '@datagrok-libraries/bio/src/utils/macromolecule/consts';
+import {HELM_OPTIONAL_FIELDS as OPT, HELM_REQUIRED_FIELD as REQ, HELM_RGROUP_FIELDS as RGP} from '@datagrok-libraries/bio/src/utils/const';
+import {GAP_SYMBOL, GapOriginals, NOTATION} from '@datagrok-libraries/bio/src/utils/macromolecule/consts';
+import {Vector} from '@datagrok-libraries/utils/src/type-declarations';
+import {vectorAdd, vectorDotProduct, vectorLength} from '@datagrok-libraries/utils/src/vector-operations';
 
 import {AmbiguousWebEditorMonomer, GapWebEditorMonomer, MissingWebEditorMonomer} from './web-editor-monomer-dummy';
 import {LibraryWebEditorMonomer} from './web-editor-monomer-of-library';
+import {naturalMonomerColors} from './monomer-colors';
 
 import {_package} from '../../package';
-import {Observable, Subject} from 'rxjs';
 
 const monomerRe = /[\w()]+/;
 //** Do not mess with monomer symbol with parenthesis enclosed in square brackets */
@@ -24,14 +27,25 @@ const ambMonomerRe = RegExp(String.raw`\(${monomerRe}(,${monomerRe})+\)`);
 
 export type MonomerLibDataType = { [polymerType: string]: { [monomerSymbol: string]: Monomer } };
 
+const whiteColorV = new Vector([255.0, 255.0, 255.0]);
+const blackColorV = new Vector([0.0, 0.0, 0.0]);
+const maxTextColorVLen = vectorLength(whiteColorV) * 0.7;
+
 export class MonomerLibBase implements IMonomerLibBase {
+  protected _isEmpty: boolean;
+  get isEmpty(): boolean { return this._isEmpty; }
+
   protected _onChanged = new Subject<any>();
 
   get onChanged(): Observable<any> { return this._onChanged; }
 
+
   constructor(
     protected _monomers: MonomerLibDataType,
-  ) {}
+  ) {
+    this._isEmpty = !this._monomers || Object.keys(this._monomers).length === 0 ||
+      Object.entries(this._monomers).every(([_, ptMonomers]) => Object.keys(ptMonomers).length === 0);
+  }
 
   /** Creates missing {@link Monomer} */
   addMissingMonomer(polymerType: PolymerType, monomerSymbol: string): Monomer {
@@ -40,7 +54,7 @@ export class MonomerLibBase implements IMonomerLibBase {
       mSet = this._monomers[polymerType] = {};
 
     let monomerName: string = monomerSymbol;
-    if (monomerSymbol === GapOriginals[NOTATION.HELM])
+    if (monomerSymbol == GAP_SYMBOL || monomerSymbol === GapOriginals[NOTATION.HELM] /* usage from HELMWebEditor */)
       monomerName = 'Gap';
     else if (polymerType === PolymerTypes.PEPTIDE && monomerSymbol === 'X')
       monomerName = 'Any';
@@ -120,23 +134,147 @@ export class MonomerLibBase implements IMonomerLibBase {
     /** Get or create {@link org,helm.WebEditorMonomer} */
     let resWem: IWebEditorMonomer | null = m.wem ?? null;
     if (!resWem) {
-      if (elem === '*')
-        resWem = m.wem = new GapWebEditorMonomer(biotype, elem);
+      if (elem === GAP_SYMBOL || elem == '*' /* usage from HELMWebEditor */)
+        resWem = m.wem = new GapWebEditorMonomer(biotype);
       else if (
-        (biotype === 'HELM_NUCLETIDE' && elem === 'N') ||
-        (biotype === 'HELM_AA' && elem === 'X') ||
-        (biotype === 'HELM_CHEM' && false) || // TODO: Ambiguous monomer for CHEM
+        (biotype === HelmTypes.NUCLEOTIDE && elem === 'N') ||
+        (biotype === HelmTypes.AA && elem === 'X') ||
+        (biotype === HelmTypes.CHEM && false) || // TODO: Ambiguous monomer for CHEM
         ambMonomerRe.test(elem) // e.g. (A,R,_)
       )
         resWem = m.wem = new AmbiguousWebEditorMonomer(biotype, elem);
       else if (!m.lib)
-        resWem = m.wem = new MissingWebEditorMonomer(biotype, elem);
+        resWem = m.wem = new MissingWebEditorMonomer(biotype, elem, this.isEmpty);
 
       if (!resWem)
         resWem = m.wem = LibraryWebEditorMonomer.fromMonomer(biotype, m, this);
     }
 
-    return resWem!;
+    return resWem;
+  }
+
+  getTooltip(biotype: HelmType, monomerSymbol: string): HTMLElement {
+    const polymerType = helmTypeToPolymerType(biotype);
+    const res = ui.div([], {classes: 'ui-form ui-tooltip'});
+    const monomer = this.getMonomer(polymerType, monomerSymbol);
+    if (monomer) {
+      // Symbol & Name
+      const symbol = monomer[REQ.SYMBOL];
+      const _name = monomer[REQ.NAME];
+      const wem = this.getWebEditorMonomer(biotype, monomerSymbol)!;
+
+      const htmlColor = wem.backgroundcolor;
+      res.append(ui.divH([
+        ui.div([symbol], {
+          style: {
+            /* fontWeight: 'bolder', */ textWrap: 'nowrap', marginLeft: '4px', marginRight: '4px',
+            color: wem.textcolor, backgroundColor: wem.backgroundcolor, borderColor: wem.linecolor,
+            borderWidth: '1px', borderStyle: 'solid', borderRadius: '2px', padding: '3px',
+            minWidth: '24px', textAlign: 'center',
+          }
+        }),
+        ui.div([monomer.name], {style: {padding: '4px'}}),
+      ], {style: {display: 'flex', flexDirection: 'row', justifyContent: 'left'}}));
+
+      // Structure
+      const chemOptions = {autoCrop: true, autoCropMargin: 0, suppressChiralText: true};
+      let structureEl: HTMLElement;
+      if (monomer.molfile)
+        structureEl = grok.chem.svgMol(monomer.molfile, undefined, undefined, chemOptions);
+      else if (monomer.smiles) {
+        structureEl = ui.divV([
+          grok.chem.svgMol(monomer.smiles, undefined, undefined, chemOptions),
+          ui.divText('from smiles', {style: {fontSize: 'smaller'}}),
+        ]);
+      } else {
+        // Unable to get monomer's structure
+        structureEl = ui.divText('No structure', {style: {margin: '6px'}});
+      }
+      res.append(ui.div(structureEl,
+        {style: {display: 'flex', flexDirection: 'row', justifyContent: 'center', margin: '6px'}}));
+
+      // Source
+      if (monomer.symbol != GAP_SYMBOL)
+        res.append(ui.divText(monomer.lib?.source ?? 'Missed in libraries'));
+    } else {
+      res.append(ui.divV([
+        ui.divText(`Monomer '${monomerSymbol}' of type '${polymerType}' not found.`),
+        ui.divText('Open the Context Panel, then expand Manage Libraries'),
+      ]));
+    }
+    return res;
+  }
+
+  getMonomerTextColor(biotype: HelmType, symbol: string): string {
+    const colors: IMonomerColors = this.getMonomerColors(biotype, symbol);
+    const htmlToA = (html: string): number[] => {
+      const rgbM = /rgb\(\s*(\d+)\s*,\s*(\d+)\s*,\s*(\d+)\s*\)/.exec(html);
+      if (rgbM)
+        return [parseInt(rgbM[1]), parseInt(rgbM[2]), parseInt(rgbM[3])];
+
+      const n = DG.Color.fromHtml(colors.textcolor!);
+      return [DG.Color.r(n), DG.Color.g(n), DG.Color.b(n)];
+    };
+
+    const textColorA = htmlToA(colors.textcolor!);
+    const textColorAdjV = new Vector([...textColorA.map((v) => v + 1)]);
+    const cosTextToWhite = vectorDotProduct(textColorAdjV, whiteColorV) /
+      (vectorLength(textColorAdjV) * vectorLength(whiteColorV));
+
+    const backColorA = htmlToA(colors.backgroundcolor!);
+    const backColorAdjV = new Vector([...backColorA.map((v) => v + 0.01)]);
+    const cosBackToWhite = vectorDotProduct(backColorAdjV, whiteColorV) /
+      (vectorLength(backColorAdjV) * vectorLength(whiteColorV));
+
+    let resColorA;
+    if (cosBackToWhite < cosTextToWhite)
+      resColorA = backColorA;
+    else
+      resColorA = textColorA;
+
+    let resColorV = new Vector(resColorA);
+    const resColorLen = vectorLength(resColorV);
+    if (resColorLen > maxTextColorVLen) resColorV = vectorAdd(blackColorV, resColorV, maxTextColorVLen / resColorLen);
+    return `rgb(${resColorV[0]}, ${resColorV[1]}, ${resColorV[2]})`;
+  }
+
+  getMonomerColors(biotype: HelmType, symbol: string): IMonomerColors {
+    const currentMonomerSchema = 'default';
+    let monomerSchema: string = currentMonomerSchema;
+
+    const polymerType = helmTypeToPolymerType(biotype);
+    const monomer = this.getMonomer(polymerType, symbol)!;
+    let res: any;
+    if (monomer) {
+      if (monomer.meta && monomer.meta.colors) {
+        const monomerColors: { [colorSchemaName: string]: any } = monomer.meta.colors;
+        if (!(currentMonomerSchema in monomerColors)) monomerSchema = 'default';
+        res = monomerColors[monomerSchema];
+      }
+
+      if (!res) {
+        const biotypeColors: { [symbol: string]: string } | undefined = naturalMonomerColors[biotype];
+        const nColor: string = biotypeColors?.[monomer.symbol];
+        if (nColor) {
+          const nTextColor = DG.Color.toHtml(DG.Color.getContrastColor(DG.Color.fromHtml(nColor)));
+          res = {textColor: nTextColor, lineColor: '#202020', backgroundColor: nColor};
+        }
+      }
+
+      const naSymbol: string | undefined = monomer[OPT.NATURAL_ANALOG];
+      if (!res && naSymbol) {
+        return this.getMonomerColors(biotype, naSymbol);
+      }
+    }
+
+    if (!res)
+      res = {textColor: "#202020", lineColor: "#202020", backgroundColor: "#A0A0A0"};
+
+    return {
+      textcolor: res.text ?? res.textColor,
+      linecolor: res.line ?? res.lineColor,
+      backgroundcolor: res.background ?? res.backgroundColor
+    } as IMonomerColors;
   }
 
   getRS(smiles: string): { [r: string]: string } {

package/src/utils/monomer-lib/monomer-lib.ts

@@ -163,22 +163,20 @@ export class MonomerLib extends MonomerLibBase implements IMonomerLib {
         this._monomers[type][monomerSymbol] = lib.getMonomer(type, monomerSymbol)!;
       });
     });
-  }
-
-  public update(lib: IMonomerLib): void {
-    this._updateLibInt(lib);
-    this._onChanged.next();
+    this._isEmpty = this.isEmpty && lib.isEmpty;
   }
 
   public updateLibs(libList: IMonomerLib[], reload: boolean = false): void {
-    if (reload)
+    if (reload) {
       this._monomers = {};
+      this._isEmpty = true;
+    }
     this._duplicateMonomers = {}; // Reset duplicates
     for (const lib of libList)
       if (!lib.error) this._updateLibInt(lib);
     if (Object.entries(this.duplicateMonomers).length > 0) {
       getUserLibSettings().then((settings) => {
-        this.assignDuplicatePreferances(settings);
+        this.assignDuplicatePreferences(settings);
       });
     } else
       this._duplicatesHandled = true;
@@ -186,8 +184,8 @@ export class MonomerLib extends MonomerLibBase implements IMonomerLib {
     this._onChanged.next();
   }
 
-  /** Checks wether all duplicated monomers have set preferences in user settings. overwrites those which have. */
-  assignDuplicatePreferances(userSettings: UserLibSettings): boolean {
+  /** Checks weather all duplicated monomers have set preferences in user settings. overwrites those which have. */
+  assignDuplicatePreferences(userSettings: UserLibSettings): boolean {
     let res = true;
     for (const polymerType in this.duplicateMonomers) {
       for (const monomerSymbol in this.duplicateMonomers[polymerType]) {
@@ -243,47 +241,6 @@ export class MonomerLib extends MonomerLibBase implements IMonomerLib {
     return resStr;
   }
 
-  getTooltip(biotype: HelmType, monomerSymbol: string): HTMLElement {
-    const polymerType = helmTypeToPolymerType(biotype);
-    const res = ui.div([], {classes: 'ui-form ui-tooltip'});
-    const monomer = this.getMonomer(polymerType, monomerSymbol);
-    if (monomer) {
-      // Symbol & Name
-      const symbol = monomer[REQ.SYMBOL];
-      const _name = monomer[REQ.NAME];
-      res.append(ui.divH([
-        ui.div([symbol], {style: {fontWeight: 'bolder', textWrap: 'nowrap', marginRight: '6px'}}),
-        ui.div([monomer.name])
-      ], {style: {display: 'flex', flexDirection: 'row', justifyContent: 'left'}}));
-
-      // Structure
-      const chemOptions = {autoCrop: true, autoCropMargin: 0, suppressChiralText: true};
-      let structureEl: HTMLElement;
-      if (monomer.molfile)
-        structureEl = grok.chem.svgMol(monomer.molfile, undefined, undefined, chemOptions);
-      else if (monomer.smiles) {
-        structureEl = ui.divV([
-          grok.chem.svgMol(monomer.smiles, undefined, undefined, chemOptions),
-          ui.divText('from smiles', {style: {fontSize: 'smaller'}}),
-        ]);
-      } else {
-        // Unable to get monomer's structure
-        structureEl = ui.divText('No structure', {style: {margin: '6px'}});
-      }
-      res.append(ui.div(structureEl,
-        {style: {display: 'flex', flexDirection: 'row', justifyContent: 'center', margin: '6px'}}));
-
-      // Source
-      res.append(ui.divText(monomer.lib?.source ?? 'Missed in libraries'));
-    } else {
-      res.append(ui.divV([
-        ui.divText(`Monomer '${monomerSymbol}' of type '${polymerType}' not found.`),
-        ui.divText('Open the Context Panel, then expand Manage Libraries'),
-      ]));
-    }
-    return res;
-  }
-
   override(data: MonomerLibData): IMonomerLibBase {
     return new OverriddenMonomerLib(data, this);
   }