How to wrap the `prerender` function exported from `withTwind`?

[chopfitzroy]

I would like to setup hoofd with WMR as described in the docs.

In terms of setting this up with withTwind would it be something like:

const { hydrate, prerender: internal } = withTwind({
   // Options here...
});

export async function prerender(data) {
  const result = await internal(data);
  const head = toStatic();
  const { links = [], metas = [], scripts = [] } = head;

  const elements = new Set([
    ...links.map(props => ({ type: 'link', props })),
    ...metas.map(props => ({ type: 'meta', props })),
    ...scripts.map(props => ({ type: 'script', props }))
  ]);

  return {
    ...result,
    head: {
      lang: head.lang,
      title: head.title,
      elements
    }
  };
};

[chopfitzroy]

Ended up getting the above to work (I have updated the code sample) but now when I pre-render the CSS is not compiled and only kicks in once JS loads on the page.

Is there any obvious reason this would be happening?

EDIT:

I needed to update the elements set to be:

  const elements = new Set([
    // @ts-expect-error
    ...result.head.elements,
    ...links.map(props => ({ type: 'link', props })),
    ...metas.map(props => ({ type: 'meta', props })),
    ...scripts.map(props => ({ type: 'script', props }))
  ]);

For whatever reason PrerenderResult interface (from preact-iso) does not include a head key.