@newskit-render/my-account 0.139.1 → 0.140.2

package/dist/esm/Components/Sections/NavigationSecondary/NavigationSecondary.js

@@ -0,0 +1,41 @@
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+import React from 'react';
+import { styled, getColorCssFromTheme, getMediaQueryFromTheme, Menu, MenuItem, Block, Scroll, } from 'newskit';
+import { useAccountContext, } from '../../../context';
+import { replaceBaseURL } from '../../../helpers';
+import { FALLBACK_URL_REPLACEMENT } from '../../../constants';
+export var navigationSecondaryHeight = '48px';
+var NavContainer = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  overflow: auto;\n  height: ", ";\n  ", ";\n  width: 100%;\n  ", " {\n    width: 300px;\n    min-height: 100vh;\n    position: fixed;\n    left: 0;\n  }\n"], ["\n  overflow: auto;\n  height: ", ";\n  ", ";\n  width: 100%;\n  ", " {\n    width: 300px;\n    min-height: 100vh;\n    position: fixed;\n    left: 0;\n  }\n"])), navigationSecondaryHeight, function (_a) {
+    var backgroundColor = _a.backgroundColor;
+    return backgroundColor &&
+        getColorCssFromTheme('backgroundColor', backgroundColor);
+}, getMediaQueryFromTheme('lg'));
+var StyledScroll = styled(Scroll)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  overflow-x: auto;\n  overflow-y: auto;\n  ", " {\n    overflow-x: initial;\n    overflow-y: initial;\n  }\n"], ["\n  overflow-x: auto;\n  overflow-y: auto;\n  ", " {\n    overflow-x: initial;\n    overflow-y: initial;\n  }\n"])), getMediaQueryFromTheme('lg'));
+var StyledMenu = styled(Menu)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  > ul {\n    flex-direction: row;\n    ", " {\n      flex-direction: column;\n    }\n  }\n\n  > ul li {\n    margin-bottom: 0px;\n  }\n\n  > ul li a:focus-visible {\n    border: none;\n    margin-bottom: 2px;\n    margin-top: 2px;\n    min-height: 44px;\n  }\n"], ["\n  > ul {\n    flex-direction: row;\n    ", " {\n      flex-direction: column;\n    }\n  }\n\n  > ul li {\n    margin-bottom: 0px;\n  }\n\n  > ul li a:focus-visible {\n    border: none;\n    margin-bottom: 2px;\n    margin-top: 2px;\n    min-height: 44px;\n  }\n"])), getMediaQueryFromTheme('lg'));
+var StyledMenuItem = styled(MenuItem)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  white-space: nowrap;\n"], ["\n  white-space: nowrap;\n"])));
+var NavigationSecondary = function (_a) {
+    var contextName = _a.contextName;
+    var _b = useAccountContext(contextName), sideNav = _b.sideNav, sideNavSelected = _b.sideNavSelected, sideNavOverrides = _b.sideNavOverrides, baseUrl = _b.baseUrl;
+    return (React.createElement(NavContainer, { "data-testid": "NavigationSecondary", backgroundColor: sideNavOverrides === null || sideNavOverrides === void 0 ? void 0 : sideNavOverrides.backgroundColor },
+        React.createElement(Block, { spaceStack: {
+                lg: 'space070',
+            } }),
+        React.createElement(Block, null,
+            React.createElement(StyledScroll, { tabIndex: undefined, overrides: {
+                    overlays: {
+                        size: {
+                            xs: 'sizing090',
+                            lg: 'sizing000',
+                        },
+                    },
+                } }, Array.isArray(sideNav) && (React.createElement(StyledMenu, { vertical: true, "aria-label": "main" }, sideNav.map(function (_a) {
+                var id = _a.id, href = _a.href, text = _a.text;
+                return (React.createElement(StyledMenuItem, { href: replaceBaseURL(baseUrl, href, FALLBACK_URL_REPLACEMENT.home), key: id, selected: sideNavSelected === id, overrides: sideNavOverrides === null || sideNavOverrides === void 0 ? void 0 : sideNavOverrides.menuItemOverrides }, text));
+            })))))));
+};
+export default NavigationSecondary;
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4;
+//# sourceMappingURL=NavigationSecondary.js.map

