@financial-times/cp-content-pipeline-ui 12.9.2 → 12.10.0

package/CHANGELOG.md

@@ -574,6 +574,21 @@
     * @financial-times/cp-content-pipeline-client bumped from ^3.7.2 to ^3.7.3
     * @financial-times/cp-content-pipeline-schema bumped from ^2.10.1 to ^2.10.2
 
+## [12.10.0](https://github.com/Financial-Times/cp-content-pipeline/compare/cp-content-pipeline-ui-v12.9.2...cp-content-pipeline-ui-v12.10.0) (2026-07-06)
+
+
+### Features
+
+* use component override for Recommended Live Blog variant ([3468171](https://github.com/Financial-Times/cp-content-pipeline/commit/3468171560652ea2c61d62042ba7f323f5e107c0))
+
+
+### Dependencies
+
+* The following workspace dependencies were updated
+  * devDependencies
+    * @financial-times/cp-content-pipeline-client bumped from ^6.5.1 to ^6.6.0
+    * @financial-times/cp-content-pipeline-schema bumped from ^5.7.0 to ^5.8.0
+
 ## [12.9.2](https://github.com/Financial-Times/cp-content-pipeline/compare/cp-content-pipeline-ui-v12.9.1...cp-content-pipeline-ui-v12.9.2) (2026-07-02)
 
 

package/lib/components/LiveBlogPost/index.js

@@ -13,6 +13,7 @@ const Expander_1 = __importDefault(require("../Expander"));
 const classnames_1 = __importDefault(require("classnames"));
 const Headshot_1 = __importDefault(require("../Headshot"));
 const Byline_1 = __importDefault(require("../Byline"));
+const RecommendedLivePost_1 = __importDefault(require("../content-tree/RecommendedLivePost"));
 const TruncatedPost = ({ id, children, }) => {
     return (react_1.default.createElement("div", { "data-trackable": "truncated-post", "data-trackable-context-post": id, "data-trackable-category": "live-blog", className: "x-live-blog-post__body n-content-body article--body o3-type-body-content-base" },
         react_1.default.createElement(Expander_1.default, { expandLabel: "Expand post", collapseLabel: "Collapse post", onlyMobile: true, id: `truncated-${id}` }, children)));
@@ -43,7 +44,9 @@ publishedDate, articleUrl, showShareButtons = false, showShareLinkButton = false
     if (body && 'structured' in body) {
         // Content comes from cp-content-pipeline-api
         postBody = (react_1.default.createElement(TruncatedPost, { id: id },
-            react_1.default.createElement(RichText_1.default, { structuredContent: body.structured })));
+            react_1.default.createElement(RichText_1.default, { structuredContent: body.structured, components: {
+                    recommended: RecommendedLivePost_1.default,
+                } })));
     }
     else {
         // Content comes from next-es or wordpress

package/lib/components/LiveBlogPost/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/LiveBlogPost/index.tsx"],"names":[],"mappings":";;;;;;AAAA,kDAAyB;AACzB,kEAAyC;AACzC,wEAA+C;AAC/C,4DAAmC;AACnC,2DAAkC;AAClC,2DAAkC;AAClC,4DAAmC;AACnC,2DAAkC;AAClC,uDAA8B;AAW9B,MAAM,aAAa,GAAsD,CAAC,EACxE,EAAE,EACF,QAAQ,GACT,EAAE,EAAE;IACH,OAAO,CACL,yDACiB,gBAAgB,iCACF,EAAE,6BACP,WAAW,EACnC,SAAS,EAAC,+EAA+E;QAEzF,8BAAC,kBAAQ,IACP,WAAW,EAAC,aAAa,EACzB,aAAa,EAAC,eAAe,EAC7B,UAAU,EAAE,IAAI,EAChB,EAAE,EAAE,aAAa,EAAE,EAAE,IAEpB,QAAQ,CACA,CACP,CACP,CAAA;AACH,CAAC,CAAA;AAED,MAAM,iBAAiB,GAAG,GAAG,EAAE;IAC7B,MAAM,MAAM,GAAG,2BAA2B,CAAA;IAC1C,MAAM,SAAS,GAAG;QAChB,GAAG;QACH,YAAY;QACZ,IAAI;QACJ,oBAAoB;QACpB,sCAAsC;QACtC,2BAA2B;QAC3B,uBAAuB;QACvB,IAAI;QACJ,kBAAkB;QAClB,+BAA+B;KAChC,CAAA;IACD,OAAO,SAAS,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,GAAG,MAAM,IAAI,IAAI,EAAE,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAA;AAC/D,CAAC,CAAA;AAoBD,MAAM,YAAY,GAAgC,CAAC,EACjD,EAAE,EACF,MAAM,EAAE,4CAA4C;AACpD,KAAK,EACL,OAAO,EAAE,4CAA4C;AACrD,QAAQ,EAAE,eAAe;AACzB,IAAI,EAAE,sBAAsB;AAC5B,kBAAkB,EAAE,4CAA4C;AAChE,aAAa,EACb,UAAU,EACV,gBAAgB,GAAG,KAAK,EACxB,mBAAmB,GAAG,KAAK,EAC3B,MAAM,EACN,EAAE,EACF,QAAQ,EACR,UAAU,GAAG,EAAE,EACf,OAAO,GACR,EAAE,EAAE;IACH,IAAI,QAAQ,CAAA;IACZ,IAAI,IAAI,IAAI,YAAY,IAAI,IAAI,EAAE,CAAC;QACjC,6CAA6C;QAC7C,QAAQ,GAAG,CACT,8BAAC,aAAa,IAAC,EAAE,EAAE,EAAE;YACnB,8BAAC,kBAAQ,IAAC,iBAAiB,EAAE,IAAI,CAAC,UAAU,GAAI,CAClC,CACjB,CAAA;IACH,CAAC;SAAM,CAAC;QACN,0CAA0C;QAC1C,QAAQ,GAAG,CACT,uCACE,SAAS,EAAC,kFAAkF,EAC5F,uBAAuB,EAAE,EAAE,MAAM,EAAE,QAAQ,IAAI,OAAO,EAAE,GACxD,CACH,CAAA;QACD,qEAAqE;QACrE,QAAQ,GAAG,QAAQ,CAAC,CAAC,CAAC,CACpB,2DACmB,YAAY,EAC7B,SAAS,EAAC,YAAY,+BACI,GAAG,mCACE,iBAAiB,EAAE,2CACX,aAAa,0CACd,eAAe;YAErD,uCAAK,SAAS,EAAC,qBAAqB,IAAE,QAAQ,CAAO;YACrD,qCAAG,SAAS,EAAC,6CAA6C;gBACxD,wCAAM,SAAS,EAAC,4CAA4C,aAErD,CACL,CACA,CACP,CAAC,CAAC,CAAC,CACF,QAAQ,CACT,CAAA;IACH,CAAC;IAED,MAAM,MAAM,GAAG,OAAO,EAAE,CAAC,CAAC,CAAC,IAAI,IAAI,CAAA;IAEnC,OAAO,CACL,2CACE,SAAS,EAAE,IAAA,oBAAU,EAAC,kBAAkB,EAAE;YACxC,2BAA2B,EAAE,UAAU,CAAC,SAAS;YACjD,0BAA0B,EAAE,QAAQ;SACrC,CAAC,oBACc,QAAQ,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,WAAW,mCACvB,QAAQ,oCACP,UAAU,CAAC,SAAS,EACpD,EAAE,EAAE,QAAQ,EAAE,IAAI,MAAM,EAAE,sBACT,gBAAgB;QAEjC,uCAAK,SAAS,EAAC,4BAA4B;YACxC,CAAC,MAAM,EAAE,QAAQ,IAAI,CACpB,wCACE,SAAS,EAAE,IAAA,oBAAU,EAAC;oBACpB,4BAA4B,EAAE,QAAQ;oBACtC,gCAAgC,EAC9B,CAAC,QAAQ,IAAI,UAAU,CAAC,SAAS;iBACpC,CAAC,GACI,CACT;YACA,MAAM,EAAE,QAAQ,IAAI,UAAU,CAAC,SAAS,IAAI,CAC3C,8BAAC,kBAAQ,IACP,QAAQ,EAAE,MAAM,EAAE,QAAQ,EAC1B,SAAS,EAAE,MAAM,EAAE,SAAS,EAC5B,UAAU,EAAE,MAAM,EAAE,UAAU,EAC9B,SAAS,EAAE,oCAAoC,GAC/C,CACH;YACD,uCAAK,SAAS,EAAC,kCAAkC;gBAC/C,uCAAK,SAAS,EAAC,wBAAwB;oBACpC,UAAU,CAAC,SAAS,CAAC,CAAC,CAAC,CACtB,wCAAM,SAAS,EAAC,wEAAwE,mBAEjF,CACR,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,CACb,wCAAM,SAAS,EAAC,uCAAuC,oBAEhD,CACR,CAAC,CAAC,CAAC,CACF,EAAE,CACH;oBACA,CAAC,QAAQ,IAAI,CACZ;wBACE,8BAAC,mBAAS,IACR,kBAAkB,EAAE,aAAa,IAAI,kBAAkB,EACvD,QAAQ,EAAC,UAAU,GACnB,CACG,CACR,CACG;gBACN,uCAAK,SAAS,EAAC,0BAA0B;oBACvC,8BAAC,gBAAM,IAAC,iBAAiB,EAAE,MAAM,EAAE,YAAY,EAAE,KAAK,GAAI,CACtD,CACF;YACL,mBAAmB,IAAI,CACtB,8BAAC,yBAAe,IAAC,MAAM,EAAE,EAAE,IAAI,MAAM,EAAE,UAAU,EAAE,UAAU,GAAI,CAClE,CACG;QAEL,KAAK,IAAI,CACR,sCAAI,SAAS,EAAC,4CAA4C,IAAE,KAAK,CAAM,CACxE;QACA,QAAQ;QACT,uCAAK,SAAS,EAAC,4BAA4B,IACxC,gBAAgB,IAAI,CACnB,8BAAC,sBAAY,IACX,MAAM,EAAE,EAAE,IAAI,MAAM,EACpB,UAAU,EAAE,UAAU,EACtB,KAAK,EAAE,KAAK,GACZ,CACH,CACG;QACL,EAAS,CACF,CACX,CAAA;AACH,CAAC,CAAA;AAEQ,oCAAY"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/LiveBlogPost/index.tsx"],"names":[],"mappings":"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"}

