@financial-times/cp-content-pipeline-ui 12.3.1 → 12.3.3

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/CHANGELOG.md +22 -0
  2. package/lib/components/Topper/Topper.spec.js +21 -0
  3. package/lib/components/Topper/Topper.spec.js.map +1 -1
  4. package/package.json +3 -3
  5. package/src/components/Topper/Topper.spec.tsx +30 -1
  6. package/src/components/Topper/client/_elements.scss +4 -2
  7. package/src/components/Topper/client/_layout.scss +4 -2
  8. package/src/components/Topper/client/themes/_full-bleed-offset.scss +4 -2
  9. package/tsconfig.tsbuildinfo +1 -1
package/CHANGELOG.md CHANGED
@@ -574,6 +574,28 @@
574
574
  * @financial-times/cp-content-pipeline-client bumped from ^3.7.2 to ^3.7.3
575
575
  * @financial-times/cp-content-pipeline-schema bumped from ^2.10.1 to ^2.10.2
576
576
 
577
+ ## [12.3.3](https://github.com/Financial-Times/cp-content-pipeline/compare/cp-content-pipeline-ui-v12.3.2...cp-content-pipeline-ui-v12.3.3) (2026-06-18)
578
+
579
+
580
+ ### Bug Fixes
581
+
582
+ * ci-3665 iOS problem with vw units ([e5b757a](https://github.com/Financial-Times/cp-content-pipeline/commit/e5b757af5fae1b56d61ad0d80710fe9733b14c32))
583
+
584
+ ## [12.3.2](https://github.com/Financial-Times/cp-content-pipeline/compare/cp-content-pipeline-ui-v12.3.1...cp-content-pipeline-ui-v12.3.2) (2026-06-18)
585
+
586
+
587
+ ### Bug Fixes
588
+
589
+ * **partner-content:** suppress topper editorial concepts ([eff5bc3](https://github.com/Financial-Times/cp-content-pipeline/commit/eff5bc3e31018359ce9851bff22a8c07eea86b83))
590
+
591
+
592
+ ### Dependencies
593
+
594
+ * The following workspace dependencies were updated
595
+ * devDependencies
596
+ * @financial-times/cp-content-pipeline-client bumped from ^6.1.0 to ^6.1.1
597
+ * @financial-times/cp-content-pipeline-schema bumped from ^5.1.0 to ^5.2.0
598
+
577
599
  ## [12.3.1](https://github.com/Financial-Times/cp-content-pipeline/compare/cp-content-pipeline-ui-v12.3.0...cp-content-pipeline-ui-v12.3.1) (2026-06-15)
578
600
 
579
601
 
package/lib/components/Topper/Topper.spec.js CHANGED
@@ -37,5 +37,26 @@ describe('Topper component', () => {
37
37
  } }));
38
38
  expect(asFragment()).toMatchSnapshot();
39
39
  });
40
+ it('does not render topic tags or follow controls when partner topper concepts are suppressed', () => {
41
+ const FollowButtonSlot = jest.fn(() => react_1.default.createElement("button", null, "Follow topic"));
42
+ const partnerContent = {
43
+ __typename: 'Article',
44
+ title: 'Partner content headline',
45
+ clientName: 'Partner client',
46
+ topper: {
47
+ __typename: 'BasicTopper',
48
+ headline: 'Partner content headline',
49
+ backgroundColour: 'paper',
50
+ displayConcept: null,
51
+ genreConcept: null,
52
+ headerSlot: { type: 'partner-content' },
53
+ },
54
+ };
55
+ const { container, queryByText } = (0, react_2.render)(react_1.default.createElement(index_1.default, { content: partnerContent, followButtonSlot: FollowButtonSlot }));
56
+ expect(react_2.screen.getByText('Partner Content')).toBeTruthy();
57
+ expect(container.querySelector('.o-topper__topic')).toBeNull();
58
+ expect(queryByText('Follow topic')).toBeNull();
59
+ expect(FollowButtonSlot).not.toHaveBeenCalled();
60
+ });
40
61
  });
41
62
  //# sourceMappingURL=Topper.spec.js.map