package/dist/esm/Components/Sections/NavigationSecondary/NavigationSecondary.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NavigationSecondary.js","sourceRoot":"","sources":["../../../../../src/Components/Sections/NavigationSecondary/NavigationSecondary.tsx"],"names":[],"mappings":";;;;AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EACL,MAAM,EACN,oBAAoB,EACpB,sBAAsB,EACtB,IAAI,EACJ,QAAQ,EACR,KAAK,EACL,MAAM,GACP,MAAM,SAAS,CAAA;AAChB,OAAO,EAEL,iBAAiB,GAClB,MAAM,kBAAkB,CAAA;AACzB,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAA;AACjD,OAAO,EAAE,wBAAwB,EAAE,MAAM,oBAAoB,CAAA;AAE7D,MAAM,CAAC,IAAM,yBAAyB,GAAG,MAAM,CAAA;AAE/C,IAAM,YAAY,GAAG,MAAM,CAAC,GAAG,kOAA0C,iCAE7D,EAAyB,OACjC,EAEwD,uBAExD,EAA4B,0FAM/B,KAXW,yBAAyB,EACjC,UAAC,EAAmB;QAAjB,eAAe,qBAAA;IAClB,OAAA,eAAe;QACf,oBAAoB,CAAC,iBAAiB,EAAE,eAAe,CAAC;AADxD,CACwD,EAExD,sBAAsB,CAAC,IAAI,CAAC,CAM/B,CAAA;AAED,IAAM,YAAY,GAAG,MAAM,CAAC,MAAM,CAAC,oLAAA,gDAG/B,EAA4B,+DAI/B,KAJG,sBAAsB,CAAC,IAAI,CAAC,CAI/B,CAAA;AAED,IAAM,UAAU,GAAG,MAAM,CAAC,IAAI,CAAC,4UAAA,4CAGzB,EAA4B,2NAejC,KAfK,sBAAsB,CAAC,IAAI,CAAC,CAejC,CAAA;AAED,IAAM,cAAc,GAAG,MAAM,CAAC,QAAQ,CAAC,+FAAA,4BAEtC,IAAA,CAAA;AAMD,IAAM,mBAAmB,GAAuC,UAAC,EAEhE;QADC,WAAW,iBAAA;IAEL,IAAA,KAKF,iBAAiB,CAAC,WAAW,CAAqC,EAJpE,OAAO,aAAA,EACP,eAAe,qBAAA,EACf,gBAAgB,sBAAA,EAChB,OAAO,aAC6D,CAAA;IAEtE,OAAO,CACL,oBAAC,YAAY,mBACC,qBAAqB,EACjC,eAAe,EAAE,gBAAgB,aAAhB,gBAAgB,uBAAhB,gBAAgB,CAAE,eAAe;QAElD,oBAAC,KAAK,IACJ,UAAU,EAAE;gBACV,EAAE,EAAE,UAAU;aACf,GACD;QACF,oBAAC,KAAK;YACJ,oBAAC,YAAY,IACX,QAAQ,EAAE,SAAS,EACnB,SAAS,EAAE;oBACT,QAAQ,EAAE;wBACR,IAAI,EAAE;4BACJ,EAAE,EAAE,WAAW;4BACf,EAAE,EAAE,WAAW;yBAChB;qBACF;iBACF,IAEA,KAAK,CAAC,OAAO,CAAC,OAAO,CAAC,IAAI,CACzB,oBAAC,UAAU,IAAC,QAAQ,sBAAY,MAAM,IACnC,OAAO,CAAC,GAAG,CAAC,UAAC,EAAkB;oBAAhB,EAAE,QAAA,EAAE,IAAI,UAAA,EAAE,IAAI,UAAA;gBAAO,OAAA,CACnC,oBAAC,cAAc,IACb,IAAI,EAAE,cAAc,CAClB,OAAO,EACP,IAAI,EACJ,wBAAwB,CAAC,IAAI,CAC9B,EACD,GAAG,EAAE,EAAE,EACP,QAAQ,EAAE,eAAe,KAAK,EAAE,EAChC,SAAS,EAAE,gBAAgB,aAAhB,gBAAgB,uBAAhB,gBAAgB,CAAE,iBAAiB,IAE7C,IAAI,CACU,CAClB;YAboC,CAapC,CAAC,CACS,CACd,CACY,CACT,CACK,CAChB,CAAA;AACH,CAAC,CAAA;AAED,eAAe,mBAAmB,CAAA"}

package/dist/esm/Components/Sections/NavigationSecondary/NavigationSecondary.stories.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import { Meta } from '@storybook/react';
+declare const _default: Meta<import("@storybook/react").Args>;
+export default _default;
+export declare const Primary: React.FC;

package/dist/esm/Components/Sections/NavigationSecondary/NavigationSecondary.stories.js

@@ -0,0 +1,9 @@
+import React from 'react';
+import NavigationSecondary from '.';
+import { ContextName } from '../../../context/types';
+export default {
+    title: 'Components/Sections/NavigationSecondary',
+    component: NavigationSecondary,
+};
+export var Primary = function () { return (React.createElement(NavigationSecondary, { contextName: ContextName.personalDetails })); };
+//# sourceMappingURL=NavigationSecondary.stories.js.map

package/dist/esm/Components/Sections/NavigationSecondary/NavigationSecondary.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NavigationSecondary.stories.js","sourceRoot":"","sources":["../../../../../src/Components/Sections/NavigationSecondary/NavigationSecondary.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,OAAO,mBAAmB,MAAM,GAAG,CAAA;AACnC,OAAO,EAAE,WAAW,EAAE,MAAM,wBAAwB,CAAA;AAEpD,eAAe;IACb,KAAK,EAAE,yCAAyC;IAChD,SAAS,EAAE,mBAAmB;CACvB,CAAA;AAET,MAAM,CAAC,IAAM,OAAO,GAAa,cAAM,OAAA,CACrC,oBAAC,mBAAmB,IAAC,WAAW,EAAE,WAAW,CAAC,eAAe,GAAI,CAClE,EAFsC,CAEtC,CAAA"}

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

@@ -0,0 +1,4 @@
+import NavigationSecondary, { navigationSecondaryHeight } from './NavigationSecondary';
+export * from './types';
+export { navigationSecondaryHeight };
+export default NavigationSecondary;

package/dist/esm/Components/Sections/NavigationSecondary/index.js

@@ -0,0 +1,5 @@
+import NavigationSecondary, { navigationSecondaryHeight, } from './NavigationSecondary';
+export * from './types';
+export { navigationSecondaryHeight };
+export default NavigationSecondary;
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/Components/Sections/NavigationSecondary/index.tsx"],"names":[],"mappings":"AAAA,OAAO,mBAAmB,EAAE,EAC1B,yBAAyB,GAC1B,MAAM,uBAAuB,CAAA;AAC9B,cAAc,SAAS,CAAA;AAEvB,OAAO,EAAE,yBAAyB,EAAE,CAAA;AAEpC,eAAe,mBAAmB,CAAA"}

package/dist/esm/Components/Sections/NavigationSecondary/types.d.ts

@@ -0,0 +1,15 @@
+import { MQ } from 'newskit';
+export interface NavigationSecondaryOverrides {
+    menuItemOverrides?: {
+        stylePreset?: MQ<string>;
+        typographyPreset?: MQ<string>;
+        spaceInset?: MQ<string>;
+    };
+    backgroundColor?: string;
+}
+export interface NavigationSecondaryInterface {
+    text: string;
+    href: string;
+    id: string;
+}
+export declare type NavigationSecondarySelected = string;

package/dist/esm/Components/Sections/NavigationSecondary/types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=types.js.map

package/dist/esm/Components/Sections/NavigationSecondary/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../../src/Components/Sections/NavigationSecondary/types.ts"],"names":[],"mappings":""}

package/dist/esm/Components/Sections/NoSubscription/NoSubscription.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { NoSubscriptionProps } from './types';
+export declare const NoSubscription: React.FC<NoSubscriptionProps>;

package/dist/esm/Components/Sections/NoSubscription/NoSubscription.js

