@delmaredigital/payload-puck 0.6.12 → 0.6.13

package/README.md

@@ -2,6 +2,10 @@
 
 A PayloadCMS plugin for integrating [Puck](https://puckeditor.com) visual page builder. Build pages visually with drag-and-drop components while leveraging Payload's content management capabilities.
 
+[![Demo](https://img.shields.io/badge/Demo-Live-blue)](https://demo.delmaredigital.com)
+[![Starter Template](https://img.shields.io/badge/Starter-Template-green)](https://github.com/delmaredigital/dd-starter)
+[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/clone?repository-url=https%3A%2F%2Fgithub.com%2Fdelmaredigital%2Fdd-starter&project-name=my-payload-site&build-command=pnpm%20run%20ci&env=PAYLOAD_SECRET,BETTER_AUTH_SECRET&stores=%5B%7B%22type%22%3A%22integration%22%2C%22protocol%22%3A%22storage%22%2C%22productSlug%22%3A%22neon%22%2C%22integrationSlug%22%3A%22neon%22%7D%2C%7B%22type%22%3A%22blob%22%7D%5D)
+
 ---
 
 ## Table of Contents
@@ -20,6 +24,7 @@ A PayloadCMS plugin for integrating [Puck](https://puckeditor.com) visual page b
 - [Page-Tree Integration](#page-tree-integration)
 - [Hybrid Integration](#hybrid-integration)
 - [AI Integration](#ai-integration)
+- [Plugin Order](#plugin-order)
 - [Advanced Configuration](#advanced-configuration)
 - [License](#license)
 
@@ -959,6 +964,8 @@ function useDetectTheme() {
 
 When `@delmaredigital/payload-page-tree` is detected, the plugin automatically adds folder management to the Puck sidebar.
 
+> **⚠️ Plugin Order:** When using both plugins with `autoGenerateCollection: true`, Puck must run BEFORE page-tree. See [Plugin Order](#plugin-order).
+
 ### How It Works
 
 The plugin checks if your collection has a `pageSegment` field (page-tree's signature). When detected:
@@ -1306,6 +1313,48 @@ import {
 
 ---
 
+## Plugin Order
+
+When using `autoGenerateCollection: true` (the default) with `@delmaredigital/payload-page-tree`, **plugin order matters**.
+
+### The Issue
+
+The page-tree plugin validates configured collections when it initializes. If Puck hasn't created the collection yet, page-tree won't see it and will skip adding its fields (folder relationships, slug generation, etc.).
+
+### Correct Order
+
+```typescript
+// ✅ CORRECT: Puck creates the collection before page-tree runs
+export const plugins = [
+  createPuckPlugin({ pagesCollection: 'pages' }),  // Creates Pages first
+  pageTreePlugin({ collections: ['pages'] }),      // Now sees Pages
+]
+
+// ❌ WRONG: page-tree runs before Pages exists
+export const plugins = [
+  pageTreePlugin({ collections: ['pages'] }),      // Pages doesn't exist!
+  createPuckPlugin({ pagesCollection: 'pages' }),  // Creates Pages too late
+]
+```
+
+### When Order Doesn't Matter
+
+If you define your collection manually (with `autoGenerateCollection: false`), order doesn't matter because the collection already exists in your config:
+
+```typescript
+export default buildConfig({
+  collections: [Pages],  // Collection exists before plugins run
+  plugins: [
+    pageTreePlugin({ collections: ['pages'] }),
+    createPuckPlugin({ pagesCollection: 'pages', autoGenerateCollection: false }),
+  ],
+})
+```
+
+See also: [payload-page-tree Plugin Order documentation](https://github.com/delmaredigital/payload-page-tree#plugin-order-critical)
+
+---
+
 ## Advanced Configuration
 
 ### Plugin Options
@@ -1313,7 +1362,7 @@ import {
 | Option | Default | Description |
 |--------|---------|-------------|
 | `pagesCollection` | `'pages'` | Collection slug to use for pages |
-| `autoGenerateCollection` | `true` | Create the collection if it doesn't exist, or add Puck fields to existing |
+| `autoGenerateCollection` | `true` | Create the collection if it doesn't exist, or add Puck fields to existing (see [Plugin Order](#plugin-order)) |
 | `enableEndpoints` | `true` | Register API endpoints at `/api/puck/:collection` for the editor |
 | `enableAdminView` | `true` | Register the Puck editor view in Payload admin |
 | `adminViewPath` | `'/puck-editor'` | Path for the editor (full path: `/admin/puck-editor/:collection/:id`) |

package/dist/admin/EditWithPuckButton.d.ts

@@ -69,6 +69,6 @@ export declare const EditWithPuckButton: UIFieldClientComponent;
 export declare function EditWithPuckLink({ id, collectionSlug, editorPathPattern, label, iconOnly, }: EditWithPuckButtonProps & {
     id: string;
     adminRoute?: string;
-}): import("react/jsx-runtime").JSX.Element;
+}): import("react").JSX.Element;
 export default EditWithPuckButton;
 //# sourceMappingURL=EditWithPuckButton.d.ts.map

package/dist/admin/EditWithPuckButton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"EditWithPuckButton.d.ts","sourceRoot":"","sources":["../../src/admin/EditWithPuckButton.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,SAAS,CAAA;AAGrD;;GAEG;AACH,MAAM,WAAW,uBAAuB;IACtC;;OAEG;IACH,EAAE,CAAC,EAAE,MAAM,CAAA;IACX;;;OAGG;IACH,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB;;;;OAIG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAA;IACd;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB;AAwBD;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,eAAO,MAAM,kBAAkB,EAAE,sBA4DhC,CAAA;AAED;;;;;;;;;;;GAWG;AACH,wBAAgB,gBAAgB,CAAC,EAC/B,EAAE,EACF,cAAwB,EACxB,iBAAiB,EACjB,KAAuB,EACvB,QAAgB,GACjB,EAAE,uBAAuB,GAAG;IAAE,EAAE,EAAE,MAAM,CAAC;IAAC,UAAU,CAAC,EAAE,MAAM,CAAA;CAAE,2CAkC/D;AAED,eAAe,kBAAkB,CAAA"}
+{"version":3,"file":"EditWithPuckButton.d.ts","sourceRoot":"","sources":["../../src/admin/EditWithPuckButton.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,SAAS,CAAA;AAGrD;;GAEG;AACH,MAAM,WAAW,uBAAuB;IACtC;;OAEG;IACH,EAAE,CAAC,EAAE,MAAM,CAAA;IACX;;;OAGG;IACH,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB;;;;OAIG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAA;IACd;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB;AAwBD;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,eAAO,MAAM,kBAAkB,EAAE,sBA4DhC,CAAA;AAED;;;;;;;;;;;GAWG;AACH,wBAAgB,gBAAgB,CAAC,EAC/B,EAAE,EACF,cAAwB,EACxB,iBAAiB,EACjB,KAAuB,EACvB,QAAgB,GACjB,EAAE,uBAAuB,GAAG;IAAE,EAAE,EAAE,MAAM,CAAC;IAAC,UAAU,CAAC,EAAE,MAAM,CAAA;CAAE,+BAkC/D;AAED,eAAe,kBAAkB,CAAA"}

package/dist/admin/EditWithPuckButton.js

@@ -3,9 +3,26 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useDocumentInfo, useConfig } from '@payloadcms/ui';
 /**
  * Pencil/Edit icon component
- */
-function PuckIcon({ size = 18 }) {
-    return (_jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [_jsx("path", { d: "M12 3H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7" }), _jsx("path", { d: "M18.375 2.625a2.121 2.121 0 1 1 3 3L12 15l-4 1 1-4Z" })] }));
+ */ function PuckIcon({ size = 18 }) {
+    return /*#__PURE__*/ _jsxs("svg", {
+        xmlns: "http://www.w3.org/2000/svg",
+        width: size,
+        height: size,
+        viewBox: "0 0 24 24",
+        fill: "none",
+        stroke: "currentColor",
+        strokeWidth: "2",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        children: [
+            /*#__PURE__*/ _jsx("path", {
+                d: "M12 3H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7"
+            }),
+            /*#__PURE__*/ _jsx("path", {
+                d: "M18.375 2.625a2.121 2.121 0 1 1 3 3L12 15l-4 1 1-4Z"
+            })
+        ]
+    });
 }
 /**
  * Edit with Puck button for use in Payload admin document edit views
@@ -30,8 +47,7 @@ function PuckIcon({ size = 18 }) {
  *   },
  * }
  * ```
- */
-export const EditWithPuckButton = (props) => {
+ */ export const EditWithPuckButton = (props)=>{
     // Get document and config context from Payload
     const { id, collectionSlug } = useDocumentInfo();
     const { config } = useConfig();
@@ -46,18 +62,21 @@ export const EditWithPuckButton = (props) => {
     let editorPath;
     if (customProps?.editorPathPattern) {
         // Custom pattern provided (for backwards compatibility)
-        editorPath = customProps.editorPathPattern
-            .replace('{id}', String(id))
-            .replace('{collection}', collection);
-    }
-    else {
+        editorPath = customProps.editorPathPattern.replace('{id}', String(id)).replace('{collection}', collection);
+    } else {
         // Default: use admin view
         editorPath = `${adminRoute}/puck-editor/${collection}/${id}`;
     }
     if (!id) {
         return null;
     }
-    return (_jsx("div", { style: { marginBottom: '1rem' }, children: _jsxs("a", { href: editorPath, style: {
+    return /*#__PURE__*/ _jsx("div", {
+        style: {
+            marginBottom: '1rem'
+        },
+        children: /*#__PURE__*/ _jsxs("a", {
+            href: editorPath,
+            style: {
                 display: 'inline-flex',
                 alignItems: 'center',
                 gap: '8px',
@@ -68,12 +87,23 @@ export const EditWithPuckButton = (props) => {
                 textDecoration: 'none',
                 fontSize: '14px',
                 fontWeight: 500,
-                transition: 'background-color 0.15s, opacity 0.15s',
-            }, onMouseEnter: (e) => {
+                transition: 'background-color 0.15s, opacity 0.15s'
+            },
+            onMouseEnter: (e)=>{
                 e.currentTarget.style.opacity = '0.9';
-            }, onMouseLeave: (e) => {
+            },
+            onMouseLeave: (e)=>{
                 e.currentTarget.style.opacity = '1';
-            }, title: iconOnly ? label : undefined, children: [_jsx(PuckIcon, { size: iconOnly ? 20 : 18 }), !iconOnly && label] }) }));
+            },
+            title: iconOnly ? label : undefined,
+            children: [
+                /*#__PURE__*/ _jsx(PuckIcon, {
+                    size: iconOnly ? 20 : 18
+                }),
+                !iconOnly && label
+            ]
+        })
+    });
 };
 /**
  * Standalone version of the button that doesn't rely on Payload context
@@ -86,13 +116,12 @@ export const EditWithPuckButton = (props) => {
  *   adminRoute="/admin"
  * />
  * ```
- */
-export function EditWithPuckLink({ id, collectionSlug = 'pages', editorPathPattern, label = 'Visual Editor', iconOnly = false, }) {
+ */ export function EditWithPuckLink({ id, collectionSlug = 'pages', editorPathPattern, label = 'Visual Editor', iconOnly = false }) {
     // Build path - prefer admin view by default
-    const path = editorPathPattern
-        ? editorPathPattern.replace('{id}', id).replace('{collection}', collectionSlug)
-        : `/admin/puck-editor/${collectionSlug}/${id}`;
-    return (_jsxs("a", { href: path, style: {
+    const path = editorPathPattern ? editorPathPattern.replace('{id}', id).replace('{collection}', collectionSlug) : `/admin/puck-editor/${collectionSlug}/${id}`;
+    return /*#__PURE__*/ _jsxs("a", {
+        href: path,
+        style: {
             display: 'inline-flex',
             alignItems: 'center',
             gap: '8px',
@@ -103,12 +132,23 @@ export function EditWithPuckLink({ id, collectionSlug = 'pages', editorPathPatte
             textDecoration: 'none',
             fontSize: '14px',
             fontWeight: 500,
-            transition: 'opacity 0.15s',
-        }, onMouseEnter: (e) => {
+            transition: 'opacity 0.15s'
+        },
+        onMouseEnter: (e)=>{
             e.currentTarget.style.opacity = '0.9';
-        }, onMouseLeave: (e) => {
+        },
+        onMouseLeave: (e)=>{
             e.currentTarget.style.opacity = '1';
-        }, title: iconOnly ? label : undefined, children: [_jsx(PuckIcon, { size: iconOnly ? 20 : 18 }), !iconOnly && label] }));
+        },
+        title: iconOnly ? label : undefined,
+        children: [
+            /*#__PURE__*/ _jsx(PuckIcon, {
+                size: iconOnly ? 20 : 18
+            }),
+            !iconOnly && label
+        ]
+    });
 }
 export default EditWithPuckButton;
+
 //# sourceMappingURL=EditWithPuckButton.js.map

package/dist/admin/EditWithPuckButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"EditWithPuckButton.js","sourceRoot":"","sources":["../../src/admin/EditWithPuckButton.tsx"],"names":[],"mappings":"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"}
+{"version":3,"sources":["../../src/admin/EditWithPuckButton.tsx"],"sourcesContent":["'use client'\n\nimport type { UIFieldClientComponent } from 'payload'\nimport { useDocumentInfo, useConfig } from '@payloadcms/ui'\n\n/**\n * Props for EditWithPuckButton when used standalone\n */\nexport interface EditWithPuckButtonProps {\n  /**\n   * Document ID to edit\n   */\n  id?: string\n  /**\n   * Collection slug\n   * @default 'pages'\n   */\n  collectionSlug?: string\n  /**\n   * Custom path pattern for the Puck editor\n   * Use {id} as placeholder for the document ID, {collection} for collection slug\n   * @default Uses admin view: '/admin/puck-editor/{collection}/{id}'\n   */\n  editorPathPattern?: string\n  /**\n   * Button label\n   * @default 'Visual Editor'\n   */\n  label?: string\n  /**\n   * Whether to show as icon only\n   * @default false\n   */\n  iconOnly?: boolean\n}\n\n/**\n * Pencil/Edit icon component\n */\nfunction PuckIcon({ size = 18 }: { size?: number }) {\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width={size}\n      height={size}\n      viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      strokeWidth=\"2\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n    >\n      <path d=\"M12 3H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\" />\n      <path d=\"M18.375 2.625a2.121 2.121 0 1 1 3 3L12 15l-4 1 1-4Z\" />\n    </svg>\n  )\n}\n\n/**\n * Edit with Puck button for use in Payload admin document edit views\n *\n * Links to the Puck editor admin view. The editor is integrated directly\n * into Payload's admin UI.\n *\n * @example\n * ```tsx\n * // In your Payload collection config:\n * {\n *   name: 'puckEdit',\n *   type: 'ui',\n *   admin: {\n *     position: 'sidebar',\n *     components: {\n *       Field: '@delmaredigital/payload-puck/admin/client#EditWithPuckButton',\n *     },\n *     custom: {\n *       label: 'Visual Editor',\n *     },\n *   },\n * }\n * ```\n */\nexport const EditWithPuckButton: UIFieldClientComponent = (props) => {\n  // Get document and config context from Payload\n  const { id, collectionSlug } = useDocumentInfo()\n  const { config } = useConfig()\n\n  // Extract custom props passed via field config\n  const customProps = (props as any)?.field?.custom as EditWithPuckButtonProps | undefined\n  const label = customProps?.label || 'Visual Editor'\n  const iconOnly = customProps?.iconOnly || false\n  const collection = customProps?.collectionSlug || collectionSlug || 'pages'\n\n  // Get admin route from config\n  const adminRoute = config.routes?.admin || '/admin'\n\n  // Build editor URL - defaults to admin view\n  let editorPath: string\n  if (customProps?.editorPathPattern) {\n    // Custom pattern provided (for backwards compatibility)\n    editorPath = customProps.editorPathPattern\n      .replace('{id}', String(id))\n      .replace('{collection}', collection)\n  } else {\n    // Default: use admin view\n    editorPath = `${adminRoute}/puck-editor/${collection}/${id}`\n  }\n\n  if (!id) {\n    return null\n  }\n\n  return (\n    <div style={{ marginBottom: '1rem' }}>\n      <a\n        href={editorPath}\n        style={{\n          display: 'inline-flex',\n          alignItems: 'center',\n          gap: '8px',\n          padding: iconOnly ? '8px' : '10px 16px',\n          backgroundColor: 'var(--theme-success-500, #22c55e)',\n          color: 'white',\n          borderRadius: '6px',\n          textDecoration: 'none',\n          fontSize: '14px',\n          fontWeight: 500,\n          transition: 'background-color 0.15s, opacity 0.15s',\n        }}\n        onMouseEnter={(e) => {\n          e.currentTarget.style.opacity = '0.9'\n        }}\n        onMouseLeave={(e) => {\n          e.currentTarget.style.opacity = '1'\n        }}\n        title={iconOnly ? label : undefined}\n      >\n        <PuckIcon size={iconOnly ? 20 : 18} />\n        {!iconOnly && label}\n      </a>\n    </div>\n  )\n}\n\n/**\n * Standalone version of the button that doesn't rely on Payload context\n *\n * @example\n * ```tsx\n * <EditWithPuckLink\n *   id=\"123\"\n *   collectionSlug=\"pages\"\n *   adminRoute=\"/admin\"\n * />\n * ```\n */\nexport function EditWithPuckLink({\n  id,\n  collectionSlug = 'pages',\n  editorPathPattern,\n  label = 'Visual Editor',\n  iconOnly = false,\n}: EditWithPuckButtonProps & { id: string; adminRoute?: string }) {\n  // Build path - prefer admin view by default\n  const path = editorPathPattern\n    ? editorPathPattern.replace('{id}', id).replace('{collection}', collectionSlug)\n    : `/admin/puck-editor/${collectionSlug}/${id}`\n\n  return (\n    <a\n      href={path}\n      style={{\n        display: 'inline-flex',\n        alignItems: 'center',\n        gap: '8px',\n        padding: iconOnly ? '8px' : '10px 16px',\n        backgroundColor: 'var(--theme-success-500, #22c55e)',\n        color: 'white',\n        borderRadius: '6px',\n        textDecoration: 'none',\n        fontSize: '14px',\n        fontWeight: 500,\n        transition: 'opacity 0.15s',\n      }}\n      onMouseEnter={(e) => {\n        e.currentTarget.style.opacity = '0.9'\n      }}\n      onMouseLeave={(e) => {\n        e.currentTarget.style.opacity = '1'\n      }}\n      title={iconOnly ? label : undefined}\n    >\n      <PuckIcon size={iconOnly ? 20 : 18} />\n      {!iconOnly && label}\n    </a>\n  )\n}\n\nexport default EditWithPuckButton\n"],"names":["useDocumentInfo","useConfig","PuckIcon","size","svg","xmlns","width","height","viewBox","fill","stroke","strokeWidth","strokeLinecap","strokeLinejoin","path","d","EditWithPuckButton","props","id","collectionSlug","config","customProps","field","custom","label","iconOnly","collection","adminRoute","routes","admin","editorPath","editorPathPattern","replace","String","div","style","marginBottom","a","href","display","alignItems","gap","padding","backgroundColor","color","borderRadius","textDecoration","fontSize","fontWeight","transition","onMouseEnter","e","currentTarget","opacity","onMouseLeave","title","undefined","EditWithPuckLink"],"mappings":"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"}

package/dist/admin/EditWithPuckCell.js

@@ -2,9 +2,26 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 /**
  * Pencil/Edit icon component
- */
-function PuckIcon({ size = 16 }) {
-    return (_jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [_jsx("path", { d: "M12 3H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7" }), _jsx("path", { d: "M18.375 2.625a2.121 2.121 0 1 1 3 3L12 15l-4 1 1-4Z" })] }));
+ */ function PuckIcon({ size = 16 }) {
+    return /*#__PURE__*/ _jsxs("svg", {
+        xmlns: "http://www.w3.org/2000/svg",
+        width: size,
+        height: size,
+        viewBox: "0 0 24 24",
+        fill: "none",
+        stroke: "currentColor",
+        strokeWidth: "2",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        children: [
+            /*#__PURE__*/ _jsx("path", {
+                d: "M12 3H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7"
+            }),
+            /*#__PURE__*/ _jsx("path", {
+                d: "M18.375 2.625a2.121 2.121 0 1 1 3 3L12 15l-4 1 1-4Z"
+            })
+        ]
+    });
 }
 /**
  * Custom cell component that renders an "Edit with Puck" button in list views
@@ -28,8 +45,7 @@ function PuckIcon({ size = 16 }) {
  *   },
  * }
  * ```
- */
-export const EditWithPuckCell = ({ rowData, field, collectionSlug: contextCollectionSlug, }) => {
+ */ export const EditWithPuckCell = ({ rowData, field, collectionSlug: contextCollectionSlug })=>{
     // Get document ID from row data
     const id = rowData?.id;
     // Get custom config from field
@@ -39,10 +55,11 @@ export const EditWithPuckCell = ({ rowData, field, collectionSlug: contextCollec
         return null;
     }
     // Build editor URL
-    const editorPath = customConfig?.editorPathPattern
-        ? customConfig.editorPathPattern.replace('{id}', id).replace('{collectionSlug}', collectionSlug)
-        : `/admin/puck/${collectionSlug}/${id}/edit`;
-    return (_jsxs("a", { href: editorPath, onClick: (e) => e.stopPropagation(), style: {
+    const editorPath = customConfig?.editorPathPattern ? customConfig.editorPathPattern.replace('{id}', id).replace('{collectionSlug}', collectionSlug) : `/admin/puck/${collectionSlug}/${id}/edit`;
+    return /*#__PURE__*/ _jsxs("a", {
+        href: editorPath,
+        onClick: (e)=>e.stopPropagation(),
+        style: {
             display: 'inline-flex',
             alignItems: 'center',
             justifyContent: 'center',
@@ -55,12 +72,25 @@ export const EditWithPuckCell = ({ rowData, field, collectionSlug: contextCollec
             fontWeight: 500,
             gap: '4px',
             transition: 'background-color 0.2s',
-            whiteSpace: 'nowrap',
-        }, onMouseEnter: (e) => {
+            whiteSpace: 'nowrap'
+        },
+        onMouseEnter: (e)=>{
             e.currentTarget.style.backgroundColor = '#1d4ed8';
-        }, onMouseLeave: (e) => {
+        },
+        onMouseLeave: (e)=>{
             e.currentTarget.style.backgroundColor = '#2563eb';
-        }, title: "Visual Editor", children: [_jsx(PuckIcon, { size: 14 }), _jsx("span", { children: "Visual Editor" })] }));
+        },
+        title: "Visual Editor",
+        children: [
+            /*#__PURE__*/ _jsx(PuckIcon, {
+                size: 14
+            }),
+            /*#__PURE__*/ _jsx("span", {
+                children: "Visual Editor"
+            })
+        ]
+    });
 };
 export default EditWithPuckCell;
+
 //# sourceMappingURL=EditWithPuckCell.js.map

package/dist/admin/EditWithPuckCell.js.map

@@ -1 +1 @@
-{"version":3,"file":"EditWithPuckCell.js","sourceRoot":"","sources":["../../src/admin/EditWithPuckCell.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAqBZ;;GAEG;AACH,SAAS,QAAQ,CAAC,EAAE,IAAI,GAAG,EAAE,EAAqB;IAChD,OAAO,CACL,eACE,KAAK,EAAC,4BAA4B,EAClC,KAAK,EAAE,IAAI,EACX,MAAM,EAAE,IAAI,EACZ,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,MAAM,EACX,MAAM,EAAC,cAAc,EACrB,WAAW,EAAC,GAAG,EACf,aAAa,EAAC,OAAO,EACrB,cAAc,EAAC,OAAO,aAEtB,eAAM,CAAC,EAAC,4DAA4D,GAAG,EACvE,eAAM,CAAC,EAAC,qDAAqD,GAAG,IAC5D,CACP,CAAA;AACH,CAAC;AAED;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,MAAM,CAAC,MAAM,gBAAgB,GAAwC,CAAC,EACpE,OAAO,EACP,KAAK,EACL,cAAc,EAAE,qBAAqB,GACtC,EAAE,EAAE;IACH,gCAAgC;IAChC,MAAM,EAAE,GAAG,OAAO,EAAE,EAAwB,CAAA;IAE5C,+BAA+B;IAC/B,MAAM,YAAY,GAAI,KAAa,EAAE,MAA4C,CAAA;IACjF,MAAM,cAAc,GAAG,YAAY,EAAE,cAAc,IAAI,qBAAqB,IAAI,OAAO,CAAA;IAEvF,IAAI,CAAC,EAAE,EAAE,CAAC;QACR,OAAO,IAAI,CAAA;IACb,CAAC;IAED,mBAAmB;IACnB,MAAM,UAAU,GAAG,YAAY,EAAE,iBAAiB;QAChD,CAAC,CAAC,YAAY,CAAC,iBAAiB,CAAC,OAAO,CAAC,MAAM,EAAE,EAAE,CAAC,CAAC,OAAO,CAAC,kBAAkB,EAAE,cAAc,CAAC;QAChG,CAAC,CAAC,eAAe,cAAc,IAAI,EAAE,OAAO,CAAA;IAE9C,OAAO,CACL,aACE,IAAI,EAAE,UAAU,EAChB,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,eAAe,EAAE,EACnC,KAAK,EAAE;YACL,OAAO,EAAE,aAAa;YACtB,UAAU,EAAE,QAAQ;YACpB,cAAc,EAAE,QAAQ;YACxB,OAAO,EAAE,UAAU;YACnB,eAAe,EAAE,SAAS;YAC1B,KAAK,EAAE,MAAM;YACb,YAAY,EAAE,KAAK;YACnB,cAAc,EAAE,MAAM;YACtB,QAAQ,EAAE,MAAM;YAChB,UAAU,EAAE,GAAG;YACf,GAAG,EAAE,KAAK;YACV,UAAU,EAAE,uBAAuB;YACnC,UAAU,EAAE,QAAQ;SACrB,EACD,YAAY,EAAE,CAAC,CAAC,EAAE,EAAE;YAClB,CAAC,CAAC,aAAa,CAAC,KAAK,CAAC,eAAe,GAAG,SAAS,CAAA;QACnD,CAAC,EACD,YAAY,EAAE,CAAC,CAAC,EAAE,EAAE;YAClB,CAAC,CAAC,aAAa,CAAC,KAAK,CAAC,eAAe,GAAG,SAAS,CAAA;QACnD,CAAC,EACD,KAAK,EAAC,eAAe,aAErB,KAAC,QAAQ,IAAC,IAAI,EAAE,EAAE,GAAI,EACtB,2CAA0B,IACxB,CACL,CAAA;AACH,CAAC,CAAA;AAED,eAAe,gBAAgB,CAAA"}
+{"version":3,"sources":["../../src/admin/EditWithPuckCell.tsx"],"sourcesContent":["'use client'\n\nimport type { DefaultCellComponentProps } from 'payload'\n\n/**\n * Props for configuring the EditWithPuckCell component\n */\nexport interface EditWithPuckCellConfig {\n  /**\n   * Collection slug for building the editor URL\n   * @default 'pages'\n   */\n  collectionSlug?: string\n  /**\n   * Custom editor path pattern\n   * Use {id} as placeholder for the document ID\n   * @default '/admin/puck/{collectionSlug}/{id}/edit'\n   */\n  editorPathPattern?: string\n}\n\n/**\n * Pencil/Edit icon component\n */\nfunction PuckIcon({ size = 16 }: { size?: number }) {\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width={size}\n      height={size}\n      viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      strokeWidth=\"2\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n    >\n      <path d=\"M12 3H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\" />\n      <path d=\"M18.375 2.625a2.121 2.121 0 1 1 3 3L12 15l-4 1 1-4Z\" />\n    </svg>\n  )\n}\n\n/**\n * Custom cell component that renders an \"Edit with Puck\" button in list views\n *\n * Add this to a UI field in your collection to show the visual editor button\n * in the list view table.\n *\n * @example\n * ```ts\n * // In your collection config:\n * {\n *   name: 'puckEdit',\n *   type: 'ui',\n *   admin: {\n *     components: {\n *       Cell: '@delmaredigital/payload-puck/admin#EditWithPuckCell',\n *     },\n *     custom: {\n *       collectionSlug: 'pages',\n *     },\n *   },\n * }\n * ```\n */\nexport const EditWithPuckCell: React.FC<DefaultCellComponentProps> = ({\n  rowData,\n  field,\n  collectionSlug: contextCollectionSlug,\n}) => {\n  // Get document ID from row data\n  const id = rowData?.id as string | undefined\n\n  // Get custom config from field\n  const customConfig = (field as any)?.custom as EditWithPuckCellConfig | undefined\n  const collectionSlug = customConfig?.collectionSlug || contextCollectionSlug || 'pages'\n\n  if (!id) {\n    return null\n  }\n\n  // Build editor URL\n  const editorPath = customConfig?.editorPathPattern\n    ? customConfig.editorPathPattern.replace('{id}', id).replace('{collectionSlug}', collectionSlug)\n    : `/admin/puck/${collectionSlug}/${id}/edit`\n\n  return (\n    <a\n      href={editorPath}\n      onClick={(e) => e.stopPropagation()}\n      style={{\n        display: 'inline-flex',\n        alignItems: 'center',\n        justifyContent: 'center',\n        padding: '6px 10px',\n        backgroundColor: '#2563eb',\n        color: '#fff',\n        borderRadius: '4px',\n        textDecoration: 'none',\n        fontSize: '12px',\n        fontWeight: 500,\n        gap: '4px',\n        transition: 'background-color 0.2s',\n        whiteSpace: 'nowrap',\n      }}\n      onMouseEnter={(e) => {\n        e.currentTarget.style.backgroundColor = '#1d4ed8'\n      }}\n      onMouseLeave={(e) => {\n        e.currentTarget.style.backgroundColor = '#2563eb'\n      }}\n      title=\"Visual Editor\"\n    >\n      <PuckIcon size={14} />\n      <span>Visual Editor</span>\n    </a>\n  )\n}\n\nexport default EditWithPuckCell\n"],"names":["PuckIcon","size","svg","xmlns","width","height","viewBox","fill","stroke","strokeWidth","strokeLinecap","strokeLinejoin","path","d","EditWithPuckCell","rowData","field","collectionSlug","contextCollectionSlug","id","customConfig","custom","editorPath","editorPathPattern","replace","a","href","onClick","e","stopPropagation","style","display","alignItems","justifyContent","padding","backgroundColor","color","borderRadius","textDecoration","fontSize","fontWeight","gap","transition","whiteSpace","onMouseEnter","currentTarget","onMouseLeave","title","span"],"mappings":"AAAA;;AAqBA;;CAEC,GACD,SAASA,SAAS,EAAEC,OAAO,EAAE,EAAqB;IAChD,qBACE,MAACC;QACCC,OAAM;QACNC,OAAOH;QACPI,QAAQJ;QACRK,SAAQ;QACRC,MAAK;QACLC,QAAO;QACPC,aAAY;QACZC,eAAc;QACdC,gBAAe;;0BAEf,KAACC;gBAAKC,GAAE;;0BACR,KAACD;gBAAKC,GAAE;;;;AAGd;AAEA;;;;;;;;;;;;;;;;;;;;;;CAsBC,GACD,OAAO,MAAMC,mBAAwD,CAAC,EACpEC,OAAO,EACPC,KAAK,EACLC,gBAAgBC,qBAAqB,EACtC;IACC,gCAAgC;IAChC,MAAMC,KAAKJ,SAASI;IAEpB,+BAA+B;IAC/B,MAAMC,eAAgBJ,OAAeK;IACrC,MAAMJ,iBAAiBG,cAAcH,kBAAkBC,yBAAyB;IAEhF,IAAI,CAACC,IAAI;QACP,OAAO;IACT;IAEA,mBAAmB;IACnB,MAAMG,aAAaF,cAAcG,oBAC7BH,aAAaG,iBAAiB,CAACC,OAAO,CAAC,QAAQL,IAAIK,OAAO,CAAC,oBAAoBP,kBAC/E,CAAC,YAAY,EAAEA,eAAe,CAAC,EAAEE,GAAG,KAAK,CAAC;IAE9C,qBACE,MAACM;QACCC,MAAMJ;QACNK,SAAS,CAACC,IAAMA,EAAEC,eAAe;QACjCC,OAAO;YACLC,SAAS;YACTC,YAAY;YACZC,gBAAgB;YAChBC,SAAS;YACTC,iBAAiB;YACjBC,OAAO;YACPC,cAAc;YACdC,gBAAgB;YAChBC,UAAU;YACVC,YAAY;YACZC,KAAK;YACLC,YAAY;YACZC,YAAY;QACd;QACAC,cAAc,CAAChB;YACbA,EAAEiB,aAAa,CAACf,KAAK,CAACK,eAAe,GAAG;QAC1C;QACAW,cAAc,CAAClB;YACbA,EAAEiB,aAAa,CAACf,KAAK,CAACK,eAAe,GAAG;QAC1C;QACAY,OAAM;;0BAEN,KAAC/C;gBAASC,MAAM;;0BAChB,KAAC+C;0BAAK;;;;AAGZ,EAAC;AAED,eAAelC,iBAAgB"}

package/dist/admin/PuckEditorView.d.ts

@@ -80,6 +80,6 @@ export interface PuckEditorViewProps {
  * }
  * ```
  */
-export declare function PuckEditorView({ config, collectionSlug, apiBasePath, backUrl, previewUrl, layoutStyles, layoutKey, plugins, onSaveSuccess, onSaveError, }: PuckEditorViewProps): import("react/jsx-runtime").JSX.Element;
+export declare function PuckEditorView({ config, collectionSlug, apiBasePath, backUrl, previewUrl, layoutStyles, layoutKey, plugins, onSaveSuccess, onSaveError, }: PuckEditorViewProps): import("react").JSX.Element;
 export default PuckEditorView;
 //# sourceMappingURL=PuckEditorView.d.ts.map

package/dist/admin/PuckEditorView.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PuckEditorView.d.ts","sourceRoot":"","sources":["../../src/admin/PuckEditorView.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,MAAM,IAAI,UAAU,EAAE,IAAI,EAAE,MAAM,IAAI,UAAU,EAAE,MAAM,kBAAkB,CAAA;AAExF;;GAEG;AACH,MAAM,WAAW,mBAAmB;IAClC;;OAEG;IACH,MAAM,EAAE,UAAU,CAAA;IAClB;;;OAGG;IACH,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB;;OAEG;IACH,UAAU,CAAC,EAAE,MAAM,GAAG,CAAC,CAAC,IAAI,EAAE,MAAM,KAAK,MAAM,CAAC,CAAA;IAChD;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE;QAAE,UAAU,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,OAAO,CAAA;KAAE,CAAC,CAAA;IACtE;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;;;OAIG;IACH,OAAO,CAAC,EAAE,UAAU,EAAE,GAAG,KAAK,CAAA;IAC9B;;OAEG;IACH,aAAa,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAA;IACpC;;OAEG;IACH,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAA;CACrC;AAUD;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,wBAAgB,cAAc,CAAC,EAC7B,MAAM,EACN,cAAwB,EACxB,WAAyB,EACzB,OAAO,EACP,UAAU,EACV,YAAY,EACZ,SAAwB,EACxB,OAAO,EACP,aAAa,EACb,WAAW,GACZ,EAAE,mBAAmB,2CAkKrB;AAED,eAAe,cAAc,CAAA"}
+{"version":3,"file":"PuckEditorView.d.ts","sourceRoot":"","sources":["../../src/admin/PuckEditorView.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,MAAM,IAAI,UAAU,EAAE,IAAI,EAAE,MAAM,IAAI,UAAU,EAAE,MAAM,kBAAkB,CAAA;AAExF;;GAEG;AACH,MAAM,WAAW,mBAAmB;IAClC;;OAEG;IACH,MAAM,EAAE,UAAU,CAAA;IAClB;;;OAGG;IACH,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB;;OAEG;IACH,UAAU,CAAC,EAAE,MAAM,GAAG,CAAC,CAAC,IAAI,EAAE,MAAM,KAAK,MAAM,CAAC,CAAA;IAChD;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE;QAAE,UAAU,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,OAAO,CAAA;KAAE,CAAC,CAAA;IACtE;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;;;OAIG;IACH,OAAO,CAAC,EAAE,UAAU,EAAE,GAAG,KAAK,CAAA;IAC9B;;OAEG;IACH,aAAa,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAA;IACpC;;OAEG;IACH,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAA;CACrC;AAUD;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,wBAAgB,cAAc,CAAC,EAC7B,MAAM,EACN,cAAwB,EACxB,WAAyB,EACzB,OAAO,EACP,UAAU,EACV,YAAY,EACZ,SAAwB,EACxB,OAAO,EACP,aAAa,EACb,WAAW,GACZ,EAAE,mBAAmB,+BAkKrB;AAED,eAAe,cAAc,CAAA"}

package/dist/admin/PuckEditorView.js

@@ -28,8 +28,7 @@ import { useParams, useSearchParams } from 'next/navigation';
  *   )
  * }
  * ```
- */
-export function PuckEditorView({ config, collectionSlug = 'pages', apiBasePath = '/api/puck', backUrl, previewUrl, layoutStyles, layoutKey = 'pageLayout', plugins, onSaveSuccess, onSaveError, }) {
+ */ export function PuckEditorView({ config, collectionSlug = 'pages', apiBasePath = '/api/puck', backUrl, previewUrl, layoutStyles, layoutKey = 'pageLayout', plugins, onSaveSuccess, onSaveError }) {
     const params = useParams();
     const searchParams = useSearchParams();
     // Get page ID from route params or search params
@@ -39,12 +38,12 @@ export function PuckEditorView({ config, collectionSlug = 'pages', apiBasePath =
     const [error, setError] = useState(null);
     const [PuckEditor, setPuckEditor] = useState(null);
     // Dynamically import PuckEditor to avoid SSR issues
-    useEffect(() => {
-        import('../editor/PuckEditor').then((mod) => {
-            setPuckEditor(() => mod.PuckEditor);
+    useEffect(()=>{
+        import('../editor/PuckEditor.js').then((mod)=>{
+            setPuckEditor(()=>mod.PuckEditor);
         });
     }, []);
-    useEffect(() => {
+    useEffect(()=>{
         async function fetchPage() {
             if (!pageId) {
                 setError('No page ID provided');
@@ -55,81 +54,168 @@ export function PuckEditorView({ config, collectionSlug = 'pages', apiBasePath =
                 setLoading(true);
                 const response = await fetch(`${apiBasePath}/${collectionSlug}/${pageId}`);
                 if (!response.ok) {
-                    const data = await response.json().catch(() => ({}));
+                    const data = await response.json().catch(()=>({}));
                     throw new Error(data.error || `Failed to fetch page: ${response.status}`);
                 }
                 const data = await response.json();
                 setPage(data.doc);
-            }
-            catch (err) {
+            } catch (err) {
                 setError(err instanceof Error ? err.message : 'An error occurred');
-            }
-            finally {
+            } finally{
                 setLoading(false);
             }
         }
         fetchPage();
-    }, [pageId, apiBasePath, collectionSlug]);
+    }, [
+        pageId,
+        apiBasePath,
+        collectionSlug
+    ]);
     const computedBackUrl = backUrl || `/admin/collections/${collectionSlug}`;
     if (loading || !PuckEditor) {
-        return (_jsx("div", { style: {
+        return /*#__PURE__*/ _jsx("div", {
+            style: {
                 display: 'flex',
                 height: '100vh',
                 alignItems: 'center',
                 justifyContent: 'center',
                 backgroundColor: '#0f0f0f',
-                color: '#fff',
-            }, children: _jsxs("div", { style: { textAlign: 'center' }, children: [_jsx("div", { style: {
+                color: '#fff'
+            },
+            children: /*#__PURE__*/ _jsxs("div", {
+                style: {
+                    textAlign: 'center'
+                },
+                children: [
+                    /*#__PURE__*/ _jsx("div", {
+                        style: {
                             width: '32px',
                             height: '32px',
                             border: '3px solid #333',
                             borderTopColor: '#fff',
                             borderRadius: '50%',
                             animation: 'spin 1s linear infinite',
-                            margin: '0 auto 16px',
-                        } }), _jsx("p", { style: { color: '#888' }, children: "Loading editor..." }), _jsx("style", { children: `
+                            margin: '0 auto 16px'
+                        }
+                    }),
+                    /*#__PURE__*/ _jsx("p", {
+                        style: {
+                            color: '#888'
+                        },
+                        children: "Loading editor..."
+                    }),
+                    /*#__PURE__*/ _jsx("style", {
+                        children: `
             @keyframes spin {
               to { transform: rotate(360deg); }
             }
-          ` })] }) }));
+          `
+                    })
+                ]
+            })
+        });
     }
     if (error) {
-        return (_jsx("div", { style: {
+        return /*#__PURE__*/ _jsx("div", {
+            style: {
                 display: 'flex',
                 height: '100vh',
                 alignItems: 'center',
                 justifyContent: 'center',
                 backgroundColor: '#0f0f0f',
-                color: '#fff',
-            }, children: _jsxs("div", { style: { textAlign: 'center' }, children: [_jsx("p", { style: { color: '#f87171', marginBottom: '16px' }, children: error }), _jsxs("a", { href: computedBackUrl, style: {
+                color: '#fff'
+            },
+            children: /*#__PURE__*/ _jsxs("div", {
+                style: {
+                    textAlign: 'center'
+                },
+                children: [
+                    /*#__PURE__*/ _jsx("p", {
+                        style: {
+                            color: '#f87171',
+                            marginBottom: '16px'
+                        },
+                        children: error
+                    }),
+                    /*#__PURE__*/ _jsxs("a", {
+                        href: computedBackUrl,
+                        style: {
                             color: '#60a5fa',
-                            textDecoration: 'underline',
-                        }, children: ["Back to ", collectionSlug] })] }) }));
+                            textDecoration: 'underline'
+                        },
+                        children: [
+                            "Back to ",
+                            collectionSlug
+                        ]
+                    })
+                ]
+            })
+        });
     }
     if (!page) {
-        return (_jsx("div", { style: {
+        return /*#__PURE__*/ _jsx("div", {
+            style: {
                 display: 'flex',
                 height: '100vh',
                 alignItems: 'center',
                 justifyContent: 'center',
                 backgroundColor: '#0f0f0f',
-                color: '#fff',
-            }, children: _jsxs("div", { style: { textAlign: 'center' }, children: [_jsx("p", { style: { color: '#888', marginBottom: '16px' }, children: "Page not found" }), _jsxs("a", { href: computedBackUrl, style: {
+                color: '#fff'
+            },
+            children: /*#__PURE__*/ _jsxs("div", {
+                style: {
+                    textAlign: 'center'
+                },
+                children: [
+                    /*#__PURE__*/ _jsx("p", {
+                        style: {
+                            color: '#888',
+                            marginBottom: '16px'
+                        },
+                        children: "Page not found"
+                    }),
+                    /*#__PURE__*/ _jsxs("a", {
+                        href: computedBackUrl,
+                        style: {
                             color: '#60a5fa',
-                            textDecoration: 'underline',
-                        }, children: ["Back to ", collectionSlug] })] }) }));
+                            textDecoration: 'underline'
+                        },
+                        children: [
+                            "Back to ",
+                            collectionSlug
+                        ]
+                    })
+                ]
+            })
+        });
     }
     // Default puck data if none exists
     const initialData = page.puckData || {
         root: {
             props: {
-                title: page.title || 'New Page',
-            },
+                title: page.title || 'New Page'
+            }
         },
         content: [],
-        zones: {},
+        zones: {}
     };
-    return (_jsx(PuckEditor, { pageId: page.id, initialData: initialData, config: config, pageTitle: page.title, pageSlug: page.slug, apiEndpoint: `${apiBasePath}/${collectionSlug}`, backUrl: computedBackUrl, previewUrl: previewUrl, layoutStyles: layoutStyles, layoutKey: layoutKey, plugins: plugins, onSaveSuccess: onSaveSuccess, onSaveError: onSaveError, initialStatus: page._status }));
+    return /*#__PURE__*/ _jsx(PuckEditor, {
+        pageId: page.id,
+        initialData: initialData,
+        config: config,
+        pageTitle: page.title,
+        pageSlug: page.slug,
+        apiEndpoint: `${apiBasePath}/${collectionSlug}`,
+        backUrl: computedBackUrl,
+        previewUrl: previewUrl,
+        layoutStyles: layoutStyles,
+        layoutKey: layoutKey,
+        plugins: plugins,
+        onSaveSuccess: onSaveSuccess,
+        onSaveError: onSaveError,
+        initialStatus: page._status
+    });
 }
 export default PuckEditorView;
+
 //# sourceMappingURL=PuckEditorView.js.map