package/lib/components/Topper/Topper.spec.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Topper.spec.js","sourceRoot":"","sources":["../../../src/components/Topper/Topper.spec.tsx"],"names":[],"mappings":";AAAA,uDAAuD;;;;;AAEvD,kDAAyB;AACzB,kDAA+C;AAC/C,oDAA4B;AAE5B,QAAQ,CAAC,kBAAkB,EAAE,GAAG,EAAE;IAChC,MAAM,MAAM,GAAG;QACb,UAAU,EAAE,eAAe;QAC3B,QAAQ,EAAE,eAAe;QACzB,gBAAgB,EAAE,OAAO;QACzB,UAAU,EAAE;YACV;gBACE,SAAS,EAAE,UAAU;aACtB;SACF;QACD,QAAQ,EACN,4EAA4E;KAC/E,CAAA;IAED,EAAE,CAAC,oDAAoD,EAAE,GAAG,EAAE;QAC5D,MAAM,EAAE,UAAU,EAAE,GAAG,IAAA,cAAM,EAC3B,8BAAC,eAAM,IACL,OAAO,EACL;gBACE,UAAU,EAAE,SAAS;gBACrB,KAAK,EAAE,eAAe;gBACtB,MAAM;gBACN,MAAM,EAAE,UAAU;aACZ,GAEV,CACH,CAAA;QAED,MAAM,CAAC,UAAU,EAAE,CAAC,CAAC,eAAe,EAAE,CAAA;IACxC,CAAC,CAAC,CAAA;IAEF,EAAE,CAAC,qDAAqD,EAAE,GAAG,EAAE;QAC7D,MAAM,EAAE,UAAU,EAAE,GAAG,IAAA,cAAM,EAC3B,8BAAC,eAAM,IACL,OAAO,EACL;gBACE,UAAU,EAAE,SAAS;gBACrB,KAAK,EAAE,eAAe;gBACtB,MAAM;gBACN,YAAY;aACN,GAEV,CACH,CAAA;QAED,MAAM,CAAC,UAAU,EAAE,CAAC,CAAC,eAAe,EAAE,CAAA;IACxC,CAAC,CAAC,CAAA;AACJ,CAAC,CAAC,CAAA"}
1
+ {"version":3,"file":"Topper.spec.js","sourceRoot":"","sources":["../../../src/components/Topper/Topper.spec.tsx"],"names":[],"mappings":";AAAA,uDAAuD;;;;;AAEvD,kDAAyB;AACzB,kDAAuD;AACvD,oDAA4B;AAE5B,QAAQ,CAAC,kBAAkB,EAAE,GAAG,EAAE;IAChC,MAAM,MAAM,GAAG;QACb,UAAU,EAAE,eAAe;QAC3B,QAAQ,EAAE,eAAe;QACzB,gBAAgB,EAAE,OAAO;QACzB,UAAU,EAAE;YACV;gBACE,SAAS,EAAE,UAAU;aACtB;SACF;QACD,QAAQ,EACN,4EAA4E;KAC/E,CAAA;IAED,EAAE,CAAC,oDAAoD,EAAE,GAAG,EAAE;QAC5D,MAAM,EAAE,UAAU,EAAE,GAAG,IAAA,cAAM,EAC3B,8BAAC,eAAM,IACL,OAAO,EACL;gBACE,UAAU,EAAE,SAAS;gBACrB,KAAK,EAAE,eAAe;gBACtB,MAAM;gBACN,MAAM,EAAE,UAAU;aACZ,GAEV,CACH,CAAA;QAED,MAAM,CAAC,UAAU,EAAE,CAAC,CAAC,eAAe,EAAE,CAAA;IACxC,CAAC,CAAC,CAAA;IAEF,EAAE,CAAC,qDAAqD,EAAE,GAAG,EAAE;QAC7D,MAAM,EAAE,UAAU,EAAE,GAAG,IAAA,cAAM,EAC3B,8BAAC,eAAM,IACL,OAAO,EACL;gBACE,UAAU,EAAE,SAAS;gBACrB,KAAK,EAAE,eAAe;gBACtB,MAAM;gBACN,YAAY;aACN,GAEV,CACH,CAAA;QAED,MAAM,CAAC,UAAU,EAAE,CAAC,CAAC,eAAe,EAAE,CAAA;IACxC,CAAC,CAAC,CAAA;IAEF,EAAE,CAAC,2FAA2F,EAAE,GAAG,EAAE;QACnG,MAAM,gBAAgB,GAAG,IAAI,CAAC,EAAE,CAAC,GAAG,EAAE,CAAC,6DAA6B,CAAC,CAAA;QACrE,MAAM,cAAc,GAAG;YACrB,UAAU,EAAE,SAAS;YACrB,KAAK,EAAE,0BAA0B;YACjC,UAAU,EAAE,gBAAgB;YAC5B,MAAM,EAAE;gBACN,UAAU,EAAE,aAAa;gBACzB,QAAQ,EAAE,0BAA0B;gBACpC,gBAAgB,EAAE,OAAO;gBACzB,cAAc,EAAE,IAAI;gBACpB,YAAY,EAAE,IAAI;gBAClB,UAAU,EAAE,EAAE,IAAI,EAAE,iBAAiB,EAAE;aACxC;SACF,CAAA;QAED,MAAM,EAAE,SAAS,EAAE,WAAW,EAAE,GAAG,IAAA,cAAM,EACvC,8BAAC,eAAM,IACL,OAAO,EAAE,cAAqB,EAC9B,gBAAgB,EAAE,gBAAgB,GAClC,CACH,CAAA;QAED,MAAM,CAAC,cAAM,CAAC,SAAS,CAAC,iBAAiB,CAAC,CAAC,CAAC,UAAU,EAAE,CAAA;QACxD,MAAM,CAAC,SAAS,CAAC,aAAa,CAAC,kBAAkB,CAAC,CAAC,CAAC,QAAQ,EAAE,CAAA;QAC9D,MAAM,CAAC,WAAW,CAAC,cAAc,CAAC,CAAC,CAAC,QAAQ,EAAE,CAAA;QAC9C,MAAM,CAAC,gBAAgB,CAAC,CAAC,GAAG,CAAC,gBAAgB,EAAE,CAAA;IACjD,CAAC,CAAC,CAAA;AACJ,CAAC,CAAC,CAAA"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@financial-times/cp-content-pipeline-ui",
3
- "version": "12.3.1",
3
+ "version": "12.3.3",
4
4
  "description": "",
5
5
  "main": "lib/index.js",
6
6
  "scripts": {
@@ -17,8 +17,8 @@
17
17
  "@babel/preset-react": "^7.22.5",
18
18
  "@dotcom-tool-kit/npm": "^5.0.1",
19
19
  "@financial-times/content-tree": "^0.12.0",
20
- "@financial-times/cp-content-pipeline-client": "^6.1.0",
21
- "@financial-times/cp-content-pipeline-schema": "^5.1.0",
20
+ "@financial-times/cp-content-pipeline-client": "^6.1.1",
21
+ "@financial-times/cp-content-pipeline-schema": "^5.2.0",
22
22
  "@financial-times/cp-content-pipeline-styles": "^4.8.2",
23
23
  "@financial-times/n-scrollytelling-image": "^1.1.0",
24
24
  "@financial-times/o-grid": "^6.1.8",
package/src/components/Topper/Topper.spec.tsx CHANGED
@@ -1,7 +1,7 @@
1
1
  /* eslint-disable @typescript-eslint/no-explicit-any */
2
2
 
3
3
  import React from 'react'
4
- import { render } from '@testing-library/react'
4
+ import { render, screen } from '@testing-library/react'
5
5
  import Topper from './index'
6
6
 
7
7
  describe('Topper component', () => {
@@ -51,4 +51,33 @@ describe('Topper component', () => {
51
51
 
52
52
  expect(asFragment()).toMatchSnapshot()
53
53
  })
54
+
55
+ it('does not render topic tags or follow controls when partner topper concepts are suppressed', () => {
56
+ const FollowButtonSlot = jest.fn(() => <button>Follow topic</button>)
57
+ const partnerContent = {
58
+ __typename: 'Article',
59
+ title: 'Partner content headline',
60
+ clientName: 'Partner client',
61
+ topper: {
62
+ __typename: 'BasicTopper',
63
+ headline: 'Partner content headline',
64
+ backgroundColour: 'paper',
65
+ displayConcept: null,
66
+ genreConcept: null,
67
+ headerSlot: { type: 'partner-content' },
68
+ },
69
+ }
70
+
71
+ const { container, queryByText } = render(
72
+ <Topper
73
+ content={partnerContent as any}
74
+ followButtonSlot={FollowButtonSlot}
75
+ />
76
+ )
77
+
78
+ expect(screen.getByText('Partner Content')).toBeTruthy()
79
+ expect(container.querySelector('.o-topper__topic')).toBeNull()
80
+ expect(queryByText('Follow topic')).toBeNull()
81
+ expect(FollowButtonSlot).not.toHaveBeenCalled()
82
+ })
54
83
  })
package/src/components/Topper/client/_elements.scss CHANGED
@@ -62,9 +62,11 @@
62
62
  position: absolute;
63
63
  text-shadow: 1px 1px 1px var(--o3-color-palette-slate);
64
64
  text-align: right;
65
- width: 100vw;
65
+ width: 100vw; // pre-ios 16
66
+ width: 100dvw;
66
67
  margin-left: 50%;
67
- left: -50vw;
68
+ left: -50vw; // pre-ios 16
69
+ left: -50dvw;
68
70
  box-sizing: border-box;
69
71
  padding: 5px 10px;
70
72
  transform: translate(0, -100%);
package/src/components/Topper/client/_layout.scss CHANGED
@@ -33,8 +33,10 @@
33
33
  @mixin _oTopperBackground {
34
34
  grid-row: 1 / span 5;
35
35
  grid-column: 1 / span 6;
36
- width: 100vw;
37
- margin-left: -50vw;
36
+ width: 100vw; // pre-ios 16
37
+ margin-left: -50vw; // pre-ios 16
38
+ width: 100dvw;
39
+ margin-left: -50dvw;
38
40
  left: 50%;
39
41
  top: 0;
40
42
  height: 100%;
package/src/components/Topper/client/themes/_full-bleed-offset.scss CHANGED
@@ -89,8 +89,10 @@
89
89
 
90
90
  .o-topper__picture {
91
91
  position: relative;
92
- width: 100vw;
93
- margin-left: -50vw;
92
+ width: 100vw; // pre-ios 16
93
+ margin-left: -50vw; // pre-ios 16
94
+ width: 100dvw;
95
+ margin-left: -50dvw;
94
96
  left: 50%;
95
97
  height: 600px;
96
98
  display: block;