ayo/lion
1
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

chore(form-system): update umbrella form

Browse source
This commit is contained in:
qa46hx 2020-02-04 16:38:08 +01:00 committed by Thomas Allmer
parent f49bdf80a6
commit 72d91e28c7
1 changed files with 15 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

22
packages/form-system/stories/15-features-overview.stories.mdx
View file

@ -7,6 +7,7 @@ import '@lion/input-amount/lion-input-amount.js';
import '@lion/input-date/lion-input-date.js';
import '@lion/input-email/lion-input-email.js';
import '@lion/input-iban/lion-input-iban.js';
import '@lion/input-range/lion-input-range.js';
import '@lion/input/lion-input.js';
import '@lion/option/lion-option.js';
import '@lion/radio-group/lion-radio-group.js';
@ -41,10 +42,10 @@ For usage and installation please see the appropriate packages.
label="Last Name"
.validators="${[new Required()]}"
></lion-input>
<!-- TODO: lion-input-birthdate -->
<lion-input-date
name="date"
label="Date of application"
.modelValue="${new Date('2000-12-12')}"
.validators="${[new Required()]}"
></lion-input-date>
<lion-textarea
@ -66,11 +67,9 @@ For usage and installation please see the appropriate packages.
<lion-checkbox name="checkers[]" value="baz" label="I like baz"></lion-checkbox>
</lion-checkbox-group>
<lion-radio-group
class="vertical"
name="dinosaurs"
label="Favorite dinosaur"
.validators="${[new Required()]}"
error-message="Dinosaurs error message"
>
<lion-radio name="dinosaurs[]" value="allosaurus" label="allosaurus"></lion-radio>
<lion-radio name="dinosaurs[]" value="brontosaurus" label="brontosaurus"></lion-radio>
@ -84,7 +83,7 @@ For usage and installation please see the appropriate packages.
</lion-options>
</lion-select-rich>
<lion-select
label="Make a selection (simple select)"
label="Lyrics"
name="lyrics"
.validators="${[new Required()]}"
>
@ -94,13 +93,21 @@ For usage and installation please see the appropriate packages.
<option value="3">Drop down for what?</option>
</select>
</lion-select>
<lion-input-range
name="range"
min="1"
max="5"
.modelValue="${2.3}"
unit="%"
step="0.1"
label="Input range"
></lion-input-range>
<lion-checkbox-group name="terms" .validators="${[new Required()]}">
<lion-checkbox
name="terms[]"
label="I blindly accept all terms and conditions"
></lion-checkbox>
</lion-checkbox-group>
<!-- TODO: slider -->
<lion-textarea name="comments" label="Comments"></lion-textarea>
<div class="buttons">
<lion-button raised>Submit</lion-button>
@ -126,13 +133,14 @@ import '@lion/input-amount/lion-input-amount.js';
import '@lion/input-date/lion-input-date.js';
import '@lion/input-email/lion-input-email.js';
import '@lion/input-iban/lion-input-iban.js';
import '@lion/input-range/lion-input-range.js';
import '@lion/input/lion-input.js';
import '@lion/option/lion-option.js';
import '@lion/radio-group/lion-radio-group.js';
import '@lion/radio/lion-radio.js';
import '@lion/select-rich/lion-select-rich.js';
import '@lion/select/lion-select.js';
import '@lion/select-rich/lion-options.js';
import '@lion/option/lion-option.js';
import '@lion/select-rich/lion-select-rich.js';
import '@lion/textarea/lion-textarea.js';
import { MinLength, Required } from '@lion/validate';
```