@newskit-render/my-account 6.9.2-alpha.2 → 6.10.0-alpha.0

package/dist/cjs/Components/Elements/PaymentItem/PaymentItem.js

@@ -31,7 +31,7 @@ var newskit_1 = require("newskit");
 var PaymentIcon_1 = __importDefault(require("../PaymentIcon"));
 var types_1 = require("../../Sections/Form/Payment/types");
 var getType = function (type, cardType, walletType) {
-    var paymentType = type ? type.toLowerCase() : '';
+    var paymentType = type === null || type === void 0 ? void 0 : type.toLowerCase();
     if (paymentType === types_1.PaymentTypes.creditcard ||
         paymentType === types_1.PaymentTypes.debitcard) {
         return cardType === null || cardType === void 0 ? void 0 : cardType.toLowerCase();
@@ -60,8 +60,8 @@ var PaymentItem = function (_a) {
         _b[types_1.WalletTypes.google_pay] = cardNumber,
         _b);
     return (react_1.default.createElement(newskit_1.Stack, { flow: 'horizontal-center' },
-        react_1.default.createElement(PaymentIcon_1.default, { type: paymentType }),
-        react_1.default.createElement(newskit_1.TextBlock, { typographyPreset: "utilityBody020", style: { paddingBottom: '4px' } }, paymentTextMapper[paymentType] || '')));
+        paymentType ? react_1.default.createElement(PaymentIcon_1.default, { type: paymentType }) : null,
+        react_1.default.createElement(newskit_1.TextBlock, { typographyPreset: "utilityBody020", style: { paddingBottom: '4px' } }, paymentType ? paymentTextMapper[paymentType] : '')));
 };
 exports.default = PaymentItem;
 //# sourceMappingURL=PaymentItem.js.map

package/dist/cjs/Components/Elements/PaymentItem/PaymentItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"PaymentItem.js","sourceRoot":"","sources":["../../../../../src/Components/Elements/PaymentItem/PaymentItem.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,6CAAsC;AACtC,mCAA0C;AAC1C,+DAAwC;AACxC,2DAI0C;AAkB1C,IAAM,OAAO,GAAG,UACd,IAAa,EACb,QAAiB,EACjB,UAAmB;IAEnB,IAAM,WAAW,GAAG,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,WAAW,EAAE,CAAC,CAAC,CAAC,EAAE,CAAA;IAClD,IACE,WAAW,KAAK,oBAAY,CAAC,UAAU;QACvC,WAAW,KAAK,oBAAY,CAAC,SAAS,EACtC;QACA,OAAO,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAE,WAAW,EAAe,CAAA;KAC5C;IAED,IAAI,WAAW,KAAK,oBAAY,CAAC,8BAA8B,EAAE;QAC/D,OAAO,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,WAAW,EAAiB,CAAA;KAChD;IAED,OAAO,WAA2B,CAAA;AACpC,CAAC,CAAA;AAED,IAAM,WAAW,GAA+B,UAAC,EAOhD;;QANC,IAAI,UAAA,EACJ,QAAQ,cAAA,EACR,UAAU,gBAAA,EACV,6BAA6B,mCAAA,EAC7B,UAAU,gBAAA,EACV,WAAW,iBAAA;IAEX,IAAM,WAAW,GAAG,IAAA,eAAO,EACzB,cAAM,OAAA,OAAO,CAAC,IAAI,EAAE,QAAQ,EAAE,UAAU,CAAC,EAAnC,CAAmC,EACzC,CAAC,IAAI,EAAE,QAAQ,EAAE,UAAU,CAAC,CAC7B,CAAA;IACD,IAAM,iBAAiB;QACrB,GAAC,iBAAS,CAAC,UAAU,IAAG,UAAU;QAClC,GAAC,iBAAS,CAAC,IAAI,IAAG,UAAU;QAC5B,GAAC,iBAAS,CAAC,QAAQ,IAAG,UAAU;QAChC,GAAC,iBAAS,CAAC,MAAM,IAAG,UAAU;QAC9B,GAAC,iBAAS,CAAC,eAAe,IAAG,UAAU;QACvC,GAAC,iBAAS,CAAC,IAAI,IAAG,UAAU;QAC5B,GAAC,iBAAS,CAAC,GAAG,IAAG,UAAU;QAC3B,GAAC,iBAAS,CAAC,QAAQ,IAAG,UAAU;QAChC,GAAC,oBAAY,CAAC,MAAM,IAAG,WAAW;QAClC,GAAC,oBAAY,CAAC,YAAY,IAAG,6BAA6B;QAC1D,GAAC,mBAAW,CAAC,SAAS,IAAG,UAAU;QACnC,GAAC,mBAAW,CAAC,UAAU,IAAG,UAAU;WACrC,CAAA;IACD,OAAO,CACL,8BAAC,eAAK,IAAC,IAAI,EAAE,mBAAmB;QAC9B,8BAAC,qBAAW,IAAC,IAAI,EAAE,WAAW,GAAgB;QAC9C,8BAAC,mBAAS,IACR,gBAAgB,EAAC,gBAAgB,EACjC,KAAK,EAAE,EAAE,aAAa,EAAE,KAAK,EAAE,IAE9B,iBAAiB,CAAC,WAAW,CAAC,IAAI,EAAE,CAC3B,CACN,CACT,CAAA;AACH,CAAC,CAAA;AAED,kBAAe,WAAW,CAAA"}
+{"version":3,"file":"PaymentItem.js","sourceRoot":"","sources":["../../../../../src/Components/Elements/PaymentItem/PaymentItem.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,6CAAsC;AACtC,mCAA0C;AAC1C,+DAAwC;AACxC,2DAI0C;AAkB1C,IAAM,OAAO,GAAG,UACd,IAAa,EACb,QAAiB,EACjB,UAAmB;IAEnB,IAAM,WAAW,GAAG,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,WAAW,EAAE,CAAA;IACvC,IACE,WAAW,KAAK,oBAAY,CAAC,UAAU;QACvC,WAAW,KAAK,oBAAY,CAAC,SAAS,EACtC;QACA,OAAO,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAE,WAAW,EAAe,CAAA;KAC5C;IAED,IAAI,WAAW,KAAK,oBAAY,CAAC,8BAA8B,EAAE;QAC/D,OAAO,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,WAAW,EAAiB,CAAA;KAChD;IAED,OAAO,WAAuC,CAAA;AAChD,CAAC,CAAA;AAED,IAAM,WAAW,GAA+B,UAAC,EAOhD;;QANC,IAAI,UAAA,EACJ,QAAQ,cAAA,EACR,UAAU,gBAAA,EACV,6BAA6B,mCAAA,EAC7B,UAAU,gBAAA,EACV,WAAW,iBAAA;IAEX,IAAM,WAAW,GAAG,IAAA,eAAO,EACzB,cAAM,OAAA,OAAO,CAAC,IAAI,EAAE,QAAQ,EAAE,UAAU,CAAC,EAAnC,CAAmC,EACzC,CAAC,IAAI,EAAE,QAAQ,EAAE,UAAU,CAAC,CAC7B,CAAA;IACD,IAAM,iBAAiB;QACrB,GAAC,iBAAS,CAAC,UAAU,IAAG,UAAU;QAClC,GAAC,iBAAS,CAAC,IAAI,IAAG,UAAU;QAC5B,GAAC,iBAAS,CAAC,QAAQ,IAAG,UAAU;QAChC,GAAC,iBAAS,CAAC,MAAM,IAAG,UAAU;QAC9B,GAAC,iBAAS,CAAC,eAAe,IAAG,UAAU;QACvC,GAAC,iBAAS,CAAC,IAAI,IAAG,UAAU;QAC5B,GAAC,iBAAS,CAAC,GAAG,IAAG,UAAU;QAC3B,GAAC,iBAAS,CAAC,QAAQ,IAAG,UAAU;QAChC,GAAC,oBAAY,CAAC,MAAM,IAAG,WAAW;QAClC,GAAC,oBAAY,CAAC,YAAY,IAAG,6BAA6B;QAC1D,GAAC,mBAAW,CAAC,SAAS,IAAG,UAAU;QACnC,GAAC,mBAAW,CAAC,UAAU,IAAG,UAAU;WACrC,CAAA;IACD,OAAO,CACL,8BAAC,eAAK,IAAC,IAAI,EAAE,mBAAmB;QAC7B,WAAW,CAAC,CAAC,CAAC,8BAAC,qBAAW,IAAC,IAAI,EAAE,WAAW,GAAgB,CAAC,CAAC,CAAC,IAAI;QACpE,8BAAC,mBAAS,IACR,gBAAgB,EAAC,gBAAgB,EACjC,KAAK,EAAE,EAAE,aAAa,EAAE,KAAK,EAAE,IAE9B,WAAW,CAAC,CAAC,CAAC,iBAAiB,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,EAAE,CACxC,CACN,CACT,CAAA;AACH,CAAC,CAAA;AAED,kBAAe,WAAW,CAAA"}

package/dist/cjs/Components/Templates/PaymentMethodsRender.js

@@ -16,15 +16,19 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.PaymentMethodsRender = void 0;
 var react_1 = __importDefault(require("react"));
+var newskit_1 = require("newskit");
 var context_1 = require("../../context");
 var types_1 = require("../../context/types");
 var shared_components_1 = require("@newskit-render/shared-components");
 var helpers_1 = require("../../helpers");
 var PaymentMethodsRender = function () {
-    var _a = (0, context_1.useAccountContext)(types_1.ContextName.paymentMethods), header = _a.header, items = _a.items, listItemProps = _a.listItemProps, listCellProps = _a.listCellProps, baseUrl = _a.baseUrl;
+    var _a;
+    var _b = (0, context_1.useAccountContext)(types_1.ContextName.paymentMethods), header = _b.header, items = _b.items, listItemProps = _b.listItemProps, listCellProps = _b.listCellProps, baseUrl = _b.baseUrl, userData = _b.userData, infoPanel = _b.infoPanel;
+    var filteredItems = (0, shared_components_1.filterListItems)(items, userData);
     return (react_1.default.createElement(react_1.default.Fragment, null,
         react_1.default.createElement(shared_components_1.Header, __assign({}, header)),
-        react_1.default.createElement(shared_components_1.ContentListView, null, items.map(function (item, i) { return (react_1.default.createElement(shared_components_1.ListItem, { key: i, item: __assign(__assign({}, item), { href: (0, helpers_1.replaceBaseURL)(baseUrl, item.href) }), listItemProps: __assign(__assign({}, listItemProps), { 'data-testid': "content-list-item-".concat(i) }), listCellProps: listCellProps })); }))));
+        react_1.default.createElement(shared_components_1.ContentListView, null, filteredItems.map(function (item, i) { return (react_1.default.createElement(shared_components_1.ListItem, { key: i, item: __assign(__assign({}, item), { href: (0, helpers_1.replaceBaseURL)(baseUrl, item.href) }), listItemProps: __assign(__assign({}, listItemProps), { 'data-testid': "content-list-item-".concat(i) }), listCellProps: listCellProps })); })),
+        ((_a = userData.paymentFailure) === null || _a === void 0 ? void 0 : _a.active) ? (react_1.default.createElement(newskit_1.InlineMessage, { icon: infoPanel.icon, title: infoPanel.title, children: infoPanel.children, overrides: infoPanel.overrides || {} })) : null));
 };
 exports.PaymentMethodsRender = PaymentMethodsRender;
 //# sourceMappingURL=PaymentMethodsRender.js.map

