@delmaredigital/payload-puck 0.6.30 → 0.7.0

package/README.md

@@ -32,7 +32,8 @@ pnpm add @delmaredigital/payload-puck @puckeditor/core
 
 | Dependency | Version |
 |------------|---------|
-| `@puckeditor/core` | >= 0.21.0 |
+| `node` | >= 20.9.0 |
+| `@puckeditor/core` | >= 0.23.0 |
 | `payload` | >= 3.69.0 |
 | `@payloadcms/next` | >= 3.69.0 |
 | `next` | >= 15.4.8 (see security note below) |
@@ -42,6 +43,19 @@ pnpm add @delmaredigital/payload-puck @puckeditor/core
 
 > **Security:** If your app uses Next.js middleware (or proxy.ts) to protect dynamic routes, use `next` >= 15.5.16 / 16.2.5 to pick up the fix for [CVE-2026-44574](https://github.com/vercel/next.js/security/advisories/GHSA-492v-c6pp-mqqv) (middleware bypass via dynamic route parameter injection). Turbopack users need >= 15.5.18 / 16.2.6.
 
+### Upgrading to 0.7.0 (breaking)
+
+`0.7.0` raises two floors. Both are a one-line change for most projects:
+
+```bash
+pnpm add @puckeditor/core@^0.23.0   # peer floor moved from >=0.21.0
+```
+
+- **`@puckeditor/core` now requires >= 0.23.0.** The Puck plugins this package bundles are versioned in lockstep with Puck core and import it from the host, so running them against an older core is not a supported combination. Puck 0.23 ships a rewritten canvas drag-and-drop engine and a redesigned outline — **the editing experience changes visibly**, even though no API you call has changed. Worth a pass through your editor after upgrading. See the [Puck 0.23 release notes](https://puckeditor.com/blog/puck-023).
+- **Node 18 is no longer supported;** the floor is now `>=20.9.0`. Node 18 is end-of-life and Puck core 0.23 itself requires `>=20.0.0`.
+
+No exports, props, or configuration options were removed or renamed. Full detail in the [changelog](./CHANGELOG.md).
+
 ---
 
 ## Quick Start

package/dist/editor/PuckEditorImpl.client.js

@@ -16,6 +16,7 @@ import { IframeWrapper } from './components/IframeWrapper.js';
 import { PreviewModal } from './components/PreviewModal.js';
 import { DarkModeStyles } from './components/DarkModeStyles.js';
 import { useUnsavedChanges } from './hooks/useUnsavedChanges.js';
+import { isDataEqual } from './utils/isDataEqual.js';
 import { createVersionHistoryPlugin } from './plugins/versionHistoryPlugin.js';
 import { ThemeProvider } from '../theme/index.js';
 import { usePuckConfig } from '../views/PuckConfigContext.js';
@@ -117,6 +118,11 @@ import { useAiPrompts } from '../ai/hooks/useAiPrompts.js';
     ]);
     // Use a ref to track latest data without causing re-renders
     const latestDataRef = useRef(dataWithSlug);
+    // Track the last loaded/saved data so we can distinguish real user edits from
+    // no-op onChange dispatches (e.g. Puck's mount-time resolve pass). Refreshed at
+    // every markClean() site (save / publish) so subsequent edits diff against the
+    // most recently persisted state.
+    const savedDataRef = useRef(dataWithSlug);
     // Get editor stylesheets from PuckConfigProvider context (as fallback)
     const { editorStylesheets: contextStylesheets, editorCss: contextCss } = usePuckConfig();
     // Props take precedence over context
@@ -239,6 +245,7 @@ import { useAiPrompts } from '../ai/hooks/useAiPrompts.js';
             setSaveError(null); // Clear any previous error
             // After saving as draft, update status to draft (shows "Unpublished Changes" if was published)
             setDocumentStatus('draft');