package/lib/components/content-tree/Recommended/index.js

@@ -6,16 +6,13 @@ Object.defineProperty(exports, "__esModule", { value: true });
 const react_1 = __importDefault(require("react"));
 //HACK: worked around missing Teaser type by declaring a module x-teaser.d.ts
 const x_teaser_1 = require("@financial-times/x-teaser");
-const classnames_1 = __importDefault(require("classnames"));
-const Recommended = ({ content: { heading, teaser, isInLiveBlog }, }) => {
+const Recommended = ({ content: { heading, teaser }, }) => {
     if (!teaser) {
         return null;
     }
-    return (react_1.default.createElement("aside", { "aria-labelledby": "aside-label", className: (0, classnames_1.default)('n-content-recommended--single-story', {
-            'n-content-recommended--inset': !isInLiveBlog,
-        }), "data-component": "recommended" },
-        !isInLiveBlog && (react_1.default.createElement("p", { className: "n-content-recommended__title o3-type-body-highlight" }, heading)),
-        react_1.default.createElement(x_teaser_1.Teaser, { modifiers: isInLiveBlog ? ['post'] : ['stacked'], ...x_teaser_1.presets.SmallHeavy, ...teaser })));
+    return (react_1.default.createElement("aside", { "aria-labelledby": "aside-label", className: 'n-content-recommended--single-story n-content-recommended--inset', "data-component": "recommended" },
+        react_1.default.createElement("p", { className: "n-content-recommended__title o3-type-body-highlight" }, heading),
+        react_1.default.createElement(x_teaser_1.Teaser, { modifiers: ['stacked'], ...x_teaser_1.presets.SmallHeavy, ...teaser })));
 };
 exports.default = Recommended;
 //# sourceMappingURL=index.js.map

package/lib/components/content-tree/Recommended/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/content-tree/Recommended/index.tsx"],"names":[],"mappings":";;;;;AAAA,kDAAyB;AAEzB,6EAA6E;AAC7E,wDAA2D;AAC3D,4DAAmC;AAWnC,MAAM,WAAW,GAA+B,CAAC,EAC/C,OAAO,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,YAAY,EAAE,GAC3C,EAAE,EAAE;IACH,IAAI,CAAC,MAAM,EAAE,CAAC;QACZ,OAAO,IAAI,CAAA;IACb,CAAC;IAED,OAAO,CACL,4DACkB,aAAa,EAC7B,SAAS,EAAE,IAAA,oBAAU,EAAC,qCAAqC,EAAE;YAC3D,8BAA8B,EAAE,CAAC,YAAY;SAC9C,CAAC,oBACa,aAAa;QAE3B,CAAC,YAAY,IAAI,CAChB,qCAAG,SAAS,EAAC,qDAAqD,IAC/D,OAAO,CACN,CACL;QACD,8BAAC,iBAAM,IACL,SAAS,EAAE,YAAY,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,KAC5C,kBAAO,CAAC,UAAU,KAClB,MAAM,GACV,CACI,CACT,CAAA;AACH,CAAC,CAAA;AAED,kBAAe,WAAW,CAAA"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/content-tree/Recommended/index.tsx"],"names":[],"mappings":";;;;;AAAA,kDAAyB;AAEzB,6EAA6E;AAC7E,wDAA2D;AAW3D,MAAM,WAAW,GAA+B,CAAC,EAC/C,OAAO,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,GAC7B,EAAE,EAAE;IACH,IAAI,CAAC,MAAM,EAAE,CAAC;QACZ,OAAO,IAAI,CAAA;IACb,CAAC;IAED,OAAO,CACL,4DACkB,aAAa,EAC7B,SAAS,EACP,kEAAkE,oBAErD,aAAa;QAE5B,qCAAG,SAAS,EAAC,qDAAqD,IAC/D,OAAO,CACN;QACJ,8BAAC,iBAAM,IAAC,SAAS,EAAE,CAAC,SAAS,CAAC,KAAM,kBAAO,CAAC,UAAU,KAAM,MAAM,GAAI,CAChE,CACT,CAAA;AACH,CAAC,CAAA;AAED,kBAAe,WAAW,CAAA"}

