feat(core)!: unctx fallback context

[harlan-zw]

🔗 Linked issue

#375, #362, #281

❓ Type of change

• 📖 Documentation (updates to the documentation, readme, or JSdoc annotations)
• 🐞 Bug fix (a non-breaking change that fixes an issue)
• 👌 Enhancement (improving an existing functionality like performance)
• ✨ New feature (a non-breaking change that adds functionality)
• 🧹 Chore (updates to the build process or auxiliary tools and libraries)
• ⚠️ Breaking change (fix or feature that would cause existing functionality to change)

📚 Description

When using a framework like Vue or React we can inject the Unhead instance to the render context, this works great and allows us to access to add tags in nested components. However, for meta frameworks where we may want to call these functions outside of a direct render, such as in plugins or middleware we need to rely on an alternative context source.

This PR replaces the fallback SSR implicit shared context used when using any useHead*() composables from unhead with unctx.

import { useHead } from 'unhead'

// Where does unhead get its context? 
// Previously this would used a shared global instance
useHead({ title: 'foo' })

The previous shared context architecture was dodgy and was leading to potential cross-request leakage of Unhead tags when SSR. For Vue, this issue was patched in a hacky way without breaking changes. For vanilla Unhead this was still a present issue and it was assumed the end user would handle this themselves if / when it became a problem.

Additionally, having an exported let activeHead was causing issues with tree-shaking so this PR should improve the package weight when bundling.

As this PR includes breaking changes related to the setup of Unhead, it's recommended to follow the updated setup guides provided for higher level frameworks (coming soon).

SSR Setup Guide

Unhead provides several useHead*() composables which allow you to interact with Unhead without having to keep a reference of the main instance.

When using Unhead client-side, we don't need to worry about context, but as Unhead is for SSR head tags, we do to avoid cross-request instance sharing.

When setting up Unhead for SSR in a vanilla JS app, you should use the unheadCtx function to manage the context state.

import { createHead, unheadCtx } from 'unhead'

const head = createHead()

unheadCtx.set(head)
// -> render your app
unheadCtx.unset()

🚀 Features

• unheadCtx
• tryUseUnhead()
• useUnhead()

⚠️ Breaking Changes

• Removes getActiveHead()
• Using any useHead*() composables without a context available will throw an error instead of silently failing

📝 Checklist

• I have linked an issue or discussion.
• I have updated the documentation accordingly.