@@ -0,0 +1,20 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import React from 'react';
+import { Header, ButtonGroup } from '@newskit-render/shared-components';
+export var NoSubscription = function (_a) {
+    var header = _a.header, buttonGroupProps = _a.buttonGroupProps;
+    return (React.createElement(React.Fragment, null,
+        React.createElement(Header, __assign({}, header)),
+        React.createElement(ButtonGroup, __assign({}, buttonGroupProps, { hasError: false }))));
+};
+//# sourceMappingURL=NoSubscription.js.map

package/dist/esm/Components/Sections/NoSubscription/NoSubscription.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NoSubscription.js","sourceRoot":"","sources":["../../../../../src/Components/Sections/NoSubscription/NoSubscription.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,mCAAmC,CAAA;AAEvE,MAAM,CAAC,IAAM,cAAc,GAAkC,UAAC,EAG7D;QAFC,MAAM,YAAA,EACN,gBAAgB,sBAAA;IACZ,OAAA,CACJ;QACE,oBAAC,MAAM,eAAK,MAAM,EAAI;QACtB,oBAAC,WAAW,eAAK,gBAAgB,IAAE,QAAQ,EAAE,KAAK,IAAI,CACrD,CACJ;AALK,CAKL,CAAA"}

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

@@ -0,0 +1,2 @@
+export * from './NoSubscription';
+export * from './types';

package/dist/esm/Components/Sections/NoSubscription/index.js

@@ -0,0 +1,3 @@
+export * from './NoSubscription';
+export * from './types';
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/Components/Sections/NoSubscription/index.ts"],"names":[],"mappings":"AAAA,cAAc,kBAAkB,CAAA;AAChC,cAAc,SAAS,CAAA"}

package/dist/esm/Components/Sections/NoSubscription/types.d.ts

@@ -0,0 +1,5 @@
+import { HeaderProps, ButtonGroupProps } from '@newskit-render/shared-components';
+export interface NoSubscriptionProps {
+    header?: HeaderProps;
+    buttonGroupProps?: Partial<ButtonGroupProps>;
+}

package/dist/esm/Components/Sections/NoSubscription/types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=types.js.map

package/dist/esm/Components/Sections/NoSubscription/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../../src/Components/Sections/NoSubscription/types.ts"],"names":[],"mappings":""}

package/dist/esm/Components/Templates/CancellationRender.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+export declare const componentMap: {
+    reason: React.FC<import("../Sections/Form/CancellationReason").ControlledCancellationReasonProps>;
+    confirm: React.FC<import("../Sections/Form/ConfirmCancellation").ConfirmCancellationProps>;
+};
+declare const CancellationRender: React.FC;
+export default CancellationRender;

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

@@ -0,0 +1,41 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import React, { useState } from 'react';
+import { Header } from '@newskit-render/shared-components';
+import { useAccountContext } from '../../context';
+import CancellationReason from '../Sections/Form/CancellationReason';
+import { mergeButtonGroupProps } from '../../helpers';
+import ConfirmCancellation from '../Sections/Form/ConfirmCancellation';
+import { ContextName } from '../../context/types';
+export var componentMap = {
+    reason: CancellationReason,
+    confirm: ConfirmCancellation,
+};
+var CancellationRender = function () {
+    var _a;
+    var contextName = ContextName.cancellation;
+    var _b = useAccountContext(contextName), header = _b.header, cancellation = _b.cancellation, validation = _b.validation, buttonGroupProps = _b.buttonGroupProps, baseUrl = _b.baseUrl;
+    var _c = useState('reason'), componentToRender = _c[0], setComponentToRender = _c[1];
+    var _d = useState({ answer: '' }), cancellationReason = _d[0], setCancellationReason = _d[1];
+    var SectionComponent = componentMap[componentToRender];
+    var pageHeader = cancellation && cancellation[componentToRender].header;
+    var sectionProps = cancellation && cancellation[componentToRender].props;
+    var cancelButtonGroupProps = cancellation && ((_a = cancellation[componentToRender].props) === null || _a === void 0 ? void 0 : _a.buttonGroupProps);
+    return (React.createElement(React.Fragment, null,
+        React.createElement(Header, __assign({}, header, pageHeader, { fullWidthTitle: true })),
+        React.createElement(SectionComponent, __assign({}, sectionProps, { validation: validation, cancellationReason: cancellationReason, onCancellationReasonSelected: function (reason) {
+                setCancellationReason(reason);
+                setComponentToRender('confirm');
+            }, buttonGroupProps: mergeButtonGroupProps(baseUrl, buttonGroupProps, cancelButtonGroupProps) }))));
+};
+export default CancellationRender;
+//# sourceMappingURL=CancellationRender.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"CancellationRender.js","sourceRoot":"","sources":["../../../../src/Components/Templates/CancellationRender.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AACvC,OAAO,EAAE,MAAM,EAAE,MAAM,mCAAmC,CAAA;AAC1D,OAAO,EAA8B,iBAAiB,EAAE,MAAM,eAAe,CAAA;AAC7E,OAAO,kBAAkB,MAAM,qCAAqC,CAAA;AACpE,OAAO,EAAE,qBAAqB,EAAE,MAAM,eAAe,CAAA;AACrD,OAAO,mBAAmB,MAAM,sCAAsC,CAAA;AAEtE,OAAO,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAA;AAEjD,MAAM,CAAC,IAAM,YAAY,GAAG;IAC1B,MAAM,EAAE,kBAAkB;IAC1B,OAAO,EAAE,mBAAmB;CAC7B,CAAA;AAED,IAAM,kBAAkB,GAAa;;IACnC,IAAM,WAAW,GAAG,WAAW,CAAC,YAAY,CAAA;IACtC,IAAA,KAMF,iBAAiB,CAAC,WAAW,CAA+B,EAL9D,MAAM,YAAA,EACN,YAAY,kBAAA,EACZ,UAAU,gBAAA,EACV,gBAAgB,sBAAA,EAChB,OAAO,aACuD,CAAA;IAE1D,IAAA,KAA4C,QAAQ,CAExD,QAAQ,CAAC,EAFJ,iBAAiB,QAAA,EAAE,oBAAoB,QAEnC,CAAA;IACL,IAAA,KAGF,QAAQ,CAA4B,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC,EAFrD,kBAAkB,QAAA,EAClB,qBAAqB,QACgC,CAAA;IAEvD,IAAM,gBAAgB,GAAG,YAAY,CAAC,iBAAiB,CAAC,CAAA;IACxD,IAAM,UAAU,GAAG,YAAY,IAAI,YAAY,CAAC,iBAAiB,CAAC,CAAC,MAAM,CAAA;IACzE,IAAM,YAAY,GAAG,YAAY,IAAI,YAAY,CAAC,iBAAiB,CAAC,CAAC,KAAK,CAAA;IAC1E,IAAM,sBAAsB,GAC1B,YAAY,KAAI,MAAA,YAAY,CAAC,iBAAiB,CAAC,CAAC,KAAK,0CAAE,gBAAgB,CAAA,CAAA;IAEzE,OAAO,CACL;QACE,oBAAC,MAAM,eAAK,MAAM,EAAM,UAAU,IAAE,cAAc,UAAG;QACrD,oBAAC,gBAAgB,eACX,YAAY,IAChB,UAAU,EAAE,UAAU,EACtB,kBAAkB,EAAE,kBAAkB,EACtC,4BAA4B,EAAE,UAAC,MAAM;gBACnC,qBAAqB,CAAC,MAAM,CAAC,CAAA;gBAC7B,oBAAoB,CAAC,SAAS,CAAC,CAAA;YACjC,CAAC,EACD,gBAAgB,EAAE,qBAAqB,CACrC,OAAO,EACP,gBAAgB,EAChB,sBAAsB,CACvB,IACD,CACD,CACJ,CAAA;AACH,CAAC,CAAA;AAED,eAAe,kBAAkB,CAAA"}

