@times-components/ts-components 1.25.0 → 1.25.1

package/CHANGELOG.md

@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [1.25.1](https://github.com/newsuk/times-components/compare/@times-components/ts-components@1.25.0...@times-components/ts-components@1.25.1) (2022-03-16)
+
+**Note:** Version bump only for package @times-components/ts-components
+
+
+
+
+
 # [1.25.0](https://github.com/newsuk/times-components/compare/@times-components/ts-components@1.24.0...@times-components/ts-components@1.25.0) (2022-03-16)
 
 

package/dist/components/common-styles.d.ts

@@ -3,3 +3,16 @@ export declare const Label: import("styled-components").StyledComponent<"div", a
     sectionColour: string;
 }, never>;
 export declare const HiddenDiv: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const Copy: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const List: import("styled-components").StyledComponent<"ul", any, {}, never>;
+export declare const ListContainer: import("styled-components").StyledComponent<"div", any, {
+    showAll: boolean;
+    maxHeight: number;
+    displayShowAll: boolean;
+}, never>;
+export declare const ShowAllContainer: import("styled-components").StyledComponent<"div", any, {
+    showAll: boolean;
+    displayShowAll: boolean;
+}, never>;
+export declare const Headline: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const ShowAllButton: import("styled-components").StyledComponent<"button", any, {}, never>;

package/dist/components/common-styles.js

@@ -1,5 +1,5 @@
 import styled from 'styled-components';
-import { breakpoints, fonts } from '@times-components/styleguide';
+import { breakpoints, fonts, colours } from '@times-components/styleguide';
 export const PlaceholderContainer = styled.div `
   position: relative;
   height: 200px;
@@ -19,18 +19,62 @@ export const Label = styled.div `
   line-height: 16px;
   text-transform: uppercase;
   color: ${({ sectionColour }) => `${sectionColour}`};
-  padding-bottom: 10px;
+  padding-bottom: 5px;
   letter-spacing: 1px;
-
+`;
+export const HiddenDiv = styled.div `
+  display: none;
+`;
+export const Copy = styled.div `
+  color: ${colours.functional.secondary};
+  font-family: ${fonts.body};
+  font-size: 16px;
+  line-height: 24px;
+`;
+export const List = styled.ul `
+  display: flex;
+  flex-wrap: wrap;
+  margin: 0 -2px -1px -15px;
+  list-style: none;
+  padding: 0;
   @media (min-width: ${breakpoints.medium}px) {
-    padding-bottom: 6px;
   }
