@datagrok/bio 2.17.1 → 2.17.2

package/package.json

@@ -5,7 +5,7 @@
     "name": "Leonid Stolbov",
     "email": "lstolbov@datagrok.ai"
   },
-  "version": "2.17.1",
+  "version": "2.17.2",
   "description": "Bioinformatics support (import/export of sequences, conversion, visualization, analysis). [See more](https://github.com/datagrok-ai/public/blob/master/packages/Bio/README.md) for details.",
   "repository": {
     "type": "git",
@@ -13,6 +13,13 @@
     "directory": "packages/Bio"
   },
   "properties": [
+    {
+      "name": "FontSize",
+      "description": "Font size for monomer symbols in the sequence renderer",
+      "propertyType": "int",
+      "defaultValue": "12",
+      "nullable": false
+    },
     {
       "name": "MaxMonomerLength",
       "description": "The max length of monomer symbol displayed without shortening, 'long' to no limit",
@@ -37,7 +44,7 @@
   ],
   "dependencies": {
     "@biowasm/aioli": "^3.1.0",
-    "@datagrok-libraries/bio": "^5.45.11",
+    "@datagrok-libraries/bio": "^5.46.0",
     "@datagrok-libraries/chem-meta": "^1.2.7",
     "@datagrok-libraries/math": "^1.2.2",
     "@datagrok-libraries/ml": "^6.7.4",

package/src/package-types.ts

@@ -16,6 +16,7 @@ export const enum BioPackagePropertiesNames {
   MaxMonomerLength = 'MaxMonomerLength',
   TooltipWebLogo = 'TooltipWebLogo',
   DefaultSeparator = 'DefaultSeparator',
+  FontSize = 'FontSize',
 }
 
 
@@ -23,6 +24,16 @@ export class BioPackageProperties extends Map<string, any> {
   private _onPropertyChanged: Subject<string> = new Subject<string>();
   public get onPropertyChanged(): Observable<string> { return this._onPropertyChanged; }
 
+  public get fontSize(): number {
+    const vs = super.get(BioPackagePropertiesNames.FontSize);
+    return !!vs && !isNaN(vs) ? Number.parseInt(vs) : 12;
+  }
+
+  public set fontSize(value: number) {
+    super.set(BioPackagePropertiesNames.FontSize, value);
+    this._onPropertyChanged.next(BioPackagePropertiesNames.FontSize);
+  }
+
   /** Monomer symbol maximum length displayed, null for unlimited. */
   public get maxMonomerLength(): number | null {
     const vs = super.get(BioPackagePropertiesNames.MaxMonomerLength);

package/src/tests/renderers-monomer-placer-tests.ts

@@ -1,3 +1,4 @@
+/* eslint-disable max-lines-per-function */
 import * as grok from 'datagrok-api/grok';
 import * as DG from 'datagrok-api/dg';
 import * as ui from 'datagrok-api/ui';
@@ -49,7 +50,7 @@ category('renderers: monomerPlacer', () => {
         {src: {row: 1, x: 6}, tgt: {pos: 0}},
         {src: {row: 1, x: 26}, tgt: {pos: 1}},
         {src: {row: 1, x: 160}, tgt: {pos: 6}},
-        {src: {row: 1, x: 185}, tgt: {pos: 7}},
+        {src: {row: 1, x: 190}, tgt: {pos: 7}},
         {src: {row: 2, x: 140}, tgt: {pos: 5}},
         {src: {row: 2, x: 145}, tgt: {pos: 5}},
       ]
@@ -115,7 +116,8 @@ id3,QHIRE--LT
       const colTemp: MonomerPlacer = new MonomerPlacer(null, seqCol, _package.logger, monLength,
         () => {
           return {
-            monomerCharWidth: charWidth,
+            font: '12px monospace',
+            fontCharWidth: charWidth,
             separatorWidth: sepWidth,
             monomerToShort: monomerToShort,
           };
@@ -209,7 +211,8 @@ id3,QHIRE--LT
       const sepWidth: number = 12;
       const colTemp = new MonomerPlacer(null, seqCol, _package.logger, monLengthLimit, () => {
         return {
-          monomerCharWidth: charWidth,
+          fontCharWidth: charWidth,
+          font: '12px monospace',
           separatorWidth: sepWidth,
           monomerToShort: monomerToShort,
         };

package/src/utils/cell-renderer.ts

@@ -168,8 +168,9 @@ export class MacromoleculeSequenceCellRenderer extends DG.GridCellRenderer {
     if (!seqColTemp) {
       seqColTemp = temp.rendererBack = new MonomerPlacer(gridCol, tableCol, _package.logger, maxLengthOfMonomer,
         () => {
+          const {font, fontWidth} = MonomerPlacer.getFontSettings(tableCol);
           return {
-            monomerCharWidth: 7, separatorWidth: !sh.isMsa() ? gapLength : msaGapLength,
+            font: font, fontCharWidth: fontWidth, separatorWidth: !sh.isMsa() ? gapLength : msaGapLength,
             monomerToShort: monomerToShortFunction,
           };
         });

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

@@ -1,3 +1,7 @@
+/* eslint-disable max-lines */
+/* eslint-disable max-len */
+/* eslint-disable max-params */
+/* eslint-disable max-lines-per-function */
 import * as grok from 'datagrok-api/grok';
 import * as ui from 'datagrok-api/ui';
 import * as DG from 'datagrok-api/dg';
@@ -548,7 +552,7 @@ export class WebLogoViewer extends DG.JsViewer implements IWebLogoViewer {
         style: {
           display: 'flex',
           flexDirection: 'row',
-          flexGrow: 0,
+          flexGrow: '0',
           /** For alignContent to have an effect */ flexWrap: 'wrap',
           /* backgroundColor: '#EEFFEE' */
         }

package/src/widgets/representations.ts

@@ -1,3 +1,4 @@
+/* eslint-disable max-lines-per-function */
 import * as grok from 'datagrok-api/grok';
 import * as ui from 'datagrok-api/ui';
 import * as DG from 'datagrok-api/dg';
@@ -49,6 +50,24 @@ export function getMacromoleculeColumnPropertyPanel(col: DG.Column): DG.Widget {
     tooltipText: `The max length of monomer symbol displayed without shortening, empty to no limit`
   });
 
+  let fontSize: number | null = (_package.properties ? _package.properties.fontSize : 12);
+  if (MmcrTemps.fontSize in col.temp && !!col.temp[MmcrTemps.fontSize] && !isNaN(col.temp[MmcrTemps.fontSize]))
+    fontSize = col.temp[MmcrTemps.fontSize];
+
+  const fontSizeInput = ui.input.int('Font Size', {
+    value: fontSize!,
+    nullable: true, min: 1, max: 50, step: 1,
+    onValueChanged: (value) => {
+      if (value && value > 0) {
+        const newValue = value ?? 12;
+        col.temp[MmcrTemps.fontSize] = newValue;
+        col.temp[MmcrTemps.rendererSettingsChanged] = rendererSettingsChangedState.true;
+        col.dataFrame.fireValuesChanged();
+      }
+    },
+    tooltipText: `The font size of monomer symbol in sequence renderer`
+  });
+
   const gapLengthInput = ui.input.int('Monomer Margin', {
     value: col.temp[MmcrTemps.gapLength] ?? 0,
     onValueChanged: (value) => {
@@ -88,7 +107,8 @@ export function getMacromoleculeColumnPropertyPanel(col: DG.Column): DG.Widget {
     tooltipText: 'When on, all sequences get rendered in the "diff" mode'
   });
 
-  const rdKitInputs = ui.inputs([
+  const sequenceConfigInputs = ui.inputs([
+    fontSizeInput,
     maxMonomerLengthInput,
     gapLengthInput,
     referenceSequenceInput,
@@ -96,7 +116,7 @@ export function getMacromoleculeColumnPropertyPanel(col: DG.Column): DG.Widget {
     compareWithCurrentInput,
   ]);
 
-  return new DG.Widget(rdKitInputs);
+  return new DG.Widget(sequenceConfigInputs);
 }
 
 /**