package/dist/esm/Components/Templates/DisplayRenderer.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import { ContextName } from '../../context/types';
+declare type DisplayRenderProps = {
+    contextName: ContextName;
+};
+declare const DisplayRenderer: React.FC<DisplayRenderProps>;
+export default DisplayRenderer;

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

@@ -0,0 +1,40 @@
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import React from 'react';
+import ContentListView from '../Sections/ContentListView';
+import { Header } from '@newskit-render/shared-components';
+import { useAccountContext, } from '../../context';
+import { Block, getMediaQueryFromTheme, styled } from 'newskit';
+var componentMap = {
+    list: ContentListView,
+};
+var StyledBlock = styled(Block)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  clear: both;\n  ", " {\n    max-width: 440px;\n  }\n  ", " {\n    max-width: 560px;\n  }\n"], ["\n  clear: both;\n  ", " {\n    max-width: 440px;\n  }\n  ", " {\n    max-width: 560px;\n  }\n"])), getMediaQueryFromTheme('md'), getMediaQueryFromTheme('lg'));
+var DisplayRenderer = function (_a) {
+    var contextName = _a.contextName;
+    var _b = useAccountContext(contextName), header = _b.header, sections = _b.sections;
+    return (React.createElement(React.Fragment, null,
+        React.createElement(Header, __assign({ descriptionOverrides: {
+                spaceStack: { xs: 'space050', md: 'space080' },
+            } }, header)),
+        React.createElement(StyledBlock, null, Array.isArray(sections) &&
+            sections.map(function (section, i) {
+                var SectionComponent = componentMap[section.type];
+                return (React.createElement(SectionComponent, __assign({}, section.props, { contextName: contextName, key: i })));
+            }))));
+};
+export default DisplayRenderer;
+var templateObject_1;
+//# sourceMappingURL=DisplayRenderer.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"DisplayRenderer.js","sourceRoot":"","sources":["../../../../src/Components/Templates/DisplayRenderer.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,eAAe,MAAM,6BAA6B,CAAA;AACzD,OAAO,EAAE,MAAM,EAAE,MAAM,mCAAmC,CAAA;AAC1D,OAAO,EAEL,iBAAiB,GAClB,MAAM,eAAe,CAAA;AACtB,OAAO,EAAE,KAAK,EAAE,sBAAsB,EAAE,MAAM,EAAE,MAAM,SAAS,CAAA;AAG/D,IAAM,YAAY,GAAG;IACnB,IAAI,EAAE,eAAe;CACtB,CAAA;AACD,IAAM,WAAW,GAAG,MAAM,CAAC,KAAK,CAAC,mKAAA,sBAE7B,EAA4B,oCAG5B,EAA4B,kCAG/B,KANG,sBAAsB,CAAC,IAAI,CAAC,EAG5B,sBAAsB,CAAC,IAAI,CAAC,CAG/B,CAAA;AAMD,IAAM,eAAe,GAAiC,UAAC,EAAe;QAAb,WAAW,iBAAA;IAC5D,IAAA,KAAuB,iBAAiB,CAC5C,WAAW,CACwB,EAF7B,MAAM,YAAA,EAAE,QAAQ,cAEa,CAAA;IAErC,OAAO,CACL;QACE,oBAAC,MAAM,aACL,oBAAoB,EAAE;gBACpB,UAAU,EAAE,EAAE,EAAE,EAAE,UAAU,EAAE,EAAE,EAAE,UAAU,EAAE;aAC/C,IACG,MAAM,EACV;QACF,oBAAC,WAAW,QACT,KAAK,CAAC,OAAO,CAAC,QAAQ,CAAC;YACtB,QAAQ,CAAC,GAAG,CAAC,UAAC,OAAO,EAAE,CAAC;gBACtB,IAAM,gBAAgB,GAAG,YAAY,CAAC,OAAO,CAAC,IAAI,CAAC,CAAA;gBACnD,OAAO,CACL,oBAAC,gBAAgB,eACX,OAAO,CAAC,KAAK,IACjB,WAAW,EAAE,WAAW,EACxB,GAAG,EAAE,CAAC,IACN,CACH,CAAA;YACH,CAAC,CAAC,CACQ,CACb,CACJ,CAAA;AACH,CAAC,CAAA;AAED,eAAe,eAAe,CAAA"}

package/dist/esm/Components/Templates/EditRenderer.d.ts

