@bpmn-io/form-js-editor 0.14.0 → 0.14.1

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/dist/index.es.js CHANGED
@@ -447,10 +447,10 @@ function invokeFunction(fn, args) {
447
447
  return fn.apply(null, args);
448
448
  }
449
449
 
450
- /**
451
- * A factory to create a configurable debouncer.
452
- *
453
- * @param {number|boolean} [config=true]
450
+ /**
451
+ * A factory to create a configurable debouncer.
452
+ *
453
+ * @param {number|boolean} [config=true]
454
454
  */
455
455
  function DebounceFactory(config = true) {
456
456
  const timeout = typeof config === 'number' ? config : config ? 300 : 0;
@@ -463,11 +463,11 @@ function DebounceFactory(config = true) {
463
463
  DebounceFactory.$inject = ['config.debounce'];
464
464
 
465
465
  class FieldFactory {
466
- /**
467
- * @constructor
468
- *
469
- * @param { import('./FormFieldRegistry').default } formFieldRegistry
470
- * @param { import('@bpmn-io/form-js-viewer').FormFields } formFields
466
+ /**
467
+ * @constructor
468
+ *
469
+ * @param { import('./FormFieldRegistry').default } formFieldRegistry
470
+ * @param { import('@bpmn-io/form-js-viewer').FormFields } formFields
471
471
  */
472
472
  constructor(formFieldRegistry, formFields) {
473
473
  this._formFieldRegistry = formFieldRegistry;
@@ -527,11 +527,11 @@ class FieldFactory {
527
527
  FieldFactory.$inject = ['formFieldRegistry', 'formFields'];
528
528
 
529
529
  class FormFieldRegistry extends FormFieldRegistry$1 {
530
- /**
531
- * Updates a form fields id.
532
- *
533
- * @param {Object} formField
534
- * @param {string} newId
530
+ /**
531
+ * Updates a form fields id.
532
+ *
533
+ * @param {Object} formField
534
+ * @param {string} newId
535
535
  */
536
536
  updateId(formField, newId) {
537
537
  this._validateId(newId);
@@ -552,13 +552,13 @@ class FormFieldRegistry extends FormFieldRegistry$1 {
552
552
  }
553
553
  }
554
554
 
555
- /**
556
- * Validate the suitability of the given id and signals a problem
557
- * with an exception.
558
- *
559
- * @param {string} id
560
- *
561
- * @throws {Error} if id is empty or already assigned
555
+ /**
556
+ * Validate the suitability of the given id and signals a problem
557
+ * with an exception.
558
+ *
559
+ * @param {string} id
560
+ *
561
+ * @throws {Error} if id is empty or already assigned
562
562
  */
563
563
  _validateId(id) {
564
564
  if (!id) {
@@ -571,11 +571,11 @@ class FormFieldRegistry extends FormFieldRegistry$1 {
571
571
  }
572
572
 
573
573
  class FormLayoutValidator {
574
- /**
575
- * @constructor
576
- *
577
- * @param { import('./FormLayouter').default } formLayouter
578
- * @param { import('./FormFieldRegistry').default } formFieldRegistry
574
+ /**
575
+ * @constructor
576
+ *
577
+ * @param { import('./FormLayouter').default } formLayouter
578
+ * @param { import('./FormFieldRegistry').default } formFieldRegistry
579
579
  */
580
580
  constructor(formLayouter, formFieldRegistry) {
581
581
  this._formLayouter = formLayouter;
@@ -628,11 +628,11 @@ class FormLayoutValidator {
628
628
  FormLayoutValidator.$inject = ['formLayouter', 'formFieldRegistry'];
629
629
 
630
630
  class Importer {
631
- /**
632
- * @constructor
633
- * @param { import('../core/FormFieldRegistry').default } formFieldRegistry
634
- * @param { import('../core/FieldFactory').default } fieldFactory
635
- * @param { import('../core/FormLayouter').default } formLayouter
631
+ /**
632
+ * @constructor
633
+ * @param { import('../core/FormFieldRegistry').default } formFieldRegistry
634
+ * @param { import('../core/FieldFactory').default } fieldFactory
635
+ * @param { import('../core/FormLayouter').default } formLayouter
636
636
  */
637
637
  constructor(formFieldRegistry, fieldFactory, formLayouter) {
638
638
  this._formFieldRegistry = formFieldRegistry;
@@ -640,21 +640,21 @@ class Importer {
640
640
  this._formLayouter = formLayouter;
641
641
  }
642
642
 
643
- /**
644
- * Import schema creating rows, fields, attaching additional
645
- * information to each field and adding fields to the
646
- * field registry.
647
- *
648
- * Additional information attached:
649
- *
650
- * * `id` (unless present)
651
- * * `_parent`
652
- * * `_path`
653
- *
654
- * @param {any} schema
655
- *
656
- * @typedef {{ warnings: Error[], schema: any }} ImportResult
657
- * @returns {ImportResult}
643
+ /**
644
+ * Import schema creating rows, fields, attaching additional
645
+ * information to each field and adding fields to the
646
+ * field registry.
647
+ *
648
+ * Additional information attached:
649
+ *
650
+ * * `id` (unless present)
651
+ * * `_parent`
652
+ * * `_path`
653
+ *
654
+ * @param {any} schema
655
+ *
656
+ * @typedef {{ warnings: Error[], schema: any }} ImportResult
657
+ * @returns {ImportResult}
658
658
  */
659
659
  importSchema(schema) {
660
660
  // TODO: Add warnings
@@ -672,12 +672,12 @@ class Importer {
672
672
  }
673
673
  }
674
674
 
675
- /**
676
- * @param {{[x: string]: any}} fieldAttrs
677
- * @param {String} [parentId]
678
- * @param {number} [index]
679
- *
680
- * @return {any} field
675
+ /**
676
+ * @param {{[x: string]: any}} fieldAttrs
677
+ * @param {String} [parentId]
678
+ * @param {number} [index]
679
+ *
680
+ * @return {any} field
681
681
  */
682
682
  importFormField(fieldAttrs, parentId, index) {
683
683
  const {
@@ -714,11 +714,11 @@ class Importer {
714
714
  return field;
715
715
  }
716
716
 
717
- /**
718
- * @param {Array<any>} components
719
- * @param {string} parentId
720
- *
721
- * @return {Array<any>} imported components
717
+ /**
718
+ * @param {Array<any>} components
719
+ * @param {string} parentId
720
+ *
721
+ * @return {Array<any>} imported components
722
722
  */
723
723
  importFormFields(components, parentId) {
724
724
  return components.map((component, index) => {
@@ -748,11 +748,11 @@ const DragAndDropContext = createContext({
748
748
  });
749
749
  var DragAndDropContext$1 = DragAndDropContext;
750
750
 
751
- /**
752
- * @param {string} type
753
- * @param {boolean} [strict]
754
- *
755
- * @returns {any}
751
+ /**
752
+ * @param {string} type
753
+ * @param {boolean} [strict]
754
+ *
755
+ * @returns {any}
756
756
  */
757
757
  function getService$1(type, strict) {}
758
758
  const FormEditorContext = createContext({
@@ -1045,19 +1045,19 @@ const DRAG_NO_DROP_CLS = 'fjs-no-drop';
1045
1045
  const DRAG_NO_MOVE_CLS = 'fjs-no-move';
1046
1046
  const ERROR_DROP_CLS = 'fjs-error-drop';
1047
1047
 
1048
- /**
1049
- * @typedef { { id: String, components: Array<any> } } FormRow
1048
+ /**
1049
+ * @typedef { { id: String, components: Array<any> } } FormRow
1050
1050
  */
1051
1051
 
1052
1052
  class Dragging {
1053
- /**
1054
- * @constructor
1055
- *
1056
- * @param { import('../../core/FormFieldRegistry').default } formFieldRegistry
1057
- * @param { import('../../core/FormLayouter').default } formLayouter
1058
- * @param { import('../../core/FormLayoutValidator').default } formLayoutValidator
1059
- * @param { import('../../core/EventBus').default } eventBus
1060
- * @param { import('../modeling/Modeling').default } modeling
1053
+ /**
1054
+ * @constructor
1055
+ *
1056
+ * @param { import('../../core/FormFieldRegistry').default } formFieldRegistry
1057
+ * @param { import('../../core/FormLayouter').default } formLayouter
1058
+ * @param { import('../../core/FormLayoutValidator').default } formLayoutValidator
1059
+ * @param { import('../../core/EventBus').default } eventBus
1060
+ * @param { import('../modeling/Modeling').default } modeling
1061
1061
  */
1062
1062
  constructor(formFieldRegistry, formLayouter, formLayoutValidator, eventBus, modeling) {
1063
1063
  this._formFieldRegistry = formFieldRegistry;
@@ -1067,13 +1067,13 @@ class Dragging {
1067
1067
  this._modeling = modeling;
1068
1068
  }
1069
1069
 
1070
- /**
1071
- * Calculcates position in form schema given the dropped place.
1072
- *
1073
- * @param { FormRow } targetRow
1074
- * @param { any } targetFormField
1075
- * @param { HTMLElement } sibling
1076
- * @returns { number }
1070
+ /**
1071
+ * Calculcates position in form schema given the dropped place.
1072
+ *
1073
+ * @param { FormRow } targetRow
1074
+ * @param { any } targetFormField
1075
+ * @param { HTMLElement } sibling
1076
+ * @returns { number }
1077
1077
  */
1078
1078
  getTargetIndex(targetRow, targetFormField, sibling) {
1079
1079
  /** @type HTMLElement */
@@ -1175,8 +1175,8 @@ class Dragging {
1175
1175
  }
1176
1176
  }
1177
1177
 
1178
- /**
1179
- * @param { { container: Array<string>, direction: string, mirrorContainer: string } } options
1178
+ /**
1179
+ * @param { { container: Array<string>, direction: string, mirrorContainer: string } } options
1180
1180
  */
1181
1181
  createDragulaInstance(options) {
1182
1182
  const {
@@ -1421,7 +1421,7 @@ function DebugColumns(props) {
1421
1421
  return null;
1422
1422
  }
1423
1423
  return jsx("div", {
1424
- style: "width: fit-content;\r padding: 2px 6px;\r height: 16px;\r background: var(--color-blue-205-100-95);\r display: flex;\r justify-content: center;\r align-items: center;\r position: absolute;\r bottom: -2px;\r z-index: 2;\r font-size: 10px;\r right: 3px;",
1424
+ style: "width: fit-content; padding: 2px 6px; height: 16px; background: var(--color-blue-205-100-95); display: flex; justify-content: center; align-items: center; position: absolute; bottom: -2px; z-index: 2; font-size: 10px; right: 3px;",
1425
1425
  class: "fjs-debug-columns",
1426
1426
  children: (field.layout || {}).columns || 'auto'
1427
1427
  });
@@ -2468,10 +2468,10 @@ function updateRow(formField, rowId) {
2468
2468
  }
2469
2469
 
2470
2470
  class AddFormFieldHandler {
2471
- /**
2472
- * @constructor
2473
- * @param { import('../../../FormEditor').default } formEditor
2474
- * @param { import('../../../core/FormFieldRegistry').default } formFieldRegistry
2471
+ /**
2472
+ * @constructor
2473
+ * @param { import('../../../FormEditor').default } formEditor
2474
+ * @param { import('../../../core/FormFieldRegistry').default } formFieldRegistry
2475
2475
  */
2476
2476
  constructor(formEditor, formFieldRegistry) {
2477
2477
  this._formEditor = formEditor;
@@ -2532,10 +2532,10 @@ class AddFormFieldHandler {
2532
2532
  AddFormFieldHandler.$inject = ['formEditor', 'formFieldRegistry'];
2533
2533
 
2534
2534
  class EditFormFieldHandler {
2535
- /**
2536
- * @constructor
2537
- * @param { import('../../../FormEditor').default } formEditor
2538
- * @param { import('../../../core/FormFieldRegistry').default } formFieldRegistry
2535
+ /**
2536
+ * @constructor
2537
+ * @param { import('../../../FormEditor').default } formEditor
2538
+ * @param { import('../../../core/FormFieldRegistry').default } formFieldRegistry
2539
2539
  */
2540
2540
  constructor(formEditor, formFieldRegistry) {
2541
2541
  this._formEditor = formEditor;
@@ -2598,10 +2598,10 @@ class EditFormFieldHandler {
2598
2598
  EditFormFieldHandler.$inject = ['formEditor', 'formFieldRegistry'];
2599
2599
 
2600
2600
  class MoveFormFieldHandler {
2601
- /**
2602
- * @constructor
2603
- * @param { import('../../../FormEditor').default } formEditor
2604
- * @param { import('../../../core/FormFieldRegistry').default } formFieldRegistry
2601
+ /**
2602
+ * @constructor
2603
+ * @param { import('../../../FormEditor').default } formEditor
2604
+ * @param { import('../../../core/FormFieldRegistry').default } formFieldRegistry
2605
2605
  */
2606
2606
  constructor(formEditor, formFieldRegistry) {
2607
2607
  this._formEditor = formEditor;
@@ -2690,10 +2690,10 @@ class MoveFormFieldHandler {
2690
2690
  MoveFormFieldHandler.$inject = ['formEditor', 'formFieldRegistry'];
2691
2691
 
2692
2692
  class RemoveFormFieldHandler {
2693
- /**
2694
- * @constructor
2695
- * @param { import('../../../FormEditor').default } formEditor
2696
- * @param { import('../../../core/FormFieldRegistry').default } formFieldRegistry
2693
+ /**
2694
+ * @constructor
2695
+ * @param { import('../../../FormEditor').default } formEditor
2696
+ * @param { import('../../../core/FormFieldRegistry').default } formFieldRegistry
2697
2697
  */
2698
2698
  constructor(formEditor, formFieldRegistry) {
2699
2699
  this._formEditor = formEditor;
@@ -2753,9 +2753,9 @@ class RemoveFormFieldHandler {
2753
2753
  RemoveFormFieldHandler.$inject = ['formEditor', 'formFieldRegistry'];
2754
2754
 
2755
2755
  class UpdateIdClaimHandler {
2756
- /**
2757
- * @constructor
2758
- * @param { import('../../../core/FormFieldRegistry').default } formFieldRegistry
2756
+ /**
2757
+ * @constructor
2758
+ * @param { import('../../../core/FormFieldRegistry').default } formFieldRegistry
2759
2759
  */
2760
2760
  constructor(formFieldRegistry) {
2761
2761
  this._formFieldRegistry = formFieldRegistry;
@@ -2788,9 +2788,9 @@ class UpdateIdClaimHandler {
2788
2788
  UpdateIdClaimHandler.$inject = ['formFieldRegistry'];
2789
2789
 
2790
2790
  class UpdateKeyClaimHandler {
2791
- /**
2792
- * @constructor
2793
- * @param { import('../../../core/FormFieldRegistry').default } formFieldRegistry
2791
+ /**
2792
+ * @constructor
2793
+ * @param { import('../../../core/FormFieldRegistry').default } formFieldRegistry
2794
2794
  */
2795
2795
  constructor(formFieldRegistry) {
2796
2796
  this._formFieldRegistry = formFieldRegistry;
@@ -3140,8 +3140,8 @@ class ValidateBehavior extends CommandInterceptor {
3140
3140
  constructor(eventBus) {
3141
3141
  super(eventBus);
3142
3142
 
3143
- /**
3144
- * Remove custom validation if <validationType> is about to be added.
3143
+ /**
3144
+ * Remove custom validation if <validationType> is about to be added.
3145
3145
  */
3146
3146
  // @ts-ignore-next-line
3147
3147
  this.preExecute('formField.edit', function (context) {
@@ -3686,10 +3686,10 @@ class PaletteRenderer {
3686
3686
  });
3687
3687
  }
3688
3688
 
3689
- /**
3690
- * Attach the palette to a parent node.
3691
- *
3692
- * @param {HTMLElement} container
3689
+ /**
3690
+ * Attach the palette to a parent node.
3691
+ *
3692
+ * @param {HTMLElement} container
3693
3693
  */
3694
3694
  attachTo(container) {
3695
3695
  if (!container) {
@@ -3709,8 +3709,8 @@ class PaletteRenderer {
3709
3709
  this._eventBus.fire('palette.attach');
3710
3710
  }
3711
3711
 
3712
- /**
3713
- * Detach the palette from its parent node.
3712
+ /**
3713
+ * Detach the palette from its parent node.
3714
3714
  */
3715
3715
  detach() {
3716
3716
  const parentNode = this._container.parentNode;
@@ -6067,11 +6067,11 @@ function prefixId$1(id) {
6067
6067
  return `bio-properties-panel-${id}`;
6068
6068
  }
6069
6069
 
6070
- /**
6071
- * @param {string} type
6072
- * @param {boolean} [strict]
6073
- *
6074
- * @returns {any}
6070
+ /**
6071
+ * @param {string} type
6072
+ * @param {boolean} [strict]
6073
+ *
6074
+ * @returns {any}
6075
6075
  */
6076
6076
  function getService(type, strict) {}
6077
6077
  const PropertiesPanelContext = createContext({
@@ -6160,8 +6160,8 @@ const PropertiesPanelHeaderProvider = {
6160
6160
  }
6161
6161
  };
6162
6162
 
6163
- /**
6164
- * Provide placeholders for empty and multiple state.
6163
+ /**
6164
+ * Provide placeholders for empty and multiple state.
6165
6165
  */
6166
6166
  const PropertiesPanelPlaceholderProvider = {
6167
6167
  getEmpty: () => {
@@ -6233,10 +6233,10 @@ function useService (type, strict) {
6233
6233
  return getService(type, strict);
6234
6234
  }
6235
6235
 
6236
- /**
6237
- * Retrieve list of variables from the form schema.
6238
- *
6239
- * @returns { string[] } list of variables used in form schema
6236
+ /**
6237
+ * Retrieve list of variables from the form schema.
6238
+ *
6239
+ * @returns { string[] } list of variables used in form schema
6240
6240
  */
6241
6241
  function useVariables() {
6242
6242
  const form = useService('formEditor');
@@ -7513,7 +7513,7 @@ function Label(props) {
7513
7513
  id,
7514
7514
  label: 'Label',
7515
7515
  setValue,
7516
- validate: validateFactory(getValue())
7516
+ validate: validateFactory(getValue(), entry => entry.label)
7517
7517
  });
7518
7518
  }
7519
7519
  function Value$1(props) {
@@ -7539,7 +7539,7 @@ function Value$1(props) {
7539
7539
  id,
7540
7540
  label: 'Value',
7541
7541
  setValue,
7542
- validate: validateFactory(getValue())
7542
+ validate: validateFactory(getValue(), entry => entry.value)
7543
7543
  });
7544
7544
  }
7545
7545
 
@@ -7629,14 +7629,14 @@ function Value(props) {
7629
7629
 
7630
7630
  // helpers //////////
7631
7631
 
7632
- /**
7633
- * Returns copy of object with updated value.
7634
- *
7635
- * @param {Object} properties
7636
- * @param {string} key
7637
- * @param {string} value
7638
- *
7639
- * @returns {Object}
7632
+ /**
7633
+ * Returns copy of object with updated value.
7634
+ *
7635
+ * @param {Object} properties
7636
+ * @param {string} key
7637
+ * @param {string} value
7638
+ *
7639
+ * @returns {Object}
7640
7640
  */
7641
7641
  function updateValue(properties, key, value) {
7642
7642
  return {
@@ -7645,14 +7645,14 @@ function updateValue(properties, key, value) {
7645
7645
  };
7646
7646
  }
7647
7647
 
7648
- /**
7649
- * Returns copy of object with updated key.
7650
- *
7651
- * @param {Object} properties
7652
- * @param {string} oldKey
7653
- * @param {string} newKey
7654
- *
7655
- * @returns {Object}
7648
+ /**
7649
+ * Returns copy of object with updated key.
7650
+ *
7651
+ * @param {Object} properties
7652
+ * @param {string} oldKey
7653
+ * @param {string} newKey
7654
+ *
7655
+ * @returns {Object}
7656
7656
  */
7657
7657
  function updateKey(properties, oldKey, newKey) {
7658
7658
  return Object.entries(properties).reduce((newProperties, entry) => {
@@ -7781,13 +7781,13 @@ function StaticValuesSourceEntry(props) {
7781
7781
  const addEntry = e => {
7782
7782
  e.stopPropagation();
7783
7783
  const index = values.length + 1;
7784
- const entry = getIndexedEntry(index);
7784
+ const entry = getIndexedEntry(index, values);
7785
7785
  editField(field, VALUES_SOURCES_PATHS[VALUES_SOURCES.STATIC], arrayAdd(values, values.length, entry));
7786
7786
  };
7787
7787
  const removeEntry = entry => {
7788
7788
  editField(field, VALUES_SOURCES_PATHS[VALUES_SOURCES.STATIC], without(values, entry));
7789
7789
  };
7790
- const validateFactory = key => {
7790
+ const validateFactory = (key, getValue) => {
7791
7791
  return value => {
7792
7792
  if (value === key) {
7793
7793
  return;
@@ -7795,7 +7795,7 @@ function StaticValuesSourceEntry(props) {
7795
7795
  if (isUndefined(value) || !value.length) {
7796
7796
  return 'Must not be empty.';
7797
7797
  }
7798
- const isValueAssigned = values.find(entry => entry.value === value);
7798
+ const isValueAssigned = values.find(entry => getValue(entry) === value);
7799
7799
  if (isValueAssigned) {
7800
7800
  return 'Must be unique.';
7801
7801
  }
@@ -7826,17 +7826,23 @@ function StaticValuesSourceEntry(props) {
7826
7826
 
7827
7827
  // helper
7828
7828
 
7829
- function getIndexedEntry(index) {
7829
+ function getIndexedEntry(index, values) {
7830
7830
  const entry = {
7831
7831
  label: 'Value',
7832
7832
  value: 'value'
7833
7833
  };
7834
+ while (labelOrValueIsAlreadyAssignedForIndex(index, values)) {
7835
+ index++;
7836
+ }
7834
7837
  if (index > 1) {
7835
7838
  entry.label += ` ${index}`;
7836
7839
  entry.value += `${index}`;
7837
7840
  }
7838
7841
  return entry;
7839
7842
  }
7843
+ function labelOrValueIsAlreadyAssignedForIndex(index, values) {
7844
+ return values.some(existingEntry => existingEntry.label === `Value ${index}` || existingEntry.value === `value${index}`);
7845
+ }
7840
7846
 
7841
7847
  function AdornerEntry(props) {
7842
7848
  const {
@@ -8288,8 +8294,8 @@ function ValuesGroups(field, editField) {
8288
8294
  };
8289
8295
  const valuesSourceId = `${fieldId}-valuesSource`;
8290
8296
 
8291
- /**
8292
- * @type {Array<Group|ListGroup>}
8297
+ /**
8298
+ * @type {Array<Group|ListGroup>}
8293
8299
  */
8294
8300
  const groups = [{
8295
8301
  id: valuesSourceId,
@@ -8337,12 +8343,13 @@ function CustomValuesGroup(field, editField) {
8337
8343
  }
8338
8344
  const addEntry = event => {
8339
8345
  event.stopPropagation();
8340
- const index = Object.keys(properties).length + 1;
8341
- const key = `key${index}`,
8342
- value = 'value';
8346
+ let index = Object.keys(properties).length + 1;
8347
+ while (`key${index}` in properties) {
8348
+ index++;
8349
+ }
8343
8350
  editField(field, ['properties'], {
8344
8351
  ...properties,
8345
- [key]: value
8352
+ [`key${index}`]: 'value'
8346
8353
  });
8347
8354
  };
8348
8355
  const validateFactory = key => {
@@ -8390,13 +8397,13 @@ function CustomValuesGroup(field, editField) {
8390
8397
 
8391
8398
  // helpers //////////
8392
8399
 
8393
- /**
8394
- * Returns copy of object without key.
8395
- *
8396
- * @param {Object} properties
8397
- * @param {string} oldKey
8398
- *
8399
- * @returns {Object}
8400
+ /**
8401
+ * Returns copy of object without key.
8402
+ *
8403
+ * @param {Object} properties
8404
+ * @param {string} oldKey
8405
+ *
8406
+ * @returns {Object}
8400
8407
  */
8401
8408
  function removeKey(properties, oldKey) {
8402
8409
  return Object.entries(properties).reduce((newProperties, entry) => {
@@ -8510,9 +8517,9 @@ function FormPropertiesPanel(props) {
8510
8517
  }, []);
8511
8518
  useLayoutEffect(() => {
8512
8519
  const onFieldChanged = () => {
8513
- /**
8514
- * TODO(pinussilvestrus): update with actual updated element,
8515
- * once we have a proper updater/change support
8520
+ /**
8521
+ * TODO(pinussilvestrus): update with actual updated element,
8522
+ * once we have a proper updater/change support
8516
8523
  */
8517
8524
  _update(selection.get() || schema);
8518
8525
  };
@@ -8563,10 +8570,10 @@ class PropertiesPanelRenderer {
8563
8570
  });
8564
8571
  }
8565
8572
 
8566
- /**
8567
- * Attach the properties panel to a parent node.
8568
- *
8569
- * @param {HTMLElement} container
8573
+ /**
8574
+ * Attach the properties panel to a parent node.
8575
+ *
8576
+ * @param {HTMLElement} container
8570
8577
  */
8571
8578
  attachTo(container) {
8572
8579
  if (!container) {
@@ -8586,8 +8593,8 @@ class PropertiesPanelRenderer {
8586
8593
  this._eventBus.fire('propertiesPanel.attach');
8587
8594
  }
8588
8595
 
8589
- /**
8590
- * Detach the properties panel from its parent node.
8596
+ /**
8597
+ * Detach the properties panel from its parent node.
8591
8598
  */
8592
8599
  detach() {
8593
8600
  const parentNode = this._container.parentNode;
@@ -8625,48 +8632,48 @@ var ExpressionLanguageModule = {
8625
8632
 
8626
8633
  const ids = new Ids([32, 36, 1]);
8627
8634
 
8628
- /**
8629
- * @typedef { import('./types').Injector } Injector
8630
- * @typedef { import('./types').Module } Module
8631
- * @typedef { import('./types').Schema } Schema
8632
- *
8633
- * @typedef { import('./types').FormEditorOptions } FormEditorOptions
8634
- * @typedef { import('./types').FormEditorProperties } FormEditorProperties
8635
- *
8636
- * @typedef { {
8637
- * properties: FormEditorProperties,
8638
- * schema: Schema
8639
- * } } State
8640
- *
8641
- * @typedef { (type:string, priority:number, handler:Function) => void } OnEventWithPriority
8642
- * @typedef { (type:string, handler:Function) => void } OnEventWithOutPriority
8643
- * @typedef { OnEventWithPriority & OnEventWithOutPriority } OnEventType
8635
+ /**
8636
+ * @typedef { import('./types').Injector } Injector
8637
+ * @typedef { import('./types').Module } Module
8638
+ * @typedef { import('./types').Schema } Schema
8639
+ *
8640
+ * @typedef { import('./types').FormEditorOptions } FormEditorOptions
8641
+ * @typedef { import('./types').FormEditorProperties } FormEditorProperties
8642
+ *
8643
+ * @typedef { {
8644
+ * properties: FormEditorProperties,
8645
+ * schema: Schema
8646
+ * } } State
8647
+ *
8648
+ * @typedef { (type:string, priority:number, handler:Function) => void } OnEventWithPriority
8649
+ * @typedef { (type:string, handler:Function) => void } OnEventWithOutPriority
8650
+ * @typedef { OnEventWithPriority & OnEventWithOutPriority } OnEventType
8644
8651
  */
8645
8652
 
8646
- /**
8647
- * The form editor.
8653
+ /**
8654
+ * The form editor.
8648
8655
  */
8649
8656
  class FormEditor {
8650
- /**
8651
- * @constructor
8652
- * @param {FormEditorOptions} options
8657
+ /**
8658
+ * @constructor
8659
+ * @param {FormEditorOptions} options
8653
8660
  */
8654
8661
  constructor(options = {}) {
8655
- /**
8656
- * @public
8657
- * @type {OnEventType}
8662
+ /**
8663
+ * @public
8664
+ * @type {OnEventType}
8658
8665
  */
8659
8666
  this.on = this._onEvent;
8660
8667
 
8661
- /**
8662
- * @public
8663
- * @type {String}
8668
+ /**
8669
+ * @public
8670
+ * @type {String}
8664
8671
  */
8665
8672
  this._id = ids.next();
8666
8673
 
8667
- /**
8668
- * @private
8669
- * @type {Element}
8674
+ /**
8675
+ * @private
8676
+ * @type {Element}
8670
8677
  */
8671
8678
  this._container = createFormContainer();
8672
8679
  this._container.setAttribute('input-handle-modified-keys', 'z,y');
@@ -8677,15 +8684,15 @@ class FormEditor {
8677
8684
  properties = {}
8678
8685
  } = options;
8679
8686
 
8680
- /**
8681
- * @private
8682
- * @type {any}
8687
+ /**
8688
+ * @private
8689
+ * @type {any}
8683
8690
  */
8684
8691
  this.exporter = exporter;
8685
8692
 
8686
- /**
8687
- * @private
8688
- * @type {State}
8693
+ /**
8694
+ * @private
8695
+ * @type {State}
8689
8696
  */
8690
8697
  this._state = {
8691
8698
  properties,
@@ -8714,10 +8721,10 @@ class FormEditor {
8714
8721
  this._detach(false);
8715
8722
  }
8716
8723
 
8717
- /**
8718
- * @param {Schema} schema
8719
- *
8720
- * @return {Promise<{ warnings: Array<any> }>}
8724
+ /**
8725
+ * @param {Schema} schema
8726
+ *
8727
+ * @return {Promise<{ warnings: Array<any> }>}
8721
8728
  */
8722
8729
  importSchema(schema) {
8723
8730
  return new Promise((resolve, reject) => {
@@ -8746,15 +8753,15 @@ class FormEditor {
8746
8753
  });
8747
8754
  }
8748
8755
 
8749
- /**
8750
- * @returns {Schema}
8756
+ /**
8757
+ * @returns {Schema}
8751
8758
  */
8752
8759
  saveSchema() {
8753
8760
  return this.getSchema();
8754
8761
  }
8755
8762
 
8756
- /**
8757
- * @returns {Schema}
8763
+ /**
8764
+ * @returns {Schema}
8758
8765
  */
8759
8766
  getSchema() {
8760
8767
  const {
@@ -8763,8 +8770,8 @@ class FormEditor {
8763
8770
  return exportSchema(schema, this.exporter, schemaVersion);
8764
8771
  }
8765
8772
 
8766
- /**
8767
- * @param {Element|string} parentNode
8773
+ /**
8774
+ * @param {Element|string} parentNode
8768
8775
  */
8769
8776
  attachTo(parentNode) {
8770
8777
  if (!parentNode) {
@@ -8782,10 +8789,10 @@ class FormEditor {
8782
8789
  this._detach();
8783
8790
  }
8784
8791
 
8785
- /**
8786
- * @internal
8787
- *
8788
- * @param {boolean} [emit]
8792
+ /**
8793
+ * @internal
8794
+ *
8795
+ * @param {boolean} [emit]
8789
8796
  */
8790
8797
  _detach(emit = true) {
8791
8798
  const container = this._container,
@@ -8799,9 +8806,9 @@ class FormEditor {
8799
8806
  parentNode.removeChild(container);
8800
8807
  }
8801
8808
 
8802
- /**
8803
- * @param {any} property
8804
- * @param {any} value
8809
+ /**
8810
+ * @param {any} property
8811
+ * @param {any} value
8805
8812
  */
8806
8813
  setProperty(property, value) {
8807
8814
  const properties = set$1(this._getState().properties, [property], value);
@@ -8810,21 +8817,21 @@ class FormEditor {
8810
8817
  });
8811
8818
  }
8812
8819
 
8813
- /**
8814
- * @param {string} type
8815
- * @param {Function} handler
8820
+ /**
8821
+ * @param {string} type
8822
+ * @param {Function} handler
8816
8823
  */
8817
8824
  off(type, handler) {
8818
8825
  this.get('eventBus').off(type, handler);
8819
8826
  }
8820
8827
 
8821
- /**
8822
- * @internal
8823
- *
8824
- * @param {FormEditorOptions} options
8825
- * @param {Element} container
8826
- *
8827
- * @returns {Injector}
8828
+ /**
8829
+ * @internal
8830
+ *
8831
+ * @param {FormEditorOptions} options
8832
+ * @param {Element} container
8833
+ *
8834
+ * @returns {Injector}
8828
8835
  */
8829
8836
  _createInjector(options, container) {
8830
8837
  const {
@@ -8846,22 +8853,22 @@ class FormEditor {
8846
8853
  }, core, ...modules, ...additionalModules]);
8847
8854
  }
8848
8855
 
8849
- /**
8850
- * @internal
8856
+ /**
8857
+ * @internal
8851
8858
  */
8852
8859
  _emit(type, data) {
8853
8860
  this.get('eventBus').fire(type, data);
8854
8861
  }
8855
8862
 
8856
- /**
8857
- * @internal
8863
+ /**
8864
+ * @internal
8858
8865
  */
8859
8866
  _getState() {
8860
8867
  return this._state;
8861
8868
  }
8862
8869
 
8863
- /**
8864
- * @internal
8870
+ /**
8871
+ * @internal
8865
8872
  */
8866
8873
  _setState(state) {
8867
8874
  this._state = {
@@ -8871,15 +8878,15 @@ class FormEditor {
8871
8878
  this._emit('changed', this._getState());
8872
8879
  }
8873
8880
 
8874
- /**
8875
- * @internal
8881
+ /**
8882
+ * @internal
8876
8883
  */
8877
8884
  _getModules() {
8878
8885
  return [ModelingModule, EditorActionsModule, DraggingModule, KeyboardModule, SelectionModule, PaletteModule, ExpressionLanguageModule, MarkdownModule, PropertiesPanelModule];
8879
8886
  }
8880
8887
 
8881
- /**
8882
- * @internal
8888
+ /**
8889
+ * @internal
8883
8890
  */
8884
8891
  _onEvent(type, priority, handler) {
8885
8892
  this.get('eventBus').on(type, priority, handler);