@rozenite/tanstack-query-plugin 1.0.0-alpha.0 → 1.0.0-alpha.10

package/dist/react-native.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const d=require("@rozenite/plugin-bridge"),O=require("react"),D=u=>{const e=d.useRozeniteDevToolsClient({pluginId:"@rozenite/tanstack-query-plugin"});O.useEffect(()=>{if(!e)return;const c=e.onMessage("DEVTOOLS_TO_DEVICE_INITIAL_DATA_REQUEST",()=>{e.send("DEVICE_TO_DEVTOOLS_INITIAL_DATA",{queries:u.getQueryCache().getAll(),mutations:u.getMutationCache().getAll()})});return()=>c.remove()},[e,u]);const o=O.useRef(new Set),a=O.useCallback(c=>{const n=T=>u.getQueryCache().getAll().find(E=>E.queryHash===T);(T=>{var f;const{type:E,queryHash:t,metadata:_,requestId:s}=T;if(E==="REFETCH"&&t&&((f=n(t))==null||f.fetch(),s&&(o.current.add(s),e==null||e.send("DEVICE_TO_DEVTOOLS_ACK",{requestId:s,success:!0}),o.current.delete(s))),E==="INVALIDATE"&&t){const r=n(t);r&&u.invalidateQueries({queryKey:r.queryKey}),s&&(e==null||e.send("DEVICE_TO_DEVTOOLS_ACK",{requestId:s,success:!0}))}if(E==="RESET"&&t){const r=n(t);r&&u.resetQueries({queryKey:r.queryKey}),s&&(e==null||e.send("DEVICE_TO_DEVTOOLS_ACK",{requestId:s,success:!0}))}if(E==="REMOVE"&&t){const r=n(t);r&&u.removeQueries({queryKey:r.queryKey}),s&&(e==null||e.send("DEVICE_TO_DEVTOOLS_ACK",{requestId:s,success:!0}))}if(E==="TRIGGER_LOADING"&&t){const r=n(t);r&&(r.setState({...r.state,fetchStatus:"fetching",status:"pending",error:null}),s&&(o.current.add(s),e==null||e.send("DEVICE_TO_DEVTOOLS_ACK",{requestId:s,success:!0}),o.current.delete(s)))}if(E==="RESTORE_LOADING"&&t){const r=n(t);r&&(r.setState({...r.state,fetchStatus:"idle"}),s&&(o.current.add(s),e==null||e.send("DEVICE_TO_DEVTOOLS_ACK",{requestId:s,success:!0}),o.current.delete(s)))}if(E==="TRIGGER_ERROR"&&t){const r=n(t);r&&(r.setState({...r.state,fetchStatus:"idle",status:"error",error:(_==null?void 0:_.error)||new Error("Forced error via devtools"),errorUpdateCount:(r.state.errorUpdateCount??0)+1,errorUpdatedAt:Date.now()}),s&&(o.current.add(s),e==null||e.send("DEVICE_TO_DEVTOOLS_ACK",{requestId:s,success:!0}),o.current.delete(s)))}if(E==="RESTORE_ERROR"&&t){const r=n(t);r&&u.resetQueries({queryKey:r.queryKey}),s&&(e==null||e.send("DEVICE_TO_DEVTOOLS_ACK",{requestId:s,success:!0}))}E==="CLEAR_MUTATION_CACHE"&&(u.getMutationCache().clear(),s&&(e==null||e.send("DEVICE_TO_DEVTOOLS_ACK",{requestId:s,success:!0}))),E==="CLEAR_QUERY_CACHE"&&(u.clear(),s&&(e==null||e.send("DEVICE_TO_DEVTOOLS_ACK",{requestId:s,success:!0})))})(c)},[u,e]);O.useEffect(()=>{if(!e)return;const c=e.onMessage("DEVTOOLS_TO_DEVICE",a);return()=>c.remove()},[a,e]),O.useEffect(()=>{if(e)return u.getQueryCache().subscribe(c=>{o.current.size>0||e.send("DEVICE_TO_DEVTOOLS",c)})},[e,u]),O.useEffect(()=>{if(e)return u.getMutationCache().subscribe(c=>{o.current.size>0||e.send("DEVICE_TO_DEVTOOLS",c)})},[e,u])};exports.useTanStackQueryDevTools=void 0;process.env.NODE_ENV!=="production"?exports.useTanStackQueryDevTools=D:exports.useTanStackQueryDevTools=()=>({isConnected:!1});
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});exports.useTanStackQueryDevTools=void 0;process.env.NODE_ENV!=="production"?exports.useTanStackQueryDevTools=require("./useTanstackQueryDevTools.cjs").useTanStackQueryDevTools:exports.useTanStackQueryDevTools=()=>({isConnected:!1});