@@ -0,0 +1,15 @@
+import React from 'react';
+export declare const componentMap: {
+    address: React.FC<import("../Sections/Form/Address/types").AddressProps>;
+    name: React.FC<import("@newskit-render/shared-components").FormWrapperProps>;
+    email: React.FC<import("@newskit-render/shared-components").FormWrapperProps>;
+    displayName: React.FC<import("@newskit-render/shared-components").FormWrapperProps>;
+    password: React.FC<import("../Sections/Form/Password").PasswordProps>;
+    landline: React.FC<import("@newskit-render/shared-components").FormWrapperProps>;
+    mobile: React.FC<import("@newskit-render/shared-components").FormWrapperProps>;
+    'commenting-notifications': React.FC<import("../Sections/Form/CommentingNotifications").CommentingNotificationsProps>;
+};
+declare const EditRenderer: React.FC<{
+    type: string;
+}>;
+export default EditRenderer;

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

@@ -0,0 +1,54 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import React from 'react';
+import { Header } from '@newskit-render/shared-components';
+import FormName from '../Sections/Form/Name';
+import DisplayName from '../Sections/Form/DisplayName';
+import Password from '../Sections/Form/Password';
+import Email from '../Sections/Form/Email';
+import { useAccountContext } from '../../context';
+import Landline from '../Sections/Form/Landline';
+import Mobile from '../Sections/Form/Mobile';
+import FormAddress from '../Sections/Form/Address/FormAddress';
+import CommentingNotifications from '../Sections/Form/CommentingNotifications';
+import { mergeButtonGroupProps, replaceBaseURL } from '../../helpers';
+import { FALLBACK_URL_REPLACEMENT } from '../../constants';
+import { ContextName } from '../../context/types';
+export var componentMap = {
+    address: FormAddress,
+    name: FormName,
+    email: Email,
+    displayName: DisplayName,
+    password: Password,
+    landline: Landline,
+    mobile: Mobile,
+    'commenting-notifications': CommentingNotifications,
+};
+var EditRenderer = function (_a) {
+    var type = _a.type;
+    var contextName = ContextName.editField;
+    var _b = useAccountContext(contextName), header = _b.header, forms = _b.forms, buttonGroupProps = _b.buttonGroupProps, baseUrl = _b.baseUrl;
+    var SectionComponent = componentMap[type];
+    if (!SectionComponent) {
+        return React.createElement(React.Fragment, null);
+    }
+    var form = forms[type] || forms.default;
+    // TODO this can be remove once payment method and notification have cancel button
+    if (form && form.header && form.header.backButton) {
+        form.header.backButton.href = replaceBaseURL(baseUrl, form.header.backButton.href, FALLBACK_URL_REPLACEMENT.home);
+    }
+    return (React.createElement(React.Fragment, null,
+        React.createElement(Header, __assign({}, header, form.header)),
+        React.createElement(SectionComponent, __assign({ "data-testid": type + "-form" }, form.props, { buttonGroupProps: mergeButtonGroupProps(baseUrl, buttonGroupProps, form.props.buttonGroupProps) }))));
+};
+export default EditRenderer;
+//# sourceMappingURL=EditRenderer.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"EditRenderer.js","sourceRoot":"","sources":["../../../../src/Components/Templates/EditRenderer.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,MAAM,EAAE,MAAM,mCAAmC,CAAA;AAC1D,OAAO,QAAQ,MAAM,uBAAuB,CAAA;AAC5C,OAAO,WAAW,MAAM,8BAA8B,CAAA;AACtD,OAAO,QAAQ,MAAM,2BAA2B,CAAA;AAChD,OAAO,KAAK,MAAM,wBAAwB,CAAA;AAC1C,OAAO,EAA2B,iBAAiB,EAAE,MAAM,eAAe,CAAA;AAC1E,OAAO,QAAQ,MAAM,2BAA2B,CAAA;AAChD,OAAO,MAAM,MAAM,yBAAyB,CAAA;AAC5C,OAAO,WAAW,MAAM,sCAAsC,CAAA;AAC9D,OAAO,uBAAuB,MAAM,0CAA0C,CAAA;AAC9E,OAAO,EAAE,qBAAqB,EAAE,cAAc,EAAE,MAAM,eAAe,CAAA;AACrE,OAAO,EAAE,wBAAwB,EAAE,MAAM,iBAAiB,CAAA;AAC1D,OAAO,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAA;AAEjD,MAAM,CAAC,IAAM,YAAY,GAAG;IAC1B,OAAO,EAAE,WAAW;IACpB,IAAI,EAAE,QAAQ;IACd,KAAK,EAAE,KAAK;IACZ,WAAW,EAAE,WAAW;IACxB,QAAQ,EAAE,QAAQ;IAClB,QAAQ,EAAE,QAAQ;IAClB,MAAM,EAAE,MAAM;IACd,0BAA0B,EAAE,uBAAuB;CACpD,CAAA;AAED,IAAM,YAAY,GAA+B,UAAC,EAAQ;QAAN,IAAI,UAAA;IACtD,IAAM,WAAW,GAAG,WAAW,CAAC,SAAS,CAAA;IACnC,IAAA,KAA+C,iBAAiB,CACpE,WAAW,CACe,EAFpB,MAAM,YAAA,EAAE,KAAK,WAAA,EAAE,gBAAgB,sBAAA,EAAE,OAAO,aAEpB,CAAA;IAC5B,IAAM,gBAAgB,GAAG,YAAY,CAAC,IAAI,CAAC,CAAA;IAE3C,IAAI,CAAC,gBAAgB,EAAE;QACrB,OAAO,yCAAK,CAAA;KACb;IACD,IAAM,IAAI,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,KAAK,CAAC,OAAO,CAAA;IAEzC,kFAAkF;IAClF,IAAI,IAAI,IAAI,IAAI,CAAC,MAAM,IAAI,IAAI,CAAC,MAAM,CAAC,UAAU,EAAE;QACjD,IAAI,CAAC,MAAM,CAAC,UAAU,CAAC,IAAI,GAAG,cAAc,CAC1C,OAAO,EACP,IAAI,CAAC,MAAM,CAAC,UAAU,CAAC,IAAI,EAC3B,wBAAwB,CAAC,IAAI,CAC9B,CAAA;KACF;IACD,OAAO,CACL;QACE,oBAAC,MAAM,eAAK,MAAM,EAAM,IAAI,CAAC,MAAM,EAAI;QACvC,oBAAC,gBAAgB,4BACC,IAAI,UAAO,IACvB,IAAI,CAAC,KAAK,IACd,gBAAgB,EAAE,qBAAqB,CACrC,OAAO,EACP,gBAAgB,EAChB,IAAI,CAAC,KAAK,CAAC,gBAAgB,CAC5B,IACD,CACD,CACJ,CAAA;AACH,CAAC,CAAA;AAED,eAAe,YAAY,CAAA"}

