自定义BPMN-JS的右侧属性面板

BPMN-JS是一个强大的流程模型和表示法(BPMN)的JavaScript库，用于创建、查看和编辑BPMN 2.0图。默认情况下，它提供了预定义的一组属性面板来描述模型中的各种元素。然而，有时候我们需要更复杂的属性或更定制的UI体验，这就需要我们来自定义右侧的属性面板。
以下是如何自定义BPMN-JS的右侧属性面板的步骤：

1. 创建自定义properties-panel
   首先，我们需要创建一个新的properties-panel。这个panel需要继承自bpmn-js的base properties panel，并实现必要的方法。例如：

   import BpmnPropertiesPanel from 'bpmn-js/lib/features/properties-panel';
   import propertiesPanelModule from 'bpmn-js/lib/features/properties-panel/moddle-properties';
   import propertiesProviderModule from 'bpmn-js/lib/features/properties-panel/provider/bpmn';
   export default class CustomPropertiesPanel extends BpmnPropertiesPanel {
   constructor(eventBus, elementRegistry, modeling) {
   super(eventBus, elementRegistry, modeling, {
   propertiesProvider: new CustomPropertiesProvider(),
   });
   }
   }

   在上面的代码中，我们创建了一个新的CustomPropertiesPanel，它继承自BpmnPropertiesPanel。我们通过调用super方法来配置我们的propertiesProvider。
2. 创建自定义propertiesProvider
   接下来，我们需要创建一个新的propertiesProvider。这个provider需要继承自bpmn-js的DefaultPropertiesProvider，并实现必要的方法。例如：

   import { is } from 'bpmn-js/lib/util/ModelUtil';
   import { getBusinessObject } from 'bpmn-js/lib/util/ModelerUtil';
   import { isAny } from 'bpmn-js/lib/features/modeling/util/ModelingUtil';
   import { isShape } from 'bpmn-js/lib/features/properties-panel/util/PropertiesPanelUtil';
   import { isFlowElement } from 'bpmn-js/lib/features/modeling/util/FlowElementUtil';
   import { isEventSubProcess } from 'bpmn-js/lib/features/modeling/util/EventSubProcessUtil';
   import { isCallActivity } from 'bpmn-js/lib/features/modeling/util/CallActivityUtil';
   import { isRootElement } from 'bpmn-js/lib/features/modeling/util/ElementUtil';
   import { getExtensionElements } from 'bpmn-js/lib/features/modeling/util/ElementExtensionUtil';
   import { isMessageFlow } from 'bpmn-js/lib/features/modeling/util/MessageFlowUtil';
   import { isSequenceFlow } from 'bpmn-js/lib/features/modeling/util/SequenceFlowUtil';
   import { isMessageEventDefinition } from 'bpmn-js/lib/features/modeling/util/EventDefinitionUtil';
   import { isBoundaryEvent} from 'bpmn-js/lib/features/modeling/util/BoundaryEventUtil';