package/dist/react-native.d.ts

@@ -1,5 +1 @@
-import { useTanStackQueryDevTools as useTanStackQueryDevTools_2 } from './src/react-native/useTanStackQueryDevTools';
-
-export declare let useTanStackQueryDevTools: useTanStackQueryDevTools_2;
-
-export { }
+export declare let useTanStackQueryDevTools: typeof import('./src/react-native/useTanStackQueryDevTools').useTanStackQueryDevTools;

package/dist/react-native.js

@@ -1,88 +1,5 @@
-import { useRozeniteDevToolsClient as D } from "@rozenite/plugin-bridge";
-import { useEffect as _, useRef as i, useCallback as V } from "react";
-const I = (u) => {
-  const e = D({
-    pluginId: "@rozenite/tanstack-query-plugin"
-  });
-  _(() => {
-    if (!e) return;
-    const n = e.onMessage("DEVTOOLS_TO_DEVICE_INITIAL_DATA_REQUEST", () => {
-      e.send("DEVICE_TO_DEVTOOLS_INITIAL_DATA", {
-        queries: u.getQueryCache().getAll(),
-        mutations: u.getMutationCache().getAll()
-      });
-    });
-    return () => n.remove();
-  }, [e, u]);
-  const o = i(/* @__PURE__ */ new Set()), a = V((n) => {
-    const O = (c) => u.getQueryCache().getAll().find((E) => E.queryHash === c);
-    ((c) => {
-      var f;
-      const { type: E, queryHash: t, metadata: T, requestId: s } = c;
-      if (E === "REFETCH" && t && ((f = O(t)) == null || f.fetch(), s && (o.current.add(s), e == null || e.send("DEVICE_TO_DEVTOOLS_ACK", { requestId: s, success: !0 }), o.current.delete(s))), E === "INVALIDATE" && t) {
-        const r = O(t);
-        r && u.invalidateQueries({ queryKey: r.queryKey }), s && (e == null || e.send("DEVICE_TO_DEVTOOLS_ACK", { requestId: s, success: !0 }));
-      }
-      if (E === "RESET" && t) {
-        const r = O(t);
-        r && u.resetQueries({ queryKey: r.queryKey }), s && (e == null || e.send("DEVICE_TO_DEVTOOLS_ACK", { requestId: s, success: !0 }));
-      }
-      if (E === "REMOVE" && t) {
-        const r = O(t);
-        r && u.removeQueries({ queryKey: r.queryKey }), s && (e == null || e.send("DEVICE_TO_DEVTOOLS_ACK", { requestId: s, success: !0 }));
-      }
-      if (E === "TRIGGER_LOADING" && t) {
-        const r = O(t);
-        r && (r.setState({
-          ...r.state,
-          fetchStatus: "fetching",
-          status: "pending",
-          error: null
-        }), s && (o.current.add(s), e == null || e.send("DEVICE_TO_DEVTOOLS_ACK", { requestId: s, success: !0 }), o.current.delete(s)));
-      }
-      if (E === "RESTORE_LOADING" && t) {
-        const r = O(t);
-        r && (r.setState({
-          ...r.state,
-          fetchStatus: "idle"
-        }), s && (o.current.add(s), e == null || e.send("DEVICE_TO_DEVTOOLS_ACK", { requestId: s, success: !0 }), o.current.delete(s)));
-      }
-      if (E === "TRIGGER_ERROR" && t) {
-        const r = O(t);
-        r && (r.setState({
-          ...r.state,
-          fetchStatus: "idle",
-          status: "error",
-          error: (T == null ? void 0 : T.error) || new Error("Forced error via devtools"),
-          errorUpdateCount: (r.state.errorUpdateCount ?? 0) + 1,
-          errorUpdatedAt: Date.now()
-        }), s && (o.current.add(s), e == null || e.send("DEVICE_TO_DEVTOOLS_ACK", { requestId: s, success: !0 }), o.current.delete(s)));
-      }
-      if (E === "RESTORE_ERROR" && t) {
-        const r = O(t);
-        r && u.resetQueries({ queryKey: r.queryKey }), s && (e == null || e.send("DEVICE_TO_DEVTOOLS_ACK", { requestId: s, success: !0 }));
-      }
-      E === "CLEAR_MUTATION_CACHE" && (u.getMutationCache().clear(), s && (e == null || e.send("DEVICE_TO_DEVTOOLS_ACK", { requestId: s, success: !0 }))), E === "CLEAR_QUERY_CACHE" && (u.clear(), s && (e == null || e.send("DEVICE_TO_DEVTOOLS_ACK", { requestId: s, success: !0 })));
-    })(n);
-  }, [u, e]);
-  _(() => {
-    if (!e) return;
-    const n = e.onMessage("DEVTOOLS_TO_DEVICE", a);
-    return () => n.remove();
-  }, [a, e]), _(() => {
-    if (e)
-      return u.getQueryCache().subscribe((n) => {
-        o.current.size > 0 || e.send("DEVICE_TO_DEVTOOLS", n);
-      });
-  }, [e, u]), _(() => {
-    if (e)
-      return u.getMutationCache().subscribe((n) => {
-        o.current.size > 0 || e.send("DEVICE_TO_DEVTOOLS", n);
-      });
-  }, [e, u]);
-};
-let d;
-process.env.NODE_ENV !== "production" ? d = I : d = () => ({ isConnected: !1 });
+let e;
+process.env.NODE_ENV !== "production" ? e = require("./useTanstackQueryDevTools.js").useTanStackQueryDevTools : e = () => ({ isConnected: !1 });
 export {
-  d as useTanStackQueryDevTools
+  e as useTanStackQueryDevTools
 };

