@comicrelief/component-library 8.37.0 → 8.38.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.
Files changed (17) hide show
  1. package/dist/components/Atoms/Input/Input.js +3 -2
  2. package/dist/components/Atoms/Input/input.test.js +2 -0
  3. package/dist/components/Atoms/TextInputWithDropdown/__snapshots__/TextInputWithDropdown.test.js.snap +3 -0
  4. package/dist/components/Molecules/SchoolLookup/__snapshots__/SchoolLookup.test.js.snap +1 -0
  5. package/dist/components/Molecules/SearchInput/SearchInput.test.js +1 -0
  6. package/dist/components/Molecules/Typeahead/__snapshots__/Typeahead.test.js.snap +1 -0
  7. package/dist/components/Organisms/Donate/__snapshots__/Donate.test.js.snap +7 -0
  8. package/dist/components/Organisms/Membership/Membership.test.js +4 -0
  9. package/package.json +1 -1
  10. package/src/components/Atoms/Input/Input.js +2 -1
  11. package/src/components/Atoms/Input/input.test.js +2 -0
  12. package/src/components/Atoms/TextInputWithDropdown/__snapshots__/TextInputWithDropdown.test.js.snap +3 -0
  13. package/src/components/Molecules/SchoolLookup/__snapshots__/SchoolLookup.test.js.snap +1 -0
  14. package/src/components/Molecules/SearchInput/SearchInput.test.js +1 -0
  15. package/src/components/Molecules/Typeahead/__snapshots__/Typeahead.test.js.snap +1 -0
  16. package/src/components/Organisms/Donate/__snapshots__/Donate.test.js.snap +7 -0
  17. package/src/components/Organisms/Membership/Membership.test.js +4 -0
