@newskit-render/shared-components 3.6.1-alpha.0 → 3.7.0-alpha.0

package/dist/cjs/NavigationFooter/NavigationFooter.d.ts

@@ -1,2 +1,2 @@
 import { FooterProps } from './types';
-export declare const footerOverrides: ({ footer, footerOverrides, margin, gutter, }: FooterProps) => JSX.Element;
+export declare const footerOverrides: ({ footer, footerOverrides, }: FooterProps) => JSX.Element;

package/dist/cjs/NavigationFooter/NavigationFooter.js

@@ -1,8 +1,4 @@
 "use strict";
-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++) {
@@ -21,39 +17,21 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.footerOverrides = void 0;
 var react_1 = __importDefault(require("react"));
 var newskit_1 = require("newskit");
-var Container_1 = __importDefault(require("./components/Container"));
-var FooterMenu_1 = __importDefault(require("./components/FooterMenu"));
 var baseContext_1 = require("../helpers/baseContext");
-var FooterWrapper = newskit_1.styled.footer(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  ", ";\n  width: 100%;\n"], ["\n  ", ";\n  width: 100%;\n"])), function (_a) {
-    var backgroundColor = _a.backgroundColor;
-    return backgroundColor &&
-        (0, newskit_1.getColorCssFromTheme)('backgroundColor', backgroundColor);
-});
-var FooterDivider = (0, newskit_1.styled)(newskit_1.Divider)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  ", ";\n"], ["\n  ", ";\n"])), function (_a) {
-    var borderColor = _a.borderColor;
-    return borderColor && (0, newskit_1.getColorCssFromTheme)('borderColor', borderColor);
-});
+var FooterLinks_1 = require("./components/FooterLinks");
 var footerOverrides = function (_a) {
-    var _b, _c, _d, _e;
-    var footer = _a.footer, footerOverrides = _a.footerOverrides, margin = _a.margin, gutter = _a.gutter;
+    var _b;
+    var footer = _a.footer, footerOverrides = _a.footerOverrides;
     var HelpChat = footer && footer.helpChat;
-    return (react_1.default.createElement(newskit_1.MediaQueryProvider, null,
-        react_1.default.createElement(FooterWrapper, { "data-testid": "NavigationFooter", backgroundColor: (_b = footerOverrides.menuOverrides) === null || _b === void 0 ? void 0 : _b.backgroundColor },
-            react_1.default.createElement(FooterDivider, { borderColor: (_c = footerOverrides.menuOverrides) === null || _c === void 0 ? void 0 : _c.borderColorTop }),
-            HelpChat ? (react_1.default.createElement(HelpChat, { chatHelpOverrides: footerOverrides.chatHelpOverrides
-                    ? footerOverrides.chatHelpOverrides
-                    : baseContext_1.baseContext.footerOverrides.chatHelpOverrides })) : null,
-            react_1.default.createElement(newskit_1.Grid, __assign({}, margin, gutter, { xsRowGutter: "space050" }),
-                react_1.default.createElement(newskit_1.Cell, { xs: 12 }),
-                react_1.default.createElement(newskit_1.Cell, { xs: 12 },
-                    react_1.default.createElement(FooterMenu_1.default, { footer: footer, footerOverrides: footerOverrides })),
-                react_1.default.createElement(newskit_1.Cell, { xs: 12 },
-                    react_1.default.createElement(FooterDivider, { borderColor: (_d = footerOverrides.menuOverrides) === null || _d === void 0 ? void 0 : _d.borderColorBottom })),
-                react_1.default.createElement(newskit_1.Cell, { xs: 12 },
-                    react_1.default.createElement(Container_1.default, { marginBlockEnd: (_e = footerOverrides.menuOverrides) === null || _e === void 0 ? void 0 : _e.marginBlockEnd },
-                        react_1.default.createElement(newskit_1.TextBlock, __assign({}, footerOverrides.legalTextOverrides), footer.legalText))),
-                react_1.default.createElement(newskit_1.Cell, { xs: 12 })))));
+    return (react_1.default.createElement(newskit_1.Block, { as: "footer", "data-testid": "NavigationFooter", stylePreset: (_b = footerOverrides.footerStyleOverrides) === null || _b === void 0 ? void 0 : _b.stylePreset },
+        react_1.default.createElement(newskit_1.Divider, { overrides: __assign({}, footerOverrides.footerDividerOverrides) }),
+        HelpChat ? (react_1.default.createElement(HelpChat, { chatHelpOverrides: footerOverrides.chatHelpOverrides
+                ? footerOverrides.chatHelpOverrides
+                : baseContext_1.baseContext.footerOverrides.chatHelpOverrides })) : null,
+        react_1.default.createElement(newskit_1.Block, __assign({}, footerOverrides.footerAreaOverrides),
+            react_1.default.createElement(FooterLinks_1.FooterLinks, { footer: footer, footerOverrides: footerOverrides }),
+            react_1.default.createElement(newskit_1.Divider, { overrides: __assign({}, footerOverrides.linksDividerOverrides) }),
+            react_1.default.createElement(newskit_1.TextBlock, __assign({}, footerOverrides.legalTextOverrides), footer.legalText))));
 };
 exports.footerOverrides = footerOverrides;
-var templateObject_1, templateObject_2;
 //# sourceMappingURL=NavigationFooter.js.map

package/dist/cjs/NavigationFooter/NavigationFooter.js.map