-
-  @media (min-width: ${breakpoints.wide}px) {
-    padding-bottom: 10px;
+`;
+export const ListContainer = styled.div `
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+  overflow: hidden;
+  max-height: ${({ showAll, maxHeight, displayShowAll }) => !showAll && displayShowAll ? maxHeight + 'px' : 'none'};
+`;
+export const ShowAllContainer = styled.div `
+  display: flex;
+  border-top: 1px solid ${colours.functional.keyline};
+  padding: 5px;
+  justify-content: center;
+  display: ${({ displayShowAll: displayShowAll }) => displayShowAll ? 'flex' : 'none'};
+`;
+export const Headline = styled.div `
+  font-family: ${fonts.headline};
+  font-size: 24px;
+  line-height: 24px;
+  color: ${colours.functional.brandColour};
+  margin: 0 0 6px;
+  @media (min-width: ${breakpoints.medium}px) {
+    font-size: 32px;
+    line-height: 32px;
   }
 `;
-export const HiddenDiv = styled.div `
-  display: none;
+export const ShowAllButton = styled.button `
+  font-family: ${fonts.supporting};
+  font-weight: 500;
+  line-height: 20px;
+  border: 1px solid ${colours.functional.primary};
+  background: transparent;
+  cursor: pointer;
+  &:active {
+    border: 1px solid ${colours.functional.action};
+    color: ${colours.functional.action};
+  }
 `;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY29tbW9uLXN0eWxlcy5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9jb21wb25lbnRzL2NvbW1vbi1zdHlsZXMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxNQUFNLE1BQU0sbUJBQW1CLENBQUM7QUFDdkMsT0FBTyxFQUFFLFdBQVcsRUFBRSxLQUFLLEVBQUUsTUFBTSw4QkFBOEIsQ0FBQztBQUVsRSxNQUFNLENBQUMsTUFBTSxvQkFBb0IsR0FBRyxNQUFNLENBQUMsR0FBRyxDQUFBOzs7Ozt1QkFLdkIsV0FBVyxDQUFDLE1BQU07Ozs7dUJBSWxCLFdBQVcsQ0FBQyxJQUFJOzs7Q0FHdEMsQ0FBQztBQUVGLE1BQU0sQ0FBQyxNQUFNLEtBQUssR0FBRyxNQUFNLENBQUMsR0FBRyxDQUEyQjtpQkFDekMsS0FBSyxDQUFDLFVBQVU7Ozs7V0FJdEIsQ0FBQyxFQUFFLGFBQWEsRUFBRSxFQUFFLEVBQUUsQ0FBQyxHQUFHLGFBQWEsRUFBRTs7Ozt1QkFJN0IsV0FBVyxDQUFDLE1BQU07Ozs7dUJBSWxCLFdBQVcsQ0FBQyxJQUFJOzs7Q0FHdEMsQ0FBQztBQUVGLE1BQU0sQ0FBQyxNQUFNLFNBQVMsR0FBRyxNQUFNLENBQUMsR0FBRyxDQUFBOztDQUVsQyxDQUFDIn0=
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY29tbW9uLXN0eWxlcy5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9jb21wb25lbnRzL2NvbW1vbi1zdHlsZXMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxNQUFNLE1BQU0sbUJBQW1CLENBQUM7QUFDdkMsT0FBTyxFQUFFLFdBQVcsRUFBRSxLQUFLLEVBQUUsT0FBTyxFQUFFLE1BQU0sOEJBQThCLENBQUM7QUFFM0UsTUFBTSxDQUFDLE1BQU0sb0JBQW9CLEdBQUcsTUFBTSxDQUFDLEdBQUcsQ0FBQTs7Ozs7dUJBS3ZCLFdBQVcsQ0FBQyxNQUFNOzs7O3VCQUlsQixXQUFXLENBQUMsSUFBSTs7O0NBR3RDLENBQUM7QUFFRixNQUFNLENBQUMsTUFBTSxLQUFLLEdBQUcsTUFBTSxDQUFDLEdBQUcsQ0FBMkI7aUJBQ3pDLEtBQUssQ0FBQyxVQUFVOzs7O1dBSXRCLENBQUMsRUFBRSxhQUFhLEVBQUUsRUFBRSxFQUFFLENBQUMsR0FBRyxhQUFhLEVBQUU7OztDQUduRCxDQUFDO0FBRUYsTUFBTSxDQUFDLE1BQU0sU0FBUyxHQUFHLE1BQU0sQ0FBQyxHQUFHLENBQUE7O0NBRWxDLENBQUM7QUFFRixNQUFNLENBQUMsTUFBTSxJQUFJLEdBQUcsTUFBTSxDQUFDLEdBQUcsQ0FBQTtXQUNuQixPQUFPLENBQUMsVUFBVSxDQUFDLFNBQVM7aUJBQ3RCLEtBQUssQ0FBQyxJQUFJOzs7Q0FHMUIsQ0FBQztBQUVGLE1BQU0sQ0FBQyxNQUFNLElBQUksR0FBRyxNQUFNLENBQUMsRUFBRSxDQUFBOzs7Ozs7dUJBTU4sV0FBVyxDQUFDLE1BQU07O0NBRXhDLENBQUM7QUFFRixNQUFNLENBQUMsTUFBTSxhQUFhLEdBQUcsTUFBTSxDQUFDLEdBQUcsQ0FJckM7Ozs7O2dCQUtjLENBQUMsRUFBRSxPQUFPLEVBQUUsU0FBUyxFQUFFLGNBQWMsRUFBRSxFQUFFLEVBQUUsQ0FDdkQsQ0FBQyxPQUFPLElBQUksY0FBYyxDQUFDLENBQUMsQ0FBQyxTQUFTLEdBQUcsSUFBSSxDQUFDLENBQUMsQ0FBQyxNQUFNO0NBQ3pELENBQUM7QUFFRixNQUFNLENBQUMsTUFBTSxnQkFBZ0IsR0FBRyxNQUFNLENBQUMsR0FBRyxDQUd4Qzs7MEJBRXdCLE9BQU8sQ0FBQyxVQUFVLENBQUMsT0FBTzs7O2FBR3ZDLENBQUMsRUFBRSxjQUFjLEVBQUUsY0FBYyxFQUFFLEVBQUUsRUFBRSxDQUNoRCxjQUFjLENBQUMsQ0FBQyxDQUFDLE1BQU0sQ0FBQyxDQUFDLENBQUMsTUFBTTtDQUNuQyxDQUFDO0FBRUYsTUFBTSxDQUFDLE1BQU0sUUFBUSxHQUFHLE1BQU0sQ0FBQyxHQUFHLENBQUE7aUJBQ2pCLEtBQUssQ0FBQyxRQUFROzs7V0FHcEIsT0FBTyxDQUFDLFVBQVUsQ0FBQyxXQUFXOzt1QkFFbEIsV0FBVyxDQUFDLE1BQU07Ozs7Q0FJeEMsQ0FBQztBQUVGLE1BQU0sQ0FBQyxNQUFNLGFBQWEsR0FBRyxNQUFNLENBQUMsTUFBTSxDQUFBO2lCQUN6QixLQUFLLENBQUMsVUFBVTs7O3NCQUdYLE9BQU8sQ0FBQyxVQUFVLENBQUMsT0FBTzs7Ozt3QkFJeEIsT0FBTyxDQUFDLFVBQVUsQ0FBQyxNQUFNO2FBQ3BDLE9BQU8sQ0FBQyxVQUFVLENBQUMsTUFBTTs7Q0FFckMsQ0FBQyJ9

package/dist/components/in-article-big-numbers/BigNumbers.js

@@ -3,8 +3,8 @@ import { Placeholder } from '@times-components/image';
 import { useFetch } from '../../helpers/fetch/FetchProvider';
 import { TrackingContextProvider } from '../../helpers/tracking/TrackingContextProvider';
 import { sanitiseCopy } from '../../helpers/text-formatting/SanitiseCopy';
-import { Container, ContentContainer, Headline, ListContainer, List, ListItem, NumberContainer, Copy, ShowAllContainer, ShowAllButton } from './styles';
-import { PlaceholderContainer, Label } from '../common-styles';
+import { Container, ContentContainer, ListItem, NumberContainer, StyledShowAllButton } from './styles';
+import { PlaceholderContainer, Label, Headline, ListContainer, List, Copy, ShowAllContainer } from '../common-styles';
 import { isStandard, isWide } from '../../helpers/layout-size/layoutSize';
 const scrollEvent = {
     attrs: {
@@ -67,6 +67,6 @@ export const BigNumbers = ({ sectionColour }) => {
                             })
                         } }))))))),
         React.createElement(ShowAllContainer, { showAll: showAll, displayShowAll: displayShowAll },
-            React.createElement(ShowAllButton, { onClick: () => handleShowAll(fireAnalyticsEvent, showAll ? 'Collapse' : 'Show all') }, showAll ? 'Collapse' : 'Show all'))))));
+            React.createElement(StyledShowAllButton, { onClick: () => handleShowAll(fireAnalyticsEvent, showAll ? 'Collapse' : 'Show all') }, showAll ? 'Collapse' : 'Show all'))))));
 };
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQmlnTnVtYmVycy5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9jb21wb25lbnRzL2luLWFydGljbGUtYmlnLW51bWJlcnMvQmlnTnVtYmVycy50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxLQUFLLEVBQUUsRUFBRSxNQUFNLEVBQUUsUUFBUSxFQUFFLFNBQVMsRUFBRSxNQUFNLE9BQU8sQ0FBQztBQUMzRCxPQUFPLEVBQUUsV0FBVyxFQUFFLE1BQU0seUJBQXlCLENBQUM7QUFDdEQsT0FBTyxFQUFFLFFBQVEsRUFBRSxNQUFNLG1DQUFtQyxDQUFDO0FBQzdELE9BQU8sRUFFTCx1QkFBdUIsRUFDeEIsTUFBTSxnREFBZ0QsQ0FBQztBQUN4RCxPQUFPLEVBQUUsWUFBWSxFQUFFLE1BQU0sNENBQTRDLENBQUM7QUFDMUUsT0FBTyxFQUNMLFNBQVMsRUFDVCxnQkFBZ0IsRUFDaEIsUUFBUSxFQUNSLGFBQWEsRUFDYixJQUFJLEVBQ0osUUFBUSxFQUNSLGVBQWUsRUFDZixJQUFJLEVBQ0osZ0JBQWdCLEVBQ2hCLGFBQWEsRUFDZCxNQUFNLFVBQVUsQ0FBQztBQUNsQixPQUFPLEVBQUUsb0JBQW9CLEVBQUUsS0FBSyxFQUFFLE1BQU0sa0JBQWtCLENBQUM7QUFDL0QsT0FBTyxFQUFFLFVBQVUsRUFBRSxNQUFNLEVBQUUsTUFBTSxzQ0FBc0MsQ0FBQztBQWExRSxNQUFNLFdBQVcsR0FBRztJQUNsQixLQUFLLEVBQUU7UUFDTCxxQkFBcUIsRUFBRSw4Q0FBOEM7UUFDckUsZ0NBQWdDLEVBQUUsUUFBUTtLQUMzQztDQUNGLENBQUM7QUFFRixNQUFNLFVBQVUsR0FBRyxDQUFDLFdBQW1CLEVBQUUsRUFBRSxDQUFDLENBQUM7SUFDM0MsTUFBTSxFQUFFLFNBQVM7SUFDakIsS0FBSyxFQUFFO1FBQ0wscUJBQXFCLEVBQUUsWUFBWSxXQUFXLEVBQUU7UUFDaEQsZ0NBQWdDLEVBQUUsT0FBTztLQUMxQztDQUNGLENBQUMs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
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQmlnTnVtYmVycy5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9jb21wb25lbnRzL2luLWFydGljbGUtYmlnLW51bWJlcnMvQmlnTnVtYmVycy50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxLQUFLLEVBQUUsRUFBRSxNQUFNLEVBQUUsUUFBUSxFQUFFLFNBQVMsRUFBRSxNQUFNLE9BQU8sQ0FBQztBQUMzRCxPQUFPLEVBQUUsV0FBVyxFQUFFLE1BQU0seUJBQXlCLENBQUM7QUFDdEQsT0FBTyxFQUFFLFFBQVEsRUFBRSxNQUFNLG1DQUFtQyxDQUFDO0FBQzdELE9BQU8sRUFFTCx1QkFBdUIsRUFDeEIsTUFBTSxnREFBZ0QsQ0FBQztBQUN4RCxPQUFPLEVBQUUsWUFBWSxFQUFFLE1BQU0sNENBQTRDLENBQUM7QUFDMUUsT0FBTyxFQUNMLFNBQVMsRUFDVCxnQkFBZ0IsRUFDaEIsUUFBUSxFQUNSLGVBQWUsRUFDZixtQkFBbUIsRUFDcEIsTUFBTSxVQUFVLENBQUM7QUFDbEIsT0FBTyxFQUNMLG9CQUFvQixFQUNwQixLQUFLLEVBQ0wsUUFBUSxFQUNSLGFBQWEsRUFDYixJQUFJLEVBQ0osSUFBSSxFQUNKLGdCQUFnQixFQUNqQixNQUFNLGtCQUFrQixDQUFDO0FBQzFCLE9BQU8sRUFBRSxVQUFVLEVBQUUsTUFBTSxFQUFFLE1BQU0sc0NBQXNDLENBQUM7QUFhMUUsTUFBTSxXQUFXLEdBQUc7SUFDbEIsS0FBSyxFQUFFO1FBQ0wscUJBQXFCLEVBQUUsOENBQThDO1FBQ3JFLGdDQUFnQyxFQUFFLFFBQVE7S0FDM0M7Q0FDRixDQUFDO0FBRUYsTUFBTSxVQUFVLEdBQUcsQ0FBQyxXQUFtQixFQUFFLEVBQUUsQ0FBQyxDQUFDO0lBQzNDLE1BQU0sRUFBRSxTQUFTO0lBQ2pCLEtBQUssRUFBRTtRQUNMLHFCQUFxQixFQUFFLFlBQVksV0FBVyxFQUFFO1FBQ2hELGdDQUFnQyxFQUFFLE9BQU87S0FDMUM7Q0FDRixD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

