Hi all, I have some code that must be rendered statically in the served HTML. This is working fine when using pages router, but don't know how to transform it to app router.
Any idea?

class MyDocument extends Document {
    static async getInitialProps(ctx: DocumentContext) {
        const intialProps = await Document.getInitialProps(ctx)
        const page = await ctx.renderPage()
        const uiLibrary = extractCritical(page.html)
}

// exactCritical
import * as react_jsx_runtime from 'react/jsx-runtime';

/**
 * Extract critical elements that are required to be rendered statically in the served HTML.
 * It's a key building to support server-side-like rendering patterns (SSR, SSG, ISR, ...) consumer-side.
 * Using SSR aims to improve the CRP (Critical Rendering Path) and mitigate FOUC (Flash Of Unstyled Content).
 * @param html The stringified application html rendered consumer-side
 * @returns A collection of JSX critical elements to be rendered into the application head
 */
declare const extractCritical: (html: string) => {
    metadata: react_jsx_runtime.JSX.Element;
    style: react_jsx_runtime.JSX.Element[];
    toString(): string;
};

export { extractCritical };