+            savedDataRef.current = typedData;
             markClean();
             onSaveSuccess?.(data);
         } catch (error) {
@@ -287,6 +294,7 @@ import { useAiPrompts } from '../ai/hooks/useAiPrompts.js';
             setSaveError(null); // Clear any previous error
             setDocumentStatus('published'); // Update status after successful publish
             setWasPublished(true); // Mark as having been published
+            savedDataRef.current = typedData;
             markClean();
             onSaveSuccess?.(data);
         } catch (error) {
@@ -340,9 +348,19 @@ import { useAiPrompts } from '../ai/hooks/useAiPrompts.js';
     // Handle data change
     const handleChange = useCallback((data)=>{
         latestDataRef.current = data;
-        markDirty();
+        // Only mark dirty when the data actually differs from the last loaded/saved
+        // state. Puck fires onChange for no-op mount-time resolves (which can differ
+        // from the loaded data only by undefined-valued keys); treating those as
+        // edits produces a spurious "Unsaved" flag on load. isDataEqual is
+        // undefined-tolerant so those resolves compare equal and clear the flag.
+        if (isDataEqual(data, savedDataRef.current)) {
+            markClean();
+        } else {
+            markDirty();
+        }
         onChangeProp?.(data);
     }, [
+        markClean,
         markDirty,
         onChangeProp
     ]);
@@ -415,6 +433,7 @@ import { useAiPrompts } from '../ai/hooks/useAiPrompts.js';
             setLastSaved(new Date());
             setSaveError(null);
             setDocumentStatus('draft');
+            savedDataRef.current = data;
             markClean();
             onSaveSuccess?.(data);
         } catch (error) {
@@ -505,18 +524,32 @@ import { useAiPrompts } from '../ai/hooks/useAiPrompts.js';
     const defaultPlugins = [
         headingAnalyzer
     ];
+    // Restoring a version has already persisted that data server-side, so it
+    // becomes the new saved baseline. Without this, the `setData` dispatch the
+    // restore performs fires an onChange that diffs against the pre-restore
+    // baseline and immediately re-flags the (already saved) document as dirty.
+    const handleRestoreSuccess = useCallback((restoredData)=>{
+        if (restoredData) {
+            const typedData = restoredData;
+            savedDataRef.current = typedData;
+            latestDataRef.current = typedData;
+        }
+        markClean();
+    }, [
+        markClean
+    ]);
     // Version history plugin for the plugin rail
     const versionHistoryPlugin = useMemo(()=>{
         if (!pageId) return null;
         return createVersionHistoryPlugin({
             pageId,
             apiEndpoint,
-            onRestoreSuccess: markClean
+            onRestoreSuccess: handleRestoreSuccess
         });
     }, [
         pageId,
         apiEndpoint,
-        markClean
+        handleRestoreSuccess
     ]);
     // Fetch AI prompts client-side when prompts collection is enabled
     // This allows prompts to update in real-time when edited via the prompt editor panel

package/dist/editor/plugins/VersionHistoryPanel.d.ts

@@ -29,9 +29,13 @@ export interface VersionHistoryPanelProps {
      */
     apiEndpoint?: string;
     /**
-     * Callback after successful restore (e.g., to mark editor as clean)
+     * Callback after successful restore (e.g., to mark editor as clean).
+     *
+     * Receives the restored data that was dispatched into the editor, so the
+     * caller can treat it as the new "last saved" baseline — the restore endpoint
+     * has already persisted it server-side.
      */
-    onRestoreSuccess?: () => void;
+    onRestoreSuccess?: (restoredData?: Data) => void;
 }
 /**
  * Version history panel for the Puck plugin rail

package/dist/editor/plugins/VersionHistoryPanel.js

@@ -256,8 +256,9 @@ const styles = {
             // Show success message
             setSuccessMessage(`Restored version from ${formatDate(version.updatedAt)}`);
             setTimeout(()=>setSuccessMessage(null), 3000);
-            // Notify parent to mark as clean
-            onRestoreSuccess?.();
+            // Notify parent to mark as clean, handing over the restored data so it
+            // becomes the new saved baseline (the restore already persisted it).
+            onRestoreSuccess?.(restoredDoc?.puckData);
             // Refresh version list
             fetchVersions();
         } catch (err) {

package/dist/editor/plugins/versionHistoryPlugin.d.ts

@@ -1,4 +1,4 @@
-import type { Plugin } from '@puckeditor/core';
+import type { Data, Plugin } from '@puckeditor/core';
 export interface VersionHistoryPluginOptions {
     /**
      * Page ID to fetch versions for
@@ -10,9 +10,10 @@ export interface VersionHistoryPluginOptions {
      */
     apiEndpoint?: string;
     /**
-     * Callback after successful restore (e.g., to mark editor as clean)
+     * Callback after successful restore (e.g., to mark editor as clean).
+     * Receives the restored data that was dispatched into the editor.
      */
-    onRestoreSuccess?: () => void;
+    onRestoreSuccess?: (restoredData?: Data) => void;
 }
 /**
  * Creates a Puck plugin for version history

package/dist/editor/utils/index.d.ts

@@ -1,2 +1,3 @@
 export { injectPageTreeFields } from './injectPageTreeFields.js';
 export { detectPageTree, hasPageTreeFields } from './detectPageTree.js';
+export { isDataEqual } from './isDataEqual.js';

package/dist/editor/utils/index.js

@@ -1,2 +1,3 @@
 export { injectPageTreeFields } from './injectPageTreeFields.js';
 export { detectPageTree, hasPageTreeFields } from './detectPageTree.js';
+export { isDataEqual } from './isDataEqual.js';

package/dist/editor/utils/isDataEqual.d.ts

@@ -0,0 +1,15 @@
+/**
+ * Undefined-tolerant deep equality for Puck data.
+ *
+ * Puck's mount-time resolve pass (`resolveAndCommitData`) can dispatch a `replace`
+ * even when the net content is unchanged — e.g. a resolved node differs from the
+ * loaded node only by an `undefined`-valued key. Strict deep-equal libraries such
+ * as `fast-equals` treat `{}` and `{ k: undefined }` as different, so that no-op
+ * resolve looks like a real edit and spuriously marks the document dirty.
+ *
+ * This comparison treats an absent key and an `undefined`-valued key as equal, so
+ * a resolve that only adds/removes `undefined` values compares equal to the loaded
+ * data. Object key order is irrelevant (as with any deep equal); array order is
+ * significant (Puck content order is meaningful).
+ */
+export declare function isDataEqual(a: unknown, b: unknown): boolean;

