@delmaredigital/payload-puck 0.1.0 → 0.1.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (48) hide show
  1. package/README.md +32 -4
  2. package/dist/AccordionClient.d.mts +1 -1
  3. package/dist/AccordionClient.d.ts +1 -1
  4. package/dist/AccordionClient.js +2 -2
  5. package/dist/AccordionClient.js.map +1 -1
  6. package/dist/AccordionClient.mjs +2 -2
  7. package/dist/AccordionClient.mjs.map +1 -1
  8. package/dist/AnimatedWrapper.d.mts +1 -1
  9. package/dist/AnimatedWrapper.d.ts +1 -1
  10. package/dist/AnimatedWrapper.js.map +1 -1
  11. package/dist/AnimatedWrapper.mjs.map +1 -1
  12. package/dist/components/index.d.mts +1 -1
  13. package/dist/components/index.d.ts +1 -1
  14. package/dist/components/index.js +196 -217
  15. package/dist/components/index.js.map +1 -1
  16. package/dist/components/index.mjs +200 -221
  17. package/dist/components/index.mjs.map +1 -1
  18. package/dist/config/config.editor.d.mts +1 -1
  19. package/dist/config/config.editor.d.ts +1 -1
  20. package/dist/config/config.editor.js +199 -220
  21. package/dist/config/config.editor.js.map +1 -1
  22. package/dist/config/config.editor.mjs +203 -224
  23. package/dist/config/config.editor.mjs.map +1 -1
  24. package/dist/config/index.js +33 -16
  25. package/dist/config/index.js.map +1 -1
  26. package/dist/config/index.mjs +33 -16
  27. package/dist/config/index.mjs.map +1 -1
  28. package/dist/editor/index.js +56 -39
  29. package/dist/editor/index.js.map +1 -1
  30. package/dist/editor/index.mjs +56 -39
  31. package/dist/editor/index.mjs.map +1 -1
  32. package/dist/fields/index.d.mts +4 -4
  33. package/dist/fields/index.d.ts +4 -4
  34. package/dist/fields/index.js +201 -222
  35. package/dist/fields/index.js.map +1 -1
  36. package/dist/fields/index.mjs +205 -226
  37. package/dist/fields/index.mjs.map +1 -1
  38. package/dist/layouts/index.js.map +1 -1
  39. package/dist/layouts/index.mjs.map +1 -1
  40. package/dist/render/index.js +33 -16
  41. package/dist/render/index.js.map +1 -1
  42. package/dist/render/index.mjs +33 -16
  43. package/dist/render/index.mjs.map +1 -1
  44. package/dist/{shared-DMAF1AcH.d.mts → shared-DeNKN95N.d.mts} +7 -6
  45. package/dist/{shared-DMAF1AcH.d.ts → shared-DeNKN95N.d.ts} +7 -6
  46. package/examples/README.md +9 -2
  47. package/examples/app/(manage)/layout.tsx +31 -0
  48. package/package.json +12 -10
