@comicrelief/component-library 8.22.1 → 8.24.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 (9) hide show
  1. package/dist/components/Molecules/LogoLinked/LogoLinked.js +5 -4
  2. package/dist/components/Organisms/EmailSignUp/_EmailSignUp.js +2 -1
  3. package/dist/components/Organisms/Header/Header.js +2 -0
  4. package/dist/components/Organisms/Header/Header.md +1 -0
  5. package/package.json +1 -1
  6. package/src/components/Molecules/LogoLinked/LogoLinked.js +6 -5
  7. package/src/components/Organisms/EmailSignUp/_EmailSignUp.js +3 -1
  8. package/src/components/Organisms/Header/Header.js +4 -3
  9. package/src/components/Organisms/Header/Header.md +1 -0
package/dist/components/Molecules/LogoLinked/LogoLinked.js CHANGED
@@ -26,13 +26,14 @@ const LogoLinked = _ref2 => {
26
26
  let {
27
27
  campaign = 'Comic Relief',
28
28
  title = 'Go to Comic Relief homepage',
29
+ url = '/',
29
30
  animateRotate = false,
30
31
  sizeSm,
31
32
  sizeMd
32
33
  } = _ref2;
33
34
  if (campaign === 'Sport Relief Gameon') {
34
35
  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(LogoLink, {
35
- href: "/",
36
+ href: url,
36
37
  title: "Go to Comic Relief homepage",
37
38
  animateRotate: animateRotate
38
39
  }, /*#__PURE__*/_react.default.createElement(_Logo.default, {
@@ -54,7 +55,7 @@ const LogoLinked = _ref2 => {
54
55
  }
55
56
  if (campaign === 'Sport Relief') {
56
57
  return /*#__PURE__*/_react.default.createElement(LogoLink, {
57
- href: "/sportrelief",
58
+ href: url,
58
59
  title: "Go to Sport Relief homepage",
59
60
  animateRotate: animateRotate
60
61
  }, /*#__PURE__*/_react.default.createElement(_Logo.default, {
@@ -65,7 +66,7 @@ const LogoLinked = _ref2 => {
65
66
  }
66
67
  if (campaign === 'Pride') {
67
68
  return /*#__PURE__*/_react.default.createElement(LogoLink, {
68
- href: "/",
69
+ href: url,
69
70
  title: "Go to Comic Relief homepage",
70
71
  animateRotate: animateRotate
71
72
  }, /*#__PURE__*/_react.default.createElement(_Logo.default, {
@@ -77,7 +78,7 @@ const LogoLinked = _ref2 => {
77
78
  }), /*#__PURE__*/_react.default.createElement(TitleLabel, null, "Go to Comic Relief homepage"));
78
79
  }
79
80
  return /*#__PURE__*/_react.default.createElement(LogoLink, {
80
- href: "/",
81
+ href: url,
81
82
  title: title,
82
83
  animateRotate: animateRotate
83
84
  }, /*#__PURE__*/_react.default.createElement(_Logo.default, {
package/dist/components/Organisms/EmailSignUp/_EmailSignUp.js CHANGED
@@ -32,6 +32,7 @@ const EmailSignUp = _ref => {
32
32
  privacyCopy,
33
33
  backgroundColour = 'deep_violet_dark',
34
34
  buttonColour = 'red',
35
+ buttonText = 'Subscribe',
35
36
  formContext,
36
37
  columnLayout = false,
37
38
  ...rest
@@ -86,6 +87,6 @@ const EmailSignUp = _ref => {
86
87
  loading: isSubmitting,
87
88
  loadingText: "Submitting...",
88
89
  "data-test": "subscribe-button"
89
- }, /*#__PURE__*/_react.default.createElement(_Text.default, null, "Subscribe")))), isSubmitted && !isSubmitSuccessful && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, errors.formError !== undefined && /*#__PURE__*/_react.default.createElement(_ErrorText.default, null, errors.formError.message)), /*#__PURE__*/_react.default.createElement(_EmailSignUp.PrivacyCopyWrapper, null, /*#__PURE__*/_react.default.createElement(_Text.default, null, privacyCopy)));
90
+ }, /*#__PURE__*/_react.default.createElement(_Text.default, null, buttonText)))), isSubmitted && !isSubmitSuccessful && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, errors.formError !== undefined && /*#__PURE__*/_react.default.createElement(_ErrorText.default, null, errors.formError.message)), /*#__PURE__*/_react.default.createElement(_EmailSignUp.PrivacyCopyWrapper, null, /*#__PURE__*/_react.default.createElement(_Text.default, null, privacyCopy)));
90
91
  };
91
92
  exports.EmailSignUp = EmailSignUp;
package/dist/components/Organisms/Header/Header.js CHANGED
@@ -14,11 +14,13 @@ const Header = _ref => {
14
14
  navItems = {},
15
15
  metaIcons,
16
16
  campaign = 'Comic Relief',
17
+ logoUrl = '/',
17
18
  ...rest
18
19
  } = _ref;
19
20
  return /*#__PURE__*/_react.default.createElement(_Header.HeaderWrapper, Object.assign({
20
21
  navItems: true
21
22
  }, rest), /*#__PURE__*/_react.default.createElement(_Header.InnerWrapper, null, /*#__PURE__*/_react.default.createElement(_Header.Brand, null, /*#__PURE__*/_react.default.createElement(_LogoLinked.default, {
23
+ url: logoUrl,
22
24
  campaign: campaign
23
25
  })), /*#__PURE__*/_react.default.createElement(_Nav.default, {
24
26
  navItems: navItems
package/dist/components/Organisms/Header/Header.md CHANGED
@@ -26,6 +26,7 @@ import Link from '../../Atoms/Link/Link';
26
26
  <Header
27
27
  navItems={data}
28
28
  campaign="Sport Relief"
29
+ logoUrl="/sportrelief"
29
30
  metaIcons={
30
31
  <>
31
32
  <Link color="green" type="button" href="/donation">
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.22.1",
4
+ "version": "8.24.0",
5
5
  "main": "dist/index.js",
6
6
  "license": "ISC",
7
7
  "jest": {
package/src/components/Molecules/LogoLinked/LogoLinked.js CHANGED
@@ -26,12 +26,12 @@ const LogoLink = styled.a`
26
26
  `;
27
27
 
28
28
  const LogoLinked = ({
29
- campaign = 'Comic Relief', title = 'Go to Comic Relief homepage', animateRotate = false, sizeSm, sizeMd
29
+ campaign = 'Comic Relief', title = 'Go to Comic Relief homepage', url = '/', animateRotate = false, sizeSm, sizeMd
30
30
  }) => {
31
31
  if (campaign === 'Sport Relief Gameon') {
32
32
  return (
33
33
  <>
34
- <LogoLink href="/" title="Go to Comic Relief homepage" animateRotate={animateRotate}>
34
+ <LogoLink href={url} title="Go to Comic Relief homepage" animateRotate={animateRotate}>
35
35
  <Logo rotate sizeSm="50px" sizeMd="60px" campaign="Comic Relief" title="Go to Comic Relief homepage" />
36
36
  <TitleLabel>Go to Comic Relief homepage</TitleLabel>
37
37
  </LogoLink>
@@ -45,7 +45,7 @@ const LogoLinked = ({
45
45
 
46
46
  if (campaign === 'Sport Relief') {
47
47
  return (
48
- <LogoLink href="/sportrelief" title="Go to Sport Relief homepage" animateRotate={animateRotate}>
48
+ <LogoLink href={url} title="Go to Sport Relief homepage" animateRotate={animateRotate}>
49
49
  <Logo rotate={false} campaign="Sport Relief" title="Sport Relief in homepage" />
50
50
  <TitleLabel>Go to Sport Relief homepage</TitleLabel>
51
51
  </LogoLink>
@@ -54,7 +54,7 @@ const LogoLinked = ({
54
54
 
55
55
  if (campaign === 'Pride') {
56
56
  return (
57
- <LogoLink href="/" title="Go to Comic Relief homepage" animateRotate={animateRotate}>
57
+ <LogoLink href={url} title="Go to Comic Relief homepage" animateRotate={animateRotate}>
58
58
  <Logo rotate={false} campaign="Pride" title="Go to Comic Relief homepage" sizeSm={sizeSm} sizeMd={sizeMd} />
59
59
  <TitleLabel>Go to Comic Relief homepage</TitleLabel>
60
60
  </LogoLink>
@@ -62,7 +62,7 @@ const LogoLinked = ({
62
62
  }
63
63
 
64
64
  return (
65
- <LogoLink href="/" title={title} animateRotate={animateRotate}>
65
+ <LogoLink href={url} title={title} animateRotate={animateRotate}>
66
66
  <Logo rotate={false} campaign="Comic Relief" title={title} sizeSm={sizeSm} sizeMd={sizeMd} />
67
67
  <TitleLabel>{title}</TitleLabel>
68
68
  </LogoLink>
@@ -73,6 +73,7 @@ LogoLinked.propTypes = {
73
73
  campaign: PropTypes.string,
74
74
  animateRotate: PropTypes.bool,
75
75
  title: PropTypes.string,
76
+ url: PropTypes.string,
76
77
  sizeSm: PropTypes.string,
77
78
  sizeMd: PropTypes.string
78
79
  };
package/src/components/Organisms/EmailSignUp/_EmailSignUp.js CHANGED
@@ -24,6 +24,7 @@ const EmailSignUp = ({
24
24
  privacyCopy,
25
25
  backgroundColour = 'deep_violet_dark',
26
26
  buttonColour = 'red',
27
+ buttonText = 'Subscribe',
27
28
  formContext,
28
29
  columnLayout = false,
29
30
  ...rest
@@ -93,7 +94,7 @@ const EmailSignUp = ({
93
94
  loadingText="Submitting..."
94
95
  data-test="subscribe-button"
95
96
  >
96
- <Text>Subscribe</Text>
97
+ <Text>{buttonText}</Text>
97
98
  </ButtonWithStates>
98
99
  </ButtonWrapper>
99
100
  </FormInner>
@@ -122,6 +123,7 @@ EmailSignUp.propTypes = {
122
123
  privacyCopy: PropTypes.node.isRequired,
123
124
  backgroundColour: PropTypes.string,
124
125
  buttonColour: PropTypes.string,
126
+ buttonText: PropTypes.string,
125
127
  formContext: PropTypes.shape().isRequired,
126
128
  columnLayout: PropTypes.bool
127
129
  };
package/src/components/Organisms/Header/Header.js CHANGED
@@ -8,12 +8,12 @@ import {
8
8
  } from './Header.style';
9
9
 
10
10
  const Header = ({
11
- navItems = {}, metaIcons, campaign = 'Comic Relief', ...rest
11
+ navItems = {}, metaIcons, campaign = 'Comic Relief', logoUrl = '/', ...rest
12
12
  }) => (
13
13
  <HeaderWrapper navItems {...rest}>
14
14
  <InnerWrapper>
15
15
  <Brand>
16
- <LogoLinked campaign={campaign} />
16
+ <LogoLinked url={logoUrl} campaign={campaign} />
17
17
  </Brand>
18
18
  <MainNav navItems={navItems} />
19
19
  <MetaIcons>{metaIcons}</MetaIcons>
@@ -26,7 +26,8 @@ Header.propTypes = {
26
26
  navItems: PropTypes.objectOf(PropTypes.shape),
27
27
  /** it can be icons, buttons */
28
28
  metaIcons: PropTypes.node.isRequired,
29
- campaign: PropTypes.string
29
+ campaign: PropTypes.string,
30
+ logoUrl: PropTypes.string
30
31
  };
31
32
 
32
33
  export default Header;
package/src/components/Organisms/Header/Header.md CHANGED
@@ -26,6 +26,7 @@ import Link from '../../Atoms/Link/Link';
26
26
  <Header
27
27
  navItems={data}
28
28
  campaign="Sport Relief"
29
+ logoUrl="/sportrelief"
29
30
  metaIcons={
30
31
  <>
31
32
  <Link color="green" type="button" href="/donation">