@bpmn-io/form-js-viewer 1.0.0-alpha.1 → 1.0.0-alpha.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +22 -22
- package/README.md +164 -164
- package/dist/assets/form-js-base.css +880 -880
- package/dist/index.cjs +279 -279
- package/dist/index.cjs.map +1 -1
- package/dist/index.es.js +279 -279
- package/dist/index.es.js.map +1 -1
- package/dist/types/Form.d.ts +0 -22
- package/dist/types/features/display/behavior/ValidateOnBlurBehavior.d.ts +7 -0
- package/dist/types/features/display/behavior/index.d.ts +6 -0
- package/dist/types/features/viewerCommands/ViewerCommands.d.ts +14 -0
- package/dist/types/features/viewerCommands/behaviors/index.d.ts +2 -0
- package/dist/types/features/viewerCommands/cmd/UpdateFieldValidationHandler.d.ts +11 -0
- package/dist/types/features/viewerCommands/index.d.ts +9 -0
- package/dist/types/types.d.ts +35 -35
- package/package.json +2 -2
package/dist/index.es.js
CHANGED
|
@@ -42,26 +42,26 @@ const getFlavouredFeelVariableNames = (feelString, feelFlavour, options = {}) =>
|
|
|
42
42
|
}(simpleExpressionTree);
|
|
43
43
|
};
|
|
44
44
|
|
|
45
|
-
/**
|
|
46
|
-
* Get the variable name at the specified index in a given path expression.
|
|
47
|
-
*
|
|
48
|
-
* @param {Object} root - The root node of the path expression tree.
|
|
49
|
-
* @param {number} index - The index of the variable name to retrieve.
|
|
50
|
-
* @returns {string|null} The variable name at the specified index or null if index is out of bounds.
|
|
45
|
+
/**
|
|
46
|
+
* Get the variable name at the specified index in a given path expression.
|
|
47
|
+
*
|
|
48
|
+
* @param {Object} root - The root node of the path expression tree.
|
|
49
|
+
* @param {number} index - The index of the variable name to retrieve.
|
|
50
|
+
* @returns {string|null} The variable name at the specified index or null if index is out of bounds.
|
|
51
51
|
*/
|
|
52
52
|
const _getVariableNameAtPathIndex = (root, index) => {
|
|
53
53
|
const accessors = _deconstructPathExpression(root);
|
|
54
54
|
return accessors[index] || null;
|
|
55
55
|
};
|
|
56
56
|
|
|
57
|
-
/**
|
|
58
|
-
* Extracts the variables which are required of the external context for a given path expression.
|
|
59
|
-
* This is done by traversing the path expression tree and keeping track of the current depth relative to the external context.
|
|
60
|
-
*
|
|
61
|
-
* @param {Object} node - The root node of the path expression tree.
|
|
62
|
-
* @param {number} initialDepth - The depth at which the root node is located in the outer context.
|
|
63
|
-
* @param {Object} specialDepthAccessors - Definitions of special keywords which represent more complex accesses of the outer context.
|
|
64
|
-
* @returns {Set} - A set containing the extracted variable names.
|
|
57
|
+
/**
|
|
58
|
+
* Extracts the variables which are required of the external context for a given path expression.
|
|
59
|
+
* This is done by traversing the path expression tree and keeping track of the current depth relative to the external context.
|
|
60
|
+
*
|
|
61
|
+
* @param {Object} node - The root node of the path expression tree.
|
|
62
|
+
* @param {number} initialDepth - The depth at which the root node is located in the outer context.
|
|
63
|
+
* @param {Object} specialDepthAccessors - Definitions of special keywords which represent more complex accesses of the outer context.
|
|
64
|
+
* @returns {Set} - A set containing the extracted variable names.
|
|
65
65
|
*/
|
|
66
66
|
const _smartExtractVariableNames = (node, initialDepth, specialDepthAccessors) => {
|
|
67
67
|
// depth info represents the previous (initialised as null) and current depth of the current accessor in the path expression
|
|
@@ -107,11 +107,11 @@ const _smartExtractVariableNames = (node, initialDepth, specialDepthAccessors) =
|
|
|
107
107
|
return new Set(extractedVariables);
|
|
108
108
|
};
|
|
109
109
|
|
|
110
|
-
/**
|
|
111
|
-
* Deconstructs a path expression tree into an array of components.
|
|
112
|
-
*
|
|
113
|
-
* @param {Object} root - The root node of the path expression tree.
|
|
114
|
-
* @returns {Array<string>} An array of components in the path expression, in the correct order.
|
|
110
|
+
/**
|
|
111
|
+
* Deconstructs a path expression tree into an array of components.
|
|
112
|
+
*
|
|
113
|
+
* @param {Object} root - The root node of the path expression tree.
|
|
114
|
+
* @returns {Array<string>} An array of components in the path expression, in the correct order.
|
|
115
115
|
*/
|
|
116
116
|
const _deconstructPathExpression = root => {
|
|
117
117
|
let node = root;
|
|
@@ -130,13 +130,13 @@ const _deconstructPathExpression = root => {
|
|
|
130
130
|
return parts.reverse();
|
|
131
131
|
};
|
|
132
132
|
|
|
133
|
-
/**
|
|
134
|
-
* Builds a simplified feel structure tree from the given parse tree and feel string.
|
|
135
|
-
* The nodes follow this structure: `{ name: string, children: Array, variableName?: string }`
|
|
136
|
-
*
|
|
137
|
-
* @param {Object} parseTree - The parse tree generated by a parser.
|
|
138
|
-
* @param {string} feelString - The feel string used for parsing.
|
|
139
|
-
* @returns {Object} The simplified feel structure tree.
|
|
133
|
+
/**
|
|
134
|
+
* Builds a simplified feel structure tree from the given parse tree and feel string.
|
|
135
|
+
* The nodes follow this structure: `{ name: string, children: Array, variableName?: string }`
|
|
136
|
+
*
|
|
137
|
+
* @param {Object} parseTree - The parse tree generated by a parser.
|
|
138
|
+
* @param {string} feelString - The feel string used for parsing.
|
|
139
|
+
* @returns {Object} The simplified feel structure tree.
|
|
140
140
|
*/
|
|
141
141
|
const _buildSimpleFeelStructureTree = (parseTree, feelString) => {
|
|
142
142
|
const stack = [{
|
|
@@ -167,25 +167,25 @@ class FeelExpressionLanguage {
|
|
|
167
167
|
this._eventBus = eventBus;
|
|
168
168
|
}
|
|
169
169
|
|
|
170
|
-
/**
|
|
171
|
-
* Determines if the given value is a FEEL expression.
|
|
172
|
-
*
|
|
173
|
-
* @param {any} value
|
|
174
|
-
* @returns {boolean}
|
|
175
|
-
*
|
|
170
|
+
/**
|
|
171
|
+
* Determines if the given value is a FEEL expression.
|
|
172
|
+
*
|
|
173
|
+
* @param {any} value
|
|
174
|
+
* @returns {boolean}
|
|
175
|
+
*
|
|
176
176
|
*/
|
|
177
177
|
isExpression(value) {
|
|
178
178
|
return isString(value) && value.startsWith('=');
|
|
179
179
|
}
|
|
180
180
|
|
|
181
|
-
/**
|
|
182
|
-
* Retrieve variable names from a given FEEL expression.
|
|
183
|
-
*
|
|
184
|
-
* @param {string} expression
|
|
185
|
-
* @param {object} [options]
|
|
186
|
-
* @param {string} [options.type]
|
|
187
|
-
*
|
|
188
|
-
* @returns {string[]}
|
|
181
|
+
/**
|
|
182
|
+
* Retrieve variable names from a given FEEL expression.
|
|
183
|
+
*
|
|
184
|
+
* @param {string} expression
|
|
185
|
+
* @param {object} [options]
|
|
186
|
+
* @param {string} [options.type]
|
|
187
|
+
*
|
|
188
|
+
* @returns {string[]}
|
|
189
189
|
*/
|
|
190
190
|
getVariableNames(expression, options = {}) {
|
|
191
191
|
const {
|
|
@@ -200,13 +200,13 @@ class FeelExpressionLanguage {
|
|
|
200
200
|
return getFlavouredFeelVariableNames(expression, type);
|
|
201
201
|
}
|
|
202
202
|
|
|
203
|
-
/**
|
|
204
|
-
* Evaluate an expression.
|
|
205
|
-
*
|
|
206
|
-
* @param {string} expression
|
|
207
|
-
* @param {import('../../types').Data} [data]
|
|
208
|
-
*
|
|
209
|
-
* @returns {any}
|
|
203
|
+
/**
|
|
204
|
+
* Evaluate an expression.
|
|
205
|
+
*
|
|
206
|
+
* @param {string} expression
|
|
207
|
+
* @param {import('../../types').Data} [data]
|
|
208
|
+
*
|
|
209
|
+
* @returns {any}
|
|
210
210
|
*/
|
|
211
211
|
evaluate(expression, data = {}) {
|
|
212
212
|
if (!expression) {
|
|
@@ -231,23 +231,23 @@ FeelExpressionLanguage.$inject = ['eventBus'];
|
|
|
231
231
|
class FeelersTemplating {
|
|
232
232
|
constructor() {}
|
|
233
233
|
|
|
234
|
-
/**
|
|
235
|
-
* Determines if the given value is a feelers template.
|
|
236
|
-
*
|
|
237
|
-
* @param {any} value
|
|
238
|
-
* @returns {boolean}
|
|
239
|
-
*
|
|
234
|
+
/**
|
|
235
|
+
* Determines if the given value is a feelers template.
|
|
236
|
+
*
|
|
237
|
+
* @param {any} value
|
|
238
|
+
* @returns {boolean}
|
|
239
|
+
*
|
|
240
240
|
*/
|
|
241
241
|
isTemplate(value) {
|
|
242
242
|
return isString(value) && (value.startsWith('=') || /{{.*?}}/.test(value));
|
|
243
243
|
}
|
|
244
244
|
|
|
245
|
-
/**
|
|
246
|
-
* Retrieve variable names from a given feelers template.
|
|
247
|
-
*
|
|
248
|
-
* @param {string} template
|
|
249
|
-
*
|
|
250
|
-
* @returns {string[]}
|
|
245
|
+
/**
|
|
246
|
+
* Retrieve variable names from a given feelers template.
|
|
247
|
+
*
|
|
248
|
+
* @param {string} template
|
|
249
|
+
*
|
|
250
|
+
* @returns {string[]}
|
|
251
251
|
*/
|
|
252
252
|
getVariableNames(template) {
|
|
253
253
|
if (!this.isTemplate(template)) {
|
|
@@ -273,17 +273,17 @@ class FeelersTemplating {
|
|
|
273
273
|
}, []);
|
|
274
274
|
}
|
|
275
275
|
|
|
276
|
-
/**
|
|
277
|
-
* Evaluate a template.
|
|
278
|
-
*
|
|
279
|
-
* @param {string} template
|
|
280
|
-
* @param {Object<string, any>} context
|
|
281
|
-
* @param {Object} options
|
|
282
|
-
* @param {boolean} [options.debug = false]
|
|
283
|
-
* @param {boolean} [options.strict = false]
|
|
284
|
-
* @param {Function} [options.buildDebugString]
|
|
285
|
-
*
|
|
286
|
-
* @returns
|
|
276
|
+
/**
|
|
277
|
+
* Evaluate a template.
|
|
278
|
+
*
|
|
279
|
+
* @param {string} template
|
|
280
|
+
* @param {Object<string, any>} context
|
|
281
|
+
* @param {Object} options
|
|
282
|
+
* @param {boolean} [options.debug = false]
|
|
283
|
+
* @param {boolean} [options.strict = false]
|
|
284
|
+
* @param {Function} [options.buildDebugString]
|
|
285
|
+
*
|
|
286
|
+
* @returns
|
|
287
287
|
*/
|
|
288
288
|
evaluate(template, context = {}, options = {}) {
|
|
289
289
|
const {
|
|
@@ -298,22 +298,22 @@ class FeelersTemplating {
|
|
|
298
298
|
});
|
|
299
299
|
}
|
|
300
300
|
|
|
301
|
-
/**
|
|
302
|
-
* @typedef {Object} ExpressionWithDepth
|
|
303
|
-
* @property {number} depth - The depth of the expression in the syntax tree.
|
|
304
|
-
* @property {string} expression - The extracted expression
|
|
301
|
+
/**
|
|
302
|
+
* @typedef {Object} ExpressionWithDepth
|
|
303
|
+
* @property {number} depth - The depth of the expression in the syntax tree.
|
|
304
|
+
* @property {string} expression - The extracted expression
|
|
305
305
|
*/
|
|
306
306
|
|
|
307
|
-
/**
|
|
308
|
-
* Extracts all feel expressions in the template along with their depth in the syntax tree.
|
|
309
|
-
* The depth is incremented for child expressions of loops to account for context drilling.
|
|
310
|
-
|
|
311
|
-
* @param {string} template - A feelers template string.
|
|
312
|
-
* @returns {Array<ExpressionWithDepth>} An array of objects, each containing the depth and the extracted expression.
|
|
313
|
-
*
|
|
314
|
-
* @example
|
|
315
|
-
* const template = "Hello {{user}}, you have:{{#loop items}}\n- {{amount}} {{name}}{{/loop}}.";
|
|
316
|
-
* const extractedExpressions = _extractExpressionsWithDepth(template);
|
|
307
|
+
/**
|
|
308
|
+
* Extracts all feel expressions in the template along with their depth in the syntax tree.
|
|
309
|
+
* The depth is incremented for child expressions of loops to account for context drilling.
|
|
310
|
+
* @name extractExpressionsWithDepth
|
|
311
|
+
* @param {string} template - A feelers template string.
|
|
312
|
+
* @returns {Array<ExpressionWithDepth>} An array of objects, each containing the depth and the extracted expression.
|
|
313
|
+
*
|
|
314
|
+
* @example
|
|
315
|
+
* const template = "Hello {{user}}, you have:{{#loop items}}\n- {{amount}} {{name}}{{/loop}}.";
|
|
316
|
+
* const extractedExpressions = _extractExpressionsWithDepth(template);
|
|
317
317
|
*/
|
|
318
318
|
_extractExpressionsWithDepth(template) {
|
|
319
319
|
// build simplified feelers syntax tree
|
|
@@ -344,9 +344,9 @@ class FeelersTemplating {
|
|
|
344
344
|
}
|
|
345
345
|
FeelersTemplating.$inject = [];
|
|
346
346
|
|
|
347
|
-
/**
|
|
348
|
-
* @typedef {object} Condition
|
|
349
|
-
* @property {string} [hide]
|
|
347
|
+
/**
|
|
348
|
+
* @typedef {object} Condition
|
|
349
|
+
* @property {string} [hide]
|
|
350
350
|
*/
|
|
351
351
|
|
|
352
352
|
class ConditionChecker {
|
|
@@ -355,11 +355,11 @@ class ConditionChecker {
|
|
|
355
355
|
this._eventBus = eventBus;
|
|
356
356
|
}
|
|
357
357
|
|
|
358
|
-
/**
|
|
359
|
-
* For given data, remove properties based on condition.
|
|
360
|
-
*
|
|
361
|
-
* @param {Object<string, any>} properties
|
|
362
|
-
* @param {Object<string, any>} data
|
|
358
|
+
/**
|
|
359
|
+
* For given data, remove properties based on condition.
|
|
360
|
+
*
|
|
361
|
+
* @param {Object<string, any>} properties
|
|
362
|
+
* @param {Object<string, any>} data
|
|
363
363
|
*/
|
|
364
364
|
applyConditions(properties, data = {}) {
|
|
365
365
|
const conditions = this._getConditions();
|
|
@@ -378,13 +378,13 @@ class ConditionChecker {
|
|
|
378
378
|
return newProperties;
|
|
379
379
|
}
|
|
380
380
|
|
|
381
|
-
/**
|
|
382
|
-
* Check if given condition is met. Returns null for invalid/missing conditions.
|
|
383
|
-
*
|
|
384
|
-
* @param {string} condition
|
|
385
|
-
* @param {import('../../types').Data} [data]
|
|
386
|
-
*
|
|
387
|
-
* @returns {boolean|null}
|
|
381
|
+
/**
|
|
382
|
+
* Check if given condition is met. Returns null for invalid/missing conditions.
|
|
383
|
+
*
|
|
384
|
+
* @param {string} condition
|
|
385
|
+
* @param {import('../../types').Data} [data]
|
|
386
|
+
*
|
|
387
|
+
* @returns {boolean|null}
|
|
388
388
|
*/
|
|
389
389
|
check(condition, data = {}) {
|
|
390
390
|
if (!condition) {
|
|
@@ -405,12 +405,12 @@ class ConditionChecker {
|
|
|
405
405
|
}
|
|
406
406
|
}
|
|
407
407
|
|
|
408
|
-
/**
|
|
409
|
-
* Check if hide condition is met.
|
|
410
|
-
*
|
|
411
|
-
* @param {Condition} condition
|
|
412
|
-
* @param {Object<string, any>} data
|
|
413
|
-
* @returns {boolean}
|
|
408
|
+
/**
|
|
409
|
+
* Check if hide condition is met.
|
|
410
|
+
*
|
|
411
|
+
* @param {Condition} condition
|
|
412
|
+
* @param {Object<string, any>} data
|
|
413
|
+
* @returns {boolean}
|
|
414
414
|
*/
|
|
415
415
|
_checkHideCondition(condition, data) {
|
|
416
416
|
if (!condition.hide) {
|
|
@@ -452,12 +452,12 @@ class MarkdownRenderer {
|
|
|
452
452
|
this._converter = new showdown.Converter();
|
|
453
453
|
}
|
|
454
454
|
|
|
455
|
-
/**
|
|
456
|
-
* Render markdown to HTML.
|
|
457
|
-
*
|
|
458
|
-
* @param {string} markdown - The markdown to render
|
|
459
|
-
*
|
|
460
|
-
* @returns {string} HTML
|
|
455
|
+
/**
|
|
456
|
+
* Render markdown to HTML.
|
|
457
|
+
*
|
|
458
|
+
* @param {string} markdown - The markdown to render
|
|
459
|
+
*
|
|
460
|
+
* @returns {string} HTML
|
|
461
461
|
*/
|
|
462
462
|
render(markdown) {
|
|
463
463
|
return this._converter.makeHtml(markdown);
|
|
@@ -1113,23 +1113,23 @@ class FormFieldRegistry {
|
|
|
1113
1113
|
}
|
|
1114
1114
|
FormFieldRegistry.$inject = ['eventBus'];
|
|
1115
1115
|
|
|
1116
|
-
/**
|
|
1117
|
-
* @typedef { { id: String, components: Array<String> } } FormRow
|
|
1118
|
-
* @typedef { { formFieldId: String, rows: Array<FormRow> } } FormRows
|
|
1116
|
+
/**
|
|
1117
|
+
* @typedef { { id: String, components: Array<String> } } FormRow
|
|
1118
|
+
* @typedef { { formFieldId: String, rows: Array<FormRow> } } FormRows
|
|
1119
1119
|
*/
|
|
1120
1120
|
|
|
1121
|
-
/**
|
|
1122
|
-
* Maintains the Form layout in a given structure, for example
|
|
1123
|
-
*
|
|
1124
|
-
* [
|
|
1125
|
-
* {
|
|
1126
|
-
* formFieldId: 'FormField_1',
|
|
1127
|
-
* rows: [
|
|
1128
|
-
* { id: 'Row_1', components: [ 'Text_1', 'Textdield_1', ... ] }
|
|
1129
|
-
* ]
|
|
1130
|
-
* }
|
|
1131
|
-
* ]
|
|
1132
|
-
*
|
|
1121
|
+
/**
|
|
1122
|
+
* Maintains the Form layout in a given structure, for example
|
|
1123
|
+
*
|
|
1124
|
+
* [
|
|
1125
|
+
* {
|
|
1126
|
+
* formFieldId: 'FormField_1',
|
|
1127
|
+
* rows: [
|
|
1128
|
+
* { id: 'Row_1', components: [ 'Text_1', 'Textdield_1', ... ] }
|
|
1129
|
+
* ]
|
|
1130
|
+
* }
|
|
1131
|
+
* ]
|
|
1132
|
+
*
|
|
1133
1133
|
*/
|
|
1134
1134
|
class FormLayouter {
|
|
1135
1135
|
constructor(eventBus) {
|
|
@@ -1139,8 +1139,8 @@ class FormLayouter {
|
|
|
1139
1139
|
this._eventBus = eventBus;
|
|
1140
1140
|
}
|
|
1141
1141
|
|
|
1142
|
-
/**
|
|
1143
|
-
* @param {FormRow} row
|
|
1142
|
+
/**
|
|
1143
|
+
* @param {FormRow} row
|
|
1144
1144
|
*/
|
|
1145
1145
|
addRow(formFieldId, row) {
|
|
1146
1146
|
let rowsPerComponent = this._rows.find(r => r.formFieldId === formFieldId);
|
|
@@ -1154,18 +1154,18 @@ class FormLayouter {
|
|
|
1154
1154
|
rowsPerComponent.rows.push(row);
|
|
1155
1155
|
}
|
|
1156
1156
|
|
|
1157
|
-
/**
|
|
1158
|
-
* @param {String} id
|
|
1159
|
-
* @returns {FormRow}
|
|
1157
|
+
/**
|
|
1158
|
+
* @param {String} id
|
|
1159
|
+
* @returns {FormRow}
|
|
1160
1160
|
*/
|
|
1161
1161
|
getRow(id) {
|
|
1162
1162
|
const rows = allRows(this._rows);
|
|
1163
1163
|
return rows.find(r => r.id === id);
|
|
1164
1164
|
}
|
|
1165
1165
|
|
|
1166
|
-
/**
|
|
1167
|
-
* @param {any} formField
|
|
1168
|
-
* @returns {FormRow}
|
|
1166
|
+
/**
|
|
1167
|
+
* @param {any} formField
|
|
1168
|
+
* @returns {FormRow}
|
|
1169
1169
|
*/
|
|
1170
1170
|
getRowForField(formField) {
|
|
1171
1171
|
return allRows(this._rows).find(r => {
|
|
@@ -1176,9 +1176,9 @@ class FormLayouter {
|
|
|
1176
1176
|
});
|
|
1177
1177
|
}
|
|
1178
1178
|
|
|
1179
|
-
/**
|
|
1180
|
-
* @param {String} formFieldId
|
|
1181
|
-
* @returns { Array<FormRow> }
|
|
1179
|
+
/**
|
|
1180
|
+
* @param {String} formFieldId
|
|
1181
|
+
* @returns { Array<FormRow> }
|
|
1182
1182
|
*/
|
|
1183
1183
|
getRows(formFieldId) {
|
|
1184
1184
|
const rowsForField = this._rows.find(r => formFieldId === r.formFieldId);
|
|
@@ -1188,15 +1188,15 @@ class FormLayouter {
|
|
|
1188
1188
|
return rowsForField.rows;
|
|
1189
1189
|
}
|
|
1190
1190
|
|
|
1191
|
-
/**
|
|
1192
|
-
* @returns {string}
|
|
1191
|
+
/**
|
|
1192
|
+
* @returns {string}
|
|
1193
1193
|
*/
|
|
1194
1194
|
nextRowId() {
|
|
1195
1195
|
return this._ids.nextPrefixed('Row_');
|
|
1196
1196
|
}
|
|
1197
1197
|
|
|
1198
|
-
/**
|
|
1199
|
-
* @param {any} formField
|
|
1198
|
+
/**
|
|
1199
|
+
* @param {any} formField
|
|
1200
1200
|
*/
|
|
1201
1201
|
calculateLayout(formField) {
|
|
1202
1202
|
const {
|
|
@@ -1250,9 +1250,9 @@ function groupByRow(components, ids) {
|
|
|
1250
1250
|
});
|
|
1251
1251
|
}
|
|
1252
1252
|
|
|
1253
|
-
/**
|
|
1254
|
-
* @param {Array<FormRows>} formRows
|
|
1255
|
-
* @returns {Array<FormRow>}
|
|
1253
|
+
/**
|
|
1254
|
+
* @param {Array<FormRows>} formRows
|
|
1255
|
+
* @returns {Array<FormRow>}
|
|
1256
1256
|
*/
|
|
1257
1257
|
function allRows(formRows) {
|
|
1258
1258
|
return flatten(formRows.map(c => c.rows));
|
|
@@ -1329,10 +1329,10 @@ function createInjector(bootstrapModules) {
|
|
|
1329
1329
|
return injector;
|
|
1330
1330
|
}
|
|
1331
1331
|
|
|
1332
|
-
/**
|
|
1333
|
-
* @param {string?} prefix
|
|
1334
|
-
*
|
|
1335
|
-
* @returns Element
|
|
1332
|
+
/**
|
|
1333
|
+
* @param {string?} prefix
|
|
1334
|
+
*
|
|
1335
|
+
* @returns Element
|
|
1336
1336
|
*/
|
|
1337
1337
|
function createFormContainer(prefix = 'fjs') {
|
|
1338
1338
|
const container = document.createElement('div');
|
|
@@ -1378,22 +1378,22 @@ function generateIdForType(type) {
|
|
|
1378
1378
|
return `${type}${generateIndexForType(type)}`;
|
|
1379
1379
|
}
|
|
1380
1380
|
|
|
1381
|
-
/**
|
|
1382
|
-
* @template T
|
|
1383
|
-
* @param {T} data
|
|
1384
|
-
* @param {(this: any, key: string, value: any) => any} [replacer]
|
|
1385
|
-
* @return {T}
|
|
1381
|
+
/**
|
|
1382
|
+
* @template T
|
|
1383
|
+
* @param {T} data
|
|
1384
|
+
* @param {(this: any, key: string, value: any) => any} [replacer]
|
|
1385
|
+
* @return {T}
|
|
1386
1386
|
*/
|
|
1387
1387
|
function clone(data, replacer) {
|
|
1388
1388
|
return JSON.parse(JSON.stringify(data, replacer));
|
|
1389
1389
|
}
|
|
1390
1390
|
|
|
1391
|
-
/**
|
|
1392
|
-
* Parse the schema for input variables a form might make use of
|
|
1393
|
-
*
|
|
1394
|
-
* @param {any} schema
|
|
1395
|
-
*
|
|
1396
|
-
* @return {string[]}
|
|
1391
|
+
/**
|
|
1392
|
+
* Parse the schema for input variables a form might make use of
|
|
1393
|
+
*
|
|
1394
|
+
* @param {any} schema
|
|
1395
|
+
*
|
|
1396
|
+
* @return {string[]}
|
|
1397
1397
|
*/
|
|
1398
1398
|
function getSchemaVariables(schema, expressionLanguage = new FeelExpressionLanguage(null), templating = new FeelersTemplating()) {
|
|
1399
1399
|
if (!schema.components) {
|
|
@@ -1445,11 +1445,11 @@ function getSchemaVariables(schema, expressionLanguage = new FeelExpressionLangu
|
|
|
1445
1445
|
}
|
|
1446
1446
|
|
|
1447
1447
|
class Importer {
|
|
1448
|
-
/**
|
|
1449
|
-
* @constructor
|
|
1450
|
-
* @param { import('../core').FormFieldRegistry } formFieldRegistry
|
|
1451
|
-
* @param { import('../render/FormFields').default } formFields
|
|
1452
|
-
* @param { import('../core').FormLayouter } formLayouter
|
|
1448
|
+
/**
|
|
1449
|
+
* @constructor
|
|
1450
|
+
* @param { import('../core').FormFieldRegistry } formFieldRegistry
|
|
1451
|
+
* @param { import('../render/FormFields').default } formFields
|
|
1452
|
+
* @param { import('../core').FormLayouter } formLayouter
|
|
1453
1453
|
*/
|
|
1454
1454
|
constructor(formFieldRegistry, formFields, formLayouter) {
|
|
1455
1455
|
this._formFieldRegistry = formFieldRegistry;
|
|
@@ -1457,15 +1457,15 @@ class Importer {
|
|
|
1457
1457
|
this._formLayouter = formLayouter;
|
|
1458
1458
|
}
|
|
1459
1459
|
|
|
1460
|
-
/**
|
|
1461
|
-
* Import schema adding `id`, `_parent` and `_path`
|
|
1462
|
-
* information to each field and adding it to the
|
|
1463
|
-
* form field registry.
|
|
1464
|
-
*
|
|
1465
|
-
* @param {any} schema
|
|
1466
|
-
* @param {any} [data]
|
|
1467
|
-
*
|
|
1468
|
-
* @return { { warnings: Array<any>, schema: any, data: any } }
|
|
1460
|
+
/**
|
|
1461
|
+
* Import schema adding `id`, `_parent` and `_path`
|
|
1462
|
+
* information to each field and adding it to the
|
|
1463
|
+
* form field registry.
|
|
1464
|
+
*
|
|
1465
|
+
* @param {any} schema
|
|
1466
|
+
* @param {any} [data]
|
|
1467
|
+
*
|
|
1468
|
+
* @return { { warnings: Array<any>, schema: any, data: any } }
|
|
1469
1469
|
*/
|
|
1470
1470
|
importSchema(schema, data = {}) {
|
|
1471
1471
|
// TODO: Add warnings - https://github.com/bpmn-io/form-js/issues/289
|
|
@@ -1486,11 +1486,11 @@ class Importer {
|
|
|
1486
1486
|
}
|
|
1487
1487
|
}
|
|
1488
1488
|
|
|
1489
|
-
/**
|
|
1490
|
-
* @param {any} formField
|
|
1491
|
-
* @param {string} [parentId]
|
|
1492
|
-
*
|
|
1493
|
-
* @return {any} importedField
|
|
1489
|
+
/**
|
|
1490
|
+
* @param {any} formField
|
|
1491
|
+
* @param {string} [parentId]
|
|
1492
|
+
*
|
|
1493
|
+
* @return {any} importedField
|
|
1494
1494
|
*/
|
|
1495
1495
|
importFormField(formField, parentId) {
|
|
1496
1496
|
const {
|
|
@@ -1541,10 +1541,10 @@ class Importer {
|
|
|
1541
1541
|
});
|
|
1542
1542
|
}
|
|
1543
1543
|
|
|
1544
|
-
/**
|
|
1545
|
-
* @param {Object} data
|
|
1546
|
-
*
|
|
1547
|
-
* @return {Object} initializedData
|
|
1544
|
+
/**
|
|
1545
|
+
* @param {Object} data
|
|
1546
|
+
*
|
|
1547
|
+
* @return {Object} initializedData
|
|
1548
1548
|
*/
|
|
1549
1549
|
initializeFieldValues(data) {
|
|
1550
1550
|
return this._formFieldRegistry.getAll().reduce((initializedData, formField) => {
|
|
@@ -1682,11 +1682,11 @@ const FormRenderContext = createContext({
|
|
|
1682
1682
|
});
|
|
1683
1683
|
var FormRenderContext$1 = FormRenderContext;
|
|
1684
1684
|
|
|
1685
|
-
/**
|
|
1686
|
-
* @param {string} type
|
|
1687
|
-
* @param {boolean} [strict]
|
|
1688
|
-
*
|
|
1689
|
-
* @returns {any}
|
|
1685
|
+
/**
|
|
1686
|
+
* @param {string} type
|
|
1687
|
+
* @param {boolean} [strict]
|
|
1688
|
+
*
|
|
1689
|
+
* @returns {any}
|
|
1690
1690
|
*/
|
|
1691
1691
|
function getService(type, strict) {}
|
|
1692
1692
|
const FormContext = createContext({
|
|
@@ -1702,10 +1702,10 @@ function useService(type, strict) {
|
|
|
1702
1702
|
return getService(type, strict);
|
|
1703
1703
|
}
|
|
1704
1704
|
|
|
1705
|
-
/**
|
|
1706
|
-
* Returns the conditionally filtered data of a form reactively.
|
|
1707
|
-
* Memoised to minimize re-renders
|
|
1708
|
-
*
|
|
1705
|
+
/**
|
|
1706
|
+
* Returns the conditionally filtered data of a form reactively.
|
|
1707
|
+
* Memoised to minimize re-renders
|
|
1708
|
+
*
|
|
1709
1709
|
*/
|
|
1710
1710
|
function useFilteredFormData() {
|
|
1711
1711
|
const {
|
|
@@ -1722,12 +1722,12 @@ function useFilteredFormData() {
|
|
|
1722
1722
|
}, [conditionChecker, data, initialData]);
|
|
1723
1723
|
}
|
|
1724
1724
|
|
|
1725
|
-
/**
|
|
1726
|
-
* Evaluate if condition is met reactively based on the conditionChecker and form data.
|
|
1727
|
-
*
|
|
1728
|
-
* @param {string | undefined} condition
|
|
1729
|
-
*
|
|
1730
|
-
* @returns {boolean} true if condition is met or no condition or condition checker exists
|
|
1725
|
+
/**
|
|
1726
|
+
* Evaluate if condition is met reactively based on the conditionChecker and form data.
|
|
1727
|
+
*
|
|
1728
|
+
* @param {string | undefined} condition
|
|
1729
|
+
*
|
|
1730
|
+
* @returns {boolean} true if condition is met or no condition or condition checker exists
|
|
1731
1731
|
*/
|
|
1732
1732
|
function useCondition(condition) {
|
|
1733
1733
|
const conditionChecker = useService('conditionChecker', false);
|
|
@@ -1737,13 +1737,13 @@ function useCondition(condition) {
|
|
|
1737
1737
|
}, [conditionChecker, condition, filteredData]);
|
|
1738
1738
|
}
|
|
1739
1739
|
|
|
1740
|
-
/**
|
|
1741
|
-
* Evaluate a string reactively based on the expressionLanguage and form data.
|
|
1742
|
-
* If the string is not an expression, it is returned as is.
|
|
1743
|
-
* Memoised to minimize re-renders.
|
|
1744
|
-
*
|
|
1745
|
-
* @param {string} value
|
|
1746
|
-
*
|
|
1740
|
+
/**
|
|
1741
|
+
* Evaluate a string reactively based on the expressionLanguage and form data.
|
|
1742
|
+
* If the string is not an expression, it is returned as is.
|
|
1743
|
+
* Memoised to minimize re-renders.
|
|
1744
|
+
*
|
|
1745
|
+
* @param {string} value
|
|
1746
|
+
*
|
|
1747
1747
|
*/
|
|
1748
1748
|
function useExpressionEvaluation(value) {
|
|
1749
1749
|
const formData = useFilteredFormData();
|
|
@@ -1772,16 +1772,16 @@ function useKeyDownAction(targetKey, action, listenerElement = window) {
|
|
|
1772
1772
|
});
|
|
1773
1773
|
}
|
|
1774
1774
|
|
|
1775
|
-
/**
|
|
1776
|
-
* Retrieve readonly value of a form field, given it can be an
|
|
1777
|
-
* expression optionally or configured globally.
|
|
1778
|
-
*
|
|
1779
|
-
* @typedef { import('../../types').FormProperties } FormProperties
|
|
1780
|
-
*
|
|
1781
|
-
* @param {any} formField
|
|
1782
|
-
* @param {FormProperties} properties
|
|
1783
|
-
*
|
|
1784
|
-
* @returns {boolean}
|
|
1775
|
+
/**
|
|
1776
|
+
* Retrieve readonly value of a form field, given it can be an
|
|
1777
|
+
* expression optionally or configured globally.
|
|
1778
|
+
*
|
|
1779
|
+
* @typedef { import('../../types').FormProperties } FormProperties
|
|
1780
|
+
*
|
|
1781
|
+
* @param {any} formField
|
|
1782
|
+
* @param {FormProperties} properties
|
|
1783
|
+
*
|
|
1784
|
+
* @returns {boolean}
|
|
1785
1785
|
*/
|
|
1786
1786
|
function useReadonly(formField, properties = {}) {
|
|
1787
1787
|
const expressionLanguage = useService('expressionLanguage');
|
|
@@ -1799,16 +1799,16 @@ function useReadonly(formField, properties = {}) {
|
|
|
1799
1799
|
return readonly || false;
|
|
1800
1800
|
}
|
|
1801
1801
|
|
|
1802
|
-
/**
|
|
1803
|
-
* Template a string reactively based on form data. If the string is not a template, it is returned as is.
|
|
1804
|
-
* Memoised to minimize re-renders
|
|
1805
|
-
*
|
|
1806
|
-
* @param {string} value
|
|
1807
|
-
* @param {Object} options
|
|
1808
|
-
* @param {boolean} [options.debug = false]
|
|
1809
|
-
* @param {boolean} [options.strict = false]
|
|
1810
|
-
* @param {Function} [options.buildDebugString]
|
|
1811
|
-
*
|
|
1802
|
+
/**
|
|
1803
|
+
* Template a string reactively based on form data. If the string is not a template, it is returned as is.
|
|
1804
|
+
* Memoised to minimize re-renders
|
|
1805
|
+
*
|
|
1806
|
+
* @param {string} value
|
|
1807
|
+
* @param {Object} options
|
|
1808
|
+
* @param {boolean} [options.debug = false]
|
|
1809
|
+
* @param {boolean} [options.strict = false]
|
|
1810
|
+
* @param {Function} [options.buildDebugString]
|
|
1811
|
+
*
|
|
1812
1812
|
*/
|
|
1813
1813
|
function useTemplateEvaluation(value, options) {
|
|
1814
1814
|
const filteredData = useFilteredFormData();
|
|
@@ -1821,17 +1821,17 @@ function useTemplateEvaluation(value, options) {
|
|
|
1821
1821
|
}, [filteredData, templating, value, options]);
|
|
1822
1822
|
}
|
|
1823
1823
|
|
|
1824
|
-
/**
|
|
1825
|
-
* Template a string reactively based on form data. If the string is not a template, it is returned as is.
|
|
1826
|
-
* If the string contains multiple lines, only the first line is returned.
|
|
1827
|
-
* Memoised to minimize re-renders
|
|
1828
|
-
*
|
|
1829
|
-
* @param {string} value
|
|
1830
|
-
* @param {Object} [options]
|
|
1831
|
-
* @param {boolean} [options.debug = false]
|
|
1832
|
-
* @param {boolean} [options.strict = false]
|
|
1833
|
-
* @param {Function} [options.buildDebugString]
|
|
1834
|
-
*
|
|
1824
|
+
/**
|
|
1825
|
+
* Template a string reactively based on form data. If the string is not a template, it is returned as is.
|
|
1826
|
+
* If the string contains multiple lines, only the first line is returned.
|
|
1827
|
+
* Memoised to minimize re-renders
|
|
1828
|
+
*
|
|
1829
|
+
* @param {string} value
|
|
1830
|
+
* @param {Object} [options]
|
|
1831
|
+
* @param {boolean} [options.debug = false]
|
|
1832
|
+
* @param {boolean} [options.strict = false]
|
|
1833
|
+
* @param {Function} [options.buildDebugString]
|
|
1834
|
+
*
|
|
1835
1835
|
*/
|
|
1836
1836
|
function useSingleLineTemplateEvaluation(value, options = {}) {
|
|
1837
1837
|
const evaluatedTemplate = useTemplateEvaluation(value, options);
|
|
@@ -2018,8 +2018,8 @@ function _isValueSomething(value) {
|
|
|
2018
2018
|
return value || value === 0 || value === false;
|
|
2019
2019
|
}
|
|
2020
2020
|
|
|
2021
|
-
/**
|
|
2022
|
-
* @enum { String }
|
|
2021
|
+
/**
|
|
2022
|
+
* @enum { String }
|
|
2023
2023
|
*/
|
|
2024
2024
|
const LOAD_STATES = {
|
|
2025
2025
|
LOADING: 'loading',
|
|
@@ -2027,17 +2027,17 @@ const LOAD_STATES = {
|
|
|
2027
2027
|
ERROR: 'error'
|
|
2028
2028
|
};
|
|
2029
2029
|
|
|
2030
|
-
/**
|
|
2031
|
-
* @typedef {Object} ValuesGetter
|
|
2032
|
-
* @property {Object[]} values - The values data
|
|
2033
|
-
* @property {(LOAD_STATES)} state - The values data's loading state, to use for conditional rendering
|
|
2030
|
+
/**
|
|
2031
|
+
* @typedef {Object} ValuesGetter
|
|
2032
|
+
* @property {Object[]} values - The values data
|
|
2033
|
+
* @property {(LOAD_STATES)} state - The values data's loading state, to use for conditional rendering
|
|
2034
2034
|
*/
|
|
2035
2035
|
|
|
2036
|
-
/**
|
|
2037
|
-
* A hook to load values for single and multiselect components.
|
|
2038
|
-
*
|
|
2039
|
-
* @param {Object} field - The form field to handle values for
|
|
2040
|
-
* @return {ValuesGetter} valuesGetter - A values getter object providing loading state and values
|
|
2036
|
+
/**
|
|
2037
|
+
* A hook to load values for single and multiselect components.
|
|
2038
|
+
*
|
|
2039
|
+
* @param {Object} field - The form field to handle values for
|
|
2040
|
+
* @return {ValuesGetter} valuesGetter - A values getter object providing loading state and values
|
|
2041
2041
|
*/
|
|
2042
2042
|
function useValuesAsync (field) {
|
|
2043
2043
|
const {
|
|
@@ -3152,10 +3152,10 @@ Datetime.config = {
|
|
|
3152
3152
|
}
|
|
3153
3153
|
};
|
|
3154
3154
|
|
|
3155
|
-
/**
|
|
3156
|
-
* This file must not be changed or exchanged.
|
|
3157
|
-
*
|
|
3158
|
-
* @see http://bpmn.io/license for more information.
|
|
3155
|
+
/**
|
|
3156
|
+
* This file must not be changed or exchanged.
|
|
3157
|
+
*
|
|
3158
|
+
* @see http://bpmn.io/license for more information.
|
|
3159
3159
|
*/
|
|
3160
3160
|
function Logo() {
|
|
3161
3161
|
return jsxs("svg", {
|
|
@@ -3287,11 +3287,11 @@ const ATTR_WHITESPACE_PATTERN = /[\u0000-\u0020\u00A0\u1680\u180E\u2000-\u2029\u
|
|
|
3287
3287
|
|
|
3288
3288
|
const FORM_ELEMENT = document.createElement('form');
|
|
3289
3289
|
|
|
3290
|
-
/**
|
|
3291
|
-
* Sanitize a HTML string and return the cleaned, safe version.
|
|
3292
|
-
*
|
|
3293
|
-
* @param {string} html
|
|
3294
|
-
* @return {string}
|
|
3290
|
+
/**
|
|
3291
|
+
* Sanitize a HTML string and return the cleaned, safe version.
|
|
3292
|
+
*
|
|
3293
|
+
* @param {string} html
|
|
3294
|
+
* @return {string}
|
|
3295
3295
|
*/
|
|
3296
3296
|
|
|
3297
3297
|
// see https://github.com/developit/snarkdown/issues/70
|
|
@@ -3309,29 +3309,29 @@ function sanitizeHTML(html) {
|
|
|
3309
3309
|
}
|
|
3310
3310
|
}
|
|
3311
3311
|
|
|
3312
|
-
/**
|
|
3313
|
-
* Sanitizes an image source to ensure we only allow for data URI and links
|
|
3314
|
-
* that start with http(s).
|
|
3315
|
-
*
|
|
3316
|
-
* Note: Most browsers anyway do not support script execution in <img> elements.
|
|
3317
|
-
*
|
|
3318
|
-
* @param {string} src
|
|
3319
|
-
* @returns {string}
|
|
3312
|
+
/**
|
|
3313
|
+
* Sanitizes an image source to ensure we only allow for data URI and links
|
|
3314
|
+
* that start with http(s).
|
|
3315
|
+
*
|
|
3316
|
+
* Note: Most browsers anyway do not support script execution in <img> elements.
|
|
3317
|
+
*
|
|
3318
|
+
* @param {string} src
|
|
3319
|
+
* @returns {string}
|
|
3320
3320
|
*/
|
|
3321
3321
|
function sanitizeImageSource(src) {
|
|
3322
3322
|
const valid = ALLOWED_IMAGE_SRC_PATTERN.test(src);
|
|
3323
3323
|
return valid ? src : '';
|
|
3324
3324
|
}
|
|
3325
3325
|
|
|
3326
|
-
/**
|
|
3327
|
-
* Recursively sanitize a HTML node, potentially
|
|
3328
|
-
* removing it, its children or attributes.
|
|
3329
|
-
*
|
|
3330
|
-
* Inspired by https://github.com/developit/snarkdown/issues/70
|
|
3331
|
-
* and https://github.com/cure53/DOMPurify. Simplified
|
|
3332
|
-
* for our use-case.
|
|
3333
|
-
*
|
|
3334
|
-
* @param {Element} node
|
|
3326
|
+
/**
|
|
3327
|
+
* Recursively sanitize a HTML node, potentially
|
|
3328
|
+
* removing it, its children or attributes.
|
|
3329
|
+
*
|
|
3330
|
+
* Inspired by https://github.com/developit/snarkdown/issues/70
|
|
3331
|
+
* and https://github.com/cure53/DOMPurify. Simplified
|
|
3332
|
+
* for our use-case.
|
|
3333
|
+
*
|
|
3334
|
+
* @param {Element} node
|
|
3335
3335
|
*/
|
|
3336
3336
|
function sanitizeNode(node) {
|
|
3337
3337
|
// allow text nodes
|
|
@@ -3375,13 +3375,13 @@ function sanitizeNode(node) {
|
|
|
3375
3375
|
}
|
|
3376
3376
|
}
|
|
3377
3377
|
|
|
3378
|
-
/**
|
|
3379
|
-
* Validates attributes for validity.
|
|
3380
|
-
*
|
|
3381
|
-
* @param {string} lcTag
|
|
3382
|
-
* @param {string} lcName
|
|
3383
|
-
* @param {string} value
|
|
3384
|
-
* @return {boolean}
|
|
3378
|
+
/**
|
|
3379
|
+
* Validates attributes for validity.
|
|
3380
|
+
*
|
|
3381
|
+
* @param {string} lcTag
|
|
3382
|
+
* @param {string} lcName
|
|
3383
|
+
* @param {string} value
|
|
3384
|
+
* @return {boolean}
|
|
3385
3385
|
*/
|
|
3386
3386
|
function isValidAttribute(lcTag, lcName, value) {
|
|
3387
3387
|
// disallow most attributes based on whitelist
|