@nuxtjs/prismic 4.0.0 → 4.1.0-pr.235.94cfeb5

package/src/runtime/plugin.client.ts

@@ -1,15 +1,19 @@
-import type { PrismicModuleOptions } from '../types'
-import { defineNuxtPlugin } from '#app'
-import { refreshNuxtData, useRuntimeConfig } from '#imports'
+import { defineNuxtPlugin } from "#app"
+import { refreshNuxtData, useRuntimeConfig } from "#imports"
 
-export default defineNuxtPlugin((_nuxtApp) => {
-	const options: PrismicModuleOptions = useRuntimeConfig().public.prismic
+export default defineNuxtPlugin({
+	name: "prismic:plugin:client",
+	parallel: true,
+	setup() {
+		hotReloadPrismicPreview()
 
-	// Hot reload preview updates
-	if (options.preview) {
-		window.addEventListener('prismicPreviewUpdate', (event) => {
-			event.preventDefault()
-			refreshNuxtData()
-		})
-	}
+		function hotReloadPrismicPreview() {
+			if (useRuntimeConfig().public.prismic?.preview) {
+				window.addEventListener("prismicPreviewUpdate", (event) => {
+					event.preventDefault()
+					refreshNuxtData()
+				})
+			}
+		}
+	},
 })

package/src/runtime/plugin.ts

@@ -1,127 +1,138 @@
-import { createClient, type Client } from '@prismicio/client'
-import { createPrismic } from '@prismicio/vue'
-
-import type { PrismicModuleOptions } from '../types'
-import { defineNuxtPlugin } from '#app'
-import NuxtLink from '#app/components/nuxt-link'
-import { useCookie, useRequestEvent, onNuxtReady, refreshNuxtData, useHead, useRuntimeConfig, useRouter } from '#imports'
-
-// @ts-expect-error vfs cannot be resolved here
-import _client from '#build/prismic/proxy/client'
-// @ts-expect-error vfs cannot be resolved here
-import linkResolver from '#build/prismic/proxy/linkResolver'
-// @ts-expect-error vfs cannot be resolved here
-import richTextSerializer from '#build/prismic/proxy/richTextSerializer'
-// @ts-expect-error vfs cannot be resolved here
-import linkRel from '#build/prismic/proxy/linkRel'
-// @ts-expect-error vfs cannot be resolved here
-import richTextComponents from '#build/prismic/proxy/richTextComponents'
-// @ts-expect-error vfs cannot be resolved here
-import sliceZoneDefaultComponent from '#build/prismic/proxy/sliceZoneDefaultComponent'
+import { defineNuxtPlugin } from "#app"
+import NuxtLink from "#app/components/nuxt-link"
+import _client from "#build/prismic/proxy/client"
+// @ts-expect-error - Proxy file
+import defaultComponents from "#build/prismic/proxy/defaultComponents"
+// @ts-expect-error - Proxy file
+import linkResolver from "#build/prismic/proxy/linkResolver"
+import {
+	onNuxtReady,
+	refreshNuxtData,
+	useCookie,
+	useHead,
+	useRequestEvent,
+	useRouter,
+	useRuntimeConfig,
+} from "#imports"
+import { Client, createClient } from "@prismicio/client"
+import { createPrismic } from "@prismicio/vue"
 
 export default defineNuxtPlugin({
-	name: 'prismic:setup',
+	name: "prismic:setup",
 	parallel: true,
 	async setup(nuxtApp) {
-		const options: PrismicModuleOptions = useRuntimeConfig().public.prismic
-		let client: Client | undefined
-		if (typeof _client === 'function') {
-			try {
-				client = await nuxtApp.runWithContext(() => _client())
-			}
-			catch (error) {
-				console.error('[@nuxtjs/prismic] An error happened while resolving your Prismic custom client, disabling Prismic module gracefully...', error)
+		const options = useRuntimeConfig().public.prismic
+
+		const client = await resolveClient()
+		handlePreview()
+		addToolbar()
 
-				// The Vue plugin still requires a client to work, we're providing an obviously broken one.
-				client = createClient(
-					'error-resolving-custom-client',
-					{ ...options, documentAPIEndpoint: undefined },
+		async function resolveClient() {
+			if ((_client as unknown) instanceof Client) {
+				return _client!
+			} else if (typeof _client === "function") {
+				try {
+					return await nuxtApp.runWithContext(() =>
+						(_client as unknown as () => Client)(),
+					)
+				} catch (error) {
+					console.error(
+						"[@nuxtjs/prismic] An error happened while resolving your Prismic custom client, disabling Prismic module gracefully...",
+						error,
+					)
+
+					// The Vue plugin still requires a client to work, we're providing an obviously broken one.
+					return createClient(
+						"error-resolving-custom-client",
+						options.clientConfig,
+					)
+				}
+			} else {
+				return createClient(
+					options.environment || options.endpoint || "endpoint-not-provided",
+					options.clientConfig,
 				)
 			}
 		}
-		else {
-			client = _client
-		}
-
-		const endpoint = options.environment || options.endpoint || client?.documentAPIEndpoint || ''
-
-		const prismicPlugin = createPrismic({
-			...options,
-			endpoint,
-			// TypeScript expects either an endpoint of a client, not both
-			client: client as undefined,
-			linkResolver,
-			richTextSerializer,
-			injectComponents: false, // Handled at module level
-			components: {
-				linkInternalComponent: NuxtLink,
-				linkExternalComponent: NuxtLink,
-				...options.components,
-				linkRel,
-				richTextComponents,
-				sliceZoneDefaultComponent,
-			},
-		})
 
-		nuxtApp.vueApp.use(prismicPlugin)
-
-		if (options.preview) {
-			const previewCookie = useCookie('io.prismic.preview').value
+		function handlePreview() {
+			if (options.preview) {
+				const previewCookie = useCookie("io.prismic.preview").value
 
-			// Update client with req when running server side
-			if (import.meta.server) {
-				const req = useRequestEvent()?.node.req
-				if (req) {
-					prismicPlugin.client.enableAutoPreviewsFromReq(req)
+				// Update client with req when running server side
+				if (import.meta.server) {
+					const req = useRequestEvent()?.node.req
+					if (req) {
+						client.enableAutoPreviewsFromReq(req)
+					}
 				}
-			}
 
-			if (previewCookie) {
-				try {
-					const session = typeof previewCookie === 'string' ? JSON.parse(decodeURIComponent(previewCookie)) : previewCookie
+				if (previewCookie) {
+					try {
+						const session =
+							typeof previewCookie === "string"
+								? JSON.parse(decodeURIComponent(previewCookie))
+								: previewCookie
 
-					if (Object.keys(session).some(key =>
-						key in session
-						&& typeof session[key] === 'object'
-						&& session[key] !== null
-						&& 'preview' in session[key]
-						&& session[key].preview)
-					) {
-						let afterEachCalled = false
-						onNuxtReady(() => {
-							if (!afterEachCalled) {
+						if (
+							Object.keys(session).some(
+								(key) =>
+									key in session &&
+									typeof session[key] === "object" &&
+									session[key] !== null &&
+									"preview" in session[key] &&
+									session[key].preview,
+							)
+						) {
+							let afterEachCalled = false
+							onNuxtReady(() => {
+								if (!afterEachCalled) {
+									refreshNuxtData()
+								}
+							})
+							useRouter().afterEach(() => {
+								afterEachCalled = true
 								refreshNuxtData()
-							}
-						})
-						useRouter().afterEach(() => {
-							afterEachCalled = true
-							refreshNuxtData()
-						})
+							})
+						}
+					} catch (error) {
+						console.warn("Failed to parse Prismic preview cookie", error)
 					}
 				}
-				catch (error) {
-					console.warn('Failed to parse Prismic preview cookie', error)
-				}
 			}
 		}
 
-		if (options.toolbar && prismicPlugin.client?.repositoryName) {
-			// Add toolbar
-			useHead({
-				script: [{
-					key: 'prismic-preview',
-					src: `https://static.cdn.prismic.io/prismic.min.js?repo=${prismicPlugin.client.repositoryName}&new=true`,
-					async: true,
-					defer: true,
-					crossorigin: 'anonymous',
-				}],
-			})
-		}
-		else {
-			// TODO: We might want to let user disable this behavior because it might have unexpected side effects
-			useCookie('io.prismic.preview').value = null
+		function addToolbar() {
+			if (options.toolbar) {
+				// Add toolbar
+				useHead({
+					script: [
+						{
+							key: "prismic-preview",
+							src: `https://static.cdn.prismic.io/prismic.min.js?repo=${client.repositoryName}&new=true`,
+							async: true,
+							defer: true,
+							crossorigin: "anonymous",
+						},
+					],
+				})
+			} else {
+				// TODO: We might want to let user disable this behavior because it might have unexpected side effects
+				useCookie("io.prismic.preview").value = null
+			}
 		}
 
+		const prismicPlugin = createPrismic({
+			client,
+			componentsConfig: {
+				linkResolver,
+				linkInternalComponent: NuxtLink,
+				linkExternalComponent: NuxtLink,
+				defaultComponents,
+			},
+		})
+
+		nuxtApp.vueApp.use(prismicPlugin)
 		return {
 			provide: { prismic: prismicPlugin },
 		}

package/src/runtime/usePrismicPreview.ts

@@ -1,18 +1,14 @@
-import { onMounted } from 'vue'
+// @ts-expect-error - Proxy file
+import { usePrismic, useRouter } from "#imports"
+import { onMounted } from "vue"
 
-import { useRouter, usePrismic } from '#imports'
-
-/**
- * Resolves Prismic previews on the preview entry page (`/preview`)
- *
- * @param defaultURL - The default URL to redirect to if the previewed document doesn't map to one.
- */
-export const usePrismicPreview = (defaultURL = '/'): void => {
-	const { client, options: { linkResolver } } = usePrismic()
+/** Resolves Prismic previews on the preview entry page (`/preview`) */
+export const usePrismicPreview = (defaultURL = "/"): void => {
+	const { client, componentsConfig } = usePrismic()
 	const { push } = useRouter()
 	onMounted(async () => {
 		const redirectURL = await client.resolvePreviewURL({
-			linkResolver,
+			linkResolver: componentsConfig.linkResolver,
 			defaultURL,
 		})
 

package/dist/client/200.html

@@ -1 +0,0 @@
-<!DOCTYPE html><html  data-capo=""><head><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1"><link rel="stylesheet" href="/__prismic-client/_nuxt/entry.BC9BDAld.css" crossorigin><link rel="modulepreload" as="script" crossorigin href="/__prismic-client/_nuxt/BQB6UGbx.js"><link rel="prefetch" as="style" crossorigin href="/__prismic-client/_nuxt/error-404.smTsHvdw.css"><link rel="prefetch" as="script" crossorigin href="/__prismic-client/_nuxt/V_weDLQm.js"><link rel="prefetch" as="script" crossorigin href="/__prismic-client/_nuxt/BMD6bpEv.js"><link rel="prefetch" as="script" crossorigin href="/__prismic-client/_nuxt/DlAUqK2U.js"><link rel="prefetch" as="script" crossorigin href="/__prismic-client/_nuxt/CkG7IjgS.js"><link rel="prefetch" as="style" crossorigin href="/__prismic-client/_nuxt/error-500.Bo-s0s94.css"><link rel="prefetch" as="script" crossorigin href="/__prismic-client/_nuxt/H1okkFcd.js"><script type="module" src="/__prismic-client/_nuxt/BQB6UGbx.js" crossorigin></script></head><body><div id="__nuxt"></div><div id="teleports"></div><script type="application/json" data-nuxt-data="nuxt-app" data-ssr="false" id="__NUXT_DATA__">[{"prerenderedAt":1,"serverRendered":2},1737402154202,false]</script><script>window.__NUXT__={};window.__NUXT__.config={public:{},app:{baseURL:"/__prismic-client",buildId:"ef21bbff-0463-480b-852c-adffad3f33b7",buildAssetsDir:"/_nuxt/",cdnURL:""}}</script></body></html>

package/dist/client/404.html

@@ -1 +0,0 @@
-<!DOCTYPE html><html  data-capo=""><head><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1"><link rel="stylesheet" href="/__prismic-client/_nuxt/entry.BC9BDAld.css" crossorigin><link rel="modulepreload" as="script" crossorigin href="/__prismic-client/_nuxt/BQB6UGbx.js"><link rel="prefetch" as="style" crossorigin href="/__prismic-client/_nuxt/error-404.smTsHvdw.css"><link rel="prefetch" as="script" crossorigin href="/__prismic-client/_nuxt/V_weDLQm.js"><link rel="prefetch" as="script" crossorigin href="/__prismic-client/_nuxt/BMD6bpEv.js"><link rel="prefetch" as="script" crossorigin href="/__prismic-client/_nuxt/DlAUqK2U.js"><link rel="prefetch" as="script" crossorigin href="/__prismic-client/_nuxt/CkG7IjgS.js"><link rel="prefetch" as="style" crossorigin href="/__prismic-client/_nuxt/error-500.Bo-s0s94.css"><link rel="prefetch" as="script" crossorigin href="/__prismic-client/_nuxt/H1okkFcd.js"><script type="module" src="/__prismic-client/_nuxt/BQB6UGbx.js" crossorigin></script></head><body><div id="__nuxt"></div><div id="teleports"></div><script type="application/json" data-nuxt-data="nuxt-app" data-ssr="false" id="__NUXT_DATA__">[{"prerenderedAt":1,"serverRendered":2},1737402154202,false]</script><script>window.__NUXT__={};window.__NUXT__.config={public:{},app:{baseURL:"/__prismic-client",buildId:"ef21bbff-0463-480b-852c-adffad3f33b7",buildAssetsDir:"/_nuxt/",cdnURL:""}}</script></body></html>

package/dist/client/_nuxt/BMD6bpEv.js

@@ -1 +0,0 @@
-import{B as S,m as B,r as w,C as _,D as E,E as T,F as U,g as I,G as F,H as A,I as L,J as H,K as D,u as x,L as N,M as O,N as V,O as M,P as z,Q as W,R as G}from"./BQB6UGbx.js";async function j(t,a=S()){const{path:v,matched:p}=a.resolve(t);if(!p.length||(a._routePreloaded||(a._routePreloaded=new Set),a._routePreloaded.has(v)))return;const g=a._preloadPromises=a._preloadPromises||[];if(g.length>4)return Promise.all(g).then(()=>j(t,a));a._routePreloaded.add(v);const e=p.map(n=>{var s;return(s=n.components)==null?void 0:s.default}).filter(n=>typeof n=="function");for(const n of e){const s=Promise.resolve(n()).catch(()=>{}).finally(()=>g.splice(g.indexOf(s)));g.push(s)}await Promise.all(g)}const Q=(...t)=>t.find(a=>a!==void 0);function $(t){const a=t.componentName||"NuxtLink";function v(e){return typeof e=="string"&&e.startsWith("#")}function p(e,n){if(!e||t.trailingSlash!=="append"&&t.trailingSlash!=="remove")return e;if(typeof e=="string")return k(e,t.trailingSlash);const s="path"in e&&e.path!==void 0?e.path:n(e).path;return{...e,name:void 0,path:k(s,t.trailingSlash)}}function g(e){const n=S(),s=z(),u=x(()=>!!e.target&&e.target!=="_self"),d=x(()=>{const f=e.to||e.href||"";return typeof f=="string"&&N(f,{acceptRelative:!0})}),P=L("RouterLink"),y=P&&typeof P!="string"?P.useLink:void 0,m=x(()=>{if(e.external)return!0;const f=e.to||e.href||"";return typeof f=="object"?!1:f===""||d.value}),r=x(()=>{const f=e.to||e.href||"";return m.value?f:p(f,n.resolve)}),c=m.value||y==null?void 0:y({...e,to:r}),b=x(()=>{var f;if(!r.value||d.value||v(r.value))return r.value;if(m.value){const C=typeof r.value=="object"&&"path"in r.value?O(r.value):r.value,R=typeof C=="object"?n.resolve(C).href:C;return p(R,n.resolve)}return typeof r.value=="object"?((f=n.resolve(r.value))==null?void 0:f.href)??null:p(V(s.app.baseURL,r.value),n.resolve)});return{to:r,hasTarget:u,isAbsoluteUrl:d,isExternal:m,href:b,isActive:(c==null?void 0:c.isActive)??x(()=>r.value===n.currentRoute.value.path),isExactActive:(c==null?void 0:c.isExactActive)??x(()=>r.value===n.currentRoute.value.path),route:(c==null?void 0:c.route)??x(()=>n.resolve(r.value)),async navigate(){await M(b.value,{replace:e.replace,external:m.value||u.value})}}}return B({name:a,props:{to:{type:[String,Object],default:void 0,required:!1},href:{type:[String,Object],default:void 0,required:!1},target:{type:String,default:void 0,required:!1},rel:{type:String,default:void 0,required:!1},noRel:{type:Boolean,default:void 0,required:!1},prefetch:{type:Boolean,default:void 0,required:!1},prefetchOn:{type:[String,Object],default:void 0,required:!1},noPrefetch:{type:Boolean,default:void 0,required:!1},activeClass:{type:String,default:void 0,required:!1},exactActiveClass:{type:String,default:void 0,required:!1},prefetchedClass:{type:String,default:void 0,required:!1},replace:{type:Boolean,default:void 0,required:!1},ariaCurrentValue:{type:String,default:void 0,required:!1},external:{type:Boolean,default:void 0,required:!1},custom:{type:Boolean,default:void 0,required:!1}},useLink:g,setup(e,{slots:n}){const s=S(),{to:u,href:d,navigate:P,isExternal:y,hasTarget:m,isAbsoluteUrl:r}=g(e),c=w(!1),b=w(null),f=l=>{var o;b.value=e.custom?(o=l==null?void 0:l.$el)==null?void 0:o.nextElementSibling:l==null?void 0:l.$el};function C(l){var o,i;return!c.value&&(typeof e.prefetchOn=="string"?e.prefetchOn===l:((o=e.prefetchOn)==null?void 0:o[l])??((i=t.prefetchOn)==null?void 0:i[l]))&&(e.prefetch??t.prefetch)!==!1&&e.noPrefetch!==!0&&e.target!=="_blank"&&!X()}async function R(l=_()){if(c.value)return;c.value=!0;const o=typeof u.value=="string"?u.value:y.value?O(u.value):s.resolve(u.value).fullPath,i=y.value?new URL(o,window.location.href).href:o;await Promise.all([l.hooks.callHook("link:prefetch",i).catch(()=>{}),!y.value&&!m.value&&j(u.value,s).catch(()=>{})])}if(C("visibility")){const l=_();let o,i=null;E(()=>{const h=J();T(()=>{o=U(()=>{var q;(q=b==null?void 0:b.value)!=null&&q.tagName&&(i=h.observe(b.value,async()=>{i==null||i(),i=null,await R(l)}))})})}),I(()=>{o&&F(o),i==null||i(),i=null})}return()=>{var i;if(!y.value&&!m.value&&!v(u.value)){const h={ref:f,to:u.value,activeClass:e.activeClass||t.activeClass,exactActiveClass:e.exactActiveClass||t.exactActiveClass,replace:e.replace,ariaCurrentValue:e.ariaCurrentValue,custom:e.custom};return e.custom||(C("interaction")&&(h.onPointerenter=R.bind(null,void 0),h.onFocus=R.bind(null,void 0)),c.value&&(h.class=e.prefetchedClass||t.prefetchedClass),h.rel=e.rel||void 0),A(L("RouterLink"),h,n.default)}const l=e.target||null,o=Q(e.noRel?"":e.rel,t.externalRelAttribute,r.value||m.value?"noopener noreferrer":"")||null;return e.custom?n.default?n.default({href:d.value,navigate:P,prefetch:R,get route(){if(!d.value)return;const h=new URL(d.value,window.location.href);return{path:h.pathname,fullPath:h.pathname,get query(){return H(h.search)},hash:h.hash,params:{},name:void 0,matched:[],redirectedFrom:void 0,meta:{},href:d.value}},rel:o,target:l,isExternal:y.value||m.value,isActive:!1,isExactActive:!1}):null:A("a",{ref:b,href:d.value||null,rel:o,target:l},(i=n.default)==null?void 0:i.call(n))}}})}const Z=$(D);function k(t,a){const v=a==="append"?W:G;return N(t)&&!t.startsWith("http")?t:v(t,!0)}function J(){const t=_();if(t._observer)return t._observer;let a=null;const v=new Map,p=(e,n)=>(a||(a=new IntersectionObserver(s=>{for(const u of s){const d=v.get(u.target);(u.isIntersecting||u.intersectionRatio>0)&&d&&d()}})),v.set(e,n),a.observe(e),()=>{v.delete(e),a==null||a.unobserve(e),v.size===0&&(a==null||a.disconnect(),a=null)});return t._observer={observe:p}}const K=/2g/;function X(){const t=navigator.connection;return!!(t&&(t.saveData||K.test(t.effectiveType)))}export{Z as _};