Skip to content

Commit 2e644c6

Browse files
committed
docs(readme): add demo link, fix example
BREAKING CHANGE: Release 1.0.0
1 parent 3d0aacd commit 2e644c6

File tree

1 file changed

+10
-18
lines changed

1 file changed

+10
-18
lines changed

README.md

Lines changed: 10 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,8 @@
1010

1111
Declarative forms for [Svelte](https://svelte.dev/).
1212

13+
[DEMO](https://svelte.dev/repl/8e7deaa261364b4f8b2c0caff1982eeb?version=3.12.1)
14+
1315
## Features
1416

1517
- optional schema-based validation through [Yup](https://github.com/jquense/yup)
@@ -141,7 +143,7 @@ $ yarn add sveltejs-forms
141143
<script>
142144
import { Form } from 'sveltejs-forms';
143145
import Select from 'svelte-select';
144-
import * as yup from 'yup';
146+
import yup from 'yup';
145147
146148
let svelteSelect;
147149
@@ -155,10 +157,7 @@ $ yarn add sveltejs-forms
155157
}
156158
157159
const schema = yup.object().shape({
158-
food: yup
159-
.array()
160-
.of(yup.string().required())
161-
.min(2),
160+
food: yup.string().required()
162161
});
163162
164163
let items = [
@@ -173,29 +172,22 @@ $ yarn add sveltejs-forms
173172
<Form
174173
{schema}
175174
on:submit={handleSubmit}
175+
let:isSubmitting
176176
let:setValue
177-
let:validate
178177
let:values
179178
let:errors
180179
let:touched>
181180

182181
<Select
183182
{items}
184-
isMulti={true}
185183
bind:this={svelteSelect}
186184
inputAttributes="{{ name: 'food' }}"
187185
hasError="{touched['food'] && errors['food']}"
188-
on:select="{({ detail }) => {
189-
setValue('food', detail && detail.map(item => item.value));
190-
validate();
191-
}}"
192-
on:clear="{() => {
193-
setValue('food', []);
194-
validate();
195-
}}"
196-
selectedValue="{items.filter(item => values['food'].includes(item.value))}" />
197-
198-
<button type="submit">Sign in</button>
186+
on:select="{({ detail }) => setValue('food', detail.value)}"
187+
on:clear="{() => setValue('food', '')}"
188+
selectedValue="{items.find(item => item.value === values['food'])}"/>
189+
190+
<button type="submit" disabled={isSubmitting}>Submit</button>
199191
</Form>
200192
```
201193

0 commit comments

Comments
 (0)