@delmaredigital/payload-puck 0.1.0

package/dist/render/index.d.mts

@@ -0,0 +1,109 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { Data, Config } from '@measured/puck';
+import { L as LayoutDefinition } from '../types-D7D3rZ1J.mjs';
+import { ReactNode } from 'react';
+
+interface PageRendererProps {
+    /**
+     * Puck data to render
+     */
+    data: Data;
+    /**
+     * Puck configuration to use
+     * @default baseConfig
+     */
+    config?: Config;
+    /**
+     * Optional wrapper component (takes precedence over layout)
+     */
+    wrapper?: React.ComponentType<{
+        children: React.ReactNode;
+    }>;
+    /**
+     * Optional className for the wrapper
+     */
+    className?: string;
+    /**
+     * Available layouts for this page
+     * @default DEFAULT_LAYOUTS
+     */
+    layouts?: LayoutDefinition[];
+}
+/**
+ * Renders a Puck page using the provided data and configuration
+ *
+ * @example
+ * ```tsx
+ * import { PageRenderer } from '@delmaredigital/payload-puck/render'
+ * import { baseConfig } from '@delmaredigital/payload-puck/config'
+ * import { ThemeProvider } from '@delmaredigital/payload-puck/theme'
+ *
+ * export default async function Page({ params }) {
+ *   const page = await getPage(params.slug)
+ *
+ *   // Wrap with ThemeProvider if using theming
+ *   return (
+ *     <ThemeProvider theme={myTheme}>
+ *       <PageRenderer data={page.puckData} config={baseConfig} />
+ *     </ThemeProvider>
+ *   )
+ * }
+ * ```
+ */
+declare function PageRenderer({ data, config, wrapper: Wrapper, className, layouts, }: PageRendererProps): react_jsx_runtime.JSX.Element;
+
+/**
+ * Page data shape for hybrid rendering
+ */
+interface HybridPageData {
+    /**
+     * Which editor was used to create the page
+     * - 'puck': Page was created/edited with Puck visual editor
+     * - 'legacy': Page uses traditional Payload block fields
+     */
+    editorVersion?: 'legacy' | 'puck';
+    /**
+     * Puck editor data (for pages with editorVersion: 'puck')
+     */
+    puckData?: Data | null;
+    /**
+     * Legacy blocks array (for pages with editorVersion: 'legacy')
+     * The field name varies by project (e.g., 'layout', 'blocks', 'content')
+     */
+    [key: string]: unknown;
+}
+interface HybridPageRendererProps extends Omit<PageRendererProps, 'data'> {
+    /**
+     * Page document containing editorVersion, puckData, and optionally legacy blocks
+     */
+    page: HybridPageData;
+    /**
+     * Render function for legacy Payload blocks.
+     * Called when editorVersion is 'legacy' or when puckData is not available.
+     *
+     * @param blocks - The legacy blocks array from the page
+     * @returns React node to render
+     */
+    legacyRenderer: (blocks: unknown[]) => ReactNode;
+    /**
+     * Name of the field containing legacy blocks
+     * @default 'layout'
+     */
+    legacyBlocksField?: string;
+    /**
+     * Fallback content when no content is available
+     * @default <div>No content available</div>
+     */
+    fallback?: ReactNode;
+}
+/**
+ * Renders a page using either Puck or legacy Payload blocks
+ *
+ * Decision logic:
+ * 1. If editorVersion is 'puck' AND puckData has content → render with PageRenderer
+ * 2. If legacy blocks exist → render with legacyRenderer
+ * 3. Otherwise → render fallback
+ */
+declare function HybridPageRenderer({ page, legacyRenderer, legacyBlocksField, fallback, config, layouts, wrapper, className, }: HybridPageRendererProps): react_jsx_runtime.JSX.Element;
+
+export { type HybridPageData, HybridPageRenderer, type HybridPageRendererProps, PageRenderer, type PageRendererProps };

package/dist/render/index.d.ts

@@ -0,0 +1,109 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { Data, Config } from '@measured/puck';
+import { L as LayoutDefinition } from '../types-D7D3rZ1J.js';
+import { ReactNode } from 'react';
+
+interface PageRendererProps {
+    /**
+     * Puck data to render
+     */
+    data: Data;
+    /**
+     * Puck configuration to use
+     * @default baseConfig
+     */
+    config?: Config;
+    /**
+     * Optional wrapper component (takes precedence over layout)
+     */
+    wrapper?: React.ComponentType<{
+        children: React.ReactNode;
+    }>;
+    /**
+     * Optional className for the wrapper
+     */
+    className?: string;
+    /**
+     * Available layouts for this page
+     * @default DEFAULT_LAYOUTS
+     */
+    layouts?: LayoutDefinition[];
+}
+/**
+ * Renders a Puck page using the provided data and configuration
+ *
+ * @example
+ * ```tsx
+ * import { PageRenderer } from '@delmaredigital/payload-puck/render'
+ * import { baseConfig } from '@delmaredigital/payload-puck/config'
+ * import { ThemeProvider } from '@delmaredigital/payload-puck/theme'
+ *
+ * export default async function Page({ params }) {
+ *   const page = await getPage(params.slug)
+ *
+ *   // Wrap with ThemeProvider if using theming
+ *   return (
+ *     <ThemeProvider theme={myTheme}>
+ *       <PageRenderer data={page.puckData} config={baseConfig} />
+ *     </ThemeProvider>
+ *   )
+ * }
+ * ```
+ */
+declare function PageRenderer({ data, config, wrapper: Wrapper, className, layouts, }: PageRendererProps): react_jsx_runtime.JSX.Element;
+
+/**
+ * Page data shape for hybrid rendering
+ */
+interface HybridPageData {
+    /**
+     * Which editor was used to create the page
+     * - 'puck': Page was created/edited with Puck visual editor
+     * - 'legacy': Page uses traditional Payload block fields
+     */
+    editorVersion?: 'legacy' | 'puck';
+    /**
+     * Puck editor data (for pages with editorVersion: 'puck')
+     */
+    puckData?: Data | null;
+    /**
+     * Legacy blocks array (for pages with editorVersion: 'legacy')
+     * The field name varies by project (e.g., 'layout', 'blocks', 'content')
+     */
+    [key: string]: unknown;
+}
+interface HybridPageRendererProps extends Omit<PageRendererProps, 'data'> {
+    /**
+     * Page document containing editorVersion, puckData, and optionally legacy blocks
+     */
+    page: HybridPageData;
+    /**
+     * Render function for legacy Payload blocks.
+     * Called when editorVersion is 'legacy' or when puckData is not available.
+     *
+     * @param blocks - The legacy blocks array from the page
+     * @returns React node to render
+     */
+    legacyRenderer: (blocks: unknown[]) => ReactNode;
+    /**
+     * Name of the field containing legacy blocks
+     * @default 'layout'
+     */
+    legacyBlocksField?: string;
+    /**
+     * Fallback content when no content is available
+     * @default <div>No content available</div>
+     */
+    fallback?: ReactNode;
+}
+/**
+ * Renders a page using either Puck or legacy Payload blocks
+ *
+ * Decision logic:
+ * 1. If editorVersion is 'puck' AND puckData has content → render with PageRenderer
+ * 2. If legacy blocks exist → render with legacyRenderer
+ * 3. Otherwise → render fallback
+ */
+declare function HybridPageRenderer({ page, legacyRenderer, legacyBlocksField, fallback, config, layouts, wrapper, className, }: HybridPageRendererProps): react_jsx_runtime.JSX.Element;
+
+export { type HybridPageData, HybridPageRenderer, type HybridPageRendererProps, PageRenderer, type PageRendererProps };