@thecb/components 11.1.13-beta.0 → 11.1.14-beta.0
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/dist/index.cjs.js +460 -125
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.esm.js +460 -125
- package/dist/index.esm.js.map +1 -1
- package/package.json +2 -2
- package/src/components/atoms/.DS_Store +0 -0
- package/src/components/atoms/form-layouts/FormInput.js +29 -20
- package/src/components/atoms/icons/NotFoundIcon.js +333 -70
- package/src/components/molecules/obligation/Obligation.js +0 -7
- package/src/components/molecules/obligation/modules/InactiveControlsModule.js +2 -37
- package/src/components/molecules/obligation/modules/InactiveTitleModule.js +1 -1
- package/src/components/molecules/partial-amount-form/PartialAmountField.js +33 -4
- package/src/components/molecules/partial-amount-form/PartialAmountField.theme.js +7 -0
- package/src/components/molecules/payment-form-card/PaymentFormCard.state.js +2 -1
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@thecb/components",
|
|
3
|
-
"version": "11.1.
|
|
3
|
+
"version": "11.1.14-beta.0",
|
|
4
4
|
"description": "Common lib for CityBase react components",
|
|
5
5
|
"main": "dist/index.cjs.js",
|
|
6
6
|
"typings": "dist/index.d.ts",
|
|
@@ -102,6 +102,6 @@
|
|
|
102
102
|
"ramda": "^0.27.0",
|
|
103
103
|
"react-aria-modal": "^4.0.0",
|
|
104
104
|
"react-pose": "^4.0.10",
|
|
105
|
-
"redux-freeform": "^
|
|
105
|
+
"redux-freeform": "^6.2.0"
|
|
106
106
|
}
|
|
107
107
|
}
|
|
Binary file
|
|
@@ -99,6 +99,7 @@ const FormattedInputField = styled(({ showErrors, themeValues, ...props }) => (
|
|
|
99
99
|
|
|
100
100
|
const FormInput = ({
|
|
101
101
|
type = "text",
|
|
102
|
+
labelDisplayOverride = null,
|
|
102
103
|
labelTextWhenNoError = "",
|
|
103
104
|
errorMessages,
|
|
104
105
|
isNum = false,
|
|
@@ -147,39 +148,47 @@ const FormInput = ({
|
|
|
147
148
|
<Box padding="0">
|
|
148
149
|
{helperModal ? (
|
|
149
150
|
<Cluster justify="space-between" align="center">
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
151
|
+
{labelDisplayOverride ? (
|
|
152
|
+
labelDisplayOverride
|
|
153
|
+
) : (
|
|
154
|
+
<Text
|
|
155
|
+
as="label"
|
|
156
|
+
color={themeValues.labelColor}
|
|
157
|
+
variant={labelTextVariant}
|
|
158
|
+
weight={themeValues.fontWeight}
|
|
159
|
+
extraStyles={`word-break: break-word;
|
|
156
160
|
font-family: Public Sans;
|
|
157
161
|
&::first-letter {
|
|
158
162
|
text-transform: uppercase;
|
|
159
163
|
}`}
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
+
id={createIdFromString(labelTextWhenNoError)}
|
|
165
|
+
>
|
|
166
|
+
{labelTextWhenNoError}
|
|
167
|
+
</Text>
|
|
168
|
+
)}
|
|
164
169
|
{helperModal()}
|
|
165
170
|
</Cluster>
|
|
166
171
|
) : (
|
|
167
172
|
<Box padding="0" minWidth="100%">
|
|
168
173
|
<Cluster justify="space-between" align="center">
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
174
|
+
{labelDisplayOverride ? (
|
|
175
|
+
labelDisplayOverride
|
|
176
|
+
) : (
|
|
177
|
+
<Text
|
|
178
|
+
as="label"
|
|
179
|
+
color={themeValues.labelColor}
|
|
180
|
+
variant={labelTextVariant}
|
|
181
|
+
fontWeight={themeValues.fontWeight}
|
|
182
|
+
extraStyles={`word-break: break-word;
|
|
175
183
|
font-family: Public Sans;
|
|
176
184
|
&::first-letter {
|
|
177
185
|
text-transform: uppercase;
|
|
178
186
|
}`}
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
187
|
+
id={createIdFromString(labelTextWhenNoError)}
|
|
188
|
+
>
|
|
189
|
+
{labelTextWhenNoError}
|
|
190
|
+
</Text>
|
|
191
|
+
)}
|
|
183
192
|
{type === "password" && (
|
|
184
193
|
<Text
|
|
185
194
|
variant={labelTextVariant}
|
|
@@ -1,79 +1,342 @@
|
|
|
1
1
|
import React from "react";
|
|
2
2
|
|
|
3
|
-
const NotFoundIcon =
|
|
3
|
+
const NotFoundIcon = () => (
|
|
4
4
|
<svg
|
|
5
|
+
width="548px"
|
|
6
|
+
height="308px"
|
|
7
|
+
viewBox="0 0 548 308"
|
|
8
|
+
version="1.1"
|
|
5
9
|
xmlns="http://www.w3.org/2000/svg"
|
|
6
|
-
|
|
7
|
-
height="211"
|
|
8
|
-
viewBox="0 0 400 211"
|
|
9
|
-
fill="none"
|
|
10
|
-
aria-label="Error: Not Found"
|
|
11
|
-
{...props}
|
|
10
|
+
xmlnsXlink="http://www.w3.org/1999/xlink"
|
|
12
11
|
>
|
|
13
|
-
<g
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
<path
|
|
19
|
-
d="M161.882 35.8821C161.675 33.247 159.477 31.214 156.834 31.214H128.841C128.709 31.214 128.577 31.2191 128.446 31.2294C125.658 31.4477 123.575 33.8846 123.793 36.6724L124.003 39.3645C123.917 39.7848 123.882 40.2256 123.906 40.6798L124.108 44.6075H121.513C117.213 44.6075 113.909 48.1244 114.132 52.4627L119.589 158.508C119.813 162.847 123.479 166.364 127.778 166.364H276.988C281.287 166.364 284.592 162.847 284.369 158.508L278.911 52.4627C278.688 48.1244 275.022 44.6075 270.722 44.6075L162.564 44.6064L161.882 35.8821Z"
|
|
20
|
-
fill="#3B5BDB"
|
|
21
|
-
/>
|
|
22
|
-
<path
|
|
23
|
-
d="M334.997 104.08C334.672 100.54 331.725 97.7696 328.136 97.7696C324.976 97.7696 322.316 99.9169 321.501 102.845C320.689 102.231 319.684 101.862 318.591 101.862C315.904 101.862 313.725 104.063 313.725 106.778C313.725 109.493 315.904 111.694 318.591 111.694H337.414C339.711 111.694 341.573 109.813 341.573 107.494C341.573 105.174 339.711 103.293 337.414 103.293C336.512 103.293 335.679 103.587 334.997 104.08Z"
|
|
24
|
-
fill="#3B5BDB"
|
|
25
|
-
/>
|
|
26
|
-
<path
|
|
27
|
-
d="M94.1431 61.1875C94.1431 60.5649 93.7639 60.0615 93.2973 60.0615H59.5459C59.0785 60.0615 58.7001 60.5649 58.7001 61.1875V110.694H94.1431V61.1875Z"
|
|
28
|
-
fill="#3B5BDB"
|
|
29
|
-
/>
|
|
30
|
-
<path
|
|
31
|
-
d="M48.6024 31.2272C47.2344 27.6658 43.7924 25.134 39.7509 25.134C35.3463 25.134 31.6527 28.1402 30.5826 32.2112C30.199 32.1339 29.802 32.0924 29.3952 32.0924C26.0746 32.0924 23.3829 34.7851 23.3829 38.1069C23.3829 41.4287 26.0746 44.1214 29.3952 44.1214H55.3454C58.6659 44.1214 61.3576 41.4287 61.3576 38.1069C61.3576 34.7851 58.6659 32.0924 55.3454 32.0924C54.4671 32.0924 53.6345 32.2857 52.8827 32.6245C52.1401 31.6813 50.9906 31.0733 49.6978 31.0733C49.3177 31.0733 48.9516 31.1288 48.6024 31.2272Z"
|
|
32
|
-
fill="#3B5BDB"
|
|
33
|
-
/>
|
|
34
|
-
<path
|
|
35
|
-
d="M309.54 17.8918C308.081 14.0929 304.41 11.3924 300.099 11.3924C295.4 11.3924 291.461 14.599 290.32 18.9414C289.91 18.8589 289.487 18.8147 289.052 18.8147C285.511 18.8147 282.64 21.6869 282.64 25.2301C282.64 28.7733 285.511 31.6456 289.052 31.6456H316.733C320.275 31.6456 323.146 28.7733 323.146 25.2301C323.146 21.6869 320.275 18.8147 316.733 18.8147C315.795 18.8147 314.908 19.0209 314.105 19.3823C313.314 18.3761 312.089 17.7276 310.709 17.7276C310.303 17.7276 309.912 17.7868 309.54 17.8918Z"
|
|
36
|
-
fill="#3B5BDB"
|
|
37
|
-
/>
|
|
38
|
-
</g>
|
|
39
|
-
<path
|
|
40
|
-
fillRule="evenodd"
|
|
41
|
-
clipRule="evenodd"
|
|
42
|
-
d="M181.134 41.3406C183.931 41.3406 186.198 43.6075 186.198 46.4039C186.198 46.5503 186.191 46.6966 186.179 46.8425L186.059 48.233C186.132 48.5976 186.164 48.9772 186.15 49.3671L186.018 53.1646H286.146C290.445 53.1646 293.812 56.5649 293.666 60.7595L290.1 163.291C289.954 167.486 286.351 170.886 282.051 170.886H132.842C128.542 170.886 125.175 167.486 125.321 163.291L128.887 60.7595C129.033 56.5649 132.636 53.1646 136.936 53.1646L142.591 53.1634L143.217 45.9652C143.444 43.3487 145.635 41.3406 148.261 41.3406H181.134Z"
|
|
43
|
-
fill="white"
|
|
44
|
-
/>
|
|
45
|
-
<path
|
|
12
|
+
<g
|
|
13
|
+
id="STOR-2683"
|
|
14
|
+
stroke="none"
|
|
15
|
+
strokeWidth="1"
|
|
16
|
+
fill="none"
|
|
46
17
|
fillRule="evenodd"
|
|
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
|
-
|
|
18
|
+
>
|
|
19
|
+
<g id="404-Page" transform="translate(-446.000000, -168.000000)">
|
|
20
|
+
<g
|
|
21
|
+
id="not-found-illustration"
|
|
22
|
+
transform="translate(449.000000, 168.000000)"
|
|
23
|
+
>
|
|
24
|
+
<g
|
|
25
|
+
id="baseline"
|
|
26
|
+
transform="translate(0.483800, 246.050200)"
|
|
27
|
+
stroke="#3B414D"
|
|
28
|
+
strokeLinecap="round"
|
|
29
|
+
strokeWidth="8"
|
|
30
|
+
>
|
|
31
|
+
<line
|
|
32
|
+
x1="463.3123"
|
|
33
|
+
y1="1.326"
|
|
34
|
+
x2="399.5563"
|
|
35
|
+
y2="1.674"
|
|
36
|
+
id="baseline-right---01"
|
|
37
|
+
></line>
|
|
38
|
+
<line
|
|
39
|
+
x1="512.9402"
|
|
40
|
+
y1="1.326"
|
|
41
|
+
x2="483.1052"
|
|
42
|
+
y2="1.674"
|
|
43
|
+
id="baseline-right---02"
|
|
44
|
+
></line>
|
|
45
|
+
<line
|
|
46
|
+
x1="143.1111"
|
|
47
|
+
y1="1.326"
|
|
48
|
+
x2="90.7391"
|
|
49
|
+
y2="1.674"
|
|
50
|
+
id="baseline-left---01"
|
|
51
|
+
></line>
|
|
52
|
+
<line
|
|
53
|
+
x1="71.179"
|
|
54
|
+
y1="1.326"
|
|
55
|
+
x2="0.5162"
|
|
56
|
+
y2="0.9498"
|
|
57
|
+
id="baseline-left---02"
|
|
58
|
+
></line>
|
|
59
|
+
</g>
|
|
60
|
+
<path
|
|
61
|
+
d="M151.968,73 L391.689,73 C395.538,73 398.658,76.12 398.658,79.968 L398.658,258.366 C398.658,262.214 395.538,265.334 391.689,265.334 L151.968,265.334 C148.119,265.334 145,262.214 145,258.366 L145,79.968 C145,76.12 148.119,73 151.968,73"
|
|
62
|
+
id="browser-background"
|
|
63
|
+
fill="#FEFEFE"
|
|
64
|
+
></path>
|
|
65
|
+
<g id="binoculars" transform="translate(209.811300, 116.913100)">
|
|
66
|
+
<path
|
|
67
|
+
d="M97.5616,55.749 C112.9566,55.749 125.4356,43.269 125.4356,27.874 C125.4356,12.479 112.9566,0 97.5616,0 C82.1656,0 69.6866,12.479 69.6866,27.874 C69.6866,43.269 82.1656,55.749 97.5616,55.749 Z"
|
|
68
|
+
id="binocular-right"
|
|
69
|
+
stroke="#3B414D"
|
|
70
|
+
strokeWidth="5.575"
|
|
71
|
+
fill="#E4F4FD"
|
|
72
|
+
></path>
|
|
73
|
+
<g id="binocular-center" transform="translate(49.189100, 8.087300)">
|
|
74
|
+
<path
|
|
75
|
+
d="M2.22044605e-13,3.484 C4.718,1.161 9.085,-2.84217094e-14 13.102,-2.84217094e-14 C17.117,-2.84217094e-14 21.112,1.161 25.087,3.484 L21.2,11.743 L21.603,19.512 L3.484,19.512 L3.854,11.601 L2.22044605e-13,3.484 Z"
|
|
76
|
+
id="Fill-1"
|
|
77
|
+
fill="#3B414D"
|
|
78
|
+
></path>
|
|
79
|
+
<path
|
|
80
|
+
d="M15.1055,8.7316 C15.1055,10.1936 13.9205,11.3786 12.4595,11.3786 C10.9975,11.3786 9.8115,10.1936 9.8115,8.7316 C9.8115,7.2696 10.9975,6.0846 12.4595,6.0846 C13.9205,6.0846 15.1055,7.2696 15.1055,8.7316"
|
|
81
|
+
id="Fill-4"
|
|
82
|
+
fill="#FEFEFE"
|
|
83
|
+
></path>
|
|
84
|
+
</g>
|
|
85
|
+
<path
|
|
86
|
+
d="M27.875,55.749 C43.27,55.749 55.749,43.269 55.749,27.874 C55.749,12.479 43.27,0 27.875,0 C12.48,0 -1.13686838e-13,12.479 -1.13686838e-13,27.874 C-1.13686838e-13,43.269 12.48,55.749 27.875,55.749 Z"
|
|
87
|
+
id="binocular-left"
|
|
88
|
+
stroke="#3B414D"
|
|
89
|
+
strokeWidth="5.575"
|
|
90
|
+
fill="#E4F4FD"
|
|
91
|
+
></path>
|
|
92
|
+
<path
|
|
93
|
+
d="M20.1887,30.6619 C21.3567,27.4039 24.3487,25.0869 27.8547,25.0869 C31.3597,25.0869 34.3517,27.4039 35.5197,30.6619"
|
|
94
|
+
id="eye-left"
|
|
95
|
+
stroke="#3B414D"
|
|
96
|
+
strokeWidth="5.575"
|
|
97
|
+
strokeLinecap="round"
|
|
98
|
+
strokeLinejoin="round"
|
|
99
|
+
></path>
|
|
100
|
+
<path
|
|
101
|
+
d="M90.1887,30.6619 C91.3567,27.4039 94.3487,25.0869 97.8547,25.0869 C101.3597,25.0869 104.3517,27.4039 105.5197,30.6619"
|
|
102
|
+
id="eye-right"
|
|
103
|
+
stroke="#3B414D"
|
|
104
|
+
strokeWidth="5.575"
|
|
105
|
+
strokeLinecap="round"
|
|
106
|
+
strokeLinejoin="round"
|
|
107
|
+
></path>
|
|
108
|
+
</g>
|
|
109
|
+
<path
|
|
110
|
+
d="M292.191,186 L292.191,186 C292.191,189.803 289.108,192.886 285.305,192.886 L258.885,192.886 C255.083,192.886 252,189.803 252,186"
|
|
111
|
+
id="mouth"
|
|
112
|
+
stroke="#3B414D"
|
|
113
|
+
strokeWidth="5.575"
|
|
114
|
+
strokeLinecap="round"
|
|
115
|
+
></path>
|
|
116
|
+
<g id="browser-top" transform="translate(145.000000, 73.000000)">
|
|
117
|
+
<polygon
|
|
118
|
+
id="background"
|
|
119
|
+
fill="#E4E6EB"
|
|
120
|
+
points="0 26 254 26 254 0 0 0"
|
|
121
|
+
></polygon>
|
|
122
|
+
<circle id="dot" fill="#3B414D" cx="13" cy="13" r="3"></circle>
|
|
123
|
+
<circle id="dot" fill="#3B414D" cx="23" cy="13" r="3"></circle>
|
|
124
|
+
<circle id="dot" fill="#3B414D" cx="33" cy="13" r="3"></circle>
|
|
125
|
+
<line
|
|
126
|
+
x1="3"
|
|
127
|
+
y1="26"
|
|
128
|
+
x2="251"
|
|
129
|
+
y2="26"
|
|
130
|
+
id="line"
|
|
131
|
+
stroke="#3B414D"
|
|
132
|
+
strokeWidth="6"
|
|
133
|
+
></line>
|
|
134
|
+
</g>
|
|
135
|
+
<g
|
|
136
|
+
id="sign-post"
|
|
137
|
+
transform="translate(427.000000, 88.999700)"
|
|
138
|
+
strokeWidth="6"
|
|
139
|
+
>
|
|
140
|
+
<polyline
|
|
141
|
+
id="sign-post---left"
|
|
142
|
+
stroke="#3B414D"
|
|
143
|
+
strokeLinecap="round"
|
|
144
|
+
strokeLinejoin="round"
|
|
145
|
+
points="39.196 47.0005 7.06 50.5815 5.68434189e-14 64.7845 7.06 77.6745 54.679 72.3625 54.679 175.7975 40.451 175.7975"
|
|
146
|
+
></polyline>
|
|
147
|
+
<polyline
|
|
148
|
+
id="sign-post---right"
|
|
149
|
+
stroke="#3B414D"
|
|
150
|
+
strokeLinecap="round"
|
|
151
|
+
strokeLinejoin="round"
|
|
152
|
+
points="54.6794 54.6792 107.8214 60.9392 114.3504 49.0202 107.8214 35.8872 54.6794 29.6262 54.6794 13.4842"
|
|
153
|
+
></polyline>
|
|
154
|
+
<path
|
|
155
|
+
d="M62.9412,7.971 C62.9412,12.373 59.3732,15.941 54.9702,15.941 C50.5682,15.941 47.0002,12.373 47.0002,7.971 C47.0002,3.569 50.5682,1.59872116e-14 54.9702,1.59872116e-14 C59.3732,1.59872116e-14 62.9412,3.569 62.9412,7.971"
|
|
156
|
+
id="sign-post---top"
|
|
157
|
+
stroke="#27A9E1"
|
|
158
|
+
fill="#E4F4FD"
|
|
159
|
+
></path>
|
|
160
|
+
</g>
|
|
161
|
+
<path
|
|
162
|
+
d="M330.327,294.916 C330.327,302.049 304.286,307.832 272.163,307.832 C240.04,307.832 214,302.049 214,294.916 C214,287.783 240.04,282 272.163,282 C304.286,282 330.327,287.783 330.327,294.916"
|
|
163
|
+
id="shadow"
|
|
164
|
+
fill="#EAF4EB"
|
|
165
|
+
></path>
|
|
166
|
+
<g
|
|
167
|
+
id="legs"
|
|
168
|
+
transform="translate(248.000000, 268.000000)"
|
|
169
|
+
stroke="#45B770"
|
|
170
|
+
strokeLinecap="round"
|
|
171
|
+
strokeLinejoin="round"
|
|
172
|
+
strokeWidth="8.362"
|
|
173
|
+
>
|
|
174
|
+
<polyline
|
|
175
|
+
id="Stroke-1"
|
|
176
|
+
points="15.817 -2.13162821e-14 15.817 24.795 3.55271368e-15 24.795"
|
|
177
|
+
></polyline>
|
|
178
|
+
<polyline
|
|
179
|
+
id="Stroke-3"
|
|
180
|
+
points="31.3102 -2.30926389e-14 31.3102 25.574 47.1272 25.574"
|
|
181
|
+
></polyline>
|
|
182
|
+
</g>
|
|
183
|
+
<line
|
|
184
|
+
x1="143.441"
|
|
185
|
+
y1="205.181"
|
|
186
|
+
x2="121.181"
|
|
187
|
+
y2="224.512"
|
|
188
|
+
id="arm-left---top"
|
|
189
|
+
stroke="#45B770"
|
|
190
|
+
strokeWidth="8"
|
|
191
|
+
strokeLinecap="round"
|
|
192
|
+
strokeLinejoin="round"
|
|
193
|
+
></line>
|
|
194
|
+
<line
|
|
195
|
+
x1="399.988281"
|
|
196
|
+
y1="213.830078"
|
|
197
|
+
x2="416.9162"
|
|
198
|
+
y2="196.8489"
|
|
199
|
+
id="right-right---bottom"
|
|
200
|
+
stroke="#45B770"
|
|
201
|
+
strokeWidth="8"
|
|
202
|
+
strokeLinecap="round"
|
|
203
|
+
strokeLinejoin="round"
|
|
204
|
+
></line>
|
|
205
|
+
<path
|
|
206
|
+
d="M151.969,73 L391.69,73 C395.538,73 398.658,76.12 398.658,79.969 L398.658,258.366 C398.658,262.214 395.538,265.334 391.69,265.334 L151.969,265.334 C148.12,265.334 145,262.214 145,258.366 L145,79.969 C145,76.12 148.12,73 151.969,73 Z"
|
|
207
|
+
id="browser-border"
|
|
208
|
+
stroke="#3B414D"
|
|
209
|
+
strokeWidth="6"
|
|
210
|
+
></path>
|
|
211
|
+
<line
|
|
212
|
+
x1="121.1812"
|
|
213
|
+
y1="224.512"
|
|
214
|
+
x2="171.9052"
|
|
215
|
+
y2="236.375"
|
|
216
|
+
id="arm-left---bottom"
|
|
217
|
+
stroke="#45B770"
|
|
218
|
+
strokeWidth="8"
|
|
219
|
+
strokeLinecap="round"
|
|
220
|
+
strokeLinejoin="round"
|
|
221
|
+
></line>
|
|
222
|
+
<line
|
|
223
|
+
x1="416.916"
|
|
224
|
+
y1="196.8493"
|
|
225
|
+
x2="348.522"
|
|
226
|
+
y2="153.6733"
|
|
227
|
+
id="arm-right---top"
|
|
228
|
+
stroke="#45B770"
|
|
229
|
+
strokeWidth="8"
|
|
230
|
+
strokeLinecap="round"
|
|
231
|
+
strokeLinejoin="round"
|
|
232
|
+
></line>
|
|
233
|
+
<path
|
|
234
|
+
d="M344.1914,160.9806 C346.1454,156.3596 347.2264,151.2786 347.2264,145.9456 C347.2264,143.5286 347.0044,141.1636 346.5794,138.8686"
|
|
235
|
+
id="hand-left"
|
|
236
|
+
stroke="#45B770"
|
|
237
|
+
strokeWidth="8"
|
|
238
|
+
strokeLinecap="round"
|
|
239
|
+
strokeLinejoin="round"
|
|
240
|
+
></path>
|
|
241
|
+
<g
|
|
242
|
+
id="map"
|
|
243
|
+
transform="translate(183.000000, 203.000000)"
|
|
244
|
+
strokeLinejoin="round"
|
|
245
|
+
>
|
|
246
|
+
<polygon
|
|
247
|
+
stroke="#3B414D"
|
|
248
|
+
strokeWidth="6"
|
|
249
|
+
fill="#E4F4FD"
|
|
250
|
+
points="69.3333333 0 34.6666667 8.12833265 0 0 0 69.8706676 34.6666667 78 69.3333333 69.8706676 104 78 104 8.12833265"
|
|
251
|
+
></polygon>
|
|
252
|
+
<line
|
|
253
|
+
x1="34.5"
|
|
254
|
+
y1="62.8644"
|
|
255
|
+
x2="34.5"
|
|
256
|
+
y2="55.5804"
|
|
257
|
+
id="map-line---left---02"
|
|
258
|
+
stroke="#28A7DF"
|
|
259
|
+
strokeWidth="4.878"
|
|
260
|
+
strokeLinecap="round"
|
|
261
|
+
></line>
|
|
262
|
+
<line
|
|
263
|
+
x1="34.5"
|
|
264
|
+
y1="45.03"
|
|
265
|
+
x2="34.5"
|
|
266
|
+
y2="22"
|
|
267
|
+
id="map-line---left---01"
|
|
268
|
+
stroke="#28A7DF"
|
|
269
|
+
strokeWidth="4.878"
|
|
270
|
+
strokeLinecap="round"
|
|
271
|
+
></line>
|
|
272
|
+
<line
|
|
273
|
+
x1="69.4391"
|
|
274
|
+
y1="54.9698"
|
|
275
|
+
x2="69.4391"
|
|
276
|
+
y2="37.1358"
|
|
277
|
+
id="map-line---right---02"
|
|
278
|
+
stroke="#28A7DF"
|
|
279
|
+
strokeWidth="4.878"
|
|
280
|
+
strokeLinecap="round"
|
|
281
|
+
></line>
|
|
282
|
+
<line
|
|
283
|
+
x1="69.4391"
|
|
284
|
+
y1="27.5738"
|
|
285
|
+
x2="69.4391"
|
|
286
|
+
y2="17.4388"
|
|
287
|
+
id="map-line---right---01"
|
|
288
|
+
stroke="#28A7DF"
|
|
289
|
+
strokeWidth="4.878"
|
|
290
|
+
strokeLinecap="round"
|
|
291
|
+
></line>
|
|
292
|
+
</g>
|
|
293
|
+
<g id="left-hand" transform="translate(173.473700, 226.000000)">
|
|
294
|
+
<path
|
|
295
|
+
d="M7.605,5.1029 C3.405,5.1029 -1.0658141e-13,8.5079 -1.0658141e-13,12.7079 C-1.0658141e-13,16.9089 3.405,20.3139 7.605,20.3139 L14.249,20.3139"
|
|
296
|
+
id="hand"
|
|
297
|
+
stroke="#45B770"
|
|
298
|
+
strokeWidth="8"
|
|
299
|
+
strokeLinecap="round"
|
|
300
|
+
strokeLinejoin="round"
|
|
301
|
+
></path>
|
|
302
|
+
<rect
|
|
303
|
+
id="cover"
|
|
304
|
+
fill="#3B414D"
|
|
305
|
+
x="6.5263"
|
|
306
|
+
y="0"
|
|
307
|
+
width="6"
|
|
308
|
+
height="9"
|
|
309
|
+
></rect>
|
|
310
|
+
</g>
|
|
311
|
+
<g
|
|
312
|
+
id="clouds"
|
|
313
|
+
transform="translate(44.000000, 0.000000)"
|
|
314
|
+
fill="#B8E4F4"
|
|
315
|
+
>
|
|
316
|
+
<path
|
|
317
|
+
d="M396.6868,87.0406 C394.3808,87.0406 392.2528,87.7836 390.5118,89.0306 C389.6798,80.0776 382.1498,73.0676 372.9798,73.0676 C364.9078,73.0676 358.1098,78.4996 356.0278,85.9056 C353.9528,84.3526 351.3838,83.4216 348.5928,83.4216 C341.7248,83.4216 336.1578,88.9886 336.1578,95.8566 C336.1578,102.7246 341.7248,108.2906 348.5928,108.2906 L396.6868,108.2906 C402.5548,108.2906 407.3118,103.5346 407.3118,97.6656 C407.3118,91.7976 402.5548,87.0406 396.6868,87.0406"
|
|
318
|
+
id="cloud---05"
|
|
319
|
+
></path>
|
|
320
|
+
<path
|
|
321
|
+
d="M320.0872,9.9 C318.8362,9.9 317.6522,10.175 316.5812,10.657 C315.5252,9.315 313.8902,8.45 312.0492,8.45 C311.5082,8.45 310.9862,8.529 310.4902,8.669 C308.5432,3.602 303.6442,5.68434189e-14 297.8922,5.68434189e-14 C291.6222,5.68434189e-14 286.3662,4.277 284.8442,10.069 C284.2972,9.959 283.7322,9.9 283.1522,9.9 C278.4272,9.9 274.5962,13.731 274.5962,18.457 C274.5962,23.183 278.4272,27.014 283.1522,27.014 L320.0872,27.014 C324.8132,27.014 328.6442,23.183 328.6442,18.457 C328.6442,13.731 324.8132,9.9 320.0872,9.9"
|
|
322
|
+
id="cloud---04"
|
|
323
|
+
></path>
|
|
324
|
+
<path
|
|
325
|
+
d="M198.5179,25.524 C195.7659,25.524 193.2259,26.41 191.1459,27.899 C190.1539,17.212 181.1649,8.845 170.2189,8.845 C160.5829,8.845 152.4689,15.329 149.9839,24.17 C147.5059,22.316 144.4409,21.204 141.1079,21.204 C132.9109,21.204 126.2649,27.85 126.2649,36.047 C126.2649,44.245 132.9109,50.891 141.1079,50.891 L198.5179,50.891 C205.5219,50.891 211.2009,45.212 211.2009,38.208 C211.2009,31.203 205.5219,25.524 198.5179,25.524"
|
|
326
|
+
id="cloud---03"
|
|
327
|
+
></path>
|
|
328
|
+
<path
|
|
329
|
+
d="M117.9359,151.1183 C116.6859,151.1183 115.5009,151.3933 114.4309,151.8753 C113.3739,150.5333 111.7379,149.6683 109.8979,149.6683 C109.3569,149.6683 108.8359,149.7473 108.3389,149.8873 C106.3919,144.8203 101.4929,141.2183 95.7409,141.2183 C89.4719,141.2183 84.2149,145.4953 82.6919,151.2873 C82.1459,151.1773 81.5809,151.1183 81.0019,151.1183 C76.2759,151.1183 72.4449,154.9493 72.4449,159.6753 C72.4449,164.4013 76.2759,168.2323 81.0019,168.2323 L117.9359,168.2323 C122.6619,168.2323 126.4929,164.4013 126.4929,159.6753 C126.4929,154.9493 122.6619,151.1183 117.9359,151.1183"
|
|
330
|
+
id="cloud---02"
|
|
331
|
+
></path>
|
|
332
|
+
<path
|
|
333
|
+
d="M45.491,85.3556 C44.241,85.3556 43.056,85.6306 41.985,86.1126 C40.929,84.7706 39.293,83.9056 37.453,83.9056 C36.912,83.9056 36.391,83.9846 35.894,84.1246 C33.947,79.0576 29.048,75.4556 23.296,75.4556 C17.027,75.4556 11.77,79.7326 10.247,85.5246 C9.701,85.4146 9.136,85.3556 8.557,85.3556 C3.831,85.3556 -1.13686838e-13,89.1866 -1.13686838e-13,93.9126 C-1.13686838e-13,98.6386 3.831,102.4696 8.557,102.4696 L45.491,102.4696 C50.217,102.4696 54.048,98.6386 54.048,93.9126 C54.048,89.1866 50.217,85.3556 45.491,85.3556"
|
|
334
|
+
id="cloud---01"
|
|
335
|
+
></path>
|
|
336
|
+
</g>
|
|
337
|
+
</g>
|
|
338
|
+
</g>
|
|
339
|
+
</g>
|
|
77
340
|
</svg>
|
|
78
341
|
);
|
|
79
342
|
|
|
@@ -39,7 +39,6 @@ const Obligation = ({
|
|
|
39
39
|
inactiveLookupTitle = "",
|
|
40
40
|
inactiveLookupInput = "Account",
|
|
41
41
|
inactiveLookupValue = "",
|
|
42
|
-
inactiveCanNavigateToAccountDetails = false,
|
|
43
42
|
isInCustomerManagement = false,
|
|
44
43
|
themeValues,
|
|
45
44
|
cartEnabled = false,
|
|
@@ -350,9 +349,6 @@ const Obligation = ({
|
|
|
350
349
|
allowedPaymentInstruments={allowedPaymentInstruments}
|
|
351
350
|
disableActions={isInCustomerManagement}
|
|
352
351
|
showRemoveButton={showRemoveButton}
|
|
353
|
-
inactiveCanNavigateToAccountDetails={
|
|
354
|
-
inactiveCanNavigateToAccountDetails
|
|
355
|
-
}
|
|
356
352
|
/>
|
|
357
353
|
)}
|
|
358
354
|
</Cluster>
|
|
@@ -377,9 +373,6 @@ const Obligation = ({
|
|
|
377
373
|
allowedPaymentInstruments={allowedPaymentInstruments}
|
|
378
374
|
disableActions={isInCustomerManagement}
|
|
379
375
|
showRemoveButton={showRemoveButton}
|
|
380
|
-
inactiveCanNavigateToAccountDetails={
|
|
381
|
-
inactiveCanNavigateToAccountDetails
|
|
382
|
-
}
|
|
383
376
|
/>
|
|
384
377
|
)}
|
|
385
378
|
</Stack>
|
|
@@ -1,13 +1,11 @@
|
|
|
1
1
|
import React, { useState } from "react";
|
|
2
2
|
import { GHOST_GREY } from "../../../../constants/colors";
|
|
3
3
|
import { Box, Cluster } from "../../../atoms/layouts";
|
|
4
|
-
import ButtonWithAction from "../../../atoms/button-with-action";
|
|
5
4
|
import AutopayModalModule from "./AutopayModalModule";
|
|
6
5
|
import RemoveAccountModalModule from "./RemoveAccountModalModule";
|
|
7
6
|
import { noop } from "../../../../util/general";
|
|
8
7
|
|
|
9
8
|
const InactiveControlsModule = ({
|
|
10
|
-
obligations,
|
|
11
9
|
autoPayEnabled,
|
|
12
10
|
autoPaySchedule,
|
|
13
11
|
navigateToSettings,
|
|
@@ -19,31 +17,16 @@ const InactiveControlsModule = ({
|
|
|
19
17
|
obligationAssocID,
|
|
20
18
|
dueDate,
|
|
21
19
|
agencyName,
|
|
22
|
-
config,
|
|
23
20
|
configType,
|
|
24
21
|
actions,
|
|
25
22
|
description,
|
|
26
23
|
subDescription,
|
|
27
24
|
allowedPaymentInstruments,
|
|
28
25
|
disableActions = false,
|
|
29
|
-
showRemoveButton = true
|
|
30
|
-
inactiveCanNavigateToAccountDetails = false
|
|
26
|
+
showRemoveButton = true
|
|
31
27
|
}) => {
|
|
32
28
|
const [modalOpen, toggleModal] = useState(false);
|
|
33
|
-
const {
|
|
34
|
-
deleteObligationAssoc,
|
|
35
|
-
setDetailedObligation,
|
|
36
|
-
navigateToDetailedObligation
|
|
37
|
-
} = actions;
|
|
38
|
-
const { obligationSlug } = config;
|
|
39
|
-
const detailsSlug =
|
|
40
|
-
config.type === "ACCOUNT"
|
|
41
|
-
? `/profile/accounts/details/${obligationSlug}`
|
|
42
|
-
: `/profile/properties/details/${obligationSlug}`;
|
|
43
|
-
const handleDetailsClick = () => {
|
|
44
|
-
setDetailedObligation(obligations, config, obligationAssocID);
|
|
45
|
-
navigateToDetailedObligation(detailsSlug);
|
|
46
|
-
};
|
|
29
|
+
const { deleteObligationAssoc } = actions;
|
|
47
30
|
const handleRemoveAccount = () => deleteObligationAssoc(obligationAssocID);
|
|
48
31
|
return (
|
|
49
32
|
<Box
|
|
@@ -57,24 +40,6 @@ const InactiveControlsModule = ({
|
|
|
57
40
|
justify={isMobile && autoPayEnabled && "center"}
|
|
58
41
|
align={isMobile && autoPayEnabled && "center"}
|
|
59
42
|
>
|
|
60
|
-
{inactiveCanNavigateToAccountDetails && (
|
|
61
|
-
<Box
|
|
62
|
-
padding={isMobile ? "0 8px 0 0" : "0"}
|
|
63
|
-
extraStyles={isMobile && `flex-grow: 1;`}
|
|
64
|
-
>
|
|
65
|
-
<ButtonWithAction
|
|
66
|
-
variant="tertiary"
|
|
67
|
-
text={
|
|
68
|
-
config.type === "ACCOUNT"
|
|
69
|
-
? "Account Details"
|
|
70
|
-
: "Property Details"
|
|
71
|
-
}
|
|
72
|
-
action={handleDetailsClick}
|
|
73
|
-
dataQa="Account Details"
|
|
74
|
-
extraStyles={isMobile && `flex-grow: 1; width: 100%;`}
|
|
75
|
-
/>
|
|
76
|
-
</Box>
|
|
77
|
-
)}
|
|
78
43
|
{autoPayEnabled && (
|
|
79
44
|
<Box padding="0" extraStyles={`flex-grow: 1;`}>
|
|
80
45
|
<AutopayModalModule
|
|
@@ -28,7 +28,7 @@ const InactiveTitleModule = ({ title, subtitle, autoPayEnabled }) => (
|
|
|
28
28
|
Unable to load account details
|
|
29
29
|
</Detail>
|
|
30
30
|
<Detail variant="extraSmall" as="p" color={BLACK}>
|
|
31
|
-
{`This may mean the balance has been paid
|
|
31
|
+
{`This may mean that the balance has been paid, or there was an error loading it.${
|
|
32
32
|
autoPayEnabled
|
|
33
33
|
? " You may disable autopay for this account by pressing the 'Turn off Autopay' button."
|
|
34
34
|
: ""
|