package/dist/components/in-article-big-numbers/styles.d.ts

@@ -3,22 +3,10 @@ export declare const Container: import("styled-components").StyledComponent<"div
     isWide?: boolean | undefined;
 }, never>;
 export declare const ContentContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const Headline: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const ShowAllContainer: import("styled-components").StyledComponent<"div", any, {
-    showAll: boolean;
-    displayShowAll: boolean;
-}, never>;
-export declare const ShowAllButton: import("styled-components").StyledComponent<"button", any, {}, never>;
-export declare const ListContainer: import("styled-components").StyledComponent<"div", any, {
-    showAll: boolean;
-    maxHeight: number;
-    displayShowAll: boolean;
-}, never>;
-export declare const List: import("styled-components").StyledComponent<"ul", any, {}, never>;
+export declare const StyledShowAllButton: import("styled-components").StyledComponent<"button", any, {}, never>;
 export declare const ListItem: import("styled-components").StyledComponent<"li", any, {
     isStandard?: boolean | undefined;
 }, never>;
 export declare const NumberContainer: import("styled-components").StyledComponent<"div", any, {
     sectionColour: string;
 }, never>;
-export declare const Copy: import("styled-components").StyledComponent<"div", any, {}, never>;

package/dist/components/in-article-big-numbers/styles.js

