Feat v0.9.5 typed forms sdk (#79)
All checks were successful
CI/CD / detect-changes (push) Successful in 4s
CI/CD / test-runners (push) Has been skipped
CI/CD / e2e-smoke (push) Has been skipped
CI/CD / test-frontend (push) Successful in 5s
CI/CD / test-go-pg (push) Successful in 2m44s
CI/CD / test-sqlite (push) Successful in 3m6s
CI/CD / build-and-deploy (push) Successful in 29s
All checks were successful
CI/CD / detect-changes (push) Successful in 4s
CI/CD / test-runners (push) Has been skipped
CI/CD / e2e-smoke (push) Has been skipped
CI/CD / test-frontend (push) Successful in 5s
CI/CD / test-go-pg (push) Successful in 2m44s
CI/CD / test-sqlite (push) Successful in 3m6s
CI/CD / build-and-deploy (push) Successful in 29s
Co-authored-by: Jeffrey Smith <jasafpro@gmail.com> Co-committed-by: Jeffrey Smith <jasafpro@gmail.com>
This commit was merged in pull request #79.
This commit is contained in:
@@ -248,6 +248,44 @@ Every surface uses one of three patterns:
|
||||
The shell provides the home link, notification bell, and user menu
|
||||
on every surface for free.
|
||||
|
||||
## `sw.forms` — Typed Forms (v0.9.5)
|
||||
|
||||
Any extension can render and validate typed forms using the `sw.forms` module.
|
||||
|
||||
### `sw.forms.render(container, template, opts)`
|
||||
|
||||
Renders a typed form into a DOM container. Supports flat forms and progressive
|
||||
multi-step forms (fieldsets). Returns a control handle.
|
||||
|
||||
```js
|
||||
const handle = sw.forms.render(document.getElementById('my-form'), template, {
|
||||
values: { name: 'prefilled' },
|
||||
onSubmit: (data) => { console.log('submitted', data); },
|
||||
});
|
||||
|
||||
// Programmatic access
|
||||
const data = handle.getData();
|
||||
handle.setErrors([{ key: 'name', message: 'Name is taken' }]);
|
||||
handle.destroy();
|
||||
```
|
||||
|
||||
### `sw.forms.validate(template, data)`
|
||||
|
||||
Client-side validation (no network call). Returns `{ valid, errors }`.
|
||||
|
||||
```js
|
||||
const { valid, errors } = sw.forms.validate(template, { name: '' });
|
||||
// valid === false, errors === [{ key: 'name', message: 'Name is required' }]
|
||||
```
|
||||
|
||||
### `sw.forms.validateRemote(template, data)`
|
||||
|
||||
Server-side validation via `POST /api/v1/forms/validate`. Returns a Promise.
|
||||
|
||||
```js
|
||||
const result = await sw.forms.validateRemote(template, data);
|
||||
```
|
||||
|
||||
## Extension CSS contract
|
||||
|
||||
Extensions must prefix all CSS classes with `.ext-{slug}-` to avoid
|
||||
|
||||
Reference in New Issue
Block a user