package/lib/components/content-tree/RecommendedLivePost/index.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import { ContentProps } from '../../types';
+import type * as ComponentWorkarounds from '../Workarounds';
+interface RecommendedProps extends ContentProps<ComponentWorkarounds.Recommended> {
+}
+declare const RecommendedLivePost: React.FC<RecommendedProps>;
+export default RecommendedLivePost;

package/lib/components/content-tree/RecommendedLivePost/index.js

@@ -0,0 +1,17 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importDefault(require("react"));
+//HACK: worked around missing Teaser type by declaring a module x-teaser.d.ts
+const x_teaser_1 = require("@financial-times/x-teaser");
+const RecommendedLivePost = ({ content: { teaser }, }) => {
+    if (!teaser) {
+        return null;
+    }
+    return (react_1.default.createElement("aside", { "aria-labelledby": "aside-label", className: 'n-content-recommended--single-story', "data-component": "recommended" },
+        react_1.default.createElement(x_teaser_1.Teaser, { modifiers: ['post'], ...x_teaser_1.presets.SmallHeavy, ...teaser })));
+};
+exports.default = RecommendedLivePost;
+//# sourceMappingURL=index.js.map

package/lib/components/content-tree/RecommendedLivePost/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/content-tree/RecommendedLivePost/index.tsx"],"names":[],"mappings":";;;;;AAAA,kDAAyB;AAEzB,6EAA6E;AAC7E,wDAA2D;AAY3D,MAAM,mBAAmB,GAA+B,CAAC,EACvD,OAAO,EAAE,EAAE,MAAM,EAAE,GACpB,EAAE,EAAE;IACH,IAAI,CAAC,MAAM,EAAE,CAAC;QACZ,OAAO,IAAI,CAAA;IACb,CAAC;IAED,OAAO,CACL,4DACkB,aAAa,EAC7B,SAAS,EAAE,qCAAqC,oBACjC,aAAa;QAE5B,8BAAC,iBAAM,IAAC,SAAS,EAAE,CAAC,MAAM,CAAC,KAAM,kBAAO,CAAC,UAAU,KAAM,MAAM,GAAI,CAC7D,CACT,CAAA;AACH,CAAC,CAAA;AAED,kBAAe,mBAAmB,CAAA"}

