@hmlr/govuk-react-components-library 1.0.3 → 1.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.stylelintrc.json +1 -1
- package/README.md +216 -2
- package/assets/uml-diagram.svg +782 -578
- package/bundle-analysis-main.html +1 -1
- package/bundle-analysis-pdfvc.html +1 -1
- package/dist/PDFViewerCanvas.cjs.css +4 -4
- package/dist/PDFViewerCanvas.cjs.js +24 -4
- package/dist/PDFViewerCanvas.cjs.js.map +1 -1
- package/dist/PDFViewerCanvas.d.ts +30 -0
- package/dist/PDFViewerCanvas.esm.css +4 -4
- package/dist/PDFViewerCanvas.esm.js +24 -4
- package/dist/PDFViewerCanvas.esm.js.map +1 -1
- package/dist/index.cjs.css +22 -15
- package/dist/index.cjs.js +207 -111
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.d.ts +183 -12
- package/dist/index.esm.css +22 -15
- package/dist/index.esm.js +206 -116
- package/dist/index.esm.js.map +1 -1
- package/dist/types/components/CardColumn/CardColumn.types.d.ts +20 -0
- package/dist/types/components/DataNavigation/DataNavigation.types.d.ts +27 -2
- package/dist/types/components/DifferenceNavigation/DifferenceNavigation.types.d.ts +25 -0
- package/dist/types/components/ExitThisPage/ExitThisPage.config.d.ts +1 -0
- package/dist/types/components/ExitThisPage/ExitThisPage.d.ts +4 -0
- package/dist/types/components/ExitThisPage/ExitThisPage.types.d.ts +17 -0
- package/dist/types/components/ExitThisPage/index.d.ts +2 -0
- package/dist/types/components/Footer/Footer.types.d.ts +7 -0
- package/dist/types/components/PDFViewerCanvas/PDFViewerCanvas.types.d.ts +30 -0
- package/dist/types/components/Pagination/Pagination.types.d.ts +23 -13
- package/dist/types/components/Pagination/index.d.ts +2 -0
- package/dist/types/components/PasswordInput/PasswordInput.config.d.ts +1 -0
- package/dist/types/components/PasswordInput/PasswordInput.d.ts +4 -0
- package/dist/types/components/PasswordInput/PasswordInput.types.d.ts +49 -0
- package/dist/types/components/PasswordInput/index.d.ts +2 -0
- package/dist/types/components/index.d.ts +2 -0
- package/dist/types/dynamics/types.d.ts +1 -1
- package/dist/types/utils/WithReference.types.d.ts +7 -2
- package/package.json +63 -61
- package/scripts/generateStories.mjs +433 -0
- package/dist/types/JestSetup.d.ts +0 -1
package/dist/index.esm.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
|
|
2
|
-
import { Accordion as Accordion$1, createAll, Button as Button$1, Checkboxes as Checkboxes$1, ErrorSummary as ErrorSummary$1, Header as Header$1, Radios as Radios$1, SkipLink as SkipLink$1, Tabs as Tabs$1 } from 'govuk-frontend';
|
|
2
|
+
import { Accordion as Accordion$1, createAll, Button as Button$1, Checkboxes as Checkboxes$1, ErrorSummary as ErrorSummary$1, ExitThisPage as ExitThisPage$1, Header as Header$1, PasswordInput as PasswordInput$1, Radios as Radios$1, SkipLink as SkipLink$1, Tabs as Tabs$1 } from 'govuk-frontend';
|
|
3
3
|
import { Link, useLocation } from 'react-router-dom';
|
|
4
4
|
import * as React from 'react';
|
|
5
5
|
import React__default, { useContext, useMemo, createElement, Component, useState, useRef, useEffect } from 'react';
|
|
@@ -72,10 +72,10 @@ function ExtractAccordionConfigFromAttributes(remainingAttributes) {
|
|
|
72
72
|
return accordionConfig;
|
|
73
73
|
}
|
|
74
74
|
|
|
75
|
-
const Accordion = ({ headingLevel: HeadingLevel = "h2", items, className, id, ...attributes }) => {
|
|
75
|
+
const Accordion = ({ headingLevel: HeadingLevel = "h2", items = [], className, id, ...attributes }) => {
|
|
76
76
|
const remainingAttributes = { ...attributes };
|
|
77
77
|
ExtractAccordionConfigFromAttributes(remainingAttributes);
|
|
78
|
-
return (jsx("div", { ...remainingAttributes, id: id, className: `govuk-accordion ${className || ""}`, "data-module": "govuk-accordion", children: items.filter(Boolean).map((item, index) => (jsxs("div", { className: `govuk-accordion__section ${item.expanded ? "govuk-accordion__section--expanded" : ""}`, children: [jsxs("div", { className: "govuk-accordion__section-header", children: [jsx(HeadingLevel, { className: "govuk-accordion__section-heading", children: jsx("span", { className: "govuk-accordion__section-button", id: `${id}-heading-${index + 1}`, children: item.heading
|
|
78
|
+
return (jsx("div", { ...remainingAttributes, id: id, className: `govuk-accordion ${className || ""}`, "data-module": "govuk-accordion", children: items.filter(Boolean).map((item, index) => (jsxs("div", { className: `govuk-accordion__section ${item.expanded ? "govuk-accordion__section--expanded" : ""}`, children: [jsxs("div", { className: "govuk-accordion__section-header", children: [jsx(HeadingLevel, { className: "govuk-accordion__section-heading", children: jsx("span", { className: "govuk-accordion__section-button", id: `${id}-heading-${index + 1}`, children: item.heading?.children }) }), item.summary && (jsx("div", { className: "govuk-accordion__section-summary govuk-body", id: `${id}-summary-${index + 1}`, children: item.summary.children }))] }), jsx("div", { id: `${id}-content-${index + 1}`, className: "govuk-accordion__section-content", "aria-labelledby": `${id}-heading-${index + 1}`, children: item.content?.children })] }, item.reactListKey || index))) }));
|
|
79
79
|
};
|
|
80
80
|
|
|
81
81
|
const LinkWithRef = ({ children, to, href, forwardedRef = null, ...attributes }) => {
|
|
@@ -158,40 +158,39 @@ const Boolean$1 = ({ className, errorMessage, fieldset, formGroup, hint, idPrefi
|
|
|
158
158
|
return null;
|
|
159
159
|
};
|
|
160
160
|
const hasFieldset = !!fieldset;
|
|
161
|
-
const innerHtml = (jsxs(Fragment, { children: [getHintComponent(), getErrorMessageComponent(), jsx("div", { className: `govuk-${controlType} ${className || ""}`, ...attributes, "data-module": `govuk-${controlType}`, children: items
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
}) })] }));
|
|
161
|
+
const innerHtml = (jsxs(Fragment, { children: [getHintComponent(), getErrorMessageComponent(), jsx("div", { className: `govuk-${controlType} ${className || ""}`, ...attributes, "data-module": `govuk-${controlType}`, children: items?.map((item, index) => {
|
|
162
|
+
if (!item) {
|
|
163
|
+
return null;
|
|
164
|
+
}
|
|
165
|
+
if (item.behaviour === "exclusive") {
|
|
166
|
+
delete item.behaviour;
|
|
167
|
+
}
|
|
168
|
+
const { id, children, hint: itemHint, conditional: itemConditional, behaviour, label, reactListKey, ...itemAttributes } = item;
|
|
169
|
+
const idSuffix = `-${index + 1}`;
|
|
170
|
+
const idValue = id || `${idPrefixValue}${index === 0 ? "" : idSuffix}`;
|
|
171
|
+
const nameValue = item.name ? item.name : name;
|
|
172
|
+
const conditionalId = itemConditional?.children
|
|
173
|
+
? `conditional-${idValue}`
|
|
174
|
+
: undefined;
|
|
175
|
+
const itemHintId = `${idValue}-item-hint`;
|
|
176
|
+
let itemDescribedBy = "";
|
|
177
|
+
if (controlType === "checkboxes" && !hasFieldset) {
|
|
178
|
+
itemDescribedBy = describedBy;
|
|
179
|
+
}
|
|
180
|
+
if (itemHint) {
|
|
181
|
+
itemDescribedBy += ` ${itemHintId}`;
|
|
182
|
+
}
|
|
183
|
+
if (item.divider) {
|
|
184
|
+
return (jsx("div", { className: `govuk-${controlType}__divider`, children: item.divider }, reactListKey || index));
|
|
185
|
+
}
|
|
186
|
+
return (jsxs(React__default.Fragment, { children: [jsxs("div", { className: `govuk-${controlType}__item`, children: [jsx("input", { className: `govuk-${controlType}__input`, id: idValue, name: nameValue, type: controlType === "radios" ? "radio" : "checkbox", "data-aria-controls": conditionalId, "aria-describedby": itemDescribedBy || undefined, onChange: onChange, onBlur: onBlur, "data-behaviour": behaviour, ...itemAttributes }), jsx(Label, { ...label,
|
|
187
|
+
className: `govuk-${controlType}__label ${label?.className || ""}`,
|
|
188
|
+
htmlFor: idValue,
|
|
189
|
+
isPageHeading: false, children: children }), itemHint ? (jsx(Hint, { ...itemHint,
|
|
190
|
+
className: `govuk-${controlType}__hint ${itemHint.className || ""}`, id: itemHintId })) : ("")] }), itemConditional?.children ? (jsx("div", { className: `govuk-${controlType}__conditional ${item.checked
|
|
191
|
+
? ""
|
|
192
|
+
: `govuk-${controlType}__conditional--hidden`}`, id: conditionalId, children: itemConditional.children })) : ("")] }, reactListKey || index));
|
|
193
|
+
}) })] }));
|
|
195
194
|
return (jsx("div", { className: `govuk-form-group${errorMessage ? " govuk-form-group--error" : ""} ${formGroup?.className || ""}`, children: hasFieldset ? (jsx(Fieldset, { ...omit(fieldset, "role"), "aria-describedby": describedBy.trim() || undefined, children: innerHtml })) : (innerHtml) }));
|
|
196
195
|
};
|
|
197
196
|
|
|
@@ -540,7 +539,7 @@ const CardTitle = /*#__PURE__*/React.forwardRef(({
|
|
|
540
539
|
});
|
|
541
540
|
CardTitle.displayName = 'CardTitle';
|
|
542
541
|
|
|
543
|
-
const Card = /*#__PURE__*/React.forwardRef(({
|
|
542
|
+
const Card$1 = /*#__PURE__*/React.forwardRef(({
|
|
544
543
|
bsPrefix,
|
|
545
544
|
className,
|
|
546
545
|
bg,
|
|
@@ -562,8 +561,8 @@ const Card = /*#__PURE__*/React.forwardRef(({
|
|
|
562
561
|
}) : children
|
|
563
562
|
});
|
|
564
563
|
});
|
|
565
|
-
Card.displayName = 'Card';
|
|
566
|
-
var Card
|
|
564
|
+
Card$1.displayName = 'Card';
|
|
565
|
+
var Card = Object.assign(Card$1, {
|
|
567
566
|
Img: CardImg,
|
|
568
567
|
Title: CardTitle,
|
|
569
568
|
Subtitle: CardSubtitle,
|
|
@@ -575,9 +574,19 @@ var Card$1 = Object.assign(Card, {
|
|
|
575
574
|
ImgOverlay: CardImgOverlay
|
|
576
575
|
});
|
|
577
576
|
|
|
577
|
+
// The default colours come from the SCSS via govuk-functional-colour(), which
|
|
578
|
+
// resolves the govuk-frontend CSS custom properties (--govuk-colour-brand,
|
|
579
|
+
// --govuk-colour-header-background). We only need to set inline CSS variables
|
|
580
|
+
// here when the consumer explicitly overrides them via props.
|
|
578
581
|
const CardColumn = (props) => {
|
|
579
|
-
const { body, header, link } = props;
|
|
580
|
-
|
|
582
|
+
const { body, header, link, textColor, hoverColor } = props;
|
|
583
|
+
const inlineVars = textColor || hoverColor
|
|
584
|
+
? {
|
|
585
|
+
...(textColor && { "--card-text-color": textColor }),
|
|
586
|
+
...(hoverColor && { "--card-hover-color": hoverColor }),
|
|
587
|
+
}
|
|
588
|
+
: undefined;
|
|
589
|
+
return (jsx("div", { className: "col", children: jsxs(Card, { className: "card-styles", style: inlineVars, children: [jsx(Link, { to: link, children: jsx(Card.Header, { className: "card-header govuk-!-font-size-27 govuk-!-font-weight-bold", children: header }) }), jsx(Card.Body, { className: "govuk-!-font-size-19", children: body })] }) }));
|
|
581
590
|
};
|
|
582
591
|
|
|
583
592
|
const CardLayout = (props) => {
|
|
@@ -644,9 +653,27 @@ const CookieActions = ({ actions }) => (jsx("div", { className: "govuk-button-gr
|
|
|
644
653
|
const CookieMessage = ({ headingChildren, children, className, actions, }) => (jsxs("div", { className: `govuk-cookie-banner__message govuk-width-container ${className || ""}`, children: [jsx("div", { className: "govuk-grid-row", children: jsxs("div", { className: "govuk-grid-column-two-thirds", children: [headingChildren && (jsx("h2", { className: "govuk-cookie-banner__heading govuk-heading-m", children: headingChildren })), jsx("div", { className: "govuk-cookie-banner__content", children: typeof children === "string" ? (jsx("p", { className: "govuk-body", children: children })) : (children) })] }) }), actions && jsx(CookieActions, { actions: actions })] }));
|
|
645
654
|
const CookieBanner = ({ className, messages, "aria-label": ariaLabel = "Cookie banner", ...attributes }) => (jsx("div", { className: `govuk-cookie-banner ${className || ""}`, "data-nosnippet": true, role: "region", "aria-label": ariaLabel, ...attributes, children: messages.map((message, index) => (jsx(CookieMessage, { headingChildren: message.headingChildren, className: message.className, actions: message.actions, ...message, children: message.children }, index))) }));
|
|
646
655
|
|
|
647
|
-
const DataNavigation = ({ dataId, setDataFocus, previousText = "Previous", previousCondition, nextText = "Next", nextCondition, dataDescription, }) => {
|
|
648
|
-
//
|
|
649
|
-
|
|
656
|
+
const DataNavigation = ({ dataId, setDataFocus, previousText = "Previous", previousCondition, nextText = "Next", nextCondition, dataDescription, buttonColour, buttonTextColour, buttonShadowColour, buttonHoverColour, buttonHoverTextColour, }) => {
|
|
657
|
+
// CSS custom properties set directly on each <button> element via Button's
|
|
658
|
+
// ...attributes spread, so they sit on the same element that
|
|
659
|
+
// .app-data-navigation-button targets — no inheritance from a parent div needed.
|
|
660
|
+
const inlineVars = {
|
|
661
|
+
...(buttonColour && { "--data-nav-button-colour": buttonColour }),
|
|
662
|
+
...(buttonTextColour && {
|
|
663
|
+
"--data-nav-button-text-colour": buttonTextColour,
|
|
664
|
+
}),
|
|
665
|
+
...(buttonShadowColour && {
|
|
666
|
+
"--data-nav-button-shadow-colour": buttonShadowColour,
|
|
667
|
+
}),
|
|
668
|
+
...(buttonHoverColour && {
|
|
669
|
+
"--data-nav-button-hover-colour": buttonHoverColour,
|
|
670
|
+
}),
|
|
671
|
+
...(buttonHoverTextColour && {
|
|
672
|
+
"--data-nav-button-hover-text-colour": buttonHoverTextColour,
|
|
673
|
+
}),
|
|
674
|
+
};
|
|
675
|
+
const hasInlineVars = Object.keys(inlineVars).length > 0;
|
|
676
|
+
const renderNavButton = (id, onClick, disabled, content) => (jsx(Button, { id: id, onClick: onClick, "data-testid": id, disabled: disabled, className: "app-data-navigation-button", ...(hasInlineVars && { style: inlineVars }), children: content }));
|
|
650
677
|
return (jsxs("div", { className: "govuk-grid-row", children: [jsx("div", { className: "govuk-grid-column-one-third govuk-!-text-align-left", children: renderNavButton("previous-data", () => setDataFocus(dataId - 1), previousCondition, jsxs(Fragment, { children: [jsx("svg", { className: "govuk-button__start-icon back-button", xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 24 24", "aria-hidden": "true", focusable: "false", transform: "rotate(180)", children: jsx("path", { fill: "currentColor", d: "M8.122 24l-4.122-4 8-8-8-8 4.122-4 11.878 12z" }) }), "\u00A0", previousText] })) }), jsx("div", { className: "govuk-grid-column-one-third govuk-!-text-align-centre", children: jsx(Label, { children: dataDescription }) }), jsx("div", { className: "govuk-grid-column-one-third govuk-!-text-align-right", children: renderNavButton("next-data", () => setDataFocus(dataId + 1), nextCondition, jsxs(Fragment, { children: [nextText, jsx("svg", { className: "govuk-button__start-icon", xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 24 24", "aria-hidden": "true", focusable: "false", children: jsx("path", { fill: "currentColor", d: "M8.122 24l-4.122-4 8-8-8-8 4.122-4 11.878 12z" }) })] })) })] }));
|
|
651
678
|
};
|
|
652
679
|
|
|
@@ -741,13 +768,33 @@ function titleCase(str) {
|
|
|
741
768
|
.join(" ");
|
|
742
769
|
}
|
|
743
770
|
|
|
744
|
-
const DifferenceNavigation = ({ differenceId, setDifferenceFocus, totalDifferences, keyword = "variation", plural = "variations", }) => {
|
|
771
|
+
const DifferenceNavigation = ({ differenceId, setDifferenceFocus, totalDifferences, keyword = "variation", plural = "variations", buttonColour, buttonTextColour, buttonShadowColour, buttonHoverColour, buttonHoverTextColour, }) => {
|
|
745
772
|
if (totalDifferences === 0) {
|
|
746
773
|
return (jsxs("p", { className: "govuk-body govuk-!-font-size-20 govuk-!-text-align-centre", children: ["No ", `${plural}`, " found"] }));
|
|
747
774
|
}
|
|
775
|
+
// CSS custom properties set directly on each <button> element via Button's
|
|
776
|
+
// ...attributes spread, so they sit on the same element that
|
|
777
|
+
// .app-difference-navigation-button targets — no inheritance from a parent
|
|
778
|
+
// div needed. Only written when a prop is explicitly provided.
|
|
779
|
+
const inlineVars = {
|
|
780
|
+
...(buttonColour && { "--diff-nav-button-colour": buttonColour }),
|
|
781
|
+
...(buttonTextColour && {
|
|
782
|
+
"--diff-nav-button-text-colour": buttonTextColour,
|
|
783
|
+
}),
|
|
784
|
+
...(buttonShadowColour && {
|
|
785
|
+
"--diff-nav-button-shadow-colour": buttonShadowColour,
|
|
786
|
+
}),
|
|
787
|
+
...(buttonHoverColour && {
|
|
788
|
+
"--diff-nav-button-hover-colour": buttonHoverColour,
|
|
789
|
+
}),
|
|
790
|
+
...(buttonHoverTextColour && {
|
|
791
|
+
"--diff-nav-button-hover-text-colour": buttonHoverTextColour,
|
|
792
|
+
}),
|
|
793
|
+
};
|
|
794
|
+
const hasInlineVars = Object.keys(inlineVars).length > 0;
|
|
748
795
|
const isPreviousDisabled = differenceId <= 1;
|
|
749
796
|
const isNextDisabled = differenceId === totalDifferences;
|
|
750
|
-
const renderButton = (id, onClick, disabled, content) => (jsx(Button, { id: id, onClick: onClick, "data-testid": id, disabled: disabled, children: content }));
|
|
797
|
+
const renderButton = (id, onClick, disabled, content) => (jsx(Button, { id: id, onClick: onClick, "data-testid": id, disabled: disabled, className: "app-difference-navigation-button", ...(hasInlineVars && { style: inlineVars }), children: content }));
|
|
751
798
|
return (jsxs("div", { className: "govuk-grid-row", children: [jsx("div", { className: "govuk-grid-column-one-third", children: jsx("div", { className: "govuk-!-text-align-left", children: renderButton(`previous-${keyword}`, () => setDifferenceFocus(differenceId - 1), isPreviousDisabled, jsxs(Fragment, { children: [" ", jsx("svg", { className: "govuk-button__start-icon back-button", xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 24 24", "aria-hidden": "true", focusable: "false", transform: "rotate(180)", children: jsx("path", { fill: "currentColor", d: "M8.122 24l-4.122-4 8-8-8-8 4.122-4 11.878 12z" }) }), "\u00A0Previous", " "] })) }) }), jsx("div", { className: "govuk-grid-column-one-third", children: jsxs(Label, { className: "govuk-!-text-align-centre", children: [titleCase(keyword), " ", differenceId, " of ", totalDifferences] }) }), jsx("div", { className: "govuk-grid-column-one-third", children: jsx("div", { className: "govuk-!-text-align-right", children: renderButton(`next-${keyword}`, () => setDifferenceFocus(differenceId + 1), isNextDisabled, jsxs(Fragment, { children: [" ", "Next", jsx("svg", { className: "govuk-button__start-icon back-button", xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 24 24", "aria-hidden": "true", focusable: "false", children: jsx("path", { fill: "currentColor", d: "M8.122 24l-4.122-4 8-8-8-8 4.122-4 11.878 12z" }) })] })) }) })] }));
|
|
752
799
|
};
|
|
753
800
|
|
|
@@ -811,6 +858,24 @@ function ConfigureOverallErrorSummary($scope, config) {
|
|
|
811
858
|
createAll(ErrorSummary$1, config, $scope);
|
|
812
859
|
}
|
|
813
860
|
|
|
861
|
+
const ExitThisPage = ({ children = "Exit this page", className, redirectUrl = "https://www.bbc.co.uk/weather", activatedText, timedOutText, pressTwoMoreTimesText, pressOneMoreTimeText, ...attributes }) => {
|
|
862
|
+
const i18nProps = {};
|
|
863
|
+
if (activatedText)
|
|
864
|
+
i18nProps["data-i18n.activated"] = activatedText;
|
|
865
|
+
if (timedOutText)
|
|
866
|
+
i18nProps["data-i18n.timed-out"] = timedOutText;
|
|
867
|
+
if (pressTwoMoreTimesText)
|
|
868
|
+
i18nProps["data-i18n.press-two-more-times"] = pressTwoMoreTimesText;
|
|
869
|
+
if (pressOneMoreTimeText)
|
|
870
|
+
i18nProps["data-i18n.press-one-more-time"] = pressOneMoreTimeText;
|
|
871
|
+
return (jsx("div", { ...attributes, ...i18nProps, className: `govuk-exit-this-page${className ? ` ${className}` : ""}`, "data-module": "govuk-exit-this-page", children: jsxs("a", { href: redirectUrl, role: "button", draggable: false, className: "govuk-button govuk-button--warning govuk-exit-this-page__button govuk-js-exit-this-page-button", "data-module": "govuk-button", rel: "nofollow noreferrer", children: [jsx("span", { className: "govuk-visually-hidden", children: "Emergency" }), " ", children] }) }));
|
|
872
|
+
};
|
|
873
|
+
ExitThisPage.displayName = "ExitThisPage";
|
|
874
|
+
|
|
875
|
+
function ConfigureOverallExitThisPage($scope) {
|
|
876
|
+
createAll(ExitThisPage$1, {}, $scope);
|
|
877
|
+
}
|
|
878
|
+
|
|
814
879
|
const FileUpload = (props) => {
|
|
815
880
|
const { className, errorMessage, formGroup, hint, label, "aria-describedby": describedBy, id, ...attributes } = props;
|
|
816
881
|
let hintComponent;
|
|
@@ -831,9 +896,10 @@ const FileUpload = (props) => {
|
|
|
831
896
|
FileUpload.displayName = "FileUpload";
|
|
832
897
|
|
|
833
898
|
const Footer = (props) => {
|
|
834
|
-
const { className, containerClassName, meta, navigation, ...attributes } = props;
|
|
899
|
+
const { className, containerClassName, meta, navigation, contentLicence, ...attributes } = props;
|
|
835
900
|
let navigationComponent;
|
|
836
901
|
let metaComponent;
|
|
902
|
+
let contentLicenceComponent;
|
|
837
903
|
if (navigation && navigation.length > 0) {
|
|
838
904
|
navigationComponent = (jsxs(Fragment, { children: [jsx("div", { className: "govuk-footer__navigation", children: navigation.map((nav, navIndex) => (jsxs("div", { className: `govuk-footer__section govuk-grid-column-${nav.width ? nav.width : "full"}`, children: [jsx("h2", { className: "govuk-footer__heading govuk-heading-m", children: nav.title }), nav.items && nav.items.length > 0 ? (jsx("ul", { className: `govuk-footer__list ${nav.columns ? `govuk-footer__list--columns-${nav.columns}` : ""}`, children: nav.items.map((item, index) => {
|
|
839
905
|
const { className: itemClassName, children: itemChildren, reactListKey, ...itemAttributes } = item;
|
|
@@ -843,54 +909,40 @@ const Footer = (props) => {
|
|
|
843
909
|
if (meta) {
|
|
844
910
|
metaComponent = (jsxs(Fragment, { children: [jsx("h2", { className: "govuk-visually-hidden", children: meta.visuallyHiddenTitle
|
|
845
911
|
? meta.visuallyHiddenTitle
|
|
846
|
-
: "Support links" }), meta.items && meta.items.length > 0 ? (jsx(
|
|
847
|
-
|
|
848
|
-
|
|
849
|
-
|
|
912
|
+
: "Support links" }), meta.items && meta.items.length > 0 ? (jsx("ul", { className: "govuk-footer__inline-list", children: meta.items.map((item, index) => {
|
|
913
|
+
const { className: itemClassName, children: itemChildren, reactListKey, ...itemAttributes } = item;
|
|
914
|
+
return (jsx("li", { className: "govuk-footer__inline-list-item", children: jsx(LinkWithRef, { className: `govuk-footer__link ${itemClassName || ""}`, ...itemAttributes, children: itemChildren }) }, reactListKey || index));
|
|
915
|
+
}) })) : null, meta.children ? (jsx("div", { className: "govuk-footer__meta-custom", children: meta.children })) : null] }));
|
|
916
|
+
}
|
|
917
|
+
if (contentLicence) {
|
|
918
|
+
const { className: contentLicenceClassName, children: contentLicenceChildren, ...contentLicenceAttributes } = contentLicence;
|
|
919
|
+
contentLicenceComponent = (jsx("div", { className: contentLicenceClassName, ...contentLicenceAttributes, children: contentLicenceChildren }));
|
|
920
|
+
}
|
|
921
|
+
else if (contentLicence === undefined) {
|
|
922
|
+
contentLicenceComponent = (jsxs(Fragment, { 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" }) }), jsxs("span", { className: "govuk-footer__licence-description", 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"] })] }));
|
|
850
923
|
}
|
|
851
|
-
|
|
924
|
+
else {
|
|
925
|
+
contentLicenceComponent = jsx(Fragment, {});
|
|
926
|
+
}
|
|
927
|
+
return (jsx("footer", { className: `govuk-footer ${className || ""}`, role: "contentinfo", ...attributes, children: jsxs("div", { className: `govuk-width-container ${containerClassName || ""}`, children: [jsx("svg", { focusable: "false", role: "presentation", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 64 60", height: "30", width: "32", fill: "currentcolor", className: "govuk-footer__crown", children: jsxs("g", { children: [jsx("circle", { cx: "20", cy: "17.6", r: "3.7" }), jsx("circle", { cx: "10.2", cy: "23.5", r: "3.7" }), jsx("circle", { cx: "3.7", cy: "33.2", r: "3.7" }), jsx("circle", { cx: "31.7", cy: "30.6", r: "3.7" }), jsx("circle", { cx: "43.3", cy: "17.6", r: "3.7" }), jsx("circle", { cx: "53.2", cy: "23.5", r: "3.7" }), jsx("circle", { cx: "59.7", cy: "33.2", r: "3.7" }), jsx("circle", { cx: "31.7", cy: "30.6", r: "3.7" }), jsx("path", { d: "M33.1,9.8c.2-.1.3-.3.5-.5l4.6,2.4v-6.8l-4.6,1.5c-.1-.2-.3-.3-.5-.5l1.9-5.9h-6.7l1.9,5.9c-.2.1-.3.3-.5.5l-4.6-1.5v6.8l4.6-2.4c.1.2.3.3.5.5l-2.6,8c-.9,2.8,1.2,5.7,4.1,5.7h0c3,0,5.1-2.9,4.1-5.7l-2.6-8ZM37,37.9s-3.4,3.8-4.1,6.1c2.2,0,4.2-.5,6.4-2.8l-.7,8.5c-2-2.8-4.4-4.1-5.7-3.8.1,3.1.5,6.7,5.8,7.2,3.7.3,6.7-1.5,7-3.8.4-2.6-2-4.3-3.7-1.6-1.4-4.5,2.4-6.1,4.9-3.2-1.9-4.5-1.8-7.7,2.4-10.9,3,4,2.6,7.3-1.2,11.1,2.4-1.3,6.2,0,4,4.6-1.2-2.8-3.7-2.2-4.2.2-.3,1.7.7,3.7,3,4.2,1.9.3,4.7-.9,7-5.9-1.3,0-2.4.7-3.9,1.7l2.4-8c.6,2.3,1.4,3.7,2.2,4.5.6-1.6.5-2.8,0-5.3l5,1.8c-2.6,3.6-5.2,8.7-7.3,17.5-7.4-1.1-15.7-1.7-24.5-1.7h0c-8.8,0-17.1.6-24.5,1.7-2.1-8.9-4.7-13.9-7.3-17.5l5-1.8c-.5,2.5-.6,3.7,0,5.3.8-.8,1.6-2.3,2.2-4.5l2.4,8c-1.5-1-2.6-1.7-3.9-1.7,2.3,5,5.2,6.2,7,5.9,2.3-.4,3.3-2.4,3-4.2-.5-2.4-3-3.1-4.2-.2-2.2-4.6,1.6-6,4-4.6-3.7-3.7-4.2-7.1-1.2-11.1,4.2,3.2,4.3,6.4,2.4,10.9,2.5-2.8,6.3-1.3,4.9,3.2-1.8-2.7-4.1-1-3.7,1.6.3,2.3,3.3,4.1,7,3.8,5.4-.5,5.7-4.2,5.8-7.2-1.3-.2-3.7,1-5.7,3.8l-.7-8.5c2.2,2.3,4.2,2.7,6.4,2.8-.7-2.3-4.1-6.1-4.1-6.1h10.6,0Z" })] }) }), navigationComponent, jsxs("div", { className: "govuk-footer__meta", children: [jsxs("div", { className: "govuk-footer__meta-item govuk-footer__meta-item--grow", children: [metaComponent, contentLicenceComponent] }), 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: "\u00A9 Crown copyright" }) })] })] }) }));
|
|
852
928
|
};
|
|
853
929
|
|
|
930
|
+
// Tudor Crown SVG — govuk-frontend v5+ (replaces old St. Edward's Crown)
|
|
931
|
+
const GovUKLogotype = () => (jsxs("svg", { focusable: "false", role: "img", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 324 60", height: "30", width: "162", fill: "currentcolor", className: "govuk-header__logotype", "aria-label": "GOV.UK", children: [jsx("title", { children: "GOV.UK" }), jsxs("g", { children: [jsx("circle", { cx: "20", cy: "17.6", r: "3.7" }), jsx("circle", { cx: "10.2", cy: "23.5", r: "3.7" }), jsx("circle", { cx: "3.7", cy: "33.2", r: "3.7" }), jsx("circle", { cx: "31.7", cy: "30.6", r: "3.7" }), jsx("circle", { cx: "43.3", cy: "17.6", r: "3.7" }), jsx("circle", { cx: "53.2", cy: "23.5", r: "3.7" }), jsx("circle", { cx: "59.7", cy: "33.2", r: "3.7" }), jsx("circle", { cx: "31.7", cy: "30.6", r: "3.7" }), jsx("path", { d: "M33.1,9.8c.2-.1.3-.3.5-.5l4.6,2.4v-6.8l-4.6,1.5c-.1-.2-.3-.3-.5-.5l1.9-5.9h-6.7l1.9,5.9c-.2.1-.3.3-.5.5l-4.6-1.5v6.8l4.6-2.4c.1.2.3.3.5.5l-2.6,8c-.9,2.8,1.2,5.7,4.1,5.7h0c3,0,5.1-2.9,4.1-5.7l-2.6-8ZM37,37.9s-3.4,3.8-4.1,6.1c2.2,0,4.2-.5,6.4-2.8l-.7,8.5c-2-2.8-4.4-4.1-5.7-3.8.1,3.1.5,6.7,5.8,7.2,3.7.3,6.7-1.5,7-3.8.4-2.6-2-4.3-3.7-1.6-1.4-4.5,2.4-6.1,4.9-3.2-1.9-4.5-1.8-7.7,2.4-10.9,3,4,2.6,7.3-1.2,11.1,2.4-1.3,6.2,0,4,4.6-1.2-2.8-3.7-2.2-4.2.2-.3,1.7.7,3.7,3,4.2,1.9.3,4.7-.9,7-5.9-1.3,0-2.4.7-3.9,1.7l2.4-8c.6,2.3,1.4,3.7,2.2,4.5.6-1.6.5-2.8,0-5.3l5,1.8c-2.6,3.6-5.2,8.7-7.3,17.5-7.4-1.1-15.7-1.7-24.5-1.7h0c-8.8,0-17.1.6-24.5,1.7-2.1-8.9-4.7-13.9-7.3-17.5l5-1.8c-.5,2.5-.6,3.7,0,5.3.8-.8,1.6-2.3,2.2-4.5l2.4,8c-1.5-1-2.6-1.7-3.9-1.7,2.3,5,5.2,6.2,7,5.9,2.3-.4,3.3-2.4,3-4.2-.5-2.4-3-3.1-4.2-.2-2.2-4.6,1.6-6,4-4.6-3.7-3.7-4.2-7.1-1.2-11.1,4.2,3.2,4.3,6.4,2.4,10.9,2.5-2.8,6.3-1.3,4.9,3.2-1.8-2.7-4.1-1-3.7,1.6.3,2.3,3.3,4.1,7,3.8,5.4-.5,5.7-4.2,5.8-7.2-1.3-.2-3.7,1-5.7,3.8l-.7-8.5c2.2,2.3,4.2,2.7,6.4,2.8-.7-2.3-4.1-6.1-4.1-6.1h10.6,0Z" })] }), jsx("circle", { className: "govuk-logo-dot", cx: "226", cy: "36", r: "7.3" }), jsx("path", { d: "M93.94 41.25c.4 1.81 1.2 3.21 2.21 4.62 1 1.4 2.21 2.41 3.61 3.21s3.21 1.2 5.22 1.2 3.61-.4 4.82-1c1.4-.6 2.41-1.4 3.21-2.41.8-1 1.4-2.01 1.61-3.01s.4-2.01.4-3.01v.14h-10.86v-7.02h20.07v24.08h-8.03v-5.56c-.6.8-1.38 1.61-2.19 2.41-.8.8-1.81 1.2-2.81 1.81-1 .4-2.21.8-3.41 1.2s-2.41.4-3.81.4a18.56 18.56 0 0 1-14.65-6.63c-1.6-2.01-3.01-4.41-3.81-7.02s-1.4-5.62-1.4-8.83.4-6.02 1.4-8.83a20.45 20.45 0 0 1 19.46-13.65c3.21 0 4.01.2 5.82.8 1.81.4 3.61 1.2 5.02 2.01 1.61.8 2.81 2.01 4.01 3.21s2.21 2.61 2.81 4.21l-7.63 4.41c-.4-1-1-1.81-1.61-2.61-.6-.8-1.4-1.4-2.21-2.01-.8-.6-1.81-1-2.81-1.4-1-.4-2.21-.4-3.61-.4-2.01 0-3.81.4-5.22 1.2-1.4.8-2.61 1.81-3.61 3.21s-1.61 2.81-2.21 4.62c-.4 1.81-.6 3.71-.6 5.42s.8 5.22.8 5.22Zm57.8-27.9c3.21 0 6.22.6 8.63 1.81 2.41 1.2 4.82 2.81 6.62 4.82S170.2 24.39 171 27s1.4 5.62 1.4 8.83-.4 6.02-1.4 8.83-2.41 5.02-4.01 7.02-4.01 3.61-6.62 4.82-5.42 1.81-8.63 1.81-6.22-.6-8.63-1.81-4.82-2.81-6.42-4.82-3.21-4.41-4.01-7.02-1.4-5.62-1.4-8.83.4-6.02 1.4-8.83 2.41-5.02 4.01-7.02 4.01-3.61 6.42-4.82 5.42-1.81 8.63-1.81Zm0 36.73c1.81 0 3.61-.4 5.02-1s2.61-1.81 3.61-3.01 1.81-2.81 2.21-4.41c.4-1.81.8-3.61.8-5.62 0-2.21-.2-4.21-.8-6.02s-1.2-3.21-2.21-4.62c-1-1.2-2.21-2.21-3.61-3.01s-3.21-1-5.02-1-3.61.4-5.02 1c-1.4.8-2.61 1.81-3.61 3.01s-1.81 2.81-2.21 4.62c-.4 1.81-.8 3.61-.8 5.62 0 2.41.2 4.21.8 6.02.4 1.81 1.2 3.21 2.21 4.41s2.21 2.21 3.61 3.01c1.4.8 3.21 1 5.02 1Zm36.32 7.96-12.24-44.15h9.83l8.43 32.77h.4l8.23-32.77h9.83L200.3 58.04h-12.24Zm74.14-7.96c2.18 0 3.51-.6 3.51-.6 1.2-.6 2.01-1 2.81-1.81s1.4-1.81 1.81-2.81a13 13 0 0 0 .8-4.01V13.9h8.63v28.15c0 2.41-.4 4.62-1.4 6.62-.8 2.01-2.21 3.61-3.61 5.02s-3.41 2.41-5.62 3.21-4.62 1.2-7.02 1.2-5.02-.4-7.02-1.2c-2.21-.8-4.01-1.81-5.62-3.21s-2.81-3.01-3.61-5.02-1.4-4.21-1.4-6.62V13.9h8.63v26.95c0 1.61.2 3.01.8 4.01.4 1.2 1.2 2.21 2.01 2.81.8.8 1.81 1.4 2.81 1.81 0 0 1.34.6 3.51.6Zm34.22-36.18v18.92l15.65-18.92h10.82l-15.03 17.32 16.03 26.83h-10.21l-11.44-20.21-5.62 6.22v13.99h-8.83V13.9" })] }));
|
|
854
932
|
const Header = (props) => {
|
|
855
|
-
const { className, containerClassName = "govuk-width-container", homepageUrlHref = "/", homepageUrlTo, navigation, navigationClassName, productName, serviceName, serviceUrlHref, serviceUrlTo, navigationLabel = "Menu", menuButtonLabel = "Show or hide menu", removeGovUKHeader = null,
|
|
933
|
+
const { className, containerClassName = "govuk-width-container", homepageUrlHref = "/", homepageUrlTo, navigation, navigationClassName, productName, serviceName, serviceUrlHref, serviceUrlTo, navigationLabel = "Menu", menuButtonLabel = "Show or hide menu", removeGovUKHeader = null, ...attributes } = props;
|
|
856
934
|
let productNameComponent = null;
|
|
857
935
|
let navigationComponent = null;
|
|
858
936
|
if (productName) {
|
|
859
937
|
productNameComponent = (jsx("span", { className: "govuk-header__product-name", children: productName }));
|
|
860
938
|
}
|
|
861
939
|
if (serviceName || navigation) {
|
|
862
|
-
navigationComponent = (jsxs("div", { className: "govuk-header__content", children: [serviceName ? (jsx(LinkWithRef, { href: serviceUrlHref, to: serviceUrlTo, className: "govuk-header__link govuk-header__link--service-name", children: serviceName })) : null, navigation ? (
|
|
863
|
-
|
|
864
|
-
|
|
865
|
-
|
|
866
|
-
|
|
867
|
-
|
|
868
|
-
}
|
|
869
|
-
return (jsx("header", { className: `govuk-header ${className || ""}`, role: "banner", "data-module": "govuk-header", ...attributes, children: jsxs("div", { className: `govuk-header__container ${containerClassName}`, children: [jsx("div", { className: "govuk-header__logo", children: jsxs(LinkWithRef, { to: homepageUrlTo, href: homepageUrlHref, className: "govuk-header__link govuk-header__link--homepage", children: [!removeGovUKHeader && (jsx("span", { className: "govuk-header__logotype", dangerouslySetInnerHTML: {
|
|
870
|
-
__html: `
|
|
871
|
-
<!--[if gt IE 8]><!-->
|
|
872
|
-
<svg
|
|
873
|
-
aria-hidden="true"
|
|
874
|
-
focusable="false"
|
|
875
|
-
class="govuk-header__logotype-crown"
|
|
876
|
-
xmlns="http://www.w3.org/2000/svg"
|
|
877
|
-
viewBox="0 0 132 97"
|
|
878
|
-
height="30"
|
|
879
|
-
width="36"
|
|
880
|
-
>
|
|
881
|
-
<path
|
|
882
|
-
fill="currentColor"
|
|
883
|
-
fillRule="evenodd"
|
|
884
|
-
d="M25 30.2c3.5 1.5 7.7-.2 9.1-3.7 1.5-3.6-.2-7.8-3.9-9.2-3.6-1.4-7.6.3-9.1 3.9-1.4 3.5.3 7.5 3.9 9zM9 39.5c3.6 1.5 7.8-.2 9.2-3.7 1.5-3.6-.2-7.8-3.9-9.1-3.6-1.5-7.6.2-9.1 3.8-1.4 3.5.3 7.5 3.8 9zM4.4 57.2c3.5 1.5 7.7-.2 9.1-3.8 1.5-3.6-.2-7.7-3.9-9.1-3.5-1.5-7.6.3-9.1 3.8-1.4 3.5.3 7.6 3.9 9.1zm38.3-21.4c3.5 1.5 7.7-.2 9.1-3.8 1.5-3.6-.2-7.7-3.9-9.1-3.6-1.5-7.6.3-9.1 3.8-1.3 3.6.4 7.7 3.9 9.1zm64.4-5.6c-3.6 1.5-7.8-.2-9.1-3.7-1.5-3.6.2-7.8 3.8-9.2 3.6-1.4 7.7.3 9.2 3.9 1.3 3.5-.4 7.5-3.9 9zm15.9 9.3c-3.6 1.5-7.7-.2-9.1-3.7-1.5-3.6.2-7.8 3.7-9.1 3.6-1.5 7.7.2 9.2 3.8 1.5 3.5-.3 7.5-3.8 9zm4.7 17.7c-3.6 1.5-7.8-.2-9.2-3.8-1.5-3.6.2-7.7 3.9-9.1 3.6-1.5 7.7.3 9.2 3.8 1.3 3.5-.4 7.6-3.9 9.1zM89.3 35.8c-3.6 1.5-7.8-.2-9.2-3.8-1.4-3.6.2-7.7 3.9-9.1 3.6-1.5 7.7.3 9.2 3.8 1.4 3.6-.3 7.7-3.9 9.1zM69.7 17.7l8.9 4.7V9.3l-8.9 2.8c-.2-.3-.5-.6-.9-.9L72.4 0H59.6l3.5 11.2c-.3.3-.6.5-.9.9l-8.8-2.8v13.1l8.8-4.7c.3.3.6.7.9.9l-5 15.4v.1c-.2.8-.4 1.6-.4 2.4 0 4.1 3.1 7.5 7 8.1h.2c.3 0 .7.1 1 .1.4 0 .7 0 1-.1h.2c4-.6 7.1-4.1 7.1-8.1 0-.8-.1-1.7-.4-2.4V34l-5.1-15.4c.4-.2.7-.6 1-.9zM66 92.8c16.9 0 32.8 1.1 47.1 3.2 4-16.9 8.9-26.7 14-33.5l-9.6-3.4c1 4.9 1.1 7.2 0 10.2-1.5-1.4-3-4.3-4.2-8.7L108.6 76c2.8-2 5-3.2 7.5-3.3-4.4 9.4-10 11.9-13.6 11.2-4.3-.8-6.3-4.6-5.6-7.9 1-4.7 5.7-5.9 8-.5 4.3-8.7-3-11.4-7.6-8.8 7.1-7.2 7.9-13.5 2.1-21.1-8 6.1-8.1 12.3-4.5 20.8-4.7-5.4-12.1-2.5-9.5 6.2 3.4-5.2 7.9-2 7.2 3.1-.6 4.3-6.4 7.8-13.5 7.2-10.3-.9-10.9-8-11.2-13.8 2.5-.5 7.1 1.8 11 7.3L80.2 60c-4.1 4.4-8 5.3-12.3 5.4 1.4-4.4 8-11.6 8-11.6H55.5s6.4 7.2 7.9 11.6c-4.2-.1-8-1-12.3-5.4l1.4 16.4c3.9-5.5 8.5-7.7 10.9-7.3-.3 5.8-.9 12.8-11.1 13.8-7.2.6-12.9-2.9-13.5-7.2-.7-5 3.8-8.3 7.1-3.1 2.7-8.7-4.6-11.6-9.4-6.2 3.7-8.5 3.6-14.7-4.6-20.8-5.8 7.6-5 13.9 2.2 21.1-4.7-2.6-11.9.1-7.7 8.8 2.3-5.5 7.1-4.2 8.1.5.7 3.3-1.3 7.1-5.7 7.9-3.5.7-9-1.8-13.5-11.2 2.5.1 4.7 1.3 7.5 3.3l-4.7-15.4c-1.2 4.4-2.7 7.2-4.3 8.7-1.1-3-.9-5.3 0-10.2l-9.5 3.4c5 6.9 9.9 16.7 14 33.5 14.8-2.1 30.8-3.2 47.7-3.2z"
|
|
885
|
-
/>
|
|
886
|
-
</svg>
|
|
887
|
-
<!--<![endif]-->
|
|
888
|
-
<!--[if IE 8]>
|
|
889
|
-
<img src="${logo}" class="govuk-header__logotype-crown-fallback-image" width="36" height="32" />
|
|
890
|
-
<![endif]-->
|
|
891
|
-
<span class="govuk-header__logotype-text">GOV.UK</span>
|
|
892
|
-
`,
|
|
893
|
-
} })), productNameComponent] }) }), navigationComponent] }) }));
|
|
940
|
+
navigationComponent = (jsxs("div", { className: "govuk-header__content", children: [serviceName ? (jsx(LinkWithRef, { href: serviceUrlHref, to: serviceUrlTo, className: "govuk-header__link govuk-header__link--service-name", children: serviceName })) : null, navigation ? (jsxs("nav", { className: `govuk-header__navigation ${navigationClassName || ""}`, "aria-label": navigationLabel, children: [jsx("button", { type: "button", className: "govuk-header__menu-button govuk-js-header-toggle", "aria-controls": "navigation", "aria-label": menuButtonLabel, children: "Menu" }), jsx("ul", { id: "navigation", className: "govuk-header__navigation-list", children: navigation.map((item, index) => {
|
|
941
|
+
const { active: itemActive, className: itemClassName, children: itemChildren, reactListKey, ...itemAttributes } = item;
|
|
942
|
+
return itemChildren ? (jsx("li", { className: `govuk-header__navigation-item${itemActive ? " govuk-header__navigation-item--active" : ""}`, children: item.href || item.to ? (jsx(LinkWithRef, { className: `govuk-header__link ${itemClassName || ""}`, ...itemAttributes, children: itemChildren })) : (itemChildren) }, reactListKey || index)) : null;
|
|
943
|
+
}) })] })) : null] }));
|
|
944
|
+
}
|
|
945
|
+
return (jsx("header", { className: `govuk-header ${className || ""}`, role: "banner", "data-module": "govuk-header", ...attributes, children: jsxs("div", { className: `govuk-header__container ${containerClassName}`, children: [jsx("div", { className: "govuk-header__logo", children: jsxs(LinkWithRef, { to: homepageUrlTo, href: homepageUrlHref, className: "govuk-header__homepage-link", children: [!removeGovUKHeader && jsx(GovUKLogotype, {}), productNameComponent] }) }), navigationComponent] }) }));
|
|
894
946
|
};
|
|
895
947
|
|
|
896
948
|
function ConfigureOverallHeader($scope) {
|
|
@@ -935,6 +987,17 @@ const NotificationBanner = (props) => {
|
|
|
935
987
|
return (jsxs("div", { className: `govuk-notification-banner ${typeClass} ${className || ""}`, role: roleAttribute, "aria-labelledby": titleId, "data-module": "govuk-notification-banner", ...(disableAutoFocus ? { "data-disable-auto-focus": "true" } : {}), ...attributes, children: [jsx("div", { className: "govuk-notification-banner__header", children: jsx(HeadingLevel, { className: "govuk-notification-banner__title", id: titleId, children: title }) }), jsx("div", { className: "govuk-notification-banner__content", children: typeof children === "string" ? (jsx("p", { className: "govuk-notification-banner__heading", children: children })) : (children) })] }));
|
|
936
988
|
};
|
|
937
989
|
|
|
990
|
+
const SvgIcon = ({ type, ...props }) => (jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: 15, height: 13, "aria-hidden": "true", ...props, children: jsx("path", { d: type === "next"
|
|
991
|
+
? "M8.107-.008L6.693 1.406 10.986 5.7H-2v2h12.896L6.71 11.676l1.378 1.449 6.744-6.406L8.107-.008z"
|
|
992
|
+
: "M6.594-.008-.133 6.72l6.744 6.406 1.377-1.449-4.185-3.977h12.896v-2H3.715l4.293-4.293L6.594-.008z" }) }));
|
|
993
|
+
|
|
994
|
+
const NavigationButton = ({ href, type, children, labelText, }) => {
|
|
995
|
+
const defaultText = type === "next" ? "Next" : "Previous";
|
|
996
|
+
const typeClass = type === "next" ? "next" : "prev";
|
|
997
|
+
const icon = (jsx(SvgIcon, { type: type, className: `govuk-pagination__icon govuk-pagination__icon--${typeClass}`, focusable: "false", "aria-hidden": "true" }));
|
|
998
|
+
return (jsxs("a", { className: "govuk-link govuk-pagination__link", href: href, rel: type, children: [type === "previous" && icon, jsxs("span", { className: "govuk-pagination__link-title", children: [children ?? defaultText, jsx("span", { className: "govuk-visually-hidden", children: " page" })] }), type === "next" && icon, labelText && (jsxs(Fragment, { children: [jsx("span", { className: "govuk-visually-hidden", children: ":" }), jsx("span", { className: "govuk-pagination__link-label", children: labelText })] }))] }));
|
|
999
|
+
};
|
|
1000
|
+
|
|
938
1001
|
const DOTS = "...";
|
|
939
1002
|
const UsePagination = ({ totalCount, pageSize, siblingCount = 1, currentPage, }) => {
|
|
940
1003
|
const range = (start, end) => {
|
|
@@ -970,29 +1033,13 @@ const UsePagination = ({ totalCount, pageSize, siblingCount = 1, currentPage, })
|
|
|
970
1033
|
return paginationRange;
|
|
971
1034
|
};
|
|
972
1035
|
|
|
973
|
-
const
|
|
974
|
-
|
|
975
|
-
: "M6.594-.008-.133 6.72l6.744 6.406 1.377-1.449-4.185-3.977h12.896v-2H3.715l4.293-4.293L6.594-.008z" }) }));
|
|
976
|
-
|
|
977
|
-
const NavigationButton = ({ isDisabled, onClick, children, name, type, }) => {
|
|
978
|
-
const typeClass = type === "next" ? type : "prev";
|
|
979
|
-
const Icon = (jsx(SvgIcon, { type: type, className: `govuk-pagination__icon govuk-pagination__icon--${typeClass}`, focusable: "false" }));
|
|
980
|
-
return isDisabled ? (jsxs("div", { rel: type, children: [type === "previous" && Icon, jsx("span", { className: "govuk-pagination__link-title", children: name }), type === "next" && Icon, children && (jsxs(Fragment, { children: [type === "previous" && jsx(Fragment, { children: "\u00A0" }), jsx("span", { className: "govuk-visually-hidden", children: ":" }), children, type === "next" && jsx(Fragment, { children: " \u00A0" })] }))] })) : (jsxs("a", { className: "govuk-link govuk-pagination__link", href: "#", rel: type, onClick: onClick, children: [type === "previous" && Icon, jsx("span", { className: "govuk-pagination__link-title", children: name }), type === "next" && Icon, children && (jsxs(Fragment, { children: [type === "previous" && jsx(Fragment, { children: "\u00A0\u00A0" }), jsx("span", { className: "govuk-visually-hidden", children: ":" }), children, type === "next" && jsx(Fragment, { children: "\u00A0\u00A0" })] }))] }));
|
|
981
|
-
};
|
|
982
|
-
|
|
983
|
-
const Pagination = ({ onPageChange, totalCount, siblingCount = 1, currentPage, pageSize, className, previousName = "Previous", nextName = "Next", previousChildren, nextChildren, }) => {
|
|
984
|
-
const paginationRange = UsePagination({
|
|
985
|
-
currentPage,
|
|
986
|
-
totalCount,
|
|
987
|
-
siblingCount,
|
|
988
|
-
pageSize,
|
|
989
|
-
});
|
|
990
|
-
if (!paginationRange || paginationRange.length < 2)
|
|
1036
|
+
const Pagination = ({ previous, next, items, className, }) => {
|
|
1037
|
+
if (!previous && !next && (!items || items.length === 0))
|
|
991
1038
|
return null;
|
|
992
|
-
|
|
993
|
-
|
|
994
|
-
const
|
|
995
|
-
return (jsxs(
|
|
1039
|
+
// Block layout is used when there are no numbered page items — govuk renders
|
|
1040
|
+
// the nav with an extra class and the link title with --decorated modifier.
|
|
1041
|
+
const isBlockLayout = !items || items.length === 0;
|
|
1042
|
+
return (jsxs("nav", { className: `govuk-pagination${isBlockLayout ? " govuk-pagination--block" : ""}${className ? ` ${className}` : ""}`, role: "navigation", "aria-label": "Pagination", children: [previous && (jsx("div", { className: "govuk-pagination__prev", children: jsx(NavigationButton, { type: "previous", ...previous }) })), items && items.length > 0 && (jsx("ul", { className: "govuk-pagination__list", children: items.map((item, index) => item.ellipsis ? (jsx("li", { className: "govuk-pagination__item govuk-pagination__item--ellipses", children: DOTS }, index)) : (jsx("li", { className: `govuk-pagination__item${item.current ? " govuk-pagination__item--current" : ""}`, children: jsx("a", { className: "govuk-link govuk-pagination__link", href: item.href ?? "#", "aria-label": `Page ${item.number}`, ...(item.current ? { "aria-current": "page" } : {}), children: item.number }) }, index))) })), next && (jsx("div", { className: "govuk-pagination__next", children: jsx(NavigationButton, { type: "next", ...next }) }))] }));
|
|
996
1043
|
};
|
|
997
1044
|
|
|
998
1045
|
const Panel = (props) => {
|
|
@@ -1001,6 +1048,49 @@ const Panel = (props) => {
|
|
|
1001
1048
|
return (jsxs("div", { className: `govuk-panel govuk-panel--confirmation ${className || ""}`, ...attributes, children: [jsx(HeadingLevel, { className: "govuk-panel__title", children: titleChildren }), innerHtml] }));
|
|
1002
1049
|
};
|
|
1003
1050
|
|
|
1051
|
+
const PasswordInput = React__default.forwardRef((props, ref) => {
|
|
1052
|
+
const { className, "aria-describedby": describedBy, errorMessage, formGroup, hint, label, name, id, autoComplete = "current-password", showPasswordText = "Show", hidePasswordText = "Hide", showPasswordAriaLabelText = "Show password", hidePasswordAriaLabelText = "Hide password", passwordShownAnnouncementText, passwordHiddenAnnouncementText, ...attributes } = props;
|
|
1053
|
+
let describedByValue = describedBy || "";
|
|
1054
|
+
let hintComponent = null;
|
|
1055
|
+
let errorMessageComponent = null;
|
|
1056
|
+
if (hint) {
|
|
1057
|
+
const hintId = `${id}-hint`;
|
|
1058
|
+
describedByValue += ` ${hintId}`;
|
|
1059
|
+
hintComponent = jsx(Hint, { ...hint, id: hintId });
|
|
1060
|
+
}
|
|
1061
|
+
if (errorMessage) {
|
|
1062
|
+
const errorId = id ? `${id}-error` : "";
|
|
1063
|
+
describedByValue += ` ${errorId}`;
|
|
1064
|
+
errorMessageComponent = jsx(ErrorMessage, { ...errorMessage, id: errorId });
|
|
1065
|
+
}
|
|
1066
|
+
// Build i18n data attributes for the govuk-frontend JS module
|
|
1067
|
+
const i18nProps = {};
|
|
1068
|
+
if (showPasswordText)
|
|
1069
|
+
i18nProps["data-i18n.show-password"] = showPasswordText;
|
|
1070
|
+
if (hidePasswordText)
|
|
1071
|
+
i18nProps["data-i18n.hide-password"] = hidePasswordText;
|
|
1072
|
+
if (showPasswordAriaLabelText)
|
|
1073
|
+
i18nProps["data-i18n.show-password-aria-label"] =
|
|
1074
|
+
showPasswordAriaLabelText;
|
|
1075
|
+
if (hidePasswordAriaLabelText)
|
|
1076
|
+
i18nProps["data-i18n.hide-password-aria-label"] =
|
|
1077
|
+
hidePasswordAriaLabelText;
|
|
1078
|
+
if (passwordShownAnnouncementText)
|
|
1079
|
+
i18nProps["data-i18n.password-shown-announcement"] =
|
|
1080
|
+
passwordShownAnnouncementText;
|
|
1081
|
+
if (passwordHiddenAnnouncementText)
|
|
1082
|
+
i18nProps["data-i18n.password-hidden-announcement"] =
|
|
1083
|
+
passwordHiddenAnnouncementText;
|
|
1084
|
+
// Label handles isPageHeading internally — no extra wrapper needed here
|
|
1085
|
+
const labelEl = jsx(Label, { ...label, htmlFor: id });
|
|
1086
|
+
return (jsxs("div", { className: `govuk-form-group${formGroup?.className ? ` ${formGroup.className}` : ""}${errorMessage ? " govuk-form-group--error" : ""} govuk-password-input`, "data-module": "govuk-password-input", ...i18nProps, children: [labelEl, hintComponent, errorMessageComponent, jsxs("div", { className: "govuk-input__wrapper govuk-password-input__wrapper", children: [jsx("input", { ref: ref, id: id, className: `govuk-input govuk-password-input__input govuk-js-password-input-input${className ? ` ${className}` : ""}${errorMessage ? " govuk-input--error" : ""}`, name: name || id, type: "password", spellCheck: false, autoComplete: autoComplete, autoCapitalize: "none", "aria-describedby": describedByValue.trim() || undefined, ...attributes }), jsx("button", { type: "button", className: "govuk-button govuk-button--secondary govuk-password-input__toggle govuk-js-password-input-toggle", "data-module": "govuk-button", "aria-controls": id, "aria-label": showPasswordAriaLabelText, hidden: true, children: showPasswordText })] })] }));
|
|
1087
|
+
});
|
|
1088
|
+
PasswordInput.displayName = "PasswordInput";
|
|
1089
|
+
|
|
1090
|
+
function ConfigureOverallPasswordInput($scope) {
|
|
1091
|
+
createAll(PasswordInput$1, {}, $scope);
|
|
1092
|
+
}
|
|
1093
|
+
|
|
1004
1094
|
function Slugify(str) {
|
|
1005
1095
|
str = str.replace(/^\s+|\s+$/g, ""); // trim leading/trailing white space
|
|
1006
1096
|
str = str.toLowerCase(); // convert string to lowercase
|
|
@@ -1168,7 +1258,7 @@ const PDFViewer = (props) => {
|
|
|
1168
1258
|
// 1) Let ResolvePDFSource handle base64/data/blob inputs synchronously.
|
|
1169
1259
|
try {
|
|
1170
1260
|
const resolved = ResolvePDFSource(src);
|
|
1171
|
-
if (resolved
|
|
1261
|
+
if (resolved?.source) {
|
|
1172
1262
|
sourceToUse = resolved.source;
|
|
1173
1263
|
if (resolved.isBase64Source) {
|
|
1174
1264
|
// ResolvePDFSource created an object URL for us (data/blob/base64)
|
|
@@ -1195,11 +1285,7 @@ const PDFViewer = (props) => {
|
|
|
1195
1285
|
signal: controller.signal,
|
|
1196
1286
|
credentials: "omit",
|
|
1197
1287
|
});
|
|
1198
|
-
if (
|
|
1199
|
-
console.warn(`PDFViewer: fetch returned ${resp.status} ${resp.statusText} for ${src}`);
|
|
1200
|
-
// fallback: keep using original src
|
|
1201
|
-
}
|
|
1202
|
-
else {
|
|
1288
|
+
if (resp.ok) {
|
|
1203
1289
|
const blob = await resp.blob();
|
|
1204
1290
|
if (blob && blob.size > 0) {
|
|
1205
1291
|
const obj = URL.createObjectURL(blob);
|
|
@@ -1211,9 +1297,13 @@ const PDFViewer = (props) => {
|
|
|
1211
1297
|
console.warn("PDFViewer: fetched blob is empty - falling back to original src");
|
|
1212
1298
|
}
|
|
1213
1299
|
}
|
|
1300
|
+
else {
|
|
1301
|
+
console.warn(`PDFViewer: fetch returned ${resp.status} ${resp.statusText} for ${src}`);
|
|
1302
|
+
// fallback: keep using original src
|
|
1303
|
+
}
|
|
1214
1304
|
}
|
|
1215
1305
|
catch (err) {
|
|
1216
|
-
if (err
|
|
1306
|
+
if (err instanceof Error && err.name === "AbortError") {
|
|
1217
1307
|
// aborted, nothing to do
|
|
1218
1308
|
if (!mounted)
|
|
1219
1309
|
return;
|
|
@@ -1526,5 +1616,5 @@ const WarningText = ({ children = "Warning message", className, ...attributes })
|
|
|
1526
1616
|
return (jsxs("div", { className: `govuk-warning-text ${className || ""}`, ...attributes, children: [jsx("span", { className: "govuk-warning-text__icon", "aria-hidden": "true", children: "!" }), jsxs("strong", { className: "govuk-warning-text__text", children: [jsx("span", { className: "govuk-visually-hidden", children: "Warning" }), children] })] }));
|
|
1527
1617
|
};
|
|
1528
1618
|
|
|
1529
|
-
export { Accordion, ActionLink, BackLink, Boolean$1 as Boolean, Breadcrumbs, Button, CardColumn, CardLayout, CharacterCount, Checkboxes as Checkbox, ConfigureOverallAccordion, ConfigureOverallButton, ConfigureOverallCheckboxes, ConfigureOverallErrorSummary, ConfigureOverallHeader, ConfigureOverallRadios, ConfigureOverallSkipLink, ConfigureOverallTabs, CookieBanner, DataNavigation, DateInput, Details, DifferenceNavigation, ErrorBoundary, ErrorMessage, ErrorSummary, ExtractAccordionConfigFromAttributes, Fieldset, FileUpload, Footer, Header, Hint, Input, InsetText, Label, Landing, LinkWithRef, Loading, Main, NotFoundPage, NotificationBanner, PDFViewer, PDFViewerBackend, Pagination, Panel, PhaseBanner, ProblemWithService, Radios, Select, ServiceNavigation, SkipLink, SummaryList, Table, Tabs, Tag, TaskList, Textarea, WarningInfo, WarningText };
|
|
1619
|
+
export { Accordion, ActionLink, BackLink, Boolean$1 as Boolean, Breadcrumbs, Button, CardColumn, CardLayout, CharacterCount, Checkboxes as Checkbox, ConfigureOverallAccordion, ConfigureOverallButton, ConfigureOverallCheckboxes, ConfigureOverallErrorSummary, ConfigureOverallExitThisPage, ConfigureOverallHeader, ConfigureOverallPasswordInput, ConfigureOverallRadios, ConfigureOverallSkipLink, ConfigureOverallTabs, CookieBanner, DOTS, DataNavigation, DateInput, Details, DifferenceNavigation, ErrorBoundary, ErrorMessage, ErrorSummary, ExitThisPage, ExtractAccordionConfigFromAttributes, Fieldset, FileUpload, Footer, Header, Hint, Input, InsetText, Label, Landing, LinkWithRef, Loading, Main, NotFoundPage, NotificationBanner, PDFViewer, PDFViewerBackend, Pagination, Panel, PasswordInput, PhaseBanner, ProblemWithService, Radios, Select, ServiceNavigation, SkipLink, SummaryList, Table, Tabs, Tag, TaskList, Textarea, UsePagination, WarningInfo, WarningText };
|
|
1530
1620
|
//# sourceMappingURL=index.esm.js.map
|