sartography
/
bpmn-js-spiffworkflow
mirror of https://github.com/sartography/bpmn-js-spiffworkflow.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Vite support (#85) 

* renamed js files to jsx where appropriate w/ burnettk

* removed unused import to unknown module w/ burnettk

* load React from jsx files explicitly w/ burnettk

* fixed tests w/ burnettk

---------

Co-authored-by: jasquat <jasquat@users.noreply.github.com>
This commit is contained in:
jasquat 2024-04-15 18:39:39 +00:00 committed by GitHub
parent 30084ae2e7
commit 50956e496b
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
12 changed files with 302 additions and 265 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

61
app/spiffworkflow/DataObject/propertiesPanel/DataObjectSelect.js → app/spiffworkflow/DataObject/propertiesPanel/DataObjectSelect.jsx
View File

@ -1,3 +1,4 @@
import React from 'react';
import { useService } from 'bpmn-js-properties-panel'; import { useService } from 'bpmn-js-properties-panel';
import { SelectEntry } from '@bpmn-io/properties-panel'; import { SelectEntry } from '@bpmn-io/properties-panel';
import { findDataObjects } from '../DataObjectHelpers'; import { findDataObjects } from '../DataObjectHelpers';
@ -24,59 +25,63 @@ export function DataObjectSelect(props) {
const commandStack = props.commandStack; const commandStack = props.commandStack;
const debounce = useService('debounceInput'); const debounce = useService('debounceInput');
const getValue = () => { const getValue = () => {
return element.businessObject.dataObjectRef.id return element.businessObject.dataObjectRef.id;
} };
const setValue = value => { const setValue = (value) => {
const businessObject = element.businessObject; const businessObject = element.businessObject;
const dataObjects = findDataObjects(businessObject.$parent) const dataObjects = findDataObjects(businessObject.$parent);
for (const dataObject of dataObjects) { for (const dataObject of dataObjects) {
if (dataObject.$type === 'bpmn:DataObject' && dataObject.id === value) { if (dataObject.$type === 'bpmn:DataObject' && dataObject.id === value) {
commandStack.execute('element.updateModdleProperties', { commandStack.execute('element.updateModdleProperties', {
element: element, element: element,
moddleElement: businessObject, moddleElement: businessObject,
properties: { properties: {
dataObjectRef: dataObject dataObjectRef: dataObject,
} },
}); });
// Construct the new name by : the dataObject name and the current state // Construct the new name by : the dataObject name and the current state
const stateName = businessObject.dataState && businessObject.dataState.name ? businessObject.dataState.name : ''; const stateName =
const newName = stateName ? `${dataObject.name} [${stateName}]` : dataObject.name; businessObject.dataState && businessObject.dataState.name
? businessObject.dataState.name
: '';
const newName = stateName
? `${dataObject.name} [${stateName}]`
: dataObject.name;
// Update the name property of the DataObjectReference // Update the name property of the DataObjectReference
commandStack.execute('element.updateProperties', { commandStack.execute('element.updateProperties', {
element: element, element: element,
properties: { properties: {
name: newName name: newName,
} },
}); });
} }
} }
} };
const getOptions = value => { const getOptions = (value) => {
const businessObject = element.businessObject; const businessObject = element.businessObject;
const parent = businessObject.$parent; const parent = businessObject.$parent;
let dataObjects = findDataObjects(parent); let dataObjects = findDataObjects(parent);
let options = []; let options = [];
dataObjects.forEach(dataObj => { dataObjects.forEach((dataObj) => {
options.push({ label: dataObj.id, value: dataObj.id }) options.push({ label: dataObj.id, value: dataObj.id });
}); });
return options; return options;
} };
return <SelectEntry
id={'selectDataObject'}
element={element}
description={"Select the Data Object this represents."}
label={"Which Data Object does this reference?"}
getValue={getValue}
setValue={setValue}
getOptions={getOptions}
debounce={debounce}
/>;
return (
<SelectEntry
id={'selectDataObject'}
element={element}
description={'Select the Data Object this represents.'}
label={'Which Data Object does this reference?'}
getValue={getValue}
setValue={setValue}
getOptions={getOptions}
debounce={debounce}
/>
);
} }

