@comicrelief/component-library 8.31.1 → 8.32.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 (31) hide show
  1. package/dist/components/Atoms/Input/Input.md +0 -1
  2. package/dist/components/Atoms/Input/input.test.js +2 -2
  3. package/dist/components/Atoms/Label/Label.js +4 -12
  4. package/dist/components/Atoms/Select/__snapshots__/Select.test.js.snap +1 -1
  5. package/dist/components/Atoms/TextArea/TextArea.test.js +1 -1
  6. package/dist/components/Atoms/TextInputWithDropdown/__snapshots__/TextInputWithDropdown.test.js.snap +3 -3
  7. package/dist/components/Molecules/SchoolLookup/__snapshots__/SchoolLookup.test.js.snap +1 -1
  8. package/dist/components/Molecules/SearchInput/SearchInput.test.js +1 -1
  9. package/dist/components/Molecules/Typeahead/__snapshots__/Typeahead.test.js.snap +1 -1
  10. package/dist/components/Organisms/Donate/__snapshots__/Donate.test.js.snap +4 -4
  11. package/dist/components/Organisms/EmailSignUp/__snapshots__/EmailSignUp.test.js.snap +1 -1
  12. package/dist/components/Organisms/Footer/Footer.js +1 -1
  13. package/dist/components/Organisms/Footer/Footer.md +1 -1
  14. package/dist/components/Organisms/Footer/{FundraisingRegulatorLogo.js → FundraisingRegulatorLogo/FundraisingRegulatorLogo.js} +2 -2
  15. package/dist/components/Organisms/Membership/Membership.test.js +1 -1
  16. package/package.json +1 -1
  17. package/src/components/Atoms/Input/Input.md +0 -1
  18. package/src/components/Atoms/Input/input.test.js +2 -2
  19. package/src/components/Atoms/Label/Label.js +4 -12
  20. package/src/components/Atoms/Select/__snapshots__/Select.test.js.snap +1 -1
  21. package/src/components/Atoms/TextArea/TextArea.test.js +1 -1
  22. package/src/components/Atoms/TextInputWithDropdown/__snapshots__/TextInputWithDropdown.test.js.snap +3 -3
  23. package/src/components/Molecules/SchoolLookup/__snapshots__/SchoolLookup.test.js.snap +1 -1
  24. package/src/components/Molecules/SearchInput/SearchInput.test.js +1 -1
  25. package/src/components/Molecules/Typeahead/__snapshots__/Typeahead.test.js.snap +1 -1
  26. package/src/components/Organisms/Donate/__snapshots__/Donate.test.js.snap +4 -4
  27. package/src/components/Organisms/EmailSignUp/__snapshots__/EmailSignUp.test.js.snap +1 -1
  28. package/src/components/Organisms/Footer/Footer.js +1 -1
  29. package/src/components/Organisms/Footer/Footer.md +1 -1
  30. package/src/components/Organisms/Footer/{FundraisingRegulatorLogo.js → FundraisingRegulatorLogo/FundraisingRegulatorLogo.js} +1 -1
  31. package/src/components/Organisms/Membership/Membership.test.js +1 -1
@@ -128,6 +128,5 @@ const ItalicText = styled(Text).attrs({weight: 'normal'})`
128
128
  type="text"
129
129
  label="The label text can be made black rather than the default grey"
130
130
  id="input-example-8"
131
- labelProps={{ darkLabel: true }}
132
131
  />
133
132
  ```
