@unsetsoft/ryunixjs 1.2.4-canary.10 → 1.2.4-canary.11

package/dist/Ryunix.esm.js

@@ -556,6 +556,16 @@ const clearContainer = (container) => {
  */
 const commitRoot = () => {
   const state = getState();
+
+  if (state.wipRoot && state.wipRoot.dom && state.wipRoot.dom.hasChildNodes() && !state.currentRoot) {
+    // This is the hydration commit. We synchronously clear existing SSR content to prevent FOUC.
+    // Ensure we only clear once by verifying !state.currentRoot.
+    // We clear BEFORE appending new children in commitWork.
+    while (state.wipRoot.dom.firstChild) {
+      state.wipRoot.dom.removeChild(state.wipRoot.dom.firstChild);
+    }
+  }
+
   state.deletions.forEach(commitWork);
   commitWork(state.wipRoot.child);
   state.currentRoot = state.wipRoot;
@@ -1034,7 +1044,10 @@ const createContext = (
 const useQuery = () => {
   if (typeof window === 'undefined') return {}
 
-  const searchParams = new URLSearchParams(window.location.search);
+  const ctx = RouterContext.useContext('ryunix.navigation');
+  const searchStr = ctx && ctx.location ? (ctx.location.split('?')[1]?.split('#')[0] || '') : window.location.search;
+
+  const searchParams = new URLSearchParams(searchStr || window.location.search);
   const query = {};
   for (const [key, value] of searchParams.entries()) {
     query[key] = value;
@@ -1053,6 +1066,12 @@ const useQuery = () => {
 const useHash = () => {
   if (typeof window === 'undefined') return ''
 
+  const ctx = RouterContext.useContext('ryunix.navigation');
+  if (ctx && ctx.location) {
+    const parts = ctx.location.split('#');
+    return parts.length > 1 ? `#${parts[1]}` : ''
+  }
+
   const [hash, setHash] = useStore(window.location.hash);
   useEffect(() => {
     const onHashChange = () => setHash(window.location.hash);
@@ -1179,10 +1198,10 @@ const findRoute = (routes, path) => {
  * `value` prop set to `contextValue`, and wrapping the `children` within a `Fragment`.
  */
 const RouterProvider = ({ routes, children }) => {
-  const [location, setLocation] = useStore(window.location.pathname);
+  const [location, setLocation] = useStore(window.location.pathname + window.location.search + window.location.hash);
 
   useEffect(() => {
-    const update = () => setLocation(window.location.pathname);
+    const update = () => setLocation(window.location.pathname + window.location.search + window.location.hash);
     window.addEventListener('popstate', update);
     window.addEventListener('hashchange', update);
     return () => {
@@ -1839,15 +1858,7 @@ const render = (element, container) => {
   return state.wipRoot
 };
 
-/**
- * The `hydrate` function attaches Ryunix elements to an existing HTML DOM.
- * Note: We clear the SSR content and do a clean CSR render.
- * The SSR HTML serves its purpose for first-paint and SEO; once JS loads
- * it takes over with a full CSR render to ensure correctness and interactivity.
- */
 const hydrate = (element, container) => {
-  // Clear SSR content — prevents duplicate DOM nodes when hooks trigger re-renders
-  clearContainer(container);
   return render(element, container)
 };