@bpmn-io/form-js-viewer 1.0.0-alpha.6 → 1.0.0-alpha.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/LICENSE CHANGED
@@ -1,23 +1,23 @@
1
- Copyright (c) 2021-present Camunda Services GmbH
2
-
3
- Permission is hereby granted, free of charge, to any person obtaining a copy of
4
- this software and associated documentation files (the "Software"), to deal in the
5
- Software without restriction, including without limitation the rights to use, copy,
6
- modify, merge, publish, distribute, sublicense, and/or sell copies of the Software,
7
- and to permit persons to whom the Software is furnished to do so, subject to the
8
- following conditions:
9
-
10
- The above copyright notice and this permission notice shall be included in all
11
- copies or substantial portions of the Software.
12
-
13
- The source code responsible for displaying the bpmn.io project watermark that
14
- links back to https://bpmn.io as part of rendered diagrams MUST NOT be
15
- removed or changed. When this software is being used in a website or application,
16
- the watermark must stay fully visible and not visually overlapped by other elements.
17
-
18
- THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED,
19
- INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR
20
- PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
21
- LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT,
22
- TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE
1
+ Copyright (c) 2021-present Camunda Services GmbH
2
+
3
+ Permission is hereby granted, free of charge, to any person obtaining a copy of
4
+ this software and associated documentation files (the "Software"), to deal in the
5
+ Software without restriction, including without limitation the rights to use, copy,
6
+ modify, merge, publish, distribute, sublicense, and/or sell copies of the Software,
7
+ and to permit persons to whom the Software is furnished to do so, subject to the
8
+ following conditions:
9
+
10
+ The above copyright notice and this permission notice shall be included in all
11
+ copies or substantial portions of the Software.
12
+
13
+ The source code responsible for displaying the bpmn.io project watermark that
14
+ links back to https://bpmn.io as part of rendered diagrams MUST NOT be
15
+ removed or changed. When this software is being used in a website or application,
16
+ the watermark must stay fully visible and not visually overlapped by other elements.
17
+
18
+ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED,
19
+ INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR
20
+ PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
21
+ LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT,
22
+ TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE
23
23
  OR OTHER DEALINGS IN THE SOFTWARE.