package/dist/cjs/Components/Templates/PaymentMethodsRender.js.map

@@ -1 +1 @@
-{"version":3,"file":"PaymentMethodsRender.js","sourceRoot":"","sources":["../../../../src/Components/Templates/PaymentMethodsRender.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAAA,gDAAyB;AACzB,yCAAiD;AACjD,6CAA+E;AAC/E,uEAI0C;AAC1C,yCAA8C;AAEvC,IAAM,oBAAoB,GAAa;IACtC,IAAA,KACJ,IAAA,2BAAiB,EACf,mBAAW,CAAC,cAAc,CACK,EAH3B,MAAM,YAAA,EAAE,KAAK,WAAA,EAAE,aAAa,mBAAA,EAAE,aAAa,mBAAA,EAAE,OAAO,aAGzB,CAAA;IAEnC,OAAO,CACL;QACE,8BAAC,0BAAM,eAAK,MAAM,EAAI;QACtB,8BAAC,mCAAe,QACb,KAAK,CAAC,GAAG,CAAC,UAAC,IAAI,EAAE,CAAC,IAAK,OAAA,CACtB,8BAAC,4BAAQ,IACP,GAAG,EAAE,CAAC,EACN,IAAI,wBACC,IAAI,KACP,IAAI,EAAE,IAAA,wBAAc,EAAC,OAAO,EAAE,IAAI,CAAC,IAAI,CAAC,KAE1C,aAAa,wBACR,aAAa,KAChB,aAAa,EAAE,4BAAqB,CAAC,CAAE,KAEzC,aAAa,EAAE,aAAa,GAC5B,CACH,EAbuB,CAavB,CAAC,CACc,CACjB,CACJ,CAAA;AACH,CAAC,CAAA;AA3BY,QAAA,oBAAoB,wBA2BhC"}
+{"version":3,"file":"PaymentMethodsRender.js","sourceRoot":"","sources":["../../../../src/Components/Templates/PaymentMethodsRender.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAAA,gDAAyB;AACzB,mCAAuC;AACvC,yCAAiD;AACjD,6CAA+E;AAC/E,uEAK0C;AAC1C,yCAA8C;AAGvC,IAAM,oBAAoB,GAAa;;IACtC,IAAA,KAQF,IAAA,2BAAiB,EACnB,mBAAW,CAAC,cAAc,CACK,EAT/B,MAAM,YAAA,EACN,KAAK,WAAA,EACL,aAAa,mBAAA,EACb,aAAa,mBAAA,EACb,OAAO,aAAA,EACP,QAAQ,cAAA,EACR,SAAS,eAGsB,CAAA;IAEjC,IAAM,aAAa,GAAG,IAAA,mCAAe,EAAW,KAAK,EAAE,QAAQ,CAAC,CAAA;IAChE,OAAO,CACL;QACE,8BAAC,0BAAM,eAAK,MAAM,EAAI;QACtB,8BAAC,mCAAe,QACb,aAAa,CAAC,GAAG,CAAC,UAAC,IAAI,EAAE,CAAC,IAAK,OAAA,CAC9B,8BAAC,4BAAQ,IACP,GAAG,EAAE,CAAC,EACN,IAAI,wBACC,IAAI,KACP,IAAI,EAAE,IAAA,wBAAc,EAAC,OAAO,EAAE,IAAI,CAAC,IAAI,CAAC,KAE1C,aAAa,wBACR,aAAa,KAChB,aAAa,EAAE,4BAAqB,CAAC,CAAE,KAEzC,aAAa,EAAE,aAAa,GAC5B,CACH,EAb+B,CAa/B,CAAC,CACc;QACjB,CAAA,MAAA,QAAQ,CAAC,cAAc,0CAAE,MAAM,EAAC,CAAC,CAAC,CACjC,8BAAC,uBAAa,IACZ,IAAI,EAAE,SAAS,CAAC,IAAI,EACpB,KAAK,EAAE,SAAS,CAAC,KAAK,EACtB,QAAQ,EAAE,SAAS,CAAC,QAAQ,EAC5B,SAAS,EAAE,SAAS,CAAC,SAAS,IAAI,EAAE,GACpC,CACH,CAAC,CAAC,CAAC,IAAI,CACP,CACJ,CAAA;AACH,CAAC,CAAA;AA3CY,QAAA,oBAAoB,wBA2ChC"}

package/dist/cjs/Components/index.d.ts

@@ -1 +1,2 @@
+export { IconCreditCard, IconDirectDebit } from './Elements/Icons';
 export { PaymentProvider } from './Sections/Form/Payment';

package/dist/cjs/Components/index.js

@@ -1,6 +1,9 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.PaymentProvider = void 0;
+exports.PaymentProvider = exports.IconDirectDebit = exports.IconCreditCard = void 0;
+var Icons_1 = require("./Elements/Icons");
+Object.defineProperty(exports, "IconCreditCard", { enumerable: true, get: function () { return Icons_1.IconCreditCard; } });
+Object.defineProperty(exports, "IconDirectDebit", { enumerable: true, get: function () { return Icons_1.IconDirectDebit; } });
 var Payment_1 = require("./Sections/Form/Payment");
 Object.defineProperty(exports, "PaymentProvider", { enumerable: true, get: function () { return Payment_1.PaymentProvider; } });
 //# sourceMappingURL=index.js.map

package/dist/cjs/Components/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/Components/index.ts"],"names":[],"mappings":";;;AAAA,mDAAyD;AAAhD,0GAAA,eAAe,OAAA"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/Components/index.ts"],"names":[],"mappings":";;;AAAA,0CAAkE;AAAzD,uGAAA,cAAc,OAAA;AAAE,wGAAA,eAAe,OAAA;AAExC,mDAAyD;AAAhD,0GAAA,eAAe,OAAA"}