@@ -1,5 +1,6 @@
 import styled from 'styled-components';
 import { breakpoints, colours, fonts } from '@times-components/styleguide';
+import { ShowAllButton } from '../common-styles';
 export const Container = styled.div `
   margin: 0 auto 20px auto;
   padding: 23px 0 0;
@@ -25,54 +26,10 @@ export const ContentContainer = styled.div `
   justify-content: space-between;
   padding: 0 16px;
 `;
-export const Headline = styled.div `
-  font-family: ${fonts.headline};
-  font-size: 24px;
-  line-height: 24px;
-  color: ${colours.functional.brandColour};
-  margin: 0 0 6px;
-  @media (min-width: ${breakpoints.medium}px) {
-    font-size: 32px;
-    line-height: 32px;
-  }
-`;
-export const ShowAllContainer = styled.div `
-  display: flex;
-  border-top: 1px solid ${colours.functional.keyline};
-  padding: 5px;
-  justify-content: center;
-  display: ${({ displayShowAll: displayShowAll }) => displayShowAll ? 'flex' : 'none'};
-`;
-export const ShowAllButton = styled.button `
+export const StyledShowAllButton = styled(ShowAllButton) `
   font-size: 12px;
-  font-family: ${fonts.supporting};
-  font-weight: 500;
-  line-height: 20px;
-  border: 1px solid ${colours.functional.primary};
-  background: transparent;
   margin: 15px 0;
   padding: 10px 12px 5px;
-  cursor: pointer;
-  &:active {
-    border: 1px solid ${colours.functional.action};
-    color: ${colours.functional.action};
-  }
-`;
-export const ListContainer = styled.div `
-  display: flex;
-  flex-direction: column;
-  justify-content: space-between;
-  overflow: hidden;
-  max-height: ${({ showAll, maxHeight, displayShowAll }) => !showAll && displayShowAll ? maxHeight + 'px' : 'none'};
-`;
-export const List = styled.ul `
-  display: flex;
-  flex-wrap: wrap;
-  margin: 0 -2px -1px -15px;
-  list-style: none;
-  padding: 0;
-  @media (min-width: ${breakpoints.medium}px) {
-  }
 `;
 export const ListItem = styled.li `
   flex: 1 0 50%;
@@ -106,10 +63,4 @@ export const NumberContainer = styled.div `
     line-height: 40px;
   }
 `;
-export const Copy = styled.div `
-  color: ${colours.functional.secondary};
-  font-family: ${fonts.body};
-  font-size: 16px;
-  line-height: 24px;
-`;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3R5bGVzLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vc3JjL2NvbXBvbmVudHMvaW4tYXJ0aWNsZS1iaWctbnVtYmVycy9zdHlsZXMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxNQUFNLE1BQU0sbUJBQW1CLENBQUM7QUFDdkMsT0FBTyxFQUFFLFdBQVcsRUFBRSxPQUFPLEVBQUUsS0FBSyxFQUFFLE1BQU0sOEJBQThCLENBQUM7QUFFM0UsTUFBTSxDQUFDLE1BQU0sU0FBUyxHQUFHLE1BQU0sQ0FBQyxHQUFHLENBR2pDOzs7c0JBR29CLE9BQU8sQ0FBQyxVQUFVLENBQUMsaUJBQWlCO2dCQUMxQyxDQUFDLEVBQUUsYUFBYSxFQUFFLEVBQUUsRUFBRSxDQUFDLGFBQWEsYUFBYSxFQUFFO1dBQ3hELENBQUMsRUFBRSxNQUFNLEVBQUUsRUFBRSxFQUFFLENBQUMsQ0FBQyxNQUFNLENBQUMsQ0FBQyxDQUFDLE1BQU0sQ0FBQyxDQUFDLENBQUMsTUFBTSxDQUFDOzt1QkFFOUIsV0FBVyxDQUFDLE1BQU07YUFDNUIsQ0FBQyxFQUFFLE1BQU0sRUFBRSxFQUFFLEVBQUUsQ0FBQyxDQUFDLE1BQU0sQ0FBQyxDQUFDLENBQUMsTUFBTSxDQUFDLENBQUMsQ0FBQyxPQUFPLENBQUM7Ozt1QkFHakMsV0FBVyxDQUFDLElBQUk7YUFDMUIsQ0FBQyxFQUFFLE1BQU0sRUFBRSxFQUFFLEVBQUUsQ0FBQyxDQUFDLE1BQU0sQ0FBQyxDQUFDLENBQUMsTUFBTSxDQUFDLENBQUMsQ0FBQyxPQUFPLENBQUM7Ozs7OztDQU12RCxDQUFDO0FBRUYsTUFBTSxDQUFDLE1BQU0sZ0JBQWdCLEdBQUcsTUFBTSxDQUFDLEdBQUcsQ0FBQTs7Ozs7Q0FLekMsQ0FBQztBQUVGLE1BQU0sQ0FBQyxNQUFNLFFBQVEsR0FBRyxNQUFNLENBQUMsR0FBRyxDQUFBO2lCQUNqQixLQUFLLENBQUMsUUFBUTs7O1dBR3BCLE9BQU8sQ0FBQyxVQUFVLENBQUMsV0FBVzs7dUJBRWxCLFdBQVcsQ0FBQyxNQUFNOzs7O0NBSXhDLENBQUM7QUFFRixNQUFNLENBQUMsTUFBTSxnQkFBZ0IsR0FBRyxNQUFNLENBQUMsR0FBRyxDQUd4Qzs7MEJBRXdCLE9BQU8sQ0FBQyxVQUFVLENBQUMsT0FBTzs7O2FBR3ZDLENBQUMsRUFBRSxjQUFjLEVBQUUsY0FBYyxFQUFFLEVBQUUsRUFBRSxDQUNoRCxjQUFjLENBQUMsQ0FBQyxDQUFDLE1BQU0sQ0FBQyxDQUFDLENBQUMsTUFBTTtDQUNuQyxDQUFDO0FBRUYsTUFBTSxDQUFDLE1BQU0sYUFBYSxHQUFHLE1BQU0sQ0FBQyxNQUFNLENBQUE7O2lCQUV6QixLQUFLLENBQUMsVUFBVTs7O3NCQUdYLE9BQU8sQ0FBQyxVQUFVLENBQUMsT0FBTzs7Ozs7O3dCQU14QixPQUFPLENBQUMsVUFBVSxDQUFDLE1BQU07YUFDcEMsT0FBTyxDQUFDLFVBQVUsQ0FBQyxNQUFNOztDQUVyQyxDQUFDO0FBRUYsTUFBTSxDQUFDLE1BQU0sYUFBYSxHQUFHLE1BQU0sQ0FBQyxHQUFHLENBSXJDOzs7OztnQkFLYyxDQUFDLEVBQUUsT0FBTyxFQUFFLFNBQVMsRUFBRSxjQUFjLEVBQUUsRUFBRSxFQUFFLENBQ3ZELENBQUMsT0FBTyxJQUFJLGNBQWMsQ0FBQyxDQUFDLENBQUMsU0FBUyxHQUFHLElBQUksQ0FBQyxDQUFDLENBQUMsTUFBTTtDQUN6RCxDQUFDO0FBRUYsTUFBTSxDQUFDLE1BQU0sSUFBSSxHQUFHLE1BQU0sQ0FBQyxFQUFFLENBQUE7Ozs7Ozt1QkFNTixXQUFXLENBQUMsTUFBTTs7Q0FFeEMsQ0FBQztBQUVGLE1BQU0sQ0FBQyxNQUFNLFFBQVEsR0FBRyxNQUFNLENBQUMsRUFBRSxDQUUvQjs7Ozs7a0JBS2dCLE9BQU8sQ0FBQyxVQUFVLENBQUMsT0FBTzs7Ozs7Ozs7Ozs7O3VCQVlyQixXQUFXLENBQUMsTUFBTTtnQkFDekIsQ0FBQyxFQUFFLFVBQVUsRUFBRSxFQUFFLEVBQUUsQ0FBQyxDQUFDLFVBQVUsQ0FBQyxDQUFDLENBQUMsS0FBSyxDQUFDLENBQUMsQ0FBQyxLQUFLLENBQUM7O0NBRS9ELENBQUM7QUFFRixNQUFNLENBQUMsTUFBTSxlQUFlLEdBQUcsTUFBTSxDQUFDLEdBQUcsQ0FBMkI7aUJBQ25ELEtBQUssQ0FBQyxRQUFROzs7O1dBSXBCLENBQUMsRUFBRSxhQUFhLEVBQUUsRUFBRSxFQUFFLENBQUMsR0FBRyxhQUFhLEVBQUU7dUJBQzdCLFdBQVcsQ0FBQyxNQUFNOzs7O0NBSXhDLENBQUM7QUFFRixNQUFNLENBQUMsTUFBTSxJQUFJLEdBQUcsTUFBTSxDQUFDLEdBQUcsQ0FBQTtXQUNuQixPQUFPLENBQUMsVUFBVSxDQUFDLFNBQVM7aUJBQ3RCLEtBQUssQ0FBQyxJQUFJOzs7Q0FHMUIsQ0FBQyJ9
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3R5bGVzLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vc3JjL2NvbXBvbmVudHMvaW4tYXJ0aWNsZS1iaWctbnVtYmVycy9zdHlsZXMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxNQUFNLE1BQU0sbUJBQW1CLENBQUM7QUFDdkMsT0FBTyxFQUFFLFdBQVcsRUFBRSxPQUFPLEVBQUUsS0FBSyxFQUFFLE1BQU0sOEJBQThCLENBQUM7QUFDM0UsT0FBTyxFQUFFLGFBQWEsRUFBRSxNQUFNLGtCQUFrQixDQUFDO0FBRWpELE1BQU0sQ0FBQyxNQUFNLFNBQVMsR0FBRyxNQUFNLENBQUMsR0FBRyxDQUdqQzs7O3NCQUdvQixPQUFPLENBQUMsVUFBVSxDQUFDLGlCQUFpQjtnQkFDMUMsQ0FBQyxFQUFFLGFBQWEsRUFBRSxFQUFFLEVBQUUsQ0FBQyxhQUFhLGFBQWEsRUFBRTtXQUN4RCxDQUFDLEVBQUUsTUFBTSxFQUFFLEVBQUUsRUFBRSxDQUFDLENBQUMsTUFBTSxDQUFDLENBQUMsQ0FBQyxNQUFNLENBQUMsQ0FBQyxDQUFDLE1BQU0sQ0FBQzs7dUJBRTlCLFdBQVcsQ0FBQyxNQUFNO2FBQzVCLENBQUMsRUFBRSxNQUFNLEVBQUUsRUFBRSxFQUFFLENBQUMsQ0FBQyxNQUFNLENBQUMsQ0FBQyxDQUFDLE1BQU0sQ0FBQyxDQUFDLENBQUMsT0FBTyxDQUFDOzs7dUJBR2pDLFdBQVcsQ0FBQyxJQUFJO2FBQzFCLENBQUMsRUFBRSxNQUFNLEVBQUUsRUFBRSxFQUFFLENBQUMsQ0FBQyxNQUFNLENBQUMsQ0FBQyxDQUFDLE1BQU0sQ0FBQyxDQUFDLENBQUMsT0FBTyxDQUFDOzs7Ozs7Q0FNdkQsQ0FBQztBQUVGLE1BQU0sQ0FBQyxNQUFNLGdCQUFnQixHQUFHLE1BQU0sQ0FBQyxHQUFHLENBQUE7Ozs7O0NBS3pDLENBQUM7QUFFRixNQUFNLENBQUMsTUFBTSxtQkFBbUIsR0FBRyxNQUFNLENBQUMsYUFBYSxDQUFDLENBQUE7Ozs7Q0FJdkQsQ0FBQztBQUVGLE1BQU0sQ0FBQyxNQUFNLFFBQVEsR0FBRyxNQUFNLENBQUMsRUFBRSxDQUUvQjs7Ozs7a0JBS2dCLE9BQU8sQ0FBQyxVQUFVLENBQUMsT0FBTzs7Ozs7Ozs7Ozs7O3VCQVlyQixXQUFXLENBQUMsTUFBTTtnQkFDekIsQ0FBQyxFQUFFLFVBQVUsRUFBRSxFQUFFLEVBQUUsQ0FBQyxDQUFDLFVBQVUsQ0FBQyxDQUFDLENBQUMsS0FBSyxDQUFDLENBQUMsQ0FBQyxLQUFLLENBQUM7O0NBRS9ELENBQUM7QUFFRixNQUFNLENBQUMsTUFBTSxlQUFlLEdBQUcsTUFBTSxDQUFDLEdBQUcsQ0FBMkI7aUJBQ25ELEtBQUssQ0FBQyxRQUFROzs7O1dBSXBCLENBQUMsRUFBRSxhQUFhLEVBQUUsRUFBRSxFQUFFLENBQUMsR0FBRyxhQUFhLEVBQUU7dUJBQzdCLFdBQVcsQ0FBQyxNQUFNOzs7O0NBSXhDLENBQUMifQ==

package/dist/components/in-article-timelines/Timelines.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+export declare const Timelines: React.FC<{
+    sectionColour: string;
+}>;

package/dist/components/in-article-timelines/Timelines.js

@@ -0,0 +1,70 @@
+import React, { useRef, useState, useEffect } from 'react';
+import { Placeholder } from '@times-components/image';
+import { useFetch } from '../../helpers/fetch/FetchProvider';
+import { TrackingContextProvider } from '../../helpers/tracking/TrackingContextProvider';
+import { sanitiseCopy } from '../../helpers/text-formatting/SanitiseCopy';
+import { Container, ContentContainer, ListItem, LeftPanel, RightPanel, Date, SubHeading, StyledShowAllButton } from './styles';
+import { PlaceholderContainer, Label, Headline, ListContainer, List, Copy, ShowAllContainer } from '../common-styles';
+const scrollEvent = {
+    attrs: {
+        event_navigation_name: 'in-article component displayed : timelines',
+        event_navigation_browsing_method: 'scroll'
+    }
+};
+const clickEvent = (buttonLabel) => ({
+    action: 'Clicked',
+    attrs: {
+        event_navigation_name: `button : ${buttonLabel}`,
+        event_navigation_browsing_method: 'click'
+    }
+});
+export const Timelines = ({ sectionColour }) => {
+    const { loading, error, data } = useFetch();
+    if (loading) {
+        return (React.createElement(PlaceholderContainer, null,
+            React.createElement(Placeholder, null)));
+    }
+    if (error || data === undefined) {
+        return null;
+    }
+    const { headline, label } = data.fields;
+    const timelinesData = data.body.data;
+    const [showAll, setShowAll] = useState(false);
+    const handleShowAll = (fireAnalyticsEvent, buttonLabel) => {
+        fireAnalyticsEvent && fireAnalyticsEvent(clickEvent(buttonLabel));
+        setShowAll(!showAll);
+    };
+    const showAllRef = useRef(null);
+    const [displayShowAll, setShowShowAll] = useState(false);
+    const maxHeight = 375;
+    useEffect(() => {
+        const listContainer = showAllRef.current;
+        if (listContainer) {
+            setShowShowAll(listContainer.clientHeight > maxHeight);
+        }
+    }, []);
+    return (React.createElement(TrackingContextProvider, { context: {
+            object: 'InArticleTimelines',
+            attrs: {
+                component_type: 'in-article component : timelines: ' +
+                    (displayShowAll ? 'interactive' : 'static'),
+                event_navigation_action: 'navigation',
+                component_name: `${headline}`
+            }
+        }, scrolledEvent: scrollEvent }, ({ fireAnalyticsEvent, intersectObserverRef }) => (React.createElement(Container, { ref: intersectObserverRef, sectionColour: sectionColour },
+        React.createElement(ContentContainer, null,
+            React.createElement(Label, { sectionColour: sectionColour }, label),
+            headline && React.createElement(Headline, null, headline),
+            React.createElement(ListContainer, { ref: showAllRef, showAll: showAll, maxHeight: maxHeight, displayShowAll: displayShowAll },
+                React.createElement(List, null, timelinesData.map((row, index) => (React.createElement(ListItem, { key: index },
+                    React.createElement(LeftPanel, { sectionColour: sectionColour, circularImage: row.data.image }, row.data.image && React.createElement("img", { src: row.data.image })),
+                    React.createElement(RightPanel, null,
+                        React.createElement(Date, { sectionColour: sectionColour }, row.data.date),
+                        React.createElement(SubHeading, null, row.data.eventHeading),
+                        React.createElement(Copy, { dangerouslySetInnerHTML: {
+                                __html: sanitiseCopy(row.data.copy, ['br', 'b', 'i'])
+                            } })))))))),
+        React.createElement(ShowAllContainer, { showAll: showAll, displayShowAll: displayShowAll },
+            React.createElement(StyledShowAllButton, { onClick: () => handleShowAll(fireAnalyticsEvent, showAll ? 'Collapse' : 'Show all') }, showAll ? 'Collapse' : 'Show all'))))));
+};
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiVGltZWxpbmVzLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vc3JjL2NvbXBvbmVudHMvaW4tYXJ0aWNsZS10aW1lbGluZXMvVGltZWxpbmVzLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEtBQUssRUFBRSxFQUFFLE1BQU0sRUFBRSxRQUFRLEVBQUUsU0FBUyxFQUFFLE1BQU0sT0FBTyxDQUFDO0FBQzNELE9BQU8sRUFBRSxXQUFXLEVBQUUsTUFBTSx5QkFBeUIsQ0FBQztBQUN0RCxPQUFPLEVBQUUsUUFBUSxFQUFFLE1BQU0sbUNBQW1DLENBQUM7QUFDN0QsT0FBTyxFQUVMLHVCQUF1QixFQUN4QixNQUFNLGdEQUFnRCxDQUFDO0FBQ3hELE9BQU8sRUFBRSxZQUFZLEVBQUUsTUFBTSw0Q0FBNEMsQ0FBQztBQUMxRSxPQUFPLEVBQ0wsU0FBUyxFQUNULGdCQUFnQixFQUNoQixRQUFRLEVBQ1IsU0FBUyxFQUNULFVBQVUsRUFDVixJQUFJLEVBQ0osVUFBVSxFQUNWLG1CQUFtQixFQUNwQixNQUFNLFVBQVUsQ0FBQztBQUNsQixPQUFPLEVBQ0wsb0JBQW9CLEVBQ3BCLEtBQUssRUFDTCxRQUFRLEVBQ1IsYUFBYSxFQUNiLElBQUksRUFDSixJQUFJLEVBQ0osZ0JBQWdCLEVBQ2pCLE1BQU0sa0JBQWtCLENBQUM7QUFlMUIsTUFBTSxXQUFXLEdBQUc7SUFDbEIsS0FBSyxFQUFFO1FBQ0wscUJBQXFCLEVBQUUsNENBQTRDO1FBQ25FLGdDQUFnQyxFQUFFLFFBQVE7S0FDM0M7Q0FDRixDQUFDO0FBRUYsTUFBTSxVQUFVLEdBQUcsQ0FBQyxXQUFtQixFQUFFLEVBQUUsQ0FBQyxDQUFDO0lBQzNDLE1BQU0sRUFBRSxTQUFTO0lBQ2pCLEtBQUssRUFBRTtRQUNMLHFCQUFxQixFQUFFLFlBQVksV0FBVyxFQUFFO1FBQ2hELGdDQUFnQyxFQUFFLE9BQU87S0FDMUM7Q0FDRixDQUFDLENBQUM7QUFFSCxNQUFNLENBQUMsTUFB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

package/dist/components/in-article-timelines/Timelines.stories.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/in-article-timelines/Timelines.stories.js

@@ -0,0 +1,21 @@
+import React from 'react';
+import { storiesOf } from '@storybook/react';
+import { ArticleHarness } from '../../fixtures/article-harness/ArticleHarness';
+import { FetchProvider } from '../../helpers/fetch/FetchProvider';
+import { Timelines } from './Timelines';
+import { TrackingContextProvider } from '../../helpers/tracking/TrackingContextProvider';
+import analyticsStream from '../../fixtures/analytics-actions/analytics-actions';
+storiesOf('Typescript Component/In Article/Timelines', module)
+    .addDecorator((storyFn) => (React.createElement(TrackingContextProvider, { context: {
+        component: 'ArticleSkeleton',
+        attrs: {
+            article_name: 'articleHeadline',
+            section_details: 'section'
+        }
+    }, analyticsStream: analyticsStream },
+    React.createElement(ArticleHarness, null, storyFn()))))
+    .add('Timelines with Bullet Point', () => (React.createElement(FetchProvider, { url: "https://gobble.timesdev.tools/deck/api/deck-post-action/45060" },
+    React.createElement(Timelines, { sectionColour: "#008347" }))))
+    .add('Timelines with Circular Image', () => (React.createElement(FetchProvider, { url: "https://gobble.timesdev.tools/deck/api/deck-post-action/45061" },
+    React.createElement(Timelines, { sectionColour: "#008347" }))));
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiVGltZWxpbmVzLnN0b3JpZXMuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9zcmMvY29tcG9uZW50cy9pbi1hcnRpY2xlLXRpbWVsaW5lcy9UaW1lbGluZXMuc3Rvcmllcy50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxLQUFLLE1BQU0sT0FBTyxDQUFDO0FBQzFCLE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSxrQkFBa0IsQ0FBQztBQUM3QyxPQUFPLEVBQUUsY0FBYyxFQUFFLE1BQU0sK0NBQStDLENBQUM7QUFDL0UsT0FBTyxFQUFFLGFBQWEsRUFBRSxNQUFNLG1DQUFtQyxDQUFDO0FBQ2xFLE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSxhQUFhLENBQUM7QUFDeEMsT0FBTyxFQUFFLHVCQUF1QixFQUFFLE1BQU0sZ0RBQWdELENBQUM7QUFDekYsT0FBTyxlQUFlLE1BQU0sb0RBQW9ELENBQUM7QUFFakYsU0FBUyxDQUFDLDJDQUEyQyxFQUFFLE1BQU0sQ0FBQztLQUMzRCxZQUFZLENBQUMsQ0FBQyxPQUE4QixFQUFFLEVBQUUsQ0FBQyxDQUNoRCxvQkFBQyx1QkFBdUIsSUFDdEIsT0FBTyxFQUFFO1FBQ1AsU0FBUyxFQUFFLGlCQUFpQjtRQUM1QixLQUFLLEVBQUU7WUFDTCxZQUFZLEVBQUUsaUJBQWlCO1lBQy9CLGVBQWUsRUFBRSxTQUFTO1NBQzNCO0tBQ0YsRUFDRCxlQUFlLEVBQUUsZUFBZTtJQUVoQyxvQkFBQyxjQUFjLFFBQUUsT0FBTyxFQUFFLENBQWtCLENBQ3BCLENBQzNCLENBQUM7S0FDRCxHQUFHLENBQUMsNkJBQTZCLEVBQUUsR0FBRyxFQUFFLENBQUMsQ0FDeEMsb0JBQUMsYUFBYSxJQUFDLEdBQUcsRUFBQywrREFBK0Q7SUFDaEYsb0JBQUMsU0FBUyxJQUFDLGFBQWEsRUFBQyxTQUFTLEdBQUcsQ0FDdkIsQ0FDakIsQ0FBQztLQUNELEdBQUcsQ0FBQywrQkFBK0IsRUFBRSxHQUFHLEVBQUUsQ0FBQyxDQUMxQyxvQkFBQyxhQUFhLElBQUMsR0FBRyxFQUFDLCtEQUErRDtJQUNoRixvQkFBQyxTQUFTLElBQUMsYUFBYSxFQUFDLFNBQVMsR0FBRyxDQUN2QixDQUNqQixDQUFDLENBQUMifQ==

package/dist/components/in-article-timelines/__tests__/Timelines.test.d.ts

@@ -0,0 +1,2 @@
+import '@testing-library/jest-dom';
+import 'regenerator-runtime';