@govuk-one-login/frontend-ui 4.1.4 → 4.2.0

package/build/esm/frontend/index.js

@@ -0,0 +1,440 @@
+async function useSpinner(containerId, pollingFunction, successFunction, errorFunction) {
+    const element = document.getElementById(containerId);
+    if (element && element instanceof HTMLDivElement) {
+        let spinner;
+        try {
+            spinner = new Spinner(element, pollingFunction, successFunction, errorFunction);
+        }
+        catch (e) {
+            const errorText = document.createElement("p");
+            errorText.textContent = "Error configuring spinner: " + e;
+            element.replaceChildren(errorText);
+            return;
+        }
+        await spinner.init();
+    }
+    else {
+        console.error(`Attempting to initiate a spinner on a page with no '#${containerId}' div element.`);
+    }
+}
+var PollResult;
+(function (PollResult) {
+    PollResult[PollResult["Success"] = 0] = "Success";
+    PollResult[PollResult["Failure"] = 1] = "Failure";
+    PollResult[PollResult["Pending"] = 2] = "Pending";
+    PollResult[PollResult["Backoff"] = 3] = "Backoff";
+})(PollResult || (PollResult = {}));
+var SpinnerState;
+(function (SpinnerState) {
+    SpinnerState[SpinnerState["Waiting"] = 0] = "Waiting";
+    SpinnerState[SpinnerState["LongWaiting"] = 1] = "LongWaiting";
+    SpinnerState[SpinnerState["Error"] = 2] = "Error";
+    SpinnerState[SpinnerState["Complete"] = 3] = "Complete";
+})(SpinnerState || (SpinnerState = {}));
+class Spinner {
+    constructor(domContainer, pollingFunction, onSuccess, onError) {
+        this.state = SpinnerState.Waiting;
+        this.backOffCount = 0;
+        this.handleAbort = () => {
+            this.abortController.abort();
+        };
+        this.initTimer = (initTime) => {
+            this.updateDomTimer = setInterval(() => {
+                this.updateStateAccordingToTimeElapsed(initTime);
+                this.updateDom();
+            }, this.config.msBetweenDomUpdate);
+        };
+        this.reflectSuccess = () => {
+            this.state = SpinnerState.Complete;
+            sessionStorage.removeItem("spinnerInitTime");
+        };
+        this.reflectError = () => {
+            this.state = SpinnerState.Error;
+            sessionStorage.removeItem("spinnerInitTime");
+            this.abortController.abort();
+        };
+        this.updateStateAccordingToTimeElapsed = (initTime) => {
+            const elapsedMilliseconds = Date.now() - initTime;
+            if (this.hasCompleted()) {
+                // If we've already finished waiting then there's no need to update again.
+                return;
+            }
+            if (elapsedMilliseconds >= this.config.msBeforeAbort) {
+                this.reflectError();
+            }
+            else if (elapsedMilliseconds >= this.config.msBeforeInformingOfLongWait) {
+                this.reflectLongWait();
+            }
+        };
+        this.updateDom = () => {
+            if (this.hasCompleted()) {
+                // We've reached an end state so stop updating the DOM after this
+                clearInterval(this.updateDomTimer);
+            }
+            if (this.displayState === this.state) {
+                // No need to update anything
+                return;
+            }
+            this.displayState = this.state;
+            const newElementsToDisplay = [];
+            switch (this.displayState) {
+                case SpinnerState.Waiting:
+                    newElementsToDisplay.push(this.createSpinnerElement(""));
+                    this.cloneAndAddIfExists(newElementsToDisplay, this.waitContent);
+                    break;
+                case SpinnerState.LongWaiting:
+                    newElementsToDisplay.push(this.createSpinnerElement(""));
+                    this.cloneAndAddIfExists(newElementsToDisplay, this.longWaitContent);
+                    break;
+                case SpinnerState.Complete:
+                    newElementsToDisplay.push(this.createSpinnerElement("spinner__finished"));
+                    this.cloneAndAddIfExists(newElementsToDisplay, this.successContent);
+                    break;
+                case SpinnerState.Error:
+                    if (!this.config.hideSpinnerOnError) {
+                        newElementsToDisplay.push(this.createSpinnerElement("spinner__finished"));
+                    }
+                    this.cloneAndAddIfExists(newElementsToDisplay, this.errorContent);
+                    break;
+            }
+            this.visibleElementsContainer.replaceChildren(...newElementsToDisplay);
+            if (this.displayState === SpinnerState.Complete) {
+                if (this.onSuccess) {
+                    this.onSuccess();
+                }
+                this.updateAriaAlert(this.config.ariaAlertCompletionText);
+            }
+            if (this.displayState === SpinnerState.Error && !!this.onError) {
+                this.onError();
+            }
+        };
+        this.container = domContainer;
+        this.pollingFunction = pollingFunction;
+        if (!pollingFunction) {
+            throw new Error("Polling function must be provided");
+        }
+        this.onSuccess = onSuccess;
+        this.onError = onError;
+        this.noJsContent = this.getElementOrThrow("no-js-content");
+        this.noJsContent.style.display = "none";
+        this.waitContent =
+            this.container.querySelector("#wait-content") || undefined;
+        this.longWaitContent =
+            this.container.querySelector("#long-wait-content") || undefined;
+        this.successContent =
+            this.container.querySelector("#success-content") || undefined;
+        this.errorContent =
+            this.container.querySelector("#error-content") || undefined;
+        if (!this.successContent && !onSuccess) {
+            throw new Error("One of success-content or successFunction must be provided");
+        }
+        if (!this.errorContent && !onError) {
+            throw new Error("One of error-content or errorFunction must be provided");
+        }
+        this.config = this.getConfig(this.container);
+        this.visibleElementsContainer = document.createElement("div");
+        this.container.appendChild(this.visibleElementsContainer);
+        this.ariaLiveContainer = this.createAriaLiveContainer();
+        this.container.appendChild(this.ariaLiveContainer);
+        this.abortController = this.createAbortController();
+    }
+    async init() {
+        const initTime = this.getInitTime();
+        this.updateStateAccordingToTimeElapsed(initTime);
+        this.updateDom();
+        this.initTimer(initTime);
+        await this.callPollingFunction(initTime);
+    }
+    getElementOrThrow(elementId) {
+        const element = this.container.querySelector(`#${elementId}`);
+        if (element === null || !(element instanceof HTMLElement)) {
+            throw new Error(`HTML Element with id ${elementId} must be provided`);
+        }
+        return element;
+    }
+    getConfig(element) {
+        return {
+            msBeforeInformingOfLongWait: element.dataset.msBeforeInformingOfLongWait
+                ? parseInt(element.dataset.msBeforeInformingOfLongWait)
+                : 5000,
+            msBeforeAbort: element.dataset.msBeforeAbort
+                ? parseInt(element.dataset.msBeforeAbort)
+                : 30000,
+            msBetweenRequests: element.dataset.msBetweenRequests
+                ? parseInt(element.dataset.msBetweenRequests)
+                : 2000,
+            msBetweenDomUpdate: element.dataset.msBetweenDomUpdate
+                ? parseInt(element.dataset.msBetweenDomUpdate)
+                : 1000,
+            ariaAlertCompletionText: element.dataset.ariaAlertCompletionText
+                ? element.dataset.ariaAlertCompletionText
+                : undefined,
+            hideSpinnerOnError: element.dataset.hideSpinnerOnError
+                ? (element.dataset.hideSpinnerOnError === 'true')
+                : false,
+            maxBackoffTries: element.dataset.maxBackoffTries
+                ? parseInt(element.dataset.maxBackoffTries)
+                : 3,
+        };
+    }
+    createAbortController() {
+        const abortController = new AbortController();
+        window.removeEventListener("beforeunload", this.handleAbort);
+        window.addEventListener("beforeunload", this.handleAbort);
+        return abortController;
+    }
+    getInitTime() {
+        const storedSpinnerInitTime = sessionStorage.getItem("spinnerInitTime");
+        let spinnerInitTime;
+        if (storedSpinnerInitTime === null) {
+            spinnerInitTime = Date.now();
+            sessionStorage.setItem("spinnerInitTime", spinnerInitTime.toString());
+        }
+        else {
+            spinnerInitTime = parseInt(storedSpinnerInitTime, 10);
+        }
+        return spinnerInitTime;
+    }
+    hasCompleted() {
+        return (this.state === SpinnerState.Error || this.state === SpinnerState.Complete);
+    }
+    reflectLongWait() {
+        if (!this.hasCompleted()) {
+            this.state = SpinnerState.LongWaiting;
+        }
+    }
+    createSpinnerElement(spinnerStateClass) {
+        const spinner = document.createElement("div");
+        spinner.id = "spinner";
+        spinner.classList.add("spinner", "centre");
+        if (spinnerStateClass) {
+            spinner.classList.add(spinnerStateClass);
+        }
+        return spinner;
+    }
+    cloneAndAddIfExists(list, element) {
+        if (element) {
+            const cloned = element.cloneNode(true);
+            cloned.style.display = "";
+            cloned.removeAttribute("id");
+            list.push(cloned);
+        }
+    }
+    async callPollingFunction(initTime) {
+        if (Date.now() - initTime >= this.config.msBeforeAbort) {
+            return;
+        }
+        await this.pollingFunction(this.abortController.signal)
+            .then((response) => {
+            if (response === PollResult.Success) {
+                this.reflectSuccess();
+            }
+            else if (response === PollResult.Failure) {
+                this.reflectError();
+            }
+            else if (!this.hasCompleted()) {
+                let timeToNextPoll = this.config.msBetweenRequests;
+                if (response === PollResult.Backoff) {
+                    this.backOffCount++;
+                    if (this.backOffCount > this.config.maxBackoffTries) {
+                        this.reflectError();
+                        return;
+                    }
+                    timeToNextPoll = this.calculateBackoffTime(this.backOffCount);
+                }
+                else {
+                    this.backOffCount = 0;
+                }
+                setTimeout(async () => {
+                    if (Date.now() - initTime >= this.config.msBeforeAbort) {
+                        return;
+                    }
+                    await this.callPollingFunction(initTime);
+                }, timeToNextPoll);
+            }
+        })
+            .catch((error) => {
+            if (error.name !== "AbortError") {
+                console.error("Error in polling function: ", error);
+                this.reflectError();
+            }
+        })
+            .finally(() => {
+            this.updateDom();
+        });
+    }
+    calculateBackoffTime(backOffCount) {
+        const extraDelay = Math.pow(2, backOffCount - 2) * this.config.msBetweenRequests;
+        return this.config.msBetweenRequests + extraDelay;
+    }
+    createAriaLiveContainer() {
+        // 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/
+        const container = document.createElement("div");
+        container.setAttribute("aria-live", "assertive");
+        container.classList.add("govuk-visually-hidden");
+        return container;
+    }
+    updateAriaAlert(messageText) {
+        if (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);
+        }
+    }
+}
+
+function initialiseProgressButtons(document = window.document) {
+    // Create a single live region for button status announcements
+    const statusRegion = document.createElement('div');
+    statusRegion.setAttribute('aria-live', 'assertive');
+    statusRegion.setAttribute('role', 'status');
+    statusRegion.className = 'govuk-visually-hidden';
+    document.body.appendChild(statusRegion);
+    const progressButtons = Array.prototype.slice.call(document.querySelectorAll('[data-frontendui="di-progress-button"]'));
+    function findClosestForm(element) {
+        let el = element;
+        while (el && el.nodeName !== 'FORM') {
+            el = el.parentElement;
+        }
+        return el;
+    }
+    progressButtons.forEach(function (button) {
+        const form = findClosestForm(button);
+        let isSubmitting = false;
+        // Handle spacebar press for anchor tags
+        if (button.tagName.toLowerCase() === 'a') {
+            button.addEventListener('keydown', function (event) {
+                if (event.code === 'Space') {
+                    event.preventDefault();
+                    button.click();
+                }
+            });
+        }
+        button.addEventListener('click', function (event) {
+            if (isSubmitting) {
+                event.preventDefault();
+                return;
+            }
+            const waitingText = button.getAttribute('data-waiting-text');
+            const longWaitingText = button.getAttribute('data-long-waiting-text');
+            const errorPage = button.getAttribute('data-error-page');
+            const isInput = button.tagName.toLowerCase() === 'input';
+            if (!waitingText || !longWaitingText || !errorPage) {
+                console.error('Progress button is missing required data attributes.');
+                return;
+            }
+            isSubmitting = true;
+            // Always handle the button click, regardless of form presence
+            handleProgressButtonClick(button, waitingText, longWaitingText, errorPage, isInput);
+            // If no form, we're done. If there is a form, the form submit handler will take over
+            if (!form) {
+                return;
+            }
+            // For form buttons, let the click propagate to trigger form submission
+        });
+        if (form) {
+            form.addEventListener('submit', function (event) {
+                // The button click handler has already set isSubmitting and handled the button state
+                if (isSubmitting) {
+                    // Allow the first submission, prevent subsequent ones
+                    if (event.target === form && event.submitter === button) {
+                        return; // Allow the first submission to proceed
+                    }
+                    event.preventDefault ? event.preventDefault() : (event.returnValue = false);
+                    return;
+                }
+                // If the form is submitted through another method (not our button),
+                // prevent double submission but don't show progress state
+                isSubmitting = true;
+            });
+        }
+    });
+}
+function handleProgressButtonClick(element, waitingText, longWaitingText, errorPage, isInput) {
+    var originalText = isInput && element instanceof HTMLInputElement ? element.value : element.innerText;
+    const statusRegion = document.querySelector('.govuk-visually-hidden[role="status"]');
+    if (typeof element.blur === 'function') {
+        element.blur();
+    }
+    element.setAttribute('data-prevent-double-click', 'true');
+    if (element instanceof HTMLButtonElement || element instanceof HTMLInputElement) {
+        // When the button is disabled immediately it prevents the initial form submission.
+        // TODO: We should revisit this. It would be better to trigger the button actions from the form submission rather than the button click when a form is present.
+        setTimeout(() => {
+            element.disabled = true;
+        }, 0);
+    }
+    else if (element.tagName.toLowerCase() === 'a') {
+        element.setAttribute('aria-disabled', 'true');
+        element.style.pointerEvents = 'none';
+    }
+    element.classList.add('govuk-progress-button--disabled');
+    var classes = element.className.split(' ');
+    if (classes.indexOf('govuk-button--progress-loading') === -1) {
+        classes.push('govuk-button--progress-loading');
+        element.className = classes.join(' ');
+    }
+    if (isInput && element instanceof HTMLInputElement) {
+        element.value = waitingText;
+    }
+    else {
+        element.innerText = waitingText;
+    }
+    // Announce the initial waiting state
+    if (statusRegion) {
+        statusRegion.textContent = waitingText;
+    }
+    var longWaitTimeout = window.setTimeout(function () {
+        if (isInput && element instanceof HTMLInputElement) {
+            element.value = longWaitingText;
+        }
+        else {
+            element.innerText = longWaitingText;
+        }
+        // Announce the long wait state
+        if (statusRegion) {
+            statusRegion.textContent = longWaitingText;
+        }
+    }, 5000);
+    var errorTimeout = window.setTimeout(function () {
+        window.location.href = errorPage;
+    }, 10000);
+    function resetButton() {
+        var classes = element.className.split(' ');
+        var loadingIndex = classes.indexOf('govuk-button--progress-loading');
+        if (loadingIndex !== -1) {
+            classes.splice(loadingIndex, 1);
+            element.className = classes.join(' ');
+        }
+        if (element instanceof HTMLButtonElement || element instanceof HTMLInputElement) {
+            element.disabled = false;
+        }
+        else if (element.tagName.toLowerCase() === 'a') {
+            element.removeAttribute('aria-disabled');
+            element.style.pointerEvents = '';
+        }
+        element.classList.remove('govuk-progress-button--disabled');
+        element.setAttribute('data-prevent-double-click', 'false');
+        if (isInput && element instanceof HTMLInputElement) {
+            element.value = originalText;
+        }
+        else {
+            element.innerText = originalText;
+        }
+        // Clear status region without announcement
+        const statusRegion = document.querySelector('.govuk-visually-hidden[role="status"]');
+        if (statusRegion) {
+            statusRegion.textContent = '';
+        }
+        window.clearTimeout(errorTimeout);
+        window.clearTimeout(longWaitTimeout);
+    }
+    element.resetProgressButton = resetButton;
+    return resetButton;
+}
+
+export { PollResult, initialiseProgressButtons, useSpinner };