package/dist/cjs/context/types.d.ts

@@ -328,6 +328,7 @@ export interface HolidayStopContextOptions extends NonInteractiveContextOptions
 }
 export interface PaymentMethodsContextOptions extends NonInteractiveContextOptions {
     items: Array<ListItemType>;
+    infoPanel: InfoPanel;
     listCellProps?: ListCellProps;
     listItemProps?: ListItemProps;
 }

package/dist/cjs/index.d.ts

@@ -14,5 +14,5 @@ export * from './pages/AddField';
 export * from './pages/PaymentMethods';
 export { ContextOptions, baseContext, footer, navigationPrimary, sideNav, } from './context';
 export { editComponentMap, addComponentMap } from './Components/Templates';
-export { PaymentProvider } from './Components';
+export { PaymentProvider, IconCreditCard, IconDirectDebit } from './Components';
 export { UserData };

package/dist/cjs/index.js

@@ -14,7 +14,7 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
     for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.PaymentProvider = exports.addComponentMap = exports.editComponentMap = exports.sideNav = exports.navigationPrimary = exports.footer = exports.baseContext = void 0;
+exports.IconDirectDebit = exports.IconCreditCard = exports.PaymentProvider = exports.addComponentMap = exports.editComponentMap = exports.sideNav = exports.navigationPrimary = exports.footer = exports.baseContext = void 0;
 __exportStar(require("./pages/PersonalDetails"), exports);
 __exportStar(require("./pages/EditField"), exports);
 __exportStar(require("./pages/Payment"), exports);
