@delmaredigital/payload-puck 0.7.0 → 0.8.1

package/README.md

@@ -43,6 +43,50 @@ 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.8.0 (breaking)
+
+**Editor CSS is now built by your app, not by this plugin.** Three options collapse into one, and `withPuckCSS` is gone.
+
+Add a build step using Tailwind's own CLI. Tailwind v4 ships the CLI as a separate package:
+
+```bash
+pnpm add -D @tailwindcss/cli   # v4 only; v3 already provides the `tailwindcss` binary
+```
+
+```jsonc
+// package.json — quote the paths; App Router route groups like (frontend) are shell syntax
+"scripts": {
+  "build:puck-css": "tailwindcss -i './src/app/(frontend)/globals.css' -o './public/puck-editor-styles.css'",
+  "dev:puck-css": "tailwindcss -i './src/app/(frontend)/globals.css' -o './public/puck-editor-styles.css' --watch",
+  "build": "pnpm build:puck-css && next build",
+  "dev": "pnpm build:puck-css && next dev"
+}
+```
+
+Add `public/puck-editor-styles.css` to `.gitignore` — it's a build artifact. Run `dev:puck-css` in a second terminal while actively editing theme CSS.
+
+Then pass the URL:
+
+```typescript
+// before
+createPuckPlugin({
+  editorStylesheet: 'src/app/(frontend)/globals.css',
+  editorStylesheetCompiled: '/puck-editor-styles.css',
+  editorStylesheetUrls: ['https://fonts.googleapis.com/css2?family=Inter'],
+})
+
+// after
+createPuckPlugin({
+  editorStylesheets: ['/puck-editor-styles.css', 'https://fonts.googleapis.com/css2?family=Inter'],
+})
+```
+
+Finally, remove the `withPuckCSS` import and wrapper from `next.config.js`, and drop any `editorStylesheets` prop on `PuckConfigProvider` — the plugin wires it through automatically now.
+
+> **Why:** the old approach compiled CSS at runtime in dev and via a **webpack plugin** in production. Next.js 16 defaults to Turbopack, which never runs `webpack()` hooks — so the production stylesheet was silently never generated and the editor rendered unstyled, while local dev looked perfect. One artifact, built by your own toolchain, now resolves identically everywhere.
+
+Also removed: the `/api/puck/styles` endpoint, the `/next` entry point, and the `postcss` / `postcss-load-config` peer dependencies.
+
 ### Upgrading to 0.7.0 (breaking)
 
 `0.7.0` raises two floors. Both are a one-line change for most projects:

package/dist/plugin/index.d.ts

@@ -42,7 +42,6 @@ export { generatePagesCollection } from './collections/Pages.js';
 export { TemplatesCollection } from '../collections/Templates.js';
 export { getPuckFields, getPuckCollectionConfig, puckDataField, editorVersionField, createEditorVersionField, pageLayoutField, createPageLayoutField, isHomepageField, seoFieldGroup, conversionFieldGroup, } from './fields/index.js';
 export { generatePuckEditField };
-export { PUCK_STYLES_ENDPOINT } from '../endpoints/styles.js';
 export { createIsHomepageUniqueHook, unsetHomepage, HomepageConflictError, } from './hooks/index.js';
 export type { IsHomepageUniqueHookOptions } from './hooks/index.js';
 export type { PuckPluginOptions, PuckAdminConfig } from '../types/index.js';

package/dist/plugin/index.js

@@ -5,7 +5,6 @@ import { AiContextCollection } from '../ai/collections/AiContext.js';
 import { getPuckFields } from './fields/index.js';
 import { createIsHomepageUniqueHook } from './hooks/isHomepageUnique.js';
 import { createListHandler, createCreateHandler, createGetHandler, createUpdateHandler, createDeleteHandler, createVersionsHandler, createRestoreHandler } from '../endpoints/index.js';
-import { createStylesHandler, PUCK_STYLES_ENDPOINT } from '../endpoints/styles.js';
 import { createAiEndpointHandler } from '../endpoints/ai.js';
 import { createPromptsListHandler, createPromptsCreateHandler, createPromptsUpdateHandler, createPromptsDeleteHandler } from '../endpoints/prompts.js';
 import { createContextListHandler, createContextCreateHandler, createContextUpdateHandler, createContextDeleteHandler } from '../endpoints/context.js';
