From 484e2fe875c5e8549bdb8f2da8a58e0118b84fc6 Mon Sep 17 00:00:00 2001 From: Cory LaViska Date: Fri, 28 Aug 2020 16:53:39 -0400 Subject: [PATCH] Added form control info --- CONTRIBUTING.md | 9 +++++++++ 1 file changed, 9 insertions(+) diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md index 8452687b..15bd5af2 100644 --- a/CONTRIBUTING.md +++ b/CONTRIBUTING.md @@ -188,3 +188,12 @@ When a component relies on the presence of a slot to do something, don't assume - Don't conditionally render any slots — always use `hidden` or `display: none` so the slot exists in the DOM See the source of card, dialog, or drawer for examples. + +### Form Controls + +All form controls that can be validated should: + +- Have an `invalid` prop that reflects its validity +- Have a `setCustomValidity()` method so the user can set a custom validation message +- Have a `reportValidity()` method that reports its validity for form submission +- Adhere to native attributes such as `required`, `pattern`, `minlength`, `maxlength`, etc. when it makes sense