package/README.md CHANGED
@@ -19,6 +19,7 @@ A PayloadCMS plugin for integrating [Puck](https://puckeditor.com) visual page b
19
19
  - [API Routes](#api-routes)
20
20
  - [Plugin Options](#plugin-options)
21
21
  - [Hybrid Integration](#hybrid-integration)
22
+ - [License](#license)
22
23
 
23
24
  ---
24
25
 
@@ -30,7 +31,7 @@ A PayloadCMS plugin for integrating [Puck](https://puckeditor.com) visual page b
30
31
  |------------|---------|---------|
31
32
  | `@measured/puck` | >= 0.20.0 | Visual editor core |
32
33
  | `payload` | >= 3.0.0 | CMS backend |
33
- | `next` | >= 15.4.0 | React framework |
34
+ | `next` | >= 15.4.8 | React framework |
34
35
  | `react` | >= 18.0.0 | UI library |
35
36
  | `@tailwindcss/typography` | >= 0.5.0 | RichText component styling |
36
37
 
@@ -63,8 +64,9 @@ The package includes ready-to-use example files:
63
64
  # Copy API routes
64
65
  cp -r node_modules/@delmaredigital/payload-puck/examples/api/puck src/app/api/
65
66
 
66
- # Copy editor page
67
+ # Copy editor layout (REQUIRED - imports Tailwind CSS) and page
67
68
  mkdir -p src/app/\(manage\)/pages/\[id\]/edit
69
+ cp node_modules/@delmaredigital/payload-puck/examples/app/\(manage\)/layout.tsx src/app/\(manage\)/
68
70
  cp node_modules/@delmaredigital/payload-puck/examples/app/pages/\[id\]/edit/page.tsx src/app/\(manage\)/pages/\[id\]/edit/
69
71
 
70
72
  # Copy frontend routes (homepage + dynamic pages)
@@ -78,6 +80,8 @@ mkdir -p src/lib
78
80
  cp node_modules/@delmaredigital/payload-puck/examples/lib/puck-theme.ts src/lib/
79
81
  ```
80
82
 
83
+ > **Important:** Update the CSS import path in `src/app/(manage)/layout.tsx` to match your project's globals.css location.
84
+
81
85
  See `examples/README.md` for detailed customization instructions.
82
86
 
83
87
  </details>
@@ -141,10 +145,33 @@ export const { GET, PATCH, DELETE } = createPuckApiRoutesWithId({
141
145
  })
142
146
  ```
143
147
 
144
- #### Step 3: Create the Editor Page
148
+ #### Step 3: Create the Editor Layout & Page
149
+
150
+ First, create a layout that imports your Tailwind CSS:
151
+
152
+ ```typescript
153
+ // app/(manage)/layout.tsx
154
+ import '@/app/(frontend)/globals.css' // Adjust path to your CSS
155
+
156
+ export const metadata = {
157
+ title: 'Puck Editor',
158
+ description: 'Visual page editor',
159
+ }
160
+
161
+ export default function ManageLayout({ children }: { children: React.ReactNode }) {
162
+ return (
163
+ // data-theme may be required if your CSS hides content until theme is set
164
+ <html lang="en" data-theme="light">
165
+ <body>{children}</body>
166
+ </html>
167
+ )
168
+ }
169
+ ```
170
+
171
+ Then create the editor page:
145
172
 
146
173
  ```typescript
147
- // app/pages/[id]/edit/page.tsx
174
+ // app/(manage)/pages/[id]/edit/page.tsx
148
175
  'use client'
149
176
 
150
177
  import { PuckEditorView } from '@delmaredigital/payload-puck/editor'
@@ -399,6 +426,7 @@ Use this checklist to verify your setup is complete.
399
426
  - [ ] Install packages: `@delmaredigital/payload-puck` and `@measured/puck`
400
427
  - [ ] Add `createPuckPlugin()` to your Payload config
401
428
  - [ ] Create API routes (`/api/puck/pages` and `/api/puck/pages/[id]`)
429
+ - [ ] Create editor route layout that imports Tailwind CSS (see examples)
402
430
  - [ ] Create the editor page component with `PuckEditorView`
403
431
  - [ ] Create a frontend route with `PageRenderer`
404
432
 
package/dist/AccordionClient.d.mts CHANGED
@@ -1,5 +1,5 @@
1
1
  import * as react_jsx_runtime from 'react/jsx-runtime';
2
- import { C as ColorValue, P as PaddingValue, B as BackgroundValue, D as DimensionsValue, T as TransformValue, A as AnimationValue } from './shared-DMAF1AcH.mjs';
2
+ import { C as ColorValue, P as PaddingValue, B as BackgroundValue, D as DimensionsValue, T as TransformValue, A as AnimationValue } from './shared-DeNKN95N.mjs';
3
3
  import 'react';
4
4
  import '@measured/puck';
5
5
 
package/dist/AccordionClient.d.ts CHANGED
@@ -1,5 +1,5 @@
1
1
  import * as react_jsx_runtime from 'react/jsx-runtime';
2
- import { C as ColorValue, P as PaddingValue, B as BackgroundValue, D as DimensionsValue, T as TransformValue, A as AnimationValue } from './shared-DMAF1AcH.js';
2
+ import { C as ColorValue, P as PaddingValue, B as BackgroundValue, D as DimensionsValue, T as TransformValue, A as AnimationValue } from './shared-DeNKN95N.js';
3
3
  import 'react';
4
4
  import '@measured/puck';
5
5
 
package/dist/AccordionClient.js CHANGED
@@ -2,7 +2,7 @@
2
2
  'use strict';
3
3
 
4
4
  var react = require('react');
5
- var iconsReact = require('@tabler/icons-react');
5
+ var lucideReact = require('lucide-react');
6
6
  var jsxRuntime = require('react/jsx-runtime');
7
7
 
8
8
  // src/fields/shared.ts
@@ -682,7 +682,7 @@ function AccordionItem({
682
682
  children: [
683
683
  /* @__PURE__ */ jsxRuntime.jsx("span", { children: item.title }),
684
684
  /* @__PURE__ */ jsxRuntime.jsx(
685
- iconsReact.IconChevronDown,
685
+ lucideReact.ChevronDown,
686
686
  {
687
687
  className: cn(
688
688
  "h-4 w-4 shrink-0 transition-transform duration-200",