@getodk/web-forms 0.6.0 → 0.8.0
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/README.md +34 -6
- package/dist/index.js +15848 -12655
- package/package.json +19 -13
package/README.md
CHANGED
|
@@ -7,21 +7,49 @@ This package is a Vue component library that uses [`@getodk/xforms-engine`](../x
|
|
|
7
7
|
To use this library in a Vue.js application:
|
|
8
8
|
|
|
9
9
|
1. Import `@getodk/web-forms` as a dependency in the application
|
|
10
|
-
2. Install the exported plugin by adding app.use(WebFormsPlugin) in entry component (usually App.vue)
|
|
10
|
+
2. Install the exported plugin by adding `app.use(WebFormsPlugin)` in entry component (usually App.vue)
|
|
11
11
|
3. Add the exported component anywhere in the application:
|
|
12
12
|
|
|
13
13
|
```html
|
|
14
|
-
<OdkWebForm
|
|
14
|
+
<OdkWebForm
|
|
15
|
+
:form-xml="formXml"
|
|
16
|
+
:fetch-form-attachment="fetchAttachment"
|
|
17
|
+
:missing-resource-behavior="missingBehavior"
|
|
18
|
+
:submission-max-size="5242880" <!-- 5MB -->
|
|
19
|
+
:edit-instance="editOptions"
|
|
20
|
+
@submit="handleSubmit"
|
|
21
|
+
@submit-chunked="handleChunkedSubmit"
|
|
22
|
+
/>
|
|
15
23
|
```
|
|
16
24
|
|
|
17
|
-
|
|
25
|
+
### Plugin
|
|
18
26
|
|
|
19
27
|
The plugin is there to initialize PrimeVue, currently it exposes no options. In the future, configuration options may be added to the plugin.
|
|
20
28
|
|
|
21
|
-
|
|
29
|
+
```js
|
|
30
|
+
import { WebFormsPlugin } from '@getodk/web-forms';
|
|
31
|
+
app.use(WebFormsPlugin);
|
|
32
|
+
```
|
|
33
|
+
|
|
34
|
+
### Props (`OdkWebFormsProps`)
|
|
35
|
+
|
|
36
|
+
The `<OdkWebForm>` component accepts the following props:
|
|
37
|
+
|
|
38
|
+
- `formXml` (`string`, required): The XML of the ODK XForm to be rendered
|
|
39
|
+
- `fetchFormAttachment` (`FetchFormAttachment`, required): Function to fetch form attachments
|
|
40
|
+
- `missingResourceBehavior` (`MissingResourceBehavior`, optional): Defines behavior when resources are missing
|
|
41
|
+
- `submissionMaxSize` (`number`, optional): Maximum size for chunked submissions. Required when subscribing to `submitChunked` event
|
|
42
|
+
- `editInstance` (`EditInstanceOptions`, optional): Options to resolve and load instance and attachment resources for editing
|
|
43
|
+
|
|
44
|
+
### Events (`OdkWebFormEmits`)
|
|
45
|
+
|
|
46
|
+
The component emits the following events:
|
|
22
47
|
|
|
23
|
-
- `
|
|
24
|
-
-
|
|
48
|
+
- `submit`: Emitted when the user presses the "Send" button on a valid form
|
|
49
|
+
- Payload: ([submissionPayload: MonolithicInstancePayload, callback: HostSubmissionResultCallback])
|
|
50
|
+
- `submitChunked`: Emitted for chunked submissions when the form is valid
|
|
51
|
+
- Payload: ([submissionPayload: ChunkedInstancePayload, callback: HostSubmissionResultCallback])
|
|
52
|
+
- Note: Requires `submissionMaxSize` prop to be set
|
|
25
53
|
|
|
26
54
|
### What if I don't use Vue?
|
|
27
55
|
|