Skip to content

0.48.0

Latest
Latest

Choose a tag to compare

View all tags
@tbouffard tbouffard released this 23 Jun 15:33
· 8 commits to refs/heads/master since this release
v0.48.0
8f2f3d5

⚡ This release introduces new rendering customization options, improves resource management, and updates dependencies to their latest versions. ⚡

Thanks to all the contributors of this release 🌈: @tbouffard

See milestone 0.48.0 to get the list of issues covered by this release.

Breaking Changes

ShapeUtil.flowNodeKinds() no longer returns artifacts

According to the BPMN specification, artifacts are not flow nodes. As a consequence, ShapeUtil.flowNodeKinds() no longer returns artifact kinds.

If your code relied on the previous behavior, combine the results of ShapeUtil.flowNodeKinds() and ShapeUtil.artifactKinds().

- const kinds = ShapeUtil.flowNodeKinds();
+ const kinds = [...ShapeUtil.flowNodeKinds(), ...ShapeUtil.artifactKinds()];

Custom IconPainter configuration is now instance-scoped

The custom IconPainter configuration is now scoped to a BpmnVisualization instance instead of being configured globally.

This removes shared global state and makes the configuration consistent with other renderer options.

- import { BpmnVisualization, IconPainterProvider } from 'bpmn-visualization';
-
- IconPainterProvider.set(new CustomIconPainter());
-
- const bpmnVisualization = new BpmnVisualization({
-   container: 'bpmn-container'
- });
+ import { BpmnVisualization } from 'bpmn-visualization';
+
+ const bpmnVisualization = new BpmnVisualization({
+   container: 'bpmn-container',
+   renderer: {
+     iconPainter: new CustomIconPainter()
+   }
+ });

Public TypeScript types now use interfaces

Note

This change impacts TypeScript users only.

Most public object-like type aliases have been converted to interfaces.

This enables TypeScript declaration merging and simplifies extension by libraries such as bpmn-visualization-addons.

Most users should not be impacted. Code relying on specific type alias semantics may require minor adjustments.

Improvements

Ignore BPMN LabelStyles font definitions

BPMN diagrams sometimes contain inconsistent LabelStyle definitions, leading to different fonts being used across the same diagram.

Version 0.48.0 introduces the ignoreLabelStyles renderer option, allowing applications to ignore BPMN font definitions and use a consistent font for all labels.

const bpmnVisualization = new BpmnVisualization({
  container: 'container',
  renderer: {
    ignoreLabelStyles: true,
  },
});

Compare rendering with and without BPMN label styles using the labels.04.fonts.bpmn fixture.

Label styles applied Label styles ignored
do not ignore label styles ignore label styles

Ignore BPMN activity label bounds

Some BPMN tools generate incorrect activity label bounds. This can cause labels to be rendered in unexpected positions.

Version 0.48.0 introduces two new renderer options:

  • ignoreTaskLabelBounds
  • ignoreActivityLabelBounds

When enabled, bpmn-visualization computes label positions instead of using the BPMN label bounds.

Example for tasks:

const bpmnVisualization = new BpmnVisualization({
  container: 'container',
  renderer: {
    ignoreTaskLabelBounds: true,
  },
});

This improvement addresses issues such as #2469.

New dispose() method

A new dispose() method is available to release resources associated with a BpmnVisualization instance.

This method removes registered listeners and frees rendering resources allocated by mxGraph.

Typical use cases include:

  • component unmounting in SPA frameworks
  • dynamic diagram removal
  • memory leak prevention in long-running applications
bpmnVisualization.dispose();

New ShapeUtil methods

New utility methods have been added to ShapeUtil to better distinguish flow nodes and artifacts.

This change complements the flowNodeKinds() behavior update and provides more explicit APIs when working with BPMN element categories.

Custom IconPainter improvements

Custom icon painters can now be configured directly on each BpmnVisualization instance.

This allows different visualizations on the same page to use different icon painters without sharing global configuration.

Screenshots and examples are available in #3419.

Dependency Updates and Bundle Size

bpmn-visualization now depends on the latest available versions of its dependencies.

In particular, fast-xml-parser has been upgraded to address several security vulnerabilities.

Most of the bundle size increase comes from this dependency update.

Measurements were performed on commit 0f0bc933.

Bundle 0.47.0 0.48.0
bpmn-visualization.min.js 981,115 bytes 1,005,709 bytes
981.1 kB 1005.7 kB
bpmn-visualization.js 1,709,278 bytes 1,757,323 bytes
1709.2 kB 1757.3 kB
bpmn-visualization.esm.js 204,914 bytes 209,919 bytes
204.9 kB 209.9 kB

The demo application analysis confirms that most of the increase comes from fast-xml-parser:

Dependency 0.47.0 0.48.0
bpmn-visualization 86.48 kB 88.17 kB
es-toolkit 0.80 kB 0.88 kB
fast-xml-parser 21.28 kB 41.55 kB
mxgraph 837.37 kB 837.26 kB
TOTAL 945.93 kB 967.86 kB

The small size variation observed for the mxgraph chunk is likely related to the Vite upgrade from v6.3.5 to v7, as the mxGraph version itself did not change.

For additional details about the fast-xml-parser impact, see:

What's Changed

Full Changelog: v0.47.0...v0.48.0

🚄 BPMN rendering

🐛 Bug Fixes

  • fix: correctly ignore activity and task label bounds (#3434) @tbouffard
  • fix!: ShapeUtil does not include BPMN artifacts in flow node kinds (#3398) @tbouffard

⤵️ Library Integration

📝 Documentation

📦 Dependency updates

👻 Maintenance

  • refactor!: stop exporting StyleConfigurator and mxImageExport (#3528) @tbouffard
  • test(fit): assert mxGraphView calls in the fit integration tests (#3527) @tbouffard
  • refactor: extract insertEdge private method in BpmnRenderer (#3524) @tbouffard
  • ci: restore running e2e tests on chrome macos (#3458) @tbouffard
  • refactor: introduce internal extension mechanism for BPMN extensions (#3519) @tbouffard
  • chore!: prefer interfaces over types for public type definitions (#3517) @tbouffard
  • chore: add scripts to report demo and npm bundle sizes (#3507) @tbouffard
  • refactor: remove "Bpmn" prefix from renderer ignore option names (#3484) @tbouffard
  • refactor: export mxGraph objects directly instead of via mxgraph namespace (#3491) @tbouffard
  • ci: publish npm package with trusted publisher (#3485) @tbouffard
  • chore: bump node from 20 to 24 (#3475) @tbouffard
  • ci: temporary disable chrome macos e2e tests (#3457) @tbouffard
  • chore: add CLAUDE.md with architecture and development guidance (#3413) @tbouffard
  • fix(e2e): stabilize flaky lib initialization check (#3388) @tbouffard
  • test(e2e): increase some thresholds for chrome (#3374) @tbouffard

Contributors

tbouffard
Assets 2
Loading