bpmn-io / bpmn-io/form-js-examples

can't reuse entryFields from @bpmn-io/properties-panel

Open
#8 6 comments 0 reactions 0 assignees View on GitHub
backlog bug
Dominant language
JavaScript
Stars
32
Forks
18
PR merge metrics
No merged PRs in 30d

Description

### Describe the Bug

if wrap playgroundForm in preact component - it work fine
if then add custom component from sample - got error in NumberField

### Steps to Reproduce

1. npm create vite@latest wrapper-sample -- --template preact
2. add playground in wrapper (its work fine):
```
export function App() {
useEffect(() => {
const container = document.getElementById('anchor');
console.log(container);
new FormPlayground({
container,
schema,
data: {},
});
}, []);
return (


)
}
```
3. add custom component from custom-sample
```
new FormPlayground({
container,
schema,
data: {},

// load rendering extension
additionalModules: [
RenderExtension
],

// load properties panel extension
editorAdditionalModules: [
PropertiesPanelExtension
]
});
```
4. render fine, but on attempt drug Range to form - got error in console

[wrapper-sample](https://github.com/DK-2013/form-js-examples/tree/wrapper/wrapper-sample)

### Expected Behavior

no error, custom component work as in custom-sample

### Environment

- Host (Browser/Node version), if applicable: FireFox 119, Node 18.16.0
- OS: Ubuntu 22.04
- Library version: @bpmn-io/form-js ^1.4.0

Contributor guide

Open the contributing guide

Research direction

Start with the linked wrapper-sample and compare its FormPlayground setup with the custom-sample, focusing on the additionalModules and editorAdditionalModules configuration. Reproduce the error by dragging a Range field into the form and inspect the NumberField failure. Done means the custom component works in the Preact wrapper without a console error.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript
Domain
frontend
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.