package/build/esm/frontend/progress-button/progress-button.d.ts

@@ -0,0 +1,2 @@
+export declare function initialiseProgressButtons(document?: Document): void;
+//# sourceMappingURL=progress-button.d.ts.map

package/build/esm/frontend/progress-button/progress-button.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"progress-button.d.ts","sourceRoot":"","sources":["../../../../frontend-src/progress-button/progress-button.ts"],"names":[],"mappings":"AAAA,wBAAgB,yBAAyB,CAAC,QAAQ,GAAE,QAA0B,QAiF7E"}

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

@@ -0,0 +1,2 @@
+export declare function wait(ms: number): Promise<unknown>;
+//# 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":"AAGA,wBAAgB,IAAI,CAAC,EAAE,EAAE,MAAM,oBAE9B"}

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

@@ -0,0 +1,64 @@
+export declare function useSpinner(containerId: string, pollingFunction: PollingFunction, successFunction: VoidFunction, errorFunction: VoidFunction): Promise<void>;
+export type PollingFunction = (abortSignal: AbortSignal) => Promise<PollResult>;
+export declare enum PollResult {
+    Success = 0,
+    Failure = 1,
+    Pending = 2,
+    Backoff = 3
+}
+declare enum SpinnerState {
+    Waiting = 0,
+    LongWaiting = 1,
+    Error = 2,
+    Complete = 3
+}
+type SpinnerConfig = {
+    msBeforeInformingOfLongWait: number;
+    msBeforeAbort: number;
+    msBetweenRequests: number;
+    msBetweenDomUpdate: number;
+    ariaAlertCompletionText?: string;
+    hideSpinnerOnError: boolean;
+    maxBackoffTries: number;
+};
+export declare class Spinner {
+    container: HTMLDivElement;
+    noJsContent: HTMLElement;
+    waitContent?: HTMLElement;
+    longWaitContent?: HTMLElement;
+    successContent?: HTMLElement;
+    errorContent?: HTMLElement;
+    ariaLiveContainer: HTMLDivElement;
+    visibleElementsContainer: HTMLDivElement;
+    state: SpinnerState;
+    displayState?: SpinnerState;
+    updateDomTimer?: NodeJS.Timeout;
+    abortController: AbortController;
+    config: SpinnerConfig;
+    backOffCount: number;
+    pollingFunction: PollingFunction;
+    onSuccess: VoidFunction;
+    onError: VoidFunction;
+    constructor(domContainer: HTMLDivElement, pollingFunction: PollingFunction, onSuccess: VoidFunction, onError: VoidFunction);
+    init(): Promise<void>;
+    private getElementOrThrow;
+    private getConfig;
+    private createAbortController;
+    private handleAbort;
+    private getInitTime;
+    private initTimer;
+    private hasCompleted;
+    private reflectSuccess;
+    private reflectError;
+    private reflectLongWait;
+    private updateStateAccordingToTimeElapsed;
+    private createSpinnerElement;
+    private updateDom;
+    private cloneAndAddIfExists;
+    private callPollingFunction;
+    private calculateBackoffTime;
+    private createAriaLiveContainer;
+    private updateAriaAlert;
+}
+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,wBAAsB,UAAU,CAAC,WAAW,EAAE,MAAM,EAAE,eAAe,EAAE,eAAe,EAAE,eAAe,EAAE,YAAY,EAAE,aAAa,EAAE,YAAY,iBAoBjJ;AAED,MAAM,MAAM,eAAe,GAAG,CAAC,WAAW,EAAE,WAAW,KAAK,OAAO,CAAC,UAAU,CAAC,CAAC;AAEhF,oBAAY,UAAU;IACpB,OAAO,IAAA;IACP,OAAO,IAAA;IACP,OAAO,IAAA;IACP,OAAO,IAAA;CACR;AAED,aAAK,YAAY;IACf,OAAO,IAAA;IACP,WAAW,IAAA;IACX,KAAK,IAAA;IACL,QAAQ,IAAA;CACT;AAED,KAAK,aAAa,GAAG;IACnB,2BAA2B,EAAE,MAAM,CAAC;IACpC,aAAa,EAAE,MAAM,CAAC;IACtB,iBAAiB,EAAE,MAAM,CAAC;IAC1B,kBAAkB,EAAE,MAAM,CAAC;IAC3B,uBAAuB,CAAC,EAAE,MAAM,CAAC;IACjC,kBAAkB,EAAE,OAAO,CAAC;IAC5B,eAAe,EAAE,MAAM,CAAC;CACzB,CAAC;AAEF,qBAAa,OAAO;IAClB,SAAS,EAAE,cAAc,CAAC;IAC1B,WAAW,EAAE,WAAW,CAAC;IACzB,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,eAAe,CAAC,EAAE,WAAW,CAAC;IAC9B,cAAc,CAAC,EAAE,WAAW,CAAC;IAC7B,YAAY,CAAC,EAAE,WAAW,CAAC;IAC3B,iBAAiB,EAAE,cAAc,CAAC;IAElC,wBAAwB,EAAE,cAAc,CAAC;IAEzC,KAAK,EAAE,YAAY,CAAwB;IAC3C,YAAY,CAAC,EAAE,YAAY,CAAC;IAC5B,cAAc,CAAC,EAAE,MAAM,CAAC,OAAO,CAAC;IAChC,eAAe,EAAE,eAAe,CAAC;IACjC,MAAM,EAAE,aAAa,CAAC;IACtB,YAAY,EAAE,MAAM,CAAK;IAEzB,eAAe,EAAE,eAAe,CAAC;IACjC,SAAS,EAAE,YAAY,CAAC;IACxB,OAAO,EAAE,YAAY,CAAC;gBAGpB,YAAY,EAAE,cAAc,EAC5B,eAAe,EAAE,eAAe,EAChC,SAAS,EAAE,YAAY,EACvB,OAAO,EAAE,YAAY;IA2CjB,IAAI;IAUV,OAAO,CAAC,iBAAiB;IAQzB,OAAO,CAAC,SAAS;IA0BjB,OAAO,CAAC,qBAAqB;IAO7B,OAAO,CAAC,WAAW,CAEjB;IAEF,OAAO,CAAC,WAAW;IAYnB,OAAO,CAAC,SAAS,CAKf;IAEF,OAAO,CAAC,YAAY;IAMpB,OAAO,CAAC,cAAc,CAGpB;IAEF,OAAO,CAAC,YAAY,CAIlB;IAEF,OAAO,CAAC,eAAe;IAMvB,OAAO,CAAC,iCAAiC,CAWvC;IAEF,OAAO,CAAC,oBAAoB;IAU5B,OAAO,CAAC,SAAS,CAkDf;IAEF,OAAO,CAAC,mBAAmB;YASb,mBAAmB;IA2CjC,OAAO,CAAC,oBAAoB;IAK5B,OAAO,CAAC,uBAAuB;IAS/B,OAAO,CAAC,eAAe;CAWxB"}