package/dist/rozenite.config.d.ts

@@ -0,0 +1,7 @@
+declare const _default: {
+    panels: {
+        name: string;
+        source: string;
+    }[];
+};
+export default _default;

package/dist/rozenite.json

@@ -1 +1 @@
-{"name":"@rozenite/tanstack-query-plugin","version":"1.0.0-alpha.1","description":"TanStack Query for Rozenite.","panels":[{"name":"Tanstack Query","source":"/tanstack-query.html"}]}
+{"name":"@rozenite/tanstack-query-plugin","version":"1.0.0-alpha.8","description":"TanStack Query for Rozenite.","panels":[{"name":"Tanstack Query","source":"/tanstack-query.html"}]}

package/dist/src/react-native/useHandleDevToolsMessages.d.ts

@@ -0,0 +1,3 @@
+import { QueryClient } from '@tanstack/react-query';
+import { TanStackQueryPluginClient } from '../shared/messaging';
+export declare const useHandleDevToolsMessages: (queryClient: QueryClient, client: TanStackQueryPluginClient | null) => void;

package/dist/src/react-native/useHandleInitialData.d.ts

@@ -0,0 +1,3 @@
+import { TanStackQueryPluginClient } from '../shared/messaging';
+import { QueryClient } from '@tanstack/react-query';
+export declare const useHandleInitialData: (queryClient: QueryClient, client: TanStackQueryPluginClient | null) => void;

package/dist/src/react-native/useSyncTanStackCache.d.ts

@@ -0,0 +1,3 @@
+import { QueryClient } from '@tanstack/react-query';
+import { TanStackQueryPluginClient } from '../shared/messaging';
+export declare const useSyncTanStackCache: (queryClient: QueryClient, client: TanStackQueryPluginClient | null) => void;

package/dist/src/react-native/useTanStackQueryDevTools.d.ts

@@ -0,0 +1,2 @@
+import { QueryClient } from '@tanstack/react-query';
+export declare const useTanStackQueryDevTools: (queryClient: QueryClient) => void;

package/dist/src/shared/dehydrate.d.ts

@@ -0,0 +1,6 @@
+import { Query, Mutation, QueryClient } from '@tanstack/react-query';
+import { SerializableQuery, SerializableMutation, SerializableObserver, SerializableQueryClient } from './types';
+export declare const dehydrateObservers: (query: Query) => SerializableObserver[];
+export declare const dehydrateQuery: (query: Query) => SerializableQuery;
+export declare const dehydrateMutation: (mutation: Mutation) => SerializableMutation;
+export declare const dehydrateQueryClient: (queryClient: QueryClient) => SerializableQueryClient;

package/dist/src/shared/hydrate.d.ts

