@devite/nuxt-sanity 2.10.2 → 2.11.0

package/dist/module.json

@@ -1,6 +1,6 @@
 {
   "name": "@devite/nuxt-sanity",
-  "version": "2.10.2",
+  "version": "2.11.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.10.2";
+const version = "2.11.0";
 
 const CONFIG_KEY = "sanity";
 const module = defineNuxtModule({
@@ -193,7 +193,12 @@ const module = defineNuxtModule({
     await installModule("@nuxt/image", {
       providers: {
         cachedSanity: {
-          provider: resolve("runtime/imageProviders/sanity")
+          provider: resolve("runtime/imageProviders/sanity"),
+          options: {
+            projectId: moduleConfig.projectId,
+            dataset: moduleConfig.dataset,
+            cacheEndpoint: typeof moduleConfig.minimalClient === "object" && moduleConfig.minimalClient.cachingEnabled && moduleConfig.minimalClient.cacheClientBaseUrl + moduleConfig.minimalClient.assetEndpoint || void 0
+          }
         }
       }
     }, nuxt);

package/dist/runtime/components/SanityPictureAsset.vue

@@ -0,0 +1,48 @@
+<template>
+  <NuxtPicture
+    v-if="imageAsset?._id"
+    densities="x1 x2"
+    :src="imageAsset._id"
+    :width="imageAsset.metadata.dimensions.width"
+    :height="imageAsset.metadata.dimensions.height"
+    :alt="imageAsset.altText as (string | undefined)"
+    :placeholder="loading === 'eager' || !lqip ? undefined : imageAsset.metadata.lqip"
+    :loading="loading || 'lazy'"
+    :format="imageAsset.mimeType === 'image/svg+xml' ? undefined : 'webp'"
+    :img-attrs="{ ...imgAttrs, draggable: false }"
+    provider="cachedSanity"
+  >
+    <slot />
+  </NuxtPicture>
+</template>
+
+<script setup lang="ts">
+import type { ImageAsset, Reference } from '@sanity/types'
+import { ref, watch } from 'vue'
+import { resolveImageAssetById } from '#imports'
+
+const props = defineProps<{
+  asset?: ImageAsset | Reference | null
+  loading?: 'eager' | 'lazy'
+  lqip?: boolean
+  imgAttrs?: Record<string, unknown>
+}>()
+const imageAsset = ref<ImageAsset | null>(null)
+let unwatchFunc = undefined as (() => void) | undefined
+
+async function resolveImageAsset() {
+  if (props.asset?._ref) {
+    const assetRef = await resolveImageAssetById((props.asset as Reference)._ref, false)
+
+    imageAsset.value = assetRef.value
+
+    unwatchFunc?.()
+    unwatchFunc = watch(assetRef, (updatedAsset) => imageAsset.value = updatedAsset)
+    return
+  }
+
+  imageAsset.value = (props.asset || null) as ImageAsset | null
+}
+
+await resolveImageAsset()
+</script>

package/dist/runtime/imageProviders/sanity.d.ts

@@ -1,2 +1,2 @@
-import type { ProviderGetImage } from '@nuxt/image';
-export declare const getImage: ProviderGetImage;
+import type { ImageCTX, ImageOptions, ResolvedImage } from '@nuxt/image';
+export declare function getImage(src: string, { modifiers, projectId, dataset, cacheEndpoint }: ImageOptions, context: ImageCTX): ResolvedImage;

package/dist/runtime/imageProviders/sanity.js

@@ -1,16 +1,11 @@
-import { joinURL } from "ufo";
 import { useSanityVisualEditingState } from "../composables/useSanityVisualEditingState.js";
-import { useRuntimeConfig } from "#imports";
 import { getImage as getSanityImage } from "#image/providers/sanity";
-export const getImage = (src, { modifiers = {} } = {}, ctx) => {
-  const sanityConfig = useRuntimeConfig().public.sanity;
-  const minimalClientConfig = sanityConfig.minimalClient;
-  const useCaching = typeof minimalClientConfig === "object" && minimalClientConfig.cachingEnabled;
-  if (useCaching && minimalClientConfig.cacheClientBaseUrl && !useSanityVisualEditingState().enabled) {
+export function getImage(src, { modifiers = {}, projectId, dataset, cacheEndpoint }, context) {
+  if (cacheEndpoint && !(import.meta.client && useSanityVisualEditingState().enabled)) {
     const params = new URLSearchParams();
     params.set("src", src);
     params.set("modifiers", JSON.stringify(modifiers));
-    return { url: joinURL(minimalClientConfig.cacheClientBaseUrl, minimalClientConfig.assetEndpoint + `?${params.toString()}`) };
+    return { url: cacheEndpoint + `?${params.toString()}` };
   }
-  return getSanityImage(src, { modifiers, projectId: sanityConfig.projectId, dataset: sanityConfig.dataset }, ctx);
-};
+  return getSanityImage(src, { modifiers, projectId, dataset }, context);
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@devite/nuxt-sanity",
-  "version": "2.10.2",
+  "version": "2.11.0",
   "description": "Advanced Sanity integration for Nuxt.js.",
   "repository": "devite-io/nuxt-sanity",
   "license": "MIT",
@@ -29,11 +29,11 @@
   "dependencies": {
     "@nuxt/image": "^1.10.0",
     "@portabletext/vue": "^1.0.12",
-    "@sanity/client": "^6.28.4",
-    "@sanity/core-loader": "^1.8.1",
-    "@sanity/preview-url-secret": "^2.1.7",
-    "@sanity/types": "^3.83.0",
-    "@sanity/visual-editing": "^2.13.15",
+    "@sanity/client": "^6.29.0",
+    "@sanity/core-loader": "^1.8.5",
+    "@sanity/preview-url-secret": "^2.1.8",
+    "@sanity/types": "^3.86.0",
+    "@sanity/visual-editing": "^2.13.18",
     "defu": "^6.1.4",
     "ofetch": "^1.4.1",
     "ohash": "^1.1.6",
@@ -47,7 +47,7 @@
     "@nuxt/test-utils": "^3.17.2",
     "@types/node": "latest",
     "changelogen": "^0.5.7",
-    "eslint": "^9.24.0",
+    "eslint": "^9.25.1",
     "h3": "^1.15.1",
     "nuxt": "^3.16.2",
     "typescript": "5.6.3",
@@ -56,7 +56,7 @@
     "vitest-environment-nuxt": "1.0.1",
     "vue": "3.5.13",
     "vue-router": "^4.5.0",
-    "vue-tsc": "^2.2.8"
+    "vue-tsc": "^2.2.10"
   },
   "resolutions": {
     "@devite/nuxt-sanity": "link:."