package/lib/components/content-tree/Workarounds.d.ts

@@ -30,7 +30,7 @@ type ReadonlyArray<T> = T extends Array<infer Item> ? readonly Item[] : T;
 export type TeaserConcept = PartialToMaybe<ReadonlyArrays<SetOptional<ContentTree.TeaserConcept, 'apiUrl' | 'directType' | 'predicate' | 'prefLabel' | 'type' | 'types'>>>;
 export type Image = PartialToMaybe<ReadonlyArrays<LiteralToPrimitiveDeep<SetOptional<ContentTree.Image, 'width' | 'height' | 'sourceSet'>>>>;
 export type Teaser = PartialToMaybeDeep<LiteralToPrimitiveDeep<SetOptional<SetFieldType<SetFieldType<ContentTree.Teaser, 'metaLink' | 'metaAltLink', TeaserConcept>, 'image', Omit<Image, 'id' | 'format'>>, 'type' | 'metaLink' | 'metaAltLink' | 'indicators' | 'image'>>>;
-export type Recommended = PartialToMaybe<ContentTreeWorkarounds.Recommended & {
+export type Recommended = PartialToMaybe<ContentTree.transit.Recommended & {
     teaser?: Teaser;
 }>;
 export type RecommendedList = PartialToMaybe<ReadonlyArrays<Omit<ContentTree.RecommendedList, 'children'> & {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@financial-times/cp-content-pipeline-ui",
-  "version": "12.9.2",
+  "version": "12.10.0",
   "description": "",
   "main": "lib/index.js",
   "scripts": {
@@ -17,8 +17,8 @@
     "@babel/preset-react": "^7.22.5",
     "@dotcom-tool-kit/npm": "^5.0.1",
     "@financial-times/content-tree": "^0.17.0",
-    "@financial-times/cp-content-pipeline-client": "^6.5.1",
-    "@financial-times/cp-content-pipeline-schema": "^5.7.0",
+    "@financial-times/cp-content-pipeline-client": "^6.6.0",
+    "@financial-times/cp-content-pipeline-schema": "^5.8.0",
     "@financial-times/cp-content-pipeline-styles": "^4.8.2",
     "@financial-times/n-scrollytelling-image": "^1.1.0",
     "@financial-times/o-grid": "^6.1.8",

package/src/components/LiveBlogPost/index.tsx

@@ -7,6 +7,7 @@ import Expander from '../Expander'
 import classnames from 'classnames'
 import Headshot from '../Headshot'
 import Byline from '../Byline'
+import RecommendedLivePost from '../content-tree/RecommendedLivePost'
 import { StructuredTreeFragment } from '@financial-times/cp-content-pipeline-client'
 
 /* eslint-disable @typescript-eslint/no-explicit-any */
@@ -98,7 +99,12 @@ const LiveBlogPost: React.FC<LiveBlogPostProps> = ({
     // Content comes from cp-content-pipeline-api
     postBody = (
       <TruncatedPost id={id}>
-        <RichText structuredContent={body.structured} />
+        <RichText
+          structuredContent={body.structured}
+          components={{
+            recommended: RecommendedLivePost,
+          }}
+        />
       </TruncatedPost>
     )
   } else {

package/src/components/content-tree/Recommended/index.tsx

@@ -2,7 +2,6 @@ import React from 'react'
 
 //HACK: worked around missing Teaser type by declaring a module x-teaser.d.ts
 import { presets, Teaser } from '@financial-times/x-teaser'
-import classnames from 'classnames'
 import { ContentProps } from '../../types'
 import type * as ComponentWorkarounds from '../Workarounds'
 
@@ -14,7 +13,7 @@ interface RecommendedProps
   extends ContentProps<ComponentWorkarounds.Recommended> {}
 
 const Recommended: React.FC<RecommendedProps> = ({
-  content: { heading, teaser, isInLiveBlog },
+  content: { heading, teaser },
 }) => {
   if (!teaser) {
     return null
@@ -23,21 +22,15 @@ const Recommended: React.FC<RecommendedProps> = ({
   return (
     <aside
       aria-labelledby="aside-label"
-      className={classnames('n-content-recommended--single-story', {
-        'n-content-recommended--inset': !isInLiveBlog,
-      })}
+      className={
+        'n-content-recommended--single-story n-content-recommended--inset'
+      }
       data-component="recommended"
     >
-      {!isInLiveBlog && (
-        <p className="n-content-recommended__title o3-type-body-highlight">
-          {heading}
-        </p>
-      )}
-      <Teaser
-        modifiers={isInLiveBlog ? ['post'] : ['stacked']}
-        {...presets.SmallHeavy}
-        {...teaser}
-      />
+      <p className="n-content-recommended__title o3-type-body-highlight">
+        {heading}
+      </p>
+      <Teaser modifiers={['stacked']} {...presets.SmallHeavy} {...teaser} />
     </aside>
   )
 }

package/src/components/content-tree/RecommendedLivePost/index.tsx

@@ -0,0 +1,34 @@
+import React from 'react'
+
+//HACK: worked around missing Teaser type by declaring a module x-teaser.d.ts
+import { presets, Teaser } from '@financial-times/x-teaser'
+import { ContentProps } from '../../types'
+import type * as ComponentWorkarounds from '../Workarounds'
+
+// Renders an "inset" variant Recommended teaser component
+// to be used in Live Blogs
+// `<Teaser>` is imported from x-dash
+// https://github.com/Financial-Times/x-dash/tree/main/components/x-teaser)
+
+interface RecommendedProps
+  extends ContentProps<ComponentWorkarounds.Recommended> {}
+
+const RecommendedLivePost: React.FC<RecommendedProps> = ({
+  content: { teaser },
+}) => {
+  if (!teaser) {
+    return null
+  }
+
+  return (
+    <aside
+      aria-labelledby="aside-label"
+      className={'n-content-recommended--single-story'}
+      data-component="recommended"
+    >
+      <Teaser modifiers={['post']} {...presets.SmallHeavy} {...teaser} />
+    </aside>
+  )
+}
+
+export default RecommendedLivePost

package/src/components/content-tree/Workarounds.ts

@@ -87,7 +87,7 @@ export type Teaser = PartialToMaybeDeep<
 >
 
 export type Recommended = PartialToMaybe<
-  ContentTreeWorkarounds.Recommended & {
+  ContentTree.transit.Recommended & {
     teaser?: Teaser
   }
 >