Plugin Structure

Your project can become an Act! plugin through the following key files:

• A manifest describing your plugin
• The use of the @act/plugins library for any data access or application hooks
• The use of the @act/web-components library to give your application the look and feel of Act!

Let's discuss the two major components for your Act! plugin.

Manifest

The manifest defines the plugin to the Act! application. It contains any information necessary to display/link the Act! application to your plugin. Here is an example manifest:

{
  "actions": "http://localhost:3000/actions.js",
  "company": "Your Company",
  "description": "DESCRIPTION",
  "extensions": [{
    "type": "view",
    "payload": {
      "src": "http://localhost:8000/index.html",
      "name": "plugin-docs",
      "label": "PLUGIN_DOCS",
      "icon": "note"
    }
  }],
  "name": "Your Plugin Name",
  "permissions": {
    "dialog": "false"
  },
  "settings": "",
  "supportEmail": "",
  "translations": {
    "de": {
      "DESCRIPTION": "Description of your plugin"
    },
    "en-GB": {
      "DESCRIPTION": "Description of your plugin"
    },
    "en-US": {
      "DESCRIPTION": "Description of your plugin"
    },
    "fr": {
      "DESCRIPTION": "Description of your plugin"
    }
  },
  "version": {
    "major": 0,
    "minor": 0,
    "patch": 0
  },
  "views": []
}

Properties may be used to show the item within the Plugin Marketplace for Act!.

Code

Your project will consist of HTML/CSS/JS elements. Anything that requires data access or is dynamic by nature will need to be a JS based application. Your project can take whatever structure desired, but it must contain the necessary code to link your plugin to the Act! application. This is done through the @act/plugins library through the following code snippet:

import { ActPlugin } from '@act/plugins';

const actPlugin = new ActPlugin();
actPlugin.init(window);

Please consider using the @act/web-components library for your front-end elements to make your plugins look and feel like Act!

Actions

If your plugin has any action extensions, then you will need to write a set of global functions to be exposed to the Act! application. Because your code will be ran in a WebWorker (see restrictions on importing third party libraries within WebWorkers), Act! automatically exposes the actPlugin global object for you. Please note that this means all code associated with the actions file should be standard JavaScript without any third party libraries. If you require use of a third party library, you will need to utilize a bundling tool such as Webpack to ensure that all necessary dependencies are bundled into a single actions.js file. Please ensure that the file referenced in your manifest points to the generated file.