UI refresh

.eslintignore

@@ -1 +1,2 @@
+dist
 public

.gitignore

@@ -1,2 +1,3 @@
 node_modules
-public
+public
+dist

CHANGELOG.md

@@ -0,0 +1,19 @@
+# Changelog
+
+All notable changes to [@bpmn-io/element-template-chooser](https://github.com/camunda/element-template-chooser) are documented here. We use [semantic versioning](http://semver.org/) for releases.
+
+## Unreleased
+
+___Note:__ Yet to be released changes appear here._
+
+## 0.0.2
+
+* `FEAT`: update styles
+* `FEAT`: provide pre-built distribution + styles ([#1](https://github.com/bpmn-io/element-template-chooser/issues/1))
+* `FEAT`: make agnostic of `elementTemplates` implementation ([#2](https://github.com/bpmn-io/element-template-chooser/issues/2))
+* `FIX`: scroll to keyboard selected entries ([#6](https://github.com/bpmn-io/element-template-chooser/issues/6))
+* `CHORE`: change programmatic API
+
+## 0.0.1
+
+_Initial release._

README.md

@@ -12,6 +12,8 @@ A simple element template chooser for [`properties-panel >= 1`](https://github.c
 ```javascript
 import BpmnModeler from 'bpmn-js/lib/Modeler';
 
+import '@bpmn-io/element-template-chooser/dist/element-template-chooser.css';
+
 import ElementTemplateChooserModule from '@bpmn-io/element-template-chooser';
 
 const modeler = new BpmnModeler({
@@ -35,8 +37,8 @@ modeler.get('elementTemplatesLoader').setTemplates(ELEMENT_TEMPLATES_JSON);
 // from a given list of element templates
 const task = modeler.get('elementRegistry').get('MyTask');
 
-const task = await (
-  modeler.get('elementTemplateChooser').choose(task, ELEMENT_TEMPLATES_JSON)
+const template = await (
+  modeler.get('elementTemplateChooser').open(task, ELEMENT_TEMPLATES_JSON)
 );
 ```
 

example/.camunda/element-templates/example.json

@@ -179,6 +179,148 @@
         }
       }
     ]
+  },  {
+    "$schema": "https://unpkg.com/@camunda/zeebe-element-templates-json-schema/resources/schema.json",
+    "name": "REST Task 1",
+    "id": "io.camunda.examples.RestTask1",
+    "description": "A REST API invocation task.",
+    "appliesTo": [
+      "bpmn:ServiceTask"
+    ],
+    "properties": [
+      {
+        "type": "Hidden",
+        "value": "http",
+        "binding": {
+          "type": "zeebe:taskDefinition:type"
+        }
+      },
+      {
+        "label": "REST Endpoint URL",
+        "description": "Specify the url of the REST API to talk to.",
+        "type": "String",
+        "binding": {
+          "type": "zeebe:taskHeader",
+          "key": "url"
+        },
+        "constraints": {
+          "notEmpty": true,
+          "pattern": {
+            "value": "^https?://.*",
+            "message": "Must be http(s) URL."
+          }
+        }
+      },
+      {
+        "label": "REST Method",
+        "description": "Specify the HTTP method to use.",
+        "type": "Dropdown",
+        "value": "get",
+        "choices": [
+          { "name": "GET", "value": "get" },
+          { "name": "POST", "value": "post" },
+          { "name": "PATCH", "value": "patch" },
+          { "name": "DELETE", "value": "delete" }
+        ],
+        "binding": {
+          "type": "zeebe:taskHeader",
+          "key": "method"
+        }
+      },
+      {
+        "label": "Request Body",
+        "description": "Data to send to the endpoint.",
+        "value": "",
+        "type": "String",
+        "optional": true,
+        "binding": {
+          "type": "zeebe:input",
+          "name": "body"
+        }
+      },
+      {
+        "label": "Result Variable",
+        "description": "Name of variable to store the response data in.",
+        "value": "response",
+        "type": "String",
+        "optional": true,
+        "binding": {
+          "type": "zeebe:output",
+          "source": "= body"
+        }
+      }
+    ]
+  },  {
+    "$schema": "https://unpkg.com/@camunda/zeebe-element-templates-json-schema/resources/schema.json",
+    "name": "REST Task 2",
+    "id": "io.camunda.examples.RestTask2",
+    "description": "A REST API invocation task.",
+    "appliesTo": [
+      "bpmn:ServiceTask"
+    ],
+    "properties": [
+      {
+        "type": "Hidden",
+        "value": "http",
+        "binding": {
+          "type": "zeebe:taskDefinition:type"
+        }
+      },
+      {
+        "label": "REST Endpoint URL",
+        "description": "Specify the url of the REST API to talk to.",
+        "type": "String",
+        "binding": {
+          "type": "zeebe:taskHeader",
+          "key": "url"
+        },
+        "constraints": {
+          "notEmpty": true,
+          "pattern": {
+            "value": "^https?://.*",
+            "message": "Must be http(s) URL."
+          }
+        }
+      },
+      {
+        "label": "REST Method",
+        "description": "Specify the HTTP method to use.",
+        "type": "Dropdown",
+        "value": "get",
+        "choices": [
+          { "name": "GET", "value": "get" },
+          { "name": "POST", "value": "post" },
+          { "name": "PATCH", "value": "patch" },
+          { "name": "DELETE", "value": "delete" }
+        ],
+        "binding": {
+          "type": "zeebe:taskHeader",
+          "key": "method"
+        }
+      },
+      {
+        "label": "Request Body",
+        "description": "Data to send to the endpoint.",
+        "value": "",
+        "type": "String",
+        "optional": true,
+        "binding": {
+          "type": "zeebe:input",
+          "name": "body"
+        }
+      },
+      {
+        "label": "Result Variable",
+        "description": "Name of variable to store the response data in.",
+        "value": "response",
+        "type": "String",
+        "optional": true,
+        "binding": {
+          "type": "zeebe:output",
+          "source": "= body"
+        }
+      }
+    ]
   },
   {
     "$schema": "https://unpkg.com/@camunda/zeebe-element-templates-json-schema/resources/schema.json",

example/app.js

@@ -19,7 +19,7 @@ import fileOpen from 'file-open';
 
 import download from 'downloadjs';
 
-import ElementTemplateChooserModule from '..';
+import ElementTemplateChooserModule from '../src';
 
 import TEMPLATES from './.camunda/element-templates/example.json';