package/dist/components/Atoms/Input/Input.js CHANGED
@@ -118,10 +118,11 @@ const Input = /*#__PURE__*/_react.default.forwardRef((_ref8, ref) => {
118
118
  type: type,
119
119
  placeholder: placeholder,
120
120
  error: Boolean(errorMsg),
121
- "aria-describedby": description ? `${id}-description` : undefined,
122
121
  ref: ref,
123
122
  prefixLength: prefix.length,
124
- required: optional === false
123
+ required: optional === false,
124
+ "aria-required": optional === false,
125
+ "aria-describedby": description ? `${id}-description` : undefined
125
126
  }, rest)), errorMsg && /*#__PURE__*/_react.default.createElement(ErrorIconWrapper, null))), errorMsg && /*#__PURE__*/_react.default.createElement(_ErrorText.default, {
126
127
  size: "error",
127
128
  weight: "bold",
package/dist/components/Atoms/Input/input.test.js CHANGED
@@ -117,6 +117,7 @@ it('renders correctly', () => {
117
117
  className="c4"
118
118
  >
119
119
  <input
120
+ aria-required={false}
120
121
  className="c5"
121
122
  id="Accessibility info go here"
122
123
  name="fullname"
@@ -248,6 +249,7 @@ it('renders with responsive max widths correctly', () => {
248
249
  className="c4"
249
250
  >
250
251
  <input
252
+ aria-required={false}
251
253
  className="c5"
252
254
  id="input-example-7"
253
255
  name="responsive-width"
package/dist/components/Atoms/TextInputWithDropdown/__snapshots__/TextInputWithDropdown.test.js.snap CHANGED
@@ -111,6 +111,7 @@ exports[`renders correctly with no value and no options 1`] = `
111
111
  className="c5"
112
112
  >
113
113
  <input
114
+ aria-required={false}
114
115
  autoComplete="off"
115
116
  className="c6"
116
117
  id="text-input-with-dropdown"
@@ -240,6 +241,7 @@ exports[`renders correctly with value and no options 1`] = `
240
241
  className="c5"
241
242
  >
242
243
  <input
244
+ aria-required={false}
243
245
  autoComplete="off"
244
246
  className="c6"
245
247
  id="text-input-with-dropdown"
@@ -408,6 +410,7 @@ exports[`renders correctly with value and options 1`] = `
408
410
  className="c5"
409
411
  >
410
412
  <input
413
+ aria-required={false}
411
414
  autoComplete="off"
412
415
  className="c6"
413
416
  id="text-input-with-dropdown"
package/dist/components/Molecules/SchoolLookup/__snapshots__/SchoolLookup.test.js.snap CHANGED
@@ -111,6 +111,7 @@ exports[`renders correctly 1`] = `
111
111
  className="c5"
112
112
  >
113
113
  <input
114
+ aria-required={false}
114
115
  autoComplete="off"
115
116
  className="c6"
116
117
  defaultValue=""
package/dist/components/Molecules/SearchInput/SearchInput.test.js CHANGED
@@ -182,6 +182,7 @@ it('renders correctly', () => {
182
182
  className="c9"
183
183
  >
184
184
  <input
185
+ aria-required={false}
185
186
  className="c10"
186
187
  id="search"
187
188
  name="search"
package/dist/components/Molecules/Typeahead/__snapshots__/Typeahead.test.js.snap CHANGED
@@ -111,6 +111,7 @@ exports[`renders correctly 1`] = `
111
111
  className="c5"
112
112
  >
113
113
  <input
114
+ aria-required={false}
114
115
  autoComplete="off"
115
116
  className="c6"
116
117
  defaultValue=""
package/dist/components/Organisms/Donate/__snapshots__/Donate.test.js.snap CHANGED
@@ -648,6 +648,7 @@ exports[`"Single Giving, No Money Buys, with overridden manual input value" rend
648
648
  >
649
649
  <input
650
650
  aria-label="Input a different amount"
651
+ aria-required={false}
651
652
  className="c24"
652
653
  id="mship-4--MoneyBuy-userInput"
653
654
  max="25000"
@@ -1314,6 +1315,7 @@ exports[`Monthly donation renders correctly 1`] = `
1314
1315
  >
1315
1316
  <input
1316
1317
  aria-label="Input a different amount"
1318
+ aria-required={false}
1317
1319
  className="c25"
1318
1320
  id="mship-1--MoneyBuy-userInput"
1319
1321
  max="25000"
@@ -1948,6 +1950,7 @@ exports[`Single donation renders correctly 1`] = `
1948
1950
  >
1949
1951
  <input
1950
1952
  aria-label="£10"
1953
+ aria-required={false}
1951
1954
  className="c18"
1952
1955
  id="mship-1--moneyBuy-box1"
1953
1956
  name="mship-1--moneyBuy1"
@@ -1985,6 +1988,7 @@ exports[`Single donation renders correctly 1`] = `
1985
1988
  >
1986
1989
  <input
1987
1990
  aria-label="£20"
1991
+ aria-required={false}
1988
1992
  className="c18"
1989
1993
  id="mship-1--moneyBuy-box2"
1990
1994
  name="mship-1--moneyBuy2"
@@ -2022,6 +2026,7 @@ exports[`Single donation renders correctly 1`] = `
2022
2026
  >
2023
2027
  <input
2024
2028
  aria-label="£30"
2029
+ aria-required={false}
2025
2030
  className="c18"
2026
2031
  id="mship-1--moneyBuy-box3"
2027
2032
  name="mship-1--moneyBuy3"
@@ -2070,6 +2075,7 @@ exports[`Single donation renders correctly 1`] = `
2070
2075
  >
2071
2076
  <input
2072
2077
  aria-label="Input a different amount"
2078
+ aria-required={false}
2073
2079
  className="c18"
2074
2080
  id="mship-1--MoneyBuy-userInput"
2075
2081
  max="25000"
@@ -2566,6 +2572,7 @@ exports[`Single donation with no Money Buys renders correctly 1`] = `
2566
2572
  >
2567
2573
  <input
2568
2574
  aria-label="Input a different amount"
2575
+ aria-required={false}
2569
2576
  className="c18"
2570
2577
  id="mship-1--MoneyBuy-userInput"
2571
2578
  max="25000"
package/dist/components/Organisms/Membership/Membership.test.js CHANGED
@@ -488,6 +488,7 @@ it('renders correctly', () => {
488
488
  >
489
489
  <input
490
490
  aria-label="£5"
491
+ aria-required={false}
491
492
  className="c19"
492
493
  id="mship-1--moneyBuy-box1"
493
494
  name="mship-1--moneyBuy1"
@@ -525,6 +526,7 @@ it('renders correctly', () => {
525
526
  >
526
527
  <input
527
528
  aria-label="£10"
529
+ aria-required={false}
528
530
  className="c19"
529
531
  id="mship-1--moneyBuy-box2"
530
532
  name="mship-1--moneyBuy2"
@@ -562,6 +564,7 @@ it('renders correctly', () => {
562
564
  >
563
565
  <input
564
566
  aria-label="£20"
567
+ aria-required={false}
565
568
  className="c19"
566
569
  id="mship-1--moneyBuy-box3"
567
570
  name="mship-1--moneyBuy3"
@@ -610,6 +613,7 @@ it('renders correctly', () => {
610
613
  >
611
614
  <input
612
615
  aria-label="Input a different amount"
616
+ aria-required={false}
613
617
  className="c19"
614
618
  id="mship-1--MoneyBuy-userInput"
615
619
  max="25000"
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": "8.37.0",
4
+ "version": "8.38.0",
5
5
  "main": "dist/index.js",
6
6
  "license": "ISC",
7
7
  "jest": {
package/src/components/Atoms/Input/Input.js CHANGED
@@ -136,10 +136,11 @@ const Input = React.forwardRef(
136
136
  type={type}
137
137
  placeholder={placeholder}
138
138
  error={Boolean(errorMsg)}
139
- aria-describedby={description ? `${id}-description` : undefined}
140
139
  ref={ref}
141
140
  prefixLength={prefix.length}
142
141
  required={optional === false}
142
+ aria-required={optional === false}
143
+ aria-describedby={description ? `${id}-description` : undefined}
143
144
  {...rest}
144
145
  />
145
146
  {errorMsg && <ErrorIconWrapper />}
package/src/components/Atoms/Input/input.test.js CHANGED
@@ -118,6 +118,7 @@ it('renders correctly', () => {
118
118
  className="c4"
119
119
  >
120
120
  <input
121
+ aria-required={false}
121
122
  className="c5"
122
123
  id="Accessibility info go here"
123
124
  name="fullname"
@@ -253,6 +254,7 @@ it('renders with responsive max widths correctly', () => {
253
254
  className="c4"
254
255
  >
255
256
  <input
257
+ aria-required={false}
256
258
  className="c5"
257
259
  id="input-example-7"
258
260
  name="responsive-width"
package/src/components/Atoms/TextInputWithDropdown/__snapshots__/TextInputWithDropdown.test.js.snap CHANGED
@@ -111,6 +111,7 @@ exports[`renders correctly with no value and no options 1`] = `
111
111
  className="c5"
112
112
  >
113
113
  <input
114
+ aria-required={false}
114
115
  autoComplete="off"
115
116
  className="c6"
116
117
  id="text-input-with-dropdown"
@@ -240,6 +241,7 @@ exports[`renders correctly with value and no options 1`] = `
240
241
  className="c5"
241
242
  >
242
243
  <input
244
+ aria-required={false}
243
245
  autoComplete="off"
244
246
  className="c6"
245
247
  id="text-input-with-dropdown"
@@ -408,6 +410,7 @@ exports[`renders correctly with value and options 1`] = `
408
410
  className="c5"
409
411
  >
410
412
  <input
413
+ aria-required={false}
411
414
  autoComplete="off"
412
415
  className="c6"
413
416
  id="text-input-with-dropdown"
package/src/components/Molecules/SchoolLookup/__snapshots__/SchoolLookup.test.js.snap CHANGED
@@ -111,6 +111,7 @@ exports[`renders correctly 1`] = `
111
111
  className="c5"
112
112
  >
113
113
  <input
114
+ aria-required={false}
114
115
  autoComplete="off"
115
116
  className="c6"
116
117
  defaultValue=""
package/src/components/Molecules/SearchInput/SearchInput.test.js CHANGED
@@ -183,6 +183,7 @@ it('renders correctly', () => {
183
183
  className="c9"
184
184
  >
185
185
  <input
186
+ aria-required={false}
186
187
  className="c10"
187
188
  id="search"
188
189
  name="search"
package/src/components/Molecules/Typeahead/__snapshots__/Typeahead.test.js.snap CHANGED
@@ -111,6 +111,7 @@ exports[`renders correctly 1`] = `
111
111
  className="c5"
112
112
  >
113
113
  <input
114
+ aria-required={false}
114
115
  autoComplete="off"
115
116
  className="c6"
116
117
  defaultValue=""
package/src/components/Organisms/Donate/__snapshots__/Donate.test.js.snap CHANGED
@@ -648,6 +648,7 @@ exports[`"Single Giving, No Money Buys, with overridden manual input value" rend
648
648
  >
649
649
  <input
650
650
  aria-label="Input a different amount"
651
+ aria-required={false}
651
652
  className="c24"
652
653
  id="mship-4--MoneyBuy-userInput"
653
654
  max="25000"
@@ -1314,6 +1315,7 @@ exports[`Monthly donation renders correctly 1`] = `
1314
1315
  >
1315
1316
  <input
1316
1317
  aria-label="Input a different amount"
1318
+ aria-required={false}
1317
1319
  className="c25"
1318
1320
  id="mship-1--MoneyBuy-userInput"
1319
1321
  max="25000"
@@ -1948,6 +1950,7 @@ exports[`Single donation renders correctly 1`] = `
1948
1950
  >
1949
1951
  <input
1950
1952
  aria-label="£10"
1953
+ aria-required={false}
1951
1954
  className="c18"
1952
1955
  id="mship-1--moneyBuy-box1"
1953
1956
  name="mship-1--moneyBuy1"
@@ -1985,6 +1988,7 @@ exports[`Single donation renders correctly 1`] = `
1985
1988
  >
1986
1989
  <input
1987
1990
  aria-label="£20"
1991
+ aria-required={false}
1988
1992
  className="c18"
1989
1993
  id="mship-1--moneyBuy-box2"
1990
1994
  name="mship-1--moneyBuy2"
@@ -2022,6 +2026,7 @@ exports[`Single donation renders correctly 1`] = `
2022
2026
  >
2023
2027
  <input
2024
2028
  aria-label="£30"
2029
+ aria-required={false}
2025
2030
  className="c18"
2026
2031
  id="mship-1--moneyBuy-box3"
2027
2032
  name="mship-1--moneyBuy3"
@@ -2070,6 +2075,7 @@ exports[`Single donation renders correctly 1`] = `
2070
2075
  >
2071
2076
  <input
2072
2077
  aria-label="Input a different amount"
2078
+ aria-required={false}
2073
2079
  className="c18"
2074
2080
  id="mship-1--MoneyBuy-userInput"
2075
2081
  max="25000"
@@ -2566,6 +2572,7 @@ exports[`Single donation with no Money Buys renders correctly 1`] = `
2566
2572
  >
2567
2573
  <input
2568
2574
  aria-label="Input a different amount"
2575
+ aria-required={false}
2569
2576
  className="c18"
2570
2577
  id="mship-1--MoneyBuy-userInput"
2571
2578
  max="25000"
package/src/components/Organisms/Membership/Membership.test.js CHANGED
@@ -490,6 +490,7 @@ it('renders correctly', () => {
490
490
  >
491
491
  <input
492
492
  aria-label="£5"
493
+ aria-required={false}
493
494
  className="c19"
494
495
  id="mship-1--moneyBuy-box1"
495
496
  name="mship-1--moneyBuy1"
@@ -527,6 +528,7 @@ it('renders correctly', () => {
527
528
  >
528
529
  <input
529
530
  aria-label="£10"
531
+ aria-required={false}
530
532
  className="c19"
531
533
  id="mship-1--moneyBuy-box2"
532
534
  name="mship-1--moneyBuy2"
@@ -564,6 +566,7 @@ it('renders correctly', () => {
564
566
  >
565
567
  <input
566
568
  aria-label="£20"
569
+ aria-required={false}
567
570
  className="c19"
568
571
  id="mship-1--moneyBuy-box3"
569
572
  name="mship-1--moneyBuy3"
@@ -612,6 +615,7 @@ it('renders correctly', () => {
612
615
  >
613
616
  <input
614
617
  aria-label="Input a different amount"
618
+ aria-required={false}
615
619
  className="c19"
616
620
  id="mship-1--MoneyBuy-userInput"
617
621
  max="25000"