envoc-form 2.0.1-9 → 2.0.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +7 -7
- package/dist/css/envoc-form-styles.css +7 -6
- package/dist/css/envoc-form-styles.css.map +1 -1
- package/es/AddressInput/AddressInput.js +7 -6
- package/es/ConfirmBaseForm/ConfirmBaseForm.js +3 -2
- package/es/ConfirmDeleteForm/ConfirmDeleteForm.js +2 -1
- package/es/DatePickerInput/DatePickerInput.js +22 -5
- package/es/FileInput/DefaultFileList.js +3 -2
- package/es/FileInput/DropzoneFileInput.js +15 -12
- package/es/FileInput/FileInput.js +31 -9
- package/es/Form/Form.js +2 -1
- package/es/FormGroupWrapper.js +2 -1
- package/es/FormInput/FormInput.js +12 -6
- package/es/FormInputArray/FormInputArray.js +39 -24
- package/es/IconInput.js +2 -1
- package/es/ReactSelectField/ReactSelectField.js +6 -3
- package/es/SubmitFormButton.js +2 -1
- package/es/__Tests__/FormTestBase.js +5 -2
- package/es/normalizers.js +10 -5
- package/es/useStandardFormInput.js +4 -2
- package/lib/AddressInput/AddressInput.js +14 -8
- package/lib/ConfirmBaseForm/ConfirmBaseForm.js +4 -2
- package/lib/ConfirmDeleteForm/ConfirmDeleteForm.js +3 -1
- package/lib/DatePickerInput/DatePickerInput.js +25 -5
- package/lib/FileInput/DefaultFileList.js +3 -2
- package/lib/FileInput/DropzoneFileInput.js +17 -12
- package/lib/FileInput/FileInput.js +39 -10
- package/lib/Form/Form.js +9 -3
- package/lib/Form/FormBasedPreventNavigation.js +5 -1
- package/lib/FormGroupWrapper.js +3 -1
- package/lib/FormInput/FormInput.js +13 -6
- package/lib/FormInputArray/FormInputArray.js +47 -26
- package/lib/FormSection.js +5 -1
- package/lib/IconInput.js +3 -1
- package/lib/ReactSelectField/ReactSelectField.js +13 -5
- package/lib/ReactSelectField/index.js +6 -2
- package/lib/SubmitFormButton.js +3 -1
- package/lib/__Tests__/FormTestBase.js +6 -2
- package/lib/index.js +7 -3
- package/lib/normalizers.js +10 -5
- package/lib/useStandardFormInput.js +5 -2
- package/lib/validators/index.js +5 -1
- package/package.json +99 -93
- package/src/AddressInput/AddesssInput.test.js +23 -23
- package/src/AddressInput/AddressInput.js +73 -73
- package/src/AddressInput/UsStates.js +53 -53
- package/src/AddressInput/__snapshots__/AddesssInput.test.js.snap +207 -207
- package/src/AddressInput/index.js +2 -2
- package/src/BoolInput/BoolInput.js +7 -7
- package/src/BoolInput/BoolInput.test.js +23 -23
- package/src/BoolInput/InlineBoolInput.js +7 -7
- package/src/BoolInput/__snapshots__/BoolInput.test.js.snap +89 -89
- package/src/BoolInput/boolOptions.js +6 -6
- package/src/BoolInput/index.js +4 -4
- package/src/ConfirmBaseForm/ConfirmBaseForm.js +37 -37
- package/src/ConfirmBaseForm/ConfirmBaseForm.test.js +14 -14
- package/src/ConfirmBaseForm/__snapshots__/ConfirmBaseForm.test.js.snap +23 -23
- package/src/ConfirmBaseForm/index.js +1 -1
- package/src/ConfirmDeleteForm/ConfirmDeleteForm.js +39 -39
- package/src/ConfirmDeleteForm/ConfirmDeleteForm.test.js +24 -24
- package/src/ConfirmDeleteForm/__snapshots__/ConfirmDeleteForm.test.js.snap +25 -25
- package/src/ConfirmDeleteForm/index.js +1 -1
- package/src/DatePickerInput/DatePickerInput.js +58 -46
- package/src/DatePickerInput/DatePickerInput.test.js +74 -74
- package/src/DatePickerInput/__snapshots__/DatePickerInput.test.js.snap +134 -134
- package/src/DatePickerInput/date-picker-input.scss +42 -42
- package/src/DatePickerInput/index.js +3 -3
- package/src/ErrorScrollTarget.js +6 -6
- package/src/FileInput/DefaultFileList.js +39 -39
- package/src/FileInput/DropzoneFileInput.js +56 -55
- package/src/FileInput/DropzoneFileInput.test.js +24 -15
- package/src/FileInput/FileInput.js +77 -49
- package/src/FileInput/FileInput.test.js +24 -15
- package/src/FileInput/__snapshots__/DropzoneFileInput.test.js.snap +57 -28
- package/src/FileInput/__snapshots__/FileInput.test.js.snap +58 -22
- package/src/FileInput/file-input.scss +57 -57
- package/src/FileInput/index.js +4 -4
- package/src/Form/FocusError.js +48 -48
- package/src/Form/Form.js +139 -139
- package/src/Form/Form.test.js +23 -23
- package/src/Form/FormBasedPreventNavigation.js +25 -25
- package/src/Form/ServerErrorContext.js +7 -7
- package/src/Form/__snapshots__/Form.test.js.snap +9 -9
- package/src/Form/index.js +3 -3
- package/src/FormGroup.js +30 -30
- package/src/FormGroupWrapper.js +28 -28
- package/src/FormInput/FormInput.js +144 -144
- package/src/FormInput/FormInput.test.js +66 -66
- package/src/FormInput/__snapshots__/FormInput.test.js.snap +323 -316
- package/src/FormInput/form-input.scss +9 -9
- package/src/FormInput/index.js +2 -2
- package/src/FormInputArray/FormInputArray.js +224 -210
- package/src/FormInputArray/FormInputArray.test.js +108 -59
- package/src/FormInputArray/__snapshots__/FormInputArray.test.js.snap +52 -40
- package/src/FormInputArray/form-input-array.scss +13 -8
- package/src/FormInputArray/index.js +2 -2
- package/src/FormSection.js +13 -13
- package/src/IconInput.js +31 -31
- package/src/InlineFormInput/InlineFormInput.js +6 -6
- package/src/InlineFormInput/InlineFormInput.test.js +23 -23
- package/src/InlineFormInput/__snapshots__/InlineFormInput.test.js.snap +26 -26
- package/src/InlineFormInput/index.js +3 -3
- package/src/InlineFormInput/inline-form-input.scss +3 -3
- package/src/MoneyInput/InlineMoneyInput.js +7 -7
- package/src/MoneyInput/MoneyInput.js +7 -7
- package/src/MoneyInput/MoneyInputs.test.js +43 -43
- package/src/MoneyInput/__snapshots__/MoneyInputs.test.js.snap +81 -81
- package/src/MoneyInput/index.js +4 -4
- package/src/MoneyInput/money-input.scss +3 -3
- package/src/MoneyInput/moneyInputProps.js +12 -12
- package/src/NestedFormFieldContext.js +6 -6
- package/src/ReactSelectField/ReactSelectField.js +122 -120
- package/src/ReactSelectField/index.js +6 -6
- package/src/ReactSelectField/react-select-field.scss +5 -5
- package/src/StandardFormActions.js +27 -27
- package/src/SubmitFormButton.js +28 -28
- package/src/__Tests__/FormTestBase.js +14 -11
- package/src/__Tests__/IconInput.test.js +23 -23
- package/src/__Tests__/StandardFormActions.test.js +23 -23
- package/src/__Tests__/SubmitFormButton.test.js +23 -23
- package/src/__Tests__/__snapshots__/IconInput.test.js.snap +38 -38
- package/src/__Tests__/__snapshots__/StandardFormActions.test.js.snap +25 -25
- package/src/__Tests__/__snapshots__/SubmitFormButton.test.js.snap +18 -18
- package/src/__Tests__/index.js +2 -2
- package/src/_variables.scss +11 -11
- package/src/index.js +33 -33
- package/src/normalizers.js +42 -32
- package/src/selectors.js +3 -3
- package/src/styles.scss +7 -7
- package/src/useStandardFormInput.js +118 -118
- package/src/utils/index.js +3 -3
- package/src/utils/objectContainsNonSerializableProperty.js +15 -15
- package/src/utils/objectContainsNonSerializableProperty.test.js +49 -49
- package/src/utils/objectToFormData.js +89 -89
- package/src/utils/objectToFormData.test.js +76 -76
- package/src/utils/typeChecks.js +18 -18
- package/src/validators/index.js +2 -2
- package/src/validators/validators.js +93 -93
- package/src/validators/validators.test.js +79 -79
- package/CHANGELOG.json +0 -95
- package/CHANGELOG.md +0 -58
@@ -1,23 +1,23 @@
|
|
1
|
-
import React from 'react';
|
2
|
-
import { render } from '@testing-library/react';
|
3
|
-
import { FormTestBase } from '../__Tests__';
|
4
|
-
import AddressInput from './AddressInput';
|
5
|
-
|
6
|
-
describe('AddressInput', () => {
|
7
|
-
it('renders without crashing', () => {
|
8
|
-
render(
|
9
|
-
<FormTestBase>
|
10
|
-
<AddressInput />
|
11
|
-
</FormTestBase>
|
12
|
-
);
|
13
|
-
});
|
14
|
-
|
15
|
-
it('has matching snapshot', () => {
|
16
|
-
const renderResult = render(
|
17
|
-
<FormTestBase>
|
18
|
-
<AddressInput />
|
19
|
-
</FormTestBase>
|
20
|
-
);
|
21
|
-
expect(renderResult.asFragment()).toMatchSnapshot();
|
22
|
-
});
|
23
|
-
});
|
1
|
+
import React from 'react';
|
2
|
+
import { render } from '@testing-library/react';
|
3
|
+
import { FormTestBase } from '../__Tests__';
|
4
|
+
import AddressInput from './AddressInput';
|
5
|
+
|
6
|
+
describe('AddressInput', () => {
|
7
|
+
it('renders without crashing', () => {
|
8
|
+
render(
|
9
|
+
<FormTestBase>
|
10
|
+
<AddressInput />
|
11
|
+
</FormTestBase>
|
12
|
+
);
|
13
|
+
});
|
14
|
+
|
15
|
+
it('has matching snapshot', () => {
|
16
|
+
const renderResult = render(
|
17
|
+
<FormTestBase>
|
18
|
+
<AddressInput />
|
19
|
+
</FormTestBase>
|
20
|
+
);
|
21
|
+
expect(renderResult.asFragment()).toMatchSnapshot();
|
22
|
+
});
|
23
|
+
});
|
@@ -1,73 +1,73 @@
|
|
1
|
-
import React from 'react';
|
2
|
-
import { Col, Row } from 'reactstrap';
|
3
|
-
import PropTypes from 'prop-types';
|
4
|
-
import FormInput from '../FormInput';
|
5
|
-
import FormSection from '../FormSection';
|
6
|
-
import validators from '../validators';
|
7
|
-
import * as normalizers from '../normalizers';
|
8
|
-
import UsStates from './UsStates';
|
9
|
-
|
10
|
-
export default class AddressInput extends React.Component {
|
11
|
-
render() {
|
12
|
-
const { name, ...props } = this.props;
|
13
|
-
return (
|
14
|
-
<FormSection name={name} {...props}>
|
15
|
-
<FormInput
|
16
|
-
name="address1"
|
17
|
-
placeholder="Address, Line 1"
|
18
|
-
label="Address 1"
|
19
|
-
autoComplete="address-line1"
|
20
|
-
validate={validators.required}
|
21
|
-
/>
|
22
|
-
<FormInput
|
23
|
-
name="address2"
|
24
|
-
placeholder="Address, Line 2"
|
25
|
-
label="Address 2"
|
26
|
-
autoComplete="address-line2"
|
27
|
-
/>
|
28
|
-
<FormInput
|
29
|
-
name="city"
|
30
|
-
placeholder="City"
|
31
|
-
label="City"
|
32
|
-
autoComplete="address-level2"
|
33
|
-
validate={validators.required}
|
34
|
-
/>
|
35
|
-
<Row>
|
36
|
-
<Col xs={8}>
|
37
|
-
<FormInput
|
38
|
-
name="state"
|
39
|
-
placeholder="State"
|
40
|
-
label="State"
|
41
|
-
type="select"
|
42
|
-
options={UsStates}
|
43
|
-
autoComplete="address-level1"
|
44
|
-
validate={validators.required}
|
45
|
-
/>
|
46
|
-
</Col>
|
47
|
-
<Col xs={4}>
|
48
|
-
<FormInput
|
49
|
-
name="zipCode"
|
50
|
-
placeholder="Zip"
|
51
|
-
label="Zip"
|
52
|
-
autoComplete="postal-code"
|
53
|
-
normalize={normalizers.zipCode}
|
54
|
-
validate={[validators.required, validators.zipCode]}
|
55
|
-
/>
|
56
|
-
</Col>
|
57
|
-
</Row>
|
58
|
-
</FormSection>
|
59
|
-
);
|
60
|
-
}
|
61
|
-
}
|
62
|
-
AddressInput.propTypes = {
|
63
|
-
/**
|
64
|
-
* The key that the resulting values should be nested under within the form values.
|
65
|
-
* If name prop were chicken the submitted form values would look like: {chicken: {address1:...}}
|
66
|
-
* this allows us to have two address inputs inside the same form (shipping and billing address)
|
67
|
-
*/
|
68
|
-
name: PropTypes.string,
|
69
|
-
};
|
70
|
-
|
71
|
-
AddressInput.defaultProps = {
|
72
|
-
name: 'address',
|
73
|
-
};
|
1
|
+
import React from 'react';
|
2
|
+
import { Col, Row } from 'reactstrap';
|
3
|
+
import PropTypes from 'prop-types';
|
4
|
+
import FormInput from '../FormInput';
|
5
|
+
import FormSection from '../FormSection';
|
6
|
+
import validators from '../validators';
|
7
|
+
import * as normalizers from '../normalizers';
|
8
|
+
import UsStates from './UsStates';
|
9
|
+
|
10
|
+
export default class AddressInput extends React.Component {
|
11
|
+
render() {
|
12
|
+
const { name, ...props } = this.props;
|
13
|
+
return (
|
14
|
+
<FormSection name={name} {...props}>
|
15
|
+
<FormInput
|
16
|
+
name="address1"
|
17
|
+
placeholder="Address, Line 1"
|
18
|
+
label="Address 1"
|
19
|
+
autoComplete="address-line1"
|
20
|
+
validate={validators.required}
|
21
|
+
/>
|
22
|
+
<FormInput
|
23
|
+
name="address2"
|
24
|
+
placeholder="Address, Line 2"
|
25
|
+
label="Address 2"
|
26
|
+
autoComplete="address-line2"
|
27
|
+
/>
|
28
|
+
<FormInput
|
29
|
+
name="city"
|
30
|
+
placeholder="City"
|
31
|
+
label="City"
|
32
|
+
autoComplete="address-level2"
|
33
|
+
validate={validators.required}
|
34
|
+
/>
|
35
|
+
<Row>
|
36
|
+
<Col xs={8}>
|
37
|
+
<FormInput
|
38
|
+
name="state"
|
39
|
+
placeholder="State"
|
40
|
+
label="State"
|
41
|
+
type="select"
|
42
|
+
options={UsStates}
|
43
|
+
autoComplete="address-level1"
|
44
|
+
validate={validators.required}
|
45
|
+
/>
|
46
|
+
</Col>
|
47
|
+
<Col xs={4}>
|
48
|
+
<FormInput
|
49
|
+
name="zipCode"
|
50
|
+
placeholder="Zip"
|
51
|
+
label="Zip"
|
52
|
+
autoComplete="postal-code"
|
53
|
+
normalize={normalizers.zipCode}
|
54
|
+
validate={[validators.required, validators.zipCode]}
|
55
|
+
/>
|
56
|
+
</Col>
|
57
|
+
</Row>
|
58
|
+
</FormSection>
|
59
|
+
);
|
60
|
+
}
|
61
|
+
}
|
62
|
+
AddressInput.propTypes = {
|
63
|
+
/**
|
64
|
+
* The key that the resulting values should be nested under within the form values.
|
65
|
+
* If name prop were chicken the submitted form values would look like: {chicken: {address1:...}}
|
66
|
+
* this allows us to have two address inputs inside the same form (shipping and billing address)
|
67
|
+
*/
|
68
|
+
name: PropTypes.string,
|
69
|
+
};
|
70
|
+
|
71
|
+
AddressInput.defaultProps = {
|
72
|
+
name: 'address',
|
73
|
+
};
|
@@ -1,53 +1,53 @@
|
|
1
|
-
const states = [
|
2
|
-
{ label: 'Alabama', value: 'AL' },
|
3
|
-
{ label: 'Alaska', value: 'AK' },
|
4
|
-
{ label: 'Arizona', value: 'AZ' },
|
5
|
-
{ label: 'Arkansas', value: 'AR' },
|
6
|
-
{ label: 'California', value: 'CA' },
|
7
|
-
{ label: 'Colorado', value: 'CO' },
|
8
|
-
{ label: 'Connecticut', value: 'CT' },
|
9
|
-
{ label: 'Delaware', value: 'DE' },
|
10
|
-
{ label: 'Florida', value: 'FL' },
|
11
|
-
{ label: 'Georgia', value: 'GA' },
|
12
|
-
{ label: 'Hawaii', value: 'HI' },
|
13
|
-
{ label: 'Idaho', value: 'ID' },
|
14
|
-
{ label: 'Illinois', value: 'IL' },
|
15
|
-
{ label: 'Indiana', value: 'IN' },
|
16
|
-
{ label: 'Iowa', value: 'IA' },
|
17
|
-
{ label: 'Kansas', value: 'KS' },
|
18
|
-
{ label: 'Kentucky', value: 'KY' },
|
19
|
-
{ label: 'Louisiana', value: 'LA' },
|
20
|
-
{ label: 'Maine', value: 'ME' },
|
21
|
-
{ label: 'Maryland', value: 'MD' },
|
22
|
-
{ label: 'Massachusetts', value: 'MA' },
|
23
|
-
{ label: 'Michigan', value: 'MI' },
|
24
|
-
{ label: 'Minnesota', value: 'MN' },
|
25
|
-
{ label: 'Mississippi', value: 'MS' },
|
26
|
-
{ label: 'Missouri', value: 'MO' },
|
27
|
-
{ label: 'Montana', value: 'MT' },
|
28
|
-
{ label: 'Nebraska', value: 'NE' },
|
29
|
-
{ label: 'Nevada', value: 'NV' },
|
30
|
-
{ label: 'New Hampshire', value: 'NH' },
|
31
|
-
{ label: 'New Jersey', value: 'NJ' },
|
32
|
-
{ label: 'New Mexico', value: 'NM' },
|
33
|
-
{ label: 'New York', value: 'NY' },
|
34
|
-
{ label: 'North Carolina', value: 'NC' },
|
35
|
-
{ label: 'North Dakota', value: 'ND' },
|
36
|
-
{ label: 'Ohio', value: 'OH' },
|
37
|
-
{ label: 'Oklahoma', value: 'OK' },
|
38
|
-
{ label: 'Oregon', value: 'OR' },
|
39
|
-
{ label: 'Pennsylvania', value: 'PA' },
|
40
|
-
{ label: 'Rhode Island', value: 'RI' },
|
41
|
-
{ label: 'South Carolina', value: 'SC' },
|
42
|
-
{ label: 'South Dakota', value: 'SD' },
|
43
|
-
{ label: 'Tennessee', value: 'TN' },
|
44
|
-
{ label: 'Texas', value: 'TX' },
|
45
|
-
{ label: 'Utah', value: 'UT' },
|
46
|
-
{ label: 'Vermont', value: 'VT' },
|
47
|
-
{ label: 'Virginia', value: 'VA' },
|
48
|
-
{ label: 'Washington', value: 'WA' },
|
49
|
-
{ label: 'West Virginia', value: 'WV' },
|
50
|
-
{ label: 'Wisconsin', value: 'WI' },
|
51
|
-
{ label: 'Wyoming', value: 'WY' },
|
52
|
-
];
|
53
|
-
export default states;
|
1
|
+
const states = [
|
2
|
+
{ label: 'Alabama', value: 'AL' },
|
3
|
+
{ label: 'Alaska', value: 'AK' },
|
4
|
+
{ label: 'Arizona', value: 'AZ' },
|
5
|
+
{ label: 'Arkansas', value: 'AR' },
|
6
|
+
{ label: 'California', value: 'CA' },
|
7
|
+
{ label: 'Colorado', value: 'CO' },
|
8
|
+
{ label: 'Connecticut', value: 'CT' },
|
9
|
+
{ label: 'Delaware', value: 'DE' },
|
10
|
+
{ label: 'Florida', value: 'FL' },
|
11
|
+
{ label: 'Georgia', value: 'GA' },
|
12
|
+
{ label: 'Hawaii', value: 'HI' },
|
13
|
+
{ label: 'Idaho', value: 'ID' },
|
14
|
+
{ label: 'Illinois', value: 'IL' },
|
15
|
+
{ label: 'Indiana', value: 'IN' },
|
16
|
+
{ label: 'Iowa', value: 'IA' },
|
17
|
+
{ label: 'Kansas', value: 'KS' },
|
18
|
+
{ label: 'Kentucky', value: 'KY' },
|
19
|
+
{ label: 'Louisiana', value: 'LA' },
|
20
|
+
{ label: 'Maine', value: 'ME' },
|
21
|
+
{ label: 'Maryland', value: 'MD' },
|
22
|
+
{ label: 'Massachusetts', value: 'MA' },
|
23
|
+
{ label: 'Michigan', value: 'MI' },
|
24
|
+
{ label: 'Minnesota', value: 'MN' },
|
25
|
+
{ label: 'Mississippi', value: 'MS' },
|
26
|
+
{ label: 'Missouri', value: 'MO' },
|
27
|
+
{ label: 'Montana', value: 'MT' },
|
28
|
+
{ label: 'Nebraska', value: 'NE' },
|
29
|
+
{ label: 'Nevada', value: 'NV' },
|
30
|
+
{ label: 'New Hampshire', value: 'NH' },
|
31
|
+
{ label: 'New Jersey', value: 'NJ' },
|
32
|
+
{ label: 'New Mexico', value: 'NM' },
|
33
|
+
{ label: 'New York', value: 'NY' },
|
34
|
+
{ label: 'North Carolina', value: 'NC' },
|
35
|
+
{ label: 'North Dakota', value: 'ND' },
|
36
|
+
{ label: 'Ohio', value: 'OH' },
|
37
|
+
{ label: 'Oklahoma', value: 'OK' },
|
38
|
+
{ label: 'Oregon', value: 'OR' },
|
39
|
+
{ label: 'Pennsylvania', value: 'PA' },
|
40
|
+
{ label: 'Rhode Island', value: 'RI' },
|
41
|
+
{ label: 'South Carolina', value: 'SC' },
|
42
|
+
{ label: 'South Dakota', value: 'SD' },
|
43
|
+
{ label: 'Tennessee', value: 'TN' },
|
44
|
+
{ label: 'Texas', value: 'TX' },
|
45
|
+
{ label: 'Utah', value: 'UT' },
|
46
|
+
{ label: 'Vermont', value: 'VT' },
|
47
|
+
{ label: 'Virginia', value: 'VA' },
|
48
|
+
{ label: 'Washington', value: 'WA' },
|
49
|
+
{ label: 'West Virginia', value: 'WV' },
|
50
|
+
{ label: 'Wisconsin', value: 'WI' },
|
51
|
+
{ label: 'Wyoming', value: 'WY' },
|
52
|
+
];
|
53
|
+
export default states;
|