[FEAT] Create a demo for all navigation and scrolling features

[tbouffard]

Is your feature request related to a problem? Please describe.

We have several new features that we want to implement, so we will need a demo to demonstrate them

• 163

• 164

• 167

• 168

• 169

Describe the solution you'd like

Provide a demo with a large diagram that cannot be fully displayed in the BPMN container without doing fit on load. This will make all navigation and scroll features a must have for the demo. The zoom reset should be a Fit.None to ensure that the diagram is never fully displayed.

The minimap could be displayed with a transparent background as in https://github.com/process-analytics/bpmn-visualization-js/pull/555 The demo should allow to use a BPMN Container with or without scrollbars

Mockup done with https://moqups.com

Additional context

Be aware of #80.

Sharing "zoom controls"

We already have a "zoom controls" button group in the "OverlayPlugin demo". We could/should avoid duplication and create a component or function to share the code. We could introduce a JS function that add elements in the DOM

• put title on all buttons
• instead of fit, add an icon and the title should be "Reset zoom level"

[UPDATE] A dedicated component was introduced in #186

Existing zoom bugs

Be aware of this bug about the zoom mouse support with scrollbars: https://github.com/process-analytics/bpmn-visualization-js/issues/1979