fix(react): add <HeadProvider />

Author: SukkaW

packages/react/head.d.ts

@@ -1 +1 @@
-export { Head } from "./dist/head";
+export { Head, HeadProvider } from "./dist/head";

packages/react/src/head-context.tsx

@@ -1,6 +1,6 @@
 import React, { createContext, ReactElement, ReactNode } from "react";
 
-class HeadProvider {
+export class HeadManager {
   private head: React.ReactElement[] = [];
 
   private removeTag(tag: string) {
@@ -31,6 +31,6 @@ class HeadProvider {
   }
 }
 
-const headProvider = new HeadProvider();
+const defaultHeadManager = new HeadManager();
 
-export const HeadContext = createContext(headProvider);
+export const HeadContext = createContext(defaultHeadManager);

packages/react/src/head.tsx

@@ -1,5 +1,5 @@
-import { useContext } from "react";
-import { HeadContext } from "./head-context";
+import { useContext, useRef } from "react";
+import { HeadContext, HeadManager } from "./head-context";
 
 interface HeadProps {
   title?: string;
@@ -14,3 +14,16 @@ export const Head: React.FC<HeadProps> = ({ children, title }) => {
   }
   return null;
 };
+
+export const HeadProvider: React.FC<React.PropsWithChildren> = ({ children }) => {
+  const headProvider = useRef<HeadManager>();
+  if (headProvider.current == null) {
+    headProvider.current = new HeadManager();
+  }
+
+  return (
+    <HeadContext.Provider value={headProvider.current}>
+      {children}
+    </HeadContext.Provider>
+  )
+}