@govuk-one-login/frontend-ui 1.4.3 → 2.0.0

package/build/esm/frontend/index.js

@@ -1,249 +1,312 @@
-const WaitInteractions = (() => {
-    var _a;
-    const content = {
-        initial: {
-            spinnerState: "pending",
-        },
-        complete: { spinnerState: "completed" },
-    };
-    const state = {
-        spinnerState: (_a = content === null || content === void 0 ? void 0 : content.initial) === null || _a === void 0 ? void 0 : _a.spinnerState,
-        done: false,
-        virtualDom: [],
-        abortController: null,
-    };
-    const timers = {};
-    let { container, ariaLiveContainer, domRequirementsMet, initTime, abortController, config, } = {
-        };
-    const handleAbort = () => {
-        abortController === null || abortController === void 0 ? void 0 : abortController.abort();
-    };
-    const initialiseAbortController = () => {
-        abortController = new AbortController();
-        window.removeEventListener("beforeunload", handleAbort);
-        window.addEventListener("beforeunload", handleAbort);
-    };
-    const updateAccordingToTimeElapsed = () => {
-        const now = Date.now();
-        const elapsedMilliseconds = now - initTime;
-        if (elapsedMilliseconds >= config.msBeforeAbort) {
-            reflectError();
+function useSpinner() {
+    const element = document.getElementById("spinner-container");
+    if (element) {
+        const spinner = new Spinner(element);
+        spinner.init();
+    }
+    else {
+        console.warn("Attempting to initiate a spinner on a page with no '#spinner-container' element.");
+    }
+}
+class Spinner {
+    reflectLongWait() {
+        if (this.state.spinnerState !== "ready") {
+            this.state.spinnerStateText = this.content.longWait.spinnerStateText;
+        }
+    }
+    initialiseState() {
+        if (this.domRequirementsMet) {
+            this.state = {
+                heading: this.content.initial.heading,
+                spinnerStateText: this.content.initial.spinnerStateText,
+                spinnerState: this.content.initial.spinnerState,
+                buttonDisabled: true,
+                ariaButtonEnabledMessage: "",
+                done: false,
+                error: false,
+                virtualDom: [],
+            };
+        }
+    }
+    initialiseContent(element) {
+        var _a;
+        function throwIfMissing(data) {
+            if (data === undefined || data === null) {
+                throw new Error("Missing required data");
+            }
+            return data;
+        }
+        try {
+            this.content = {
+                initial: {
+                    heading: throwIfMissing(element.dataset.initialHeading),
+                    spinnerStateText: throwIfMissing(element.dataset.initialSpinnerstatetext),
+                    spinnerState: throwIfMissing(element.dataset.initialSpinnerstate),
+                },
+                error: {
+                    heading: throwIfMissing(element.dataset.errorHeading),
+                    messageText: throwIfMissing(element.dataset.errorMessagetext),
+                    whatYouCanDo: {
+                        heading: throwIfMissing(element.dataset.errorWhatyoucandoHeading),
+                        message: {
+                            text1: throwIfMissing(element.dataset.errorWhatyoucandoMessageText1),
+                            link: {
+                                href: throwIfMissing(element.dataset.errorWhatyoucandoMessageLinkHref),
+                                text: throwIfMissing(element.dataset.errorWhatyoucandoMessageLinkText),
+                            },
+                            text2: throwIfMissing(element.dataset.errorWhatyoucandoMessageText2),
+                        },
+                    },
+                },
+                complete: {
+                    spinnerState: throwIfMissing(element.dataset.completeSpinnerstate),
+                },
+                longWait: {
+                    spinnerStateText: throwIfMissing(element.dataset.longwaitSpinnerstatetext),
+                },
+                continueButton: {
+                    text: (_a = element.dataset.continuebuttonText) !== null && _a !== void 0 ? _a : "Continue",
+                },
+            };
+            this.config = {
+                apiUrl: element.dataset.apiUrl || this.config.apiUrl,
+                ariaButtonEnabledMessage: throwIfMissing(element.dataset.ariaButtonEnabledMessage),
+                msBeforeInformingOfLongWait: element.dataset.msBeforeInformingOfLongWait
+                    ? parseInt(element.dataset.msBeforeInformingOfLongWait)
+                    : this.config.msBeforeInformingOfLongWait,
+                msBeforeAbort: element.dataset.msBeforeAbort
+                    ? parseInt(element.dataset.msBeforeAbort)
+                    : this.config.msBeforeAbort,
+                msBetweenRequests: element.dataset.msBetweenRequests
+                    ? parseInt(element.dataset.msBetweenRequests)
+                    : this.config.msBetweenRequests,
+                msBetweenDomUpdate: element.dataset.msBetweenDomUpdate
+                    ? parseInt(element.dataset.msBetweenDomUpdate)
+                    : this.config.msBetweenDomUpdate,
+            };
+            this.domRequirementsMet = true;
         }
-        else if ((elapsedMilliseconds >=
-            config.msBeforeInformingOfLongWait)) {
-            reflectLongWait();
+        catch (e) {
+            this.domRequirementsMet = false;
         }
-    };
-    const createVirtualDom = () => {
-        var _a, _b, _c, _d, _e, _f;
-        const initialState = [
+    }
+    createVirtualDom() {
+        const domInitialState = [
             {
                 nodeName: "h1",
-                text: state.heading,
+                text: this.state.heading,
                 classes: ["govuk-heading-l"],
             },
             {
                 nodeName: "div",
                 id: "spinner",
-                classes: ["spinner", "spinner__pending", "centre", state.spinnerState],
+                classes: [
+                    "spinner",
+                    "spinner__pending",
+                    "centre",
+                    this.state.spinnerState,
+                ],
             },
             {
                 nodeName: "p",
-                text: state.spinnerStateText,
+                text: this.state.spinnerStateText,
                 classes: ["centre", "spinner-state-text", "govuk-body"],
             },
             {
                 nodeName: "button",
-                text: (_a = content === null || content === void 0 ? void 0 : content.continueButton) === null || _a === void 0 ? void 0 : _a.text,
-                buttonDisabled: state.buttonDisabled,
+                text: this.content.continueButton.text,
+                buttonDisabled: this.state.buttonDisabled,
                 classes: ["govuk-button", "govuk-!-margin-top-4"],
             },
         ];
         const domErrorState = [
             {
                 nodeName: "h1",
-                text: state.heading,
+                text: this.state.heading,
                 classes: ["govuk-heading-l"],
             },
             {
                 nodeName: "p",
-                text: state.messageText,
+                text: this.state.messageText,
                 classes: ["govuk-body"],
             },
             {
                 nodeName: "h2",
-                text: (_b = content === null || content === void 0 ? void 0 : content.error) === null || _b === void 0 ? void 0 : _b.whatYouCanDo.heading,
+                text: this.content.error.whatYouCanDo.heading,
                 classes: ["govuk-heading-m"],
             },
             {
                 nodeName: "p",
-                innerHTML: `${(_c = content === null || content === void 0 ? void 0 : content.error) === null || _c === void 0 ? void 0 : _c.whatYouCanDo.message.text1}<a href="${(_d = content === null || content === void 0 ? void 0 : content.error) === null || _d === void 0 ? void 0 : _d.whatYouCanDo.message.link.href}">${(_e = content === null || content === void 0 ? void 0 : content.error) === null || _e === void 0 ? void 0 : _e.whatYouCanDo.message.link.text}</a>${(_f = content === null || content === void 0 ? void 0 : content.error) === null || _f === void 0 ? void 0 : _f.whatYouCanDo.message.text2}`,
+                innerHTML: `${this.content.error.whatYouCanDo.message.text1}<a href="${this.content.error.whatYouCanDo.message.link.href}">${this.content.error.whatYouCanDo.message.link.text}</a>${this.content.error.whatYouCanDo.message.text2}`,
                 classes: ["govuk-body"],
             },
         ];
-        return state.error ? domErrorState : initialState;
-    };
-    const vDomHasChanged = (currentVDom, nextVDom) => {
-        return JSON.stringify(currentVDom) !== JSON.stringify(nextVDom);
-    };
-    const updateDom = () => {
-        var _a;
-        const vDomChanged = vDomHasChanged(state.virtualDom, createVirtualDom());
-        const container = document.getElementById("spinner-container");
-        if (vDomChanged) {
-            document.title = state.heading;
-            state.virtualDom = createVirtualDom();
-            const elements = (_a = state === null || state === void 0 ? void 0 : state.virtualDom) === null || _a === void 0 ? void 0 : _a.map(convert);
-            container === null || container === void 0 ? void 0 : container.replaceChildren(...elements);
-        }
-        if (state.error) {
-            container === null || container === void 0 ? void 0 : container.classList.add("spinner-container__error");
-        }
-        if (state.done) {
-            clearInterval(timers.updateDomTimer);
-        }
-        if (state.ariaButtonEnabledMessage !== "") {
-            updateAriaAlert(config === null || config === void 0 ? void 0 : config.ariaButtonEnabledMessage);
-        }
-    };
-    const reflectCompletion = () => {
-        var _a, _b;
-        state.spinnerState = "spinner__ready";
-        state.spinnerStateText = (_a = content === null || content === void 0 ? void 0 : content.complete) === null || _a === void 0 ? void 0 : _a.spinnerState;
-        state.buttonDisabled = false;
-        state.ariaButtonEnabledMessage =
-            (_b = content === null || content === void 0 ? void 0 : content.complete) === null || _b === void 0 ? void 0 : _b.ariaButtonEnabledMessage;
-        state.done = true;
-        sessionStorage.removeItem("spinnerInitTime");
-    };
-    const reflectError = () => {
-        var _a, _b, _c;
-        state.heading = (_a = content === null || content === void 0 ? void 0 : content.error) === null || _a === void 0 ? void 0 : _a.heading;
-        state.messageText = (_b = content === null || content === void 0 ? void 0 : content.error) === null || _b === void 0 ? void 0 : _b.messageText;
-        state.spinnerState = "spinner__failed";
-        state.done = true;
-        state.error = true;
-        sessionStorage.removeItem("spinnerInitTime");
-        (_c = state === null || state === void 0 ? void 0 : state.abortController) === null || _c === void 0 ? void 0 : _c.abort();
-    };
-    const reflectLongWait = () => {
-        var _a;
-        if (state.spinnerState !== "ready") {
-            state.spinnerStateText = (_a = content === null || content === void 0 ? void 0 : content.longWait) === null || _a === void 0 ? void 0 : _a.spinnerStateText;
-        }
-    };
-    const convert = (node) => {
-        const el = document.createElement(node.nodeName);
-        if (node.text)
-            el.textContent = node.text;
-        if (node.innerHTML)
-            el.innerHTML = node.innerHTML;
-        if (node.id)
-            el.id = node.id;
-        if (node.classes)
-            el.classList.add(...node.classes);
-        if (node.buttonDisabled)
-            el.setAttribute("disabled", node.buttonDisabled);
-        return el;
-    };
-    const updateAriaAlert = (messageText) => {
-        while (ariaLiveContainer === null || ariaLiveContainer === void 0 ? void 0 : ariaLiveContainer.firstChild) {
-            ariaLiveContainer.removeChild(ariaLiveContainer.firstChild);
-        }
-        /* Create new message and append it to the live region */
-        const messageNode = document.createTextNode(messageText);
-        ariaLiveContainer === null || ariaLiveContainer === void 0 ? void 0 : ariaLiveContainer.appendChild(messageNode);
-    };
-    const notInErrorOrDoneState = () => {
-        return !(state.done || state.error);
-    };
-    const requestIDProcessingStatus = async () => {
-        var _a;
-        const signal = abortController.signal;
-        const apiRoute = (_a = document === null || document === void 0 ? void 0 : document.getElementById("spinner-container")) === null || _a === void 0 ? void 0 : _a.dataset.apiRoute;
-        try {
-            const response = await fetch(apiRoute, { signal });
-            if (response.status !== 200) {
-                throw new Error(`Status code ${response.status} received`);
-            }
-            const data = await response.json();
-            if (data.status === "COMPLETED" ||
-                data.status === "INTERVENTION") {
-                reflectCompletion();
+        return this.state.error ? domErrorState : domInitialState;
+    }
+    async requestIDProcessingStatus(initTime) {
+        const signal = this.abortController.signal;
+        await fetch(this.config.apiUrl, { signal })
+            .then((response) => response.json())
+            .then((data) => {
+            if (data.status === "COMPLETED" || data.status === "INTERVENTION") {
+                this.reflectCompletion();
             }
             else if (data.status === "ERROR") {
-                reflectError();
+                this.reflectError();
             }
-            else if (notInErrorOrDoneState()) {
+            else if (this.notInErrorOrDoneState()) {
                 setTimeout(async () => {
-                    if (Date.now() - initTime >= config.msBeforeAbort) {
+                    if (Date.now() - initTime >= this.config.msBeforeAbort) {
                         return;
                     }
-                    await requestIDProcessingStatus();
-                }, config.msBetweenRequests);
-            }
-            if (data.status === "Clear to proceed") {
-                reflectCompletion();
+                    await this.requestIDProcessingStatus(initTime);
+                }, this.config.msBetweenRequests);
             }
-            else if (notInErrorOrDoneState()) {
-                setTimeout(async () => {
-                    await requestIDProcessingStatus();
-                }, 1000);
+        })
+            .catch((error) => {
+            if (error.name !== "AbortError") {
+                console.error("Error in requestIDProcessingStatus:", error);
+                this.reflectError();
             }
-        }
-        catch (e) {
-            console.log(e);
-            reflectError();
-            if (e.name !== "AbortError") {
-                console.error("Error in requestIdProcessingStatus:", e);
-                reflectError();
-            }
-        }
-    };
-    const initTimer = () => {
-        let spinnerInitTime = sessionStorage.getItem("spinnerInitTime");
-        if (spinnerInitTime === null) {
+        })
+            .finally(() => {
+            this.updateDom();
+        });
+    }
+    getInitTime() {
+        const storedSpinnerInitTime = sessionStorage.getItem("spinnerInitTime");
+        let spinnerInitTime;
+        if (storedSpinnerInitTime === null) {
             spinnerInitTime = Date.now();
             sessionStorage.setItem("spinnerInitTime", spinnerInitTime.toString());
         }
         else {
-            spinnerInitTime = parseInt(spinnerInitTime, 10);
+            spinnerInitTime = parseInt(storedSpinnerInitTime, 10);
+        }
+        return spinnerInitTime;
+    }
+    init() {
+        if (this.domRequirementsMet) {
+            const initTime = this.getInitTime();
+            this.initTimer(initTime);
+            this.initialiseContainers();
+            this.updateDom();
+            this.requestIDProcessingStatus(initTime);
         }
-        initTime = spinnerInitTime;
-        updateAccordingToTimeElapsed();
-        setInterval(() => {
-            updateAccordingToTimeElapsed();
-            updateDom();
-        }, config === null || config === void 0 ? void 0 : config.msBetweenDomUpdate);
-    };
-    const initialiseContainers = () => {
-        const spinnerContainer = document.createElement("div");
-        const ariaLiveContainer = document.createElement("div");
-        ariaLiveContainer.setAttribute("aria-live", "assertive");
-        ariaLiveContainer.classList.add("govuk-visually-hidden");
-        ariaLiveContainer.appendChild(document.createTextNode(""));
-        container === null || container === void 0 ? void 0 : container.replaceChildren(spinnerContainer, ariaLiveContainer);
-    };
-    return {
-        state: state,
-        init: () => {
-            timers.updateDomTimer = setInterval(updateDom, 2000);
-            timers.abortUnresponsiveRequest = setTimeout(() => {
-                reflectError();
-            }, 15000);
-            updateDom();
-            requestIDProcessingStatus().then(() => {
-                updateDom();
-            });
-            if (domRequirementsMet) {
-                initTimer();
-                initialiseContainers();
-                initialiseAbortController();
-                updateDom();
-                requestIDProcessingStatus();
+    }
+    constructor(domContainer) {
+        this.config = {
+            apiUrl: "/prove-identity-status",
+            msBeforeInformingOfLongWait: 5000,
+            msBeforeAbort: 25000,
+            msBetweenRequests: 1000,
+            msBetweenDomUpdate: 2000,
+        };
+        this.notInErrorOrDoneState = () => {
+            return !(this.state.done || this.state.error);
+        };
+        this.reflectCompletion = () => {
+            this.state.spinnerState = "spinner__ready";
+            this.state.spinnerStateText = this.content.complete.spinnerState;
+            this.state.buttonDisabled = false;
+            this.state.ariaButtonEnabledMessage =
+                this.content.complete.ariaButtonEnabledMessage;
+            this.state.done = true;
+            sessionStorage.removeItem("spinnerInitTime");
+        };
+        this.reflectError = () => {
+            this.state.heading = this.content.error.heading;
+            this.state.messageText = this.content.error.messageText;
+            this.state.spinnerState = "spinner__failed";
+            this.state.done = true;
+            this.state.error = true;
+            sessionStorage.removeItem("spinnerInitTime");
+            this.abortController.abort();
+        };
+        this.updateAccordingToTimeElapsed = (initTime) => {
+            const elapsedMilliseconds = Date.now() - initTime;
+            if (elapsedMilliseconds >= this.config.msBeforeAbort) {
+                this.reflectError();
+            }
+            else if (elapsedMilliseconds >= this.config.msBeforeInformingOfLongWait) {
+                this.reflectLongWait();
+            }
+        };
+        this.vDomHasChanged = (currentVDom, nextVDom) => {
+            return JSON.stringify(currentVDom) !== JSON.stringify(nextVDom);
+        };
+        this.convert = (node) => {
+            const el = document.createElement(node.nodeName);
+            if (node.text)
+                el.textContent = node.text;
+            if (node.innerHTML)
+                el.innerHTML = node.innerHTML;
+            if (node.id)
+                el.id = node.id;
+            if (node.classes)
+                el.classList.add(...node.classes);
+            if (node.buttonDisabled)
+                el.setAttribute("disabled", `${node.buttonDisabled}`);
+            return el;
+        };
+        this.updateAriaAlert = (messageText) => {
+            while (this.ariaLiveContainer.firstChild) {
+                this.ariaLiveContainer.removeChild(this.ariaLiveContainer.firstChild);
+            }
+            /* Create new message and append it to the live region */
+            const messageNode = document.createTextNode(messageText);
+            this.ariaLiveContainer.appendChild(messageNode);
+        };
+        this.updateDom = () => {
+            const vDomChanged = this.vDomHasChanged(this.state.virtualDom, this.createVirtualDom());
+            if (vDomChanged) {
+                document.title = this.state.heading;
+                this.state.virtualDom = this.createVirtualDom();
+                const elements = this.state.virtualDom.map(this.convert);
+                this.spinnerContainer.replaceChildren(...elements);
+            }
+            if (this.state.error) {
+                this.spinnerContainer.classList.add("spinner-container__error");
+            }
+            if (this.state.done) {
+                clearInterval(this.updateDomTimer);
+            }
+            if (this.config.ariaButtonEnabledMessage &&
+                this.state.ariaButtonEnabledMessage !== "") {
+                this.updateAriaAlert(this.config.ariaButtonEnabledMessage);
             }
-        },
-    };
-})();
+        };
+        // For the Aria alert to work reliably we need to create its container once and then update the contents
+        // https://tetralogical.com/blog/2024/05/01/why-are-my-live-regions-not-working/
+        // So here we create a separate DOM element for the Aria live text that won't be touched when the spinner updates.
+        this.initialiseContainers = () => {
+            this.spinnerContainer = document.createElement("div");
+            this.ariaLiveContainer = document.createElement("div");
+            this.ariaLiveContainer.setAttribute("aria-live", "assertive");
+            this.ariaLiveContainer.classList.add("govuk-visually-hidden");
+            this.ariaLiveContainer.appendChild(document.createTextNode(""));
+            this.container.replaceChildren(this.spinnerContainer, this.ariaLiveContainer);
+        };
+        this.initTimer = (initTime) => {
+            this.updateAccordingToTimeElapsed(initTime);
+            this.updateDomTimer = setInterval(() => {
+                this.updateAccordingToTimeElapsed(initTime);
+                this.updateDom();
+            }, this.config.msBetweenDomUpdate);
+        };
+        this.handleAbort = () => {
+            this.abortController.abort();
+        };
+        this.initialiseAbortController = () => {
+            this.abortController = new AbortController();
+            window.removeEventListener("beforeunload", this.handleAbort);
+            window.addEventListener("beforeunload", this.handleAbort);
+        };
+        this.container = domContainer;
+        this.initialiseContent(this.container);
+        this.initialiseState();
+        this.initialiseAbortController();
+    }
+}
 
-export { WaitInteractions };
+export { useSpinner };

package/build/esm/frontend/spinner/__tests__/spinner.test.d.ts

@@ -0,0 +1,6 @@
+export declare function wait(ms: number): Promise<unknown>;
+export declare function waitUntil(conditionFn: Function, { timeout, interval }?: {
+    timeout?: number | undefined;
+    interval?: number | undefined;
+}): Promise<void>;
+//# sourceMappingURL=spinner.test.d.ts.map

package/build/esm/frontend/spinner/__tests__/spinner.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"spinner.test.d.ts","sourceRoot":"","sources":["../../../../../frontend-src/spinner/__tests__/spinner.test.ts"],"names":[],"mappings":"AAEA,wBAAgB,IAAI,CAAC,EAAE,EAAE,MAAM,oBAE9B;AAED,wBAAsB,SAAS,CAC7B,WAAW,EAAE,QAAQ,EACrB,EAAE,OAAc,EAAE,QAAa,EAAE;;;CAAK,iBAcvC"}

package/build/esm/frontend/spinner/spinner.d.ts

@@ -0,0 +1,90 @@
+export declare function useSpinner(): void;
+type TVDOM = {
+    classes: string[];
+    buttonDisabled?: boolean;
+    id?: string;
+    innerHTML?: string;
+    nodeName: string;
+    text?: string;
+};
+export declare class Spinner {
+    container: HTMLElement;
+    spinnerContainer: HTMLElement;
+    ariaLiveContainer: HTMLElement;
+    content: {
+        complete: {
+            ariaButtonEnabledMessage?: string;
+            spinnerState: string;
+        };
+        continueButton: {
+            text: string;
+        };
+        error: {
+            heading: string;
+            messageText: string;
+            whatYouCanDo: {
+                heading: string;
+                message: {
+                    text1: string;
+                    link: {
+                        href: string;
+                        text: string;
+                    };
+                    text2: string;
+                };
+            };
+        };
+        initial: {
+            heading: string;
+            spinnerStateText: string;
+            spinnerState: string;
+        };
+        longWait: {
+            spinnerStateText: string;
+        };
+    };
+    domRequirementsMet?: boolean;
+    state: {
+        ariaButtonEnabledMessage?: string;
+        buttonDisabled: boolean;
+        done: boolean;
+        error: boolean;
+        heading: string;
+        messageText?: string;
+        spinnerState: string;
+        spinnerStateText: string;
+        virtualDom: TVDOM[];
+    };
+    updateDomTimer: NodeJS.Timeout;
+    abortController: AbortController;
+    config: {
+        apiUrl: string;
+        ariaButtonEnabledMessage?: string;
+        msBeforeInformingOfLongWait: number;
+        msBeforeAbort: number;
+        msBetweenRequests: number;
+        msBetweenDomUpdate: number;
+    };
+    notInErrorOrDoneState: () => boolean;
+    reflectCompletion: () => void;
+    reflectError: () => void;
+    reflectLongWait(): void;
+    updateAccordingToTimeElapsed: (initTime: number) => void;
+    initialiseState(): void;
+    initialiseContent(element: HTMLElement): void;
+    createVirtualDom(): TVDOM[];
+    vDomHasChanged: (currentVDom: TVDOM[], nextVDom: TVDOM[]) => boolean;
+    convert: (node: TVDOM) => HTMLElement;
+    updateAriaAlert: (messageText: string) => void;
+    updateDom: () => void;
+    requestIDProcessingStatus(initTime: number): Promise<void>;
+    initialiseContainers: () => void;
+    getInitTime(): number;
+    initTimer: (initTime: number) => void;
+    handleAbort: () => void;
+    initialiseAbortController: () => void;
+    init(): void;
+    constructor(domContainer: HTMLElement);
+}
+export {};
+//# sourceMappingURL=spinner.d.ts.map

package/build/esm/frontend/spinner/spinner.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"spinner.d.ts","sourceRoot":"","sources":["../../../../frontend-src/spinner/spinner.ts"],"names":[],"mappings":"AAAA,wBAAgB,UAAU,SAWzB;AAED,KAAK,KAAK,GAAG;IACX,OAAO,EAAE,MAAM,EAAE,CAAC;IAClB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,MAAM,CAAC;IACjB,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,qBAAa,OAAO;IAClB,SAAS,cAAC;IACV,gBAAgB,EAAE,WAAW,CAAC;IAC9B,iBAAiB,EAAE,WAAW,CAAC;IAC/B,OAAO,EAAE;QACP,QAAQ,EAAE;YACR,wBAAwB,CAAC,EAAE,MAAM,CAAC;YAClC,YAAY,EAAE,MAAM,CAAC;SACtB,CAAC;QACF,cAAc,EAAE;YACd,IAAI,EAAE,MAAM,CAAC;SACd,CAAC;QACF,KAAK,EAAE;YACL,OAAO,EAAE,MAAM,CAAC;YAChB,WAAW,EAAE,MAAM,CAAC;YACpB,YAAY,EAAE;gBACZ,OAAO,EAAE,MAAM,CAAC;gBAChB,OAAO,EAAE;oBACP,KAAK,EAAE,MAAM,CAAC;oBACd,IAAI,EAAE;wBACJ,IAAI,EAAE,MAAM,CAAC;wBACb,IAAI,EAAE,MAAM,CAAC;qBACd,CAAC;oBACF,KAAK,EAAE,MAAM,CAAC;iBACf,CAAC;aACH,CAAC;SACH,CAAC;QACF,OAAO,EAAE;YACP,OAAO,EAAE,MAAM,CAAC;YAChB,gBAAgB,EAAE,MAAM,CAAC;YACzB,YAAY,EAAE,MAAM,CAAC;SACtB,CAAC;QACF,QAAQ,EAAE;YACR,gBAAgB,EAAE,MAAM,CAAC;SAC1B,CAAC;KACH,CAAC;IACF,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,KAAK,EAAE;QACL,wBAAwB,CAAC,EAAE,MAAM,CAAC;QAClC,cAAc,EAAE,OAAO,CAAC;QACxB,IAAI,EAAE,OAAO,CAAC;QACd,KAAK,EAAE,OAAO,CAAC;QACf,OAAO,EAAE,MAAM,CAAC;QAChB,WAAW,CAAC,EAAE,MAAM,CAAC;QACrB,YAAY,EAAE,MAAM,CAAC;QACrB,gBAAgB,EAAE,MAAM,CAAC;QACzB,UAAU,EAAE,KAAK,EAAE,CAAC;KACrB,CAAC;IACF,cAAc,EAAE,MAAM,CAAC,OAAO,CAAC;IAC/B,eAAe,EAAE,eAAe,CAAC;IACjC,MAAM,EAAE;QACN,MAAM,EAAE,MAAM,CAAC;QACf,wBAAwB,CAAC,EAAE,MAAM,CAAC;QAClC,2BAA2B,EAAE,MAAM,CAAC;QACpC,aAAa,EAAE,MAAM,CAAC;QACtB,iBAAiB,EAAE,MAAM,CAAC;QAC1B,kBAAkB,EAAE,MAAM,CAAC;KAC5B,CAMC;IAEF,qBAAqB,gBAEnB;IAEF,iBAAiB,aAQf;IAEF,YAAY,aAQV;IAEF,eAAe;IAMf,4BAA4B,GAAI,UAAU,MAAM,UAO9C;IAEF,eAAe;IAef,iBAAiB,CAAC,OAAO,EAAE,WAAW;IA8EtC,gBAAgB,IAAI,KAAK,EAAE;IAwD3B,cAAc,GAAI,aAAa,KAAK,EAAE,EAAE,UAAU,KAAK,EAAE,aAEvD;IAEF,OAAO,GAAI,MAAM,KAAK,iBASpB;IAEF,eAAe,GAAI,aAAa,MAAM,UAQpC;IAEF,SAAS,aA0BP;IAEI,yBAAyB,CAAC,QAAQ,EAAE,MAAM;IAgChD,oBAAoB,aAUlB;IAEF,WAAW;IAYX,SAAS,GAAI,UAAU,MAAM,UAO3B;IAEF,WAAW,aAET;IAEF,yBAAyB,aAIvB;IAEF,IAAI;gBAWQ,YAAY,EAAE,WAAW;CAMtC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@govuk-one-login/frontend-ui",
-  "version": "1.4.3",
+  "version": "2.0.0",
   "description": "",
   "main": "build/cjs/backend/index.cjs",
   "module": "build/esm/backend/index.js",
@@ -12,8 +12,8 @@
     "build": "rollup -c",
     "dev": "rollup -c --watch",
     "test": "jest --coverage src",
-    "test:visual": "playwright test browser-tests/functional-tests",
-    "test:visual:update": "playwright test browser-tests/functional-tests --update-snapshots"
+    "test:visual": "npx playwright install --with-deps && playwright test browser-tests/functional-tests",
+    "test:visual:update": "npx playwright install --with-deps && playwright test browser-tests/functional-tests --update-snapshots"
   },
   "files": [
     "build/",
@@ -42,7 +42,8 @@
   },
   "peerDependencies": {
     "express": "^5.1.0 || >= 4.21.2",
-    "govuk-frontend": "^4.10.1 || ^5.0.0"
+    "govuk-frontend": "^4.10.1 || ^5.0.0",
+    "@govuk-one-login/frontend-analytics": " ^3.0.1 || ^4.0.3"
   },
   "exports": {
     ".": {
@@ -57,6 +58,6 @@
   "types": "./build/esm/backend/index.d.ts",
   "optionalDependencies": {
     "hmpo-components": "^7.1.0",
-    "@govuk-one-login/frontend-analytics": "^4.0.1"
+    "@govuk-one-login/frontend-analytics": "^4.0.3"
   }
 }

package/build/cjs/frontend/typescript/spinner.d.ts

@@ -1,6 +0,0 @@
-import { state } from "../utils/types";
-export declare const WaitInteractions: {
-    state: state;
-    init: () => void;
-};
-//# sourceMappingURL=spinner.d.ts.map