diff --git a/src/designer/elsa-workflows-studio/package-lock.json b/src/designer/elsa-workflows-studio/package-lock.json index a56d55ce3..63e0ea1c1 100644 --- a/src/designer/elsa-workflows-studio/package-lock.json +++ b/src/designer/elsa-workflows-studio/package-lock.json @@ -1,6 +1,6 @@ { "name": "@elsa-workflows/elsa-workflows-studio", - "version": "2.1.10", + "version": "2.1.11", "lockfileVersion": 1, "requires": true, "dependencies": { diff --git a/src/designer/elsa-workflows-studio/src/components.d.ts b/src/designer/elsa-workflows-studio/src/components.d.ts index 2f9945759..4ef8fc35d 100644 --- a/src/designer/elsa-workflows-studio/src/components.d.ts +++ b/src/designer/elsa-workflows-studio/src/components.d.ts @@ -166,6 +166,7 @@ export namespace Components { "culture": string; } interface ElsaStudioRoot { + "addPlugin": (pluginType: any) => Promise; "addPlugins": (pluginTypes: Array) => Promise; "basePath": string; "culture": string; diff --git a/src/designer/elsa-workflows-studio/src/components/dashboard/pages/elsa-studio-root/elsa-studio-root.tsx b/src/designer/elsa-workflows-studio/src/components/dashboard/pages/elsa-studio-root/elsa-studio-root.tsx index aef38895f..c7c5331db 100644 --- a/src/designer/elsa-workflows-studio/src/components/dashboard/pages/elsa-studio-root/elsa-studio-root.tsx +++ b/src/designer/elsa-workflows-studio/src/components/dashboard/pages/elsa-studio-root/elsa-studio-root.tsx @@ -1,10 +1,11 @@ import {Component, Event, EventEmitter, h, Method, Prop} from '@stencil/core'; import Tunnel, {DashboardState} from "../../../../data/dashboard"; import {ElsaStudio} from "../../../../models"; -import {eventBus, pluginManager, activityIconProvider, confirmDialogService, toastNotificationService, createElsaClient, createHttpClient, ElsaClient} from "../../../../services"; +import {eventBus, pluginManager, activityIconProvider, confirmDialogService, toastNotificationService, createElsaClient, createHttpClient, ElsaClient, propertyDisplayManager} from "../../../../services"; import {AxiosInstance} from "axios"; import {EventTypes} from "../../../../models"; import {ToastNotificationOptions} from "../../../shared/elsa-toast-notification/elsa-toast-notification"; +import {getOrCreateProperty} from "../../../../utils/utils"; @Component({ tag: 'elsa-studio-root', @@ -26,6 +27,11 @@ export class ElsaStudioRoot { pluginManager.registerPlugins(pluginTypes); } + @Method() + async addPlugin(pluginType: any) { + pluginManager.registerPlugin(pluginType); + } + connectedCallback() { eventBus.on(EventTypes.ShowConfirmDialog, e => e.promise = this.confirmDialog.show(e.caption, e.message)); eventBus.on(EventTypes.HideConfirmDialog, () => this.confirmDialog.hide()); @@ -50,15 +56,18 @@ export class ElsaStudioRoot { basePath: this.basePath, eventBus, pluginManager, + propertyDisplayManager, activityIconProvider, confirmDialogService, toastNotificationService, elsaClientFactory, - httpClientFactory + httpClientFactory, + getOrCreateProperty: getOrCreateProperty }; this.initializing.emit(elsaStudio); pluginManager.initialize(elsaStudio); + propertyDisplayManager.initialize(elsaStudio); } render() { diff --git a/src/designer/elsa-workflows-studio/src/index.html b/src/designer/elsa-workflows-studio/src/index.html index 9922cc38a..5525eee2f 100644 --- a/src/designer/elsa-workflows-studio/src/index.html +++ b/src/designer/elsa-workflows-studio/src/index.html @@ -79,6 +79,22 @@ }); }); } + + // Custom activity property type input control driver: + function CustomPropertyFieldDriver(elsaStudio){ + this.display = (activity, property) => { + const prop = elsaStudio.getOrCreateProperty(activity, property.name); + return ` ElsaClient; httpClientFactory: () => AxiosInstance; eventBus: EventBus; activityIconProvider: ActivityIconProvider; confirmDialogService: ConfirmDialogService; toastNotificationService: ToastNotificationService; + getOrCreateProperty: (activity: ActivityModel, name: string, defaultExpression?: () => string, defaultSyntax?: () => string) => ActivityDefinitionProperty } \ No newline at end of file diff --git a/src/designer/elsa-workflows-studio/src/services/property-display-manager.ts b/src/designer/elsa-workflows-studio/src/services/property-display-manager.ts index 0dd0a1325..8d3b12e66 100644 --- a/src/designer/elsa-workflows-studio/src/services/property-display-manager.ts +++ b/src/designer/elsa-workflows-studio/src/services/property-display-manager.ts @@ -1,4 +1,4 @@ -import {ActivityModel, ActivityPropertyDescriptor} from "../models/"; +import {ActivityModel, ActivityPropertyDescriptor, ElsaStudio} from "../models/"; import {PropertyDisplayDriver} from "./property-display-driver"; import {NullPropertyDriver } from "../drivers"; import {Map} from '../utils/utils'; @@ -7,8 +7,18 @@ export type PropertyDisplayDriverMap = Map<() => PropertyDisplayDriver>; export class PropertyDisplayManager { + elsaStudio: ElsaStudio; + initialized: boolean; drivers: PropertyDisplayDriverMap = {}; + initialize(elsaStudio: ElsaStudio) { + if (this.initialized) + return; + + this.elsaStudio = elsaStudio; + this.initialized = true; + } + addDriver(controlType: string, driver: T) { this.drivers[controlType] = () => driver; } @@ -24,8 +34,8 @@ export class PropertyDisplayManager { } getDriver(type: string) { - const driverFactory = this.drivers[type] || (() => new NullPropertyDriver()); - return driverFactory(); + const driverFactory = this.drivers[type] || ((_: ElsaStudio) => new NullPropertyDriver()); + return driverFactory(this.elsaStudio); } } diff --git a/src/designer/elsa-workflows-studio/tailwind.config.js b/src/designer/elsa-workflows-studio/tailwind.config.js index b9d60ab3f..cd2364690 100644 --- a/src/designer/elsa-workflows-studio/tailwind.config.js +++ b/src/designer/elsa-workflows-studio/tailwind.config.js @@ -8,7 +8,7 @@ module.exports = { enabled: !dev, content: ['./src/**/*.tsx', './src/**/*.html'], options: { - safelist: ['hidden', 'jtk-connector', 'rose', 'sky', /gray/, /pink/, /blue/, /green/, /red/, /yellow/, /rose/] + safelist: ['hidden', 'jtk-connector', 'rose', 'sky', /gray/, /pink/, /blue/, /green/, /red/, /yellow/, /rose/, 'label-container', 'node', 'start', 'activity'] }, }, prefix: 'elsa-',