Class decorators
Package functions are typically registered in the main package file package.ts
. Each function has a special
parameter annotation depending on its role.
You can use class decorators to register
such package functions as:
If a function uses a subclass that extends classes from Datagrok JS API, you can use a
decorator @grok.decorators.<name>
. This is equivalent to adding a function to package.ts
. There is no need
to add anything other than the class itself. When you run the build
script for your package, the webpack plugin called
FuncGeneratorPlugin
will add a special package.g.ts
file to your project. Note that it is not on the ignore list, so
you should commit this file to the repository.
Enabling decorators in a package
-
In
tsconfig.json
, enable these experimental options:"experimentalDecorators": true, /* Enables experimental support for ES7 decorators. */
"emitDecoratorMetadata": true, /* Enables experimental support for emitting type metadata for decorators. */ -
In
webpack.config.js
, enableFuncGeneratorPlugin
:const FuncGeneratorPlugin = require('datagrok-tools/plugins/func-gen-plugin');
module.exports = {
/** ... */
plugins: [
new FuncGeneratorPlugin({outputPath: './src/package.g.ts'}),
],
}; -
In
package.json
, adddatagrok-tools
to dev dependencies; upgrade its version, if necessary:"devDependencies": {
"datagrok-tools": "^4.12.x"
}
Examples
Custom viewers
@grok.decorators.viewer({
name: 'Test Viewer',
description: 'Creates a Test Viewer instance',
icon: 'images/icon.png',
toolbox: true,
viewerPath: 'Tests | Show results',
})
export class TestViewer extends DG.JsViewer {
}
Custom filters
@grok.decorators.filter({
name: 'Radio Button Filter',
description: 'Single option filter',
semType: 'Country',
})
export class RadioButtonFilter extends DG.Filter {
}
Custom cell renderers
@grok.decorators.cellRenderer({
name: 'Fasta Sequence Cell Renderer',
description: 'Macromolecule renderer',
cellType: 'sequence',
columnTags: 'quality=Macromolecule, units=fasta',
})
export class MacromoleculeSequenceCellRenderer extends DG.GridCellRenderer {
}
See also: