@datagrok/bio 2.9.0 → 2.10.0

package/src/utils/cell-renderer.ts

@@ -143,8 +143,11 @@ export class MacromoleculeSequenceCellRenderer extends DG.GridCellRenderer {
     // Cell renderer settings
     const tempMonomerWidth: string | null = tableColTemp[tempTAGS.monomerWidth];
     const monomerWidth: string = (tempMonomerWidth != null) ? tempMonomerWidth : 'short';
-    if (monomerWidth === 'short')
-      maxLengthOfMonomer = tableColTemp[mmcrTemps.maxMonomerLength] ?? _package.properties.MaxMonomerLength;
+    if (monomerWidth === 'short') {
+      // Renderer can start to work before Bio package initialized, in that time _package.properties is null.
+      // TODO: Render function is available but package init method is not completed
+      maxLengthOfMonomer = tableColTemp[mmcrTemps.maxMonomerLength] ?? _package.properties?.MaxMonomerLength ?? 4;
+    }
 
 
     let seqColTemp: MonomerPlacer = tableCol.temp[tempTAGS.bioSeqCol];
@@ -206,36 +209,6 @@ export class MacromoleculeSequenceCellRenderer extends DG.GridCellRenderer {
         ((tempReferenceSequence != null) && (tempReferenceSequence != '')) ?
           tempReferenceSequence : tempCurrentWord ?? '');
 
-      // let maxLengthWords: { [pos: number]: number } = {};
-      // if (tableCol.getTag(rndrTAGS.calculatedCellRender) !== splitLimit.toString()) {
-      //   let sampleCount = 0;
-      //   while (sampleCount < Math.min(tableCol.length, 100)) {
-      //     const rowIdx: number = sampleCount;
-      //     const column = tableCol.get(rowIdx);
-      //     const subParts: string[] = splitterFunc(column);
-      //     for (const [index, amino] of subParts.entries()) {
-      //       const textSize = monomerToShortFunction(amino, maxLengthOfMonomer).length * 7 + gapRenderer;
-      //       if (textSize > (maxLengthWords[index] ?? 0))
-      //         maxLengthWords[index] = textSize;
-      //       if (index > maxIndex) maxIndex = index;
-      //     }
-      //     sampleCount += 1;
-      //   }
-      //   const minLength = 3 * 7;
-      //   for (let i = 0; i <= maxIndex; i++) {
-      //     if (maxLengthWords[i] < minLength) maxLengthWords[i] = minLength;
-      //     const maxLengthWordSum: { [pos: number]: number } = {};
-      //     maxLengthWordSum[0] = maxLengthWords[0];
-      //     for (let i = 1; i <= maxIndex; i++) maxLengthWordSum[i] = maxLengthWordSum[i - 1] + maxLengthWords[i];
-      //     colTemp[tempTAGS.bioSumMaxLengthWords] = maxLengthWordSum;
-      //     colTemp[tempTAGS.bioMaxIndex] = maxIndex;
-      //     colTemp[tempTAGS.bioMaxLengthWords] = maxLengthWords;
-      //     tableCol.setTag(rndrTAGS.calculatedCellRender, splitLimit.toString());
-      //   }
-      // } else {
-      //   maxLengthWords = colTemp[tempTAGS.bioMaxLengthWords];
-      // }
-
       const subParts: ISeqSplitted = splitterFunc(value);
       /* let x1 = x; */
       let color = undefinedColor;

package/src/utils/context-menu.ts

@@ -4,7 +4,6 @@ import * as ui from 'datagrok-api/ui';
 
 import {UnitsHandler} from '@datagrok-libraries/bio/src/utils/units-handler';
 import {NOTATION} from '@datagrok-libraries/bio/src/utils/macromolecule';
-import {NotationConverter} from '@datagrok-libraries/bio/src/utils/notation-converter';
 
 import {_package} from '../package';
 
@@ -15,9 +14,9 @@ export function addCopyMenuUI(cell: DG.Cell, menu: DG.Menu): void {
 
   menu.group('Copy')
     .items(tgtNotationList, (tgtNotation) => {
-      const nc = new NotationConverter(cell.column);
+      const ncUH = UnitsHandler.getOrCreate(cell.column);
       const separator = tgtNotation === NOTATION.SEPARATOR ? _package.properties.DefaultSeparator : undefined;
-      const converter = nc.getConverter(tgtNotation as NOTATION, separator);
+      const converter = ncUH.getConverter(tgtNotation as NOTATION, separator);
       const tgtSeq = converter(cell.value);
 
       if (!navigator.clipboard) {

package/src/utils/convert.ts

@@ -5,7 +5,6 @@ import * as grok from 'datagrok-api/grok';
 import $ from 'cash-dom';
 import {Subscription} from 'rxjs';
 import {NOTATION, TAGS as bioTAGS} from '@datagrok-libraries/bio/src/utils/macromolecule';
-import {NotationConverter} from '@datagrok-libraries/bio/src/utils/notation-converter';
 import {UnitsHandler} from '@datagrok-libraries/bio/src/utils/units-handler';
 import {expect} from '@datagrok-libraries/utils/src/test';
 
@@ -22,8 +21,8 @@ export function convert(col?: DG.Column): void {
   let tgtCol = col ?? grok.shell.t.columns.bySemType('Macromolecule')!;
   if (!tgtCol)
     throw new Error('No column with Macromolecule semantic type found');
-  let converter = new NotationConverter(tgtCol);
-  let currentNotation: NOTATION = converter.notation;
+  let converterUH = UnitsHandler.getOrCreate(tgtCol);
+  let currentNotation: NOTATION = converterUH.notation;
   const dialogHeader = ui.divText(
     'Current notation: ' + currentNotation,
     {
@@ -47,8 +46,8 @@ export function convert(col?: DG.Column): void {
     }
 
     tgtCol = newCol;
-    converter = new NotationConverter(tgtCol);
-    currentNotation = converter.notation;
+    converterUH = UnitsHandler.getOrCreate(tgtCol);
+    currentNotation = converterUH.notation;
     if (currentNotation === NOTATION.HELM)
       separatorInput.value = '/'; // helm monomers can have - in the name like D-aThr;
     dialogHeader.textContent = 'Current notation: ' + currentNotation;
@@ -117,8 +116,8 @@ export function convert(col?: DG.Column): void {
  * @param {string | null} separator Separator for SEPARATOR notation
  */
 export async function convertDo(srcCol: DG.Column, targetNotation: NOTATION, separator?: string): Promise<DG.Column> {
-  const converter = new NotationConverter(srcCol);
-  const newColumn = converter.convert(targetNotation, separator);
+  const converterUH = UnitsHandler.getOrCreate(srcCol);
+  const newColumn = converterUH.convert(targetNotation, separator);
   srcCol.dataFrame.columns.add(newColumn);
 
   // Call detector directly to escape some error on detectSemanticTypes

package/src/utils/get-region-func-editor.ts

@@ -0,0 +1,241 @@
+import * as grok from 'datagrok-api/grok';
+import * as ui from 'datagrok-api/ui';
+import * as DG from 'datagrok-api/dg';
+
+import {TAGS as bioTAGS} from '@datagrok-libraries/bio/src/utils/macromolecule';
+
+export interface GetRegionParams {
+  table: DG.DataFrame,
+  sequence: DG.Column<string>,
+  start: string | null,
+  end: string | null,
+  /** Name for the column with sequence of the region  */ name: string | null,
+}
+
+import {UnitsHandler} from '@datagrok-libraries/bio/src/utils/units-handler';
+import {_package} from '../package';
+
+export interface SeqRegion {
+  name: string,
+  description: string,
+  start: string,
+  end: string,
+}
+
+export class GetRegionFuncEditor {
+  inputs = new class {
+    table: DG.InputBase<DG.DataFrame | null>;
+    sequence: DG.InputBase<DG.Column | null>;
+    region: DG.InputBase<SeqRegion>;
+    start: DG.InputBase<string>;
+    end: DG.InputBase<string>;
+    name: DG.InputBase;
+  }();
+
+  constructor(
+    private readonly call: DG.FuncCall
+  ) {
+    const getDesc = (paramName: string) => this.call.inputParams[paramName].property.description;
+
+    this.inputs.table = ui.tableInput('Table',
+      this.call.inputParams['table'].value ?? grok.shell.tv.dataFrame, undefined,
+      () => {});
+
+    const seqColValue = this.call.inputParams['sequence'].value ??
+      this.inputs.table.value!.columns.bySemType(DG.SEMTYPE.MACROMOLECULE);
+    const seqColOptions = {filter: (col: DG.Column) => col.semType === DG.SEMTYPE.MACROMOLECULE};
+    this.inputs.sequence = ui.columnInput('Sequence', grok.shell.tv.dataFrame, seqColValue,
+      this.sequenceInputChanged.bind(this), seqColOptions);
+    this.inputs.start = ui.choiceInput(
+      'Start', undefined, [], this.startInputChanged.bind(this)) as unknown as DG.InputBase<string>;
+    this.inputs.end = ui.choiceInput(
+      'End', undefined, [], this.endInputChanged.bind(this)) as unknown as DG.InputBase<string>;
+
+    this.inputs.region = ui.choiceInput<SeqRegion>('Region', null as unknown as SeqRegion, [],
+      this.regionInputChanged.bind(this)) as DG.InputBase<SeqRegion>;
+
+    this.inputs.name = ui.stringInput('Name', '', () => {},
+      {placeholder: this.getDefaultName()});
+
+    // tooltips
+    for (const paramName in this.call.inputParams) {
+      // @ts-ignore
+      ui.tooltip.bind(this.inputs[paramName].captionLabel, getDesc(paramName));
+    }
+
+    // initial
+    this.sequenceInputChanged();
+  }
+
+  private sequenceInputChanged(): void {
+    const seqCol = this.inputs.sequence.value;
+    const uh = seqCol ? UnitsHandler.getOrCreate(seqCol) : null;
+    this.updateRegionItems();
+    this.updateStartEndInputItems();
+    this.updateRegion(true);
+    this.updateNameInputPlaceholder();
+  }
+
+  private fixRegion: boolean = false;
+
+  private regionInputChanged(): void {
+    this.fixRegion = true;
+    try {
+      const regJsonStr = this.inputs.region.stringValue;
+      const reg: SeqRegion | null = regJsonStr ? JSON.parse(regJsonStr) as SeqRegion : null;
+
+      if (reg !== null) {
+        this.inputs.start.value = reg?.start;
+        this.inputs.end.value = reg?.end;
+      } else {
+        const uh = UnitsHandler.getOrCreate(this.inputs.sequence.value!);
+        this.inputs.start.value = uh.posList[0];
+        this.inputs.end.value = uh.posList[uh.posList.length - 1];
+      }
+    } finally {
+      this.fixRegion = false;
+    }
+  }
+
+  private startInputChanged(): void {
+    this.updateRegion(false);
+    this.updateNameInputPlaceholder();
+  }
+
+  private endInputChanged(): void {
+    this.updateRegion(false);
+    this.updateNameInputPlaceholder();
+  }
+
+  private updateStartEndInputItems(): void {
+    const seqCol = this.inputs.sequence.value;
+    const uh = seqCol ? UnitsHandler.getOrCreate(seqCol) : null;
+
+    const startSE = (this.inputs.start.input as HTMLSelectElement);
+    const endSE = (this.inputs.end.input as HTMLSelectElement);
+    for (let i = startSE.options.length - 1; i >= 0; --i) startSE.options.remove(i);
+    for (let i = endSE.options.length - 1; i >= 0; --i) endSE.options.remove(i);
+    for (const pos of uh?.posList ?? []) {
+      const startPosOE = document.createElement('option');
+      const endPosOE = document.createElement('option');
+      startPosOE.text = endPosOE.text = pos;
+      startPosOE.value = endPosOE.value = pos;
+      startSE.options.add(startPosOE);
+      endSE.options.add(endPosOE);
+    }
+    startSE.value = uh?.posList[0] ?? '';
+    endSE.value = uh?.posList[uh?.posList.length - 1] ?? '';
+  }
+
+  private updateRegionItems(): void {
+    const seqCol = this.inputs.sequence.value;
+    const regionsTagTxt: string | null = seqCol ? seqCol.getTag(bioTAGS.regions) : null;
+    const regionList: SeqRegion[] | null = regionsTagTxt ? JSON.parse(regionsTagTxt) : null;
+
+    const regionSE = (this.inputs.region.input as HTMLSelectElement);
+    for (let i = regionSE.options.length - 1; i >= 0; --i) regionSE.options.remove(i);
+
+    const nullOE = document.createElement('option');
+    nullOE.text = '';
+    nullOE.value = JSON.stringify(null);
+    regionSE.options.add(nullOE);
+
+    if (regionList != null) {
+      this.inputs.region.root.style.removeProperty('display');
+      for (const region of regionList) {
+        const regionOE = document.createElement('option');
+        regionOE.text = `${region.name}: ${region.start}-${region.end}`;
+        regionOE.value = JSON.stringify(region);
+        regionSE.options.add(regionOE);
+      }
+    } else {
+      this.inputs.region.root.style.display = 'none';
+    }
+  }
+
+  private updateRegion(reset: boolean): void {
+    const startPos: string = this.inputs.start.stringValue ?? '';
+    const endPos: string = this.inputs.end.stringValue ?? '';
+
+    if (!this.fixRegion) {
+      const regionSE = (this.inputs.region.input as HTMLSelectElement);
+      regionSE.selectedIndex = -1;
+      for (let i = regionSE.options.length - 1; i >= 0; --i) {
+        const regionOE = regionSE.options[i];
+        const reg: SeqRegion = JSON.parse(regionOE.value);
+        if (reg && startPos === reg.start && endPos === reg.end) regionSE.selectedIndex = i;
+      }
+    }
+  }
+
+  private updateNameInputPlaceholder(): void {
+    // @ts-ignore
+    this.inputs.name.input.attributes['placeholder'].value = this.getDefaultName();
+  }
+
+  private getDefaultName(): string {
+    const regionJsonStr = this.inputs.region.stringValue;
+    const reg: SeqRegion | null = regionJsonStr ? JSON.parse(regionJsonStr) : null;
+
+    const seqCol: DG.Column<string> = this.inputs.sequence.value!;
+
+    const startPos: string = this.inputs.start.stringValue ?? '';
+    const endPos: string = this.inputs.end.stringValue ?? '';
+
+    return reg != null ? `${seqCol.name}(${reg.name}): ${reg.start}-${reg.end}` :
+      `${seqCol?.name}: (${startPos}-${endPos})`;
+  }
+
+  private getParams(): {} {
+    return {
+      table: this.inputs.table.value!,
+      sequence: this.inputs.sequence.value!,
+      start: this.getStart(),
+      end: this.getEnd(),
+      name: this.getName() ?? this.getDefaultName(),
+    };
+  }
+
+  private getStart(): string | null {
+    return this.inputs.start.stringValue;
+  }
+
+  private getEnd(): string | null {
+    return this.inputs.end.stringValue;
+  }
+
+  private getName(): string | null {
+    const str = this.inputs.name.stringValue;
+    return str == '' ? null : str;
+  }
+
+  // -- UI --
+
+  public dialog(): void {
+    const inputsForm = ui.inputs(Object.values(this.inputs), {style: {minWidth: '320px'}});
+    ui.dialog({title: 'Get Region'})
+      .add(inputsForm)
+      .onOK(async () => {
+        (async () => {
+          const callParams = this.getParams();
+          await this.call.func.prepare(callParams).call(true);
+        })()
+          .catch((err: any) => { _package.handleErrorUI(err); });
+      })
+      .show();
+  }
+
+  public widget(): DG.Widget {
+    const inputsForm = ui.inputs(Object.entries(this.inputs)
+      .filter(([inputName, input]) => !['table', 'sequence'].includes(inputName))
+      .map(([inputName, input]) => input));
+    const doBtn = ui.button('Get Region', () => {
+      (async () => {
+        const callParams = this.getParams();
+        await this.call.func.prepare(callParams).call(true);
+      })()
+        .catch((err: any) => { _package.handleErrorUI(err); });
+    });
+    return DG.Widget.fromRoot(ui.divV([inputsForm, ui.div(doBtn)]));
+  }
+}

package/src/utils/get-region.ts

@@ -0,0 +1,65 @@
+import * as grok from 'datagrok-api/grok';
+import * as ui from 'datagrok-api/ui';
+import * as DG from 'datagrok-api/dg';
+
+import {TAGS as bioTAGS} from '@datagrok-libraries/bio/src/utils/macromolecule';
+import {UnitsHandler} from '@datagrok-libraries/bio/src/utils/units-handler';
+import {getRegion} from '../package';
+import {TaskBarProgressIndicator} from 'datagrok-api/dg';
+
+export function getRegionUI(col: DG.Column<string>): void {
+  const uh = UnitsHandler.getOrCreate(col);
+
+  const nameInput = ui.stringInput('Name', '');
+  const startPositionInput = ui.choiceInput('Start Position', uh.posList[0], uh.posList,
+    () => { /* TODO: update name placeholder with getDefaultName() */ });
+  const endPositionInput = ui.choiceInput('End Position', uh.posList[uh.posList.length], uh.posList,
+    () => { /* TODO: update name placeholder with getDefaultName() */ });
+
+  const getDefaultName = (): string => {
+    return `${col.name}:${startPositionInput.value}-${endPositionInput.value}`;
+  };
+
+  ui.dialog({title: 'Get Region'}).add(ui.inputs([
+    nameInput,
+    startPositionInput,
+    endPositionInput,
+  ])).onOK(() => {
+    const pi = TaskBarProgressIndicator.create('Getting region...');
+    try {
+      const name: string = nameInput.value ?? getDefaultName();
+      const regCol = getRegionDo(col, name, startPositionInput.value, endPositionInput.value);
+      col.dataFrame.columns.add(regCol);
+      regCol.setTag(DG.TAGS.CELL_RENDERER, 'sequence');
+    } catch (err: any) {
+      grok.shell.error(err.toString());
+    } finally { pi.close(); }
+  });
+}
+
+/** {@link startPosName} and {@link endPosName} are according positionNames tag (or default ['1', '2',...]) */
+export function getRegionDo(
+  col: DG.Column<string>, startPosName: string | null, endPosName: string | null, name: string | null
+): DG.Column<string> {
+  const uh = UnitsHandler.getOrCreate(col);
+
+  let startPosIdx: number | null = null;
+  let endPosIdx: number | null = null;
+
+  for (let posJ: number = 0; posJ < uh.posList.length; ++posJ) {
+    if (uh.posList[posJ] == startPosName) startPosIdx = posJ;
+    if (uh.posList[posJ] == endPosName) endPosIdx = posJ;
+  }
+  if (startPosIdx === null && startPosName !== null)
+    throw new Error(`Start position ${startPosName} not found.`);
+  if (endPosIdx === null && endPosName !== null)
+    throw new Error(`End position ${endPosName} not found.`);
+
+  if (uh.posList.length < endPosIdx!)
+    throw new Error(`End position ${endPosIdx} exceeds positions length`);
+
+  const regColName: string = !!name ? name : `${col.name}: (${startPosName ?? ''}-${endPosName ?? ''})`;
+
+  const regCol = uh.getRegion(startPosIdx, endPosIdx, regColName);
+  return regCol;
+}

package/src/utils/multiple-sequence-alignment-ui.ts

@@ -3,15 +3,19 @@ import * as DG from 'datagrok-api/dg';
 import * as ui from 'datagrok-api/ui';
 
 import {ALPHABET, NOTATION} from '@datagrok-libraries/bio/src/utils/macromolecule';
+import {UnitsHandler} from '@datagrok-libraries/bio/src/utils/units-handler';
+import {ColumnInputOptions} from '@datagrok-libraries/utils/src/type-declarations';
+
 import {runKalign} from './multiple-sequence-alignment';
 import {pepseaMethods, runPepsea} from './pepsea';
 import {checkInputColumnUI} from './check-input-column';
-import {NotationConverter} from '@datagrok-libraries/bio/src/utils/notation-converter';
-import {_package} from '../package';
 import {multipleSequenceAlginmentUIOptions} from './types';
 import {kalignVersion, msaDefaultOptions} from './constants';
+
+import {_package} from '../package';
+
 import '../../css/msa.css';
-import {ColumnInputOptions} from '@datagrok-libraries/utils/src/type-declarations';
+
 export class MsaWarning extends Error {
   constructor(message: string, options?: ErrorOptions) {
     super(message, options);
@@ -66,12 +70,12 @@ export async function multipleSequenceAlignmentUI(
     //TODO: remove when the new version of datagrok-api is available
     //TODO: allow only macromolecule colums to be chosen
     const colInput = ui.columnInput('Sequence', table, seqCol, async () => {
-      performAlignment = await onColInputChange(
-        colInput.value, table, pepseaInputRootStyles, kalignInputRootStyles,
-        methodInput, clustersColInput, gapOpenInput, gapExtendInput, terminalGapInput,
-      );
-      //@ts-ignore
-    }, {filter: (col: DG.Column) => col.semType === DG.SEMTYPE.MACROMOLECULE} as ColumnInputOptions
+        performAlignment = await onColInputChange(
+          colInput.value, table, pepseaInputRootStyles, kalignInputRootStyles,
+          methodInput, clustersColInput, gapOpenInput, gapExtendInput, terminalGapInput,
+        );
+        //@ts-ignore
+      }, {filter: (col: DG.Column) => col.semType === DG.SEMTYPE.MACROMOLECULE} as ColumnInputOptions
     ) as DG.InputBase<DG.Column<string>>;
     colInput.setTooltip('Sequences column to use for alignment');
     const clustersColInput = ui.columnInput('Clusters', table, options.clustersCol);
@@ -100,7 +104,7 @@ export async function multipleSequenceAlignmentUI(
 }
 
 async function onDialogOk(
-  colInput: DG.InputBase< DG.Column<any>>,
+  colInput: DG.InputBase<DG.Column<any>>,
   table: DG.DataFrame,
   performAlignment: (() => Promise<DG.Column<string> | null>) | undefined,
   resolve: (value: DG.Column<any>) => void,
@@ -151,9 +155,9 @@ async function onColInputChange(
       gapOpenInput.value = null;
       gapExtendInput.value = null;
       terminalGapInput.value = null;
-      const potentialColNC = new NotationConverter(col);
-      const performCol: DG.Column<string> = potentialColNC.isFasta() ? col :
-        potentialColNC.convert(NOTATION.FASTA);
+      const potentialColUH = UnitsHandler.getOrCreate(col);
+      const performCol: DG.Column<string> = potentialColUH.isFasta() ? col :
+        potentialColUH.convert(NOTATION.FASTA);
       return async () => await runKalign(performCol, false, unusedName, clustersColInput.value);
     } else if (checkInputColumnUI(col, col.name,
       [NOTATION.HELM], [], false)
@@ -163,18 +167,18 @@ async function onColInputChange(
       gapExtendInput.value ??= msaDefaultOptions.pepsea.gapExtend;
 
       return async () => await runPepsea(col, unusedName, methodInput.value!,
-          gapOpenInput.value!, gapExtendInput.value!, clustersColInput.value);
+        gapOpenInput.value!, gapExtendInput.value!, clustersColInput.value);
     } else if (checkInputColumnUI(col, col.name, [NOTATION.SEPARATOR], [ALPHABET.UN], false)) {
       //if the column is separator with unknown alphabet, it might be helm. check if it can be converted to helm
-      const potentialColNC = new NotationConverter(col);
-      const helmCol = potentialColNC.convert(NOTATION.HELM);
+      const potentialColUH = UnitsHandler.getOrCreate(col);
+      const helmCol = potentialColUH.convert(NOTATION.HELM);
       switchDialog(pepseaInputRootStyles, kalignInputRootStyles, 'pepsea');
       gapOpenInput.value ??= msaDefaultOptions.pepsea.gapOpen;
       gapExtendInput.value ??= msaDefaultOptions.pepsea.gapExtend;
       // convert to helm and assign alignment function to PepSea
 
       return async () => await runPepsea(helmCol, unusedName, methodInput.value!,
-            gapOpenInput.value!, gapExtendInput.value!, clustersColInput.value);
+        gapOpenInput.value!, gapExtendInput.value!, clustersColInput.value);
     } else {
       gapOpenInput.value = null;
       gapExtendInput.value = null;

package/src/viewers/web-logo-viewer.ts

@@ -8,14 +8,15 @@ import {fromEvent, Observable, Subject, Unsubscribable} from 'rxjs';
 import {UnitsHandler} from '@datagrok-libraries/bio/src/utils/units-handler';
 import {SeqPalette} from '@datagrok-libraries/bio/src/seq-palettes';
 import {
-  monomerToShort, pickUpPalette, pickUpSeqCol, TAGS as bioTAGS
+  monomerToShort, pickUpPalette, pickUpSeqCol, TAGS as bioTAGS, positionSeparator
 } from '@datagrok-libraries/bio/src/utils/macromolecule';
 import {
-  FilterSources, HorizontalAlignments, IWebLogoViewer, PositionHeight, PositionMarginStates, positionSeparator,
-  TAGS as wlTAGS, VerticalAlignments, WebLogoProps, WebLogoPropsDefault
+  FilterSources, HorizontalAlignments, IWebLogoViewer, PositionHeight, PositionMarginStates,
+  VerticalAlignments, WebLogoProps, WebLogoPropsDefault
 } from '@datagrok-libraries/bio/src/viewers/web-logo';
 import {errorToConsole} from '@datagrok-libraries/utils/src/to-console';
 import {intToHtmlA} from '@datagrok-libraries/utils/src/color';
+import {TAGS} from '@datagrok-libraries/bio/src/utils/macromolecule';
 import {ISeqSplitted} from '@datagrok-libraries/bio/src/utils/macromolecule/types';
 
 import {_package} from '../package';
@@ -560,8 +561,8 @@ export class WebLogoViewer extends DG.JsViewer implements IWebLogoViewer {
     }).reduce((max, l) => Math.max(max, l), 0);
 
     /** positionNames and positionLabel can be set up through the column's tags only */
-    const positionNamesTxt = this.seqCol.getTag(wlTAGS.positionNames);
-    const positionLabelsTxt = this.seqCol.getTag(wlTAGS.positionLabels);
+    const positionNamesTxt = this.seqCol.getTag(TAGS.positionNames);
+    const positionLabelsTxt = this.seqCol.getTag(TAGS.positionLabels);
     this.positionNames = !!positionNamesTxt ? positionNamesTxt.split(positionSeparator).map((v) => v.trim()) :
       [...Array(maxLength).keys()].map((jPos) => `${jPos + 1}`)/* fallback if tag is not provided */;
     this.positionLabels = !!positionLabelsTxt ? positionLabelsTxt.split(positionSeparator).map((v) => v.trim()) :
@@ -1034,7 +1035,8 @@ export class WebLogoViewer extends DG.JsViewer implements IWebLogoViewer {
         min: this.slider.min, max: this.slider.max,
         maxRange: this.slider.maxRange
       };
-      _package.logger.debug(`Bio: WebLogoViewer<${this.viewerId}>.sliderOnValuesChanged( ${JSON.stringify(val)} ), start`);
+      _package.logger.debug(
+        `Bio: WebLogoViewer<${this.viewerId}>.sliderOnValuesChanged( ${JSON.stringify(val)} ), start`);
       this.render(WlRenderLevel.Layout, 'sliderOnValuesChanged').then(() => {});
     } catch (err: any) {
       const errMsg = errorToConsole(err);