package/build/esm/frontend/utils/types.d.ts

@@ -0,0 +1,108 @@
+export interface virtualDom {
+    nodeName?: string;
+    id?: string;
+    classes?: string[];
+    text?: string;
+}
+export type error = {
+    spinnerState: string;
+    done: boolean;
+    virtualDom: never[];
+    state: {
+        error: boolean;
+    };
+    name: string;
+};
+export type apiRoute = RequestInfo | URL;
+export type content = {
+    longWait?: {
+        spinnerStateText: string;
+    };
+    initial?: {
+        spinnerState: string | virtualDom;
+    };
+    complete?: {
+        spinnerState: string;
+        ariaButtonEnabledMessage?: string;
+    };
+    continueButton?: {
+        text: string;
+    };
+    error?: {
+        heading?: string;
+        messageText?: string;
+        whatYouCanDo: {
+            heading: string;
+            message: {
+                text1: string;
+                link: {
+                    href: string;
+                    text: string;
+                };
+                text2: string;
+            };
+        };
+    };
+};
+export type timers = {
+    updateDomTimer?: unknown | number;
+    abortUnresponsiveRequest?: unknown | number;
+    abort?: unknown | never;
+};
+export type state = {
+    abortController: null | {
+        abort: any;
+    };
+    abort?: unknown;
+    error?: boolean | error;
+    spinnerState?: string;
+    done?: boolean;
+    virtualDom?: unknown[];
+    timers?: {
+        timers: timers;
+    };
+    spinnerStateText?: string;
+    buttonDisabled?: boolean;
+    heading?: object | string | undefined;
+    messageText?: string;
+    ariaButtonEnabledMessage?: string;
+};
+export type node = {
+    text: object;
+    innerHTML: HTMLElement;
+    id: string;
+    classes: string[];
+    nodeName: keyof HTMLElementTagNameMap;
+    textContent: unknown | HTMLElement | string;
+    el: unknown | HTMLElement | string;
+    buttonDisabled: boolean | string;
+};
+export type initialState = {
+    nodeName?: string;
+    id?: string;
+    classes?: (string | undefined)[];
+    text?: object | string;
+    buttonDisabled?: state;
+}[];
+export type spinnerInitial = {
+    container?: HTMLElement;
+    apiUrl?: string;
+    msBeforeInformingOfLongWait?: number;
+    msBeforeAbort?: number;
+    msBetweenRequests?: number;
+    msBeforeDomUpdate?: number;
+    ariaLiveContainer?: HTMLElement;
+    domRequirementsMet?: boolean;
+    initTime?: number | undefined;
+    updateDomTimer?: number | undefined | any;
+    abortController?: any | object;
+    config?: {
+        msBeforeAbort: number;
+        msBeforeInformingOfLongWait: number;
+        msBetweenRequests: number;
+        ariaButtonEnabledMessage: string;
+        msBetweenDomUpdate: number;
+    };
+    msBetweenDomUpdate?: number;
+};
+//# sourceMappingURL=types.d.ts.map

