@mearie/vue 0.3.5 → 0.4.0

package/dist/index.cjs

@@ -19,7 +19,7 @@ const useClient = () => {
 const useQuery = ((query, variables, options) => {
 	const client = useClient();
 	const initialOpts = (0, vue.toValue)(options);
-	const data = (0, vue.ref)(initialOpts?.initialData);
+	const data = (0, vue.shallowRef)(initialOpts?.initialData ? (0, vue.reactive)(initialOpts.initialData) : void 0);
 	const loading = (0, vue.ref)(!initialOpts?.skip && !initialOpts?.initialData);
 	const error = (0, vue.ref)(void 0);
 	const metadata = (0, vue.ref)();
@@ -40,7 +40,11 @@ const useQuery = ((query, variables, options) => {
 				error.value = new _mearie_core.AggregatedError(result.errors);
 				loading.value = false;
 			} else {
-				data.value = result.data;
+				const patches = result.metadata?.cache?.patches;
+				if (patches) {
+					const root = (0, _mearie_core.applyPatchesMutable)(data.value, patches);
+					if (root !== void 0) data.value = (0, vue.reactive)(root);
+				} else data.value = (0, vue.reactive)(result.data);
 				loading.value = false;
 				error.value = void 0;
 			}
@@ -158,8 +162,8 @@ const useFragment = ((fragment, fragmentRef, ...[options]) => {
 		initialData = result.data;
 		initialMetadata = result.metadata;
 	}
-	const data = (0, vue.ref)(initialData);
-	const metadata = (0, vue.ref)(initialMetadata);
+	const data = (0, vue.shallowRef)(initialData == null ? initialData : (0, vue.reactive)(initialData));
+	const metadata = (0, vue.shallowRef)(initialMetadata);
 	(0, vue.watchEffect)((onCleanup) => {
 		const currentRef = (0, vue.toValue)(fragmentRef);
 		if (currentRef == null) {
@@ -169,7 +173,11 @@ const useFragment = ((fragment, fragmentRef, ...[options]) => {
 		}
 		const unsubscribe = (0, _mearie_core_stream.pipe)(client.executeFragment(fragment, currentRef, (0, vue.toValue)(options)), (0, _mearie_core_stream.subscribe)({ next: (result) => {
 			metadata.value = result.metadata;
-			if (result.data !== void 0) data.value = result.data;
+			const patches = result.metadata?.cache?.patches;
+			if (patches) {
+				const root = (0, _mearie_core.applyPatchesMutable)(data.value, patches);
+				if (root !== void 0) data.value = (0, vue.reactive)(root);
+			} else if (result.data !== void 0) data.value = (0, vue.reactive)(result.data);
 		} }));
 		onCleanup(() => unsubscribe());
 	});

package/dist/index.mjs

@@ -1,5 +1,5 @@
-import { AggregatedError } from "@mearie/core";
-import { inject, ref, toValue, watchEffect } from "vue";
+import { AggregatedError, applyPatchesMutable } from "@mearie/core";
+import { inject, reactive, ref, shallowRef, toValue, watchEffect } from "vue";
 import { collect, peek, pipe, subscribe, take } from "@mearie/core/stream";
 
 export * from "@mearie/core"
@@ -20,7 +20,7 @@ const useClient = () => {
 const useQuery = ((query, variables, options) => {
 	const client = useClient();
 	const initialOpts = toValue(options);
-	const data = ref(initialOpts?.initialData);
+	const data = shallowRef(initialOpts?.initialData ? reactive(initialOpts.initialData) : void 0);
 	const loading = ref(!initialOpts?.skip && !initialOpts?.initialData);
 	const error = ref(void 0);
 	const metadata = ref();
@@ -41,7 +41,11 @@ const useQuery = ((query, variables, options) => {
 				error.value = new AggregatedError(result.errors);
 				loading.value = false;
 			} else {
-				data.value = result.data;
+				const patches = result.metadata?.cache?.patches;
+				if (patches) {
+					const root = applyPatchesMutable(data.value, patches);
+					if (root !== void 0) data.value = reactive(root);
+				} else data.value = reactive(result.data);
 				loading.value = false;
 				error.value = void 0;
 			}
@@ -159,8 +163,8 @@ const useFragment = ((fragment, fragmentRef, ...[options]) => {
 		initialData = result.data;
 		initialMetadata = result.metadata;
 	}
-	const data = ref(initialData);
-	const metadata = ref(initialMetadata);
+	const data = shallowRef(initialData == null ? initialData : reactive(initialData));
+	const metadata = shallowRef(initialMetadata);
 	watchEffect((onCleanup) => {
 		const currentRef = toValue(fragmentRef);
 		if (currentRef == null) {
@@ -170,7 +174,11 @@ const useFragment = ((fragment, fragmentRef, ...[options]) => {
 		}
 		const unsubscribe = pipe(client.executeFragment(fragment, currentRef, toValue(options)), subscribe({ next: (result) => {
 			metadata.value = result.metadata;
-			if (result.data !== void 0) data.value = result.data;
+			const patches = result.metadata?.cache?.patches;
+			if (patches) {
+				const root = applyPatchesMutable(data.value, patches);
+				if (root !== void 0) data.value = reactive(root);
+			} else if (result.data !== void 0) data.value = reactive(result.data);
 		} }));
 		onCleanup(() => unsubscribe());
 	});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mearie/vue",
-  "version": "0.3.5",
+  "version": "0.4.0",
   "description": "Type-safe, zero-overhead GraphQL client",
   "keywords": [
     "graphql",
@@ -52,9 +52,11 @@
     "README.md"
   ],
   "dependencies": {
-    "@mearie/core": "0.5.2"
+    "@mearie/core": "0.6.0"
   },
   "devDependencies": {
+    "@vitejs/plugin-vue": "^6.0.4",
+    "happy-dom": "^20.8.3",
     "tsdown": "^0.20.3",
     "typescript": "^5.9.3",
     "vue": "^3.5.29"