@moduk/frontend 1.3.0 → 1.4.0

package/dist/nunjucks/moduk/components/footer/__examples__/with-customisation.njk

@@ -0,0 +1,28 @@
+{% from "moduk/components/footer/macro.njk" import modukFooter -%}
+
+{{ modukFooter({
+  copyright: {
+    text: "Copyright text"
+  },
+  contentLicence: {
+    text: "Content licence text"
+  },
+  meta: {
+    text: "Meta content",
+    visuallyHiddenTitle: "Visually hidden title",
+    items: [
+      {
+        href: "#1",
+        text: "Item 1"
+      },
+      {
+        href: "#2",
+        text: "Item 2"
+      },
+      {
+        href: "#3",
+        text: "Item 3"
+      }
+    ]
+  }
+}) -}}

package/dist/nunjucks/moduk/components/phase-banner/__examples__/default.njk

@@ -4,9 +4,5 @@
   tag: {
     text: "alpha"
   },
-  classes: "custom-class",
-  attributes: {
-    "data-testid": "phase-banner"
-  },
   html: 'This is a new service – your <a class="govuk-link" href="#">feedback</a> will help us to improve it.'
 }) -}}

package/dist/nunjucks/moduk/components/summary-list/__examples__/cards-with-single-action.njk

@@ -0,0 +1,36 @@
+{% from "moduk/components/summary-list/macro.njk" import modukSummaryList -%}
+
+{{ modukSummaryList({
+  card: {
+    title: {
+      text: "University of Gloucestershire"
+    },
+    actions: {
+      items: [
+        {
+          href: "#",
+          text: "Withdraw",
+          visuallyHiddenText: "from University of Gloucestershire"
+        }
+      ]
+    }
+  },
+  rows: [
+    {
+      key: {
+        text: "Course"
+      },
+      value: {
+        html: "English (3DMD)<br>PGCE with QTS full time"
+      }
+    },
+    {
+      key: {
+        text: "Location"
+      },
+      value: {
+        html: "School name<br>Road, City, SW1 1AA"
+      }
+    }
+  ]
+}) -}}

package/dist/nunjucks/moduk/components/summary-list/__examples__/with-multiple-actions.njk

@@ -0,0 +1,28 @@
+{% from "moduk/components/summary-list/macro.njk" import modukSummaryList -%}
+
+{{ modukSummaryList({
+  rows: [
+    {
+      key: {
+        text: "Name"
+      },
+      value: {
+        text: "Sarah Philips"
+      },
+      actions: {
+        items: [
+          {
+            href: "#",
+            text: "Change",
+            visuallyHiddenText: "name"
+          },
+          {
+            href: "#",
+            text: "Remove",
+            visuallyHiddenText: "name"
+          }
+        ]
+      }
+    }
+  ]
+}) -}}

package/nunjucks/moduk/components/footer/__examples__/with-customisation.njk

@@ -0,0 +1,28 @@
+{% from "moduk/components/footer/macro.njk" import modukFooter -%}
+
+{{ modukFooter({
+  copyright: {
+    text: "Copyright text"
+  },
+  contentLicence: {
+    text: "Content licence text"
+  },
+  meta: {
+    text: "Meta content",
+    visuallyHiddenTitle: "Visually hidden title",
+    items: [
+      {
+        href: "#1",
+        text: "Item 1"
+      },
+      {
+        href: "#2",
+        text: "Item 2"
+      },
+      {
+        href: "#3",
+        text: "Item 3"
+      }
+    ]
+  }
+}) -}}

package/nunjucks/moduk/components/phase-banner/__examples__/default.njk

@@ -4,9 +4,5 @@
   tag: {
     text: "alpha"
   },
-  classes: "custom-class",
-  attributes: {
-    "data-testid": "phase-banner"
-  },
   html: 'This is a new service – your <a class="govuk-link" href="#">feedback</a> will help us to improve it.'
 }) -}}