@@ -1 +1 @@
-{"version":3,"file":"NavigationFooter.js","sourceRoot":"","sources":["../../../src/NavigationFooter/NavigationFooter.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA,gDAAyB;AACzB,mCAQgB;AAEhB,qEAA8C;AAC9C,uEAAgD;AAChD,sDAAoD;AACpD,IAAM,aAAa,GAAG,gBAAM,CAAC,MAAM,gGAA8B,MAC7D,EAEwD,qBAE3D,KAJG,UAAC,EAAmB;QAAjB,eAAe,qBAAA;IAClB,OAAA,eAAe;QACf,IAAA,8BAAoB,EAAC,iBAAiB,EAAE,eAAe,CAAC;AADxD,CACwD,CAE3D,CAAA;AAED,IAAM,aAAa,GAAG,IAAA,gBAAM,EAAC,iBAAO,CAAC,gFAA0B,MAC3D,EAC+D,KAClE,KAFG,UAAC,EAAe;QAAb,WAAW,iBAAA;IACd,OAAA,WAAW,IAAI,IAAA,8BAAoB,EAAC,aAAa,EAAE,WAAW,CAAC;AAA/D,CAA+D,CAClE,CAAA;AACM,IAAM,eAAe,GAAG,UAAC,EAKlB;;QAJZ,MAAM,YAAA,EACN,eAAe,qBAAA,EACf,MAAM,YAAA,EACN,MAAM,YAAA;IAEN,IAAM,QAAQ,GAAG,MAAM,IAAI,MAAM,CAAC,QAAQ,CAAA;IAC1C,OAAO,CACL,8BAAC,4BAAkB;QACjB,8BAAC,aAAa,mBACA,kBAAkB,EAC9B,eAAe,EAAE,MAAA,eAAe,CAAC,aAAa,0CAAE,eAAe;YAE/D,8BAAC,aAAa,IACZ,WAAW,EAAE,MAAA,eAAe,CAAC,aAAa,0CAAE,cAAc,GAC1D;YACD,QAAQ,CAAC,CAAC,CAAC,CACV,8BAAC,QAAQ,IACP,iBAAiB,EACf,eAAe,CAAC,iBAAiB;oBAC/B,CAAC,CAAC,eAAe,CAAC,iBAAiB;oBACnC,CAAC,CAAC,yBAAW,CAAC,eAAe,CAAC,iBAAiB,GAEnD,CACH,CAAC,CAAC,CAAC,IAAI;YACR,8BAAC,cAAI,eAAK,MAAM,EAAM,MAAM,IAAE,WAAW,EAAC,UAAU;gBAClD,8BAAC,cAAI,IAAC,EAAE,EAAE,EAAE,GAAI;gBAChB,8BAAC,cAAI,IAAC,EAAE,EAAE,EAAE;oBACV,8BAAC,oBAAU,IAAC,MAAM,EAAE,MAAM,EAAE,eAAe,EAAE,eAAe,GAAI,CAC3D;gBACP,8BAAC,cAAI,IAAC,EAAE,EAAE,EAAE;oBACV,8BAAC,aAAa,IACZ,WAAW,EAAE,MAAA,eAAe,CAAC,aAAa,0CAAE,iBAAiB,GAC7D,CACG;gBACP,8BAAC,cAAI,IAAC,EAAE,EAAE,EAAE;oBACV,8BAAC,mBAAS,IACR,cAAc,EAAE,MAAA,eAAe,CAAC,aAAa,0CAAE,cAAc;wBAE7D,8BAAC,mBAAS,eAAK,eAAe,CAAC,kBAAkB,GAC9C,MAAM,CAAC,SAAS,CACP,CACF,CACP;gBACP,8BAAC,cAAI,IAAC,EAAE,EAAE,EAAE,GAAI,CACX,CACO,CACG,CACtB,CAAA;AACH,CAAC,CAAA;AAjDY,QAAA,eAAe,mBAiD3B"}
+{"version":3,"file":"NavigationFooter.js","sourceRoot":"","sources":["../../../src/NavigationFooter/NavigationFooter.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAAA,gDAAyB;AACzB,mCAAmD;AAEnD,sDAAoD;AACpD,wDAAsD;AAE/C,IAAM,eAAe,GAAG,UAAC,EAGlB;;QAFZ,MAAM,YAAA,EACN,eAAe,qBAAA;IAEf,IAAM,QAAQ,GAAG,MAAM,IAAI,MAAM,CAAC,QAAQ,CAAA;IAC1C,OAAO,CACL,8BAAC,eAAK,IACJ,EAAE,EAAC,QAAQ,iBACC,kBAAkB,EAC9B,WAAW,EAAE,MAAA,eAAe,CAAC,oBAAoB,0CAAE,WAAW;QAE9D,8BAAC,iBAAO,IACN,SAAS,eACJ,eAAe,CAAC,sBAAsB,IAE3C;QACD,QAAQ,CAAC,CAAC,CAAC,CACV,8BAAC,QAAQ,IACP,iBAAiB,EACf,eAAe,CAAC,iBAAiB;gBAC/B,CAAC,CAAC,eAAe,CAAC,iBAAiB;gBACnC,CAAC,CAAC,yBAAW,CAAC,eAAe,CAAC,iBAAiB,GAEnD,CACH,CAAC,CAAC,CAAC,IAAI;QACR,8BAAC,eAAK,eAAK,eAAe,CAAC,mBAAmB;YAC5C,8BAAC,yBAAW,IAAC,MAAM,EAAE,MAAM,EAAE,eAAe,EAAE,eAAe,GAAI;YAEjE,8BAAC,iBAAO,IACN,SAAS,eACJ,eAAe,CAAC,qBAAqB,IAE1C;YACF,8BAAC,mBAAS,eAAK,eAAe,CAAC,kBAAkB,GAC9C,MAAM,CAAC,SAAS,CACP,CACN,CACF,CACT,CAAA;AACH,CAAC,CAAA;AAvCY,QAAA,eAAe,mBAuC3B"}

package/dist/cjs/NavigationFooter/components/FooterLinks.d.ts

@@ -0,0 +1,2 @@
+import { FooterProps } from '../types';
+export declare const FooterLinks: ({ footer, footerOverrides, }: FooterProps) => JSX.Element;

package/dist/cjs/NavigationFooter/components/FooterLinks.js

@@ -0,0 +1,30 @@
+"use strict";
+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);
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.FooterLinks = void 0;
+var newskit_1 = require("newskit");
+var react_1 = __importDefault(require("react"));
+var utils_1 = require("../../utils");
+var FooterLinks = function (_a) {
+    var footer = _a.footer, footerOverrides = _a.footerOverrides;
+    var fireEvent = (0, newskit_1.useInstrumentation)().fireEvent;
+    return (react_1.default.createElement(newskit_1.GridLayout, { justifyContent: "center", justifyItems: "center", autoFlow: { xs: 'row', sm: 'column' }, rowGap: { xs: 'space070', md: 'space000' }, columnGap: { md: 'space070' }, overrides: {
+            paddingBlockStart: { xs: 'space040', md: 'space020' },
+            paddingBlockEnd: { xs: 'space040' },
+        } }, footer.linksArray.map(function (link) { return (react_1.default.createElement(newskit_1.LinkStandalone, { onClick: function () { return fireEvent((0, utils_1.createClickEvent)('footer-menu', link.text)); }, external: false, key: link.id, href: link.href, overrides: __assign({}, footerOverrides.linkOverrides) }, link.text)); })));
+};
+exports.FooterLinks = FooterLinks;
+//# sourceMappingURL=FooterLinks.js.map

package/dist/cjs/NavigationFooter/components/FooterLinks.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FooterLinks.js","sourceRoot":"","sources":["../../../../src/NavigationFooter/components/FooterLinks.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAAA,mCAAwE;AAExE,gDAAyB;AACzB,qCAA8C;AAEvC,IAAM,WAAW,GAAG,UAAC,EAGd;QAFZ,MAAM,YAAA,EACN,eAAe,qBAAA;IAEP,IAAA,SAAS,GAAK,IAAA,4BAAkB,GAAE,UAAzB,CAAyB;IAE1C,OAAO,CACL,8BAAC,oBAAU,IACT,cAAc,EAAC,QAAQ,EACvB,YAAY,EAAC,QAAQ,EACrB,QAAQ,EAAE,EAAE,EAAE,EAAE,KAAK,EAAE,EAAE,EAAE,QAAQ,EAAE,EACrC,MAAM,EAAE,EAAE,EAAE,EAAE,UAAU,EAAE,EAAE,EAAE,UAAU,EAAE,EAC1C,SAAS,EAAE,EAAE,EAAE,EAAE,UAAU,EAAE,EAC7B,SAAS,EAAE;YACT,iBAAiB,EAAE,EAAE,EAAE,EAAE,UAAU,EAAE,EAAE,EAAE,UAAU,EAAE;YACrD,eAAe,EAAE,EAAE,EAAE,EAAE,UAAU,EAAE;SACpC,IAEA,MAAM,CAAC,UAAU,CAAC,GAAG,CAAC,UAAC,IAAI,IAAK,OAAA,CAC/B,8BAAC,wBAAc,IACb,OAAO,EAAE,cAAM,OAAA,SAAS,CAAC,IAAA,wBAAgB,EAAC,aAAa,EAAE,IAAI,CAAC,IAAI,CAAC,CAAC,EAArD,CAAqD,EACpE,QAAQ,EAAE,KAAK,EACf,GAAG,EAAE,IAAI,CAAC,EAAE,EACZ,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,SAAS,eACJ,eAAe,CAAC,aAAa,KAGjC,IAAI,CAAC,IAAI,CACK,CAClB,EAZgC,CAYhC,CAAC,CACS,CACd,CAAA;AACH,CAAC,CAAA;AAjCY,QAAA,WAAW,eAiCvB"}

package/dist/cjs/NavigationFooter/stories/Help.d.ts

@@ -3,6 +3,10 @@ import { ButtonSize, MQ } from 'newskit';
 export declare const Help: React.FC<{
     chatHelpOverrides?: {
         icon?: ReactNode;
+        iconOverrides?: {
+            size?: MQ<string>;
+            stylePreset: MQ<string>;
+        };
         buttonOverrides?: {
             size?: ButtonSize;
             minWidth?: MQ<string>;
@@ -10,6 +14,9 @@ export declare const Help: React.FC<{
             text: string;
         };
         helpHeadline?: string;
+        helpHeadlineOverrides?: {
+            typographyPreset: MQ<string>;
+        };
         helpSubheadline?: string;
         gridLayoutOverrides?: {
             rowGap?: MQ<string>;
@@ -18,6 +25,7 @@ export declare const Help: React.FC<{
             overrides?: {
                 paddingBlock?: MQ<string>;
                 paddingInline?: MQ<string>;
+                width?: string;
             };
         };
     };

package/dist/cjs/NavigationFooter/stories/Help.js

@@ -3,6 +3,17 @@ var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cook
     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);
+};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
@@ -13,22 +24,24 @@ var newskit_1 = require("newskit");
 var baseContext_1 = require("../../helpers/baseContext");
 var Chat_1 = require("@emotion-icons/material/Chat");
 var IconFilledChat = (0, newskit_1.toNewsKitIcon)(Chat_1.Chat);
-var StyledGridLayout = (0, newskit_1.styled)(newskit_1.GridLayout)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  ", "\n  text-align: center;\n"], ["\n  ", "\n  text-align: center;\n"])), (0, newskit_1.getColorCssFromTheme)('background', 'interface030'));
+var StyledGridLayout = (0, newskit_1.styled)(newskit_1.GridLayout)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  ", "\n  text-align: center;\n"], ["\n  ", "\n  text-align: center;\n"])), (0, newskit_1.getColorCssFromTheme)('background', 'interface020'));
 var _a = baseContext_1.baseContext.footerOverrides.chatHelpOverrides, buttonOverrides = _a.buttonOverrides, helpHeadline = _a.helpHeadline, helpSubheadline = _a.helpSubheadline;
 var Help = function (_a) {
     var _b, _c;
     var chatHelpOverrides = _a.chatHelpOverrides;
     return (react_1.default.createElement(StyledGridLayout, { rowGap: 'space040', justifyItems: 'center', alignContent: 'start', overrides: {
-            paddingBlock: 'space050',
-            paddingInline: 'space050',
+            paddingBlock: 'space060',
+            paddingInline: 'space060',
         } },
-        react_1.default.createElement(IconFilledChat, { overrides: { size: 'iconSize030', stylePreset: 'inkContrast' } }),
-        react_1.default.createElement(newskit_1.Headline, { overrides: {
+        react_1.default.createElement(IconFilledChat, { overrides: (chatHelpOverrides === null || chatHelpOverrides === void 0 ? void 0 : chatHelpOverrides.iconOverrides) || {
+                size: 'iconSize030',
+                stylePreset: 'chatIconStylePreset',
+            } }),
+        react_1.default.createElement(newskit_1.Headline, { overrides: __assign({}, ((chatHelpOverrides === null || chatHelpOverrides === void 0 ? void 0 : chatHelpOverrides.helpHeadlineOverrides) || {
                 typographyPreset: 'utilityHeading030',
-            } }, (chatHelpOverrides === null || chatHelpOverrides === void 0 ? void 0 : chatHelpOverrides.helpHeadline) || helpHeadline),
-        react_1.default.createElement(newskit_1.TextBlock, { typographyPreset: 'utilitySubheading020', stylePreset: 'inkBase', paddingInline: 'space050' }, (chatHelpOverrides === null || chatHelpOverrides === void 0 ? void 0 : chatHelpOverrides.helpSubheadline) || helpSubheadline),
-        react_1.default.createElement(newskit_1.Button, { overrides: (chatHelpOverrides === null || chatHelpOverrides === void 0 ? void 0 : chatHelpOverrides.buttonOverrides) || buttonOverrides, size: (((_b = chatHelpOverrides === null || chatHelpOverrides === void 0 ? void 0 : chatHelpOverrides.buttonOverrides) === null || _b === void 0 ? void 0 : _b.size) ||
-                buttonOverrides.size) }, ((_c = chatHelpOverrides === null || chatHelpOverrides === void 0 ? void 0 : chatHelpOverrides.buttonOverrides) === null || _c === void 0 ? void 0 : _c.text) || buttonOverrides.text)));
+            })) }, (chatHelpOverrides === null || chatHelpOverrides === void 0 ? void 0 : chatHelpOverrides.helpHeadline) || helpHeadline),
+        react_1.default.createElement(newskit_1.TextBlock, { typographyPreset: 'utilityBody030', stylePreset: 'inkBase', paddingInline: 'space050' }, (chatHelpOverrides === null || chatHelpOverrides === void 0 ? void 0 : chatHelpOverrides.helpSubheadline) || helpSubheadline),
+        react_1.default.createElement(newskit_1.Button, { overrides: (chatHelpOverrides === null || chatHelpOverrides === void 0 ? void 0 : chatHelpOverrides.buttonOverrides) || buttonOverrides, size: ((_b = chatHelpOverrides === null || chatHelpOverrides === void 0 ? void 0 : chatHelpOverrides.buttonOverrides) === null || _b === void 0 ? void 0 : _b.size) || 'small' }, ((_c = chatHelpOverrides === null || chatHelpOverrides === void 0 ? void 0 : chatHelpOverrides.buttonOverrides) === null || _c === void 0 ? void 0 : _c.text) || buttonOverrides.text)));
 };
 exports.Help = Help;
 var templateObject_1;