@@ -105,7 +104,7 @@ import { createContextListHandler, createContextCreateHandler, createContextUpda
  * })
  * ```
  */ export function createPuckPlugin(options = {}) {
-    const { pagesCollection = 'pages', autoGenerateCollection = true, admin: pluginAdminConfig = {}, enableAdminView = true, adminViewPath = '/puck-editor', enableEndpoints = true, pageTreeIntegration, editorStylesheet, editorStylesheetUrls = [], editorStylesheetCompiled, ai: aiConfig, previewUrl, rootPropsMapping } = options;
+    const { pagesCollection = 'pages', autoGenerateCollection = true, admin: pluginAdminConfig = {}, enableAdminView = true, adminViewPath = '/puck-editor', enableEndpoints = true, pageTreeIntegration, editorStylesheets: editorStylesheetsOption = [], ai: aiConfig, previewUrl, rootPropsMapping } = options;
     const { addEditButton = true } = pluginAdminConfig;
     // Parse page-tree integration config
     // - undefined: auto-detect at runtime (null stored, view will check for pageSegment field)
@@ -274,32 +273,17 @@ import { createContextListHandler, createContextCreateHandler, createContextUpda
             '/puck/:collection/:id/versions',
             '/puck/:collection/:id/restore'
         ]);
-        // Build styles endpoint URL list for PuckConfigProvider
-        // In production, prefer the pre-compiled static CSS file if provided
-        // In development, use runtime compilation endpoint for hot reload
-        const isProduction = process.env.NODE_ENV === 'production';
-        const useCompiledCss = isProduction && editorStylesheetCompiled;
+        // Stylesheet URLs for the editor preview iframe. These are passed straight
+        // through: the same URLs resolve in development and production, so the
+        // editor can no longer look correct locally and unstyled in production.
         const editorStylesheets = [
-            ...useCompiledCss ? [
-                editorStylesheetCompiled
-            ] : editorStylesheet ? [
-                PUCK_STYLES_ENDPOINT
-            ] : [],
-            ...editorStylesheetUrls
+            ...editorStylesheetsOption
         ];
         // Filter out parameterized puck endpoints from previous plugin instances
         // so we can re-register them with the merged collections list
         const incomingEndpoints = (incomingConfig.endpoints || []).filter((ep)=>!parameterizedPuckPaths.has(ep.path));
         const endpoints = enableEndpoints ? [
             ...incomingEndpoints,
-            // Styles endpoint MUST be first - exact match before parameterized routes
-            ...editorStylesheet ? [
-                {
-                    path: '/puck/styles',
-                    method: 'get',
-                    handler: createStylesHandler(editorStylesheet)
-                }
-            ] : [],
             // AI endpoint (exact match, before parameterized routes)
             ...aiConfig?.enabled ? [
                 {
@@ -441,7 +425,5 @@ export { TemplatesCollection } from '../collections/Templates.js';
 export { getPuckFields, getPuckCollectionConfig, puckDataField, editorVersionField, createEditorVersionField, pageLayoutField, createPageLayoutField, isHomepageField, seoFieldGroup, conversionFieldGroup } from './fields/index.js';
 // Export the edit button generator for hybrid collections
 export { generatePuckEditField };
-// Export styles endpoint constant
-export { PUCK_STYLES_ENDPOINT } from '../endpoints/styles.js';
 // Re-export hooks for hybrid collection integration
 export { createIsHomepageUniqueHook, unsetHomepage, HomepageConflictError } from './hooks/index.js';

package/dist/types/index.d.ts

@@ -141,42 +141,44 @@ export interface PuckPluginOptions {
      */
     pageTreeIntegration?: boolean | PageTreeIntegrationOptions;
     /**
-     * Path to CSS file for editor iframe styling.
-     * The plugin compiles this file with PostCSS/Tailwind and serves it at /api/puck/styles.
-     * This allows the editor preview to display your frontend styles (CSS variables, Tailwind utilities).
+     * Stylesheet URLs to load inside the editor preview iframe, in order.
      *
-     * @example 'src/app/(frontend)/globals.css'
-     * @example 'src/styles/globals.css'
-     */
-    editorStylesheet?: string;
-    /**
-     * Additional stylesheet URLs to load in the editor iframe.
-     * Use this for external stylesheets like Google Fonts that can't be compiled.
+     * These are plain URLs the browser fetches — a static file your build emits,
+     * or any external stylesheet. The plugin does not compile CSS: your app's own
+     * toolchain already does that far better than we can, and compiling it a
+     * second time was the source of a dev/production split where the editor
+     * looked correct locally and unstyled in production.
      *
-     * @example ['https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700']
-     */
-    editorStylesheetUrls?: string[];
-    /**
-     * Path to pre-compiled CSS file for production use.
-     * When set, the editor will load this static file instead of using the runtime compilation endpoint.
-     * Use with `withPuckCSS()` from `@delmaredigital/payload-puck/next` to compile CSS at build time.
+     * Generate the file with Tailwind's own CLI as part of your build, so the
+     * editor loads byte-identical CSS in every environment:
      *
-     * @example '/puck-editor-styles.css'
+     * ```jsonc
+     * // package.json
+     * {
+     *   "scripts": {
+     *     "build:puck-css": "tailwindcss -i ./src/app/(frontend)/globals.css -o ./public/puck-editor-styles.css",
+     *     "build": "pnpm build:puck-css && next build",
+     *     "dev": "pnpm build:puck-css --watch & next dev"
+     *   }
+     * }
+     * ```
      *
-     * @example
      * ```typescript