package/nunjucks/moduk/components/summary-list/__examples__/cards-with-single-action.njk

@@ -0,0 +1,36 @@
+{% from "moduk/components/summary-list/macro.njk" import modukSummaryList -%}
+
+{{ modukSummaryList({
+  card: {
+    title: {
+      text: "University of Gloucestershire"
+    },
+    actions: {
+      items: [
+        {
+          href: "#",
+          text: "Withdraw",
+          visuallyHiddenText: "from University of Gloucestershire"
+        }
+      ]
+    }
+  },
+  rows: [
+    {
+      key: {
+        text: "Course"
+      },
+      value: {
+        html: "English (3DMD)<br>PGCE with QTS full time"
+      }
+    },
+    {
+      key: {
+        text: "Location"
+      },
+      value: {
+        html: "School name<br>Road, City, SW1 1AA"
+      }
+    }
+  ]
+}) -}}

package/nunjucks/moduk/components/summary-list/__examples__/with-multiple-actions.njk

@@ -0,0 +1,28 @@
+{% from "moduk/components/summary-list/macro.njk" import modukSummaryList -%}
+
+{{ modukSummaryList({
+  rows: [
+    {
+      key: {
+        text: "Name"
+      },
+      value: {
+        text: "Sarah Philips"
+      },
+      actions: {
+        items: [
+          {
+            href: "#",
+            text: "Change",
+            visuallyHiddenText: "name"
+          },
+          {
+            href: "#",
+            text: "Remove",
+            visuallyHiddenText: "name"
+          }
+        ]
+      }
+    }
+  ]
+}) -}}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@moduk/frontend",
-  "version": "1.3.0",
+  "version": "1.4.0",
   "description": "The MOD.UK Frontend contains the code you need to start building a user interface for Ministry of Defence platforms and services.",
   "main": "lib/index.js",
   "sass": "src/css/index.scss",
@@ -107,17 +107,18 @@
     "@commitlint/cli": "^17.7.1",
     "@commitlint/config-conventional": "^17.7.0",
     "@playwright/test": "^1.37.0",
-    "@release-it/conventional-changelog": "^6.0.0",
+    "@release-it/conventional-changelog": "^7.0.0",
     "@testing-library/dom": "^9.3.1",
-    "@testing-library/jest-dom": "^6.0.0",
+    "@testing-library/jest-dom": "^6.0.1",
     "@testing-library/react": "^14.0.0",
+    "@testing-library/user-event": "^14.4.3",
     "@types/lodash": "^4.14.195",
     "@types/node": "^18.16.19",
     "@types/nunjucks": "^3.2.3",
     "@types/react": "^18.2.7",
     "@types/react-dom": "^18.2.7",
-    "@typescript-eslint/eslint-plugin": "^6.3.0",
-    "@typescript-eslint/parser": "^6.3.0",
+    "@typescript-eslint/eslint-plugin": "^6.4.0",
+    "@typescript-eslint/parser": "^6.4.0",
     "babel-loader": "^9.1.3",
     "babel-plugin-inline-react-svg": "^2.0.2",
     "babel-plugin-module-resolver": "^5.0.0",
@@ -139,7 +140,7 @@
     "postcss-fail-on-warn": "^0.2.1",
     "postcss-preset-env": "^8.4.1",
     "react-merge-refs": "^2.0.2",
-    "release-it": "^15.11.0",
+    "release-it": "^16.1.5",
     "sass": "^1.63.4",
     "sass-true": "^7.0.0",
     "shelljs": "^0.8.5",
@@ -148,7 +149,7 @@
     "tsconfig-paths": "^4.2.0",
     "typescript": "^5.0.4",
     "vitest": "^0.34.1",