package/dist/editor/utils/isDataEqual.js

@@ -0,0 +1,57 @@
+/**
+ * Undefined-tolerant deep equality for Puck data.
+ *
+ * Puck's mount-time resolve pass (`resolveAndCommitData`) can dispatch a `replace`
+ * even when the net content is unchanged — e.g. a resolved node differs from the
+ * loaded node only by an `undefined`-valued key. Strict deep-equal libraries such
+ * as `fast-equals` treat `{}` and `{ k: undefined }` as different, so that no-op
+ * resolve looks like a real edit and spuriously marks the document dirty.
+ *
+ * This comparison treats an absent key and an `undefined`-valued key as equal, so
+ * a resolve that only adds/removes `undefined` values compares equal to the loaded
+ * data. Object key order is irrelevant (as with any deep equal); array order is
+ * significant (Puck content order is meaningful).
+ */ export function isDataEqual(a, b) {
+    if (Object.is(a, b)) {
+        return true;
+    }
+    // NaN is handled by Object.is above; remaining primitives that differ are unequal.
+    if (typeof a !== 'object' || typeof b !== 'object' || a === null || b === null) {
+        return false;
+    }
+    const aIsArray = Array.isArray(a);
+    const bIsArray = Array.isArray(b);
+    if (aIsArray !== bIsArray) {
+        return false;
+    }
+    if (aIsArray && bIsArray) {
+        if (a.length !== b.length) {
+            return false;
+        }
+        for(let i = 0; i < a.length; i++){
+            if (!isDataEqual(a[i], b[i])) {
+                return false;
+            }
+        }
+        return true;
+    }
+    const aObj = a;
+    const bObj = b;
+    // Compare the union of keys, treating a missing key and an `undefined` value as
+    // equivalent so that `{}` and `{ k: undefined }` are considered equal.
+    const keys = new Set([
+        ...Object.keys(aObj),
+        ...Object.keys(bObj)
+    ]);
+    for (const key of keys){
+        const aVal = aObj[key];
+        const bVal = bObj[key];
+        if (aVal === undefined && bVal === undefined) {
+            continue;
+        }
+        if (!isDataEqual(aVal, bVal)) {
+            return false;
+        }
+    }
+    return true;
+}

package/dist/version.d.ts

