@devite/nuxt-sanity 2.2.1 → 2.3.0

package/dist/module.json

@@ -1,6 +1,6 @@
 {
   "name": "@devite/nuxt-sanity",
-  "version": "2.2.1",
+  "version": "2.3.0",
   "configKey": "sanity",
   "builder": {
     "@nuxt/module-builder": "0.8.4",

package/dist/module.mjs

@@ -3,7 +3,7 @@ import { defineNuxtModule, createResolver, addPlugin, addServerHandler, addImpor
 import defu from 'defu';
 
 const name = "@devite/nuxt-sanity";
-const version = "2.2.1";
+const version = "2.3.0";
 
 const module = defineNuxtModule({
   meta: {

package/dist/runtime/components/SanityImageAsset.vue

@@ -15,14 +15,22 @@
 
 <script setup lang="ts">
 import type { ImageAsset, Reference } from '@sanity/types'
-import type { Ref } from 'vue'
 import { resolveImageAssetById } from '../utils/resolveImageAssetById'
+import { useLazyAsyncData, useAsyncData, useId } from '#imports'
 
-const { asset, loading = 'lazy' } = defineProps<{
-  asset?: ImageAsset | Reference
+const props = defineProps<{
+  asset?: ImageAsset | Reference | null
   loading?: 'eager' | 'lazy'
 }>()
-const imageAsset: Ref<ImageAsset | null> | ImageAsset | undefined = asset?._ref
-  ? await resolveImageAssetById((asset as Reference)._ref)
-  : (asset as ImageAsset | undefined)
+
+const { data: imageAsset } = (
+  props.loading !== 'eager' ? useLazyAsyncData : useAsyncData
+)<ImageAsset | null>(
+  useId(),
+  async () =>
+    props.asset?._ref
+      ? (await resolveImageAssetById((props.asset as Reference)._ref)).value
+      : ((props.asset || null) as ImageAsset | null),
+  { watch: [props] },
+)
 </script>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@devite/nuxt-sanity",
-  "version": "2.2.1",
+  "version": "2.3.0",
   "description": "Advanced Sanity integration for Nuxt.js.",
   "repository": "devite-io/nuxt-sanity",
   "license": "MIT",