diff --git a/docs/src/js/blocks/HeadlineBlockExample.js b/docs/src/js/blocks/HeadlineBlockExample.js
index 4f0bd8df94..f76073fdc6 100644
--- a/docs/src/js/blocks/HeadlineBlockExample.js
+++ b/docs/src/js/blocks/HeadlineBlockExample.js
@@ -1,5 +1,5 @@
import React from 'react';
-import { HeadlineBlock } from 'telus-thorium-enriched/blocks';
+import { Headline } from 'telus-thorium-enriched/blocks';
const HeadlineBlockExample = () => {
const props = {
@@ -8,7 +8,7 @@ const HeadlineBlockExample = () => {
};
return (
-
+
);
};
diff --git a/docs/src/js/blocks/OverviewBlockExample.js b/docs/src/js/blocks/OverviewBlockExample.js
index ab2c49bb21..58dc1366b5 100644
--- a/docs/src/js/blocks/OverviewBlockExample.js
+++ b/docs/src/js/blocks/OverviewBlockExample.js
@@ -1,5 +1,5 @@
import React from 'react';
-import { OverviewBlock } from 'telus-thorium-enriched/blocks';
+import { Overview } from 'telus-thorium-enriched/blocks';
const OverviewBlockExample = () => {
const props = {
@@ -18,7 +18,7 @@ const OverviewBlockExample = () => {
};
return (
-
+
);
};
diff --git a/docs/src/js/blocks/TitledTextBlockExample.js b/docs/src/js/blocks/TitledTextBlockExample.js
index 5899cd9ffd..5275b34ee8 100644
--- a/docs/src/js/blocks/TitledTextBlockExample.js
+++ b/docs/src/js/blocks/TitledTextBlockExample.js
@@ -1,5 +1,5 @@
import React from 'react';
-import { TitledTextBlock } from 'telus-thorium-enriched/blocks';
+import { TitledText } from 'telus-thorium-enriched/blocks';
const TitledTextBlockExample = () => {
const props = {
@@ -17,7 +17,7 @@ const TitledTextBlockExample = () => {
};
return (
-
+
);
};
diff --git a/docs/src/js/blocks/VideoBlockExample.js b/docs/src/js/blocks/VideoBlockExample.js
index 842dd68c9c..767c387271 100644
--- a/docs/src/js/blocks/VideoBlockExample.js
+++ b/docs/src/js/blocks/VideoBlockExample.js
@@ -1,5 +1,5 @@
import React from 'react';
-import { VideoBlock } from 'telus-thorium-enriched/blocks';
+import { Video } from 'telus-thorium-enriched/blocks';
const VideoBlockExample = () => {
const props = {
@@ -9,7 +9,7 @@ const VideoBlockExample = () => {
};
return (
-
+
);
};
diff --git a/enriched/package.json b/enriched/package.json
index 2d8cab4cf9..7b1b0092f8 100644
--- a/enriched/package.json
+++ b/enriched/package.json
@@ -16,7 +16,8 @@
"build": "npm run clean && npm run build:lib && npm run build:umd && npm run build:umd:min",
"test": "jest",
"test:watch": "npm run test -- --watch",
- "rollup": "rollup -c"
+ "test:u": "npm run test -- -u",
+ "rollup": "rollup -c && cp ./src/blocks/Headline/wave_header_default.png ./dist/"
},
"dependencies": {
"@telusdigital/redux-contentful": "^2.2.1",
diff --git a/enriched/rollup.config.js b/enriched/rollup.config.js
index 73a3ca81d6..c8dfe38100 100644
--- a/enriched/rollup.config.js
+++ b/enriched/rollup.config.js
@@ -13,7 +13,8 @@ export default {
],
sourceMap: true,
- external: ['react', 'prop-types'],
+ external: ['react', 'prop-types', '@telusdigital/redux-contentful'],
+
plugins: [
resolve({
extensions: ['.js', '.jsx']
diff --git a/enriched/src/blocks/HeadlineBlock/index.jsx b/enriched/src/blocks/Headline/Headline.jsx
similarity index 76%
rename from enriched/src/blocks/HeadlineBlock/index.jsx
rename to enriched/src/blocks/Headline/Headline.jsx
index 0fde42695a..86e3cb9990 100644
--- a/enriched/src/blocks/HeadlineBlock/index.jsx
+++ b/enriched/src/blocks/Headline/Headline.jsx
@@ -1,11 +1,9 @@
import React from 'react';
import PropTypes from 'prop-types';
-if (process.env.BROWSER) {
- require('./headline.scss');
-}
+import './Headline.scss';
-const HeadlineBlock = (props) => {
+const Headline = (props) => {
const { eyebrow, title } = props;
return (
@@ -22,13 +20,13 @@ const HeadlineBlock = (props) => {
);
};
-HeadlineBlock.propTypes = {
+Headline.propTypes = {
title: PropTypes.string.isRequired,
eyebrow: PropTypes.string
};
-HeadlineBlock.defaultProps = {
+Headline.defaultProps = {
eyebrow: ''
};
-export default HeadlineBlock;
+export default Headline;
diff --git a/enriched/src/blocks/HeadlineBlock/headline.scss b/enriched/src/blocks/Headline/Headline.scss
similarity index 83%
rename from enriched/src/blocks/HeadlineBlock/headline.scss
rename to enriched/src/blocks/Headline/Headline.scss
index 85708e3373..1ebd347207 100644
--- a/enriched/src/blocks/HeadlineBlock/headline.scss
+++ b/enriched/src/blocks/Headline/Headline.scss
@@ -1,4 +1,4 @@
-@import '~telus-thorium-core/scss/settings/variables';
+@import '../../../../core/scss/settings/variables';
.headline-block__bg {
background-image: url('./wave_header_default.png');
diff --git a/enriched/src/blocks/HeadlineBlock/__tests__/headline.spec.jsx b/enriched/src/blocks/Headline/__tests__/Headline.spec.jsx
similarity index 96%
rename from enriched/src/blocks/HeadlineBlock/__tests__/headline.spec.jsx
rename to enriched/src/blocks/Headline/__tests__/Headline.spec.jsx
index fa9892cd42..1063dd1de1 100644
--- a/enriched/src/blocks/HeadlineBlock/__tests__/headline.spec.jsx
+++ b/enriched/src/blocks/Headline/__tests__/Headline.spec.jsx
@@ -1,7 +1,7 @@
import React from 'react';
import { mount } from 'enzyme';
import { mountToJson } from 'enzyme-to-json';
-import Headline from '../';
+import Headline from '../Headline';
describe('Headline', () => {
const data = { eyebrow: 'Foo', title: 'Bar' };
diff --git a/enriched/src/blocks/HeadlineBlock/__tests__/__snapshots__/headline.spec.jsx.snap b/enriched/src/blocks/Headline/__tests__/__snapshots__/headline.spec.jsx.snap
similarity index 95%
rename from enriched/src/blocks/HeadlineBlock/__tests__/__snapshots__/headline.spec.jsx.snap
rename to enriched/src/blocks/Headline/__tests__/__snapshots__/headline.spec.jsx.snap
index 9312591bf8..94ea83b9c1 100644
--- a/enriched/src/blocks/HeadlineBlock/__tests__/__snapshots__/headline.spec.jsx.snap
+++ b/enriched/src/blocks/Headline/__tests__/__snapshots__/headline.spec.jsx.snap
@@ -1,7 +1,7 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Headline matches snapshot 1`] = `
-
@@ -31,5 +31,5 @@ exports[`Headline matches snapshot 1`] = `
-
+
`;
diff --git a/enriched/src/blocks/HeadlineBlock/wave_header_default.png b/enriched/src/blocks/Headline/wave_header_default.png
similarity index 100%
rename from enriched/src/blocks/HeadlineBlock/wave_header_default.png
rename to enriched/src/blocks/Headline/wave_header_default.png
diff --git a/enriched/src/blocks/OverviewBlock/index.jsx b/enriched/src/blocks/Overview/Overview.jsx
similarity index 90%
rename from enriched/src/blocks/OverviewBlock/index.jsx
rename to enriched/src/blocks/Overview/Overview.jsx
index 5cf7a2fd28..5c6736a26f 100644
--- a/enriched/src/blocks/OverviewBlock/index.jsx
+++ b/enriched/src/blocks/Overview/Overview.jsx
@@ -4,7 +4,7 @@ import cx from 'classnames';
import CheckList from '../components/CheckList';
import TextTitleBodyButton from '../components/TextTitleBodyButton';
-const OverviewBlock = (props) => {
+const Overview = (props) => {
const { className, ctaLink, overviewTitle, overviewDescription, sideContent } = props;
const cls = cx(className);
const bodyContent = {
@@ -26,7 +26,7 @@ const OverviewBlock = (props) => {
);
};
-OverviewBlock.propTypes = {
+Overview.propTypes = {
className: PropTypes.string,
overviewTitle: PropTypes.string,
overviewDescription: PropTypes.string,
@@ -34,7 +34,7 @@ OverviewBlock.propTypes = {
sideContent: PropTypes.object
};
-OverviewBlock.defaultProps = {
+Overview.defaultProps = {
className: '',
overviewTitle: '',
overviewDescription: '',
@@ -49,4 +49,4 @@ OverviewBlock.defaultProps = {
}
};
-export default OverviewBlock;
+export default Overview;
diff --git a/enriched/src/blocks/Overview/__tests__/Overview.spec.jsx b/enriched/src/blocks/Overview/__tests__/Overview.spec.jsx
new file mode 100644
index 0000000000..96e6a82174
--- /dev/null
+++ b/enriched/src/blocks/Overview/__tests__/Overview.spec.jsx
@@ -0,0 +1,38 @@
+import React from 'react';
+import { shallow } from 'enzyme';
+import Overview from '../Overview';
+
+describe('', () => {
+ const props = {
+ className: 'class',
+ overviewTitle: 'title',
+ overviewDescription: 'description',
+ ctaLink: {
+ target: 'target',
+ href: 'href',
+ text: 'text'
+ },
+ sideContent: {
+ listTitle: 'title',
+ listItems: ['one', 'two']
+ }
+ };
+
+ const overview = shallow();
+
+ it('sets the classes from the className prop', () => {
+ expect(overview.hasClass('class')).toBeTruthy();
+ });
+
+ it('renders a textTitleBodyButton Component', () => {
+ expect(overview.find('TextTitleBodyButton')).toBeDefined();
+ expect(overview.find('TextTitleBodyButton').props().caption).toBe('title');
+ expect(overview.find('TextTitleBodyButton').props().description).toEqual('description');
+ });
+
+ it('renders a checklist Component', () => {
+ expect(overview.find('CheckList')).toBeDefined();
+ expect(overview.find('CheckList').props().listTitle).toBe('title');
+ expect(overview.find('CheckList').props().listItems).toEqual(['one', 'two']);
+ });
+});
diff --git a/enriched/src/blocks/OverviewBlock/__tests__/OverviewBlock.spec.jsx b/enriched/src/blocks/OverviewBlock/__tests__/OverviewBlock.spec.jsx
deleted file mode 100644
index fccf5ee463..0000000000
--- a/enriched/src/blocks/OverviewBlock/__tests__/OverviewBlock.spec.jsx
+++ /dev/null
@@ -1,38 +0,0 @@
-import React from 'react';
-import { shallow } from 'enzyme';
-import OverviewBlock from '../';
-
-describe('', () => {
- const props = {
- className: 'class',
- overviewTitle: 'title',
- overviewDescription: 'description',
- ctaLink: {
- target: 'target',
- href: 'href',
- text: 'text'
- },
- sideContent: {
- listTitle: 'title',
- listItems: ['one', 'two']
- }
- };
-
- const overviewBlock = shallow();
-
- it('sets the classes from the className prop', () => {
- expect(overviewBlock.hasClass('class')).toBeTruthy();
- });
-
- it('renders a textTitleBodyButton Component', () => {
- expect(overviewBlock.find('TextTitleBodyButton')).toBeDefined();
- expect(overviewBlock.find('TextTitleBodyButton').props().caption).toBe('title');
- expect(overviewBlock.find('TextTitleBodyButton').props().description).toEqual('description');
- });
-
- it('renders a checklist Component', () => {
- expect(overviewBlock.find('CheckList')).toBeDefined();
- expect(overviewBlock.find('CheckList').props().listTitle).toBe('title');
- expect(overviewBlock.find('CheckList').props().listItems).toEqual(['one', 'two']);
- });
-});
diff --git a/enriched/src/blocks/TitledTextBlock/index.jsx b/enriched/src/blocks/TitledText/TitledText.jsx
similarity index 83%
rename from enriched/src/blocks/TitledTextBlock/index.jsx
rename to enriched/src/blocks/TitledText/TitledText.jsx
index 984b336047..cbcf1e5bd7 100644
--- a/enriched/src/blocks/TitledTextBlock/index.jsx
+++ b/enriched/src/blocks/TitledText/TitledText.jsx
@@ -1,11 +1,9 @@
import React, { Component } from 'react';
import PropTypes from 'prop-types';
-if (process.env.BROWSER) {
- require('./titledTextBlock.scss');
-}
+import './TitledText.scss';
-class TitledTextBlock extends Component {
+class TitledText extends Component {
render() {
const { title, content, titleHeadingClass } = this.props;
@@ -32,7 +30,7 @@ class TitledTextBlock extends Component {
}
}
-TitledTextBlock.propTypes = {
+TitledText.propTypes = {
title: PropTypes.string.isRequired,
content: PropTypes.arrayOf(PropTypes.shape({
title: PropTypes.string.isRequired,
@@ -41,8 +39,8 @@ TitledTextBlock.propTypes = {
titleHeadingClass: PropTypes.string
};
-TitledTextBlock.defaultProps = {
+TitledText.defaultProps = {
titleHeadingClass: 'heading-1'
};
-export default TitledTextBlock;
+export default TitledText;
diff --git a/enriched/src/blocks/TitledTextBlock/titledTextBlock.scss b/enriched/src/blocks/TitledText/TitledText.scss
similarity index 100%
rename from enriched/src/blocks/TitledTextBlock/titledTextBlock.scss
rename to enriched/src/blocks/TitledText/TitledText.scss
diff --git a/enriched/src/blocks/TitledTextBlock/__tests__/titledTextBlock.spec.jsx b/enriched/src/blocks/TitledText/__tests__/TitledText.spec.jsx
similarity index 73%
rename from enriched/src/blocks/TitledTextBlock/__tests__/titledTextBlock.spec.jsx
rename to enriched/src/blocks/TitledText/__tests__/TitledText.spec.jsx
index 77000c01a7..3fbbcc723f 100644
--- a/enriched/src/blocks/TitledTextBlock/__tests__/titledTextBlock.spec.jsx
+++ b/enriched/src/blocks/TitledText/__tests__/TitledText.spec.jsx
@@ -1,9 +1,9 @@
import React from 'react';
import { mount } from 'enzyme';
import { mountToJson } from 'enzyme-to-json';
-import TitledTextBlock from '../';
+import TitledText from '../TitledText';
-describe('TextBlock Component', () => {
+describe('TitledText', () => {
const data = {
title: 'Title1',
content: [
@@ -12,26 +12,26 @@ describe('TextBlock Component', () => {
};
it('matches snapshot', () => {
- const wrapper = mount();
+ const wrapper = mount();
expect(mountToJson(wrapper)).toMatchSnapshot();
});
it('should render title with default class', () => {
- const wrapper = mount();
+ const wrapper = mount();
const elem = wrapper.find('h1').first();
expect(elem.text()).toEqual('Title1');
expect(elem.hasClass('heading-1')).toBeTruthy();
});
it('should render title with specified class', () => {
- const wrapper = mount();
+ const wrapper = mount();
const elem = wrapper.find('h1').first();
expect(elem.text()).toEqual('Title1');
expect(elem.hasClass('heading-2')).toBeTruthy();
});
it('should render content', () => {
- const wrapper = mount();
+ const wrapper = mount();
expect(wrapper.find('h2').first().text()).toEqual('Small Title 1');
expect(wrapper.find('p').first().text()).toEqual('Small Text1');
});
diff --git a/enriched/src/blocks/TitledTextBlock/__tests__/__snapshots__/titledTextBlock.spec.jsx.snap b/enriched/src/blocks/TitledText/__tests__/__snapshots__/TitledText.spec.jsx.snap
similarity index 90%
rename from enriched/src/blocks/TitledTextBlock/__tests__/__snapshots__/titledTextBlock.spec.jsx.snap
rename to enriched/src/blocks/TitledText/__tests__/__snapshots__/TitledText.spec.jsx.snap
index 2c2cc63533..0b710160c3 100644
--- a/enriched/src/blocks/TitledTextBlock/__tests__/__snapshots__/titledTextBlock.spec.jsx.snap
+++ b/enriched/src/blocks/TitledText/__tests__/__snapshots__/TitledText.spec.jsx.snap
@@ -1,7 +1,7 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
-exports[`TextBlock Component matches snapshot 1`] = `
-
-
+
`;
diff --git a/enriched/src/blocks/VideoBlock/index.jsx b/enriched/src/blocks/Video/Video.jsx
similarity index 82%
rename from enriched/src/blocks/VideoBlock/index.jsx
rename to enriched/src/blocks/Video/Video.jsx
index 523fd24ef6..759c89b991 100644
--- a/enriched/src/blocks/VideoBlock/index.jsx
+++ b/enriched/src/blocks/Video/Video.jsx
@@ -1,11 +1,9 @@
import React from 'react';
import PropTypes from 'prop-types';
-if (process.env.BROWSER) {
- require('./video-block.scss');
-}
+import './Video.scss';
-const VideoBlock = (props) => {
+const Video = (props) => {
const { caption, subtext, videoUrl } = props;
return (
@@ -27,16 +25,16 @@ const VideoBlock = (props) => {
);
};
-VideoBlock.propTypes = {
+Video.propTypes = {
caption: PropTypes.string,
subtext: PropTypes.string,
videoUrl: PropTypes.string
};
-VideoBlock.defaultProps = {
+Video.defaultProps = {
subtext: '',
caption: '',
videoUrl: ''
};
-export default VideoBlock;
+export default Video;
diff --git a/enriched/src/blocks/VideoBlock/video-block.scss b/enriched/src/blocks/Video/Video.scss
similarity index 100%
rename from enriched/src/blocks/VideoBlock/video-block.scss
rename to enriched/src/blocks/Video/Video.scss
diff --git a/enriched/src/blocks/VideoBlock/__tests__/videoBlock.spec.jsx b/enriched/src/blocks/Video/__tests__/Video.spec.jsx
similarity index 71%
rename from enriched/src/blocks/VideoBlock/__tests__/videoBlock.spec.jsx
rename to enriched/src/blocks/Video/__tests__/Video.spec.jsx
index 674281b780..c83c8e0166 100644
--- a/enriched/src/blocks/VideoBlock/__tests__/videoBlock.spec.jsx
+++ b/enriched/src/blocks/Video/__tests__/Video.spec.jsx
@@ -1,34 +1,34 @@
import React from 'react';
import { mount } from 'enzyme';
import { mountToJson } from 'enzyme-to-json';
-import VideoBlock from '../';
+import Video from '../Video';
-describe('VideoBlock', () => {
+describe('Video', () => {
const data = { caption: 'Foo', subtext: 'Bar', videoUrl: 'https://www.youtube.com/embed/MaCZN2N6Q_I?cc_load_policy=1' };
it('matches snapshot', () => {
- const wrapper = mount();
+ const wrapper = mount();
expect(mountToJson(wrapper)).toMatchSnapshot();
});
it('should render caption', () => {
- const wrapper = mount();
+ const wrapper = mount();
expect(wrapper.find('strong')).toBeDefined();
expect(wrapper.find('strong').text()).toBe('Foo: ');
});
it('should render subtext', () => {
- const wrapper = mount();
+ const wrapper = mount();
expect(wrapper.find('p').first().text()).toContain('Bar');
});
it('should render without title or subtext', () => {
- const wrapper = mount();
+ const wrapper = mount();
expect(wrapper.find('.text--medium').exists()).toEqual(false);
});
it('should render an iframe with video', () => {
- const wrapper = mount();
+ const wrapper = mount();
expect(wrapper.find('iframe').first().prop('src')).toEqual('https://www.youtube.com/embed/MaCZN2N6Q_I?cc_load_policy=1');
});
});
diff --git a/enriched/src/blocks/VideoBlock/__tests__/__snapshots__/videoBlock.spec.jsx.snap b/enriched/src/blocks/Video/__tests__/__snapshots__/Video.spec.jsx.snap
similarity index 92%
rename from enriched/src/blocks/VideoBlock/__tests__/__snapshots__/videoBlock.spec.jsx.snap
rename to enriched/src/blocks/Video/__tests__/__snapshots__/Video.spec.jsx.snap
index ec3b7e18d6..e43918b2c0 100644
--- a/enriched/src/blocks/VideoBlock/__tests__/__snapshots__/videoBlock.spec.jsx.snap
+++ b/enriched/src/blocks/Video/__tests__/__snapshots__/Video.spec.jsx.snap
@@ -1,7 +1,7 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
-exports[`VideoBlock matches snapshot 1`] = `
-
-
+
`;
diff --git a/enriched/src/blocks/index.js b/enriched/src/blocks/index.js
index 4a38abfddc..f1835708b4 100644
--- a/enriched/src/blocks/index.js
+++ b/enriched/src/blocks/index.js
@@ -1,11 +1,11 @@
-import HeadlineBlock from './HeadlineBlock';
-import OverviewBlock from './OverviewBlock';
-import TitledTextBlock from './TitledTextBlock';
-import VideoBlock from './VideoBlock';
+import Headline from './Headline/Headline';
+import Overview from './Overview/Overview';
+import TitledText from './TitledText/TitledText';
+import Video from './Video/Video';
export {
- HeadlineBlock,
- OverviewBlock,
- TitledTextBlock,
- VideoBlock
+ Headline,
+ Overview,
+ TitledText,
+ Video
};
diff --git a/enriched/src/rollup-main.js b/enriched/src/rollup-main.js
index 83b7cdd39e..d339ef9442 100644
--- a/enriched/src/rollup-main.js
+++ b/enriched/src/rollup-main.js
@@ -6,3 +6,8 @@ export { default as Notification } from './components/Notification/Notification'
export { default as SelectorCounter } from './components/SelectorCounter/SelectorCounter';
export { default as Spinner } from './components/Spinner/Spinner';
export { default as Steps } from './components/Steps/Steps';
+
+export { default as Headline } from './blocks/Headline/Headline';
+export { default as Overview } from './blocks/Overview/Overview';
+export { default as TitledText } from './blocks/TitledText/TitledText';
+export { default as Video } from './blocks/Video/Video';