@datagrok/bio 2.0.22 → 2.0.23

package/package.json

@@ -5,7 +5,7 @@
     "name": "Leonid Stolbov",
     "email": "lstolbov@datagrok.ai"
   },
-  "version": "2.0.22",
+  "version": "2.0.23",
   "description": "Bio is a [package](https://datagrok.ai/help/develop/develop#packages) for the [Datagrok](https://datagrok.ai) platform",
   "repository": {
     "type": "git",
@@ -17,7 +17,7 @@
     "@datagrok-libraries/bio": "^5.1.1",
     "@datagrok-libraries/chem-meta": "1.0.1",
     "@datagrok-libraries/ml": "^6.2.0",
-    "@datagrok-libraries/utils": "^1.10.1",
+    "@datagrok-libraries/utils": "^1.11.0",
     "@deck.gl/core": "^8.7.5",
     "@deck.gl/layers": "^8.7.5",
     "@luma.gl/constants": "^8.5.10",

package/src/package-test.ts

@@ -24,8 +24,9 @@ export {tests};
 //name: test
 //input: string category {optional: true}
 //input: string test {optional: true}
+//input: bool catchUnhandled {optional: true}
 //output: dataframe result
-export async function test(category: string, test: string): Promise<DG.DataFrame> {
-  const data = await runTests({category, test});
+export async function test(category: string, test: string, catchUnhandled: boolean): Promise<DG.DataFrame> {
+  const data = await runTests({category, test, catchUnhandled});
   return DG.DataFrame.fromObjects(data)!;
 }

package/src/widgets/bio-substructure-filter.ts

@@ -183,20 +183,18 @@ class SeparatorFilter extends FastaFilter {
 
 class HelmFilter extends BioFilterBase {
   helmEditor: any;
-  _filterPanel = ui.div('', {style: {width: '100px', height: '100px'}});
+  _filterPanel = ui.div('', {style: {cursor: 'pointer'}});
   helmSubstructure = '';
-  editDiv = ui.divText('Click to edit', {style: {cursor: 'pointer'}});
 
   constructor() {
     super();
     this.init();
-    ui.setUpdateIndicator(this._filterPanel, true);
   }
 
   async init() {
     this.helmEditor = await grok.functions.call('HELM:helmWebEditor');
-    updateDivInnerHTML(this._filterPanel, this.editDiv);
-    ui.setUpdateIndicator(this._filterPanel, false);
+    await ui.tools.waitForElementInDom(this._filterPanel);
+    this.updateFilterPanel();
     this._filterPanel.addEventListener('click', (event: MouseEvent) => {
       //@ts-ignore
       ui.dialog({showHeader: false, showFooter: true})
@@ -204,14 +202,16 @@ class HelmFilter extends BioFilterBase {
         .onOK(() => {
           const helmString = this.helmEditor
             .webEditor.canvas.getHelm(true).replace(/<\/span>/g, '').replace(/<span style='background:#bbf;'>/g, '');
-          if (helmString) {
-            updateDivInnerHTML(this._filterPanel, this.helmEditor.host);
-            this.helmEditor.editor.setHelm(helmString);
-          } else { updateDivInnerHTML(this._filterPanel, this.editDiv); }
+          this.updateFilterPanel(helmString);
           this.helmSubstructure = helmString;
           this.onChanged.next();
         }).show({modal: true, fullScreen: true});
     });
+    ui.onSizeChanged(this._filterPanel).subscribe((_) => {
+      const helmString = this.helmEditor
+        .webEditor.canvas.getHelm(true).replace(/<\/span>/g, '').replace(/<span style='background:#bbf;'>/g, '');
+      this.updateFilterPanel(helmString);
+    });
   }
 
   get filterPanel() {
@@ -225,4 +225,26 @@ class HelmFilter extends BioFilterBase {
   set substructure(s: string) {
     this.helmEditor.editor.setHelm(s);
   }
+
+  updateFilterPanel(helmString?: string) {
+    const width = this._filterPanel.parentElement!.clientWidth < 100 ? 100 :
+      this._filterPanel.parentElement!.clientWidth;
+    const height = width / 2;
+    if (!helmString) {
+      const editDivStyle = {style: {
+        width: `${width}px`,
+        height: `${height/2}px`,
+        textAlign: 'center',
+        verticalAlign: 'middle',
+        lineHeight: `${height/2}px`,
+        border: '1px solid #dbdcdf'
+      }};
+      const editDiv = ui.divText('Click to edit', editDivStyle);
+      updateDivInnerHTML(this._filterPanel, editDiv);
+    } else {
+      updateDivInnerHTML(this._filterPanel, this.helmEditor.host);
+      this.helmEditor.editor.setHelm(helmString);
+      this.helmEditor.resizeEditor(width, height);
+    }
+  }
 }