[](https://github.com/bpmn-io/diagram-js-ui/actions/workflows/CI.yml)
npm install @bpmn-io/diagram-js-ui
A wrapper around htm/preact that exposes components for building reactive HTML widgets in the context of diagram-js and extensions.
This module is available through diagram-js/lib/ui. Use it to create and mount your Preact components and render them through the htm utility.
``javascript
// MyService.js
import { render, html } from 'diagram-js/lib/ui';
import MyCounter from './MyCounter';
export default function MyService() {
const parentElement = document.createElement('div');
render(html<${MyCounter} />, parentElement);`
}
`javascript
// MyCounter.js
import { useState, html } from 'diagram-js/lib/ui';
export default function MyCounter(props) {
const counter = useState(0);
return html
;
}
`
Build and Run
`sh
install all dependencies
npm installlint and build the library
npm run all
``MIT