-
Notifications
You must be signed in to change notification settings - Fork 16
/
redux-form.redux.txt
108 lines (85 loc) · 7.31 KB
/
redux-form.redux.txt
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
REDUX-FORM
VERSION ==> #4.0.5
GOAL ==> #Convenience library to work with form controls in Redux architecture:
# - update STATE on user input
# - including forcing value (normalization)
# - validation (on update|blur|submit)
# - controls state (dirty, touched, visited, active)
# - form state (submitting, submitFailed)
/=+===============================+=\
/ : : \
)==: REDUCER :==(
\ :_______________________________: /
\=+===============================+=/
RFORM.reducer #RFUNC, to assign to STATE[CONF.reduxMountPoint] (def: 'form')
#Will handle actions dispatched by RCOMP and update STATE accordingly
RFORM.reducer.plugin
({ VAR: RFUNC2 }) #Like RFORM.reducer, but also assign RFUNC2 to STATE.VAR
RFORM.reducer.normalize #Like RFORM.reducer, but will transform STATE.VAR.VAR2 VAL to VAL2, using
({ VAR: { VAR2: FUNC ... } }) # FUNC(VAL, PREV_VAL, OBJ, PREV_OBJ)->VAL2
#[PREV_]OBJ is STATE.VAR
/=+===============================+=\
/ : : \
)==: COMPONENT :==(
\ :_______________________________: /
\=+===============================+=/
RFORM.reduxForm(CONF[, ...]) #Creates PROPS (listed below) which will update STATE:
(RTYPE)->RTYPE2 # - VAR[.VAR2], when specifying CONF.form 'VAR' and CONF.formKey 'VAR2'
# - or, if specified, CONF.getFormState(STATE, 'VAR', 'VAR2')->OBJ
# - destroyed on:
# - 'unmount' if CONF.destroyOnUnmount true (def)
# - PROPS.destroyForm()
#Any CONF.VAR can be passed as PROPS.VAR instead
# - can use CONF.propNamespace 'VAR2' to use PROPS.VAR2.VAR instead
#...: passed to REACT-REDUX.connect(...)
CONF.readonly #BOOL
PROPS.fields.FIELD #OBJ:
# - according to CONF.fields FIELD_ARR, where FIELD can be 'VAR|VARR|NUM'
# - fields.ARR.addField(VAL[, NUM]) and fields.ARR.removeField([NUM]) can be used too
# - HTML attributes to expand on form controls:
# - <input>, <select>
# - <input type="radio"> must also: { value: "VAL", checked: OBJ.value === 'VAL' }
# - <input type="file"> must also: { value: null }, after reduxForm attributes
# - <textarea> must also: { value: OBJ.value || '' }
FIELD.name #'FIELD'
FIELD.value #VAL
FIELD.initialValue #First FIELD.value, initialized on 'mount' using CONF.initialValues.FIELD VAL
FIELD.pristine|dirty #BOOL: different from initial value
FIELD.error #'ERROR', set using:
# - CONF.validate({ FIELD: VAL ... }, PROPS)->{ FIELD: 'ERROR' ... }
# - performed on update
# - CONF.asyncValidate FUNC({ FIELD: VAL ... }, DISPATCH, PROPS)->PROMISE,
# which can be rejected to { FIELD: 'ERROR' }
# - performed on blur of CONF.asyncBlurFields FIELD_ARR
# - sets PROPS.asyncValidating true
# - FUNC from CONF.onSubmit or handleSubmit(FUNC)
# - performed on submit
FIELD.valid|invalid #BOOL: if error set
FIELD.touched #BOOL, on:
# - blur if CONF.touchOnBlur true (def)
# - change if CONF.touchOnChange true (def: false)
# - PROPS.[un]touch('FIELD'...) or PROPS.[un]touchAll()
FIELD.active #BOOL: has focus
FIELD.visited #BOOL: had once focus
FIELD.on* #Used to make rest work
#Can override but then argument can be either REVENT or VAL
PROPS.values|error|valid|invalid|
pristine|dirty|active #Union of FIELD attributes: { FIELD: VAL }|BOOL|'FIELD'
/=+===============================+=\
/ : : \
)==: COMPONENT ACTIONS :==(
\ :_______________________________: /
\=+===============================+=/
PROPS.handleSubmit([FUNC]) #Sends form:
# - to assign e.g. to <form onSubmit> on <button onClick>
# - FUNC({ FIELD: VAL ... }, DISPATCH, PROPS)->PROMISE
# - def: CONF.onSubmit
# - if CONF.returnRejectedSubmitPromise true (def: false),
# handleSubmit() will return FUNC return value
PROPS.submitting #true when PROPS.handleSubmit() returns ongoing PROMISE
PROPS.submitFailed #true when PROPS.handleSubmit() failed
PROPS.initializesForm
({ FIELD: VAL ... }) #Resets form
PROPS.resetForm(REVENT) #Clears form