@times-components/ts-components 1.35.5 → 1.36.2

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 (26) hide show
  1. package/CHANGELOG.md +33 -0
  2. package/dist/components/article-header/ArticleHeader.js +15 -14
  3. package/dist/components/article-header/__tests__/ArticleHeader.test.js +24 -170
  4. package/dist/components/carousel/GalleryCarousel.js +3 -2
  5. package/dist/components/carousel/__tests__/GalleryCarousel.test.js +3 -1
  6. package/dist/components/recommended-articles/RecommendedArticles.d.ts +7 -0
  7. package/dist/components/recommended-articles/RecommendedArticles.js +30 -0
  8. package/dist/components/recommended-articles/RecommendedArticles.stories.d.ts +1 -0
  9. package/dist/components/recommended-articles/RecommendedArticles.stories.js +65 -0
  10. package/dist/components/recommended-articles/__tests__/RecommendedArticles.test.d.ts +1 -0
  11. package/dist/components/recommended-articles/__tests__/RecommendedArticles.test.js +67 -0
  12. package/dist/index.d.ts +1 -0
  13. package/dist/index.js +2 -1
  14. package/package.json +6 -6
  15. package/rnw.js +1 -1
  16. package/src/components/article-header/ArticleHeader.tsx +16 -16
  17. package/src/components/article-header/__tests__/ArticleHeader.test.tsx +23 -170
  18. package/src/components/carousel/GalleryCarousel.tsx +2 -1
  19. package/src/components/carousel/__tests__/GalleryCarousel.test.tsx +2 -0
  20. package/src/components/recommended-articles/RecommendedArticles.stories.tsx +82 -0
  21. package/src/components/recommended-articles/RecommendedArticles.tsx +69 -0
  22. package/src/components/recommended-articles/__tests__/RecommendedArticles.test.tsx +91 -0
  23. package/src/components/recommended-articles/__tests__/__snapshots__/RecommendedArticles.test.tsx.snap +71 -0
  24. package/src/index.ts +3 -0
  25. package/src/types/externs.d.ts +7 -0
  26. package/src/components/article-header/__tests__/__snapshots__/ArticleHeader.test.tsx.snap +0 -68
@@ -0,0 +1,71 @@
1
+ // Jest Snapshot v1, https://goo.gl/fbAQLP
2
+
3
+ exports[`Recommended Articles degrades gracefully 1`] = `
4
+ <DocumentFragment>
5
+ <div
6
+ class="placeholder"
7
+ >
8
+ <div
9
+ class="tc-view__TcView-nuazoi-0 fPjBcr"
10
+ height="100%"
11
+ style="align-items: center; background-color: rgb(237, 237, 237); bottom: 0px; justify-content: center; left: 0px; position: absolute; right: 0px; top: 0px; z-index: 0; border-radius: 0;"
12
+ width="100%"
13
+ >
14
+ <svg
15
+ height="auto"
16
+ style="max-width: 25%; max-height: 50%;"
17
+ version="1.1"
18
+ viewBox="145 50 108 120"
19
+ width="100%"
20
+ >
21
+ <g
22
+ fill="none"
23
+ fill-rule="evenodd"
24
+ stroke="none"
25
+ stroke-width="1"
26
+ >
27
+ <path
28
+ d="M211.26076,54 L211.231367,54 L147.67512,54 L145,85.7081465 L146.922096,86.4489102 C146.922096,86.4489102 164.867589,68.1355181 168.301115,65.0001546 C171.728017,61.8689133 174.237132,61.0885763 176.436179,60.3527593 C180.998206,59.169681 185.977937,59.2150255 185.977937,59.2150255 L186.109581,59.2150255 L186.109581,156.560932 L169.259886,164.473953 L169.259886,166 L228.735147,166 L228.735147,164.473953 L211.889177,156.560932 L211.889177,59.2150255 L212.01751,59.2150255 C212.01751,59.2150255 216.992272,59.169681 221.558854,60.3527593 C223.757072,61.0885763 226.266601,61.8689133 229.691848,65.0001546 C233.130341,68.1355181 251.071695,86.4489102 251.071695,86.4489102 L253,85.7081465 L250.317842,54 L211.270695,54 L211.242545,54"
29
+ fill="#FFFFFF"
30
+ />
31
+ </g>
32
+ </svg>
33
+ </div>
34
+ </div>
35
+ </DocumentFragment>
36
+ `;
37
+
38
+ exports[`Recommended Articles it renders 1`] = `
39
+ <DocumentFragment>
40
+ <div
41
+ class="placeholder"
42
+ >
43
+ <div
44
+ class="tc-view__TcView-nuazoi-0 fPjBcr"
45
+ height="100%"
46
+ style="align-items: center; background-color: rgb(237, 237, 237); bottom: 0px; justify-content: center; left: 0px; position: absolute; right: 0px; top: 0px; z-index: 0; border-radius: 0;"
47
+ width="100%"
48
+ >
49
+ <svg
50
+ height="auto"
51
+ style="max-width: 25%; max-height: 50%;"
52
+ version="1.1"
53
+ viewBox="145 50 108 120"
54
+ width="100%"
55
+ >
56
+ <g
57
+ fill="none"
58
+ fill-rule="evenodd"
59
+ stroke="none"
60
+ stroke-width="1"
61
+ >
62
+ <path
63
+ d="M211.26076,54 L211.231367,54 L147.67512,54 L145,85.7081465 L146.922096,86.4489102 C146.922096,86.4489102 164.867589,68.1355181 168.301115,65.0001546 C171.728017,61.8689133 174.237132,61.0885763 176.436179,60.3527593 C180.998206,59.169681 185.977937,59.2150255 185.977937,59.2150255 L186.109581,59.2150255 L186.109581,156.560932 L169.259886,164.473953 L169.259886,166 L228.735147,166 L228.735147,164.473953 L211.889177,156.560932 L211.889177,59.2150255 L212.01751,59.2150255 C212.01751,59.2150255 216.992272,59.169681 221.558854,60.3527593 C223.757072,61.0885763 226.266601,61.8689133 229.691848,65.0001546 C233.130341,68.1355181 251.071695,86.4489102 251.071695,86.4489102 L253,85.7081465 L250.317842,54 L211.270695,54 L211.242545,54"
64
+ fill="#FFFFFF"
65
+ />
66
+ </g>
67
+ </svg>
68
+ </div>
69
+ </div>
70
+ </DocumentFragment>
71
+ `;
package/src/index.ts CHANGED
@@ -70,6 +70,9 @@ export {
70
70
  export {
71
71
  RelatedArticleSlice
72
72
  } from './components/related-article-slice/RelatedArticleSlice';
73
+ export {
74
+ RecommendedArticles
75
+ } from './components/recommended-articles/RecommendedArticles';
73
76
  export {
74
77
  LatestFromSection
75
78
  } from './components/latest-from-section/LatestFromSection';
@@ -180,12 +180,19 @@ declare module '@times-components/provider' {
180
180
  ssr: boolean;
181
181
  debounceTimeMs: number;
182
182
  }>;
183
+ export const GetRecommendedArticles: React.FC<{
184
+ publisher: string;
185
+ recomArgs: any;
186
+ ssr: boolean;
187
+ debounceTimeMs: number;
188
+ }>;
183
189
  }
