@revealui/core 0.0.1-pre.0 → 0.0.1-pre.2

package/dist/integration/onRenderClient.tsx

@@ -1,377 +0,0 @@
-export { onRenderClient }
-
-import ReactDOM, { createRoot, hydrateRoot } from "react-dom/client"
-import { applyHeadSettings } from "../core/dom/applyHeadSettings.js"
-import { callCumulativeHooks } from "../core/hooks/callCumulativeHooks.js"
-import { getHeadSetting } from "../core/processing/getters/getHeadSetting.js"
-import { getPageElement } from "../core/processing/getters/getPageElement.js"
-import { OnRenderClientAsync } from "../types/interfaces/config.js"
-import type {
-  ExtendedPageContextClient,
-  PageContext,
-  PageContextClient,
-  PageContextInternal,
-} from "../types/interfaces/context.js"
-import App from "../ui/providers/AppProvider.js"
-import "./styles.css"
-
-let root: ReactDOM.Root
-
-const onRenderClient: OnRenderClientAsync = async (
-  pageContext: PageContextClient & PageContextInternal
-): ReturnType<OnRenderClientAsync> => {
-  const { Page } = pageContext
-  if (!Page) {
-    throw new Error(
-      "Client-side onRenderClient() hook expects pageContext.Page to be defined"
-    )
-  }
-
-  const clientPageContext: PageContextClient = {
-    ...pageContext,
-    isHydration: true,
-  }
-
-  const container = document.getElementById("react-root")
-  if (!container) {
-    console.error("Failed to find the root container")
-    return
-  }
-
-  const page = (
-    <App pageContext={clientPageContext as ExtendedPageContextClient}>
-      <Page />
-    </App>
-  )
-
-  try {
-    // Check if the page is being hydrated (SSR case) or rendered from scratch (SPA case)
-    if (container.innerHTML === "" || !pageContext.isHydration) {
-      if (!root) {
-        root = createRoot(container)
-      }
-      root.render(page)
-    } else {
-      root = hydrateRoot(container, page)
-    }
-  } catch (error) {
-    console.error("Error rendering page", error)
-  }
-
-  pageContext._headAlreadySet = pageContext.isHydration
-
-  // Call cumulative hooks before rendering (useful for setup)
-  await callCumulativeHooks(
-    pageContext.config.onBeforeRenderClient,
-    pageContext
-  )
-
-  const { renderPromise } = getPageElement(
-    clientPageContext as ExtendedPageContextClient
-  )
-  pageContext.Page = () => page
-
-  // Hydration or initial render error handling
-  const onUncaughtError = (_error: any, _errorInfo: any) => {}
-
-  if (pageContext.isHydration && container.innerHTML !== "") {
-    // Hydrate the server-side rendered page
-    root = hydrateRoot(container, page, { onUncaughtError })
-  } else {
-    if (!root) {
-      root = createRoot(container, { onUncaughtError })
-    }
-    root.render(page)
-  }
-
-  ;(pageContext as any).root = root
-
-  await renderPromise
-
-  // After first client-side render, set head settings (if not already set)
-  if (!pageContext.isHydration) {
-    pageContext._headAlreadySet = true
-    applyHead(pageContext)
-  }
-
-  // Call cumulative hooks after rendering
-  await callCumulativeHooks(pageContext.config.onAfterRenderClient, pageContext)
-}
-
-function applyHead(pageContext: PageContextClient) {
-  const title = getHeadSetting<string | null>(
-    "title",
-    pageContext as unknown as PageContext & PageContextInternal
-  )
-  const lang = getHeadSetting<string | null>(
-    "lang",
-    pageContext as unknown as PageContext & PageContextInternal
-  )
-  applyHeadSettings(title, lang)
-}
-
-// // https://reveal.dev/onRenderClient
-// export { onRenderClient };
-
-// import ReactDOM, { createRoot, hydrateRoot } from "react-dom/client";
-// import type {
-//   OnRenderClientAsync,
-//   PageContext,
-//   PageContextClient,
-// } from "reveal/types";
-// import { callCumulativeHooks } from "../gaurds/callCumulativeHooks.js";
-// import type { PageContextInternal } from "../types/PageContext.js";
-// import { applyHeadSettings } from "./applyHeadSettings.js";
-// import { getHeadSetting } from "./getHeadSetting.js";
-// import { getPageElement } from "./getPageElement.js";
-// import "./styles.css";
-// import React from "react";
-// import App from "./app.js";
-
-// let root: ReactDOM.Root;
-// const onRenderClient: OnRenderClientAsync = async (
-//   pageContext: PageContextClient & PageContextInternal,
-// ): ReturnType<OnRenderClientAsync> => {
-//   const { Page } = pageContext;
-//   if (!Page) {
-//     throw new Error(
-//       "Client-side onRenderClient() hook expects pageContext.Page to be defined",
-//     );
-//   }
-
-//   const clientPageContext: PageContext = {
-//     ...pageContext,
-//     isHydration: true,
-//   };
-
-//   const container = document.getElementById("react-root");
-//   if (!container) {
-//     console.error("Failed to find the root container");
-//     return;
-//   }
-
-//   const PageComponent = Page;
-
-//   try {
-//     const page = (
-//       <App pageContext={clientPageContext}>
-//         <PageComponent />
-//       </App>
-//     );
-
-//     // SPA
-//     if (container.innerHTML === "" || !pageContext.isHydration) {
-//       if (!root) {
-//         root = ReactDOM.createRoot(container);
-//       }
-//       root.render(page);
-//       // SSR
-//     } else {
-//       root = ReactDOM.hydrateRoot(container, page);
-//     }
-
-//     if (!root) {
-//       root = pageContext.isHydration
-//         ? hydrateRoot(container, page)
-//         : createRoot(container);
-//     } else {
-//       root.render(page);
-//     }
-//   } catch (error) {
-//     console.error("Error rendering page", error);
-//   }
-//   pageContext._headAlreadySet = pageContext.isHydration;
-
-//   // Use case:
-//   // - Store hydration https://github.com/revealjs/reveal-react/issues/110
-//   await callCumulativeHooks(
-//     pageContext.config.onBeforeRenderClient,
-//     pageContext,
-//   );
-
-//   const { page, renderPromise } = getPageElement(pageContext);
-//   pageContext.page = page;
-
-//   // TODO: implement this? So that, upon errors, onRenderClient() throws an error and reveal can render the error. As of April 2024 it isn't released yet.
-//   //  - https://react-dev-git-fork-rickhanlonii-rh-root-options-fbopensource.vercel.app/reference/react-dom/client/createRoot#show-a-dialog-for-uncaught-errors
-//   //  - https://react-dev-git-fork-rickhanlonii-rh-root-options-fbopensource.vercel.app/reference/react-dom/client/hydrateRoot#show-a-dialog-for-uncaught-errors
-//   const onUncaughtError = (_error: any, _errorInfo: any) => {};
-
-//   if (
-//     pageContext.isHydration &&
-//     // Whether the page was [Server-Side Rendered](https://reveal.dev/ssr).
-//     container.innerHTML !== ""
-//   ) {
-//     // First render while using SSR, i.e. [hydration](https://reveal.dev/hydration)
-//     root = ReactDOM.hydrateRoot(container, page, {
-//       onUncaughtError,
-//     });
-//   } else {
-//     if (!root) {
-//       // First render without SSR
-//       root = ReactDOM.createRoot(container, {
-//         onUncaughtError,
-//       });
-//     }
-//     root.render(page);
-//   }
-//   pageContext.root = root;
-
-//   await renderPromise;
-
-//   if (!pageContext.isHydration) {
-//     pageContext._headAlreadySet = true;
-//     applyHead(pageContext);
-//   }
-
-//   // Use cases:
-//   // - Custom user settings: https://reveal.dev/head-tags#custom-settings
-//   // - Testing tools: https://github.com/revealjs/reveal-react/issues/95
-//   await callCumulativeHooks(
-//     pageContext.config.onAfterRenderClient,
-//     pageContext,
-//   );
-// };
-
-// function applyHead(pageContext: PageContextClient) {
-//   const title = getHeadSetting<string | null>("title", pageContext);
-//   const lang = getHeadSetting<string | null>("lang", pageContext);
-//   applyHeadSettings(title, lang);
-// }
-
-//////// From original implementation: verify before deleting
-// import React from "react"
-// import ReactDOM, { createRoot, hydrateRoot } from "react-dom/client"
-// import { OnRenderClientAsync, PageContext } from "reveal/types"
-// import App from "./app"
-
-// let root: ReactDOM.Root
-
-// const onRenderClient: OnRenderClientAsync = async (
-//   pageContext
-// ): ReturnType<OnRenderClientAsync> => {
-//   const { Page } = pageContext
-//   if (!Page) {
-//     throw new Error(
-//       "Client-side onRenderClient() hook expects pageContext.Page to be defined"
-//     )
-//   }
-
-//   const clientPageContext: PageContext = {
-//     ...pageContext,
-//     isHydration: true,
-//   }
-
-//   const container = document.getElementById("react-root")
-//   if (!container) {
-//     console.error("Failed to find the root container")
-//     return
-//   }
-
-//   const PageComponent = Page
-
-//   try {
-
-//     const page = (
-//       <App pageContext={clientPageContext}>
-//         <PageComponent />
-//       </App>
-//     )
-
-//     // SPA
-//     if (container.innerHTML === "" || !pageContext.isHydration) {
-//       if (!root) {
-//         root = ReactDOM.createRoot(container)
-//       }
-//       root.render(page)
-//       // SSR
-//     } else {
-//       root = ReactDOM.hydrateRoot(container, page)
-//     }
-
-//     if (!root) {
-//       root = pageContext.isHydration
-//         ? hydrateRoot(container, page)
-//         : createRoot(container)
-//     } else {
-//       root.render(page)
-//     }
-//   } catch (error) {
-//     console.error("Error rendering page", error)
-//   }
-// }
-
-// export { onRenderClient }
-
-/////// this is from reveal-react original boilerplate: use as a reference
-// https://reveal.dev/onRenderClient
-// export { onRenderClient }
-
-// import ReactDOM from 'react-dom/client'
-// import { getHeadSetting } from './getHeadSetting.js'
-// import type { OnRenderClientAsync, PageContextClient } from 'reveal/types'
-// import { getPageElement } from './getPageElement.js'
-// import type { PageContextInternal } from '../types/PageContext.js'
-// import './styles.css'
-// import { callCumulativeHooks } from '../utils/callCumulativeHooks.js'
-// import { applyHeadSettings } from './applyHeadSettings.js'
-
-// let root: ReactDOM.Root
-// const onRenderClient: OnRenderClientAsync = async (
-//   pageContext: PageContextClient & PageContextInternal,
-// ): ReturnType<OnRenderClientAsync> => {
-//   pageContext._headAlreadySet = pageContext.isHydration
-
-//   // Use case:
-//   // - Store hydration https://github.com/revealjs/reveal-react/issues/110
-//   await callCumulativeHooks(pageContext.config.onBeforeRenderClient, pageContext)
-
-//   const { page, renderPromise } = getPageElement(pageContext)
-//   pageContext.page = page
-
-//   // TODO: implement this? So that, upon errors, onRenderClient() throws an error and reveal can render the error. As of April 2024 it isn't released yet.
-//   //  - https://react-dev-git-fork-rickhanlonii-rh-root-options-fbopensource.vercel.app/reference/react-dom/client/createRoot#show-a-dialog-for-uncaught-errors
-//   //  - https://react-dev-git-fork-rickhanlonii-rh-root-options-fbopensource.vercel.app/reference/react-dom/client/hydrateRoot#show-a-dialog-for-uncaught-errors
-//   const onUncaughtError = (_error: any, _errorInfo: any) => {}
-
-//   const container = document.getElementById('root')!
-//   if (
-//     pageContext.isHydration &&
-//     // Whether the page was [Server-Side Rendered](https://reveal.dev/ssr).
-//     container.innerHTML !== ''
-//   ) {
-//     // First render while using SSR, i.e. [hydration](https://reveal.dev/hydration)
-//     root = ReactDOM.hydrateRoot(container, page, {
-//       // @ts-expect-error
-//       onUncaughtError,
-//     })
-//   } else {
-//     if (!root) {
-//       // First render without SSR
-//       root = ReactDOM.createRoot(container, {
-//         // @ts-expect-error
-//         onUncaughtError,
-//       })
-//     }
-//     root.render(page)
-//   }
-//   pageContext.root = root
-
-//   await renderPromise
-
-//   if (!pageContext.isHydration) {
-//     pageContext._headAlreadySet = true
-//     applyHead(pageContext)
-//   }
-
-//   // Use cases:
-//   // - Custom user settings: https://reveal.dev/head-tags#custom-settings
-//   // - Testing tools: https://github.com/revealjs/reveal-react/issues/95
-//   await callCumulativeHooks(pageContext.config.onAfterRenderClient, pageContext)
-// }
-
-// function applyHead(pageContext: PageContextClient) {
-//   const title = getHeadSetting<string | null>('title', pageContext)
-//   const lang = getHeadSetting<string | null>('lang', pageContext)
-//   applyHeadSettings(title, lang)
-// }