@@ -0,0 +1,10 @@
+import { QueryClient } from '@tanstack/react-query';
+import { SerializableQuery, SerializableMutation, SerializableQueryClient, SerializableObserver, PartialQueryState } from './types';
+export declare const hydrateQueryClient: (client: QueryClient, dehydratedState: SerializableQueryClient) => void;
+export declare const applyQueryEvent: (queryClient: QueryClient, type: "added" | "updated" | "removed" | "observerAdded" | "observerRemoved" | "observerResultsUpdated" | "observerOptionsUpdated", data: SerializableQuery | PartialQueryState, action?: string) => void;
+export declare const applyPartialQueryState: (queryClient: QueryClient, data: PartialQueryState) => void;
+export declare const applyMutationEvent: (queryClient: QueryClient, type: "added" | "updated" | "removed" | "observerAdded" | "observerRemoved" | "observerResultsUpdated" | "observerOptionsUpdated", data: SerializableMutation) => void;
+export declare const applyQueryObserverEvent: (queryClient: QueryClient, data: {
+    queryHash: string;
+    observers: SerializableObserver[];
+}) => void;

package/dist/src/shared/messaging.d.ts

@@ -0,0 +1,34 @@
+import { RozeniteDevToolsClient } from '@rozenite/plugin-bridge';
+import { DevToolsActionType, SerializableQueryClient, SerializableQuery, SerializableMutation, SerializableObserver, PartialQueryState } from './types';
+export type TanStackQueryPluginEventMap = {
+    'online-status-changed': {
+        online: boolean;
+    };
+    'devtools-action': {
+        type: DevToolsActionType;
+        queryHash: string;
+    };
+    'request-initial-data': unknown;
+    'sync-data': {
+        data: SerializableQueryClient;
+    };
+    'sync-query-event': {
+        type: 'added' | 'removed';
+        data: SerializableQuery;
+    } | {
+        type: 'updated';
+        action?: string;
+        data: SerializableQuery | PartialQueryState;
+    } | {
+        type: 'observerAdded' | 'observerRemoved' | 'observerOptionsUpdated';
+        data: {
+            queryHash: string;
+            observers: SerializableObserver[];
+        };
+    };
+    'sync-mutation-event': {
+        type: 'added' | 'updated' | 'removed' | 'observerAdded' | 'observerRemoved' | 'observerResultsUpdated' | 'observerOptionsUpdated';
+        data: SerializableMutation;
+    };
+};
+export type TanStackQueryPluginClient = RozeniteDevToolsClient<TanStackQueryPluginEventMap>;

package/dist/src/shared/types.d.ts

@@ -0,0 +1,25 @@
+import { QueryKey, MutationState, QueryState, QueryObserverOptions, InfiniteQueryObserverOptions, MutationOptions } from '@tanstack/react-query';
+export type SerializableQuery = {
+    queryHash: string;
+    state: QueryState;
+    queryKey: QueryKey;
+    observers: SerializableObserver[];
+};
+export type PartialQueryState = {
+    queryHash: string;
+    state: Partial<QueryState>;
+};
+export type SerializableMutation = {
+    mutationId: number;
+    options: MutationOptions;
+    state: MutationState;
+};
+export type SerializableObserver = {
+    queryHash: string;
+    options: QueryObserverOptions | InfiniteQueryObserverOptions;
+};
+export type SerializableQueryClient = {
+    queries: SerializableQuery[];
+    mutations: SerializableMutation[];
+};
+export type DevToolsActionType = 'REFETCH' | 'INVALIDATE' | 'RESET' | 'REMOVE' | 'TRIGGER_ERROR' | 'RESTORE_ERROR' | 'TRIGGER_LOADING' | 'RESTORE_LOADING' | 'CLEAR_MUTATION_CACHE' | 'CLEAR_QUERY_CACHE';

package/dist/src/shared/useSyncOnlineStatus.d.ts

@@ -0,0 +1,2 @@
+import { TanStackQueryPluginClient } from './messaging';
+export declare const useSyncOnlineStatus: (client: TanStackQueryPluginClient | null) => void;

package/dist/src/ui/tanstack-query.d.ts

@@ -0,0 +1 @@
+export default function TanStackQueryPanel(): import("react/jsx-runtime").JSX.Element;

package/dist/src/ui/useHandleSyncMessages.d.ts

@@ -0,0 +1,2 @@
+import { TanStackQueryPluginClient } from '../shared/messaging';
+export declare const useHandleSyncMessages: (client: TanStackQueryPluginClient | null) => void;

package/dist/src/ui/useSyncDevToolsEvents.d.ts

