@devite/nuxt-sanity 1.1.3 → 1.3.0

package/dist/module.json

@@ -1,9 +1,9 @@
 {
   "name": "@devite/nuxt-sanity",
   "configKey": "@devite/nuxt-sanity",
-  "version": "1.1.3",
+  "version": "1.3.0",
   "builder": {
     "@nuxt/module-builder": "0.8.4",
-    "unbuild": "unknown"
+    "unbuild": "2.0.0"
   }
 }

package/dist/runtime/components/SanityComponent.vue

@@ -2,7 +2,8 @@
   <component
     :is="component"
     v-if="data"
-    :data="data"
+    ref="componentRef"
+    v-bind="{ ...$props, ...$attrs }"
   >
     <slot />
   </component>
@@ -10,7 +11,7 @@
 
 <script setup lang="ts">
 import type { Component } from '@nuxt/schema'
-import { computed, resolveComponent } from '#imports'
+import { computed, ref, resolveComponent } from '#imports'
 import { SanityLinkExternal, SanityLinkInternal, SanityRichText } from '#components'
 
 const { data } = defineProps<{ data?: object }>()
@@ -24,7 +25,7 @@ const component = computed<Component>(() => {
     case 'linkExternal':
       return SanityLinkExternal
     default:
-      if (data?.constructor.name === 'Array' && data.every(item => item._type === 'block'))
+      if (data?.constructor.name === 'Array' && data.every((item) => item._type === 'block'))
         return SanityRichText
       else if (type) {
         const upperCamelCase = type.charAt(0).toUpperCase() + type.slice(1)
@@ -35,4 +36,7 @@ const component = computed<Component>(() => {
 
   return null
 })
+
+const componentRef = ref<Component>()
+defineExpose({ componentRef })
 </script>

package/dist/runtime/components/SanityImageAsset.vue

@@ -1,14 +1,14 @@
 <template>
   <NuxtImg
-    v-if="asset?._id"
+    v-if="imageAsset?._id"
     densities="x1 x2"
-    :src="asset._id"
-    :width="asset.metadata.dimensions.width"
-    :height="asset.metadata.dimensions.height"
-    :alt="asset.altText"
-    :placeholder="asset.metadata.lqip"
+    :src="imageAsset._id"
+    :width="imageAsset.metadata.dimensions.width"
+    :height="imageAsset.metadata.dimensions.height"
+    :alt="imageAsset.altText"
+    :placeholder="imageAsset.metadata.lqip"
     :loading="loading"
-    :format="asset.mimeType === 'image/svg+xml' ? undefined : 'webp'"
+    :format="imageAsset.mimeType === 'image/svg+xml' ? undefined : 'webp'"
     draggable="false"
   />
 </template>
@@ -16,5 +16,6 @@
 <script setup lang="ts">
 import type { ImageAsset } from '@sanity/types'
 
-const { loading = 'lazy' } = defineProps<{ asset: ImageAsset, loading?: 'lazy' | 'eager' }>()
+const { asset, loading = 'lazy' } = defineProps<{ asset?: ImageAsset, loading?: 'lazy' | 'eager' }>()
+const imageAsset = asset?._ref ? await resolveImageAssetById(asset._ref) : asset
 </script>

package/dist/runtime/components/SanityPage.vue

@@ -9,7 +9,7 @@
 </template>
 
 <script setup lang="ts">
-import { useSanityQuery } from '@nuxtjs/sanity/runtime/composables'
+import { useSanityQuery } from '@nuxtjs/sanity/runtime/composables/visual-editing'
 import { groq } from '@nuxtjs/sanity/runtime/groq'
 import type { ComputedRef } from 'vue'
 import type { ImageAsset } from '@sanity/types'
@@ -18,15 +18,13 @@ import type { Page } from '../types/documents/Page'
 import type { NotFound } from '../types/singletons/NotFound'
 import type { GlobalSEO } from '../types/objects/global/GlobalSEO'
 import { IMAGE_WITHOUT_PREVIEW_PROJECTION } from '../utils/projections'
-import { useHead, useRoute, useRuntimeConfig, useSeoMeta } from '#app'
-import { computed } from '#imports'
-
-const { baseURL } = useRuntimeConfig().public
+import { useHead, useRoute, useRuntimeConfig, useSeoMeta, computed } from '#imports'
 
 const path = useRoute().fullPath
 const groqFilter = path === '/' ? '_type == "home"' : `_type == "page" && slug.current == $slug`
 const { data: sanityData } = await useSanityQuery<Home | Page | NotFound>(groq`*[(${groqFilter}) || _type == "notFound"][0] { _id, _type, title, modules, seo { _type, indexable, title, shortTitle, description, image ${IMAGE_WITHOUT_PREVIEW_PROJECTION} } }`, { slug: path.substring(1) })
 
+const { baseURL } = useRuntimeConfig().public
 const seo = computed(() => sanityData.value?.seo)
 const url = computed(() => baseURL + (sanityData.value?.slug || '/'))
 

package/dist/runtime/utils/resolveImageAssetById.d.ts

@@ -1,2 +1,3 @@
 import type { ImageAsset } from '@sanity/types';
-export declare const resolveImageAssetById: (id: string) => Promise<ImageAsset | undefined>;
+import type { Ref } from '#imports';
+export declare const resolveImageAssetById: (id: string) => Promise<Ref<ImageAsset | undefined>>;

package/dist/runtime/utils/resolveImageAssetById.js

@@ -1,5 +1,5 @@
 import { useSanityQuery } from "@nuxtjs/sanity/runtime/composables";
 import { IMAGE_ASSET_PROJECTION } from "./projections.js";
 export const resolveImageAssetById = async (id) => {
-  return (await useSanityQuery(`*[_type == "sanity.imageAsset" && _id == $assetId][0] ${IMAGE_ASSET_PROJECTION}`, { assetId: id })).data.value;
+  return (await useSanityQuery(`*[_type == "sanity.imageAsset" && _id == $assetId][0] ${IMAGE_ASSET_PROJECTION}`, { assetId: id })).data;
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@devite/nuxt-sanity",
-  "version": "1.1.3",
+  "version": "1.3.0",
   "description": "Provides additional helper components and utilities for the Nuxt.js Sanity module",
   "repository": "devite-io/nuxt-sanity",
   "license": "MIT",
@@ -22,20 +22,22 @@
     "dist"
   ],
   "dependencies": {
+    "@nuxt/image": "^1.8.0",
     "@nuxt/kit": "^3.13.2",
     "@nuxtjs/sanity": "^1.12.1",
-    "@sanity/types": "^3.57.3"
+    "@portabletext/vue": "^1.0.11",
+    "@sanity/client": "^6.22.0",
+    "@sanity/types": "^3.59.0"
   },
   "devDependencies": {
-    "@nuxt/devtools": "^1.4.2",
+    "@nuxt/devtools": "^1.5.1",
     "@nuxt/eslint-config": "^0.5.7",
     "@nuxt/module-builder": "^0.8.4",
     "@nuxt/schema": "^3.13.2",
     "@nuxt/test-utils": "^3.14.2",
-    "@portabletext/vue": "^1.0.11",
     "@types/node": "latest",
-    "changelogen": "^0.5.5",
-    "eslint": "^9.10.0",
+    "changelogen": "^0.5.7",
+    "eslint": "^9.11.1",
     "nuxt": "^3.13.2",
     "typescript": "latest",
     "vitest": "^2.1.1",