184
190
 
185
191
  declare module '@times-components/provider-queries' {
186
192
  import { DocumentNode } from 'graphql';
187
193
  export const getNewsletter: DocumentNode;
188
194
  export const subscribeNewsletter: DocumentNode;
195
+ export const recommendations: DocumentNode;
189
196
  }
190
197
 
191
198
  declare module '@times-components/provider-test-tools' {
@@ -1,68 +0,0 @@
1
- // Jest Snapshot v1, https://goo.gl/fbAQLP
2
-
3
- exports[`ArticleHeader Same calendar day during GMT With breaking flag and headline 1`] = `
4
- <body>
5
- <div>
6
- <div
7
- class="sc-VigVT esKZlx"
8
- id="u_20211231063000T222"
9
- >
10
- <div
11
- class="sc-jTzLTM hsNKrf"
12
- >
13
- <div
14
- class="sc-cSHVUG jdArUK"
15
- >
16
- <div
17
- class="sc-kpOJdX pPyiu"
18
- >
19
- <div
20
- class="sc-EHOje cfBXHC"
21
- >
22
- <div
23
- class="sc-bdVaJa bkSKmo"
24
- >
25
- <div
26
- class="sc-htpNat jcRSar"
27
- >
28
- <div
29
- class="sc-bxivhb hTEbzV"
30
- />
31
- </div>
32
- <span
33
- class="sc-bwzfXH hBgZUv"
34
- >
35
- BREAKING
36
- </span>
37
- </div>
38
- </div>
39
- </div>
40
- <div
41
- class="sc-fjdhpX eXIoUS"
42
- >
43
- <div
44
- class="sc-jzJRlG ektXhQ"
45
- data-testid="TimeSincePublishing"
46
- >
47
- 30 minutes ago
48
- </div>
49
- <div
50
- class="sc-kgoBCf gsnOug"
51
- />
52
- </div>
53
- <div
54
- class="sc-kAzzGY cABvZX"
55
- >
56
- 6.30am
57
- </div>
58
- </div>
59
- </div>
60
- <h2
61
- class="sc-kGXeez crUIWF"
62
- >
63
- This is the headline
64
- </h2>
65
- </div>
66
- </div>
67
- </body>
68
- `;