@@ -38,4 +38,6 @@ Object.defineProperty(exports, "editComponentMap", { enumerable: true, get: func
 Object.defineProperty(exports, "addComponentMap", { enumerable: true, get: function () { return Templates_1.addComponentMap; } });
 var Components_1 = require("./Components");
 Object.defineProperty(exports, "PaymentProvider", { enumerable: true, get: function () { return Components_1.PaymentProvider; } });
+Object.defineProperty(exports, "IconCreditCard", { enumerable: true, get: function () { return Components_1.IconCreditCard; } });
+Object.defineProperty(exports, "IconDirectDebit", { enumerable: true, get: function () { return Components_1.IconDirectDebit; } });
 //# sourceMappingURL=index.js.map

package/dist/cjs/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AACA,0DAAuC;AACvC,oDAAiC;AACjC,kDAA+B;AAC/B,qDAAkC;AAClC,iEAA8C;AAC9C,+DAA4C;AAC5C,gDAA6B;AAC7B,sDAAmC;AACnC,0DAAuC;AACvC,wCAAqB;AACrB,uDAAoC;AACpC,mDAAgC;AAChC,yDAAsC;AACtC,qCAMkB;AAJhB,sGAAA,WAAW,OAAA;AACX,iGAAA,MAAM,OAAA;AACN,4GAAA,iBAAiB,OAAA;AACjB,kGAAA,OAAO,OAAA;AAET,oDAA0E;AAAjE,6GAAA,gBAAgB,OAAA;AAAE,4GAAA,eAAe,OAAA;AAC1C,2CAA8C;AAArC,6GAAA,eAAe,OAAA"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AACA,0DAAuC;AACvC,oDAAiC;AACjC,kDAA+B;AAC/B,qDAAkC;AAClC,iEAA8C;AAC9C,+DAA4C;AAC5C,gDAA6B;AAC7B,sDAAmC;AACnC,0DAAuC;AACvC,wCAAqB;AACrB,uDAAoC;AACpC,mDAAgC;AAChC,yDAAsC;AACtC,qCAMkB;AAJhB,sGAAA,WAAW,OAAA;AACX,iGAAA,MAAM,OAAA;AACN,4GAAA,iBAAiB,OAAA;AACjB,kGAAA,OAAO,OAAA;AAET,oDAA0E;AAAjE,6GAAA,gBAAgB,OAAA;AAAE,4GAAA,eAAe,OAAA;AAC1C,2CAA+E;AAAtE,6GAAA,eAAe,OAAA;AAAE,4GAAA,cAAc,OAAA;AAAE,6GAAA,eAAe,OAAA"}

package/dist/cjs/pages/PaymentMethods/PaymentMethodsContext.js

@@ -1,10 +1,17 @@
 "use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.paymentMethodsContext = void 0;
+var react_1 = __importDefault(require("react"));
+var Info_1 = require("@emotion-icons/material/Info");
 var constants_1 = require("../../constants");
 var context_1 = require("../../context");
 var Icons_1 = require("../../Components/Elements/Icons");
+var newskit_1 = require("newskit");
 var title = 'Edit your payment method';
+var IconFilledInfo = (0, newskit_1.toNewsKitIcon)(Info_1.Info);
 var baseHeaderContext = {
     title: title,
     titleOverrides: {
@@ -49,6 +56,15 @@ exports.paymentMethodsContext = {
     header: baseHeaderContext,
     sideNavSelected: 'subscription-and-billing',
     navigationPrimary: context_1.navigationPrimary,
+    infoPanel: {
+        icon: react_1.default.createElement(IconFilledInfo, { overrides: { size: 'iconSize020' } }),
+        title: 'You have outstanding payments',
+        children: 'You can update your billing details here in order to correct the balance due. The amount to be paid is YET TO BE IMPLEMENTED. Once updated, you will be able to continue enjoying your subscription to The Times and The Sunday Times.',
+        overrides: {
+            stylePreset: 'inlineMessageNegative',
+            marginBlockEnd: 'space080',
+        },
+    },
     items: [
         {
             label: 'Debit/Credit Card',

package/dist/cjs/pages/PaymentMethods/PaymentMethodsContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"PaymentMethodsContext.js","sourceRoot":"","sources":["../../../../src/pages/PaymentMethods/PaymentMethodsContext.tsx"],"names":[],"mappings":";;;AACA,6CAAuD;AACvD,yCAA+E;AAC/E,yDAMwC;AAExC,IAAM,KAAK,GAAG,0BAA0B,CAAA;AAExC,IAAM,iBAAiB,GAAgB;IACrC,KAAK,OAAA;IACL,cAAc,EAAE;QACd,cAAc,EAAE;YACd,EAAE,EAAE,UAAU;YACd,EAAE,EAAE,UAAU;SACf;KACF;IACD,UAAU,EAAE;QACV,IAAI,EAAE,MAAM;QACZ,IAAI,EAAE,iCAAqB;QAC3B,YAAY,EAAE,MAAM;KACrB;IACD,mBAAmB,EAAE;QACnB,cAAc,EAAE,EAAE,EAAE,EAAE,UAAU,EAAE,EAAE,EAAE,UAAU,EAAE;QAClD,WAAW,EAAE,yBAAyB;QACtC,gBAAgB,EAAE,kBAAkB;QACpC,QAAQ,EAAE,aAAa;KACxB;IACD,cAAc,EAAE;QACd,EAAE,EAAE,UAAU;QACd,EAAE,EAAE,UAAU;QACd,EAAE,EAAE,UAAU;KACf;CACF,CAAA;AAED,IAAM,iBAAiB,GAAG;IACxB,IAAI,EAAE,aAAa;IACnB,WAAW,EAAE,aAAa;IAC1B,eAAe,EAAE,UAAU;CAC5B,CAAA;AAED,IAAM,aAAa,GAAG;IACpB,EAAE,EAAE,IAAI;IACR,EAAE,EAAE,IAAI;IACR,EAAE,EAAE,IAAI;IACR,EAAE,EAAE,IAAI;IACR,EAAE,EAAE,IAAI;CACT,CAAA;AAEY,QAAA,qBAAqB,GAA0C;IAC1E,IAAI,EAAE;QACJ,SAAS,EAAE,KAAK;KACjB;IACD,MAAM,EAAE,iBAAiB;IACzB,eAAe,EAAE,0BAA0B;IAC3C,iBAAiB,6BAAA;IACjB,KAAK,EAAE;QACL;YACE,KAAK,EAAE,mBAAmB;YAC1B,IAAI,EAAE,mBAAmB;YACzB,OAAO,EAAE,mBAAmB;YAC5B,SAAS,EAAE;gBACT,IAAI,EAAE,sBAAc;gBACpB,SAAS,EAAE,iBAAiB;aAC7B;YACD,IAAI,EAAE,UAAU;YAChB,aAAa,eAAA;SACd;QACD;YACE,KAAK,EAAE,cAAc;YACrB,IAAI,EAAE,gCAAgC;YACtC,OAAO,EAAE,cAAc;YACvB,SAAS,EAAE;gBACT,IAAI,EAAE,uBAAe;gBACrB,SAAS,EAAE,iBAAiB;aAC7B;YACD,IAAI,EAAE,UAAU;YAChB,aAAa,eAAA;SACd;QACD,IAAI;QACJ,qBAAqB;QACrB,sCAAsC;QACtC,uBAAuB;QACvB,iBAAiB;QACjB,wBAAwB;QACxB,oCAAoC;QACpC,OAAO;QACP,sBAAsB;QACtB,mBAAmB;QACnB,KAAK;QACL,IAAI;QACJ,uBAAuB;QACvB,wCAAwC;QACxC,yBAAyB;QACzB,iBAAiB;QACjB,0BAA0B;QAC1B,oCAAoC;QACpC,OAAO;QACP,sBAAsB;QACtB,mBAAmB;QACnB,KAAK;QACL,IAAI;QACJ,yBAAyB;QACzB,0CAA0C;QAC1C,2BAA2B;QAC3B,iBAAiB;QACjB,2BAA2B;QAC3B,oCAAoC;QACpC,OAAO;QACP,sBAAsB;QACtB,mBAAmB;QACnB,KAAK;KACN;IACD,aAAa,EAAE;QACb,WAAW,EAAE,IAAI;QACjB,QAAQ,EAAE,IAAI;KACf;IACD,aAAa,EAAE;QACb,cAAc,EAAE;YACd,gBAAgB,EAAE,iBAAiB;SACpC;KACF;CACF,CAAA"}
+{"version":3,"file":"PaymentMethodsContext.js","sourceRoot":"","sources":["../../../../src/pages/PaymentMethods/PaymentMethodsContext.tsx"],"names":[],"mappings":";;;;;;AAAA,gDAAyB;AAEzB,qDAAiE;AACjE,6CAAuD;AACvD,yCAA+E;AAC/E,yDAMwC;AACxC,mCAAuC;AAEvC,IAAM,KAAK,GAAG,0BAA0B,CAAA;AAExC,IAAM,cAAc,GAAG,IAAA,uBAAa,EAAC,WAAU,CAAC,CAAA;AAChD,IAAM,iBAAiB,GAAgB;IACrC,KAAK,OAAA;IACL,cAAc,EAAE;QACd,cAAc,EAAE;YACd,EAAE,EAAE,UAAU;YACd,EAAE,EAAE,UAAU;SACf;KACF;IACD,UAAU,EAAE;QACV,IAAI,EAAE,MAAM;QACZ,IAAI,EAAE,iCAAqB;QAC3B,YAAY,EAAE,MAAM;KACrB;IACD,mBAAmB,EAAE;QACnB,cAAc,EAAE,EAAE,EAAE,EAAE,UAAU,EAAE,EAAE,EAAE,UAAU,EAAE;QAClD,WAAW,EAAE,yBAAyB;QACtC,gBAAgB,EAAE,kBAAkB;QACpC,QAAQ,EAAE,aAAa;KACxB;IACD,cAAc,EAAE;QACd,EAAE,EAAE,UAAU;QACd,EAAE,EAAE,UAAU;QACd,EAAE,EAAE,UAAU;KACf;CACF,CAAA;AAED,IAAM,iBAAiB,GAAG;IACxB,IAAI,EAAE,aAAa;IACnB,WAAW,EAAE,aAAa;IAC1B,eAAe,EAAE,UAAU;CAC5B,CAAA;AAED,IAAM,aAAa,GAAG;IACpB,EAAE,EAAE,IAAI;IACR,EAAE,EAAE,IAAI;IACR,EAAE,EAAE,IAAI;IACR,EAAE,EAAE,IAAI;IACR,EAAE,EAAE,IAAI;CACT,CAAA;AAEY,QAAA,qBAAqB,GAA0C;IAC1E,IAAI,EAAE;QACJ,SAAS,EAAE,KAAK;KACjB;IACD,MAAM,EAAE,iBAAiB;IACzB,eAAe,EAAE,0BAA0B;IAC3C,iBAAiB,6BAAA;IACjB,SAAS,EAAE;QACT,IAAI,EAAE,8BAAC,cAAc,IAAC,SAAS,EAAE,EAAE,IAAI,EAAE,aAAa,EAAE,GAAI;QAC5D,KAAK,EAAE,+BAA+B;QACtC,QAAQ,EACN,wOAAwO;QAC1O,SAAS,EAAE;YACT,WAAW,EAAE,uBAAuB;YACpC,cAAc,EAAE,UAAU;SAC3B;KACF;IACD,KAAK,EAAE;QACL;YACE,KAAK,EAAE,mBAAmB;YAC1B,IAAI,EAAE,mBAAmB;YACzB,OAAO,EAAE,mBAAmB;YAC5B,SAAS,EAAE;gBACT,IAAI,EAAE,sBAAc;gBACpB,SAAS,EAAE,iBAAiB;aAC7B;YACD,IAAI,EAAE,UAAU;YAChB,aAAa,eAAA;SACd;QACD;YACE,KAAK,EAAE,cAAc;YACrB,IAAI,EAAE,gCAAgC;YACtC,OAAO,EAAE,cAAc;YACvB,SAAS,EAAE;gBACT,IAAI,EAAE,uBAAe;gBACrB,SAAS,EAAE,iBAAiB;aAC7B;YACD,IAAI,EAAE,UAAU;YAChB,aAAa,eAAA;SACd;QACD,IAAI;QACJ,qBAAqB;QACrB,sCAAsC;QACtC,uBAAuB;QACvB,iBAAiB;QACjB,wBAAwB;QACxB,oCAAoC;QACpC,OAAO;QACP,sBAAsB;QACtB,mBAAmB;QACnB,KAAK;QACL,IAAI;QACJ,uBAAuB;QACvB,wCAAwC;QACxC,yBAAyB;QACzB,iBAAiB;QACjB,0BAA0B;QAC1B,oCAAoC;QACpC,OAAO;QACP,sBAAsB;QACtB,mBAAmB;QACnB,KAAK;QACL,IAAI;QACJ,yBAAyB;QACzB,0CAA0C;QAC1C,2BAA2B;QAC3B,iBAAiB;QACjB,2BAA2B;QAC3B,oCAAoC;QACpC,OAAO;QACP,sBAAsB;QACtB,mBAAmB;QACnB,KAAK;KACN;IACD,aAAa,EAAE;QACb,WAAW,EAAE,IAAI;QACjB,QAAQ,EAAE,IAAI;KACf;IACD,aAAa,EAAE;QACb,cAAc,EAAE;YACd,gBAAgB,EAAE,iBAAiB;SACpC;KACF;CACF,CAAA"}

package/dist/cjs/pages/types.d.ts

@@ -110,7 +110,7 @@ export interface UserData {
     holidayStops?: HolidayStop[];
 }
 export type PersonalDetailsUserData = Pick<UserData, 'firstName' | 'lastName' | 'mobile' | 'phoneNumber' | 'dateOfBirth' | 'subscriptions' | 'displayName' | 'address'>;
-export type SubscriptionAndBillingUserData = Pick<UserData, 'cpn' | 'subscriptions'>;
+export type SubscriptionAndBillingUserData = Pick<UserData, 'cpn' | 'subscriptions' | 'paymentFailure'>;
 export type HolidayStopUserData = Pick<UserData, 'holidayStops' | 'subscriptions'>;
 export type NewslettersAndAlertsUserData = Pick<UserData, 'email' | 'hash'>;
 export type PaymentUserData = {

package/dist/esm/Components/Elements/PaymentItem/PaymentItem.js

@@ -3,7 +3,7 @@ import { Stack, TextBlock } from 'newskit';
 import PaymentIcon from '../PaymentIcon';
 import { PaymentTypes, CardTypes, WalletTypes, } from '../../Sections/Form/Payment/types';
 var getType = function (type, cardType, walletType) {
-    var paymentType = type ? type.toLowerCase() : '';
+    var paymentType = type === null || type === void 0 ? void 0 : type.toLowerCase();
     if (paymentType === PaymentTypes.creditcard ||
         paymentType === PaymentTypes.debitcard) {
         return cardType === null || cardType === void 0 ? void 0 : cardType.toLowerCase();
@@ -32,8 +32,8 @@ var PaymentItem = function (_a) {
         _b[WalletTypes.google_pay] = cardNumber,
         _b);
     return (React.createElement(Stack, { flow: 'horizontal-center' },
-        React.createElement(PaymentIcon, { type: paymentType }),
-        React.createElement(TextBlock, { typographyPreset: "utilityBody020", style: { paddingBottom: '4px' } }, paymentTextMapper[paymentType] || '')));
+        paymentType ? React.createElement(PaymentIcon, { type: paymentType }) : null,
+        React.createElement(TextBlock, { typographyPreset: "utilityBody020", style: { paddingBottom: '4px' } }, paymentType ? paymentTextMapper[paymentType] : '')));
 };
 export default PaymentItem;
 //# sourceMappingURL=PaymentItem.js.map

package/dist/esm/Components/Elements/PaymentItem/PaymentItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"PaymentItem.js","sourceRoot":"","sources":["../../../../../src/Components/Elements/PaymentItem/PaymentItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,OAAO,CAAA;AACtC,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,MAAM,SAAS,CAAA;AAC1C,OAAO,WAAW,MAAM,gBAAgB,CAAA;AACxC,OAAO,EACL,YAAY,EACZ,SAAS,EACT,WAAW,GACZ,MAAM,mCAAmC,CAAA;AAkB1C,IAAM,OAAO,GAAG,UACd,IAAa,EACb,QAAiB,EACjB,UAAmB;IAEnB,IAAM,WAAW,GAAG,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,WAAW,EAAE,CAAC,CAAC,CAAC,EAAE,CAAA;IAClD,IACE,WAAW,KAAK,YAAY,CAAC,UAAU;QACvC,WAAW,KAAK,YAAY,CAAC,SAAS,EACtC;QACA,OAAO,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAE,WAAW,EAAe,CAAA;KAC5C;IAED,IAAI,WAAW,KAAK,YAAY,CAAC,8BAA8B,EAAE;QAC/D,OAAO,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,WAAW,EAAiB,CAAA;KAChD;IAED,OAAO,WAA2B,CAAA;AACpC,CAAC,CAAA;AAED,IAAM,WAAW,GAA+B,UAAC,EAOhD;;QANC,IAAI,UAAA,EACJ,QAAQ,cAAA,EACR,UAAU,gBAAA,EACV,6BAA6B,mCAAA,EAC7B,UAAU,gBAAA,EACV,WAAW,iBAAA;IAEX,IAAM,WAAW,GAAG,OAAO,CACzB,cAAM,OAAA,OAAO,CAAC,IAAI,EAAE,QAAQ,EAAE,UAAU,CAAC,EAAnC,CAAmC,EACzC,CAAC,IAAI,EAAE,QAAQ,EAAE,UAAU,CAAC,CAC7B,CAAA;IACD,IAAM,iBAAiB;QACrB,GAAC,SAAS,CAAC,UAAU,IAAG,UAAU;QAClC,GAAC,SAAS,CAAC,IAAI,IAAG,UAAU;QAC5B,GAAC,SAAS,CAAC,QAAQ,IAAG,UAAU;QAChC,GAAC,SAAS,CAAC,MAAM,IAAG,UAAU;QAC9B,GAAC,SAAS,CAAC,eAAe,IAAG,UAAU;QACvC,GAAC,SAAS,CAAC,IAAI,IAAG,UAAU;QAC5B,GAAC,SAAS,CAAC,GAAG,IAAG,UAAU;QAC3B,GAAC,SAAS,CAAC,QAAQ,IAAG,UAAU;QAChC,GAAC,YAAY,CAAC,MAAM,IAAG,WAAW;QAClC,GAAC,YAAY,CAAC,YAAY,IAAG,6BAA6B;QAC1D,GAAC,WAAW,CAAC,SAAS,IAAG,UAAU;QACnC,GAAC,WAAW,CAAC,UAAU,IAAG,UAAU;WACrC,CAAA;IACD,OAAO,CACL,oBAAC,KAAK,IAAC,IAAI,EAAE,mBAAmB;QAC9B,oBAAC,WAAW,IAAC,IAAI,EAAE,WAAW,GAAgB;QAC9C,oBAAC,SAAS,IACR,gBAAgB,EAAC,gBAAgB,EACjC,KAAK,EAAE,EAAE,aAAa,EAAE,KAAK,EAAE,IAE9B,iBAAiB,CAAC,WAAW,CAAC,IAAI,EAAE,CAC3B,CACN,CACT,CAAA;AACH,CAAC,CAAA;AAED,eAAe,WAAW,CAAA"}
+{"version":3,"file":"PaymentItem.js","sourceRoot":"","sources":["../../../../../src/Components/Elements/PaymentItem/PaymentItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,OAAO,CAAA;AACtC,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,MAAM,SAAS,CAAA;AAC1C,OAAO,WAAW,MAAM,gBAAgB,CAAA;AACxC,OAAO,EACL,YAAY,EACZ,SAAS,EACT,WAAW,GACZ,MAAM,mCAAmC,CAAA;AAkB1C,IAAM,OAAO,GAAG,UACd,IAAa,EACb,QAAiB,EACjB,UAAmB;IAEnB,IAAM,WAAW,GAAG,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,WAAW,EAAE,CAAA;IACvC,IACE,WAAW,KAAK,YAAY,CAAC,UAAU;QACvC,WAAW,KAAK,YAAY,CAAC,SAAS,EACtC;QACA,OAAO,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAE,WAAW,EAAe,CAAA;KAC5C;IAED,IAAI,WAAW,KAAK,YAAY,CAAC,8BAA8B,EAAE;QAC/D,OAAO,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,WAAW,EAAiB,CAAA;KAChD;IAED,OAAO,WAAuC,CAAA;AAChD,CAAC,CAAA;AAED,IAAM,WAAW,GAA+B,UAAC,EAOhD;;QANC,IAAI,UAAA,EACJ,QAAQ,cAAA,EACR,UAAU,gBAAA,EACV,6BAA6B,mCAAA,EAC7B,UAAU,gBAAA,EACV,WAAW,iBAAA;IAEX,IAAM,WAAW,GAAG,OAAO,CACzB,cAAM,OAAA,OAAO,CAAC,IAAI,EAAE,QAAQ,EAAE,UAAU,CAAC,EAAnC,CAAmC,EACzC,CAAC,IAAI,EAAE,QAAQ,EAAE,UAAU,CAAC,CAC7B,CAAA;IACD,IAAM,iBAAiB;QACrB,GAAC,SAAS,CAAC,UAAU,IAAG,UAAU;QAClC,GAAC,SAAS,CAAC,IAAI,IAAG,UAAU;QAC5B,GAAC,SAAS,CAAC,QAAQ,IAAG,UAAU;QAChC,GAAC,SAAS,CAAC,MAAM,IAAG,UAAU;QAC9B,GAAC,SAAS,CAAC,eAAe,IAAG,UAAU;QACvC,GAAC,SAAS,CAAC,IAAI,IAAG,UAAU;QAC5B,GAAC,SAAS,CAAC,GAAG,IAAG,UAAU;QAC3B,GAAC,SAAS,CAAC,QAAQ,IAAG,UAAU;QAChC,GAAC,YAAY,CAAC,MAAM,IAAG,WAAW;QAClC,GAAC,YAAY,CAAC,YAAY,IAAG,6BAA6B;QAC1D,GAAC,WAAW,CAAC,SAAS,IAAG,UAAU;QACnC,GAAC,WAAW,CAAC,UAAU,IAAG,UAAU;WACrC,CAAA;IACD,OAAO,CACL,oBAAC,KAAK,IAAC,IAAI,EAAE,mBAAmB;QAC7B,WAAW,CAAC,CAAC,CAAC,oBAAC,WAAW,IAAC,IAAI,EAAE,WAAW,GAAgB,CAAC,CAAC,CAAC,IAAI;QACpE,oBAAC,SAAS,IACR,gBAAgB,EAAC,gBAAgB,EACjC,KAAK,EAAE,EAAE,aAAa,EAAE,KAAK,EAAE,IAE9B,WAAW,CAAC,CAAC,CAAC,iBAAiB,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,EAAE,CACxC,CACN,CACT,CAAA;AACH,CAAC,CAAA;AAED,eAAe,WAAW,CAAA"}

package/dist/esm/Components/Templates/PaymentMethodsRender.js

@@ -10,14 +10,18 @@ var __assign = (this && this.__assign) || function () {
     return __assign.apply(this, arguments);
 };
 import React from 'react';
+import { InlineMessage } from 'newskit';
 import { useAccountContext } from '../../context';
 import { ContextName } from '../../context/types';
-import { Header, ContentListView, ListItem, } from '@newskit-render/shared-components';
+import { Header, ContentListView, ListItem, filterListItems, } from '@newskit-render/shared-components';
 import { replaceBaseURL } from '../../helpers';
 export var PaymentMethodsRender = function () {
-    var _a = useAccountContext(ContextName.paymentMethods), header = _a.header, items = _a.items, listItemProps = _a.listItemProps, listCellProps = _a.listCellProps, baseUrl = _a.baseUrl;
+    var _a;
+    var _b = useAccountContext(ContextName.paymentMethods), header = _b.header, items = _b.items, listItemProps = _b.listItemProps, listCellProps = _b.listCellProps, baseUrl = _b.baseUrl, userData = _b.userData, infoPanel = _b.infoPanel;
+    var filteredItems = filterListItems(items, userData);
     return (React.createElement(React.Fragment, null,
         React.createElement(Header, __assign({}, header)),
-        React.createElement(ContentListView, null, items.map(function (item, i) { return (React.createElement(ListItem, { key: i, item: __assign(__assign({}, item), { href: replaceBaseURL(baseUrl, item.href) }), listItemProps: __assign(__assign({}, listItemProps), { 'data-testid': "content-list-item-".concat(i) }), listCellProps: listCellProps })); }))));
+        React.createElement(ContentListView, null, filteredItems.map(function (item, i) { return (React.createElement(ListItem, { key: i, item: __assign(__assign({}, item), { href: replaceBaseURL(baseUrl, item.href) }), listItemProps: __assign(__assign({}, listItemProps), { 'data-testid': "content-list-item-".concat(i) }), listCellProps: listCellProps })); })),
+        ((_a = userData.paymentFailure) === null || _a === void 0 ? void 0 : _a.active) ? (React.createElement(InlineMessage, { icon: infoPanel.icon, title: infoPanel.title, children: infoPanel.children, overrides: infoPanel.overrides || {} })) : null));
 };
 //# sourceMappingURL=PaymentMethodsRender.js.map

package/dist/esm/Components/Templates/PaymentMethodsRender.js.map

@@ -1 +1 @@
-{"version":3,"file":"PaymentMethodsRender.js","sourceRoot":"","sources":["../../../../src/Components/Templates/PaymentMethodsRender.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAA;AACjD,OAAO,EAAE,WAAW,EAAgC,MAAM,qBAAqB,CAAA;AAC/E,OAAO,EACL,MAAM,EACN,eAAe,EACf,QAAQ,GACT,MAAM,mCAAmC,CAAA;AAC1C,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAA;AAE9C,MAAM,CAAC,IAAM,oBAAoB,GAAa;IACtC,IAAA,KACJ,iBAAiB,CACf,WAAW,CAAC,cAAc,CACK,EAH3B,MAAM,YAAA,EAAE,KAAK,WAAA,EAAE,aAAa,mBAAA,EAAE,aAAa,mBAAA,EAAE,OAAO,aAGzB,CAAA;IAEnC,OAAO,CACL;QACE,oBAAC,MAAM,eAAK,MAAM,EAAI;QACtB,oBAAC,eAAe,QACb,KAAK,CAAC,GAAG,CAAC,UAAC,IAAI,EAAE,CAAC,IAAK,OAAA,CACtB,oBAAC,QAAQ,IACP,GAAG,EAAE,CAAC,EACN,IAAI,wBACC,IAAI,KACP,IAAI,EAAE,cAAc,CAAC,OAAO,EAAE,IAAI,CAAC,IAAI,CAAC,KAE1C,aAAa,wBACR,aAAa,KAChB,aAAa,EAAE,4BAAqB,CAAC,CAAE,KAEzC,aAAa,EAAE,aAAa,GAC5B,CACH,EAbuB,CAavB,CAAC,CACc,CACjB,CACJ,CAAA;AACH,CAAC,CAAA"}
+{"version":3,"file":"PaymentMethodsRender.js","sourceRoot":"","sources":["../../../../src/Components/Templates/PaymentMethodsRender.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,aAAa,EAAE,MAAM,SAAS,CAAA;AACvC,OAAO,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAA;AACjD,OAAO,EAAE,WAAW,EAAgC,MAAM,qBAAqB,CAAA;AAC/E,OAAO,EACL,MAAM,EACN,eAAe,EACf,QAAQ,EACR,eAAe,GAChB,MAAM,mCAAmC,CAAA;AAC1C,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAA;AAG9C,MAAM,CAAC,IAAM,oBAAoB,GAAa;;IACtC,IAAA,KAQF,iBAAiB,CACnB,WAAW,CAAC,cAAc,CACK,EAT/B,MAAM,YAAA,EACN,KAAK,WAAA,EACL,aAAa,mBAAA,EACb,aAAa,mBAAA,EACb,OAAO,aAAA,EACP,QAAQ,cAAA,EACR,SAAS,eAGsB,CAAA;IAEjC,IAAM,aAAa,GAAG,eAAe,CAAW,KAAK,EAAE,QAAQ,CAAC,CAAA;IAChE,OAAO,CACL;QACE,oBAAC,MAAM,eAAK,MAAM,EAAI;QACtB,oBAAC,eAAe,QACb,aAAa,CAAC,GAAG,CAAC,UAAC,IAAI,EAAE,CAAC,IAAK,OAAA,CAC9B,oBAAC,QAAQ,IACP,GAAG,EAAE,CAAC,EACN,IAAI,wBACC,IAAI,KACP,IAAI,EAAE,cAAc,CAAC,OAAO,EAAE,IAAI,CAAC,IAAI,CAAC,KAE1C,aAAa,wBACR,aAAa,KAChB,aAAa,EAAE,4BAAqB,CAAC,CAAE,KAEzC,aAAa,EAAE,aAAa,GAC5B,CACH,EAb+B,CAa/B,CAAC,CACc;QACjB,CAAA,MAAA,QAAQ,CAAC,cAAc,0CAAE,MAAM,EAAC,CAAC,CAAC,CACjC,oBAAC,aAAa,IACZ,IAAI,EAAE,SAAS,CAAC,IAAI,EACpB,KAAK,EAAE,SAAS,CAAC,KAAK,EACtB,QAAQ,EAAE,SAAS,CAAC,QAAQ,EAC5B,SAAS,EAAE,SAAS,CAAC,SAAS,IAAI,EAAE,GACpC,CACH,CAAC,CAAC,CAAC,IAAI,CACP,CACJ,CAAA;AACH,CAAC,CAAA"}

package/dist/esm/Components/index.d.ts

@@ -1 +1,2 @@
+export { IconCreditCard, IconDirectDebit } from './Elements/Icons';
 export { PaymentProvider } from './Sections/Form/Payment';

package/dist/esm/Components/index.js

@@ -1,2 +1,3 @@
+export { IconCreditCard, IconDirectDebit } from './Elements/Icons';
 export { PaymentProvider } from './Sections/Form/Payment';
 //# sourceMappingURL=index.js.map

package/dist/esm/Components/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/Components/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,yBAAyB,CAAA"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/Components/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,eAAe,EAAE,MAAM,kBAAkB,CAAA;AAElE,OAAO,EAAE,eAAe,EAAE,MAAM,yBAAyB,CAAA"}

package/dist/esm/context/types.d.ts

@@ -328,6 +328,7 @@ export interface HolidayStopContextOptions extends NonInteractiveContextOptions
 }
 export interface PaymentMethodsContextOptions extends NonInteractiveContextOptions {
     items: Array<ListItemType>;
+    infoPanel: InfoPanel;
     listCellProps?: ListCellProps;
     listItemProps?: ListItemProps;
 }

package/dist/esm/index.d.ts

@@ -14,5 +14,5 @@ export * from './pages/AddField';
 export * from './pages/PaymentMethods';
 export { ContextOptions, baseContext, footer, navigationPrimary, sideNav, } from './context';
 export { editComponentMap, addComponentMap } from './Components/Templates';
-export { PaymentProvider } from './Components';
+export { PaymentProvider, IconCreditCard, IconDirectDebit } from './Components';
 export { UserData };

package/dist/esm/index.js

@@ -13,5 +13,5 @@ export * from './pages/AddField';
 export * from './pages/PaymentMethods';
 export { baseContext, footer, navigationPrimary, sideNav, } from './context';
 export { editComponentMap, addComponentMap } from './Components/Templates';
-export { PaymentProvider } from './Components';
+export { PaymentProvider, IconCreditCard, IconDirectDebit } from './Components';
 //# sourceMappingURL=index.js.map

package/dist/esm/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AACA,cAAc,yBAAyB,CAAA;AACvC,cAAc,mBAAmB,CAAA;AACjC,cAAc,iBAAiB,CAAA;AAC/B,cAAc,oBAAoB,CAAA;AAClC,cAAc,gCAAgC,CAAA;AAC9C,cAAc,8BAA8B,CAAA;AAC5C,cAAc,eAAe,CAAA;AAC7B,cAAc,qBAAqB,CAAA;AACnC,cAAc,yBAAyB,CAAA;AACvC,cAAc,OAAO,CAAA;AACrB,cAAc,sBAAsB,CAAA;AACpC,cAAc,kBAAkB,CAAA;AAChC,cAAc,wBAAwB,CAAA;AACtC,OAAO,EAEL,WAAW,EACX,MAAM,EACN,iBAAiB,EACjB,OAAO,GACR,MAAM,WAAW,CAAA;AAClB,OAAO,EAAE,gBAAgB,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAA;AAC1E,OAAO,EAAE,eAAe,EAAE,MAAM,cAAc,CAAA"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AACA,cAAc,yBAAyB,CAAA;AACvC,cAAc,mBAAmB,CAAA;AACjC,cAAc,iBAAiB,CAAA;AAC/B,cAAc,oBAAoB,CAAA;AAClC,cAAc,gCAAgC,CAAA;AAC9C,cAAc,8BAA8B,CAAA;AAC5C,cAAc,eAAe,CAAA;AAC7B,cAAc,qBAAqB,CAAA;AACnC,cAAc,yBAAyB,CAAA;AACvC,cAAc,OAAO,CAAA;AACrB,cAAc,sBAAsB,CAAA;AACpC,cAAc,kBAAkB,CAAA;AAChC,cAAc,wBAAwB,CAAA;AACtC,OAAO,EAEL,WAAW,EACX,MAAM,EACN,iBAAiB,EACjB,OAAO,GACR,MAAM,WAAW,CAAA;AAClB,OAAO,EAAE,gBAAgB,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAA;AAC1E,OAAO,EAAE,eAAe,EAAE,cAAc,EAAE,eAAe,EAAE,MAAM,cAAc,CAAA"}

package/dist/esm/pages/PaymentMethods/PaymentMethodsContext.js

@@ -1,3 +1,5 @@
+import React from 'react';
+import { Info as FilledInfo } from '@emotion-icons/material/Info';
 import { SUBSCRIPTION_BASE_URL } from '../../constants';
 import { navigationPrimary } from '../../context';
 import { IconCreditCard, IconDirectDebit,
@@ -5,7 +7,9 @@ import { IconCreditCard, IconDirectDebit,
 // IconApplePay,
 // IconGooglePay,
  } from '../../Components/Elements/Icons';
+import { toNewsKitIcon } from 'newskit';
 var title = 'Edit your payment method';
+var IconFilledInfo = toNewsKitIcon(FilledInfo);
 var baseHeaderContext = {
     title: title,
     titleOverrides: {
@@ -50,6 +54,15 @@ export var paymentMethodsContext = {
     header: baseHeaderContext,
     sideNavSelected: 'subscription-and-billing',
     navigationPrimary: navigationPrimary,
+    infoPanel: {
+        icon: React.createElement(IconFilledInfo, { overrides: { size: 'iconSize020' } }),
+        title: 'You have outstanding payments',
+        children: 'You can update your billing details here in order to correct the balance due. The amount to be paid is YET TO BE IMPLEMENTED. Once updated, you will be able to continue enjoying your subscription to The Times and The Sunday Times.',
+        overrides: {
+            stylePreset: 'inlineMessageNegative',
+            marginBlockEnd: 'space080',
+        },
+    },
     items: [
         {
             label: 'Debit/Credit Card',

package/dist/esm/pages/PaymentMethods/PaymentMethodsContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"PaymentMethodsContext.js","sourceRoot":"","sources":["../../../../src/pages/PaymentMethods/PaymentMethodsContext.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,qBAAqB,EAAE,MAAM,iBAAiB,CAAA;AACvD,OAAO,EAAgC,iBAAiB,EAAE,MAAM,eAAe,CAAA;AAC/E,OAAO,EACL,cAAc,EACd,eAAe;AACf,cAAc;AACd,gBAAgB;AAChB,iBAAiB;EAClB,MAAM,iCAAiC,CAAA;AAExC,IAAM,KAAK,GAAG,0BAA0B,CAAA;AAExC,IAAM,iBAAiB,GAAgB;IACrC,KAAK,OAAA;IACL,cAAc,EAAE;QACd,cAAc,EAAE;YACd,EAAE,EAAE,UAAU;YACd,EAAE,EAAE,UAAU;SACf;KACF;IACD,UAAU,EAAE;QACV,IAAI,EAAE,MAAM;QACZ,IAAI,EAAE,qBAAqB;QAC3B,YAAY,EAAE,MAAM;KACrB;IACD,mBAAmB,EAAE;QACnB,cAAc,EAAE,EAAE,EAAE,EAAE,UAAU,EAAE,EAAE,EAAE,UAAU,EAAE;QAClD,WAAW,EAAE,yBAAyB;QACtC,gBAAgB,EAAE,kBAAkB;QACpC,QAAQ,EAAE,aAAa;KACxB;IACD,cAAc,EAAE;QACd,EAAE,EAAE,UAAU;QACd,EAAE,EAAE,UAAU;QACd,EAAE,EAAE,UAAU;KACf;CACF,CAAA;AAED,IAAM,iBAAiB,GAAG;IACxB,IAAI,EAAE,aAAa;IACnB,WAAW,EAAE,aAAa;IAC1B,eAAe,EAAE,UAAU;CAC5B,CAAA;AAED,IAAM,aAAa,GAAG;IACpB,EAAE,EAAE,IAAI;IACR,EAAE,EAAE,IAAI;IACR,EAAE,EAAE,IAAI;IACR,EAAE,EAAE,IAAI;IACR,EAAE,EAAE,IAAI;CACT,CAAA;AAED,MAAM,CAAC,IAAM,qBAAqB,GAA0C;IAC1E,IAAI,EAAE;QACJ,SAAS,EAAE,KAAK;KACjB;IACD,MAAM,EAAE,iBAAiB;IACzB,eAAe,EAAE,0BAA0B;IAC3C,iBAAiB,mBAAA;IACjB,KAAK,EAAE;QACL;YACE,KAAK,EAAE,mBAAmB;YAC1B,IAAI,EAAE,mBAAmB;YACzB,OAAO,EAAE,mBAAmB;YAC5B,SAAS,EAAE;gBACT,IAAI,EAAE,cAAc;gBACpB,SAAS,EAAE,iBAAiB;aAC7B;YACD,IAAI,EAAE,UAAU;YAChB,aAAa,eAAA;SACd;QACD;YACE,KAAK,EAAE,cAAc;YACrB,IAAI,EAAE,gCAAgC;YACtC,OAAO,EAAE,cAAc;YACvB,SAAS,EAAE;gBACT,IAAI,EAAE,eAAe;gBACrB,SAAS,EAAE,iBAAiB;aAC7B;YACD,IAAI,EAAE,UAAU;YAChB,aAAa,eAAA;SACd;QACD,IAAI;QACJ,qBAAqB;QACrB,sCAAsC;QACtC,uBAAuB;QACvB,iBAAiB;QACjB,wBAAwB;QACxB,oCAAoC;QACpC,OAAO;QACP,sBAAsB;QACtB,mBAAmB;QACnB,KAAK;QACL,IAAI;QACJ,uBAAuB;QACvB,wCAAwC;QACxC,yBAAyB;QACzB,iBAAiB;QACjB,0BAA0B;QAC1B,oCAAoC;QACpC,OAAO;QACP,sBAAsB;QACtB,mBAAmB;QACnB,KAAK;QACL,IAAI;QACJ,yBAAyB;QACzB,0CAA0C;QAC1C,2BAA2B;QAC3B,iBAAiB;QACjB,2BAA2B;QAC3B,oCAAoC;QACpC,OAAO;QACP,sBAAsB;QACtB,mBAAmB;QACnB,KAAK;KACN;IACD,aAAa,EAAE;QACb,WAAW,EAAE,IAAI;QACjB,QAAQ,EAAE,IAAI;KACf;IACD,aAAa,EAAE;QACb,cAAc,EAAE;YACd,gBAAgB,EAAE,iBAAiB;SACpC;KACF;CACF,CAAA"}
+{"version":3,"file":"PaymentMethodsContext.js","sourceRoot":"","sources":["../../../../src/pages/PaymentMethods/PaymentMethodsContext.tsx"],"names":[],"mappings":"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"}

package/dist/esm/pages/types.d.ts

@@ -110,7 +110,7 @@ export interface UserData {
     holidayStops?: HolidayStop[];
 }
 export type PersonalDetailsUserData = Pick<UserData, 'firstName' | 'lastName' | 'mobile' | 'phoneNumber' | 'dateOfBirth' | 'subscriptions' | 'displayName' | 'address'>;
-export type SubscriptionAndBillingUserData = Pick<UserData, 'cpn' | 'subscriptions'>;
+export type SubscriptionAndBillingUserData = Pick<UserData, 'cpn' | 'subscriptions' | 'paymentFailure'>;
 export type HolidayStopUserData = Pick<UserData, 'holidayStops' | 'subscriptions'>;
 export type NewslettersAndAlertsUserData = Pick<UserData, 'email' | 'hash'>;
 export type PaymentUserData = {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@newskit-render/my-account",
-  "version": "6.9.2-alpha.2",
+  "version": "6.10.0-alpha.0",
   "description": "Newskit Render",
   "author": "",
   "license": "UNLICENSED",
@@ -34,7 +34,7 @@
     "@emotion/styled": "11.9.3",
     "@hookform/resolvers": "2.9.10",
     "@newskit-render/api": "^1.6.8",
-    "@newskit-render/shared-components": "^3.12.1",
+    "@newskit-render/shared-components": "^3.13.0-alpha.0",
     "@newskit-render/validation": "^1.8.1",
     "@stripe/react-stripe-js": "1.4.1",
     "@stripe/stripe-js": "1.46.0",