@@ -33,7 +33,7 @@ it('renders correctly', () => {
33
33
  -webkit-flex-direction: column;
34
34
  -ms-flex-direction: column;
35
35
  flex-direction: column;
36
- color: #5C5C5E;
36
+ color: #000000;
37
37
  }
38
38
 
39
39
  .c2 {
@@ -161,7 +161,7 @@ it('renders with responsive max widths correctly', () => {
161
161
  -webkit-flex-direction: column;
162
162
  -ms-flex-direction: column;
163
163
  flex-direction: column;
164
- color: #5C5C5E;
164
+ color: #000000;
165
165
  }
166
166
 
167
167
  .c2 {
@@ -14,16 +14,12 @@ var _hideVisually = _interopRequireDefault(require("../../../theme/shared/hideVi
14
14
  const getLabelColor = _ref => {
15
15
  let {
16
16
  theme,
17
- errorMsg,
18
- darkLabel
17
+ errorMsg
19
18
  } = _ref;
20
19
  if (errorMsg) {
21
20
  return theme.color('red');
22
21
  }
23
- if (darkLabel) {
24
- return theme.color('black');
25
- }
26
- return theme.color('grey_label');
22
+ return theme.color('black');
27
23
  };
28
24
  const LabelElement = _styledComponents.default.label.withConfig({
29
25
  displayName: "Label__LabelElement",
@@ -71,7 +67,6 @@ const LabelText = _ref3 => {
71
67
  * @param children
72
68
  * @param label
73
69
  * @param hideLabel - Visually hide the label text (without removing it from the document)
74
- * @param darkLabel - Make the label text black rather than the default grey
75
70
  * @param rest
76
71
  * @returns {JSX.Element}
77
72
  * @constructor
@@ -81,15 +76,13 @@ const Label = _ref4 => {
81
76
  children = null,
82
77
  label,
83
78
  hideLabel = false,
84
- darkLabel = false,
85
79
  optional = null,
86
80
  errorMsg = '',
87
81
  ...rest
88
82
  } = _ref4;
89
83
  return /*#__PURE__*/_react.default.createElement(LabelElement, Object.assign({
90
84
  optional: optional,
91
- errorMsg: errorMsg,
92
- darkLabel: darkLabel
85
+ errorMsg: errorMsg
93
86
  }, rest), /*#__PURE__*/_react.default.createElement(LabelText, {
94
87
  label: label,
95
88
  hideLabel: hideLabel
@@ -97,7 +90,6 @@ const Label = _ref4 => {
97
90
  };
98
91
  LabelElement.propTypes = {
99
92
  optional: _propTypes.default.bool,
100
- errorMsg: _propTypes.default.string,
101
- darkLabel: _propTypes.default.bool
93
+ errorMsg: _propTypes.default.string
102
94
  };
103
95
  var _default = exports.default = Label;
@@ -19,7 +19,7 @@ exports[`renders correctly 1`] = `
19
19
  -webkit-flex-direction: column;
20
20
  -ms-flex-direction: column;
21
21
  flex-direction: column;
22
- color: #5C5C5E;
22
+ color: #000000;
23
23
  }
24
24
 
25
25
  .c2 {
@@ -33,7 +33,7 @@ it('renders correctly', () => {
33
33
  -webkit-flex-direction: column;
34
34
  -ms-flex-direction: column;
35
35
  flex-direction: column;
36
- color: #5C5C5E;
36
+ color: #000000;
37
37
  }
38
38
 
39
39
  .c2 {
@@ -19,7 +19,7 @@ exports[`renders correctly with no value and no options 1`] = `
19
19
  -webkit-flex-direction: column;
20
20
  -ms-flex-direction: column;
21
21
  flex-direction: column;
22
- color: #5C5C5E;
22
+ color: #000000;
23
23
  }
24
24
 
25
25
  .c3 {
@@ -149,7 +149,7 @@ exports[`renders correctly with value and no options 1`] = `
149
149
  -webkit-flex-direction: column;
150
150
  -ms-flex-direction: column;
151
151
  flex-direction: column;
152
- color: #5C5C5E;
152
+ color: #000000;
153
153
  }
154
154
 
155
155
  .c3 {
@@ -279,7 +279,7 @@ exports[`renders correctly with value and options 1`] = `
279
279
  -webkit-flex-direction: column;
280
280
  -ms-flex-direction: column;
281
281
  flex-direction: column;
282
- color: #5C5C5E;
282
+ color: #000000;
283
283
  }
284
284
 
285
285
  .c3 {
@@ -19,7 +19,7 @@ exports[`renders correctly 1`] = `
19
19
  -webkit-flex-direction: column;
20
20
  -ms-flex-direction: column;
21
21
  flex-direction: column;
22
- color: #5C5C5E;
22
+ color: #000000;
23
23
  }
24
24
 
25
25
  .c3 {
@@ -32,7 +32,7 @@ it('renders correctly', () => {
32
32
  -webkit-flex-direction: column;
33
33
  -ms-flex-direction: column;
34
34
  flex-direction: column;
35
- color: #5C5C5E;
35
+ color: #000000;
36
36
  }
37
37
 
38
38
  .c7 {
@@ -19,7 +19,7 @@ exports[`renders correctly 1`] = `
19
19
  -webkit-flex-direction: column;
20
20
  -ms-flex-direction: column;
21
21
  flex-direction: column;
22
- color: #5C5C5E;
22
+ color: #000000;
23
23
  }
24
24
 
25
25
  .c3 {
@@ -51,7 +51,7 @@ exports[`"Single Giving, No Money Buys, with overridden manual input value" rend
51
51
  -webkit-flex-direction: column;
52
52
  -ms-flex-direction: column;
53
53
  flex-direction: column;
54
- color: #5C5C5E;
54
+ color: #000000;
55
55
  }
56
56
 
57
57
  .c21 {
@@ -750,7 +750,7 @@ exports[`Monthly donation renders correctly 1`] = `
750
750
  -webkit-flex-direction: column;
751
751
  -ms-flex-direction: column;
752
752
  flex-direction: column;
753
- color: #5C5C5E;
753
+ color: #000000;
754
754
  }
755
755
 
756
756
  .c22 {
@@ -1416,7 +1416,7 @@ exports[`Single donation renders correctly 1`] = `
1416
1416
  -webkit-flex-direction: column;
1417
1417
  -ms-flex-direction: column;
1418
1418
  flex-direction: column;
1419
- color: #5C5C5E;
1419
+ color: #000000;
1420
1420
  }
1421
1421
 
1422
1422
  .c15 {
@@ -2168,7 +2168,7 @@ exports[`Single donation with no Money Buys renders correctly 1`] = `
2168
2168
  -webkit-flex-direction: column;
2169
2169
  -ms-flex-direction: column;
2170
2170
  flex-direction: column;
2171
- color: #5C5C5E;
2171
+ color: #000000;
2172
2172
  }
2173
2173
 
2174
2174
  .c15 {
@@ -71,7 +71,7 @@ exports[`renders correctly 1`] = `
71
71
  -webkit-flex-direction: column;
72
72
  -ms-flex-direction: column;
73
73
  flex-direction: column;
74
- color: #5C5C5E;
74
+ color: #000000;
75
75
  }
76
76
 
77
77
  .c10 {
@@ -10,7 +10,7 @@ var _Text = _interopRequireDefault(require("../../Atoms/Text/Text"));
10
10
  var _Logo = _interopRequireDefault(require("../../Atoms/Logo/Logo"));
11
11
  var _Nav = _interopRequireDefault(require("./Nav/Nav"));
12
12
  var _SocialIcons = _interopRequireDefault(require("../../Atoms/SocialIcons/SocialIcons"));
13
- var _FundraisingRegulatorLogo = _interopRequireDefault(require("./FundraisingRegulatorLogo"));
13
+ var _FundraisingRegulatorLogo = _interopRequireDefault(require("./FundraisingRegulatorLogo/FundraisingRegulatorLogo"));
14
14
  var _Footer = require("./Footer.style");
15
15
  const Footer = _ref => {
16
16
  let {
@@ -16,7 +16,7 @@ import footerCopy from './data/footerCopy';
16
16
  overrideallowList
17
17
  />
18
18
 
19
- <p>Adding a additionalLegalLine to the top of the footer, add FR logo</p>
19
+ <p>Adding an additionalLegalLine to the top of the footer, add FR logo</p>
20
20
  <Footer
21
21
  additionalLegalLine="CHICKEN RUN: DAWN OF THE NUGGET ™/ © Aardman. Netflix ™/© Netflix. Used with permission/Wallace & Gromit Ltd. All rights reserved/ Shaun the Sheep © & TM /Morph ©/TM Aardman Animations Ltd. All rights reserved."
22
22
  navItems={data}
@@ -7,10 +7,10 @@ Object.defineProperty(exports, "__esModule", {
7
7
  exports.default = void 0;
8
8
  var _react = _interopRequireDefault(require("react"));
9
9
  var _styledComponents = _interopRequireDefault(require("styled-components"));
10
- var _spacing = _interopRequireDefault(require("../../../theme/shared/spacing"));
10
+ var _spacing = _interopRequireDefault(require("../../../../theme/shared/spacing"));
11
11
  const FundraisingRegulatorWrapper = _styledComponents.default.div.withConfig({
12
12
  displayName: "FundraisingRegulatorLogo__FundraisingRegulatorWrapper",
13
- componentId: "sc-1uvaky7-0"
13
+ componentId: "sc-1ngdz4u-0"
14
14
  })(["width:75%;margin:", " 0;max-width:200px;img{display:block;}"], (0, _spacing.default)('lg'));
15
15
  const FundraisingRegulatorLogo = () => /*#__PURE__*/_react.default.createElement(FundraisingRegulatorWrapper, null, /*#__PURE__*/_react.default.createElement("a", {
16
16
  href: "https://www.fundraisingregulator.org.uk/validate?registrant=COMIC+RELIEF",
@@ -79,7 +79,7 @@ it('renders correctly', () => {
79
79
  -webkit-flex-direction: column;
80
80
  -ms-flex-direction: column;
81
81
  flex-direction: column;
82
- color: #5C5C5E;
82
+ color: #000000;
83
83
  }
84
84
 
85
85
  .c16 {
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.31.1",
4
+ "version": "8.32.0",
5
5
  "main": "dist/index.js",
6
6
  "license": "ISC",
7
7
  "jest": {
@@ -128,6 +128,5 @@ const ItalicText = styled(Text).attrs({weight: 'normal'})`
128
128
  type="text"
129
129
  label="The label text can be made black rather than the default grey"
130
130
  id="input-example-8"
131
- labelProps={{ darkLabel: true }}
132
131
  />
133
132
  ```
@@ -34,7 +34,7 @@ it('renders correctly', () => {
34
34
  -webkit-flex-direction: column;
35
35
  -ms-flex-direction: column;
36
36
  flex-direction: column;
37
- color: #5C5C5E;
37
+ color: #000000;
38
38
  }
39
39
 
40
40
  .c2 {
@@ -166,7 +166,7 @@ it('renders with responsive max widths correctly', () => {
166
166
  -webkit-flex-direction: column;
167
167
  -ms-flex-direction: column;
168
168
  flex-direction: column;
169
- color: #5C5C5E;
169
+ color: #000000;
170
170
  }
171
171
 
172
172
  .c2 {
@@ -6,14 +6,11 @@ import Text from '../Text/Text';
6
6
  import spacing from '../../../theme/shared/spacing';
7
7
  import hideVisually from '../../../theme/shared/hideVisually';
8
8
 
9
- const getLabelColor = ({ theme, errorMsg, darkLabel }) => {
9
+ const getLabelColor = ({ theme, errorMsg }) => {
10
10
  if (errorMsg) {
11
11
  return theme.color('red');
12
12
  }
13
- if (darkLabel) {
14
- return theme.color('black');
15
- }
16
- return theme.color('grey_label');
13
+ return theme.color('black');
17
14
  };
18
15
 
19
16
  const LabelElement = styled.label`
@@ -55,7 +52,6 @@ const LabelText = ({
55
52
  * @param children
56
53
  * @param label
57
54
  * @param hideLabel - Visually hide the label text (without removing it from the document)
58
- * @param darkLabel - Make the label text black rather than the default grey
59
55
  * @param rest
60
56
  * @returns {JSX.Element}
61
57
  * @constructor
@@ -64,7 +60,6 @@ const Label = ({
64
60
  children = null,
65
61
  label,
66
62
  hideLabel = false,
67
- darkLabel = false,
68
63
  optional = null,
69
64
  errorMsg = '',
70
65
  ...rest
@@ -72,7 +67,6 @@ const Label = ({
72
67
  <LabelElement
73
68
  optional={optional}
74
69
  errorMsg={errorMsg}
75
- darkLabel={darkLabel}
76
70
  {...rest}
77
71
  >
78
72
  <LabelText
@@ -91,14 +85,12 @@ Label.propTypes = {
91
85
  hideLabel: PropTypes.bool,
92
86
  children: PropTypes.node,
93
87
  optional: PropTypes.bool,
94
- errorMsg: PropTypes.string,
95
- darkLabel: PropTypes.bool
88
+ errorMsg: PropTypes.string
96
89
  };
97
90
 
98
91
  LabelElement.propTypes = {
99
92
  optional: PropTypes.bool,
100
- errorMsg: PropTypes.string,
101
- darkLabel: PropTypes.bool
93
+ errorMsg: PropTypes.string
102
94
  };
103
95
 
104
96
  LabelText.propTypes = {
@@ -19,7 +19,7 @@ exports[`renders correctly 1`] = `
19
19
  -webkit-flex-direction: column;
20
20
  -ms-flex-direction: column;
21
21
  flex-direction: column;
22
- color: #5C5C5E;
22
+ color: #000000;
23
23
  }
24
24
 
25
25
  .c2 {
@@ -34,7 +34,7 @@ it('renders correctly', () => {
34
34
  -webkit-flex-direction: column;
35
35
  -ms-flex-direction: column;
36
36
  flex-direction: column;
37
- color: #5C5C5E;
37
+ color: #000000;
38
38
  }
39
39
 
40
40
  .c2 {
@@ -19,7 +19,7 @@ exports[`renders correctly with no value and no options 1`] = `
19
19
  -webkit-flex-direction: column;
20
20
  -ms-flex-direction: column;
21
21
  flex-direction: column;
22
- color: #5C5C5E;
22
+ color: #000000;
23
23
  }
24
24
 
25
25
  .c3 {
@@ -149,7 +149,7 @@ exports[`renders correctly with value and no options 1`] = `
149
149
  -webkit-flex-direction: column;
150
150
  -ms-flex-direction: column;
151
151
  flex-direction: column;
152
- color: #5C5C5E;
152
+ color: #000000;
153
153
  }
154
154
 
155
155
  .c3 {
@@ -279,7 +279,7 @@ exports[`renders correctly with value and options 1`] = `
279
279
  -webkit-flex-direction: column;
280
280
  -ms-flex-direction: column;
281
281
  flex-direction: column;
282
- color: #5C5C5E;
282
+ color: #000000;
283
283
  }
284
284
 
285
285
  .c3 {
@@ -19,7 +19,7 @@ exports[`renders correctly 1`] = `
19
19
  -webkit-flex-direction: column;
20
20
  -ms-flex-direction: column;
21
21
  flex-direction: column;
22
- color: #5C5C5E;
22
+ color: #000000;
23
23
  }
24
24
 
25
25
  .c3 {
@@ -33,7 +33,7 @@ it('renders correctly', () => {
33
33
  -webkit-flex-direction: column;
34
34
  -ms-flex-direction: column;
35
35
  flex-direction: column;
36
- color: #5C5C5E;
36
+ color: #000000;
37
37
  }
38
38
 
39
39
  .c7 {
@@ -19,7 +19,7 @@ exports[`renders correctly 1`] = `
19
19
  -webkit-flex-direction: column;
20
20
  -ms-flex-direction: column;
21
21
  flex-direction: column;
22
- color: #5C5C5E;
22
+ color: #000000;
23
23
  }
24
24
 
25
25
  .c3 {
@@ -51,7 +51,7 @@ exports[`"Single Giving, No Money Buys, with overridden manual input value" rend
51
51
  -webkit-flex-direction: column;
52
52
  -ms-flex-direction: column;
53
53
  flex-direction: column;
54
- color: #5C5C5E;
54
+ color: #000000;
55
55
  }
56
56
 
57
57
  .c21 {
@@ -750,7 +750,7 @@ exports[`Monthly donation renders correctly 1`] = `
750
750
  -webkit-flex-direction: column;
751
751
  -ms-flex-direction: column;
752
752
  flex-direction: column;
753
- color: #5C5C5E;
753
+ color: #000000;
754
754
  }
755
755
 
756
756
  .c22 {
@@ -1416,7 +1416,7 @@ exports[`Single donation renders correctly 1`] = `
1416
1416
  -webkit-flex-direction: column;
1417
1417
  -ms-flex-direction: column;
1418
1418
  flex-direction: column;
1419
- color: #5C5C5E;
1419
+ color: #000000;
1420
1420
  }
1421
1421
 
1422
1422
  .c15 {
@@ -2168,7 +2168,7 @@ exports[`Single donation with no Money Buys renders correctly 1`] = `
2168
2168
  -webkit-flex-direction: column;
2169
2169
  -ms-flex-direction: column;
2170
2170
  flex-direction: column;
2171
- color: #5C5C5E;
2171
+ color: #000000;
2172
2172
  }
2173
2173
 
2174
2174
  .c15 {
@@ -71,7 +71,7 @@ exports[`renders correctly 1`] = `
71
71
  -webkit-flex-direction: column;
72
72
  -ms-flex-direction: column;
73
73
  flex-direction: column;
74
- color: #5C5C5E;
74
+ color: #000000;
75
75
  }
76
76
 
77
77
  .c10 {
@@ -4,7 +4,7 @@ import Text from '../../Atoms/Text/Text';
4
4
  import Logo from '../../Atoms/Logo/Logo';
5
5
  import FooterNav from './Nav/Nav';
6
6
  import SocialIcons from '../../Atoms/SocialIcons/SocialIcons';
7
- import FundraisingRegulatorLogo from './FundraisingRegulatorLogo';
7
+ import FundraisingRegulatorLogo from './FundraisingRegulatorLogo/FundraisingRegulatorLogo';
8
8
 
9
9
  import {
10
10
  FooterWrapper,
@@ -16,7 +16,7 @@ import footerCopy from './data/footerCopy';
16
16
  overrideallowList
17
17
  />
18
18
 
19
- <p>Adding a additionalLegalLine to the top of the footer, add FR logo</p>
19
+ <p>Adding an additionalLegalLine to the top of the footer, add FR logo</p>
20
20
  <Footer
21
21
  additionalLegalLine="CHICKEN RUN: DAWN OF THE NUGGET ™/ © Aardman. Netflix ™/© Netflix. Used with permission/Wallace & Gromit Ltd. All rights reserved/ Shaun the Sheep © & TM /Morph ©/TM Aardman Animations Ltd. All rights reserved."
22
22
  navItems={data}
@@ -1,6 +1,6 @@
1
1
  import React from 'react';
2
2
  import styled from 'styled-components';
3
- import spacing from '../../../theme/shared/spacing';
3
+ import spacing from '../../../../theme/shared/spacing';
4
4
 
5
5
  const FundraisingRegulatorWrapper = styled.div`
6
6
  // Overriding the baked-in styles for ease of update
@@ -81,7 +81,7 @@ it('renders correctly', () => {
81
81
  -webkit-flex-direction: column;
82
82
  -ms-flex-direction: column;
83
83
  flex-direction: column;
84
- color: #5C5C5E;
84
+ color: #000000;
85
85
  }
86
86
 
87
87
  .c16 {