@datagrok/sequence-translator 1.4.0 → 1.4.2

package/files/samples/cyclized.csv

@@ -1,5 +1,5 @@
 n,seqs
-1,R-F-C(1)-T-G-H-F-Y-P-C(1)-meI
+1,R-F-C(1)-T-G-H-F-Y-G-H-F-Y-G-H-F-Y-P-C(1)-meI
 2,C(1)-T-G-H-F-Y-P-C(1)-meI
 3,R-F-C(1)-T-G-H-F-Y-P-C(1)
 4,C(1)-T-G-H-F-H-P-C(1)

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@datagrok/sequence-translator",
   "friendlyName": "Sequence Translator",
-  "version": "1.4.0",
+  "version": "1.4.2",
   "author": {
     "name": "Alexey Choposky",
     "email": "achopovsky@datagrok.ai"
@@ -22,8 +22,8 @@
     }
   ],
   "dependencies": {
-    "@datagrok-libraries/bio": "^5.42.15",
-    "@datagrok-libraries/chem-meta": "^1.2.5",
+    "@datagrok-libraries/bio": "^5.44.0",
+    "@datagrok-libraries/chem-meta": "^1.2.7",
     "@datagrok-libraries/tutorials": "^1.4.0",
     "@datagrok-libraries/utils": "^4.3.0",
     "@types/react": "^18.0.15",
@@ -41,7 +41,7 @@
   "devDependencies": {
     "@datagrok-libraries/helm-web-editor": "^1.1.11",
     "@datagrok-libraries/js-draw-lite": "^0.0.8",
-    "@datagrok/bio": "^2.15.1",
+    "@datagrok/bio": "^2.15.3",
     "@datagrok/helm": "^2.5.0",
     "@datagrok/chem": "^1.12.0",
     "@types/jquery": "^3.5.14",

package/src/apps/common/view/components/colored-input/colored-text-input.ts

@@ -19,7 +19,7 @@ export class ColoredTextInput {
     /** Resize, no scrolls  */
     resizeable: boolean = true
   ) {
-    $(this.root).addClass('colored-text-input');
+    $(this.root).addClass('st-colored-text-input');
     if (resizeable) {
       // make input field automatically resizeable
       this.textInputBase.onChanged.subscribe(

package/src/apps/common/view/components/colored-input/style.css

@@ -1,4 +1,4 @@
-.colored-text-input > textarea {
+.st-colored-text-input > textarea {
   width: 100%;
   -webkit-text-fill-color: transparent;
   background-color: transparent;
@@ -8,7 +8,7 @@
   height: 22px; /* Fine tuned value to avoid "jumping" of the textarea upon autoresize */
 }
 
-.colored-text-input > div {
+.st-colored-text-input > div {
   /* The values here are fine tuned to those of the ui.input textarea in order
    * to achieve precise overlap */
   overflow: auto;
@@ -25,5 +25,4 @@
   color: transparent;
   white-space: pre-wrap;
   word-wrap: break-word;
-  padding-left: 35px;
 }

package/src/apps/pattern/view/components/right-section.ts

@@ -96,10 +96,10 @@ export class PatternAppRightSection {
     }
 
     const message = ui.divV([
-      ui.divText(`Author: ${author}`),
       ui.divText(`Pattern Name: ${patternName}`),
-      ui.divText(`Created: ${new Date(createDate).toLocaleString()}`),
-      ui.divText(`Modified: ${new Date(modifyDate).toLocaleString()}`),
+      ui.divText(`Author: ${author}`),
+      ui.divText(`Created: ${getInfoTimestamp(new Date(createDate))}`),
+      ui.divText(`Modified: ${getInfoTimestamp(new Date(modifyDate))}`),
     ]);
     grok.shell.info(message);
   }
@@ -195,3 +195,6 @@ class OverwritePatternDialog {
   }
 }
 
+function getInfoTimestamp(date: Date): string {
+  return date.toLocaleString().split(':').slice(0, -1).join(':');
+}

package/src/apps/structure/view/ui.ts

@@ -33,7 +33,15 @@ class StructureAppLayout {
     this.onInvalidInput = new rxjs.Subject<string>();
     this.inputBase = Object.fromEntries(
       STRANDS.map(
-        (key) => [key, ui.input.textArea(key.toUpperCase(), {value: '', onValueChanged: () => { this.onInput.next(); }})]
+        (key) => {
+          const input = ui.input.textArea(key.toUpperCase(), {value: '', onValueChanged: () => {
+            this.onInput.next();
+            // WARNING: this fine tuning is necessary to fix layout within ui.form
+            // js-api version ^1.21
+            $(input.root.getElementsByTagName('div')).css('padding-left', '38px');
+          }});
+          return [key, input];
+        }
       )
     );
     this.useChiralInput = ui.input.bool('Use chiral', {value: true});
@@ -165,11 +173,6 @@ class StructureAppLayout {
   }
 
   private getMolfile(ss: StrandData, as: StrandData, as2: StrandData): string {
-    // if (ss.strand === '' && (as.strand !== '' || as2.strand !== '')) {
-    //   this.onInvalidInput.next();
-    //   return '';
-    // }
-
     return getLinkedMolfile(ss, as, as2, this.useChiralInput.value!, this.th);
   }
 

package/src/apps/translator/view/style.css

@@ -24,10 +24,6 @@
   table-layout: fixed;
 }
 
-/* .st-translator-output-table table tbody tr td { */
-/*   max-width: 20%; */
-/* } */
-
 .st-translator-output-table td {
   padding-top: 6px;
   padding-bottom: 6px;

package/src/apps/translator/view/ui.ts

@@ -10,8 +10,6 @@ import {NOTATION} from '@datagrok-libraries/bio/src/utils/macromolecule';
 
 import {DEFAULT_FORMATS} from '../../common/model/const';
 import {download} from '../../common/model/helpers';
-import {FormatDetector} from '../../common/model/parsing-validation/format-detector';
-import {SequenceValidator} from '../../common/model/parsing-validation/sequence-validator';
 import {ColoredTextInput} from '../../common/view/components/colored-input/colored-text-input';
 import {highlightInvalidSubsequence} from '../../common/view/components/colored-input/input-painters';
 import {MoleculeImage} from '../../common/view/components/molecule-img';
@@ -20,11 +18,11 @@ import {IsolatedAppUIBase} from '../../common/view/isolated-app-ui';
 import {MonomerLibViewer} from '../../common/view/monomer-lib-viewer';
 import {SequenceToMolfileConverter} from '../../structure/model/sequence-to-molfile';
 import {convert, getSupportedTargetFormats, getTranslatedSequences} from '../model/conversion-utils';
-import {FormatConverter} from '../model/format-converter';
 import {ITranslationHelper} from '../../../types';
 
 import {NUCLEOTIDES_FORMAT, SEQUENCE_COPIED_MSG, SEQ_TOOLTIP_MSG} from './const';
 import './style.css';
+import $ from 'cash-dom';
 import {_package} from '../../../package';
 
 const enum REQUIRED_COLUMN_LABEL {
@@ -55,7 +53,12 @@ class TranslatorAppLayout {
         await this.updateMolImg();
       }
     });
-    this.sequenceInputBase = ui.input.textArea('', {value: DEFAULT_AXOLABS_INPUT, onValueChanged: () => { this.onInput.next(); }});
+
+    $(this.formatChoiceInput.root.getElementsByTagName('select')[0]).css('width', '20%');
+
+    this.sequenceInputBase = ui.input.textArea(
+      '', {value: DEFAULT_AXOLABS_INPUT, onValueChanged: () => { this.onInput.next(); }}
+    );
 
     this.init();
 
@@ -457,9 +460,9 @@ class ColumnInputsManager {
     this.selectColumnIfTableNotNull(selectedTable, selectedColumnName, columnLabel);
 
     const input = ui.input.choice(`${columnLabel}`, {
-        value: selectedColumnName, items: columnNames,
-        onValueChanged: (value) => this.selectColumnIfTableNotNull(selectedTable, value, columnLabel)
-      }
+      value: selectedColumnName, items: columnNames,
+      onValueChanged: (value) => this.selectColumnIfTableNotNull(selectedTable, value, columnLabel)
+    }
     );
 
     return input;

package/src/demo/demo-st-ui.ts

@@ -24,7 +24,7 @@ export async function demoOligoStructureUI() {
   await tryCatch(async () => {
     async function setInputValue(idx: number, sequence: string): Promise<void> {
       await delay(500);
-      const textInputs: NodeListOf<HTMLTextAreaElement> = document.querySelectorAll('.colored-text-input > textarea');
+      const textInputs: NodeListOf<HTMLTextAreaElement> = document.querySelectorAll('.st-colored-text-input > textarea');
       const textarea = textInputs[idx];
       textarea.value = sequence;
       const event = new Event('input');

package/src/package-test.ts

@@ -2,7 +2,7 @@ import * as grok from 'datagrok-api/grok';
 import * as ui from 'datagrok-api/ui';
 import * as DG from 'datagrok-api/dg';
 
-import {runTests, tests, TestContext} from '@datagrok-libraries/utils/src/test';
+import {runTests, tests, TestContext, initAutoTests as initTests } from '@datagrok-libraries/utils/src/test';
 
 import './tests/formats-to-helm';
 import './tests/helm-to-nucleotides';
@@ -10,6 +10,7 @@ import './tests/formats-support';
 import './tests/files-tests';
 import './tests/polytool-convert-tests';
 import './tests/polytool-enumerate-tests';
+import './tests/polytool-enumerate-breadth-tests';
 
 import {OligoToolkitTestPackage} from './tests/utils';
 
@@ -25,3 +26,8 @@ export async function test(category: string, test: string, testContext: TestCont
   const data = await runTests({category, test, testContext, verbose: true});
   return DG.DataFrame.fromObjects(data)!;
 }
+
+//name: initAutoTests
+export async function initAutoTests() {
+  await initTests(_package, _package.getModule('package-test.js'));
+}

package/src/polytool/pt-conversion.ts

@@ -269,9 +269,7 @@ export class Chain {
 export function doPolyToolConvert(sequences: string[], rules: Rules): string[] {
   const helms = new Array<string>(sequences.length);
   for (let i = 0; i < sequences.length; i++) {
-    if (sequences[i] === undefined)
-      helms[i] = '';
-    else {
+    if (sequences[i] === undefined) { helms[i] = ''; } else {
       const chain = Chain.fromNotation(sequences[i], rules);
       helms[i] = chain.getHelm();
     }

package/src/polytool/pt-convert-editor.ts

@@ -74,14 +74,14 @@ export class PolyToolConvertFuncEditor {
 
   public async showDialog(): Promise<DG.Column<string>> {
     const formDiv = ui.div([
-        this.inputs.table,
-        this.inputs.seqCol,
-        this.inputs.generateHelm,
-        this.inputs.chiralityEngine,
-        this.inputs.rules.header,
-        this.inputs.rules.form,
-      ],
-      {style: {minWidth: '320px'}});
+      this.inputs.table,
+      this.inputs.seqCol,
+      this.inputs.generateHelm,
+      this.inputs.chiralityEngine,
+      this.inputs.rules.header,
+      this.inputs.rules.form,
+    ],
+    {style: {minWidth: '320px'}});
 
     return new Promise((resolve, reject) => {
       ui.dialog({title: PT_UI_DIALOG_CONVERSION})

package/src/polytool/pt-dialog.ts

@@ -3,7 +3,6 @@ import * as grok from 'datagrok-api/grok';
 import * as ui from 'datagrok-api/ui';
 import * as DG from 'datagrok-api/dg';
 
-import $ from 'cash-dom';
 import {Unsubscribable} from 'rxjs';
 
 import {getHelmHelper} from '@datagrok-libraries/bio/src/helm/helm-helper';
@@ -24,6 +23,16 @@ import {
 
 import {_package} from '../package';
 
+type PolyToolConvertSerialized = {
+  generateHelm: boolean;
+  chiralityEngine: boolean;
+};
+
+type PolyToolEnumerateChemSerialized = {
+  mol: string;
+  screenLibrary: string | null;
+}
+
 export function polyToolEnumerateChemUI(cell?: DG.Cell): void {
   getPolyToolEnumerationChemDialog(cell)
     .then((dialog) => {
@@ -80,7 +89,6 @@ export async function getPolyToolConvertDialog(targetCol?: DG.Column): Promise<D
       rulesForm
     ]);
 
-
     const exec = async (): Promise<void> => {
       try {
         const ruleFileList = await ruleInputs.getActive();
@@ -96,7 +104,17 @@ export async function getPolyToolConvertDialog(targetCol?: DG.Column): Promise<D
     subs.push(dialog.onClose.subscribe(() => {
       destroy();
     }));
-
+    dialog.history(
+      /* getInput */ (): PolyToolConvertSerialized => {
+        return {
+          generateHelm: generateHelmChoiceInput.value,
+          chiralityEngine: chiralityEngineInput.value,
+        };
+      },
+      /* applyInput */ (x: PolyToolConvertSerialized): void => {
+        generateHelmChoiceInput.value = x.generateHelm;
+        chiralityEngineInput.value = x.chiralityEngine;
+      });
     return dialog;
   } catch (err: any) {
     destroy(); // on failing to build a dialog
@@ -110,7 +128,6 @@ async function getPolyToolEnumerationChemDialog(cell?: DG.Cell): Promise<DG.Dial
     for (const sub of subs) sub.unsubscribe();
   };
   try {
-
     const [libList, helmHelper] = await Promise.all([
       getLibrariesList(), getHelmHelper()]);
 
@@ -135,15 +152,15 @@ async function getPolyToolEnumerationChemDialog(cell?: DG.Cell): Promise<DG.Dial
     molInput.setMolFile(molfileValue);
 
     //const helmInput = helmHelper.createHelmInput('Macromolecule', {value: helmValue});
-    const screenLibrary = ui.input.choice('Library to use', {value: null, items: libList});
+    const screenLibraryInput = ui.input.choice('Library to use', {value: null, items: libList});
 
     molInput.root.setAttribute('style', `min-width:250px!important;`);
     molInput.root.setAttribute('style', `max-width:250px!important;`);
-    screenLibrary.input.setAttribute('style', `min-width:250px!important;`);
+    screenLibraryInput.input.setAttribute('style', `min-width:250px!important;`);
 
     const div = ui.div([
       molInput.root,
-      screenLibrary.root
+      screenLibraryInput.root
     ]);
 
     subs.push(grok.events.onCurrentCellChanged.subscribe(() => {
@@ -162,7 +179,7 @@ async function getPolyToolEnumerationChemDialog(cell?: DG.Cell): Promise<DG.Dial
         } else if (!molString.includes('R#')) {
           grok.shell.warning('PolyTool: no R group was provided');
         } else {
-          const molecules = await getEnumerationChem(molString, screenLibrary.value!);
+          const molecules = await getEnumerationChem(molString, screenLibraryInput.value!);
           const molCol = DG.Column.fromStrings('Enumerated', molecules);
           const df = DG.DataFrame.fromColumns([molCol]);
           grok.shell.addTableView(df);
@@ -184,6 +201,17 @@ async function getPolyToolEnumerationChemDialog(cell?: DG.Cell): Promise<DG.Dial
     subs.push(dialog.onClose.subscribe(() => {
       destroy();
     }));
+    dialog.history(
+      /* getInput */ (): PolyToolEnumerateChemSerialized => {
+        return {
+          mol: molInput.getMolFile(),
+          screenLibrary: screenLibraryInput.value,
+        };
+      },
+      /* applyInput */ (x: PolyToolEnumerateChemSerialized): void => {
+        molInput.setMolFile(x.mol);
+        screenLibraryInput.value = x.screenLibrary;
+      });
     return dialog;
   } catch (err: any) {
     destroy();
@@ -209,7 +237,7 @@ export async function polyToolConvert(
 
     const resHelmColName = getUnusedName(table, `transformed(${seqCol.name})`);
     const resHelmCol = DG.Column.fromType(DG.COLUMN_TYPE.STRING, resHelmColName, resList.length)
-      .init((rowIdx: number) => { return resList[rowIdx];});
+      .init((rowIdx: number) => { return resList[rowIdx]; });
     resHelmCol.semType = DG.SEMTYPE.MACROMOLECULE;
     resHelmCol.meta.units = NOTATION.HELM;
     resHelmCol.setTag(DG.TAGS.CELL_RENDERER, 'helm');
@@ -217,7 +245,7 @@ export async function polyToolConvert(
 
     const seqHelper: ISeqHelper = await getSeqHelper();
     const toAtomicLevelRes = await seqHelper.helmToAtomicLevel(resHelmCol, chiralityEngine, /* highlight */ generateHelm);
-    const resMolCol = toAtomicLevelRes.molCol;
+    const resMolCol = toAtomicLevelRes.molCol!;
     resMolCol.name = getUnusedName(table, `molfile(${seqCol.name})`);
     resMolCol.semType = DG.SEMTYPE.MOLECULE;
     if (table) {

package/src/polytool/pt-enumeration-chem.ts

@@ -60,12 +60,11 @@ M  END`;
 
 export async function getEnumerationChem(molString: string, screenLibrary: string):
   Promise<string[]> {
-
   const variableMonomers = await getAvailableMonomers(screenLibrary);
   const variableMols = await getAvailableMonomerMols(screenLibrary);
   const enumerations = new Array<string>(variableMonomers.length);
 
-	const rdkitModule: RDModule = await grok.functions.call('Chem:getRdKitModule');
+  const rdkitModule: RDModule = await grok.functions.call('Chem:getRdKitModule');
   const molScaffold: RDMol = rdkitModule.get_mol(molString);
   const smiScaffold = molScaffold.get_smiles();
   molScaffold.delete();
@@ -73,7 +72,6 @@ export async function getEnumerationChem(molString: string, screenLibrary: strin
   const smilesSubsts = new Array<string>(variableMonomers.length);
 
   for (let i = 0; i < variableMonomers.length; i++) {
-			
     const name = variableMonomers[i];
     const molBlock = variableMols[name];
     const molSubst: RDMol = rdkitModule.get_mol(molBlock);
@@ -87,18 +85,16 @@ export async function getEnumerationChem(molString: string, screenLibrary: strin
       //TODO: use RDKit linking function when exposed
       const smiResRaw = `${smiScaffold}.${smilesSubsts[i]}`.replaceAll('[1*]C', 'C([1*])').replaceAll('[1*]c', 'c([1*])').replaceAll('[1*]O', 'O([1*])').replaceAll('[1*]N', 'N([1*])');
       const smiRes = `${smiResRaw}`.replaceAll('([1*])', '9').replaceAll('[1*]', '9');
-      molRes = rdkitModule.get_mol(smiRes, JSON.stringify({mappedDummiesAreRGroups: true}))
-      let molV3 = molRes.get_v3Kmolblock();
+      molRes = rdkitModule.get_mol(smiRes, JSON.stringify({mappedDummiesAreRGroups: true}));
+      const molV3 = molRes.get_v3Kmolblock();
       enumerations[i] = molV3;
-    } 
-    catch(err:any) {
+    } catch (err:any) {
       enumerations[i] = '';
-    }
-    finally {
+    } finally {
       molRes?.delete();
     }
   }
-  
+
 
   return enumerations;
 }

package/src/polytool/pt-enumeration-helm-dialog.ts

@@ -10,7 +10,7 @@ import {NOTATION} from '@datagrok-libraries/bio/src/utils/macromolecule';
 import {HelmAtom, HelmMol} from '@datagrok-libraries/helm-web-editor/src/types/org-helm';
 import {getHelmHelper, HelmInputBase} from '@datagrok-libraries/bio/src/helm/helm-helper';
 import {getMonomerLibHelper} from '@datagrok-libraries/bio/src/monomer-works/monomer-utils';
-import {HelmType, ISeqMonomer} from '@datagrok-libraries/bio/src/helm/types';
+import {HelmType, PolymerType} from '@datagrok-libraries/bio/src/helm/types';
 import {helmTypeToPolymerType} from '@datagrok-libraries/bio/src/monomer-works/monomer-works';
 import {getSeqHelper, ISeqHelper} from '@datagrok-libraries/bio/src/utils/seq-helper';
 import '@datagrok-libraries/bio/src/types/input';
@@ -25,6 +25,7 @@ import {getLibrariesList} from './utils';
 import {doPolyToolEnumerateHelm, PT_HELM_EXAMPLE} from './pt-enumeration-helm';
 import {PolyToolPlaceholdersInput} from './pt-placeholders-input';
 import {defaultErrorHandler} from '../utils/err-info';
+import {PolyToolPlaceholdersBreadthInput} from './pt-placeholders-breadth-input';
 import {PT_UI_DIALOG_ENUMERATION} from './const';
 
 import {_package} from '../package';
@@ -32,15 +33,17 @@ import {_package} from '../package';
 type PolyToolEnumerateInputs = {
   macromolecule: HelmInputBase;
   placeholders: PolyToolPlaceholdersInput;
+  placeholdersBreadth: PolyToolPlaceholdersBreadthInput;
   enumeratorType: DG.ChoiceInput<PolyToolEnumeratorType>
   trivialNameCol: InputColumnBase,
   toAtomicLevel: DG.InputBase<boolean>;
   keepOriginal: DG.InputBase<boolean>;
 };
 
-type PolyToolEnumerateSerialized = {
+type PolyToolEnumerateHelmSerialized = {
   macromolecule: string;
   placeholders: string;
+  placeholdersBreadth: string;
   enumeratorType: PolyToolEnumeratorType;
   trivialNameCol: string;
   toAtomicLevel: boolean;
@@ -82,9 +85,9 @@ export async function polyToolEnumerateHelmUI(cell?: DG.Cell): Promise<void> {
       if (isFirstShow) {
         const dialogInputList = dialog.inputs;
         const dialogRootCash = $(dialog.root);
-        const contentMaxHeight = maxHeight
-          - dialogRootCash.find('div.d4-dialog-header').get(0)!.offsetHeight
-          - dialogRootCash.find('div.d4-dialog-footer').get(0)!.offsetHeight;
+        const contentMaxHeight = maxHeight -
+          dialogRootCash.find('div.d4-dialog-header').get(0)!.offsetHeight -
+          dialogRootCash.find('div.d4-dialog-footer').get(0)!.offsetHeight;
 
         // dialog.inputs2.macromolecule.root.style.backgroundColor = '#CCFFCC';
 
@@ -136,20 +139,27 @@ async function getPolyToolEnumerateDialog(
     const trivialNameSampleDiv = ui.divText('', {style: {marginLeft: '8px', marginTop: '2px'}});
     const warningsTextDiv = ui.divText('', {style: {color: 'red'}});
     inputs = {
+      macromolecule: helmHelper.createHelmInput(
+        'Macromolecule', {editable: false}),
+      placeholders: await PolyToolPlaceholdersInput.create(
+        'Placeholders', {
+          showAddNewRowIcon: true,
+          showRemoveRowIcon: true,
+          showRowHeader: false,
+          showCellTooltip: false,
+        }),
       enumeratorType: ui.input.choice<PolyToolEnumeratorType>(
         'Enumerator type', {
           value: PolyToolEnumeratorTypes.Single,
           items: Object.values(PolyToolEnumeratorTypes)
         }) as DG.ChoiceInput<PolyToolEnumeratorType>,
-      macromolecule: helmHelper.createHelmInput(
-        'Macromolecule', {editable: false}),
-      placeholders: await PolyToolPlaceholdersInput.create(
-        'Placeholders', {
+      placeholdersBreadth: await PolyToolPlaceholdersBreadthInput.create(
+        'Breadth', {
           showAddNewRowIcon: true,
           showRemoveRowIcon: true,
           showRowHeader: false,
           showCellTooltip: false,
-        }/*, 2/**/),
+        }),
       toAtomicLevel: ui.input.bool(
         'To atomic level', {value: false}),
       keepOriginal: ui.input.bool(
@@ -180,9 +190,9 @@ async function getPolyToolEnumerateDialog(
     inputs.placeholders.addValidator((value: string): string | null => {
       const errors: string[] = [];
       try {
-        const missedMonomerList: ISeqMonomer[] = [];
-        for (const [posVal, monomerSymbolList] of Object.entries(inputs.placeholders.placeholdersValue)) {
-          const pos = parseInt(posVal);
+        const missedMonomerList: { polymerType: PolymerType, symbol: string }[] = [];
+        for (const ph of inputs.placeholders.placeholdersValue) {
+          const pos = ph.position;
           if (pos >= inputs.macromolecule.molValue.atoms.length) {
             errors.push(`There is no monomer at position ${pos + 1}.`);
             continue;
@@ -190,7 +200,7 @@ async function getPolyToolEnumerateDialog(
           const a = inputs.macromolecule.molValue.atoms[pos];
           const helmType: HelmType = a.biotype()!;
           const polymerType = helmTypeToPolymerType(helmType);
-          for (const symbol of monomerSymbolList) {
+          for (const symbol of ph.monomers) {
             const substituteMonomer = monomerLib.getMonomer(polymerType, symbol)!;
             // TODO: Check substitution monomer is presented in the library
             if (!substituteMonomer || !substituteMonomer.lib)
@@ -228,8 +238,8 @@ async function getPolyToolEnumerateDialog(
         const hoveredAtom = helmHelper.getHoveredAtom(argsX, argsY, mol, inputs.macromolecule.root.clientHeight);
         if (hoveredAtom) {
           const hoveredAtomContIdx = hoveredAtom._parent.atoms.indexOf(hoveredAtom);
-          const hoveredAtomContIdxStr = (hoveredAtomContIdx + 1).toString();
-          const substitutingMonomers = inputs.placeholders.placeholdersValue[hoveredAtomContIdx];
+          const substitutingMonomers = inputs.placeholders.placeholdersValue
+            .find((ph) => ph.position === hoveredAtomContIdx)?.monomers;
 
           if (substitutingMonomers) {
             const cnt = ui.divText(substitutingMonomers.join(', '));
@@ -259,9 +269,9 @@ async function getPolyToolEnumerateDialog(
           let rowIdx = posList.indexOf(clickedAtomContIdxStr);
           if (rowIdx === -1) {
             rowIdx = posList.findIndex((v) => isNaN(v));
-            if (rowIdx === -1) {
+            if (rowIdx === -1)
               rowIdx = phDf.rows.addNew([clickedAtomContIdxStr, '']).idx;
-            }
+
             phDf.set('Position', rowIdx, clickedAtomContIdxStr);
             // const tgtCell = inputs.placeholders.grid.cell('Monomers', rowIdx);
           }
@@ -377,14 +387,17 @@ async function getPolyToolEnumerateDialog(
         } else /* if (helmSelections === undefined || helmSelections.length < 1) {
           grok.shell.warning('PolyTool: no selection was provided');
         } else /**/ {
-          if (Object.keys(inputs.placeholders.placeholdersValue).length === 0) {
+          if (Object.keys(inputs.placeholders.placeholdersValue).length === 0 &&
+            Object.keys(inputs.placeholdersBreadth.placeholdersBreadthValue).length === 0
+          ) {
             grok.shell.warning(`${PT_UI_DIALOG_ENUMERATION}: placeholders are empty`);
             return;
           }
           await getHelmHelper(); // initializes JSDraw and org
           const params: PolyToolEnumeratorParams = {
-            type: inputs.enumeratorType.value!,
             placeholders: inputs.placeholders.placeholdersValue,
+            type: inputs.enumeratorType.value!,
+            placeholdersBreadth: inputs.placeholdersBreadth.placeholdersBreadthValue,
             keepOriginal: inputs.keepOriginal.value,
           };
           const enumeratorResDf = await polyToolEnumerateHelm(srcHelm, srcId, params, inputs.toAtomicLevel.value, seqHelper);
@@ -399,6 +412,7 @@ async function getPolyToolEnumerateDialog(
       .add(inputs.macromolecule)
       .add(inputs.placeholders)
       .add(inputs.enumeratorType)
+      .add(inputs.placeholdersBreadth)
       .add(inputs.trivialNameCol)
       .add(inputs.toAtomicLevel)
       .add(inputs.keepOriginal)
@@ -412,20 +426,22 @@ async function getPolyToolEnumerateDialog(
       destroy();
     }));
     dialog.history(
-      /* getInput */ (): PolyToolEnumerateSerialized => {
+      /* getInput */ (): PolyToolEnumerateHelmSerialized => {
         return {
           macromolecule: inputs.macromolecule.stringValue,
           placeholders: inputs.placeholders.stringValue,
           enumeratorType: inputs.enumeratorType.value,
+          placeholdersBreadth: inputs.placeholdersBreadth.stringValue,
           trivialNameCol: inputs.trivialNameCol.stringValue,
           toAtomicLevel: inputs.toAtomicLevel.value,
           keepOriginal: inputs.keepOriginal.value,
         };
       },
-      /* applyInput */ (x: PolyToolEnumerateSerialized): void => {
+      /* applyInput */ (x: PolyToolEnumerateHelmSerialized): void => {
         inputs.macromolecule.stringValue = x.macromolecule;
         inputs.placeholders.stringValue = x.placeholders;
         inputs.enumeratorType.value = x.enumeratorType;
+        inputs.placeholdersBreadth.stringValue = x.placeholdersBreadth;
         inputs.trivialNameCol.stringValue = x.trivialNameCol;
         inputs.toAtomicLevel.value = x.toAtomicLevel;
         inputs.keepOriginal.value = x.keepOriginal;
@@ -453,9 +469,8 @@ async function polyToolEnumerateHelm(
     if (toAtomicLevel) {
       const seqHelper: ISeqHelper = await getSeqHelper();
       const toAtomicLevelRes = await seqHelper.helmToAtomicLevel(enumHelmCol, true, true);
-      toAtomicLevelRes.molCol.semType = DG.SEMTYPE.MOLECULE;
-      enumeratorResDf.columns.add(toAtomicLevelRes.molCol, false);
-      enumeratorResDf.columns.add(toAtomicLevelRes.molHighlightCol, false);
+      toAtomicLevelRes.molCol!.semType = DG.SEMTYPE.MOLECULE;
+      enumeratorResDf.columns.add(toAtomicLevelRes.molCol!, false);
     }
 
     if (srcId) {