package/dist/esm/Components/Templates/LayoutTemplate.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+import { UncompiledTheme } from 'newskit';
+import { LayoutProps } from './types';
+import { ContextName } from '../../context/types';
+export interface NavigationPrimaryWrapperProps {
+    customTheme?: UncompiledTheme;
+    setTheme?: (theme: UncompiledTheme) => void;
+    contextName: ContextName;
+}
+declare const LayoutTemplate: React.FC<LayoutProps>;
+export default LayoutTemplate;

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

@@ -0,0 +1,73 @@
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import React from 'react';
+import { styled, getMediaQueryFromTheme, ThemeProvider, Block, ToastProvider, } from 'newskit';
+import NavigationSecondary from '../Sections/NavigationSecondary';
+import { NavigationFooter, LayoutGrid, NavigationPrimary, largeDesktop, sharedTheme, } from '@newskit-render/shared-components';
+import { AccountContextProvider, useAccountContext, } from '../../context';
+import Head from '../Elements/Head';
+import PastDueBanner from '../Elements/PastDueBanner';
+var LayoutWrapper = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: flex;\n  justify-content: center;\n  width: 100%;\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale;\n  flex-direction: column;\n  ", " {\n    flex-direction: initial;\n  }\n"], ["\n  display: flex;\n  justify-content: center;\n  width: 100%;\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale;\n  flex-direction: column;\n  ", " {\n    flex-direction: initial;\n  }\n"])), getMediaQueryFromTheme('lg'));
+var OffSetArea = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  width: 100%;\n  display: flex;\n  flex-direction: column;\n  ", " {\n    padding-left: ", "px;\n  }\n"], ["\n  width: 100%;\n  display: flex;\n  flex-direction: column;\n  ", " {\n    padding-left: ", "px;\n  }\n"])), getMediaQueryFromTheme('lg'), function (_a) {
+    var offset = _a.offset;
+    return (offset ? '300' : '0');
+});
+var FooterArea = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  flex-shrink: 0;\n"], ["\n  flex-shrink: 0;\n"])));
+var NavWrapper = styled(Block)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  width: 100%;\n  z-index: 2;\n\n  ", " {\n    position: sticky;\n    top: 0;\n  }\n"], ["\n  width: 100%;\n  z-index: 2;\n\n  ", " {\n    position: sticky;\n    top: 0;\n  }\n"])), getMediaQueryFromTheme('md'));
+var BannerDesktop = largeDesktop(PastDueBanner);
+var MobileBanner = styled(PastDueBanner)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  ", " {\n    display: none;\n  }\n  display: block;\n  width: 100%;\n"], ["\n  ", " {\n    display: none;\n  }\n  display: block;\n  width: 100%;\n"])), getMediaQueryFromTheme('md'));
+var TabletBanner = styled(PastDueBanner)(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  ", " {\n    display: block;\n  }\n  ", " {\n    display: none;\n  }\n  display: none;\n  width: 100%;\n"], ["\n  ", " {\n    display: block;\n  }\n  ", " {\n    display: none;\n  }\n  display: none;\n  width: 100%;\n"])), getMediaQueryFromTheme('md'), getMediaQueryFromTheme('lg'));
+var StickyDiv = styled.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n  position: sticky;\n  top: 0;\n  z-index: 2;\n  ", " {\n    top: 80px;\n  }\n  ", " {\n    width: initial;\n    bottom: 0;\n  }\n"], ["\n  position: sticky;\n  top: 0;\n  z-index: 2;\n  ", " {\n    top: 80px;\n  }\n  ", " {\n    width: initial;\n    bottom: 0;\n  }\n"])), getMediaQueryFromTheme('md'), getMediaQueryFromTheme('lg'));
+var FooterWrapper = function (_a) {
+    var contextName = _a.contextName;
+    var _b = useAccountContext(contextName), footer = _b.footer, footerOverrides = _b.footerOverrides;
+    return (React.createElement(FooterArea, null,
+        React.createElement(NavigationFooter, { footer: footer, footerOverrides: footerOverrides })));
+};
+var NavigationPrimaryWrapper = function (_a) {
+    var customTheme = _a.customTheme, setTheme = _a.setTheme, contextName = _a.contextName;
+    var navigationPrimary = useAccountContext(contextName).navigationPrimary;
+    return (React.createElement(NavigationPrimary, __assign({}, navigationPrimary, { customTheme: customTheme, setTheme: setTheme })));
+};
+var LayoutTemplate = function (_a) {
+    var children = _a.children, _b = _a.sidebar, sidebar = _b === void 0 ? false : _b, _c = _a.footer, footer = _c === void 0 ? false : _c, customTheme = _a.customTheme, setTheme = _a.setTheme, context = _a.context, toastProviderProps = _a.toastProviderProps, contextName = _a.contextName;
+    return (React.createElement(AccountContextProvider, { context: context, contextName: contextName },
+        React.createElement(Head, { contextName: contextName }),
+        React.createElement(ThemeProvider, { theme: customTheme || sharedTheme },
+            React.createElement(NavWrapper, null,
+                React.createElement(NavigationPrimaryWrapper, { customTheme: customTheme, setTheme: setTheme, contextName: contextName }),
+                React.createElement(BannerDesktop, { contextName: contextName })),
+            React.createElement(LayoutWrapper, null,
+                React.createElement(StickyDiv, null,
+                    sidebar && React.createElement(NavigationSecondary, { contextName: contextName }),
+                    React.createElement(MobileBanner, { contextName: contextName })),
+                React.createElement(TabletBanner, { contextName: contextName }),
+                React.createElement(MobileBanner, { contextName: contextName }),
+                React.createElement(OffSetArea, { offset: +sidebar },
+                    React.createElement(LayoutGrid, { hasSidebar: sidebar, margin: {
+                            xsMargin: 'space050',
+                            smMargin: 'space060',
+                            mdMargin: 'space000',
+                        }, gutter: {
+                            xsColumnGutter: 'space020',
+                            smColumnGutter: 'space040',
+                        } }, children),
+                    footer && React.createElement(FooterWrapper, { contextName: contextName })))),
+        React.createElement(ToastProvider, __assign({ position: 'bottom-center' }, toastProviderProps))));
+};
+export default LayoutTemplate;
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7;
+//# sourceMappingURL=LayoutTemplate.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"LayoutTemplate.js","sourceRoot":"","sources":["../../../../src/Components/Templates/LayoutTemplate.tsx"],"names":[],"mappings":"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"}

package/dist/esm/Components/Templates/PaymentRenderer.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+export declare const componentMap: {
+    Stripe: React.ComponentType<import("@newskit-render/shared-components").FormWrapperProps & {
+        theme?: import("newskit").Theme | undefined;
+    }>;
+    Zuora: React.FC<{}>;
+};
+declare const PaymentRenderer: React.FC;
+export default PaymentRenderer;

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

@@ -0,0 +1,35 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import React from 'react';
+import { Header } from '@newskit-render/shared-components';
+import { useAccountContext } from '../../context';
+import { mergeButtonGroupProps, replaceBaseURL } from '../../helpers';
+import { Zuora, Stripe } from '../Sections/Form/Payment';
+import { ContextName } from '../../context/types';
+export var componentMap = {
+    Stripe: Stripe,
+    Zuora: Zuora,
+};
+var PaymentRenderer = function () {
+    var contextName = ContextName.payment;
+    var _a = useAccountContext(contextName), header = _a.header, buttonGroupProps = _a.buttonGroupProps, paymentProvider = _a.paymentProvider, baseUrl = _a.baseUrl;
+    var ProviderComponent = componentMap[paymentProvider];
+    if (header && header.backButton) {
+        header.backButton.href =
+            replaceBaseURL(baseUrl, baseUrl, header.backButton.href) || '/';
+    }
+    return (React.createElement(React.Fragment, null,
+        React.createElement(Header, __assign({}, header)),
+        React.createElement(ProviderComponent, { "data-testid": paymentProvider + "-form", buttonGroupProps: mergeButtonGroupProps(baseUrl, undefined, buttonGroupProps) })));
+};
+export default PaymentRenderer;
+//# sourceMappingURL=PaymentRenderer.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"PaymentRenderer.js","sourceRoot":"","sources":["../../../../src/Components/Templates/PaymentRenderer.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,MAAM,EAAE,MAAM,mCAAmC,CAAA;AAC1D,OAAO,EAA6B,iBAAiB,EAAE,MAAM,eAAe,CAAA;AAC5E,OAAO,EAAE,qBAAqB,EAAE,cAAc,EAAE,MAAM,eAAe,CAAA;AACrE,OAAO,EAAE,KAAK,EAAE,MAAM,EAAmB,MAAM,0BAA0B,CAAA;AACzE,OAAO,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAA;AAEjD,MAAM,CAAC,IAAM,YAAY,GAAG;IAC1B,MAAM,QAAA;IACN,KAAK,OAAA;CACN,CAAA;AAED,IAAM,eAAe,GAAa;IAChC,IAAM,WAAW,GAAG,WAAW,CAAC,OAAO,CAAA;IAEjC,IAAA,KAKF,iBAAiB,CAAC,WAAW,CAA8B,EAJ7D,MAAM,YAAA,EACN,gBAAgB,sBAAA,EAChB,eAAe,qBAAA,EACf,OAAO,aACsD,CAAA;IAC/D,IAAM,iBAAiB,GAAG,YAAY,CAAC,eAAkC,CAAC,CAAA;IAE1E,IAAI,MAAM,IAAI,MAAM,CAAC,UAAU,EAAE;QAC/B,MAAM,CAAC,UAAU,CAAC,IAAI;YACpB,cAAc,CAAC,OAAO,EAAE,OAAO,EAAE,MAAM,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,GAAG,CAAA;KAClE;IAED,OAAO,CACL;QACE,oBAAC,MAAM,eAAK,MAAM,EAAI;QACtB,oBAAC,iBAAiB,mBACA,eAAe,UAAO,EACtC,gBAAgB,EAAE,qBAAqB,CACrC,OAAO,EACP,SAAS,EACT,gBAAgB,CACjB,GACD,CACD,CACJ,CAAA;AACH,CAAC,CAAA;AAED,eAAe,eAAe,CAAA"}

package/dist/esm/Components/Templates/SubscriptionAndBillingRender.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { ContextNameProps } from '../../context/types';
+declare const SubscriptionAndBillingRender: React.FC<ContextNameProps>;
+export default SubscriptionAndBillingRender;

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

@@ -0,0 +1,45 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import React from 'react';
+import { useAccountContext } from '../../context';
+import { DisplayRenderer } from './';
+import { NoSubscription } from '../Sections/NoSubscription';
+import { formateDate } from '../../helpers';
+var replaceDescription = function (description, type, endDate) {
+    return description
+        .replace('${serviceCancellationDate}', endDate)
+        .replace('${subscriptionName}', type);
+};
+var SubscriptionAndBillingRender = function (_a) {
+    var _b;
+    var contextName = _a.contextName;
+    var _c = useAccountContext(contextName), userData = _c.userData, noSubscription = _c.noSubscription, previousSubscription = _c.previousSubscription;
+    var subscriptions = userData === null || userData === void 0 ? void 0 : userData.subscriptions;
+    if (!subscriptions ||
+        (Array.isArray(subscriptions) && !subscriptions.length)) {
+        return React.createElement(NoSubscription, __assign({}, noSubscription));
+    }
+    if (Array.isArray(subscriptions) &&
+        subscriptions[0].status &&
+        subscriptions[0].status === 'Cancelled') {
+        var _d = subscriptions[0], type = _d.type, endDate = _d.endDate;
+        var header = ((_b = previousSubscription === null || previousSubscription === void 0 ? void 0 : previousSubscription.header) === null || _b === void 0 ? void 0 : _b.description) &&
+            !Array.isArray(previousSubscription.header.description) &&
+            type &&
+            endDate
+            ? __assign(__assign({}, previousSubscription.header), { description: replaceDescription(previousSubscription.header.description, type, formateDate(endDate)) }) : previousSubscription === null || previousSubscription === void 0 ? void 0 : previousSubscription.header;
+        return React.createElement(NoSubscription, __assign({}, previousSubscription, { header: header }));
+    }
+    return React.createElement(DisplayRenderer, { contextName: contextName });
+};
+export default SubscriptionAndBillingRender;
+//# sourceMappingURL=SubscriptionAndBillingRender.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"SubscriptionAndBillingRender.js","sourceRoot":"","sources":["../../../../src/Components/Templates/SubscriptionAndBillingRender.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAA;AACjD,OAAO,EAAE,eAAe,EAAE,MAAM,IAAI,CAAA;AACpC,OAAO,EAAE,cAAc,EAAE,MAAM,4BAA4B,CAAA;AAC3D,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAA;AAM3C,IAAM,kBAAkB,GAAG,UACzB,WAAmB,EACnB,IAAY,EACZ,OAAe;IAEf,OAAO,WAAW;SACf,OAAO,CAAC,4BAA4B,EAAE,OAAO,CAAC;SAC9C,OAAO,CAAC,qBAAqB,EAAE,IAAI,CAAC,CAAA;AACzC,CAAC,CAAA;AAED,IAAM,4BAA4B,GAA+B,UAAC,EAEjE;;QADC,WAAW,iBAAA;IAEL,IAAA,KAAqD,iBAAiB,CAC1E,WAAW,CAC4B,EAFjC,QAAQ,cAAA,EAAE,cAAc,oBAAA,EAAE,oBAAoB,0BAEb,CAAA;IAEzC,IAAM,aAAa,GAAG,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAE,aAAa,CAAA;IAC7C,IACE,CAAC,aAAa;QACd,CAAC,KAAK,CAAC,OAAO,CAAC,aAAa,CAAC,IAAI,CAAC,aAAa,CAAC,MAAM,CAAC,EACvD;QACA,OAAO,oBAAC,cAAc,eAAK,cAAc,EAAI,CAAA;KAC9C;IAED,IACE,KAAK,CAAC,OAAO,CAAC,aAAa,CAAC;QAC5B,aAAa,CAAC,CAAC,CAAC,CAAC,MAAM;QACvB,aAAa,CAAC,CAAC,CAAC,CAAC,MAAM,KAAK,WAAW,EACvC;QACM,IAAA,KAAoB,aAAa,CAAC,CAAC,CAAC,EAAlC,IAAI,UAAA,EAAE,OAAO,aAAqB,CAAA;QAC1C,IAAM,MAAM,GACV,CAAA,MAAA,oBAAoB,aAApB,oBAAoB,uBAApB,oBAAoB,CAAE,MAAM,0CAAE,WAAW;YACzC,CAAC,KAAK,CAAC,OAAO,CAAC,oBAAoB,CAAC,MAAM,CAAC,WAAW,CAAC;YACvD,IAAI;YACJ,OAAO;YACL,CAAC,uBACM,oBAAoB,CAAC,MAAM,KAC9B,WAAW,EAAE,kBAAkB,CAC7B,oBAAoB,CAAC,MAAM,CAAC,WAAW,EACvC,IAAI,EACJ,WAAW,CAAC,OAAO,CAAC,CACrB,IAEL,CAAC,CAAC,oBAAoB,aAApB,oBAAoB,uBAApB,oBAAoB,CAAE,MAAM,CAAA;QAClC,OAAO,oBAAC,cAAc,eAAK,oBAAoB,IAAE,MAAM,EAAE,MAAM,IAAI,CAAA;KACpE;IAED,OAAO,oBAAC,eAAe,IAAC,WAAW,EAAE,WAAW,GAAI,CAAA;AACtD,CAAC,CAAA;AAED,eAAe,4BAA4B,CAAA"}

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

@@ -0,0 +1,9 @@
+import Layout from './LayoutTemplate';
+import DisplayRenderer from './DisplayRenderer';
+import EditRenderer, { componentMap } from './EditRenderer';
+import CancellationRender from './CancellationRender';
+import PaymentRenderer from './PaymentRenderer';
+import SubscriptionAndBillingRender from './SubscriptionAndBillingRender';
+export * from './types';
+export { DisplayRenderer, EditRenderer, componentMap, CancellationRender, PaymentRenderer, SubscriptionAndBillingRender, };
+export default Layout;

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

@@ -0,0 +1,10 @@
+import Layout from './LayoutTemplate';
+import DisplayRenderer from './DisplayRenderer';
+import EditRenderer, { componentMap } from './EditRenderer';
+import CancellationRender from './CancellationRender';
+import PaymentRenderer from './PaymentRenderer';
+import SubscriptionAndBillingRender from './SubscriptionAndBillingRender';
+export * from './types';
+export { DisplayRenderer, EditRenderer, componentMap, CancellationRender, PaymentRenderer, SubscriptionAndBillingRender, };
+export default Layout;
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/Components/Templates/index.tsx"],"names":[],"mappings":"AAAA,OAAO,MAAM,MAAM,kBAAkB,CAAA;AACrC,OAAO,eAAe,MAAM,mBAAmB,CAAA;AAC/C,OAAO,YAAY,EAAE,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAA;AAC3D,OAAO,kBAAkB,MAAM,sBAAsB,CAAA;AACrD,OAAO,eAAe,MAAM,mBAAmB,CAAA;AAC/C,OAAO,4BAA4B,MAAM,gCAAgC,CAAA;AAEzE,cAAc,SAAS,CAAA;AACvB,OAAO,EACL,eAAe,EACf,YAAY,EACZ,YAAY,EACZ,kBAAkB,EAClB,eAAe,EACf,4BAA4B,GAC7B,CAAA;AACD,eAAe,MAAM,CAAA"}