@@ -1 +1 @@
-export declare const VERSION = "0.6.30";
+export declare const VERSION = "0.7.0";

package/dist/version.js

@@ -1,2 +1,2 @@
 // Auto-generated by scripts/generate-version.js - do not edit manually
-export const VERSION = '0.6.30';
+export const VERSION = '0.7.0';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@delmaredigital/payload-puck",
-  "version": "0.6.30",
+  "version": "0.7.0",
   "description": "Puck visual page builder plugin for Payload CMS",
   "type": "module",
   "license": "MIT",
@@ -104,20 +104,22 @@
   "scripts": {
     "dev-publish": "pnpm build && pnpm version prerelease --preid=dev --no-git-tag-version && pnpm publish --registry http://localhost:4873 --no-git-checks --tag dev",
     "generate-version": "node scripts/generate-version.js",
-    "prebuild": "pnpm generate-version",
-    "build": "pnpm build:swc && pnpm build:types && pnpm copyfiles",
+    "build": "pnpm generate-version && pnpm build:swc && pnpm build:types && pnpm copyfiles",
     "build:swc": "swc ./src -d ./dist --strip-leading-paths",
     "build:types": "tsc --outDir dist",
     "copyfiles": "copyfiles -u 1 \"src/**/*.css\" dist",
     "dev": "pnpm generate-version && swc ./src -d ./dist --strip-leading-paths --watch",
-    "typecheck": "tsc --noEmit",
+    "typecheck": "pnpm generate-version && tsc --noEmit && tsc -p tsconfig.test.json",
+    "test": "pnpm generate-version && vitest run",
+    "test:watch": "pnpm generate-version && vitest",
+    "test:coverage": "pnpm generate-version && vitest run --coverage",
     "clean": "rm -rf dist",
     "prepublishOnly": "pnpm build"
   },
   "peerDependencies": {
     "@payloadcms/next": ">=3.69.0",
     "@payloadcms/ui": ">=3.69.0",
-    "@puckeditor/core": ">=0.21.0",
+    "@puckeditor/core": ">=0.23.0",
     "@tailwindcss/postcss": ">=4.0.0",
     "next": ">=15.4.8",
     "payload": ">=3.69.0",
@@ -152,9 +154,9 @@
     }
   },
   "dependencies": {
-    "@puckeditor/cloud-client": "^0.7.0",
-    "@puckeditor/plugin-ai": "^0.7.0",
-    "@puckeditor/plugin-heading-analyzer": "^0.21.2",
+    "@puckeditor/cloud-client": "^0.8.2",
+    "@puckeditor/plugin-ai": "^0.8.2",
+    "@puckeditor/plugin-heading-analyzer": "^0.23.0",
     "@radix-ui/react-popover": "^1.1.15",
     "@tiptap/core": "^3.20.1",
     "@tiptap/extension-color": "^3.20.1",
@@ -171,20 +173,22 @@
     "lucide-react": "^0.469.0"
   },
   "devDependencies": {
-    "@payloadcms/next": "^3.84.1",
-    "@payloadcms/ui": "^3.84.1",
-    "@puckeditor/core": "^0.22.0",
+    "@payloadcms/next": "^3.87.1",
+    "@payloadcms/ui": "^3.87.1",
+    "@puckeditor/core": "^0.23.0",
     "@swc/cli": "^0.6.0",
     "@swc/core": "^1.15.18",
     "@types/node": "^24.12.0",
     "@types/react": "^19.2.14",
     "@types/react-dom": "^19.2.3",
+    "@vitest/coverage-v8": "^3.2.7",
     "copyfiles": "^2.4.1",
-    "next": "^16.2.6",
-    "payload": "^3.84.1",
+    "next": "^16.3.0",
+    "payload": "^3.87.1",
     "react": "^19.2.4",
     "react-dom": "^19.2.4",
-    "typescript": "^5.9.3"
+    "typescript": "^5.9.3",
+    "vitest": "^3.2.7"
   },
   "keywords": [
     "payload",
@@ -196,7 +200,7 @@
     "cms"
   ],
   "engines": {
-    "node": "^18.20.2 || >=20.9.0"
+    "node": ">=20.9.0"
   },
   "author": "Delmare Digital",
   "repository": {