package/dist/cjs/NavigationFooter/stories/Help.js.map

@@ -1 +1 @@
-{"version":3,"file":"Help.js","sourceRoot":"","sources":["../../../../src/NavigationFooter/stories/Help.tsx"],"names":[],"mappings":";;;;;;;;;;AAAA,gDAAwC;AAExC,mCAUgB;AAChB,yDAAuD;AACvD,qDAAiE;AAEjE,IAAM,cAAc,GAAG,IAAA,uBAAa,EAAC,WAAU,CAAC,CAAA;AAChD,IAAM,gBAAgB,GAAG,IAAA,gBAAM,EAAC,oBAAU,CAAC,sGAAA,MACvC,EAAkD,2BAErD,KAFG,IAAA,8BAAoB,EAAC,YAAY,EAAE,cAAc,CAAC,CAErD,CAAA;AACK,IAAA,KACJ,yBAAW,CAAC,eAAe,CAAC,iBAAiB,EADvC,eAAe,qBAAA,EAAE,YAAY,kBAAA,EAAE,eAAe,qBACP,CAAA;AAExC,IAAM,IAAI,GAqBZ,UAAC,EAAqB;;QAAnB,iBAAiB,uBAAA;IACvB,OAAO,CACL,8BAAC,gBAAgB,IACf,MAAM,EAAE,UAAU,EAClB,YAAY,EAAE,QAAQ,EACtB,YAAY,EAAE,OAAO,EACrB,SAAS,EAAE;YACT,YAAY,EAAE,UAAU;YACxB,aAAa,EAAE,UAAU;SAC1B;QAED,8BAAC,cAAc,IACb,SAAS,EAAE,EAAE,IAAI,EAAE,aAAa,EAAE,WAAW,EAAE,aAAa,EAAE,GAC9D;QAEF,8BAAC,kBAAQ,IACP,SAAS,EAAE;gBACT,gBAAgB,EAAE,mBAAmB;aACtC,IAEA,CAAA,iBAAiB,aAAjB,iBAAiB,uBAAjB,iBAAiB,CAAE,YAAY,KAAI,YAAY,CACvC;QAEX,8BAAC,mBAAS,IACR,gBAAgB,EAAE,sBAAsB,EACxC,WAAW,EAAE,SAAS,EACtB,aAAa,EAAE,UAAU,IAExB,CAAA,iBAAiB,aAAjB,iBAAiB,uBAAjB,iBAAiB,CAAE,eAAe,KAAI,eAAe,CAC5C;QAEZ,8BAAC,gBAAM,IACL,SAAS,EAAE,CAAA,iBAAiB,aAAjB,iBAAiB,uBAAjB,iBAAiB,CAAE,eAAe,KAAI,eAAe,EAChE,IAAI,EACF,CAAC,CAAA,MAAA,iBAAiB,aAAjB,iBAAiB,uBAAjB,iBAAiB,CAAE,eAAe,0CAAE,IAAI;gBACvC,eAAe,CAAC,IAAI,CAAe,IAGtC,CAAA,MAAA,iBAAiB,aAAjB,iBAAiB,uBAAjB,iBAAiB,CAAE,eAAe,0CAAE,IAAI,KAAI,eAAe,CAAC,IAAI,CAC1D,CACQ,CACpB,CAAA;AACH,CAAC,CAAA;AA/DY,QAAA,IAAI,QA+DhB"}
+{"version":3,"file":"Help.js","sourceRoot":"","sources":["../../../../src/NavigationFooter/stories/Help.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA,gDAAwC;AAExC,mCAUgB;AAChB,yDAAuD;AACvD,qDAAiE;AAEjE,IAAM,cAAc,GAAG,IAAA,uBAAa,EAAC,WAAU,CAAC,CAAA;AAChD,IAAM,gBAAgB,GAAG,IAAA,gBAAM,EAAC,oBAAU,CAAC,sGAAA,MACvC,EAAkD,2BAErD,KAFG,IAAA,8BAAoB,EAAC,YAAY,EAAE,cAAc,CAAC,CAErD,CAAA;AACK,IAAA,KACJ,yBAAW,CAAC,eAAe,CAAC,iBAAiB,EADvC,eAAe,qBAAA,EAAE,YAAY,kBAAA,EAAE,eAAe,qBACP,CAAA;AAExC,IAAM,IAAI,GAwBZ,UAAC,EAAqB;;QAAnB,iBAAiB,uBAAA;IACvB,OAAO,CACL,8BAAC,gBAAgB,IACf,MAAM,EAAE,UAAU,EAClB,YAAY,EAAE,QAAQ,EACtB,YAAY,EAAE,OAAO,EACrB,SAAS,EAAE;YACT,YAAY,EAAE,UAAU;YACxB,aAAa,EAAE,UAAU;SAC1B;QAED,8BAAC,cAAc,IACb,SAAS,EACP,CAAA,iBAAiB,aAAjB,iBAAiB,uBAAjB,iBAAiB,CAAE,aAAa,KAAI;gBAClC,IAAI,EAAE,aAAa;gBACnB,WAAW,EAAE,qBAAqB;aACnC,GAEH;QAEF,8BAAC,kBAAQ,IACP,SAAS,eACJ,CAAC,CAAA,iBAAiB,aAAjB,iBAAiB,uBAAjB,iBAAiB,CAAE,qBAAqB,KAAI;gBAC9C,gBAAgB,EAAE,mBAAmB;aACtC,CAAC,KAGH,CAAA,iBAAiB,aAAjB,iBAAiB,uBAAjB,iBAAiB,CAAE,YAAY,KAAI,YAAY,CACvC;QAEX,8BAAC,mBAAS,IACR,gBAAgB,EAAE,gBAAgB,EAClC,WAAW,EAAE,SAAS,EACtB,aAAa,EAAE,UAAU,IAExB,CAAA,iBAAiB,aAAjB,iBAAiB,uBAAjB,iBAAiB,CAAE,eAAe,KAAI,eAAe,CAC5C;QAEZ,8BAAC,gBAAM,IACL,SAAS,EAAE,CAAA,iBAAiB,aAAjB,iBAAiB,uBAAjB,iBAAiB,CAAE,eAAe,KAAI,eAAe,EAChE,IAAI,EACF,CAAA,MAAA,iBAAiB,aAAjB,iBAAiB,uBAAjB,iBAAiB,CAAE,eAAe,0CAAE,IAAI,KAAK,OAAsB,IAGpE,CAAA,MAAA,iBAAiB,aAAjB,iBAAiB,uBAAjB,iBAAiB,CAAE,eAAe,0CAAE,IAAI,KAAI,eAAe,CAAC,IAAI,CAC1D,CACQ,CACpB,CAAA;AACH,CAAC,CAAA;AAxEY,QAAA,IAAI,QAwEhB"}

package/dist/cjs/NavigationFooter/stories/MySimpleComponent.d.ts

@@ -1,4 +1,2 @@
 import React from 'react';
-export declare const MySimpleComponent: React.FC<{
-    chatHelpOverrides?: Record<string, unknown>;
-}>;
+export declare const MySimpleComponent: React.FC;

package/dist/cjs/NavigationFooter/stories/MySimpleComponent.js

@@ -8,14 +8,15 @@ var newskit_1 = require("newskit");
 var react_1 = __importDefault(require("react"));
 var IntegrationInstructions_1 = require("@emotion-icons/material/IntegrationInstructions");
 var IconFilledIntegrationInstructions = (0, newskit_1.toNewsKitIcon)(IntegrationInstructions_1.IntegrationInstructions);
-var MySimpleComponent = function (_a) {
-    var chatHelpOverrides = _a.chatHelpOverrides;
+var MySimpleComponent = function () {
     return (react_1.default.createElement(react_1.default.Fragment, null,
         react_1.default.createElement(newskit_1.GridLayout, { justifyItems: 'center', alignContent: 'start', overrides: {
                 paddingBlock: 'space050',
                 paddingInline: 'space050',
             } },
-            react_1.default.createElement(IconFilledIntegrationInstructions, { overrides: chatHelpOverrides }),
+            react_1.default.createElement(IconFilledIntegrationInstructions, { overrides: {
+                    size: 'iconSize030',
+                } }),
             react_1.default.createElement(newskit_1.TextBlock, null, "You can use the navigation Footer with a help component. The Help component can be any React component")),
         react_1.default.createElement(newskit_1.Divider, null)));
 };

package/dist/cjs/NavigationFooter/stories/MySimpleComponent.js.map

@@ -1 +1 @@
-{"version":3,"file":"MySimpleComponent.js","sourceRoot":"","sources":["../../../../src/NavigationFooter/stories/MySimpleComponent.tsx"],"names":[],"mappings":";;;;;;AAAA,mCAAuE;AACvE,gDAAyB;AAEzB,2FAA0H;AAC1H,IAAM,iCAAiC,GAAG,IAAA,uBAAa,EACrD,iDAA6B,CAC9B,CAAA;AAEM,IAAM,iBAAiB,GAEzB,UAAC,EAAqB;QAAnB,iBAAiB,uBAAA;IACvB,OAAO,CACL;QACE,8BAAC,oBAAU,IACT,YAAY,EAAE,QAAQ,EACtB,YAAY,EAAE,OAAO,EACrB,SAAS,EAAE;gBACT,YAAY,EAAE,UAAU;gBACxB,aAAa,EAAE,UAAU;aAC1B;YAED,8BAAC,iCAAiC,IAAC,SAAS,EAAE,iBAAiB,GAAI;YAEnE,8BAAC,mBAAS,iHAGE,CACD;QACb,8BAAC,iBAAO,OAAG,CACV,CACJ,CAAA;AACH,CAAC,CAAA;AAvBY,QAAA,iBAAiB,qBAuB7B"}
+{"version":3,"file":"MySimpleComponent.js","sourceRoot":"","sources":["../../../../src/NavigationFooter/stories/MySimpleComponent.tsx"],"names":[],"mappings":";;;;;;AAAA,mCAAuE;AACvE,gDAAyB;AAEzB,2FAA0H;AAC1H,IAAM,iCAAiC,GAAG,IAAA,uBAAa,EACrD,iDAA6B,CAC9B,CAAA;AAEM,IAAM,iBAAiB,GAAa;IACzC,OAAO,CACL;QACE,8BAAC,oBAAU,IACT,YAAY,EAAE,QAAQ,EACtB,YAAY,EAAE,OAAO,EACrB,SAAS,EAAE;gBACT,YAAY,EAAE,UAAU;gBACxB,aAAa,EAAE,UAAU;aAC1B;YAED,8BAAC,iCAAiC,IAChC,SAAS,EAAE;oBACT,IAAI,EAAE,aAAa;iBACpB,GACD;YAEF,8BAAC,mBAAS,iHAGE,CACD;QACb,8BAAC,iBAAO,OAAG,CACV,CACJ,CAAA;AACH,CAAC,CAAA;AAzBY,QAAA,iBAAiB,qBAyB7B"}

package/dist/cjs/NavigationFooter/stories/NavigationFooter.stories.d.ts

@@ -1,6 +1,6 @@
 import { Meta, Story } from '@storybook/react';
+export declare const WithoutChat: Story;
+export declare const WithChat: Story;
+export declare const withRandomHelpChatComponent: Story;
 declare const _default: Meta<import("@storybook/react").Args>;
 export default _default;
-export declare const Primary: Story;
-export declare const WithChat: Story;
-export declare const WithRandom: Story;

package/dist/cjs/NavigationFooter/stories/NavigationFooter.stories.js

@@ -14,44 +14,36 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.WithRandom = exports.WithChat = exports.Primary = void 0;
+exports.withRandomHelpChatComponent = exports.WithChat = exports.WithoutChat = void 0;
 var react_1 = __importDefault(require("react"));
-var baseContext_1 = require("../../helpers/baseContext");
-var __1 = require("..");
-var Help_1 = require("./Help");
-var MySimpleComponent_1 = require("./MySimpleComponent");
 var newskit_1 = require("newskit");
+var Help_1 = require("./Help");
+var __1 = require("..");
+var baseContext_1 = require("../../helpers/baseContext");
 var theme_1 = require("../../theme");
+var style_presets_1 = require("../style-presets");
+var MySimpleComponent_1 = require("./MySimpleComponent");
+var newFooterTheme = (0, newskit_1.createTheme)({
+    name: 'New Footer Theme',
+    baseTheme: theme_1.sharedTheme,
+    overrides: {
+        stylePresets: __assign({}, style_presets_1.navigationFooterPresets),
+    },
+});
+console.log(newFooterTheme);
+var contextWithChat = __assign(__assign({}, baseContext_1.baseContext), { footer: __assign(__assign({}, baseContext_1.baseContext.footer), { helpChat: Help_1.Help }) });
+var contextWithRandomChatComponent = __assign(__assign({}, baseContext_1.baseContext), { footer: __assign(__assign({}, baseContext_1.baseContext.footer), { helpChat: MySimpleComponent_1.MySimpleComponent }) });
+var WithoutChat = function () { return (react_1.default.createElement(newskit_1.ThemeProvider, { theme: newFooterTheme },
+    react_1.default.createElement(__1.NavigationFooter, __assign({}, baseContext_1.baseContext)))); };
+exports.WithoutChat = WithoutChat;
+var WithChat = function () { return (react_1.default.createElement(newskit_1.ThemeProvider, { theme: newFooterTheme },
+    react_1.default.createElement(__1.NavigationFooter, __assign({}, contextWithChat)))); };
+exports.WithChat = WithChat;
+var withRandomHelpChatComponent = function () { return (react_1.default.createElement(newskit_1.ThemeProvider, { theme: newFooterTheme },
+    react_1.default.createElement(__1.NavigationFooter, __assign({}, contextWithRandomChatComponent)))); };
+exports.withRandomHelpChatComponent = withRandomHelpChatComponent;
 exports.default = {
     title: 'Components/Sections/NavigationFooter',
     component: __1.NavigationFooter,
 };
-// TODO: Find out if there is a better way to create and use components that are used only for stories
-var Primary = function () { return (react_1.default.createElement(__1.NavigationFooter, { footer: baseContext_1.baseContext.footer, footerOverrides: baseContext_1.baseContext.footerOverrides, margin: { xsMargin: 'sizing050' }, gutter: { xsColumnGutter: 'sizing050' } })); };
-exports.Primary = Primary;
-exports.Primary.args = {
-    context: __assign({}, baseContext_1.baseContext),
-};
-var menuItems = [
-    { text: 'About us', href: '/about-us', id: 1 },
-    {
-        text: 'Privacy & cookie policy',
-        href: 'http://www.newsprivacy.co.uk/',
-        id: 2,
-    },
-    { text: 'Terms & conditions', href: '/terms-and-conditions', id: 3 },
-];
-var contextWithChat = __assign(__assign({}, baseContext_1.baseContext), { footer: __assign(__assign({}, baseContext_1.baseContext.footer), { menuItemArray: menuItems, helpChat: Help_1.Help }), footerOverrides: __assign({}, baseContext_1.baseContext.footerOverrides) });
-var WithChat = function () { return (react_1.default.createElement(newskit_1.ThemeProvider, { theme: theme_1.sharedTheme },
-    react_1.default.createElement(__1.NavigationFooter, { footer: contextWithChat.footer, footerOverrides: contextWithChat.footerOverrides, margin: { xsMargin: 'sizing050' }, gutter: { xsColumnGutter: 'sizing050' } }))); };
-exports.WithChat = WithChat;
-exports.WithChat.args = {
-    context: __assign({}, contextWithChat),
-};
-var contextWithRandomComponent = __assign(__assign({}, baseContext_1.baseContext), { footer: __assign(__assign({}, baseContext_1.baseContext.footer), { menuItemArray: menuItems, helpChat: MySimpleComponent_1.MySimpleComponent }), footerOverrides: __assign(__assign({}, baseContext_1.baseContext.footerOverrides), { chatHelpOverrides: { size: 'iconSize050' } }) });
-var WithRandom = function () {
-    return (react_1.default.createElement(newskit_1.ThemeProvider, { theme: theme_1.sharedTheme },
-        react_1.default.createElement(__1.NavigationFooter, { footer: contextWithRandomComponent.footer, footerOverrides: contextWithRandomComponent.footerOverrides, margin: { xsMargin: 'sizing050' }, gutter: { xsColumnGutter: 'sizing050' } })));
-};
-exports.WithRandom = WithRandom;
 //# sourceMappingURL=NavigationFooter.stories.js.map

package/dist/cjs/NavigationFooter/stories/NavigationFooter.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"NavigationFooter.stories.js","sourceRoot":"","sources":["../../../../src/NavigationFooter/stories/NavigationFooter.stories.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAAA,gDAAyB;AAEzB,yDAAuD;AACvD,wBAAqC;AACrC,+BAA6B;AAC7B,yDAAuD;AACvD,mCAAuC;AACvC,qCAAyC;AAEzC,kBAAe;IACb,KAAK,EAAE,sCAAsC;IAC7C,SAAS,EAAE,oBAAgB;CACpB,CAAA;AACT,sGAAsG;AAE/F,IAAM,OAAO,GAAU,cAAM,OAAA,CAClC,8BAAC,oBAAgB,IACf,MAAM,EAAE,yBAAW,CAAC,MAAM,EAC1B,eAAe,EAAE,yBAAW,CAAC,eAAe,EAC5C,MAAM,EAAE,EAAE,QAAQ,EAAE,WAAW,EAAE,EACjC,MAAM,EAAE,EAAE,cAAc,EAAE,WAAW,EAAE,GACvC,CACH,EAPmC,CAOnC,CAAA;AAPY,QAAA,OAAO,WAOnB;AACD,eAAO,CAAC,IAAI,GAAG;IACb,OAAO,eACF,yBAAW,CACf;CACF,CAAA;AACD,IAAM,SAAS,GAAG;IAChB,EAAE,IAAI,EAAE,UAAU,EAAE,IAAI,EAAE,WAAW,EAAE,EAAE,EAAE,CAAC,EAAE;IAC9C;QACE,IAAI,EAAE,yBAAyB;QAC/B,IAAI,EAAE,+BAA+B;QACrC,EAAE,EAAE,CAAC;KACN;IACD,EAAE,IAAI,EAAE,oBAAoB,EAAE,IAAI,EAAE,uBAAuB,EAAE,EAAE,EAAE,CAAC,EAAE;CACrE,CAAA;AACD,IAAM,eAAe,yBAChB,yBAAW,KACd,MAAM,wBACD,yBAAW,CAAC,MAAM,KACrB,aAAa,EAAE,SAAS,EACxB,QAAQ,EAAE,WAAI,KAEhB,eAAe,eACV,yBAAW,CAAC,eAAe,IAEjC,CAAA;AAEM,IAAM,QAAQ,GAAU,cAAM,OAAA,CACnC,8BAAC,uBAAa,IAAC,KAAK,EAAE,mBAAW;IAC/B,8BAAC,oBAAgB,IACf,MAAM,EAAE,eAAe,CAAC,MAAM,EAC9B,eAAe,EAAE,eAAe,CAAC,eAAe,EAChD,MAAM,EAAE,EAAE,QAAQ,EAAE,WAAW,EAAE,EACjC,MAAM,EAAE,EAAE,cAAc,EAAE,WAAW,EAAE,GACvC,CACY,CACjB,EAToC,CASpC,CAAA;AATY,QAAA,QAAQ,YASpB;AAED,gBAAQ,CAAC,IAAI,GAAG;IACd,OAAO,eACF,eAAe,CACnB;CACF,CAAA;AAED,IAAM,0BAA0B,yBAC3B,yBAAW,KACd,MAAM,wBACD,yBAAW,CAAC,MAAM,KACrB,aAAa,EAAE,SAAS,EACxB,QAAQ,EAAE,qCAAiB,KAE7B,eAAe,wBACV,yBAAW,CAAC,eAAe,KAC9B,iBAAiB,EAAE,EAAE,IAAI,EAAE,aAAa,EAAE,MAE7C,CAAA;AAEM,IAAM,UAAU,GAAU;IAC/B,OAAO,CACL,8BAAC,uBAAa,IAAC,KAAK,EAAE,mBAAW;QAC/B,8BAAC,oBAAgB,IACf,MAAM,EAAE,0BAA0B,CAAC,MAAM,EACzC,eAAe,EAAE,0BAA0B,CAAC,eAAe,EAC3D,MAAM,EAAE,EAAE,QAAQ,EAAE,WAAW,EAAE,EACjC,MAAM,EAAE,EAAE,cAAc,EAAE,WAAW,EAAE,GACvC,CACY,CACjB,CAAA;AACH,CAAC,CAAA;AAXY,QAAA,UAAU,cAWtB"}
+{"version":3,"file":"NavigationFooter.stories.js","sourceRoot":"","sources":["../../../../src/NavigationFooter/stories/NavigationFooter.stories.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAAA,gDAAyB;AAEzB,mCAAoD;AACpD,+BAA6B;AAC7B,wBAAqC;AACrC,yDAAuD;AACvD,qCAAyC;AACzC,kDAA0D;AAC1D,yDAAuD;AAEvD,IAAM,cAAc,GAAG,IAAA,qBAAW,EAAC;IACjC,IAAI,EAAE,kBAAkB;IACxB,SAAS,EAAE,mBAAW;IACtB,SAAS,EAAE;QACT,YAAY,eAAO,uCAAuB,CAAE;KAC7C;CACF,CAAC,CAAA;AACF,OAAO,CAAC,GAAG,CAAC,cAAc,CAAC,CAAA;AAE3B,IAAM,eAAe,yBAChB,yBAAW,KACd,MAAM,wBACD,yBAAW,CAAC,MAAM,KACrB,QAAQ,EAAE,WAAI,MAEjB,CAAA;AAED,IAAM,8BAA8B,yBAC/B,yBAAW,KACd,MAAM,wBACD,yBAAW,CAAC,MAAM,KACrB,QAAQ,EAAE,qCAAiB,MAE9B,CAAA;AACM,IAAM,WAAW,GAAU,cAAM,OAAA,CACtC,8BAAC,uBAAa,IAAC,KAAK,EAAE,cAAc;IAClC,8BAAC,oBAAgB,eAAK,yBAAW,EAAI,CACvB,CACjB,EAJuC,CAIvC,CAAA;AAJY,QAAA,WAAW,eAIvB;AACM,IAAM,QAAQ,GAAU,cAAM,OAAA,CACnC,8BAAC,uBAAa,IAAC,KAAK,EAAE,cAAc;IAClC,8BAAC,oBAAgB,eAAK,eAAe,EAAI,CAC3B,CACjB,EAJoC,CAIpC,CAAA;AAJY,QAAA,QAAQ,YAIpB;AACM,IAAM,2BAA2B,GAAU,cAAM,OAAA,CACtD,8BAAC,uBAAa,IAAC,KAAK,EAAE,cAAc;IAClC,8BAAC,oBAAgB,eAAK,8BAA8B,EAAI,CAC1C,CACjB,EAJuD,CAIvD,CAAA;AAJY,QAAA,2BAA2B,+BAIvC;AACD,kBAAe;IACb,KAAK,EAAE,sCAAsC;IAC7C,SAAS,EAAE,oBAAgB;CACpB,CAAA"}

package/dist/cjs/NavigationFooter/style-presets.d.ts

@@ -6,6 +6,23 @@ export declare const navigationFooterPresets: {
             color: string;
         };
     };
+    footerContainerStylePreset: {
+        base: {
+            backgroundColor: string;
+        };
+    };
+    footerDividerStylePreset: {
+        base: {
+            borderColor: string;
+            borderWidth: string;
+            borderStyle: string;
+        };
+    };
+    chatIconStylePreset: {
+        base: {
+            color: string;
+        };
+    };
 };
 export declare const footerLegalText: {
     base: {

package/dist/cjs/NavigationFooter/style-presets.js

@@ -9,6 +9,23 @@ exports.navigationFooterPresets = {
             color: '{{colors.inkSubtle}}',
         },
     },
+    footerContainerStylePreset: {
+        base: {
+            backgroundColor: '{{colors.transparent}}',
+        },
+    },
+    footerDividerStylePreset: {
+        base: {
+            borderColor: '{{colors.interface040}}',
+            borderWidth: '{{borders.borderWidth010}}',
+            borderStyle: 'solid',
+        },
+    },
+    chatIconStylePreset: {
+        base: {
+            color: '{{colors.inkBrand010}}',
+        },
+    },
 };
 exports.footerLegalText = {
     base: {

package/dist/cjs/NavigationFooter/style-presets.js.map

@@ -1 +1 @@
-{"version":3,"file":"style-presets.js","sourceRoot":"","sources":["../../../src/NavigationFooter/style-presets.ts"],"names":[],"mappings":";;;AAAa,QAAA,uBAAuB,GAAG;IACrC,eAAe,EAAE;QACf,IAAI,EAAE;YACJ,UAAU,EAAE,UAAU;YACtB,SAAS,EAAE,QAAQ;YACnB,KAAK,EAAE,sBAAsB;SAC9B;KACF;CACF,CAAA;AAEY,QAAA,eAAe,GAAG;IAC7B,IAAI,EAAE;QACJ,UAAU,EAAE,UAAU;QACtB,SAAS,EAAE,QAAQ;QACnB,KAAK,EAAE,sBAAsB;KAC9B;CACF,CAAA"}
+{"version":3,"file":"style-presets.js","sourceRoot":"","sources":["../../../src/NavigationFooter/style-presets.ts"],"names":[],"mappings":";;;AAAa,QAAA,uBAAuB,GAAG;IACrC,eAAe,EAAE;QACf,IAAI,EAAE;YACJ,UAAU,EAAE,UAAU;YACtB,SAAS,EAAE,QAAQ;YACnB,KAAK,EAAE,sBAAsB;SAC9B;KACF;IACD,0BAA0B,EAAE;QAC1B,IAAI,EAAE;YACJ,eAAe,EAAE,wBAAwB;SAC1C;KACF;IACD,wBAAwB,EAAE;QACxB,IAAI,EAAE;YACJ,WAAW,EAAE,yBAAyB;YACtC,WAAW,EAAE,4BAA4B;YACzC,WAAW,EAAE,OAAO;SACrB;KACF;IACD,mBAAmB,EAAE;QACnB,IAAI,EAAE;YACJ,KAAK,EAAE,wBAAwB;SAChC;KACF;CACF,CAAA;AAEY,QAAA,eAAe,GAAG;IAC7B,IAAI,EAAE;QACJ,UAAU,EAAE,UAAU;QACtB,SAAS,EAAE,QAAQ;QACnB,KAAK,EAAE,sBAAsB;KAC9B;CACF,CAAA"}

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

@@ -1,10 +1,14 @@
 import { MQ } from 'newskit';
+import { LogicalProps } from 'newskit/cjs/utils/logical-properties';
 import React from 'react';
+export interface FooterStyleProps extends React.HTMLAttributes<HTMLElement>, LogicalProps {
+    stylePreset?: MQ<string>;
+}
 export interface FooterContext {
     helpChat?: React.ComponentType<{
         chatHelpOverrides?: Record<string, unknown>;
     }>;
-    menuItemArray: {
+    linksArray: {
         text: string;
         href: string;
         id: string | number;
@@ -12,47 +16,31 @@ export interface FooterContext {
     legalText: string;
 }
 export interface FooterContextOverrides {
+    footerStyleOverrides?: FooterStyleProps;
+    footerDividerOverrides?: {
+        stylePreset: MQ<string>;
+        marginBlock?: MQ<string>;
+    };
+    linksDividerOverrides?: {
+        stylePreset: MQ<string>;
+        marginBlock?: MQ<string>;
+    };
     ariaLabel?: string;
-    menuItemOverrides?: {
+    linkOverrides?: {
         stylePreset?: MQ<string>;
         typographyPreset?: MQ<string>;
-        paddingInline?: MQ<string>;
-        paddingBlock?: MQ<string>;
-    };
-    menuOverrides?: {
-        marginBlockEnd?: MQ<string>;
-        backgroundColor?: string;
-        borderColorTop?: string;
-        borderColorBottom?: string;
-        padding?: {
-            xs: string;
-            md: string;
-        };
     };
     legalTextOverrides?: {
-        marginBlockEnd?: MQ<string>;
         stylePreset?: MQ<string>;
         typographyPreset?: MQ<string>;
-        padding?: {
-            xs: string;
-            md: string;
-        };
+    };
+    footerAreaOverrides?: {
+        paddingBlock?: MQ<string>;
+        paddingInline?: MQ<string>;
     };
     chatHelpOverrides?: Record<string, unknown>;
 }
 export interface FooterProps {
     footer: FooterContext;
     footerOverrides: FooterContextOverrides;
-    margin?: {
-        xsMargin?: string;
-        smMargin?: string;
-        mdMargin?: string;
-        lgMargin?: string;
-    };
-    gutter?: {
-        xsColumnGutter?: string;
-        smColumnGutter?: string;
-        mdColumnGutter?: string;
-        lgColumnGutter?: string;
-    };
 }

package/dist/cjs/helpers/baseContext.d.ts

@@ -103,7 +103,7 @@ export declare const baseContext: {
     };
     footer: {
         helpChat: undefined;
-        menuItemArray: {
+        linksArray: {
             text: string;
             href: string;
             id: number;
@@ -111,28 +111,27 @@ export declare const baseContext: {
         legalText: string;
     };
     footerOverrides: {
-        ariaLabel: string;
-        menuItemOverrides: {
+        footerStyleOverrides: {
             stylePreset: string;
-            typographyPreset: string;
         };
-        menuOverrides: {
-            marginBlockEnd: string;
-            backgroundColor: string;
-            borderColor: string;
-            padding: {
-                md: string;
-                xs: string;
-            };
+        footerAreaOverrides: {
+            paddingBlock: string;
+            paddingInline: string;
+        };
+        footerDividerOverrides: {
+            stylePreset: string;
+        };
+        linksDividerOverrides: {
+            stylePreset: string;
+            marginBlock: string;
+        };
+        ariaLabel: string;
+        linkOverrides: {
+            typographyPreset: string;
         };
         legalTextOverrides: {
-            marginBlockEnd: string;
             stylePreset: string;
             typographyPreset: string;
-            padding: {
-                md: string;
-                xs: string;
-            };
         };
         chatHelpOverrides: {
             icon: JSX.Element;
@@ -140,6 +139,10 @@ export declare const baseContext: {
                 size: ButtonSize;
                 stylePreset: string;
                 text: string;
+                minWidth: {
+                    xs: string;
+                    sm: string;
+                };
             };
             helpSubheadline: string;
             helpHeadline: string;

package/dist/cjs/helpers/baseContext.js

@@ -117,36 +117,39 @@ exports.baseContext = {
     },
     footer: {
         helpChat: undefined,
-        menuItemArray: [
+        linksArray: [
             { text: 'About us', href: '/about-us', id: 1 },
-            { text: 'Help', href: '/help', id: 2 },
             {
                 text: 'Privacy & cookie policy',
                 href: 'http://www.newsprivacy.co.uk/',
-                id: 3,
+                id: 2,
             },
-            { text: 'Terms & conditions', href: '/terms-and-conditions', id: 4 },
-            { text: 'Contact  us', href: '/contact-us', id: 5 },
+            { text: 'Terms & conditions', href: '/terms-and-conditions', id: 3 },
         ],
         legalText: "\u00A9 NewsKit Limited ".concat(new Date().getFullYear(), ".\n      Registered in England No. 000000. Registered office: 1 London Bridge Street, SE1 9GF."),
     },
     footerOverrides: {
+        footerStyleOverrides: {
+            stylePreset: 'footerContainerStylePreset',
+        },
+        footerAreaOverrides: {
+            paddingBlock: 'space050',
+            paddingInline: 'space050',
+        },
+        footerDividerOverrides: {
+            stylePreset: 'footerDividerStylePreset',
+        },
+        linksDividerOverrides: {
+            stylePreset: 'footerDividerStylePreset',
+            marginBlock: 'space040',
+        },
         ariaLabel: 'Footer Menu',
-        menuItemOverrides: {
-            stylePreset: 'baseInteractivePrimary030',
+        linkOverrides: {
             typographyPreset: 'utilityButton020',
         },
-        menuOverrides: {
-            marginBlockEnd: 'space060',
-            backgroundColor: 'interface010',
-            borderColor: 'interface050',
-            padding: { md: 'sizing090', xs: 'sizing040' },
-        },
         legalTextOverrides: {
-            marginBlockEnd: 'space050',
             stylePreset: 'footerLegalText',
             typographyPreset: 'utilityMeta010',
-            padding: { md: 'sizing100', xs: 'sizing060' },
         },
         chatHelpOverrides: {
             icon: (react_1.default.createElement(IconFilledChat, { overrides: {
@@ -156,7 +159,11 @@ exports.baseContext = {
             buttonOverrides: {
                 size: 'small',
                 stylePreset: 'buttonOutlinedSecondary',
-                text: 'Chat',
+                text: 'Chat now',
+                minWidth: {
+                    xs: '100%',
+                    sm: 'auto',
+                },
             },
             helpSubheadline: 'Get a quick response from our team members',
             helpHeadline: 'Need help?',