-     * // next.config.js
-     * import { withPuckCSS } from '@delmaredigital/payload-puck/next'
-     * export default withPuckCSS({ cssInput: 'src/globals.css' })(nextConfig)
-     *
-     * // payload.config.ts
      * createPuckPlugin({
-     *   editorStylesheet: 'src/globals.css', // For dev (runtime compilation)
-     *   editorStylesheetCompiled: '/puck-editor-styles.css', // For prod (static file)
+     *   editorStylesheets: [
+     *     '/puck-editor-styles.css',
+     *     'https://fonts.googleapis.com/css2?family=Inter:wght@400;700',
+     *   ],
      * })
      * ```
+     *
+     * Resolved URLs are published on `config.custom.puck.editorStylesheets` and
+     * passed to the editor automatically — you do not need to repeat them on
+     * `PuckConfigProvider`.
+     *
+     * @example ['/puck-editor-styles.css']
      */
-    editorStylesheetCompiled?: string;
+    editorStylesheets?: string[];
     /**
      * AI configuration for the plugin.
      * Enables AI-powered page generation in the editor.

package/dist/version.d.ts

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

package/dist/version.js

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

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@delmaredigital/payload-puck",
-  "version": "0.7.0",
+  "version": "0.8.1",
   "description": "Puck visual page builder plugin for Payload CMS",
   "type": "module",
   "license": "MIT",
@@ -82,11 +82,6 @@
       "types": "./dist/ai/index.d.ts",
       "default": "./dist/ai/index.js"
     },
-    "./next": {
-      "import": "./dist/next/index.js",
-      "types": "./dist/next/index.d.ts",
-      "default": "./dist/next/index.js"
-    },
     "./email": {
       "import": "./dist/email/index.js",
       "types": "./dist/email/index.d.ts",
@@ -123,8 +118,6 @@
     "@tailwindcss/postcss": ">=4.0.0",
     "next": ">=15.4.8",
     "payload": ">=3.69.0",
-    "postcss": ">=8.0.0",
-    "postcss-load-config": ">=4.0.0",
     "react": ">=19.2.1",
     "react-dom": ">=19.2.1",
     "tailwindcss": ">=3.0.0 || >=4.0.0",
@@ -137,12 +130,6 @@
     "@payloadcms/next": {
       "optional": true
     },
-    "postcss": {
-      "optional": true
-    },
-    "postcss-load-config": {
-      "optional": true
-    },
     "tailwindcss": {
       "optional": true
     },

package/dist/endpoints/postcss.d.js

@@ -1,4 +0,0 @@
-/**
- * Ambient type declarations for optional PostCSS/Tailwind peer dependencies
- * These modules are dynamically imported at runtime from the consumer's project
- */ 

package/dist/endpoints/styles.d.ts

@@ -1,19 +0,0 @@
-/**
- * Styles Endpoint Handler
- *
- * Compiles and serves CSS for the editor iframe.
- * Uses the consumer's PostCSS/Tailwind installation via peer dependencies.
- * Loads the project's postcss.config.js for proper plugin configuration.
- */
-import type { PayloadHandler } from 'payload';
-/**
- * Creates a handler that serves compiled CSS for the editor iframe
- *
- * @param cssFilePath - Path to CSS file relative to project root
- * @returns PayloadHandler that serves compiled CSS
- */
-export declare function createStylesHandler(cssFilePath: string): PayloadHandler;
-/**
- * Helper constant for the styles endpoint URL
- */
-export declare const PUCK_STYLES_ENDPOINT = "/api/puck/styles";

package/dist/endpoints/styles.js

@@ -1,153 +0,0 @@
-/**
- * Styles Endpoint Handler
- *
- * Compiles and serves CSS for the editor iframe.
- * Uses the consumer's PostCSS/Tailwind installation via peer dependencies.
- * Loads the project's postcss.config.js for proper plugin configuration.
- */ import { readFileSync, statSync, existsSync } from 'fs';
-import { join } from 'path';
-const cssCache = new Map();
-/**
- * Compile CSS using PostCSS with the project's configuration
- * Loads postcss.config.js from project root for proper plugin setup
- * Falls back to minimal Tailwind-only config if no config file found
- */ async function compileCss(css, filePath) {
-    try {
-        // Dynamic import to use consumer's PostCSS installation
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        let postcss;
-        try {
-            postcss = (await import(/* webpackIgnore: true */ 'postcss')).default;
-        } catch  {
-            console.warn('[payload-puck] PostCSS not found. CSS will not be processed. Install postcss as a dependency.');
-            return css;
-        }
-        // Try to load the project's postcss.config.js using postcss-load-config
-        // This ensures all plugins (typography, etc.) are properly loaded
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        let processor;
-        let usedProjectConfig = false;
-        try {
-            // Dynamic import of postcss-load-config (optional peer dependency)
-            // This package is commonly installed alongside PostCSS
-            const loadConfigModule = await import(/* webpackIgnore: true */ // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-            // @ts-ignore - optional dependency may not have types
-            'postcss-load-config');
-            const postcssLoadConfig = loadConfigModule.default;
-            // Load config from project root (where postcss.config.js lives)
-            const { plugins } = await postcssLoadConfig({}, process.cwd());
-            processor = postcss(plugins);
-            usedProjectConfig = true;
-        } catch  {
-            // postcss-load-config not available or no config found - this is fine
-            // Fall back to direct Tailwind import silently
-            // Try Tailwind v4 first (@tailwindcss/postcss)
-            try {
-                const tailwindcss = (await import(/* webpackIgnore: true */ '@tailwindcss/postcss')).default;
-                processor = postcss([
-                    tailwindcss
-                ]);
-            } catch  {
-                // Fall back to Tailwind v3 (tailwindcss)
-                try {
-                    const tailwindcss = (await import(/* webpackIgnore: true */ 'tailwindcss')).default;
-                    processor = postcss([
-                        tailwindcss
-                    ]);
-                } catch  {
-                    // No Tailwind available - just return the CSS as-is
-                    console.warn('[payload-puck] No Tailwind CSS installation found. CSS will not be processed.');
-                    return css;
-                }
-            }
-        }
-        const result = await processor.process(css, {
-            from: filePath
-        });
-        return result.css;
-    } catch (error) {
-        console.error('[payload-puck] CSS compilation error:', error);
-        throw error;
-    }
-}
-/**
- * Creates a handler that serves compiled CSS for the editor iframe
- *
- * @param cssFilePath - Path to CSS file relative to project root
- * @returns PayloadHandler that serves compiled CSS
- */ export function createStylesHandler(cssFilePath) {
-    return async (req)=>{
-        try {
-            const fullPath = join(process.cwd(), cssFilePath);
-            // Check if file exists
-            if (!existsSync(fullPath)) {
-                console.error(`[payload-puck] CSS file not found: ${fullPath}`);
-                return new Response(`/* CSS file not found: ${cssFilePath} */`, {
-                    status: 404,
-                    headers: {
-                        'Content-Type': 'text/css'
-                    }
-                });
-            }
-            // Get file modification time for cache invalidation
-            const stats = statSync(fullPath);
-            const mtime = stats.mtimeMs;
-            // ETag derived from mtime - changes whenever the source file changes,
-            // whether from a dev-mode edit or a version upgrade recompiling output.
-            const etag = `"${mtime}"`;
-            // If the browser's cached copy is still fresh, tell it so without
-            // doing any file read/compilation work.
-            const ifNoneMatch = req.headers?.get('if-none-match');
-            if (ifNoneMatch === etag) {
-                return new Response(null, {
-                    status: 304,
-                    headers: {
-                        ETag: etag,
-                        'Cache-Control': 'no-cache'
-                    }
-                });
-            }
-            // Check cache
-            const cached = cssCache.get(cssFilePath);
-            if (cached && cached.mtime === mtime) {
-                return new Response(cached.css, {
-                    headers: {
-                        'Content-Type': 'text/css',
-                        'Cache-Control': 'no-cache',
-                        ETag: etag,
-                        'Last-Modified': new Date(mtime).toUTCString(),
-                        'X-Puck-Cache': 'hit'
-                    }
-                });
-            }
-            // Read and compile CSS
-            const rawCss = readFileSync(fullPath, 'utf-8');
-            const compiledCss = await compileCss(rawCss, fullPath);
-            // Update cache
-            cssCache.set(cssFilePath, {
-                css: compiledCss,
-                mtime
-            });
-            return new Response(compiledCss, {
-                headers: {
-                    'Content-Type': 'text/css',
-                    'Cache-Control': 'no-cache',
-                    ETag: etag,
-                    'Last-Modified': new Date(mtime).toUTCString(),
-                    'X-Puck-Cache': 'miss'
-                }
-            });
-        } catch (error) {
-            console.error('[payload-puck] Styles endpoint error:', error);
-            return new Response(`/* Error compiling CSS: ${error instanceof Error ? error.message : 'Unknown error'} */`, {
-                status: 500,
-                headers: {
-                    'Content-Type': 'text/css'
-                }
-            });
-        }
-    };
-}
-/**
- * Helper constant for the styles endpoint URL
- */ export const PUCK_STYLES_ENDPOINT = '/api/puck/styles';

package/dist/next/index.d.ts

@@ -1,64 +0,0 @@
-/**
- * Next.js Configuration Wrapper for Puck CSS
- *
- * Compiles CSS at build time using the project's PostCSS/Tailwind configuration.
- * This ensures the editor iframe styles work in production (Vercel, etc.) where
- * source files aren't available at runtime.
- *
- * @example
- * ```js
- * // next.config.js
- * import { withPuckCSS } from '@delmaredigital/payload-puck/next'
- * import { withPayload } from '@payloadcms/next/withPayload'
- *
- * export default withPuckCSS({
- *   cssInput: 'src/app/(frontend)/globals.css',
- * })(withPayload(nextConfig))
- * ```
- */
-import type { NextConfig } from 'next';
-/**
- * Options for the withPuckCSS wrapper
- */
-export interface WithPuckCSSOptions {
-    /**
-     * Path to the source CSS file (relative to project root)
-     * @example 'src/app/(frontend)/globals.css'
-     */
-    cssInput: string;
-    /**
-     * Output path for compiled CSS (relative to public/)
-     * @default 'puck-editor-styles.css'
-     */
-    cssOutput?: string;
-    /**
-     * Whether to skip compilation in development
-     * @default true
-     */
-    skipInDev?: boolean;
-}
-/**
- * Default output filename for compiled CSS
- */
-export declare const PUCK_CSS_OUTPUT_DEFAULT = "puck-editor-styles.css";
-/**
- * Next.js configuration wrapper that compiles Puck editor CSS at build time
- *
- * @param options - Configuration options
- * @returns A function that wraps your Next.js config
- *
- * @example
- * ```js
- * import { withPuckCSS } from '@delmaredigital/payload-puck/next'
- *
- * export default withPuckCSS({
- *   cssInput: 'src/app/(frontend)/globals.css',
- * })(nextConfig)
- * ```
- */
-export declare function withPuckCSS(options: WithPuckCSSOptions): (nextConfig: NextConfig) => NextConfig;
-/**
- * Get the URL path for the compiled CSS file
- * Use this in your plugin configuration
- */
-export declare function getPuckCSSPath(cssOutput?: string): string;

package/dist/next/index.js

@@ -1,155 +0,0 @@
-/**
- * Next.js Configuration Wrapper for Puck CSS
- *
- * Compiles CSS at build time using the project's PostCSS/Tailwind configuration.
- * This ensures the editor iframe styles work in production (Vercel, etc.) where
- * source files aren't available at runtime.
- *
- * @example
- * ```js
- * // next.config.js
- * import { withPuckCSS } from '@delmaredigital/payload-puck/next'
- * import { withPayload } from '@payloadcms/next/withPayload'
- *
- * export default withPuckCSS({
- *   cssInput: 'src/app/(frontend)/globals.css',
- * })(withPayload(nextConfig))
- * ```
- */ import { existsSync, mkdirSync, readFileSync, writeFileSync } from 'fs';
-import { dirname, resolve } from 'path';
-/**
- * Default output filename for compiled CSS
- */ export const PUCK_CSS_OUTPUT_DEFAULT = 'puck-editor-styles.css';
-/**
- * Compile CSS using PostCSS with the project's configuration
- */ async function compileCss(css, filePath) {
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    let postcss;
-    try {
-        postcss = (await import('postcss')).default;
-    } catch  {
-        console.warn('[payload-puck] PostCSS not found. CSS will not be compiled.');
-        return css;
-    }
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    let processor;
-    try {
-        // Try to load project's postcss.config.js
-        const loadConfigModule = await import('postcss-load-config');
-        const postcssLoadConfig = loadConfigModule.default;
-        const { plugins } = await postcssLoadConfig({}, process.cwd());
-        processor = postcss(plugins);
-    } catch  {
-        // Fall back to direct Tailwind import
-        try {
-            const tailwindcss = (await import('@tailwindcss/postcss')).default;
-            processor = postcss([
-                tailwindcss
-            ]);
-        } catch  {
-            try {
-                const tailwindcss = (await import('tailwindcss')).default;
-                processor = postcss([
-                    tailwindcss
-                ]);
-            } catch  {
-                console.warn('[payload-puck] No Tailwind CSS found. CSS will not be compiled.');
-                return css;
-            }
-        }
-    }
-    const result = await processor.process(css, {
-        from: filePath
-    });
-    return result.css;
-}
-/**
- * Webpack plugin that compiles CSS at build time
- */ class PuckCSSWebpackPlugin {
-    options;
-    compiled = false;
-    constructor(options){
-        this.options = options;
-    }
-    apply(compiler) {
-        compiler.hooks.beforeCompile.tapPromise('PuckCSSWebpackPlugin', async ()=>{
-            // Only compile once per build
-            if (this.compiled) return;
-            this.compiled = true;
-            const { cssInput, cssOutput, skipInDev } = this.options;
-            // Skip in development if configured
-            if (skipInDev && process.env.NODE_ENV === 'development') {
-                console.log('[payload-puck] Skipping CSS compilation in development');
-                return;
-            }
-            const inputPath = resolve(process.cwd(), cssInput);
-            const outputPath = resolve(process.cwd(), 'public', cssOutput);
-            // Check if source file exists
-            if (!existsSync(inputPath)) {
-                console.error(`[payload-puck] CSS source file not found: ${inputPath}`);
-                return;
-            }
-            try {
-                console.log(`[payload-puck] Compiling CSS: ${cssInput} -> public/${cssOutput}`);
-                // Read source CSS
-                const rawCss = readFileSync(inputPath, 'utf-8');
-                // Compile with PostCSS/Tailwind
-                const compiledCss = await compileCss(rawCss, inputPath);
-                // Ensure public directory exists
-                const outputDir = dirname(outputPath);
-                if (!existsSync(outputDir)) {
-                    mkdirSync(outputDir, {
-                        recursive: true
-                    });
-                }
-                // Write compiled CSS
-                writeFileSync(outputPath, compiledCss, 'utf-8');
-                console.log(`[payload-puck] CSS compiled successfully (${(compiledCss.length / 1024).toFixed(1)}KB)`);
-            } catch (error) {
-                console.error('[payload-puck] CSS compilation failed:', error);
-            }
-        });
-    }
-}
-/**
- * Next.js configuration wrapper that compiles Puck editor CSS at build time
- *
- * @param options - Configuration options
- * @returns A function that wraps your Next.js config
- *
- * @example
- * ```js
- * import { withPuckCSS } from '@delmaredigital/payload-puck/next'
- *
- * export default withPuckCSS({
- *   cssInput: 'src/app/(frontend)/globals.css',
- * })(nextConfig)
- * ```
- */ export function withPuckCSS(options) {
-    const resolvedOptions = {
-        cssInput: options.cssInput,
-        cssOutput: options.cssOutput ?? PUCK_CSS_OUTPUT_DEFAULT,
-        skipInDev: options.skipInDev ?? true
-    };
-    return (nextConfig)=>{
-        return {
-            ...nextConfig,
-            webpack: (webpackConfig, context)=>{
-                // Add our CSS compilation plugin
-                webpackConfig.plugins = webpackConfig.plugins || [];
-                webpackConfig.plugins.push(new PuckCSSWebpackPlugin(resolvedOptions));
-                // Call existing webpack config if present
-                if (typeof nextConfig.webpack === 'function') {
-                    return nextConfig.webpack(webpackConfig, context);
-                }
-                return webpackConfig;
-            }
-        };
-    };
-}
-/**
- * Get the URL path for the compiled CSS file
- * Use this in your plugin configuration
- */ export function getPuckCSSPath(cssOutput) {
-    return `/${cssOutput ?? PUCK_CSS_OUTPUT_DEFAULT}`;
-}