transfer list and notification

1 files changed, 30 insertions, 0 deletions

diff --git a/DESIGN.md b/DESIGN.md
index b245d72..43596f8 100644
--- a/DESIGN.md
+++ b/DESIGN.md
@@ -68,6 +68,36 @@ The core concepts are:
  * <Input /> an others: defines UI, create <input /> DOM controls and access the
    form with useField()
 
+To use it you will need a state somewhere with the object holding all the form
+information.
+
+```
+const [state, setState] = useState({ name: '', age: 11 })
+```
+
+Optionally an error object an be built with the error messages
+
+```
+const errors = {
+  field1: undefined,
+  field2: 'should be greater than 18',
+}
+```
+
+This 3 elements are use to setup the FormProvider
+
+```
+<FormProvider errors={errors} object={state} valueHandler={setState}>
+...inputs
+</FormProvider>
+```
+
+Inputs should handle UI rendering and use `useField(name)` to get:
+
+  * error: the error message if there is one
+  * value: the current value of the object
+  * onChange: function to update the current field
+
 
 # Custom Hooks