@bpmn-io/form-js v1.8.7
@bpmn-io/form-js
View, edit and simulate JSON-based forms.
Usage
This library exports a form viewer, editor and playground.
Display a form
Renders a form based on [a form schema](./docs/FORM_SCHEMA.md) and existing data:
import { Form } from '@bpmn-io/form-js';
const form = new Form({
container: document.querySelector('#form'),
});
await form.importSchema(schema, data);
form.on('submit', (event) => {
console.log(event.data, event.errors);
});
See [viewer documentation](./packages/form-js-viewer) for further details.
Create and edit a form
Create a new form or edit an exsting one:
import { FormEditor } from '@bpmn-io/form-js';
const formEditor = new FormEditor({
container: document.querySelector('#form-editor'),
});
await formEditor.importSchema(schema);
See [editor documentation](./packages/form-js-editor) for further details.
Create and simulate a form with input and output data
Create and simulate a form with input and output data:
import { FormPlayground } from '@bpmn-io/form-js';
const formPlayground = new FormPlayground({
container: document.querySelector('#form-playground'),
schema,
data,
});
See [playground documentation](./packages/form-js-playground) for further details.
Retrieve schema variables from a form
Use the getSchemaVariables
util to retrieve the variables defined in a form schema. This is useful to gather what data is consumed and produced by a form.
import { getSchemaVariables } from '@bpmn-io/form-js';
const variables = getSchemaVariables(schema);
console.log('Schema variables', variables);
It is also possible to distinct between input and output variables:
import { getSchemaVariables } from '@bpmn-io/form-js';
const outputVariables = getSchemaVariables(schema, { inputs: false });
const inputVariables = getSchemaVariables(schema, { outputs: false });
Resources
- [Demo](https://demo.bpmn.io/form)
- [Issues](https://github.com/bpmn-io/form-js/issues)
- [Changelog](../form-js/CHANGELOG.md)
- [Form schema](../../docs/FORM_SCHEMA.md)
License
Use under the terms of the [bpmn.io license](http://bpmn.io/license).
5 days ago
28 days ago
1 month ago
1 month ago
2 months ago
2 months ago
2 months ago
2 months ago
3 months ago
3 months ago
3 months ago
4 months ago
4 months ago
4 months ago
5 months ago
5 months ago
5 months ago
5 months ago
6 months ago
10 months ago
11 months ago
7 months ago
7 months ago
8 months ago
10 months ago
7 months ago
7 months ago
8 months ago
8 months ago
6 months ago
12 months ago
12 months ago
12 months ago
12 months ago
11 months ago
12 months ago
12 months ago
12 months ago
12 months ago
12 months ago
12 months ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
2 years ago
2 years ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago