@comicrelief/component-library 7.0.1 → 7.0.2

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.
Files changed (15) hide show
  1. package/cypress/integration/components/Organisms/Donate.spec.js +15 -15
  2. package/cypress/integration/components/Organisms/Membership.spec.js +118 -120
  3. package/dist/components/Organisms/Donate/Form/Form.js +6 -5
  4. package/dist/components/Organisms/Donate/__snapshots__/Donate.test.js.snap +3 -3
  5. package/dist/components/Organisms/EmailSignUp/EmailSignUpForm.js +1 -0
  6. package/dist/components/Organisms/Membership/Form/Form.js +4 -3
  7. package/dist/components/Organisms/Membership/Membership.test.js +1 -1
  8. package/dist/utils/Membership.js +1 -1
  9. package/package.json +1 -1
  10. package/src/components/Organisms/Donate/Form/Form.js +10 -7
  11. package/src/components/Organisms/Donate/__snapshots__/Donate.test.js.snap +3 -3
  12. package/src/components/Organisms/EmailSignUp/EmailSignUpForm.js +1 -0
  13. package/src/components/Organisms/Membership/Form/Form.js +3 -3
  14. package/src/components/Organisms/Membership/Membership.test.js +1 -1
  15. package/src/utils/Membership.js +1 -1
package/cypress/integration/components/Organisms/Donate.spec.js CHANGED
@@ -67,14 +67,14 @@ describe('Donate component', () => {
67
67
  .clear()
68
68
  .type(' ');
69
69
  cy.get('@container')
70
- .find('p:nth-child(5)')
71
- .contains('Please enter an amount between £1 and £20000 and up to 2 decimal places');
70
+ .find('p.error--amount')
71
+ .contains('Please enter an amount between £1 and £25000 and up to 2 decimal places');
72
72
  cy.get('@container')
73
73
  .find('[id="mship-1--MoneyBuy-userInput"]')
74
74
  .type('15.999');
75
75
  cy.get('@container')
76
- .find('p:nth-child(5)')
77
- .contains('Please enter an amount between £1 and £20000 and up to 2 decimal places');
76
+ .find('p.error--amount')
77
+ .contains('Please enter an amount between £1 and £25000 and up to 2 decimal places');
78
78
  cy.get('@container')
79
79
  .find('form > fieldset > input')
80
80
  .contains('Donate monthly');
@@ -129,14 +129,14 @@ describe('Donate component', () => {
129
129
  .clear()
130
130
  .type(' ');
131
131
  cy.get('@container')
132
- .find('p:nth-child(5)')
133
- .contains('Please enter an amount between £1 and £20000 and up to 2 decimal places');
132
+ .find('p.error--amount')
133
+ .contains('Please enter an amount between £1 and £25000 and up to 2 decimal places');
134
134
  cy.get('@container')
135
135
  .find('[id="mship-2--MoneyBuy-userInput"]')
136
136
  .type('10.999');
137
137
  cy.get('@container')
138
- .find('p:nth-child(5)')
139
- .should('contain', 'Please enter an amount between £1 and £20000 and up to 2 decimal places');
138
+ .find('p.error--amount')
139
+ .should('contain', 'Please enter an amount between £1 and £25000 and up to 2 decimal places');
140
140
  cy.get('@container')
141
141
  .find('form > fieldset > input')
142
142
  .contains('Donate now');
@@ -190,14 +190,14 @@ describe('Donate component', () => {
190
190
  .clear()
191
191
  .type(' ');
192
192
  cy.get('@container')
193
- .find('p:nth-child(5)')
194
- .contains('Please enter an amount between £1 and £20000 and up to 2 decimal places');
193
+ .find('p.error--amount')
194
+ .contains('Please enter an amount between £1 and £25000 and up to 2 decimal places');
195
195
  cy.get('@container')
196
196
  .find('[id="mship-3--MoneyBuy-userInput"]')
197
197
  .type('10.999');
198
198
  cy.get('@container')
199
- .find('p:nth-child(5)')
200
- .contains('Please enter an amount between £1 and £20000 and up to 2 decimal places');
199
+ .find('p.error--amount')
200
+ .contains('Please enter an amount between £1 and £25000 and up to 2 decimal places');
201
201
  cy.get('@container')
202
202
  .find('form > fieldset > input')
203
203
  .contains('Donate now');
@@ -249,14 +249,14 @@ describe('Donate component', () => {
249
249
  .type('5')
250
250
  .clear();
251
251
  cy.get('@container')
252
- .find('p:nth-child(4)')
253
- .contains('Please enter an amount between £1 and £20000 and up to 2 decimal places');
252
+ .find('p.error--amount')
253
+ .contains('Please enter an amount between £1 and £25000 and up to 2 decimal places');
254
254
  cy.get('@container')
255
255
  .find('[id="mship-4--MoneyBuy-userInput"]')
256
256
  .type('10.999')
257
257
  .clear()
258
258
  .type('5')
259
- .should('not.have', 'Please enter an amount between £1 and £20000 and up to 2 decimal places');
259
+ .should('not.have', 'Please enter an amount between £1 and £250000 and up to 2 decimal places');
260
260
  cy.get('@container')
261
261
  .find('form > fieldset > input')
262
262
  .contains('Donate');
package/cypress/integration/components/Organisms/Membership.spec.js CHANGED
@@ -1,129 +1,127 @@
1
1
  describe('Membership component', () => {
2
- before(() => {
3
- // go to membership component
4
- cy.visit('/#membership');
2
+ before(() => {
3
+ // go to membership component
4
+ cy.visit('/#membership');
5
+ });
6
+
7
+ describe('props and methods section', () => {
8
+ beforeEach(() => {
9
+ cy.get('[data-testid="Membership-container"] button[name="rsg-usage"]')
10
+ .contains('Props & methods')
11
+ .as('propsBtn');
12
+
13
+ cy.get('@propsBtn')
14
+ .closest('[class^=rsg--tabs]')
15
+ .as('container');
5
16
  });
6
17
 
7
- describe('props and methods section', () => {
8
- beforeEach(() => {
9
- cy.get('[data-testid="Membership-container"] button[name="rsg-usage"]')
10
- .contains('Props & methods')
11
- .as('propsBtn');
12
-
13
- cy.get('@propsBtn')
14
- .closest('[class^=rsg--tabs]')
15
- .as('container');
16
- });
17
-
18
- it('is present', () => {
19
- cy.get('@propsBtn').should('exist');
20
- });
21
-
22
- it('does not show table initially', () => {
23
- cy.get('@container')
24
- .find('table')
25
- .should('not.exist');
26
- });
27
-
28
- it('shows the table on button click', () => {
29
- cy.get('@propsBtn').click();
30
- cy.get('@container')
31
- .find('table')
32
- .should('contain', 'Prop name');
33
- });
18
+ it('is present', () => {
19
+ cy.get('@propsBtn').should('exist');
34
20
  });
35
21
 
36
- describe('Membership form align right section', () => {
37
- beforeEach(() => {
38
- cy.get('[data-testid="Membership-example-1"]')
39
- .as('container')
40
- .find('[data-preview="Membership"]')
41
- .as('preview');
42
-
43
- cy.get('@container')
44
- .find('button')
45
- .contains('View Code')
46
- .as('viewCodeBtn');
47
- });
48
-
49
- it('renders Membership form align right preview', () => {
50
-
51
- cy.get('@container')
52
- .find('input[id="mship-1--moneyBuy-box1"]')
53
- .should('exist');
54
- cy.get('@container')
55
- .find('input[id="mship-1--MoneyBuy-userInput"]')
56
- .type('20001');
57
- cy.get('@container')
58
- .find('p')
59
- .contains('Please enter a number between 1 and 20000, and up to 2 decimal places')
60
- cy.get('@container')
61
- .find('input[id="mship-1--MoneyBuy-userInput"]')
62
- .type('1')
63
- .get('input[type="submit"]')
64
- .should('exist')
65
- });
66
-
67
- it('has view code button', () => {
68
- cy.get('@viewCodeBtn').should('exist');
69
- });
70
-
71
- it('shows code on click', () => {
72
- cy.get('@viewCodeBtn').click();
73
- cy.get('@container')
74
- .find('textarea')
75
- .should('exist');
76
- });
77
-
78
- it('closes code on click', () => {
79
- cy.get('@viewCodeBtn').click();
80
- });
22
+ it('does not show table initially', () => {
23
+ cy.get('@container')
24
+ .find('table')
25
+ .should('not.exist');
81
26
  });
82
27
 
83
- describe('Membership form align left section', () => {
84
- beforeEach(() => {
85
- cy.get('[data-testid="Membership-example-3"]')
86
- .as('container')
87
- .find('[data-preview="Membership"]')
88
- .as('preview');
89
-
90
- cy.get('@container')
91
- .find('button')
92
- .contains('View Code')
93
- .as('viewCodeBtn');
94
- });
95
-
96
- it('renders Membership form align left preview', () => {
97
-
98
- cy.get('@container')
99
- .find('input[id="mship-1--moneyBuy-box3"]')
100
- .should('exist');
101
- cy.get('@container')
102
- .find('input[id="mship-1--MoneyBuy-userInput"]')
103
- .type('20001');
104
- cy.get('@container')
105
- .find('p')
106
- .contains('Please enter a number between 1 and 20000, and up to 2 decimal places');
107
- cy.get('@container')
108
- .find('input[id="mship-1--MoneyBuy-userInput"]')
109
- .type('1')
110
- .get('input[type="submit"]')
111
- .should('exist')
112
- });
113
-
114
- it('has view code button', () => {
115
- cy.get('@viewCodeBtn').should('exist');
116
- });
117
-
118
- it('shows code on click', () => {
119
- cy.get('@viewCodeBtn').click();
120
- cy.get('@container')
121
- .find('textarea')
122
- .should('exist');
123
- });
124
-
125
- it('closes code on click', () => {
126
- cy.get('@viewCodeBtn').click();
127
- });
28
+ it('shows the table on button click', () => {
29
+ cy.get('@propsBtn').click();
30
+ cy.get('@container')
31
+ .find('table')
32
+ .should('contain', 'Prop name');
128
33
  });
34
+ });
35
+
36
+ describe('Membership form align right section', () => {
37
+ beforeEach(() => {
38
+ cy.get('[data-testid="Membership-example-1"]')
39
+ .as('container')
40
+ .find('[data-preview="Membership"]')
41
+ .as('preview');
42
+
43
+ cy.get('@container')
44
+ .find('button')
45
+ .contains('View Code')
46
+ .as('viewCodeBtn');
47
+ });
48
+
49
+ it('renders Membership form align right preview', () => {
50
+ cy.get('@container')
51
+ .find('input[id="mship-1--moneyBuy-box1"]')
52
+ .should('exist');
53
+ cy.get('@container')
54
+ .find('input[id="mship-1--MoneyBuy-userInput"]')
55
+ .type('25001');
56
+ cy.get('@container')
57
+ .find('p.error--amount')
58
+ .contains('Please enter a number between 1 and 25000, and up to 2 decimal places');
59
+ cy.get('@container')
60
+ .find('input[id="mship-1--MoneyBuy-userInput"]')
61
+ .type('1')
62
+ .get('input[type="submit"]')
63
+ .should('exist');
64
+ });
65
+
66
+ it('has view code button', () => {
67
+ cy.get('@viewCodeBtn').should('exist');
68
+ });
69
+
70
+ it('shows code on click', () => {
71
+ cy.get('@viewCodeBtn').click();
72
+ cy.get('@container')
73
+ .find('textarea')
74
+ .should('exist');
75
+ });
76
+
77
+ it('closes code on click', () => {
78
+ cy.get('@viewCodeBtn').click();
79
+ });
80
+ });
81
+
82
+ describe('Membership form align left section', () => {
83
+ beforeEach(() => {
84
+ cy.get('[data-testid="Membership-example-3"]')
85
+ .as('container')
86
+ .find('[data-preview="Membership"]')
87
+ .as('preview');
88
+
89
+ cy.get('@container')
90
+ .find('button')
91
+ .contains('View Code')
92
+ .as('viewCodeBtn');
93
+ });
94
+
95
+ it('renders Membership form align left preview', () => {
96
+ cy.get('@container')
97
+ .find('input[id="mship-1--moneyBuy-box3"]')
98
+ .should('exist');
99
+ cy.get('@container')
100
+ .find('input[id="mship-1--MoneyBuy-userInput"]')
101
+ .type('25001');
102
+ cy.get('@container')
103
+ .find('p.error--amount')
104
+ .contains('Please enter a number between 1 and 25000, and up to 2 decimal places');
105
+ cy.get('@container')
106
+ .find('input[id="mship-1--MoneyBuy-userInput"]')
107
+ .type('1')
108
+ .get('input[type="submit"]')
109
+ .should('exist');
110
+ });
111
+
112
+ it('has view code button', () => {
113
+ cy.get('@viewCodeBtn').should('exist');
114
+ });
115
+
116
+ it('shows code on click', () => {
117
+ cy.get('@viewCodeBtn').click();
118
+ cy.get('@container')
119
+ .find('textarea')
120
+ .should('exist');
121
+ });
122
+
123
+ it('closes code on click', () => {
124
+ cy.get('@viewCodeBtn').click();
125
+ });
126
+ });
129
127
  });
package/dist/components/Organisms/Donate/Form/Form.js CHANGED
@@ -156,7 +156,7 @@ var Signup = function Signup(_ref) {
156
156
  id: "".concat(mbshipID, "--MoneyBuy-userInput"),
157
157
  showLabel: true
158
158
  }, rest, {
159
- max: "20000",
159
+ max: "25000",
160
160
  min: "1",
161
161
  value: amountDonate,
162
162
  pattern: "[^[0-9]+([,.][0-9]+)?$]",
@@ -167,7 +167,10 @@ var Signup = function Signup(_ref) {
167
167
  "aria-label": "Input a different amount"
168
168
  }))), amountDonate >= 1 && !noMoneyBuys && moneyBuyCopy && /*#__PURE__*/_react.default.createElement(_Donate.Copy, {
169
169
  as: "p"
170
- }, /*#__PURE__*/_react.default.createElement("strong", null, "\xA3".concat(amountDonate.toFixed(2), " ")), moneyBuyCopy), noMoneyBuys ? /*#__PURE__*/_react.default.createElement(_Donate.Button, {
170
+ }, /*#__PURE__*/_react.default.createElement("strong", null, "\xA3".concat(amountDonate.toFixed(2), " ")), moneyBuyCopy), errorMsg && /*#__PURE__*/_react.default.createElement(_Donate.Error, {
171
+ className: "error--amount",
172
+ tag: "p"
173
+ }, "Please enter an amount between \xA31 and \xA325000 and up to 2 decimal places"), noMoneyBuys ? /*#__PURE__*/_react.default.createElement(_Donate.Button, {
171
174
  type: "submit",
172
175
  as: "input",
173
176
  value: "Donate"
@@ -175,9 +178,7 @@ var Signup = function Signup(_ref) {
175
178
  type: "submit",
176
179
  as: "input",
177
180
  value: givingType === 'single' ? 'Donate now' : 'Donate monthly'
178
- }), errorMsg && /*#__PURE__*/_react.default.createElement(_Donate.Error, {
179
- tag: "p"
180
- }, "Please enter an amount between \xA31 and \xA320000 and up to 2 decimal places"))));
181
+ }))));
181
182
  };
182
183
 
183
184
  Signup.defaultProps = {
package/dist/components/Organisms/Donate/__snapshots__/Donate.test.js.snap CHANGED
@@ -818,7 +818,7 @@ exports[`Monthly donation renders correctly 1`] = `
818
818
  aria-label="Input a different amount"
819
819
  className="c23"
820
820
  id="mship-1--MoneyBuy-userInput"
821
- max="20000"
821
+ max="25000"
822
822
  min="1"
823
823
  name="membership_amount"
824
824
  onChange={[Function]}
@@ -1521,7 +1521,7 @@ exports[`Single donation renders correctly 1`] = `
1521
1521
  aria-label="Input a different amount"
1522
1522
  className="c17"
1523
1523
  id="mship-1--MoneyBuy-userInput"
1524
- max="20000"
1524
+ max="25000"
1525
1525
  min="1"
1526
1526
  name="membership_amount"
1527
1527
  onChange={[Function]}
@@ -1987,7 +1987,7 @@ exports[`Single donation with no Money Buys renders correctly 1`] = `
1987
1987
  aria-label="Input a different amount"
1988
1988
  className="c17"
1989
1989
  id="mship-1--MoneyBuy-userInput"
1990
- max="20000"
1990
+ max="25000"
1991
1991
  min="1"
1992
1992
  name="membership_amount"
1993
1993
  onChange={[Function]}
package/dist/components/Organisms/EmailSignUp/EmailSignUpForm.js CHANGED
@@ -48,6 +48,7 @@ var EmailSignUpForm = function EmailSignUpForm() {
48
48
  valid = _context.sent;
49
49
 
50
50
  if (valid) {
51
+ // eslint-disable-next-line no-console
51
52
  console.log(data);
52
53
  }
53
54
 
package/dist/components/Organisms/Membership/Form/Form.js CHANGED
@@ -194,7 +194,7 @@ var Signup = function Signup(_ref) {
194
194
  id: "".concat(mbshipID, "--MoneyBuy-userInput"),
195
195
  showLabel: true
196
196
  }, rest, {
197
- max: "20000",
197
+ max: "25000",
198
198
  min: "1",
199
199
  value: userInput,
200
200
  pattern: "[^[0-9]+([,.][0-9]+)?$]",
@@ -214,8 +214,9 @@ var Signup = function Signup(_ref) {
214
214
  type: "submit",
215
215
  value: "Donate"
216
216
  }), errorMsg && /*#__PURE__*/_react.default.createElement(_Membership2.Error, {
217
- tag: "p"
218
- }, "Please enter a number between 1 and 20000, and up to 2 decimal places"), moneyBuyCopy && /*#__PURE__*/_react.default.createElement(_Membership2.Copy, {
217
+ tag: "p",
218
+ className: "error--amount"
219
+ }, "Please enter a number between 1 and 25000, and up to 2 decimal places"), moneyBuyCopy && /*#__PURE__*/_react.default.createElement(_Membership2.Copy, {
219
220
  as: "p"
220
221
  }, moneyBuyCopy))));
221
222
  };
package/dist/components/Organisms/Membership/Membership.test.js CHANGED
@@ -29,5 +29,5 @@ it("renders correctly", function () {
29
29
  subtitle: "Jordan was close to suicide - which is now the biggest killer of men under 45 in the UK. Join now and help save lives.",
30
30
  otherDescription: "Your donation will help us fund amazing projects in the UK and around the world."
31
31
  })).toJSON();
32
- expect(tree).toMatchInlineSnapshot("\n .c6 {\n font-size: 1.5rem;\n line-height: 1.5rem;\n text-transform: inherit;\n font-weight: 800;\n font-family: 'Montserrat',Helvetica,Arial,sans-serif;\n }\n\n .c7 {\n font-size: 1rem;\n line-height: 1rem;\n text-transform: inherit;\n line-height: normal;\n font-family: 'Montserrat',Helvetica,Arial,sans-serif;\n }\n\n .c12 {\n font-size: 1rem;\n line-height: 1rem;\n text-transform: inherit;\n font-family: 'Montserrat',Helvetica,Arial,sans-serif;\n }\n\n .c16 {\n font-size: 1rem;\n line-height: 1rem;\n text-transform: inherit;\n font-weight: bold;\n line-height: normal;\n font-family: 'Montserrat',Helvetica,Arial,sans-serif;\n }\n\n .c22 {\n font-size: 1rem;\n line-height: 1rem;\n text-transform: inherit;\n font-weight: 500;\n line-height: normal;\n font-family: 'Montserrat',Helvetica,Arial,sans-serif;\n }\n\n .c1 {\n display: block;\n width: 100%;\n height: 100%;\n position: relative;\n }\n\n .c3 {\n width: 100%;\n height: 100%;\n display: block;\n object-fit: cover;\n }\n\n .c14 {\n position: relative;\n display: -webkit-box;\n display: -webkit-flex;\n display: -ms-flexbox;\n display: flex;\n -webkit-flex-direction: column;\n -ms-flex-direction: column;\n flex-direction: column;\n color: #5C5C5E;\n width: 100%;\n }\n\n .c17 {\n margin-bottom: 0.5rem;\n }\n\n .c19 {\n position: relative;\n box-sizing: border-box;\n width: 100%;\n height: 48px;\n padding: 1rem 1.5rem;\n background-color: #F4F3F5;\n border: 1px solid;\n border-color: #E1E2E3;\n box-shadow: none;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n color: #000000;\n border-radius: 0.5rem;\n font-size: inherit;\n z-index: 2;\n font-family: 'Montserrat',Helvetica,Arial,sans-serif;\n }\n\n .c19:focus {\n border: 1px solid #666;\n }\n\n .c18 {\n position: relative;\n font-size: 1.25rem;\n }\n\n .c15 {\n display: block;\n }\n\n .c15 input {\n border: 2px solid #E1E2E3;\n font-size: 1.5rem;\n font-weight: 800;\n -webkit-letter-spacing: -2px;\n -moz-letter-spacing: -2px;\n -ms-letter-spacing: -2px;\n letter-spacing: -2px;\n height: auto;\n }\n\n .c20 {\n display: block;\n }\n\n .c20 input {\n border: 2px solid #E1E2E3;\n font-size: 1.5rem;\n font-weight: 800;\n -webkit-letter-spacing: -2px;\n -moz-letter-spacing: -2px;\n -ms-letter-spacing: -2px;\n letter-spacing: -2px;\n height: auto;\n border-color: #E52630;\n background-color: #E52630;\n color: #FFFFFF;\n }\n\n .c0 {\n background-color: #FEE3CC;\n position: relative;\n display: -webkit-box;\n display: -webkit-flex;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-pack: center;\n -webkit-justify-content: center;\n -ms-flex-pack: center;\n justify-content: center;\n min-height: 100vh;\n }\n\n .c2 {\n position: absolute;\n bottom: 0;\n left: 0;\n right: 0;\n height: auto;\n }\n\n .c2:before {\n color: #FEE3CC;\n content: '';\n position: absolute;\n width: 100%;\n height: 100%;\n box-shadow: inset 0px 4rem 2rem -2rem;\n }\n\n .c4 {\n position: relative;\n max-width: 320px;\n text-align: center;\n margin-bottom: 50%;\n }\n\n .c5 {\n padding: 2rem 1rem 0;\n margin-bottom: 2rem;\n }\n\n .c8 {\n background-color: #FFFFFF;\n box-shadow: 0px 1rem 4rem rgba(0,0,0,0.3);\n height: 450px;\n }\n\n .c9 {\n padding: 1rem;\n }\n\n .c9 h3 {\n margin-top: 1rem;\n }\n\n .c9 input {\n max-width: 100%;\n margin: 0;\n }\n\n .c10 {\n padding: 0;\n margin: 0;\n border: none;\n }\n\n .c10 >:not(:last-child):not(legend) {\n margin-bottom: 2rem;\n }\n\n .c11 {\n margin: 0;\n padding: 0;\n }\n\n .c13 {\n display: -webkit-box;\n display: -webkit-flex;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-pack: justify;\n -webkit-justify-content: space-between;\n -ms-flex-pack: justify;\n justify-content: space-between;\n }\n\n .c13 label {\n -webkit-flex: 0 0 30%;\n -ms-flex: 0 0 30%;\n flex: 0 0 30%;\n }\n\n .c13 label input {\n cursor: pointer;\n padding: 1rem;\n }\n\n .c13 label:hover input {\n border-color: #E52630;\n }\n\n .c21 {\n display: -webkit-box;\n display: -webkit-flex;\n display: -ms-flexbox;\n display: flex;\n -webkit-align-items: center;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n }\n\n .c23 {\n margin-right: auto;\n }\n\n .c24 {\n position: relative;\n -webkit-flex: 0 0 50%;\n -ms-flex: 0 0 50%;\n flex: 0 0 50%;\n font-weight: 400;\n display: block;\n }\n\n .c24 span {\n position: absolute;\n padding: 0px 15px;\n font-size: 20px;\n top: 50%;\n -webkit-transform: translateY(-50%);\n -ms-transform: translateY(-50%);\n transform: translateY(-50%);\n left: 0px;\n font-weight: 500;\n }\n\n .c24 input {\n border: 2px solid #E1E2E3;\n background: transparent;\n padding: 0.5rem 1rem 0.5rem 2rem;\n }\n\n .c24 input:focus {\n border: 2px solid #E52630;\n }\n\n .c26 {\n line-height: 1.5;\n }\n\n .c25 {\n width: 100%;\n color: #FFFFFF;\n font-size: 1rem;\n font-weight: bold;\n cursor: pointer;\n padding: 1rem 0.5rem;\n background: #E52630;\n border: none;\n border-radius: 100px;\n }\n\n .c25:active,\n .c25:focus,\n .c25:hover {\n background-color: #961D35;\n }\n\n @media (min-width:740px) {\n .c19 {\n max-width: 290px;\n }\n }\n\n @media (min-width:1024px) {\n .c0 {\n -webkit-align-items: center;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n -webkit-box-pack: inherit;\n -webkit-justify-content: inherit;\n -ms-flex-pack: inherit;\n justify-content: inherit;\n min-height: 750px;\n height: 100vh;\n max-height: 900px;\n -webkit-flex-direction: row;\n -ms-flex-direction: row;\n flex-direction: row;\n }\n }\n\n @media (min-width:1024px) {\n .c2 {\n height: 100%;\n }\n\n .c2:before {\n content: none;\n }\n }\n\n @media (min-width:1024px) {\n .c4 {\n margin: 0 8rem;\n max-width: 420px;\n }\n }\n\n @media (min-width:1024px) {\n .c8 {\n height: 430px;\n }\n }\n\n @media (min-width:1024px) {\n .c24 {\n -webkit-flex: 0 0 60%;\n -ms-flex: 0 0 60%;\n flex: 0 0 60%;\n }\n }\n\n @media (min-width:1024px) {\n .c25 {\n width: auto;\n padding: 1rem 2rem;\n margin: 0 auto 2rem;\n }\n }\n\n <div\n className=\"c0\"\n id=\"mship-1\"\n >\n <div\n className=\"c1 c2\"\n height=\"100%\"\n width=\"100%\"\n >\n <img\n alt=\"Background image\"\n className=\"c3 lazyload\"\n data-src={null}\n height=\"100%\"\n width=\"100%\"\n />\n </div>\n <div\n className=\"c4\"\n >\n <div\n className=\"c5\"\n >\n <h2\n className=\"c6\"\n color=\"inherit\"\n size=\"l\"\n >\n Help someone like Jordan see a better tomorrow\n </h2>\n <p\n className=\"c7\"\n color=\"inherit\"\n size=\"s\"\n >\n Jordan was close to suicide - which is now the biggest killer of men under 45 in the UK. Join now and help save lives.\n </p>\n </div>\n <div\n className=\"c8\"\n >\n <form\n className=\"c9\"\n onSubmit={[Function]}\n >\n <fieldset\n className=\"c10\"\n >\n <legend\n className=\"c11\"\n >\n <h3\n className=\"c12\"\n color=\"inherit\"\n size=\"s\"\n >\n Choose your monthly donation\n </h3>\n </legend>\n <div\n className=\"c13\"\n >\n <label\n className=\"c14 c15\"\n htmlFor=\"mship-1--moneyBuy-box1\"\n >\n <span\n className=\"c16 c17\"\n color=\"inherit\"\n dangerouslySetInnerHTML={\n Object {\n \"__html\": \"\",\n }\n }\n size=\"s\"\n />\n <div\n className=\"c18\"\n >\n \n <input\n aria-describedby=\"mship-1--moneyBuy-box1\"\n aria-label=\"\xA35\"\n className=\"c19\"\n id=\"mship-1--moneyBuy-box1\"\n name=\"mship-1--moneyBuy1\"\n onClick={[Function]}\n placeholder=\"\"\n required={false}\n type=\"button\"\n value=\"\xA3 5\"\n />\n </div>\n \n </label>\n <label\n className=\"c14 c20\"\n htmlFor=\"mship-1--moneyBuy-box2\"\n >\n <span\n className=\"c16 c17\"\n color=\"inherit\"\n dangerouslySetInnerHTML={\n Object {\n \"__html\": \"\",\n }\n }\n size=\"s\"\n />\n <div\n className=\"c18\"\n >\n \n <input\n aria-describedby=\"mship-1--moneyBuy-box2\"\n aria-label=\"\xA310\"\n className=\"c19\"\n id=\"mship-1--moneyBuy-box2\"\n name=\"mship-1--moneyBuy2\"\n onClick={[Function]}\n placeholder=\"\"\n required={false}\n type=\"button\"\n value=\"\xA3 10\"\n />\n </div>\n \n </label>\n <label\n className=\"c14 c15\"\n htmlFor=\"mship-1--moneyBuy-box3\"\n >\n <span\n className=\"c16 c17\"\n color=\"inherit\"\n dangerouslySetInnerHTML={\n Object {\n \"__html\": \"\",\n }\n }\n size=\"s\"\n />\n <div\n className=\"c18\"\n >\n \n <input\n aria-describedby=\"mship-1--moneyBuy-box3\"\n aria-label=\"\xA320\"\n className=\"c19\"\n id=\"mship-1--moneyBuy-box3\"\n name=\"mship-1--moneyBuy3\"\n onClick={[Function]}\n placeholder=\"\"\n required={false}\n type=\"button\"\n value=\"\xA3 20\"\n />\n </div>\n \n </label>\n </div>\n <div\n className=\"c21\"\n >\n <span\n className=\"c22 c23\"\n color=\"inherit\"\n size=\"s\"\n >\n Other amount\n </span>\n <label\n className=\"c14 c24\"\n htmlFor=\"mship-1--MoneyBuy-userInput\"\n >\n <span\n className=\"c16 c17\"\n color=\"inherit\"\n dangerouslySetInnerHTML={\n Object {\n \"__html\": \"\xA3\",\n }\n }\n size=\"s\"\n />\n <div\n className=\"c18\"\n >\n \n <input\n aria-describedby=\"mship-1--MoneyBuy-userInput\"\n aria-label=\"Input a different amount\"\n className=\"c19\"\n id=\"mship-1--MoneyBuy-userInput\"\n max=\"20000\"\n min=\"1\"\n name=\"membership_amount\"\n onChange={[Function]}\n onClick={[Function]}\n onKeyPress={[Function]}\n pattern=\"[^[0-9]+([,.][0-9]+)?$]\"\n placeholder=\"0.00\"\n required={false}\n step=\"0.01\"\n type=\"number\"\n value=\"\"\n />\n </div>\n \n </label>\n </div>\n <input\n className=\"c25\"\n type=\"submit\"\n value=\"Donate\"\n />\n <p\n className=\"c26\"\n />\n </fieldset>\n </form>\n </div>\n </div>\n </div>\n ");
32
+ expect(tree).toMatchInlineSnapshot("\n .c6 {\n font-size: 1.5rem;\n line-height: 1.5rem;\n text-transform: inherit;\n font-weight: 800;\n font-family: 'Montserrat',Helvetica,Arial,sans-serif;\n }\n\n .c7 {\n font-size: 1rem;\n line-height: 1rem;\n text-transform: inherit;\n line-height: normal;\n font-family: 'Montserrat',Helvetica,Arial,sans-serif;\n }\n\n .c12 {\n font-size: 1rem;\n line-height: 1rem;\n text-transform: inherit;\n font-family: 'Montserrat',Helvetica,Arial,sans-serif;\n }\n\n .c16 {\n font-size: 1rem;\n line-height: 1rem;\n text-transform: inherit;\n font-weight: bold;\n line-height: normal;\n font-family: 'Montserrat',Helvetica,Arial,sans-serif;\n }\n\n .c22 {\n font-size: 1rem;\n line-height: 1rem;\n text-transform: inherit;\n font-weight: 500;\n line-height: normal;\n font-family: 'Montserrat',Helvetica,Arial,sans-serif;\n }\n\n .c1 {\n display: block;\n width: 100%;\n height: 100%;\n position: relative;\n }\n\n .c3 {\n width: 100%;\n height: 100%;\n display: block;\n object-fit: cover;\n }\n\n .c14 {\n position: relative;\n display: -webkit-box;\n display: -webkit-flex;\n display: -ms-flexbox;\n display: flex;\n -webkit-flex-direction: column;\n -ms-flex-direction: column;\n flex-direction: column;\n color: #5C5C5E;\n width: 100%;\n }\n\n .c17 {\n margin-bottom: 0.5rem;\n }\n\n .c19 {\n position: relative;\n box-sizing: border-box;\n width: 100%;\n height: 48px;\n padding: 1rem 1.5rem;\n background-color: #F4F3F5;\n border: 1px solid;\n border-color: #E1E2E3;\n box-shadow: none;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n color: #000000;\n border-radius: 0.5rem;\n font-size: inherit;\n z-index: 2;\n font-family: 'Montserrat',Helvetica,Arial,sans-serif;\n }\n\n .c19:focus {\n border: 1px solid #666;\n }\n\n .c18 {\n position: relative;\n font-size: 1.25rem;\n }\n\n .c15 {\n display: block;\n }\n\n .c15 input {\n border: 2px solid #E1E2E3;\n font-size: 1.5rem;\n font-weight: 800;\n -webkit-letter-spacing: -2px;\n -moz-letter-spacing: -2px;\n -ms-letter-spacing: -2px;\n letter-spacing: -2px;\n height: auto;\n }\n\n .c20 {\n display: block;\n }\n\n .c20 input {\n border: 2px solid #E1E2E3;\n font-size: 1.5rem;\n font-weight: 800;\n -webkit-letter-spacing: -2px;\n -moz-letter-spacing: -2px;\n -ms-letter-spacing: -2px;\n letter-spacing: -2px;\n height: auto;\n border-color: #E52630;\n background-color: #E52630;\n color: #FFFFFF;\n }\n\n .c0 {\n background-color: #FEE3CC;\n position: relative;\n display: -webkit-box;\n display: -webkit-flex;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-pack: center;\n -webkit-justify-content: center;\n -ms-flex-pack: center;\n justify-content: center;\n min-height: 100vh;\n }\n\n .c2 {\n position: absolute;\n bottom: 0;\n left: 0;\n right: 0;\n height: auto;\n }\n\n .c2:before {\n color: #FEE3CC;\n content: '';\n position: absolute;\n width: 100%;\n height: 100%;\n box-shadow: inset 0px 4rem 2rem -2rem;\n }\n\n .c4 {\n position: relative;\n max-width: 320px;\n text-align: center;\n margin-bottom: 50%;\n }\n\n .c5 {\n padding: 2rem 1rem 0;\n margin-bottom: 2rem;\n }\n\n .c8 {\n background-color: #FFFFFF;\n box-shadow: 0px 1rem 4rem rgba(0,0,0,0.3);\n height: 450px;\n }\n\n .c9 {\n padding: 1rem;\n }\n\n .c9 h3 {\n margin-top: 1rem;\n }\n\n .c9 input {\n max-width: 100%;\n margin: 0;\n }\n\n .c10 {\n padding: 0;\n margin: 0;\n border: none;\n }\n\n .c10 >:not(:last-child):not(legend) {\n margin-bottom: 2rem;\n }\n\n .c11 {\n margin: 0;\n padding: 0;\n }\n\n .c13 {\n display: -webkit-box;\n display: -webkit-flex;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-pack: justify;\n -webkit-justify-content: space-between;\n -ms-flex-pack: justify;\n justify-content: space-between;\n }\n\n .c13 label {\n -webkit-flex: 0 0 30%;\n -ms-flex: 0 0 30%;\n flex: 0 0 30%;\n }\n\n .c13 label input {\n cursor: pointer;\n padding: 1rem;\n }\n\n .c13 label:hover input {\n border-color: #E52630;\n }\n\n .c21 {\n display: -webkit-box;\n display: -webkit-flex;\n display: -ms-flexbox;\n display: flex;\n -webkit-align-items: center;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n }\n\n .c23 {\n margin-right: auto;\n }\n\n .c24 {\n position: relative;\n -webkit-flex: 0 0 50%;\n -ms-flex: 0 0 50%;\n flex: 0 0 50%;\n font-weight: 400;\n display: block;\n }\n\n .c24 span {\n position: absolute;\n padding: 0px 15px;\n font-size: 20px;\n top: 50%;\n -webkit-transform: translateY(-50%);\n -ms-transform: translateY(-50%);\n transform: translateY(-50%);\n left: 0px;\n font-weight: 500;\n }\n\n .c24 input {\n border: 2px solid #E1E2E3;\n background: transparent;\n padding: 0.5rem 1rem 0.5rem 2rem;\n }\n\n .c24 input:focus {\n border: 2px solid #E52630;\n }\n\n .c26 {\n line-height: 1.5;\n }\n\n .c25 {\n width: 100%;\n color: #FFFFFF;\n font-size: 1rem;\n font-weight: bold;\n cursor: pointer;\n padding: 1rem 0.5rem;\n background: #E52630;\n border: none;\n border-radius: 100px;\n }\n\n .c25:active,\n .c25:focus,\n .c25:hover {\n background-color: #961D35;\n }\n\n @media (min-width:740px) {\n .c19 {\n max-width: 290px;\n }\n }\n\n @media (min-width:1024px) {\n .c0 {\n -webkit-align-items: center;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n -webkit-box-pack: inherit;\n -webkit-justify-content: inherit;\n -ms-flex-pack: inherit;\n justify-content: inherit;\n min-height: 750px;\n height: 100vh;\n max-height: 900px;\n -webkit-flex-direction: row;\n -ms-flex-direction: row;\n flex-direction: row;\n }\n }\n\n @media (min-width:1024px) {\n .c2 {\n height: 100%;\n }\n\n .c2:before {\n content: none;\n }\n }\n\n @media (min-width:1024px) {\n .c4 {\n margin: 0 8rem;\n max-width: 420px;\n }\n }\n\n @media (min-width:1024px) {\n .c8 {\n height: 430px;\n }\n }\n\n @media (min-width:1024px) {\n .c24 {\n -webkit-flex: 0 0 60%;\n -ms-flex: 0 0 60%;\n flex: 0 0 60%;\n }\n }\n\n @media (min-width:1024px) {\n .c25 {\n width: auto;\n padding: 1rem 2rem;\n margin: 0 auto 2rem;\n }\n }\n\n <div\n className=\"c0\"\n id=\"mship-1\"\n >\n <div\n className=\"c1 c2\"\n height=\"100%\"\n width=\"100%\"\n >\n <img\n alt=\"Background image\"\n className=\"c3 lazyload\"\n data-src={null}\n height=\"100%\"\n width=\"100%\"\n />\n </div>\n <div\n className=\"c4\"\n >\n <div\n className=\"c5\"\n >\n <h2\n className=\"c6\"\n color=\"inherit\"\n size=\"l\"\n >\n Help someone like Jordan see a better tomorrow\n </h2>\n <p\n className=\"c7\"\n color=\"inherit\"\n size=\"s\"\n >\n Jordan was close to suicide - which is now the biggest killer of men under 45 in the UK. Join now and help save lives.\n </p>\n </div>\n <div\n className=\"c8\"\n >\n <form\n className=\"c9\"\n onSubmit={[Function]}\n >\n <fieldset\n className=\"c10\"\n >\n <legend\n className=\"c11\"\n >\n <h3\n className=\"c12\"\n color=\"inherit\"\n size=\"s\"\n >\n Choose your monthly donation\n </h3>\n </legend>\n <div\n className=\"c13\"\n >\n <label\n className=\"c14 c15\"\n htmlFor=\"mship-1--moneyBuy-box1\"\n >\n <span\n className=\"c16 c17\"\n color=\"inherit\"\n dangerouslySetInnerHTML={\n Object {\n \"__html\": \"\",\n }\n }\n size=\"s\"\n />\n <div\n className=\"c18\"\n >\n \n <input\n aria-describedby=\"mship-1--moneyBuy-box1\"\n aria-label=\"\xA35\"\n className=\"c19\"\n id=\"mship-1--moneyBuy-box1\"\n name=\"mship-1--moneyBuy1\"\n onClick={[Function]}\n placeholder=\"\"\n required={false}\n type=\"button\"\n value=\"\xA3 5\"\n />\n </div>\n \n </label>\n <label\n className=\"c14 c20\"\n htmlFor=\"mship-1--moneyBuy-box2\"\n >\n <span\n className=\"c16 c17\"\n color=\"inherit\"\n dangerouslySetInnerHTML={\n Object {\n \"__html\": \"\",\n }\n }\n size=\"s\"\n />\n <div\n className=\"c18\"\n >\n \n <input\n aria-describedby=\"mship-1--moneyBuy-box2\"\n aria-label=\"\xA310\"\n className=\"c19\"\n id=\"mship-1--moneyBuy-box2\"\n name=\"mship-1--moneyBuy2\"\n onClick={[Function]}\n placeholder=\"\"\n required={false}\n type=\"button\"\n value=\"\xA3 10\"\n />\n </div>\n \n </label>\n <label\n className=\"c14 c15\"\n htmlFor=\"mship-1--moneyBuy-box3\"\n >\n <span\n className=\"c16 c17\"\n color=\"inherit\"\n dangerouslySetInnerHTML={\n Object {\n \"__html\": \"\",\n }\n }\n size=\"s\"\n />\n <div\n className=\"c18\"\n >\n \n <input\n aria-describedby=\"mship-1--moneyBuy-box3\"\n aria-label=\"\xA320\"\n className=\"c19\"\n id=\"mship-1--moneyBuy-box3\"\n name=\"mship-1--moneyBuy3\"\n onClick={[Function]}\n placeholder=\"\"\n required={false}\n type=\"button\"\n value=\"\xA3 20\"\n />\n </div>\n \n </label>\n </div>\n <div\n className=\"c21\"\n >\n <span\n className=\"c22 c23\"\n color=\"inherit\"\n size=\"s\"\n >\n Other amount\n </span>\n <label\n className=\"c14 c24\"\n htmlFor=\"mship-1--MoneyBuy-userInput\"\n >\n <span\n className=\"c16 c17\"\n color=\"inherit\"\n dangerouslySetInnerHTML={\n Object {\n \"__html\": \"\xA3\",\n }\n }\n size=\"s\"\n />\n <div\n className=\"c18\"\n >\n \n <input\n aria-describedby=\"mship-1--MoneyBuy-userInput\"\n aria-label=\"Input a different amount\"\n className=\"c19\"\n id=\"mship-1--MoneyBuy-userInput\"\n max=\"25000\"\n min=\"1\"\n name=\"membership_amount\"\n onChange={[Function]}\n onClick={[Function]}\n onKeyPress={[Function]}\n pattern=\"[^[0-9]+([,.][0-9]+)?$]\"\n placeholder=\"0.00\"\n required={false}\n step=\"0.01\"\n type=\"number\"\n value=\"\"\n />\n </div>\n \n </label>\n </div>\n <input\n className=\"c25\"\n type=\"submit\"\n value=\"Donate\"\n />\n <p\n className=\"c26\"\n />\n </fieldset>\n </form>\n </div>\n </div>\n </div>\n ");
33
33
  });
package/dist/utils/Membership.js CHANGED
@@ -16,7 +16,7 @@ exports.onKeyPress = onKeyPress;
16
16
 
17
17
  var isAmountValid = function isAmountValid(input) {
18
18
  var reg = /^\s*(?=.*[1-9])\d*(?:\.\d{1,2})?\s*$/g;
19
- var isValid = input * 1 >= 1 && input * 1 <= 20000 && reg.test(input);
19
+ var isValid = input * 1 >= 1 && input * 1 <= 25000 && reg.test(input);
20
20
  return isValid;
21
21
  };
22
22
 
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@comicrelief/component-library",
3
3
  "author": "Comic Relief Engineering Team",
4
- "version": "7.0.1",
4
+ "version": "7.0.2",
5
5
  "main": "dist/index.js",
6
6
  "license": "ISC",
7
7
  "jest": {
package/src/components/Organisms/Donate/Form/Form.js CHANGED
@@ -179,7 +179,7 @@ const Signup = ({
179
179
  id={`${mbshipID}--MoneyBuy-userInput`}
180
180
  showLabel
181
181
  {...rest}
182
- max="20000"
182
+ max="25000"
183
183
  min="1"
184
184
  value={amountDonate}
185
185
  pattern="[^[0-9]+([,.][0-9]+)?$]"
@@ -194,6 +194,14 @@ const Signup = ({
194
194
  {moneyBuyCopy}
195
195
  </Copy>
196
196
  )}
197
+
198
+ {errorMsg && (
199
+ <Error className="error--amount" tag="p">
200
+ Please enter an amount between £1 and £25000 and up to 2 decimal
201
+ places
202
+ </Error>
203
+ )}
204
+
197
205
  {noMoneyBuys ? (
198
206
  <Button type="submit" as="input" value="Donate" />
199
207
  ) : (
@@ -203,12 +211,7 @@ const Signup = ({
203
211
  value={givingType === 'single' ? 'Donate now' : 'Donate monthly'}
204
212
  />
205
213
  )}
206
- {errorMsg && (
207
- <Error tag="p">
208
- Please enter an amount between £1 and £20000 and up to 2 decimal
209
- places
210
- </Error>
211
- )}
214
+
212
215
  </OuterFieldset>
213
216
  </Form>
214
217
  </FormWrapper>
package/src/components/Organisms/Donate/__snapshots__/Donate.test.js.snap CHANGED
@@ -818,7 +818,7 @@ exports[`Monthly donation renders correctly 1`] = `
818
818
  aria-label="Input a different amount"
819
819
  className="c23"
820
820
  id="mship-1--MoneyBuy-userInput"
821
- max="20000"
821
+ max="25000"
822
822
  min="1"
823
823
  name="membership_amount"
824
824
  onChange={[Function]}
@@ -1521,7 +1521,7 @@ exports[`Single donation renders correctly 1`] = `
1521
1521
  aria-label="Input a different amount"
1522
1522
  className="c17"
1523
1523
  id="mship-1--MoneyBuy-userInput"
1524
- max="20000"
1524
+ max="25000"
1525
1525
  min="1"
1526
1526
  name="membership_amount"
1527
1527
  onChange={[Function]}
@@ -1987,7 +1987,7 @@ exports[`Single donation with no Money Buys renders correctly 1`] = `
1987
1987
  aria-label="Input a different amount"
1988
1988
  className="c17"
1989
1989
  id="mship-1--MoneyBuy-userInput"
1990
- max="20000"
1990
+ max="25000"
1991
1991
  min="1"
1992
1992
  name="membership_amount"
1993
1993
  onChange={[Function]}
package/src/components/Organisms/EmailSignUp/EmailSignUpForm.js CHANGED
@@ -23,6 +23,7 @@ const EmailSignUpForm = () => {
23
23
  ESU_FIELDS.LAST_NAME
24
24
  ]);
25
25
  if (valid) {
26
+ // eslint-disable-next-line no-console
26
27
  console.log(data);
27
28
  }
28
29
  }
package/src/components/Organisms/Membership/Form/Form.js CHANGED
@@ -170,7 +170,7 @@ const Signup = ({
170
170
  id={`${mbshipID}--MoneyBuy-userInput`}
171
171
  showLabel
172
172
  {...rest}
173
- max="20000"
173
+ max="25000"
174
174
  min="1"
175
175
  value={userInput}
176
176
  pattern="[^[0-9]+([,.][0-9]+)?$]"
@@ -183,8 +183,8 @@ const Signup = ({
183
183
  </FormFieldset>
184
184
  <Button as="input" type="submit" value="Donate" />
185
185
  {errorMsg && (
186
- <Error tag="p">
187
- Please enter a number between 1 and 20000, and up to 2 decimal
186
+ <Error tag="p" className="error--amount">
187
+ Please enter a number between 1 and 25000, and up to 2 decimal
188
188
  places
189
189
  </Error>
190
190
  )}
package/src/components/Organisms/Membership/Membership.test.js CHANGED
@@ -589,7 +589,7 @@ it("renders correctly", () => {
589
589
  aria-label="Input a different amount"
590
590
  className="c19"
591
591
  id="mship-1--MoneyBuy-userInput"
592
- max="20000"
592
+ max="25000"
593
593
  min="1"
594
594
  name="membership_amount"
595
595
  onChange={[Function]}
package/src/utils/Membership.js CHANGED
@@ -7,7 +7,7 @@ const onKeyPress = event => {
7
7
 
8
8
  const isAmountValid = input => {
9
9
  const reg = /^\s*(?=.*[1-9])\d*(?:\.\d{1,2})?\s*$/g;
10
- const isValid = input * 1 >= 1 && input * 1 <= 20000 && reg.test(input);
10
+ const isValid = input * 1 >= 1 && input * 1 <= 25000 && reg.test(input);
11
11
  return isValid;
12
12
  };
13
13