@@ -0,0 +1,2 @@
+import { TanStackQueryPluginClient } from '../shared/messaging';
+export declare const useSyncDevToolsEvents: (client: TanStackQueryPluginClient | null) => void;

package/dist/src/ui/useSyncInitialData.d.ts

@@ -0,0 +1,2 @@
+import { TanStackQueryPluginClient } from '../shared/messaging';
+export declare const useSyncInitialData: (client: TanStackQueryPluginClient | null) => void;

package/dist/tanstack-query.html

@@ -22,7 +22,7 @@
     <script>
       var __ROZENITE_PANEL__ = true;
     </script>
-    <script type="module" crossorigin src="./assets/tanstack-query-CXp_Psxe.js"></script>
+    <script type="module" crossorigin src="./assets/tanstack-query-DWTo8DT_.js"></script>
   </head>
   <body>
     <div id="root"></div>

package/dist/useTanstackQueryDevTools.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const b=require("@rozenite/plugin-bridge"),y=require("react"),p=require("@tanstack/react-query"),q=require("fast-deep-equal"),S=e=>e&&e.__esModule?e:{default:e},g=S(q),l=e=>{y.useEffect(()=>{if(!e)return;const a=p.onlineManager.subscribe(n=>{e.send("online-status-changed",{online:n})}),c=e.onMessage("online-status-changed",({online:n})=>{p.onlineManager.setOnline(n)});return()=>{a(),c.remove()}},[e])},M=(e,a)=>{y.useEffect(()=>{if(!a)return;const c=a.onMessage("devtools-action",({type:n,queryHash:o})=>{const s=e.getQueryCache().get(o);if(!s){console.warn(`No active query found for hash: ${o}`);return}switch(n){case"TRIGGER_ERROR":{const d=s.options,t=new Error("Unknown error from devtools");s.setState({status:"error",error:t,fetchMeta:{...s.state.fetchMeta,__previousQueryOptions:d}});break}case"RESTORE_ERROR":{e.resetQueries(s);break}case"TRIGGER_LOADING":{if(!s)return;const d=s.options;s.fetch({...d,queryFn:()=>new Promise(()=>{}),gcTime:-1}),s.setState({data:void 0,status:"pending",fetchMeta:{...s.state.fetchMeta,__previousQueryOptions:d}});break}case"RESTORE_LOADING":{const d=s.state,t=s.state.fetchMeta?s.state.fetchMeta.__previousQueryOptions:null;s.cancel({silent:!0}),s.setState({...d,fetchStatus:"idle",fetchMeta:null}),t&&s.fetch(t);break}case"RESET":{e.resetQueries(s);break}case"REMOVE":{e.removeQueries(s);break}case"REFETCH":{s.fetch().catch(()=>{});break}case"INVALIDATE":{e.invalidateQueries(s);break}default:console.warn(`Unknown devtools action: ${n}`)}});return()=>{c.remove()}},[a])},f=e=>e.observers.map(a=>({queryHash:e.queryHash,options:a.options})),h=e=>{const a=f(e);return{state:e.state,queryKey:e.queryKey,queryHash:e.queryHash,observers:a}},v=e=>({mutationId:e.mutationId,state:e.state,options:e.options}),H=e=>({queries:e.getQueryCache().getAll().map(h),mutations:e.getMutationCache().getAll().map(v)}),R=(e,a)=>{const c=y.useRef(new Map),n=y.useMemo(()=>o=>{if(!a||o.type==="observerResultsUpdated")return;if("query"in o){const{query:t,type:u}=o;if(u==="added"||u==="removed"){u==="removed"&&c.current.delete(t.queryHash);const i=h(t);a.send("sync-query-event",{type:u,data:i});return}if(u==="updated"&&"action"in o){const i=o.action;switch(i.type){case"fetch":{const r={queryHash:t.queryHash,state:{status:t.state.status,fetchStatus:t.state.fetchStatus,fetchMeta:t.state.fetchMeta,dataUpdatedAt:t.state.dataUpdatedAt,errorUpdatedAt:t.state.errorUpdatedAt}};a.send("sync-query-event",{type:"updated",action:"fetch",data:r});break}case"success":{const r={queryHash:t.queryHash,state:{status:t.state.status,data:t.state.data,dataUpdatedAt:t.state.dataUpdatedAt,error:t.state.error,errorUpdatedAt:t.state.errorUpdatedAt,fetchStatus:t.state.fetchStatus}};a.send("sync-query-event",{type:"updated",action:"success",data:r});break}case"error":{const r={queryHash:t.queryHash,state:{status:t.state.status,error:t.state.error,errorUpdatedAt:t.state.errorUpdatedAt,fetchStatus:t.state.fetchStatus}};a.send("sync-query-event",{type:"updated",action:"error",data:r});break}case"setState":{const r={queryHash:t.queryHash,state:i.state};a.send("sync-query-event",{type:"updated",action:"setState",data:r});break}case"invalidate":{const r={queryHash:t.queryHash,state:{isInvalidated:t.state.isInvalidated}};a.send("sync-query-event",{type:"updated",action:"invalidate",data:r});break}case"pause":{const r={queryHash:t.queryHash,state:{fetchStatus:t.state.fetchStatus}};a.send("sync-query-event",{type:"updated",action:"pause",data:r});break}case"continue":{const r={queryHash:t.queryHash,state:{fetchStatus:t.state.fetchStatus}};a.send("sync-query-event",{type:"updated",action:"continue",data:r});break}default:{const r=h(t);a.send("sync-query-event",{type:u,data:r})}}return}if(u==="observerAdded"||u==="observerRemoved"||u==="observerOptionsUpdated"){const i=f(t),r=c.current.get(t.queryHash);if(u==="observerOptionsUpdated"&&r&&g.default(r,i))return;c.current.set(t.queryHash,i),a.send("sync-query-event",{type:u,data:{queryHash:t.queryHash,observers:i}});return}}const{mutation:s,type:d}=o;if(s){const t=v(s);a.send("sync-mutation-event",{type:d,data:t})}},[a]);y.useEffect(()=>{if(!a)return;const o=e.getMutationCache().subscribe(n),s=e.getQueryCache().subscribe(n);return()=>{o(),s()}},[a,e,n])},k=(e,a)=>{y.useEffect(()=>{if(!a)return;const c=a.onMessage("request-initial-data",()=>{const n=H(e);a.send("sync-data",{data:n})});return()=>{c.remove()}},[a,e])},O=e=>{const a=b.useRozeniteDevToolsClient({pluginId:"@rozenite/tanstack-query-plugin"});l(a),M(e,a),R(e,a),k(e,a)};exports.useTanStackQueryDevTools=O;