package/build/esm/frontend/utils/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../frontend-src/utils/types.ts"],"names":[],"mappings":"AACA,MAAM,WAAW,UAAU;IACzB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,MAAM,MAAM,KAAK,GAAG;IAClB,YAAY,EAAE,MAAM,CAAC;IACrB,IAAI,EAAE,OAAO,CAAC;IACd,UAAU,EAAE,KAAK,EAAE,CAAC;IACpB,KAAK,EAAE;QAAE,KAAK,EAAE,OAAO,CAAA;KAAE,CAAC;IAC1B,IAAI,EAAE,MAAM,CAAC;CACd,CAAC;AAEF,MAAM,MAAM,QAAQ,GAAG,WAAW,GAAG,GAAG,CAAC;AAEzC,MAAM,MAAM,OAAO,GAAG;IACpB,QAAQ,CAAC,EAAE;QACT,gBAAgB,EAAE,MAAM,CAAC;KAC1B,CAAC;IACF,OAAO,CAAC,EAAE;QACR,YAAY,EAAE,MAAM,GAAG,UAAU,CAAC;KACnC,CAAC;IACF,QAAQ,CAAC,EAAE;QACT,YAAY,EAAE,MAAM,CAAC;QACrB,wBAAwB,CAAC,EAAE,MAAM,CAAC;KACnC,CAAC;IACF,cAAc,CAAC,EAAE;QACf,IAAI,EAAE,MAAM,CAAC;KACd,CAAC;IACF,KAAK,CAAC,EAAE;QACN,OAAO,CAAC,EAAE,MAAM,CAAC;QACjB,WAAW,CAAC,EAAE,MAAM,CAAC;QACrB,YAAY,EAAE;YACZ,OAAO,EAAE,MAAM,CAAC;YAChB,OAAO,EAAE;gBACP,KAAK,EAAE,MAAM,CAAC;gBACd,IAAI,EAAE;oBACJ,IAAI,EAAE,MAAM,CAAC;oBACb,IAAI,EAAE,MAAM,CAAC;iBACd,CAAC;gBACF,KAAK,EAAE,MAAM,CAAC;aACf,CAAC;SACH,CAAC;KACH,CAAC;CACH,CAAC;AAEF,MAAM,MAAM,MAAM,GAAG;IACnB,cAAc,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;IAClC,wBAAwB,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;IAC5C,KAAK,CAAC,EAAE,OAAO,GAAG,KAAK,CAAC;CACzB,CAAC;AAEF,MAAM,MAAM,KAAK,GAAG;IAClB,eAAe,EAAE,IAAI,GAAG;QACtB,KAAK,EAAE,GAAG,CAAC;KACZ,CAAC;IACF,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,KAAK,CAAC,EAAE,OAAO,GAAG,KAAK,CAAC;IACxB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,UAAU,CAAC,EAAE,OAAO,EAAE,CAAC;IACvB,MAAM,CAAC,EAAE;QACP,MAAM,EAAE,MAAM,CAAC;KAChB,CAAC;IACF,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,OAAO,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,SAAS,CAAC;IACtC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,wBAAwB,CAAC,EAAE,MAAM,CAAC;CACnC,CAAC;AAEF,MAAM,MAAM,IAAI,GAAG;IACjB,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,EAAE,WAAW,CAAC;IACvB,EAAE,EAAE,MAAM,CAAC;IACX,OAAO,EAAE,MAAM,EAAE,CAAC;IAClB,QAAQ,EAAE,MAAM,qBAAqB,CAAC;IACtC,WAAW,EAAE,OAAO,GAAG,WAAW,GAAG,MAAM,CAAC;IAC5C,EAAE,EAAE,OAAO,GAAG,WAAW,GAAG,MAAM,CAAC;IACnC,cAAc,EAAE,OAAO,GAAG,MAAM,CAAC;CAClC,CAAC;AAEF,MAAM,MAAM,YAAY,GAAG;IACzB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,OAAO,CAAC,EAAE,CAAC,MAAM,GAAG,SAAS,CAAC,EAAE,CAAC;IACjC,IAAI,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACvB,cAAc,CAAC,EAAE,KAAK,CAAC;CACxB,EAAE,CAAC;AAEJ,MAAM,MAAM,cAAc,GAAG;IAC3B,SAAS,CAAC,EAAE,WAAW,CAAC;IACxB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,2BAA2B,CAAC,EAAE,MAAM,CAAC;IACrC,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,iBAAiB,CAAC,EAAE,WAAW,CAAC;IAChC,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,QAAQ,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC9B,cAAc,CAAC,EAAE,MAAM,GAAG,SAAS,GAAG,GAAG,CAAC;IAC1C,eAAe,CAAC,EAAE,GAAG,GAAG,MAAM,CAAC;IAC/B,MAAM,CAAC,EAAE;QACP,aAAa,EAAE,MAAM,CAAC;QACtB,2BAA2B,EAAE,MAAM,CAAC;QACpC,iBAAiB,EAAE,MAAM,CAAC;QAC1B,wBAAwB,EAAE,MAAM,CAAC;QACjC,kBAAkB,EAAE,MAAM,CAAC;KAC5B,CAAC;IACF,kBAAkB,CAAC,EAAE,MAAM,CAAC;CAC7B,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@govuk-one-login/frontend-ui",
-  "version": "4.1.4",
+  "version": "4.2.0",
   "description": "",
   "main": "build/cjs/backend/index.cjs",
   "module": "build/esm/backend/index.js",
@@ -38,7 +38,6 @@
   },
   "homepage": "https://github.com/govuk-one-login/govuk-one-login-frontend#readme",
   "dependencies": {
-    "js-yaml": "^4.1.0",
     "pino": "^10.1.0"
   },
   "peerDependencies": {