141
app/spiffworkflow/extensions/propertiesPanel/ExtensionsPropertiesProvider.js → app/spiffworkflow/extensions/propertiesPanel/ExtensionsPropertiesProvider.jsx
View File

@ -1,3 +1,4 @@
import React from 'react';
import { import {
ListGroup, ListGroup,
CheckboxEntry, CheckboxEntry,
@ -7,16 +8,20 @@ import { is, isAny } from 'bpmn-js/lib/util/ModelUtil';
import scriptGroup, { SCRIPT_TYPE } from './SpiffScriptGroup'; import scriptGroup, { SCRIPT_TYPE } from './SpiffScriptGroup';
import { import {
ServiceTaskParameterArray, ServiceTaskParameterArray,
ServiceTaskOperatorSelect, ServiceTaskResultTextInput, ServiceTaskOperatorSelect,
ServiceTaskResultTextInput,
} from './SpiffExtensionServiceProperties'; } from './SpiffExtensionServiceProperties';
import {OPTION_TYPE, spiffExtensionOptions, SpiffExtensionSelect} from './SpiffExtensionSelect'; import {
import {SpiffExtensionLaunchButton} from './SpiffExtensionLaunchButton'; OPTION_TYPE,
import {SpiffExtensionTextArea} from './SpiffExtensionTextArea'; spiffExtensionOptions,
import {SpiffExtensionTextInput} from './SpiffExtensionTextInput'; SpiffExtensionSelect,
import {SpiffExtensionCheckboxEntry} from './SpiffExtensionCheckboxEntry'; } from './SpiffExtensionSelect';
import {hasEventDefinition} from 'bpmn-js/lib/util/DiUtil'; import { SpiffExtensionLaunchButton } from './SpiffExtensionLaunchButton';
import { PropertyDescription } from 'bpmn-js-properties-panel/'; import { SpiffExtensionTextArea } from './SpiffExtensionTextArea';
import {setExtensionValue} from "../extensionHelpers"; import { SpiffExtensionTextInput } from './SpiffExtensionTextInput';
import { SpiffExtensionCheckboxEntry } from './SpiffExtensionCheckboxEntry';
import { hasEventDefinition } from 'bpmn-js/lib/util/DiUtil';
import { setExtensionValue } from '../extensionHelpers';
const LOW_PRIORITY = 500; const LOW_PRIORITY = 500;
@ -31,12 +36,14 @@ export default function ExtensionsPropertiesProvider(
return function (groups) { return function (groups) {
if (is(element, 'bpmn:ScriptTask')) { if (is(element, 'bpmn:ScriptTask')) {
groups.push( groups.push(
createScriptGroup(element, translate, moddle, commandStack) createScriptGroup(element, translate, moddle, commandStack),
); );
} else if ( } else if (
isAny(element, ['bpmn:Task', 'bpmn:CallActivity', 'bpmn:SubProcess']) isAny(element, ['bpmn:Task', 'bpmn:CallActivity', 'bpmn:SubProcess'])
) { ) {
groups.push(preScriptPostScriptGroup(element, translate, moddle, commandStack)); groups.push(
preScriptPostScriptGroup(element, translate, moddle, commandStack),
);
} }
if (is(element, 'bpmn:UserTask')) { if (is(element, 'bpmn:UserTask')) {
groups.push(createUserGroup(element, translate, moddle, commandStack)); groups.push(createUserGroup(element, translate, moddle, commandStack));
@ -44,7 +51,7 @@ export default function ExtensionsPropertiesProvider(
if (is(element, 'bpmn:BusinessRuleTask')) { if (is(element, 'bpmn:BusinessRuleTask')) {
groups.push( groups.push(
createBusinessRuleGroup(element, translate, moddle, commandStack) createBusinessRuleGroup(element, translate, moddle, commandStack),
); );
} }
if ( if (
@ -60,31 +67,29 @@ export default function ExtensionsPropertiesProvider(
]) ])
) { ) {
groups.push( groups.push(
createUserInstructionsGroup(element, translate, moddle, commandStack) createUserInstructionsGroup(element, translate, moddle, commandStack),
); );
} }
if ( if (isAny(element, ['bpmn:ManualTask', 'bpmn:UserTask'])) {
isAny(element, [
'bpmn:ManualTask',
'bpmn:UserTask',
])
) {
groups.push( groups.push(
createAllowGuestGroup(element, translate, moddle, commandStack) createAllowGuestGroup(element, translate, moddle, commandStack),
); );
} }
if ( if (
is(element, 'bpmn:BoundaryEvent') && is(element, 'bpmn:BoundaryEvent') &&
hasEventDefinition(element, 'bpmn:SignalEventDefinition') && hasEventDefinition(element, 'bpmn:SignalEventDefinition') &&
isAny(element.businessObject.attachedToRef, ['bpmn:ManualTask', 'bpmn:UserTask']) isAny(element.businessObject.attachedToRef, [
'bpmn:ManualTask',
'bpmn:UserTask',
])
) { ) {
groups.push( groups.push(
createSignalButtonGroup(element, translate, moddle, commandStack) createSignalButtonGroup(element, translate, moddle, commandStack),
); );
} }
if (is(element, 'bpmn:ServiceTask')) { if (is(element, 'bpmn:ServiceTask')) {
groups.push( groups.push(
createServiceGroup(element, translate, moddle, commandStack) createServiceGroup(element, translate, moddle, commandStack),
); );
} }
@ -154,7 +159,7 @@ function preScriptPostScriptGroup(element, translate, moddle, commandStack) {
}), }),
]; ];
const loopCharacteristics = element.businessObject.loopCharacteristics; const loopCharacteristics = element.businessObject.loopCharacteristics;
if (typeof(loopCharacteristics) !== 'undefined') { if (typeof loopCharacteristics !== 'undefined') {
entries.push({ entries.push({
id: 'scriptValence', id: 'scriptValence',
component: ScriptValenceCheckbox, component: ScriptValenceCheckbox,
@ -170,7 +175,6 @@ function preScriptPostScriptGroup(element, translate, moddle, commandStack) {
} }
function ScriptValenceCheckbox(props) { function ScriptValenceCheckbox(props) {
const { element, commandStack } = props; const { element, commandStack } = props;
const getValue = () => { const getValue = () => {
@ -204,16 +208,38 @@ function ScriptValenceCheckbox(props) {
* @returns entries * @returns entries
*/ */
function createUserGroup(element, translate, moddle, commandStack) { function createUserGroup(element, translate, moddle, commandStack) {
const updateExtensionProperties = (
const updateExtensionProperties = (element, name, value, moddle, commandStack) => { element,
const uiName = value.replace('schema\.json', 'uischema\.json') name,
setExtensionValue(element, 'formJsonSchemaFilename', value, moddle, commandStack); value,
setExtensionValue(element, 'formUiSchemaFilename', uiName, moddle, commandStack); moddle,
const matches = spiffExtensionOptions[OPTION_TYPE.json_schema_files].filter((opt) => opt.value === value); commandStack,
) => {
const uiName = value.replace('schema.json', 'uischema.json');
setExtensionValue(
element,
'formJsonSchemaFilename',
value,
moddle,
commandStack,
);
setExtensionValue(
element,
'formUiSchemaFilename',
uiName,
moddle,
commandStack,
);
const matches = spiffExtensionOptions[OPTION_TYPE.json_schema_files].filter(
(opt) => opt.value === value,
);
if (matches.length === 0) { if (matches.length === 0) {
spiffExtensionOptions[OPTION_TYPE.json_schema_files].push({label: value, value: value}); spiffExtensionOptions[OPTION_TYPE.json_schema_files].push({
label: value,
value: value,
});
} }
} };
return { return {
id: 'user_task_properties', id: 'user_task_properties',
@ -239,7 +265,7 @@ function createUserGroup(element, translate, moddle, commandStack) {
event: 'spiff.file.edit', event: 'spiff.file.edit',
listenEvent: 'spiff.jsonSchema.update', listenEvent: 'spiff.jsonSchema.update',
listenFunction: updateExtensionProperties, listenFunction: updateExtensionProperties,
description: translate('Edit the form schema') description: translate('Edit the form schema'),
}, },
], ],
}; };
@ -288,12 +314,7 @@ function createBusinessRuleGroup(element, translate, moddle, commandStack) {
* @param moddle * @param moddle
* @returns entries * @returns entries
*/ */
function createUserInstructionsGroup ( function createUserInstructionsGroup(element, translate, moddle, commandStack) {
element,
translate,
moddle,
commandStack
) {
return { return {
id: 'instructions', id: 'instructions',
label: translate('Instructions'), label: translate('Instructions'),
@ -305,7 +326,8 @@ function createUserInstructionsGroup (
component: SpiffExtensionTextArea, component: SpiffExtensionTextArea,
name: 'spiffworkflow:InstructionsForEndUser', name: 'spiffworkflow:InstructionsForEndUser',
label: 'Instructions', label: 'Instructions',
description: 'Displayed above user forms or when this task is executing.', description:
'Displayed above user forms or when this task is executing.',
}, },
{ {
element, element,
@ -317,7 +339,7 @@ function createUserInstructionsGroup (
event: 'spiff.markdown.edit', event: 'spiff.markdown.edit',
listenEvent: 'spiff.markdown.update', listenEvent: 'spiff.markdown.update',
description: translate('Edit the form schema'), description: translate('Edit the form schema'),
} },
], ],
}; };
} }
@ -329,12 +351,7 @@ function createUserInstructionsGroup (
* @param moddle * @param moddle
* @returns entries * @returns entries
*/ */
function createAllowGuestGroup ( function createAllowGuestGroup(element, translate, moddle, commandStack) {
element,
translate,
moddle,
commandStack
) {
return { return {
id: 'allow_guest_user', id: 'allow_guest_user',
label: translate('Guest options'), label: translate('Guest options'),
@ -346,7 +363,8 @@ function createAllowGuestGroup (
component: SpiffExtensionCheckboxEntry, component: SpiffExtensionCheckboxEntry,
name: 'spiffworkflow:AllowGuest', name: 'spiffworkflow:AllowGuest',
label: 'Guest can complete this task', label: 'Guest can complete this task',
description: 'Allow a guest user to complete this task without logging in. They will not be allowed to do anything but submit this task. If another task directly follows it that allows guest access, they could also complete that task.', description:
'Allow a guest user to complete this task without logging in. They will not be allowed to do anything but submit this task. If another task directly follows it that allows guest access, they could also complete that task.',
}, },
{ {
element, element,
@ -355,7 +373,8 @@ function createAllowGuestGroup (
component: SpiffExtensionTextArea, component: SpiffExtensionTextArea,
name: 'spiffworkflow:GuestConfirmation', name: 'spiffworkflow:GuestConfirmation',
label: 'Guest confirmation', label: 'Guest confirmation',
description: 'This is markdown that is displayed to the user after they complete the task. If this is filled out then the user will not be able to complete additional tasks without a new link to the next task.', description:
'This is markdown that is displayed to the user after they complete the task. If this is filled out then the user will not be able to complete additional tasks without a new link to the next task.',
}, },
{ {
element, element,
@ -366,7 +385,7 @@ function createAllowGuestGroup (
label: translate('Launch Editor'), label: translate('Launch Editor'),
event: 'spiff.markdown.edit', event: 'spiff.markdown.edit',
listenEvent: 'spiff.markdown.update', listenEvent: 'spiff.markdown.update',
} },
], ],
}; };
} }
@ -379,15 +398,14 @@ function createAllowGuestGroup (
* @param moddle * @param moddle
* @returns entries * @returns entries
*/ */
function createSignalButtonGroup ( function createSignalButtonGroup(element, translate, moddle, commandStack) {
element, let description = (
translate, <p style={{ maxWidth: '330px' }}>
moddle, {' '}
commandStack If attached to a user/manual task, setting this value will display a
) { button which a user can click to immediately fire this signal event.
let description =
<p style={{maxWidth : "330px"}}> If attached to a user/manual task, setting this value will display a button which a user can click to immediately fire this signal event.
</p> </p>
);
return { return {
id: 'signal_button', id: 'signal_button',
label: translate('Button'), label: translate('Button'),
@ -399,13 +417,12 @@ function createSignalButtonGroup (
component: SpiffExtensionTextInput, component: SpiffExtensionTextInput,
name: 'spiffworkflow:SignalButtonLabel', name: 'spiffworkflow:SignalButtonLabel',
label: 'Button Label', label: 'Button Label',
description: description description: description,
}, },
], ],
}; };
} }
/** /**
* Create a group on the main panel with a text box (for choosing the dmn to connect) * Create a group on the main panel with a text box (for choosing the dmn to connect)
* @param element * @param element
@ -441,7 +458,7 @@ function createServiceGroup(element, translate, moddle, commandStack) {
element, element,
moddle, moddle,
translate, translate,
commandStack commandStack,
}), }),
}, },
], ],

36
app/spiffworkflow/extensions/propertiesPanel/SpiffExtensionCheckboxEntry.js
View File

@ -1,36 +0,0 @@
import {useService } from 'bpmn-js-properties-panel';
import {CheckboxEntry} from '@bpmn-io/properties-panel';
import {
getExtensionValue, setExtensionValue
} from '../extensionHelpers';
/**
* A generic properties' editor for text area.
*/
export function SpiffExtensionCheckboxEntry(props) {
const element = props.element;
const commandStack = props.commandStack, moddle = props.moddle;
const name = props.name, label = props.label, description = props.description;
const debounce = useService('debounceInput');
const getValue = () => {
return getExtensionValue(element.businessObject, name)
}
const setValue = value => {
setExtensionValue(element, name, value, moddle, commandStack)
};
return <CheckboxEntry
id={'extension_' + name}
element={element}
description={description}
label={label}
getValue={getValue}
setValue={setValue}
debounce={debounce}
/>;
}

38
app/spiffworkflow/extensions/propertiesPanel/SpiffExtensionCheckboxEntry.jsx Normal file
View File

@ -0,0 +1,38 @@
import React from 'react';
import { CheckboxEntry } from '@bpmn-io/properties-panel';
import { useService } from 'bpmn-js-properties-panel';
import { getExtensionValue, setExtensionValue } from '../extensionHelpers';
/**
* A generic properties' editor for text area.
*/
export function SpiffExtensionCheckboxEntry(props) {
const element = props.element;
const commandStack = props.commandStack,
moddle = props.moddle;
const name = props.name,
label = props.label,
description = props.description;
const debounce = useService('debounceInput');
const getValue = () => {
return getExtensionValue(element.businessObject, name);
};
const setValue = (value) => {
setExtensionValue(element, name, value, moddle, commandStack);
};
return (
<CheckboxEntry
id={'extension_' + name}
element={element}
description={description}
label={label}
getValue={getValue}
setValue={setValue}
debounce={debounce}
/>
);
}

35
app/spiffworkflow/extensions/propertiesPanel/SpiffExtensionTextArea.js
View File

@ -1,35 +0,0 @@
import {useService } from 'bpmn-js-properties-panel';
import {TextAreaEntry, TextFieldEntry} from '@bpmn-io/properties-panel';
import {
getExtensionValue, setExtensionValue
} from '../extensionHelpers';
/**
* A generic properties' editor for text area.
*/
export function SpiffExtensionTextArea(props) {
const element = props.element;
const commandStack = props.commandStack, moddle = props.moddle;
const name = props.name, label = props.label, description = props.description;
const debounce = useService('debounceInput');
const getValue = () => {
return getExtensionValue(element.businessObject, name)
}
const setValue = value => {
setExtensionValue(element, name, value, moddle, commandStack)
};
return <TextAreaEntry
id={'extension_' + name}
element={element}
description={description}
label={label}
getValue={getValue}
setValue={setValue}
debounce={debounce}
/>;
}

37
app/spiffworkflow/extensions/propertiesPanel/SpiffExtensionTextArea.jsx Normal file
View File

@ -0,0 +1,37 @@
import React from 'react';
import { useService } from 'bpmn-js-properties-panel';
import { TextAreaEntry, TextFieldEntry } from '@bpmn-io/properties-panel';
import { getExtensionValue, setExtensionValue } from '../extensionHelpers';
/**
* A generic properties' editor for text area.
*/
export function SpiffExtensionTextArea(props) {
const element = props.element;
const commandStack = props.commandStack,
moddle = props.moddle;
const name = props.name,
label = props.label,
description = props.description;
const debounce = useService('debounceInput');
const getValue = () => {
return getExtensionValue(element.businessObject, name);
};
const setValue = (value) => {
setExtensionValue(element, name, value, moddle, commandStack);
};
return (
<TextAreaEntry
id={'extension_' + name}
element={element}
description={description}
label={label}
getValue={getValue}
setValue={setValue}
debounce={debounce}
/>
);
}

54
app/spiffworkflow/extensions/propertiesPanel/SpiffExtensionTextInput.js → app/spiffworkflow/extensions/propertiesPanel/SpiffExtensionTextInput.jsx
View File

@ -1,9 +1,7 @@
import {useService } from 'bpmn-js-properties-panel'; import React from 'react';
import { useService } from 'bpmn-js-properties-panel';
import { TextFieldEntry } from '@bpmn-io/properties-panel'; import { TextFieldEntry } from '@bpmn-io/properties-panel';
import { import { getExtensionValue, setExtensionValue } from '../extensionHelpers';
getExtensionValue, setExtensionValue
} from '../extensionHelpers';
/** /**
* A generic properties' editor for text input. * A generic properties' editor for text input.
@ -21,25 +19,41 @@ import {
* @returns {string|null|*} * @returns {string|null|*}
*/ */
export function SpiffExtensionTextInput(props) { export function SpiffExtensionTextInput(props) {
const { element, commandStack, moddle, name, label, description, businessObject } = props; const {
element,
commandStack,
moddle,
name,
label,
description,
businessObject,
} = props;
const debounce = useService('debounceInput'); const debounce = useService('debounceInput');
const getValue = () => { const getValue = () => {
return getExtensionValue(businessObject, name) return getExtensionValue(businessObject, name);
}
const setValue = value => {
setExtensionValue(element, name, value, moddle, commandStack, businessObject)
}; };
return <TextFieldEntry const setValue = (value) => {
id={'extension_' + name} setExtensionValue(
element={element} element,
description={description} name,
label={label} value,
getValue={getValue} moddle,
setValue={setValue} commandStack,
debounce={debounce} businessObject,
/>; );
};
return (
<TextFieldEntry
id={'extension_' + name}
element={element}
description={description}
label={label}
getValue={getValue}
setValue={setValue}
debounce={debounce}
/>
);
} }

9
app/spiffworkflow/messages/MessageHelpers.js
View File

@ -83,7 +83,7 @@ export function findCorrelationKeyForCorrelationProperty(shapeElement, moddle) {
} }
export function findCorrelationPropertiesAndRetrievalExpressionsForMessage( export function findCorrelationPropertiesAndRetrievalExpressionsForMessage(
shapeElement shapeElement,
) { ) {
const formalExpressions = []; const formalExpressions = [];
const messageRefElement = getMessageRefElement(shapeElement); const messageRefElement = getMessageRefElement(shapeElement);
@ -95,7 +95,7 @@ export function findCorrelationPropertiesAndRetrievalExpressionsForMessage(
const retrievalExpression = const retrievalExpression =
getRetrievalExpressionFromCorrelationProperty( getRetrievalExpressionFromCorrelationProperty(
childElement, childElement,
messageRefElement messageRefElement,
); );
if (retrievalExpression) { if (retrievalExpression) {
const formalExpression = { const formalExpression = {
@ -128,7 +128,7 @@ export function getMessageElementForShapeElement(shapeElement) {
function getRetrievalExpressionFromCorrelationProperty( function getRetrievalExpressionFromCorrelationProperty(
correlationProperty, correlationProperty,
message message,
) { ) {
if (correlationProperty.correlationPropertyRetrievalExpression) { if (correlationProperty.correlationPropertyRetrievalExpression) {
for (const retrievalExpression of correlationProperty.correlationPropertyRetrievalExpression) { for (const retrievalExpression of correlationProperty.correlationPropertyRetrievalExpression) {
@ -174,7 +174,8 @@ export function findCorrelationKeys(businessObject, moddle) {
if (rootElement.$type === 'bpmn:Collaboration') { if (rootElement.$type === 'bpmn:Collaboration') {
const currentKeys = rootElement.correlationKeys; const currentKeys = rootElement.correlationKeys;
for (const correlationKey in currentKeys) { for (const correlationKey in currentKeys) {
const currentCorrelation = rootElement.correlationKeys[correlationKey]; const currentCorrelation =
rootElement.correlationKeys[correlationKey];
correlationKeys.push(currentCorrelation); correlationKeys.push(currentCorrelation);
} }
} }

5
app/spiffworkflow/messages/propertiesPanel/MessagePayload.js → app/spiffworkflow/messages/propertiesPanel/MessagePayload.jsx
View File

@ -1,3 +1,4 @@
import React from 'react';
import { useService } from 'bpmn-js-properties-panel'; import { useService } from 'bpmn-js-properties-panel';
import { TextAreaEntry } from '@bpmn-io/properties-panel'; import { TextAreaEntry } from '@bpmn-io/properties-panel';
import { getMessageElementForShapeElement } from '../MessageHelpers'; import { getMessageElementForShapeElement } from '../MessageHelpers';
@ -37,11 +38,11 @@ export function MessagePayload(props) {
let messagePayloadObject = getMessagePayloadObject(); let messagePayloadObject = getMessagePayloadObject();
if (!messagePayloadObject) { if (!messagePayloadObject) {
messagePayloadObject = messageElement.$model.create( messagePayloadObject = messageElement.$model.create(
'spiffworkflow:MessagePayload' 'spiffworkflow:MessagePayload',
); );
if (!messageElement.extensionElements) { if (!messageElement.extensionElements) {
messageElement.extensionElements = messageElement.$model.create( messageElement.extensionElements = messageElement.$model.create(
'bpmn:ExtensionElements' 'bpmn:ExtensionElements',
); );
} }
messageElement.extensionElements.get('values').push(messagePayloadObject); messageElement.extensionElements.get('values').push(messagePayloadObject);

1
app/spiffworkflow/messages/propertiesPanel/MessageSelect.js → app/spiffworkflow/messages/propertiesPanel/MessageSelect.jsx
View File

@ -1,3 +1,4 @@
import React from 'react';
import { useService } from 'bpmn-js-properties-panel'; import { useService } from 'bpmn-js-properties-panel';
import { SelectEntry } from '@bpmn-io/properties-panel'; import { SelectEntry } from '@bpmn-io/properties-panel';
import { import {

0
app/spiffworkflow/messages/propertiesPanel/MessageVariable.js → app/spiffworkflow/messages/propertiesPanel/MessageVariable.jsx
View File

150
karma.conf.js
View File

@ -1,34 +1,23 @@
'use strict';
const coverage = process.env.COVERAGE; const coverage = process.env.COVERAGE;
const path = require('path'); const path = require('path');
const { const { DefinePlugin, NormalModuleReplacementPlugin } = require('webpack');
DefinePlugin,
NormalModuleReplacementPlugin
} = require('webpack');
const basePath = '.'; const basePath = '.';
const absoluteBasePath = path.resolve(path.join(__dirname, basePath)); const absoluteBasePath = path.resolve(path.join(__dirname, basePath));
module.exports = function(karma) { module.exports = function (karma) {
karma.set({ karma.set({
frameworks: ['webpack', 'mocha', 'sinon-chai'],
frameworks: [ files: ['test/spec/**/*Spec.js'],
'webpack',
'mocha',
'sinon-chai'
],
files: [ reporters: ['dots'],
'test/spec/**/*Spec.js',
],
reporters: [ 'dots' ],
preprocessors: { preprocessors: {
'test/spec/**/*Spec.js': [ 'webpack', 'env' ] 'test/spec/**/*Spec.js': ['webpack', 'env'],
}, },
browsers: [ 'ChromeHeadless' ], browsers: ['ChromeHeadless'],
browserNoActivityTimeout: 30000, browserNoActivityTimeout: 30000,
@ -41,86 +30,91 @@ module.exports = function(karma) {
rules: [ rules: [
{ {
test: /\.(css|bpmn)$/, test: /\.(css|bpmn)$/,
use: 'raw-loader' use: 'raw-loader',
}, },
{ {
test: /\.m?js$/, test: /\.m?jsx?$/,
exclude: /node_modules/, exclude: /node_modules/,
use: { use: {
loader: 'babel-loader', loader: 'babel-loader',
options: { options: {
plugins: [ plugins: [
[ '@babel/plugin-transform-react-jsx', { [
'importSource': '@bpmn-io/properties-panel/preact', '@babel/plugin-transform-react-jsx',
'runtime': 'automatic' {
} ] importSource: '@bpmn-io/properties-panel/preact',
] runtime: 'automatic',
} },
} ],
],
},
},
}, },
{ {
test: /\.svg$/, test: /\.svg$/,
use: [ 'react-svg-loader' ] use: ['react-svg-loader'],
} },
].concat(coverage ? ].concat(
{ coverage
test: /\.js$/, ? {
use: { test: /\.js$/,
loader: 'istanbul-instrumenter-loader', use: {
options: { esModules: true } loader: 'istanbul-instrumenter-loader',
}, options: { esModules: true },
enforce: 'post', },
include: /src\.*/, enforce: 'post',
exclude: /node_modules/ include: /src\.*/,
} : [] exclude: /node_modules/,
) }
: []
),
}, },
plugins: [ plugins: [
new DefinePlugin({ new DefinePlugin({
// @barmac: process.env has to be defined to make @testing-library/preact work // @barmac: process.env has to be defined to make @testing-library/preact work
'process.env': {} 'process.env': {},
}),
new NormalModuleReplacementPlugin(/^preact(\/[^/]+)?$/, function (
resource
) {
const replMap = {
'preact/hooks': path.resolve(
'node_modules/@bpmn-io/properties-panel/preact/hooks/dist/hooks.module.js'
),
'preact/jsx-runtime': path.resolve(
'node_modules/@bpmn-io/properties-panel/preact/jsx-runtime/dist/jsxRuntime.module.js'
),
preact: path.resolve(
'node_modules/@bpmn-io/properties-panel/preact/dist/preact.module.js'
),
};
const replacement = replMap[resource.request];
if (!replacement) {
return;
}
resource.request = replacement;
}), }),
new NormalModuleReplacementPlugin(
/^preact(\/[^/]+)?$/,
function(resource) {
const replMap = {
'preact/hooks': path.resolve('node_modules/@bpmn-io/properties-panel/preact/hooks/dist/hooks.module.js'),
'preact/jsx-runtime': path.resolve('node_modules/@bpmn-io/properties-panel/preact/jsx-runtime/dist/jsxRuntime.module.js'),
'preact': path.resolve('node_modules/@bpmn-io/properties-panel/preact/dist/preact.module.js')
};
const replacement = replMap[resource.request];
if (!replacement) {
return;
}
resource.request = replacement;
}
),
new NormalModuleReplacementPlugin( new NormalModuleReplacementPlugin(
/^preact\/hooks/, /^preact\/hooks/,
path.resolve('node_modules/@bpmn-io/properties-panel/preact/hooks/dist/hooks.module.js') path.resolve(
) 'node_modules/@bpmn-io/properties-panel/preact/hooks/dist/hooks.module.js'
)
),
], ],
resolve: { resolve: {
mainFields: [ extensions: ['', '.js', '.jsx', '.tsx'],
'browser', mainFields: ['browser', 'module', 'main'],
'module',
'main'
],
alias: { alias: {
'preact': '@bpmn-io/properties-panel/preact', preact: '@bpmn-io/properties-panel/preact',
'react': '@bpmn-io/properties-panel/preact/compat', react: '@bpmn-io/properties-panel/preact/compat',
'react-dom': '@bpmn-io/properties-panel/preact/compat' 'react-dom': '@bpmn-io/properties-panel/preact/compat',
}, },
modules: [ modules: ['node_modules', absoluteBasePath],
'node_modules',
absoluteBasePath
]
}, },
devtool: 'eval-source-map' devtool: 'eval-source-map',
} },
}); });
}; };