package/README.md CHANGED
@@ -1,164 +1,164 @@
1
- # @bpmn-io/form-js-viewer
2
-
3
- This library exports a form viewer for viewing and submitting forms. Use [our editor](../form-js-editor) to create and edit forms.
4
-
5
-
6
- ## Installation
7
-
8
- ```
9
- npm install @bpmn-io/form-js-viewer
10
- ```
11
-
12
-
13
- ## Usage
14
-
15
- ```javascript
16
- import { Form } from '@bpmn-io/form-js-viewer';
17
-
18
- const schema = {
19
- components: [
20
- {
21
- key: 'creditor',
22
- label: 'Creditor',
23
- type: 'textfield',
24
- validate: {
25
- required: true
26
- }
27
- }
28
- ]
29
- };
30
-
31
- const data = {
32
- creditor: 'John Doe Company'
33
- };
34
-
35
- const form = new Form({
36
- container: document.querySelector('#form')
37
- });
38
-
39
- await form.importSchema(schema, data);
40
-
41
- // add event listeners
42
- form.on('submit', event => {
43
- console.log('Form <submit>', event);
44
- });
45
-
46
- // provide a priority to event listeners
47
- form.on('changed', 500, event => {
48
- console.log('Form <changed>', event);
49
- });
50
- ```
51
-
52
- Check out [a full example](https://github.com/bpmn-io/form-js-examples).
53
-
54
-
55
- ## Styling
56
-
57
- For proper styling include the `form-js.css` stylesheet and font used:
58
-
59
- ```html
60
- <link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:ital,wght@0,400;0,600;1,400&display=swap" rel="stylesheet">
61
-
62
- <link href="https://unpkg.com/@bpmn-io/form-js/dist/assets/form-js.css" rel="stylesheet">
63
- ```
64
-
65
-
66
- ## API
67
-
68
- ### `Form`
69
-
70
- Create a new form with options `{ container?: HTMLElement }`.
71
-
72
- ```javascript
73
- import { Form } from '@bpmn-io/form-js-viewer';
74
-
75
- const form = new Form({
76
- container: document.querySelector('#form')
77
- });
78
- ```
79
-
80
-
81
- ### `Form#importSchema(schema: Schema, data?: Data) => Promise<Result, Error>`
82
-
83
- Display a form represented via a form schema and the optional data.
84
-
85
- ```javascript
86
- try {
87
- await form.importSchema(schema);
88
- } catch (err) {
89
- console.log('importing form failed', err);
90
- }
91
- ```
92
-
93
-
94
- ### `Form#submit() => { data: Data, errors: Errors }`
95
-
96
- Submit a form programatically.
97
-
98
- ```javascript
99
- const {
100
- data,
101
- errors
102
- } = form.submit();
103
-
104
- if (Object.keys(errors).length) {
105
- console.error('Form submitted with errors', errors);
106
- }
107
- ```
108
-
109
-
110
- ### `Form#validate() => Errors`
111
-
112
- Validate a form programatically.
113
-
114
- ```javascript
115
- const errors = form.validate();
116
-
117
- if (Object.keys(errors).length) {
118
- console.error('Form has errors', errors);
119
- }
120
- ```
121
-
122
-
123
- ### `Form#reset() => void`
124
-
125
- Reset a form programatically.
126
-
127
-
128
- ### `Form#setProperty(key, value) => void`
129
-
130
- Set a form property such as `readOnly`.
131
-
132
-
133
- ### `Form#attachTo(parentNode: HTMLElement) => void`
134
-
135
-
136
- Attach the form to a parent node.
137
-
138
-
139
- ### `Form#detach() => void`
140
-
141
-
142
- Detach the form from its parent node.
143
-
144
-
145
- ### `Form#on(event, fn) => void`
146
-
147
- Subscribe to an [event](#events).
148
-
149
-
150
- ### `Form#destroy() => void`
151
-
152
- Remove form from the document.
153
-
154
-
155
- ## Events
156
-
157
- The form emits the `changed` and `submit` events you may hook into.
158
-
159
- Both events receive `{ data, errors }` as a payload.
160
-
161
-
162
- ## License
163
-
164
- Use under the terms of the [bpmn.io license](http://bpmn.io/license).
1
+ # @bpmn-io/form-js-viewer
2
+
3
+ This library exports a form viewer for viewing and submitting forms. Use [our editor](../form-js-editor) to create and edit forms.
4
+
5
+
6
+ ## Installation
7
+
8
+ ```
9
+ npm install @bpmn-io/form-js-viewer
10
+ ```
11
+
12
+
13
+ ## Usage
14
+
15
+ ```javascript
16
+ import { Form } from '@bpmn-io/form-js-viewer';
17
+
18
+ const schema = {
19
+ components: [
20
+ {
21
+ key: 'creditor',
22
+ label: 'Creditor',
23
+ type: 'textfield',
24
+ validate: {
25
+ required: true
26
+ }
27
+ }
28
+ ]
29
+ };
30
+
31
+ const data = {
32
+ creditor: 'John Doe Company'
33
+ };
34
+
35
+ const form = new Form({
36
+ container: document.querySelector('#form')
37
+ });
38
+
39
+ await form.importSchema(schema, data);
40
+
41
+ // add event listeners
42
+ form.on('submit', event => {
43
+ console.log('Form <submit>', event);
44
+ });
45
+
46
+ // provide a priority to event listeners
47
+ form.on('changed', 500, event => {
48
+ console.log('Form <changed>', event);
49
+ });
50
+ ```
51
+
52
+ Check out [a full example](https://github.com/bpmn-io/form-js-examples).
53
+
54
+
55
+ ## Styling
56
+
57
+ For proper styling include the `form-js.css` stylesheet and font used:
58
+
59
+ ```html
60
+ <link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:ital,wght@0,400;0,600;1,400&display=swap" rel="stylesheet">
61
+
62
+ <link href="https://unpkg.com/@bpmn-io/form-js/dist/assets/form-js.css" rel="stylesheet">
63
+ ```
64
+
65
+
66
+ ## API
67
+
68
+ ### `Form`
69
+
70
+ Create a new form with options `{ container?: HTMLElement }`.
71
+
72
+ ```javascript
73
+ import { Form } from '@bpmn-io/form-js-viewer';
74
+
75
+ const form = new Form({
76
+ container: document.querySelector('#form')
77
+ });
78
+ ```
79
+
80
+
81
+ ### `Form#importSchema(schema: Schema, data?: Data) => Promise<Result, Error>`
82
+
83
+ Display a form represented via a form schema and the optional data.
84
+
85
+ ```javascript
86
+ try {
87
+ await form.importSchema(schema);
88
+ } catch (err) {
89
+ console.log('importing form failed', err);
90
+ }
91
+ ```
92
+
93
+
94
+ ### `Form#submit() => { data: Data, errors: Errors }`
95
+
96
+ Submit a form programatically.
97
+
98
+ ```javascript
99
+ const {
100
+ data,
101
+ errors
102
+ } = form.submit();
103
+
104
+ if (Object.keys(errors).length) {
105
+ console.error('Form submitted with errors', errors);
106
+ }
107
+ ```
108
+
109
+
110
+ ### `Form#validate() => Errors`
111
+
112
+ Validate a form programatically.
113
+
114
+ ```javascript
115
+ const errors = form.validate();
116
+
117
+ if (Object.keys(errors).length) {
118
+ console.error('Form has errors', errors);
119
+ }
120
+ ```
121
+
122
+
123
+ ### `Form#reset() => void`
124
+
125
+ Reset a form programatically.
126
+
127
+
128
+ ### `Form#setProperty(key, value) => void`
129
+
130
+ Set a form property such as `readOnly`.
131
+
132
+
133
+ ### `Form#attachTo(parentNode: HTMLElement) => void`
134
+
135
+
136
+ Attach the form to a parent node.
137
+
138
+
139
+ ### `Form#detach() => void`
140
+
141
+
142
+ Detach the form from its parent node.
143
+
144
+
145
+ ### `Form#on(event, fn) => void`
146
+
147
+ Subscribe to an [event](#events).
148
+
149
+
150
+ ### `Form#destroy() => void`
151
+
152
+ Remove form from the document.
153
+
154
+
155
+ ## Events
156
+
157
+ The form emits the `changed` and `submit` events you may hook into.
158
+
159
+ Both events receive `{ data, errors }` as a payload.
160
+
161
+
162
+ ## License
163
+
164
+ Use under the terms of the [bpmn.io license](http://bpmn.io/license).