package/dist/useTanstackQueryDevTools.js

@@ -0,0 +1,312 @@
+import { useRozeniteDevToolsClient as b } from "@rozenite/plugin-bridge";
+import { useEffect as y, useRef as S, useMemo as q } from "react";
+import { onlineManager as h } from "@tanstack/react-query";
+import m from "fast-deep-equal";
+const H = (t) => {
+  y(() => {
+    if (!t)
+      return;
+    const a = h.subscribe((n) => {
+      t.send("online-status-changed", { online: n });
+    }), d = t.onMessage(
+      "online-status-changed",
+      ({ online: n }) => {
+        h.setOnline(n);
+      }
+    );
+    return () => {
+      a(), d.remove();
+    };
+  }, [t]);
+}, M = (t, a) => {
+  y(() => {
+    if (!a)
+      return;
+    const d = a.onMessage(
+      "devtools-action",
+      ({ type: n, queryHash: o }) => {
+        const s = t.getQueryCache().get(o);
+        if (!s) {
+          console.warn(`No active query found for hash: ${o}`);
+          return;
+        }
+        switch (n) {
+          case "TRIGGER_ERROR": {
+            const c = s.options, e = new Error("Unknown error from devtools");
+            s.setState({
+              status: "error",
+              error: e,
+              fetchMeta: {
+                ...s.state.fetchMeta,
+                // @ts-expect-error This does exist
+                __previousQueryOptions: c
+              }
+            });
+            break;
+          }
+          case "RESTORE_ERROR": {
+            t.resetQueries(s);
+            break;
+          }
+          case "TRIGGER_LOADING": {
+            if (!s) return;
+            const c = s.options;
+            s.fetch({
+              ...c,
+              queryFn: () => new Promise(() => {
+              }),
+              gcTime: -1
+            }), s.setState({
+              data: void 0,
+              status: "pending",
+              fetchMeta: {
+                ...s.state.fetchMeta,
+                // @ts-expect-error This does exist
+                __previousQueryOptions: c
+              }
+            });
+            break;
+          }
+          case "RESTORE_LOADING": {
+            const c = s.state, e = s.state.fetchMeta ? s.state.fetchMeta.__previousQueryOptions : null;
+            s.cancel({ silent: !0 }), s.setState({
+              ...c,
+              fetchStatus: "idle",
+              fetchMeta: null
+            }), e && s.fetch(e);
+            break;
+          }
+          case "RESET": {
+            t.resetQueries(s);
+            break;
+          }
+          case "REMOVE": {
+            t.removeQueries(s);
+            break;
+          }
+          case "REFETCH": {
+            s.fetch().catch(() => {
+            });
+            break;
+          }
+          case "INVALIDATE": {
+            t.invalidateQueries(s);
+            break;
+          }
+          default:
+            console.warn(`Unknown devtools action: ${n}`);
+        }
+      }
+    );
+    return () => {
+      d.remove();
+    };
+  }, [a]);
+}, f = (t) => t.observers.map((a) => ({
+  queryHash: t.queryHash,
+  options: a.options
+})), p = (t) => {
+  const a = f(t);
+  return {
+    state: t.state,
+    queryKey: t.queryKey,
+    queryHash: t.queryHash,
+    observers: a
+  };
+}, v = (t) => ({
+  mutationId: t.mutationId,
+  state: t.state,
+  options: t.options
+}), g = (t) => ({
+  queries: t.getQueryCache().getAll().map(p),
+  mutations: t.getMutationCache().getAll().map(v)
+}), R = (t, a) => {
+  const d = S(
+    /* @__PURE__ */ new Map()
+  ), n = q(() => (o) => {
+    if (!a || o.type === "observerResultsUpdated")
+      return;
+    if ("query" in o) {
+      const { query: e, type: u } = o;
+      if (u === "added" || u === "removed") {
+        u === "removed" && d.current.delete(e.queryHash);
+        const i = p(e);
+        a.send("sync-query-event", { type: u, data: i });
+        return;
+      }
+      if (u === "updated" && "action" in o) {
+        const i = o.action;
+        switch (i.type) {
+          case "fetch": {
+            const r = {
+              queryHash: e.queryHash,
+              state: {
+                status: e.state.status,
+                fetchStatus: e.state.fetchStatus,
+                fetchMeta: e.state.fetchMeta,
+                dataUpdatedAt: e.state.dataUpdatedAt,
+                errorUpdatedAt: e.state.errorUpdatedAt
+              }
+            };
+            a.send("sync-query-event", {
+              type: "updated",
+              action: "fetch",
+              data: r
+            });
+            break;
+          }
+          case "success": {
+            const r = {
+              queryHash: e.queryHash,
+              state: {
+                status: e.state.status,
+                data: e.state.data,
+                dataUpdatedAt: e.state.dataUpdatedAt,
+                error: e.state.error,
+                errorUpdatedAt: e.state.errorUpdatedAt,
+                fetchStatus: e.state.fetchStatus
+              }
+            };
+            a.send("sync-query-event", {
+              type: "updated",
+              action: "success",
+              data: r
+            });
+            break;
+          }
+          case "error": {
+            const r = {
+              queryHash: e.queryHash,
+              state: {
+                status: e.state.status,
+                error: e.state.error,
+                errorUpdatedAt: e.state.errorUpdatedAt,
+                fetchStatus: e.state.fetchStatus
+              }
+            };
+            a.send("sync-query-event", {
+              type: "updated",
+              action: "error",
+              data: r
+            });
+            break;
+          }
+          case "setState": {
+            const r = {
+              queryHash: e.queryHash,
+              state: i.state
+              // Only the changed state parts
+            };
+            a.send("sync-query-event", {
+              type: "updated",
+              action: "setState",
+              data: r
+            });
+            break;
+          }
+          case "invalidate": {
+            const r = {
+              queryHash: e.queryHash,
+              state: {
+                isInvalidated: e.state.isInvalidated
+              }
+            };
+            a.send("sync-query-event", {
+              type: "updated",
+              action: "invalidate",
+              data: r
+            });
+            break;
+          }
+          case "pause": {
+            const r = {
+              queryHash: e.queryHash,
+              state: {
+                fetchStatus: e.state.fetchStatus
+              }
+            };
+            a.send("sync-query-event", {
+              type: "updated",
+              action: "pause",
+              data: r
+            });
+            break;
+          }
+          case "continue": {
+            const r = {
+              queryHash: e.queryHash,
+              state: {
+                fetchStatus: e.state.fetchStatus
+              }
+            };
+            a.send("sync-query-event", {
+              type: "updated",
+              action: "continue",
+              data: r
+            });
+            break;
+          }
+          default: {
+            const r = p(e);
+            a.send("sync-query-event", { type: u, data: r });
+          }
+        }
+        return;
+      }
+      if (u === "observerAdded" || u === "observerRemoved" || u === "observerOptionsUpdated") {
+        const i = f(e), r = d.current.get(
+          e.queryHash
+        );
+        if (u === "observerOptionsUpdated" && r && m(r, i))
+          return;
+        d.current.set(
+          e.queryHash,
+          i
+        ), a.send("sync-query-event", {
+          type: u,
+          data: {
+            queryHash: e.queryHash,
+            observers: i
+          }
+        });
+        return;
+      }
+    }
+    const { mutation: s, type: c } = o;
+    if (s) {
+      const e = v(s);
+      a.send("sync-mutation-event", {
+        type: c,
+        data: e
+      });
+    }
+  }, [a]);
+  y(() => {
+    if (!a)
+      return;
+    const o = t.getMutationCache().subscribe(n), s = t.getQueryCache().subscribe(n);
+    return () => {
+      o(), s();
+    };
+  }, [a, t, n]);
+}, k = (t, a) => {
+  y(() => {
+    if (!a)
+      return;
+    const d = a.onMessage("request-initial-data", () => {
+      const n = g(t);
+      a.send("sync-data", { data: n });
+    });
+    return () => {
+      d.remove();
+    };
+  }, [a, t]);
+}, l = (t) => {
+  const a = b({
+    pluginId: "@rozenite/tanstack-query-plugin"
+  });
+  H(a), M(t, a), R(t, a), k(t, a);
+};
+export {
+  l as useTanStackQueryDevTools
+};

