Initialize Sequential Workflow Editor Pro

Create a new auth token for your GitHub account with the read:packages permission. Next, create .npmrc file in the root folder of your project and pass there your auth token.

registry=https://registry.npmjs.org/
@nocode-js:registry=https://npm.pkg.github.com/
//npm.pkg.github.com/:_authToken=<YOUR_AUTH_TOKEN>

Install the following dependencies.

npm i sequential-workflow-editor
npm i @nocode-js/sequential-workflow-editor-model-pro
npm i @nocode-js/sequential-workflow-editor-pro

We strongly recommend using the same minor version for the editor and pro packages, as different minor versions may lead to compatibility issues.

✅ "sequential-workflow-editor": "^0.14.4",
✅ "@nocode-js/sequential-workflow-editor-model-pro": "^0.14.4",
✅ "@nocode-js/sequential-workflow-editor-pro": "^0.14.4"

🚫 "sequential-workflow-editor": "^0.11.0",
🚫 "@nocode-js/sequential-workflow-editor-model-pro": "^0.14.4",
🚫 "@nocode-js/sequential-workflow-editor-pro": "^0.14.4"

Some extensions require to attach additional CSS files. More details you can find on a specific extension page.

import '@nocode-js/sequential-workflow-editor-pro/css/value-editors/rich-variable-definitions.css';

The pro package is modular. You can choose features what you want to activate. More details you can find on a specific extension page.

import { StringsValueEditorExtension } from '@nocode-js/sequential-workflow-editor-pro/value-editors/strings';

const editorProvider = EditorProvider.create(definitionModel, {
  extensions: [
    StringsValueEditorExtension.create()
  ],
  // ...
});

That's it!