-    "webpack": "^5.88.1",
+    "webpack": "^5.88.2",
     "webpack-cli": "^5.1.4"
   },
   "lint-staged": {

package/react/VisuallyHiddenText/VisuallyHiddenText.d.ts

@@ -0,0 +1,10 @@
+import { type ComponentPropsWithoutRef } from 'react';
+type VisuallyHiddenTextProps = ComponentPropsWithoutRef<'span'>;
+/**
+ * A <span> containing visually hidden text
+ *
+ * @experimental React components are in alpha and subject to change.
+ */
+export declare const VisuallyHiddenText: ({ children, className }: VisuallyHiddenTextProps) => import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=VisuallyHiddenText.d.ts.map

package/react/VisuallyHiddenText/VisuallyHiddenText.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"VisuallyHiddenText.d.ts","sourceRoot":"","sources":["../../../src/react/VisuallyHiddenText/VisuallyHiddenText.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,wBAAwB,EAAE,MAAM,OAAO,CAAA;AAErD,KAAK,uBAAuB,GAAG,wBAAwB,CAAC,MAAM,CAAC,CAAA;AAE/D;;;;GAIG;AACH,eAAO,MAAM,kBAAkB,4BAA6B,uBAAuB,4CAElF,CAAA"}

package/react/VisuallyHiddenText/index.d.ts

@@ -0,0 +1,2 @@
+export * from './VisuallyHiddenText';
+//# sourceMappingURL=index.d.ts.map

package/react/VisuallyHiddenText/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/react/VisuallyHiddenText/index.ts"],"names":[],"mappings":"AAAA,cAAc,sBAAsB,CAAA"}

package/react/accordion/Accordion.d.ts

@@ -1,9 +1,9 @@
-import type { ComponentPropsWithoutRef, ReactElement } from 'react';
+import type { ComponentPropsWithoutRef } from 'react';
+import { type PermissiveChild } from '../internal/PermissiveChild';
 import type { AccordionHeadingTag } from './AccordionHeadingTag';
 import type { AccordionItemProps } from './AccordionItem';
-type AccordionChild = ReactElement<AccordionItemProps> | boolean | null | Iterable<AccordionChild>;
 export interface AccordionProps extends ComponentPropsWithoutRef<'div'> {
-    children: AccordionChild;
+    children: PermissiveChild<AccordionItemProps>;
     headingTag?: AccordionHeadingTag;
     hideAllSectionsText?: string;
     hideSectionText?: string;
@@ -18,5 +18,4 @@ export interface AccordionProps extends ComponentPropsWithoutRef<'div'> {
  * @experimental React components are in alpha and subject to change.
  */
 export declare const Accordion: import("react").ForwardRefExoticComponent<AccordionProps & import("react").RefAttributes<HTMLDivElement>>;
-export {};
 //# sourceMappingURL=Accordion.d.ts.map

package/react/accordion/Accordion.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Accordion.d.ts","sourceRoot":"","sources":["../../../src/react/accordion/Accordion.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,wBAAwB,EAAE,YAAY,EAAE,MAAM,OAAO,CAAA;AAQnE,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAA;AAChE,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAA;AAGzD,KAAK,cAAc,GAAG,YAAY,CAAC,kBAAkB,CAAC,GAAG,OAAO,GAAG,IAAI,GAAG,QAAQ,CAAC,cAAc,CAAC,CAAA;AAElG,MAAM,WAAW,cAAe,SAAQ,wBAAwB,CAAC,KAAK,CAAC;IACrE,QAAQ,EAAE,cAAc,CAAA;IACxB,UAAU,CAAC,EAAE,mBAAmB,CAAA;IAChC,mBAAmB,CAAC,EAAE,MAAM,CAAA;IAC5B,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,wBAAwB,CAAC,EAAE,MAAM,CAAA;IACjC,EAAE,EAAE,MAAM,CAAA;IACV,gBAAgB,CAAC,EAAE,OAAO,CAAA;IAC1B,mBAAmB,CAAC,EAAE,MAAM,CAAA;IAC5B,wBAAwB,CAAC,EAAE,MAAM,CAAA;IACjC,eAAe,CAAC,EAAE,MAAM,CAAA;CACzB;AAoBD;;GAEG;AACH,eAAO,MAAM,SAAS,2GAyDrB,CAAA"}
+{"version":3,"file":"Accordion.d.ts","sourceRoot":"","sources":["../../../src/react/accordion/Accordion.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,OAAO,CAAA;AAOrD,OAAO,EAAE,KAAK,eAAe,EAAE,MAAM,6BAA6B,CAAA;AAElE,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAA;AAChE,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAA;AAGzD,MAAM,WAAW,cAAe,SAAQ,wBAAwB,CAAC,KAAK,CAAC;IACrE,QAAQ,EAAE,eAAe,CAAC,kBAAkB,CAAC,CAAA;IAC7C,UAAU,CAAC,EAAE,mBAAmB,CAAA;IAChC,mBAAmB,CAAC,EAAE,MAAM,CAAA;IAC5B,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,wBAAwB,CAAC,EAAE,MAAM,CAAA;IACjC,EAAE,EAAE,MAAM,CAAA;IACV,gBAAgB,CAAC,EAAE,OAAO,CAAA;IAC1B,mBAAmB,CAAC,EAAE,MAAM,CAAA;IAC5B,wBAAwB,CAAC,EAAE,MAAM,CAAA;IACjC,eAAe,CAAC,EAAE,MAAM,CAAA;CACzB;AAoBD;;GAEG;AACH,eAAO,MAAM,SAAS,2GA2DrB,CAAA"}

package/react/back-link/BackLink.d.ts

@@ -1,8 +1,7 @@
-import type { ReactElement } from 'react';
 import { type LinkComponent } from '../internal/Link/Link';
-type BackLinkChild = ReactElement | boolean | null | Iterable<BackLinkChild>;
+import type { PermissiveChild } from '../internal/PermissiveChild';
 interface BackLinkProps {
-    children: BackLinkChild;
+    children: PermissiveChild;
     className?: string;
 }
 /**

package/react/back-link/BackLink.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"BackLink.d.ts","sourceRoot":"","sources":["../../../src/react/back-link/BackLink.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAA;AAEzC,OAAO,EAAY,KAAK,aAAa,EAAE,MAAM,uBAAuB,CAAA;AAEpE,KAAK,aAAa,GAAG,YAAY,GAAG,OAAO,GAAG,IAAI,GAAG,QAAQ,CAAC,aAAa,CAAC,CAAA;AAE5E,UAAU,aAAa;IACrB,QAAQ,EAAE,aAAa,CAAA;IACvB,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED;;GAEG;AACH,eAAO,MAAM,QAAQ,EAAE,aAAa,CAAC,aAAa,CAGgE,CAAA"}
+{"version":3,"file":"BackLink.d.ts","sourceRoot":"","sources":["../../../src/react/back-link/BackLink.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAY,KAAK,aAAa,EAAE,MAAM,uBAAuB,CAAA;AACpE,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,6BAA6B,CAAA;AAElE,UAAU,aAAa;IACrB,QAAQ,EAAE,eAAe,CAAA;IACzB,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED;;GAEG;AACH,eAAO,MAAM,QAAQ,EAAE,aAAa,CAAC,aAAa,CAGgE,CAAA"}

package/react/error-message/ErrorMessage.d.ts

@@ -0,0 +1,13 @@
+import { type ComponentPropsWithoutRef, type ReactNode } from 'react';
+export interface ErrorMessageProps extends ComponentPropsWithoutRef<'p'> {
+    children: ReactNode;
+    /**
+     * A visually hidden prefix used before the error message.
+     */
+    visuallyHiddenText?: string;
+}
+/**
+ * @experimental React components are in alpha and subject to change.
+ */
+export declare const ErrorMessage: import("react").ForwardRefExoticComponent<ErrorMessageProps & import("react").RefAttributes<HTMLParagraphElement>>;
+//# sourceMappingURL=ErrorMessage.d.ts.map

package/react/error-message/ErrorMessage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ErrorMessage.d.ts","sourceRoot":"","sources":["../../../src/react/error-message/ErrorMessage.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,wBAAwB,EAAc,KAAK,SAAS,EAAc,MAAM,OAAO,CAAA;AAG7F,MAAM,WAAW,iBAAkB,SAAQ,wBAAwB,CAAC,GAAG,CAAC;IACtE,QAAQ,EAAE,SAAS,CAAA;IACnB;;OAEG;IACH,kBAAkB,CAAC,EAAE,MAAM,CAAA;CAC5B;AAED;;GAEG;AACH,eAAO,MAAM,YAAY,oHAgBxB,CAAA"}

package/react/error-message/index.d.ts

@@ -0,0 +1,2 @@
+export * from './ErrorMessage';
+//# sourceMappingURL=index.d.ts.map

package/react/error-message/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/react/error-message/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAA"}

package/react/esm/VisuallyHiddenText/VisuallyHiddenText.js

@@ -0,0 +1,10 @@
+import clsx from 'clsx';
+import { jsx as _jsx } from "react/jsx-runtime";
+export var VisuallyHiddenText = function VisuallyHiddenText(_ref) {
+  var children = _ref.children,
+    className = _ref.className;
+  return _jsx("span", {
+    className: clsx('govuk-visually-hidden', className),
+    children: children
+  });
+};

package/react/esm/VisuallyHiddenText/index.js

@@ -0,0 +1 @@
+export * from './VisuallyHiddenText';

package/react/esm/accordion/Accordion.js

@@ -11,7 +11,7 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 import clsx from 'clsx';
 import { isEqual, pick } from 'lodash';
-import { Children, forwardRef, isValidElement, useRef } from 'react';
+import { Children, forwardRef, isValidElement, useMemo, useRef } from 'react';
 import flattenChildren from 'react-keyed-flatten-children';
 import { mergeRefs } from 'react-merge-refs';
 import { useMODUKComponent } from '../internal/hooks/useMODUKComponent';
@@ -48,6 +48,12 @@ export var Accordion = forwardRef(function (props, forwardedRef) {
     showSectionText = props.showSectionText,
     showSectionAriaLabelText = props.showSectionAriaLabelText,
     rest = _objectWithoutProperties(props, _excluded);
+  var contextValue = useMemo(function () {
+    return {
+      headingTag: headingTag,
+      id: id
+    };
+  }, [headingTag, id]);
   var i18nAttributes = {
     'data-i18n.hide-all-sections': hideAllSectionsText,
     'data-i18n.hide-section': hideSectionText,
@@ -57,10 +63,7 @@ export var Accordion = forwardRef(function (props, forwardedRef) {
     'data-i18n.show-section-aria-label': showSectionAriaLabelText
   };
   return _jsx(AccordionContext.Provider, {
-    value: {
-      headingTag: headingTag,
-      id: id
-    },
+    value: contextValue,
     children: _jsx("div", _objectSpread(_objectSpread(_objectSpread({
       ref: mergeRefs([ref, forwardedRef])
     }, rest), {}, {

package/react/esm/error-message/ErrorMessage.js

@@ -0,0 +1,33 @@
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+var _excluded = ["children", "className", "id", "visuallyHiddenText"];
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+import clsx from 'clsx';
+import { forwardRef, useContext } from 'react';
+import { FormGroupContext } from '../internal/FormGroup';
+import { jsxs as _jsxs } from "react/jsx-runtime";
+export var ErrorMessage = forwardRef(function (_ref, ref) {
+  var children = _ref.children,
+    className = _ref.className,
+    id = _ref.id,
+    _ref$visuallyHiddenTe = _ref.visuallyHiddenText,
+    visuallyHiddenText = _ref$visuallyHiddenTe === void 0 ? 'Error' : _ref$visuallyHiddenTe,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  var context = useContext(FormGroupContext);
+  return _jsxs("p", _objectSpread(_objectSpread({
+    ref: ref,
+    className: clsx('govuk-error-message', className)
+  }, rest), {}, {
+    id: context.id ? "".concat(context.id, "-error") : id,
+    children: [visuallyHiddenText && _jsxs("span", {
+      className: "govuk-visually-hidden",
+      children: [visuallyHiddenText, ":"]
+    }), children]
+  }));
+});
+ErrorMessage.displayName = 'ErrorMessage';

package/react/esm/error-message/index.js

@@ -0,0 +1 @@
+export * from './ErrorMessage';

package/react/esm/footer/Footer.js

@@ -0,0 +1,84 @@
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+var _excluded = ["className", "containerClassName", "contentLicence", "copyright", "meta", "navigation"];
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+import clsx from 'clsx';
+import { forwardRef } from 'react';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Fragment as _Fragment } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+function OpenGovernmentLicenceContent() {
+  return _jsxs(_Fragment, {
+    children: ['All content is available under the ', _jsx("a", {
+      className: "govuk-footer__link",
+      href: "https://www.nationalarchives.gov.uk/doc/open-government-licence/version/3/",
+      rel: "license",
+      children: "Open Government Licence v3.0"
+    }), ", except where otherwise stated"]
+  });
+}
+function FooterMetaWrapper(_ref) {
+  var children = _ref.children,
+    contentLicence = _ref.contentLicence,
+    copyright = _ref.copyright;
+  return _jsxs("div", {
+    className: "govuk-footer__meta",
+    children: [_jsxs("div", {
+      className: "govuk-footer__meta-item govuk-footer__meta-item--grow",
+      children: [children, _jsx("svg", {
+        "aria-hidden": "true",
+        focusable: "false",
+        className: "govuk-footer__licence-logo",
+        xmlns: "http://www.w3.org/2000/svg",
+        viewBox: "0 0 483.2 195.7",
+        height: "17",
+        width: "41",
+        children: _jsx("path", {
+          fill: "currentColor",
+          d: "M421.5 142.8V.1l-50.7 32.3v161.1h112.4v-50.7zm-122.3-9.6A47.12 47.12 0 0 1 221 97.8c0-26 21.1-47.1 47.1-47.1 16.7 0 31.4 8.7 39.7 21.8l42.7-27.2A97.63 97.63 0 0 0 268.1 0c-36.5 0-68.3 20.1-85.1 49.7A98 98 0 0 0 97.8 0C43.9 0 0 43.9 0 97.8s43.9 97.8 97.8 97.8c36.5 0 68.3-20.1 85.1-49.7a97.76 97.76 0 0 0 149.6 25.4l19.4 22.2h3v-87.8h-80l24.3 27.5zM97.8 145c-26 0-47.1-21.1-47.1-47.1s21.1-47.1 47.1-47.1 47.2 21 47.2 47S123.8 145 97.8 145"
+        })
+      }), ' ', _jsx("span", {
+        className: "govuk-footer__licence-description",
+        children: contentLicence
+      })]
+    }), _jsx("div", {
+      className: "govuk-footer__meta-item",
+      children: _jsx("a", {
+        className: "govuk-footer__link govuk-footer__copyright-logo",
+        href: "https://www.nationalarchives.gov.uk/information-management/re-using-public-sector-information/uk-government-licensing-framework/crown-copyright/",
+        children: copyright
+      })
+    })]
+  });
+}
+export var Footer = forwardRef(function (_ref2, ref) {
+  var className = _ref2.className,
+    containerClassName = _ref2.containerClassName,
+    _ref2$contentLicence = _ref2.contentLicence,
+    contentLicence = _ref2$contentLicence === void 0 ? OpenGovernmentLicenceContent() : _ref2$contentLicence,
+    _ref2$copyright = _ref2.copyright,
+    copyright = _ref2$copyright === void 0 ? '© Crown copyright' : _ref2$copyright,
+    meta = _ref2.meta,
+    navigation = _ref2.navigation,
+    rootProps = _objectWithoutProperties(_ref2, _excluded);
+  return _jsx("footer", _objectSpread(_objectSpread({
+    ref: ref,
+    className: clsx('govuk-footer', className),
+    role: "contentinfo"
+  }, rootProps), {}, {
+    children: _jsxs("div", {
+      className: clsx('govuk-width-container', containerClassName),
+      children: [navigation, _jsx(FooterMetaWrapper, {
+        contentLicence: contentLicence,
+        copyright: copyright,
+        children: meta
+      })]
+    })
+  }));
+});
+Footer.displayName = 'Footer';

package/react/esm/footer/FooterMeta.js

@@ -0,0 +1,21 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Fragment as _Fragment } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+export function FooterMeta(_ref) {
+  var children = _ref.children,
+    content = _ref.content,
+    _ref$visuallyHiddenTi = _ref.visuallyHiddenTitle,
+    visuallyHiddenTitle = _ref$visuallyHiddenTi === void 0 ? 'Support links' : _ref$visuallyHiddenTi;
+  return _jsxs(_Fragment, {
+    children: [_jsx("h2", {
+      className: "govuk-visually-hidden",
+      children: visuallyHiddenTitle
+    }), children && _jsx("ul", {
+      className: "govuk-footer__inline-list",
+      children: children
+    }), content && _jsx("div", {
+      className: "govuk-footer__meta-custom",
+      children: content
+    })]
+  });
+}

package/react/esm/footer/FooterMetaLink.js

@@ -0,0 +1,32 @@
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+var _excluded = ["children", "className"];
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+import clsx from 'clsx';
+import { forwardRef } from 'react';
+import { LinkBase } from '../internal/Link/Link';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Fragment as _Fragment } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+export var FooterMetaLink = forwardRef(function (_ref, forwardedRef) {
+  var children = _ref.children,
+    className = _ref.className,
+    props = _objectWithoutProperties(_ref, _excluded);
+  return _jsxs(_Fragment, {
+    children: [_jsx("li", {
+      className: "govuk-footer__inline-list-item",
+      children: _jsx(LinkBase, _objectSpread(_objectSpread({
+        ref: forwardedRef,
+        className: clsx('govuk-footer__link', className)
+      }, props), {}, {
+        children: children
+      }))
+    }), ' ']
+  });
+});
+FooterMetaLink.displayName = 'FooterLink';

package/react/esm/footer/FooterNavigation.js

@@ -0,0 +1,14 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Fragment as _Fragment } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+export function FooterNavigation(_ref) {
+  var children = _ref.children;
+  return _jsxs(_Fragment, {
+    children: [_jsx("div", {
+      className: "govuk-footer__navigation",
+      children: children
+    }), _jsx("hr", {
+      className: "govuk-footer__section-break"
+    })]
+  });
+}

package/react/esm/footer/FooterNavigationLink.js

@@ -0,0 +1,28 @@
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+var _excluded = ["children", "className"];
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+import clsx from 'clsx';
+import { forwardRef } from 'react';
+import { LinkBase } from '../internal/Link/Link';
+import { jsx as _jsx } from "react/jsx-runtime";
+export var FooterNavigationLink = forwardRef(function (_ref, forwardedRef) {
+  var children = _ref.children,
+    className = _ref.className,
+    props = _objectWithoutProperties(_ref, _excluded);
+  return _jsx("li", {
+    className: "govuk-footer__list-item",
+    children: _jsx(LinkBase, _objectSpread(_objectSpread({
+      ref: forwardedRef,
+      className: clsx('govuk-footer__link', className)
+    }, props), {}, {
+      children: children
+    }))
+  });
+});
+FooterNavigationLink.displayName = 'FooterNavigationLink';