@wpnuxt/blocks 2.0.0-alpha.2 → 2.0.0-alpha.3

package/dist/module.d.mts

@@ -17,6 +17,11 @@ interface WPNuxtBlocksConfig {
      * @default 'auto' - uses Nuxt UI if available
      */
     nuxtUI?: boolean | 'auto';
+    /**
+     * Skip the WPGraphQL Content Blocks plugin check
+     * @default false
+     */
+    skipPluginCheck?: boolean;
 }
 declare const _default: _nuxt_schema.NuxtModule<WPNuxtBlocksConfig, WPNuxtBlocksConfig, false>;
 

package/dist/module.json

@@ -1,7 +1,7 @@
 {
   "name": "@wpnuxt/blocks",
   "configKey": "wpNuxtBlocks",
-  "version": "2.0.0-alpha.1",
+  "version": "2.0.0-alpha.2",
   "builder": {
     "@nuxt/module-builder": "1.0.2",
     "unbuild": "3.6.1"

package/dist/module.mjs

@@ -1,7 +1,8 @@
 import { existsSync, cpSync, promises } from 'node:fs';
 import { join } from 'node:path';
-import { defineNuxtModule, createResolver, hasNuxtModule, installModule, addComponentsDir, addTemplate } from '@nuxt/kit';
+import { useLogger, defineNuxtModule, createResolver, hasNuxtModule, installModule, addComponentsDir, addTemplate } from '@nuxt/kit';
 
+const logger = useLogger("@wpnuxt/blocks");
 const module$1 = defineNuxtModule({
   meta: {
     name: "@wpnuxt/blocks",
@@ -10,7 +11,8 @@ const module$1 = defineNuxtModule({
   defaults: {
     enabled: true,
     imageDomains: [],
-    nuxtUI: "auto"
+    nuxtUI: "auto",
+    skipPluginCheck: false
   },
   async setup(options, nuxt) {
     if (!options.enabled) {
@@ -26,6 +28,42 @@ const module$1 = defineNuxtModule({
       domains: options.imageDomains
     });
     await installModule("@radya/nuxt-dompurify");
+    if (!options.skipPluginCheck) {
+      const wpNuxtConfig = nuxt.options.runtimeConfig?.public?.wpNuxt;
+      const wordpressUrl = wpNuxtConfig?.wordpressUrl || process.env.WPNUXT_WORDPRESS_URL;
+      const graphqlEndpoint = wpNuxtConfig?.graphqlEndpoint || process.env.WPNUXT_GRAPHQL_ENDPOINT || "/graphql";
+      if (wordpressUrl) {
+        const graphqlUrl = `${wordpressUrl}${graphqlEndpoint}`;
+        const introspectionQuery = `
+          query CheckEditorBlocks {
+            __type(name: "Post") {
+              fields {
+                name
+              }
+            }
+          }
+        `;
+        try {
+          const response = await fetch(graphqlUrl, {
+            method: "POST",
+            headers: { "Content-Type": "application/json" },
+            body: JSON.stringify({ query: introspectionQuery })
+          });
+          if (response.ok) {
+            const data = await response.json();
+            const fields = data?.data?.__type?.fields || [];
+            const hasEditorBlocks = fields.some((f) => f.name === "editorBlocks");
+            if (!hasEditorBlocks) {
+              logger.warn("WPGraphQL Content Blocks plugin not detected on WordPress.");
+              logger.warn("Install it from: https://github.com/wpengine/wp-graphql-content-blocks");
+              logger.warn("Without this plugin, BlockRenderer will not work correctly.");
+            }
+          }
+        } catch (error) {
+          logger.debug("Could not check for WPGraphQL Content Blocks plugin:", error);
+        }
+      }
+    }
     const blocksQueriesPath = resolveRuntimeModule("./queries");
     const mergedQueriesFolder = join(nuxt.options.srcDir, ".queries");
     if (existsSync(mergedQueriesFolder) && existsSync(blocksQueriesPath)) {

package/dist/runtime/components/BlockComponent.vue

@@ -1,16 +1,24 @@
 <script setup>
 import { pascalCase } from "scule";
-import { resolveComponent } from "#imports";
+import { resolveComponent, getCurrentInstance } from "#imports";
 const props = defineProps({
   block: { type: null, required: true }
 });
+function isComponentRegistered(name) {
+  const instance = getCurrentInstance();
+  if (!instance) return false;
+  const appComponents = instance.appContext.components;
+  if (name in appComponents) return true;
+  const localComponents = instance.type.components;
+  if (localComponents && name in localComponents) return true;
+  return false;
+}
 const componentToRender = (() => {
   if (props.block.parentClientId === null || props.block.parentClientId === void 0) {
     if (props.block.name) {
       const componentName = pascalCase(props.block.name);
-      const resolved = resolveComponent(componentName);
-      if (typeof resolved !== "string") {
-        return resolved;
+      if (isComponentRegistered(componentName)) {
+        return resolveComponent(componentName);
       }
     }
     return resolveComponent("EditorBlock");

package/dist/runtime/queries/fragments/Page.fragment.gql

@@ -0,0 +1,18 @@
+#import "~/.queries/fragments/ContentNode.fragment.gql"
+#import "~/.queries/fragments/NodeWithFeaturedImage.fragment.gql"
+#import "~/.queries/fragments/NodeWithContentEditor.fragment.gql"
+#import "~/.queries/fragments/NodeWithEditorBlocks.fragment.gql"
+
+fragment Page on Page {
+  ...ContentNode
+  ...NodeWithFeaturedImage
+  ...NodeWithContentEditor
+  ...NodeWithEditorBlocks
+  isFrontPage
+  isPostsPage
+  isPreview
+  isPrivacyPage
+  isRestricted
+  isRevision
+  title
+}

package/dist/runtime/queries/fragments/Post.fragment.gql

@@ -0,0 +1,22 @@
+#import "~/.queries/fragments/NodeWithExcerpt.fragment.gql"
+#import "~/.queries/fragments/ContentNode.fragment.gql"
+#import "~/.queries/fragments/NodeWithFeaturedImage.fragment.gql"
+#import "~/.queries/fragments/NodeWithContentEditor.fragment.gql"
+#import "~/.queries/fragments/NodeWithEditorBlocks.fragment.gql"
+
+fragment Post on Post {
+  ...NodeWithExcerpt
+  ...ContentNode
+  ...NodeWithFeaturedImage
+  ...NodeWithContentEditor
+  ...NodeWithEditorBlocks
+  title
+  categories {
+    nodes {
+      id
+      name
+      uri
+      description
+    }
+  }
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wpnuxt/blocks",
-  "version": "2.0.0-alpha.2",
+  "version": "2.0.0-alpha.3",
   "description": "Vue components for rendering WordPress Gutenberg blocks in Nuxt",
   "keywords": [
     "nuxt",