package/package.json

@@ -1,27 +1,32 @@
 {
   "name": "@rozenite/tanstack-query-plugin",
-  "version": "1.0.0-alpha.0",
+  "version": "1.0.0-alpha.10",
   "description": "TanStack Query for Rozenite.",
   "type": "module",
   "main": "./dist/react-native.cjs",
   "module": "./dist/react-native.js",
   "types": "./dist/react-native.d.ts",
   "dependencies": {
-    "@rozenite/plugin-bridge": "1.0.0-alpha.0"
+    "fast-deep-equal": "^3.1.3",
+    "@rozenite/plugin-bridge": "1.0.0-alpha.10"
   },
   "devDependencies": {
+    "@tanstack/react-query": "^5.0.0",
     "@tanstack/react-query-devtools": "^5.0.0",
+    "@types/react": "~18.3.12",
+    "react": "18.3.1",
+    "react-dom": "18.3.0",
+    "react-native": "0.76.0",
+    "react-native-web": "0.21.0",
     "typescript": "^5.7.3",
     "vite": "^6.0.0",
-    "react": "*",
-    "react-native": "*",
-    "rozenite": "1.0.0-alpha.2",
-    "@rozenite/vite-plugin": "1.0.0-alpha.1"
+    "rozenite": "1.0.0-alpha.10",
+    "@rozenite/vite-plugin": "1.0.0-alpha.10"
   },
   "peerDependencies": {
-    "react": ">= 17.0.0",
-    "react-native": ">= 0.74.0",
-    "@tanstack/react-query": "^5.0.0"
+    "@tanstack/react-query": "^5.0.0",
+    "react": "*",
+    "react-native": "*"
   },
   "license": "MIT",
   "scripts": {

package/project.json

@@ -0,0 +1,12 @@
+{
+  "$schema": "../../node_modules/nx/schemas/project-schema.json",
+  "name": "@rozenite/tanstack-query-plugin",
+  "targets": {
+    "build": {
+      "cache": true,
+      "dependsOn": ["^build"],
+      "inputs": ["{projectRoot}/src/**/*"],
+      "outputs": ["{projectRoot}/dist"]
+    }
+  }
+}

package/react-native.ts

@@ -1,8 +1,8 @@
-
 export let useTanStackQueryDevTools: typeof import('./src/react-native/useTanStackQueryDevTools').useTanStackQueryDevTools;
 
 if (process.env.NODE_ENV !== 'production') {
-  useTanStackQueryDevTools = require('./src/react-native/useTanStackQueryDevTools').useTanStackQueryDevTools;
+  useTanStackQueryDevTools =
+    require('./src/react-native/useTanStackQueryDevTools').useTanStackQueryDevTools;
 } else {
   useTanStackQueryDevTools = () => ({ isConnected: false });
 }