@puckeditor/cli 0.24.0-canary.301a0304

package/dist/docs/getting-started.md

@@ -0,0 +1,68 @@
+# Getting Started
+
+## Installation
+
+Install the package
+
+```sh
+npm i @puckeditor/core --save
+```
+
+Or set up Puck and Puck Cloud in a new or existing Next.js, React Router, TanStack Start, vinext, Vite or Astro app, or a Hono or Express server using the [CLI](/docs/cli)
+
+```sh
+npx @puckeditor/cli init
+```
+
+Or generate a Puck application using a [recipe](https://github.com/puckeditor/puck#recipes)
+
+```sh
+npx create-puck-app my-app
+```
+
+## Render the editor
+
+File: `Editor.jsx`
+
+```jsx
+import { Puck } from "@puckeditor/core";
+
+// Create Puck component config
+const config = {
+  components: {
+    HeadingBlock: {
+      fields: {
+        children: {
+          type: "text",
+        },
+      },
+      render: ({ children }) => {
+        return <h1>{children}</h1>;
+      },
+    },
+  },
+};
+
+// Describe the initial data
+const initialData = {};
+
+// Save the data to your database
+const save = (data) => {};
+
+// Render Puck editor
+export function Editor() {
+  return <Puck config={config} data={initialData} onPublish={save} />;
+}
+```
+
+## Render the page
+
+File: `Page.jsx`
+
+```jsx
+import { Render } from "@puckeditor/core";
+
+export function Page() {
+  return <Render config={config} data={data} />;
+}
+```

package/dist/docs/guides/migrations/dropzones-to-slots.md

@@ -0,0 +1,138 @@
+# How to migrate from DropZones to Slots
+
+This guide will help you migrate from [`DropZones`](/docs/api-reference/components/drop-zone) to [Slots](/docs/api-reference/fields/slot).
+
+---
+
+[Slot fields](/docs/api-reference/fields/slot) replace the [`<DropZone>` component](/docs/api-reference/components/drop-zone), introducing an inline data model that supports [`defaultProps`](/docs/api-reference/configuration/component-config#defaultprops), [`resolveData`](/docs/api-reference/configuration/component-config#resolvedatadata-params) and [Server Components](/docs/integrating-puck/server-components) out-of-the-box.
+
+## Replace DropZone instances
+
+Replace your `<DropZone>` instances with [slot fields](/docs/api-reference/fields/slot) and the slot [render function](/docs/api-reference/fields/slot#render-function).
+
+**Before**
+
+```tsx
+const config = {
+  components: {
+    Example: {
+      render: () => {
+        return <DropZone zone="items" allow={["HeadingBlock"]} />;
+      },
+    },
+  },
+};
+```
+
+**After**
+
+```tsx
+const config = {
+  components: {
+    Example: {
+      fields: {
+        items: {
+          type: "slot",
+        },
+      },
+      defaultProps: {
+        items: [], // Slots support defaultProps and other APIs like resolveData
+      },
+      render: ({ items: Items }) => {
+        return <Items allow={["HeadingBlock"]} />; // Slots support most DropZone APIs
+      },
+    },
+  },
+};
+```
+
+## The data model
+
+The slot data model is inline and recursive. This means that instead of storing data in a global `zones` object, data is stored as arrays of [ComponentData](/docs/api-reference/data-model/component-data) as a prop.
+
+**Before**
+
+```json
+{
+  "content": [
+    {
+      "type": "Grid",
+      "props": {
+        "id": "Grid-12345"
+      }
+    }
+  ],
+  "zones": {
+    "Grid-12345:items": [
+      {
+        "type": "HeadingBlock",
+        "props": {
+          "id": "Heading-12345",
+          "title": "Hello, world"
+        }
+      }
+    ]
+  }
+}
+```
+
+**After**
+
+```json
+{
+  "content": [
+    {
+      "type": "Grid",
+      "props": {
+        "id": "Grid-12345",
+        "items": [
+          {
+            "type": "HeadingBlock",
+            "props": {
+              "id": "Heading-12345",
+              "title": "Hello, world"
+            }
+          }
+        ]
+      }
+    }
+  ]
+}
+```
+
+### Migrating legacy data
+
+For new slots, you don't need to do anything. If you're migrating existing DropZones to slots, you will need to migrate your the data accordingly. Puck provides the [`migrate()` helper](/docs/api-reference/functions/migrate) to help with this:
+
+```tsx
+import { migrate } from "@puckeditor/core";
+import config from "puck.config.tsx";
+
+const newData = migrate(legacyData, config);
+```
+
+This will migrate any existing zone in `zones` where you have defined a `slot` with the same name.
+
+### Migrating dynamic zones to slots
+
+To migrate DropZone data with dynamic zone names (e.g., those generated when rendering DropZones in a loop), use the [`migrateDynamicZonesForComponent`](/docs/api-reference/functions/migrate#migratedynamiczonesforcomponent) option in the [`migrate()` helper](/docs/api-reference/functions/migrate).
+
+```tsx
+const newData = migrate(legacyData, config, {
+  migrateDynamicZonesForComponent: {
+    Columns: (props, zones) => {
+      return {
+        ...props,
+        columns: Object.values(zones).map((zone) => ({
+          column: zone,
+        })),
+      };
+    },
+  },
+});
+```
+
+## Further reading
+
+- [The `slot` field API](/docs/api-reference/fields/slot)
+- [The `DropZone` component](/docs/api-reference/components/drop-zone)

package/dist/docs/index.json

@@ -0,0 +1,466 @@
+[
+  {
+    "path": "index",
+    "title": "Introduction"
+  },
+  {
+    "path": "getting-started",
+    "title": "Getting Started"
+  },
+  {
+    "path": "cli",
+    "title": "CLI"
+  },
+  {
+    "path": "integrating-puck/component-configuration",
+    "title": "Component Configuration"
+  },
+  {
+    "path": "integrating-puck/root-configuration",
+    "title": "Root Configuration"
+  },
+  {
+    "path": "integrating-puck/multi-column-layouts",
+    "title": "Multi-column Layouts"
+  },
+  {
+    "path": "integrating-puck/categories",
+    "title": "Categories"
+  },
+  {
+    "path": "integrating-puck/rich-text-editing",
+    "title": "Rich Text Editing"
+  },
+  {
+    "path": "integrating-puck/dynamic-props",
+    "title": "Dynamic Props"
+  },
+  {
+    "path": "integrating-puck/dynamic-fields",
+    "title": "Dynamic Fields"
+  },
+  {
+    "path": "integrating-puck/external-data-sources",
+    "title": "External Data Sources"
+  },
+  {
+    "path": "integrating-puck/server-components",
+    "title": "React Server Components"
+  },
+  {
+    "path": "integrating-puck/data-migration",
+    "title": "Data Migration"
+  },
+  {
+    "path": "integrating-puck/styling",
+    "title": "Styling"
+  },
+  {
+    "path": "integrating-puck/viewports",
+    "title": "Viewports"
+  },
+  {
+    "path": "integrating-puck/localization",
+    "title": "Localization"
+  },
+  {
+    "path": "integrating-puck/feature-toggling",
+    "title": "Feature Toggling"
+  },
+  {
+    "path": "integrating-puck/overlay-portals",
+    "title": "Overlay Portals"
+  },
+  {
+    "path": "extending-puck/composition",
+    "title": "Composition"
+  },
+  {
+    "path": "extending-puck/custom-fields",
+    "title": "Custom Fields"
+  },
+  {
+    "path": "extending-puck/field-transforms",
+    "title": "Field Transforms"
+  },
+  {
+    "path": "extending-puck/internal-puck-api",
+    "title": "Internal Puck API"
+  },
+  {
+    "path": "extending-puck/theming",
+    "title": "Theming"
+  },
+  {
+    "path": "extending-puck/plugins",
+    "title": "Plugin API"
+  },
+  {
+    "path": "extending-puck/ui-overrides",
+    "title": "UI overrides"
+  },
+  {
+    "path": "api-reference/components",
+    "title": "Components"
+  },
+  {
+    "path": "api-reference/components/action-bar",
+    "title": "<ActionBar>"
+  },
+  {
+    "path": "api-reference/components/action-bar-action",
+    "title": "<ActionBar.Action>"
+  },
+  {
+    "path": "api-reference/components/action-bar-group",
+    "title": "<ActionBar.Group>"
+  },
+  {
+    "path": "api-reference/components/action-bar-label",
+    "title": "<ActionBar.Label>"
+  },
+  {
+    "path": "api-reference/components/action-bar-separator",
+    "title": "<ActionBar.Separator>"
+  },
+  {
+    "path": "api-reference/components/auto-field",
+    "title": "<AutoField>"
+  },
+  {
+    "path": "api-reference/components/drawer",
+    "title": "<Drawer>"
+  },
+  {
+    "path": "api-reference/components/drawer-item",
+    "title": "<Drawer.Item>"
+  },
+  {
+    "path": "api-reference/components/drop-zone",
+    "title": "<DropZone>"
+  },
+  {
+    "path": "api-reference/components/field-label",
+    "title": "<FieldLabel>"
+  },
+  {
+    "path": "api-reference/components/inline-text-field",
+    "title": "<InlineTextField>"
+  },
+  {
+    "path": "api-reference/components/puck",
+    "title": "<Puck>"
+  },
+  {
+    "path": "api-reference/components/puck-components",
+    "title": "<Puck.Components>"
+  },
+  {
+    "path": "api-reference/components/puck-fields",
+    "title": "<Puck.Fields>"
+  },
+  {
+    "path": "api-reference/components/puck-layout",
+    "title": "<Puck.Layout>"
+  },
+  {
+    "path": "api-reference/components/puck-outline",
+    "title": "<Puck.Outline>"
+  },
+  {
+    "path": "api-reference/components/puck-preview",
+    "title": "<Puck.Preview>"
+  },
+  {
+    "path": "api-reference/components/render",
+    "title": "<Render>"
+  },
+  {
+    "path": "api-reference/components/rich-text-menu",
+    "title": "<RichTextMenu>"
+  },
+  {
+    "path": "api-reference/components/rich-text-menu-group",
+    "title": "<RichTextMenu.Group>"
+  },
+  {
+    "path": "api-reference/components/rich-text-menu-control",
+    "title": "<RichTextMenu.Control>"
+  },
+  {
+    "path": "api-reference/configuration",
+    "title": "Configuration"
+  },
+  {
+    "path": "api-reference/configuration/config",
+    "title": "Config"
+  },
+  {
+    "path": "api-reference/configuration/component-config",
+    "title": "ComponentConfig"
+  },
+  {
+    "path": "api-reference/data-model",
+    "title": "Data Model"
+  },
+  {
+    "path": "api-reference/data-model/app-state",
+    "title": "AppState"
+  },
+  {
+    "path": "api-reference/data-model/component-data",
+    "title": "ComponentData"
+  },
+  {
+    "path": "api-reference/data-model/data",
+    "title": "Data"
+  },
+  {
+    "path": "api-reference/data-model/item-selector",
+    "title": "ItemSelector"
+  },
+  {
+    "path": "api-reference/data-model/root-data",
+    "title": "RootData"
+  },
+  {
+    "path": "api-reference/fields",
+    "title": "Fields"
+  },
+  {
+    "path": "api-reference/fields/base",
+    "title": "Base"
+  },
+  {
+    "path": "api-reference/fields/array",
+    "title": "Array"
+  },
+  {
+    "path": "api-reference/fields/custom",
+    "title": "Custom"
+  },
+  {
+    "path": "api-reference/fields/external",
+    "title": "External"
+  },
+  {
+    "path": "api-reference/fields/number",
+    "title": "Number"
+  },
+  {
+    "path": "api-reference/fields/object",
+    "title": "Object"
+  },
+  {
+    "path": "api-reference/fields/radio",
+    "title": "Radio"
+  },
+  {
+    "path": "api-reference/fields/richtext",
+    "title": "Richtext"
+  },
+  {
+    "path": "api-reference/fields/select",
+    "title": "Select"
+  },
+  {
+    "path": "api-reference/fields/slot",
+    "title": "Slot"
+  },
+  {
+    "path": "api-reference/fields/text",
+    "title": "Text"
+  },
+  {
+    "path": "api-reference/fields/textarea",
+    "title": "Textarea"
+  },
+  {
+    "path": "api-reference/functions",
+    "title": "Functions"
+  },
+  {
+    "path": "api-reference/functions/migrate",
+    "title": "migrate"
+  },
+  {
+    "path": "api-reference/functions/register-overlay-portal",
+    "title": "registerOverlayPortal"
+  },
+  {
+    "path": "api-reference/functions/resolve-all-data",
+    "title": "resolveAllData"
+  },
+  {
+    "path": "api-reference/functions/set-deep",
+    "title": "setDeep"
+  },
+  {
+    "path": "api-reference/functions/transform-props",
+    "title": "transformProps"
+  },
+  {
+    "path": "api-reference/functions/use-get-puck",
+    "title": "useGetPuck"
+  },
+  {
+    "path": "api-reference/functions/use-puck",
+    "title": "usePuck"
+  },
+  {
+    "path": "api-reference/functions/walk-tree",
+    "title": "walkTree"
+  },
+  {
+    "path": "api-reference/overrides",
+    "title": "Overrides"
+  },
+  {
+    "path": "api-reference/overrides/action-bar",
+    "title": "actionBar"
+  },
+  {
+    "path": "api-reference/overrides/component-overlay",
+    "title": "componentOverlay"
+  },
+  {
+    "path": "api-reference/overrides/drawer",
+    "title": "drawer"
+  },
+  {
+    "path": "api-reference/overrides/drawer-item",
+    "title": "drawerItem"
+  },
+  {
+    "path": "api-reference/overrides/field-label",
+    "title": "fieldLabel"
+  },
+  {
+    "path": "api-reference/overrides/field-types",
+    "title": "fieldTypes"
+  },
+  {
+    "path": "api-reference/overrides/fields",
+    "title": "fields"
+  },
+  {
+    "path": "api-reference/overrides/header",
+    "title": "header"
+  },
+  {
+    "path": "api-reference/overrides/header-actions",
+    "title": "headerActions"
+  },
+  {
+    "path": "api-reference/overrides/iframe",
+    "title": "iframe"
+  },
+  {
+    "path": "api-reference/overrides/outline",
+    "title": "outline"
+  },
+  {
+    "path": "api-reference/overrides/preview",
+    "title": "preview"
+  },
+  {
+    "path": "api-reference/overrides/puck",
+    "title": "puck"
+  },
+  {
+    "path": "api-reference/plugins/blocks-plugin",
+    "title": "blocksPlugin"
+  },
+  {
+    "path": "api-reference/plugins/fields-plugin",
+    "title": "fieldsPlugin"
+  },
+  {
+    "path": "api-reference/plugins/legacy-side-bar-plugin",
+    "title": "legacySideBarPlugin"
+  },
+  {
+    "path": "api-reference/plugins/outline-plugin",
+    "title": "outlinePlugin"
+  },
+  {
+    "path": "api-reference/theming/global",
+    "title": "Global theming"
+  },
+  {
+    "path": "api-reference/theming/action-bar",
+    "title": "Action bar"
+  },
+  {
+    "path": "api-reference/theming/button",
+    "title": "Button"
+  },
+  {
+    "path": "api-reference/theming/canvas",
+    "title": "Canvas"
+  },
+  {
+    "path": "api-reference/theming/drawer",
+    "title": "Drawer"
+  },
+  {
+    "path": "api-reference/theming/fields",
+    "title": "Fields"
+  },
+  {
+    "path": "api-reference/theming/header",
+    "title": "Header"
+  },
+  {
+    "path": "api-reference/theming/icon-button",
+    "title": "Icon button"
+  },
+  {
+    "path": "api-reference/theming/outline",
+    "title": "Outline"
+  },
+  {
+    "path": "api-reference/theming/plugin-bar",
+    "title": "Plugin bar"
+  },
+  {
+    "path": "api-reference/theming/sidebar",
+    "title": "Sidebar"
+  },
+  {
+    "path": "api-reference/theming/slot",
+    "title": "Slot"
+  },
+  {
+    "path": "api-reference/theming/computed-values",
+    "title": "Computed values"
+  },
+  {
+    "path": "api-reference/actions",
+    "title": "Actions"
+  },
+  {
+    "path": "api-reference/dictionary",
+    "title": "Dictionary"
+  },
+  {
+    "path": "api-reference/field-transforms",
+    "title": "FieldTransforms"
+  },
+  {
+    "path": "api-reference/permissions",
+    "title": "Permissions"
+  },
+  {
+    "path": "api-reference/plugin",
+    "title": "Plugin"
+  },
+  {
+    "path": "api-reference/puck-api",
+    "title": "PuckApi"
+  },
+  {
+    "path": "guides/migrations/dropzones-to-slots",
+    "title": "Migrating - DropZones to Slots"
+  }
+]

package/dist/docs/index.md

@@ -0,0 +1,37 @@
+# Introduction
+
+Welcome to the Puck documentation!
+
+## What is Puck?
+
+Puck is a modular, open-source visual editor for React.js. You can use Puck to build custom drag-and-drop experiences with your own application and React components.
+
+Because Puck is just a React component, it plays well with all React.js environments, including Next.js. You own your data and there's no vendor lock-in.
+
+Puck is also licensed under MIT, making it suitable for both internal systems and commercial applications.
+
+## Main Features
+
+| Feature                                                                   | Description                                                                                                          |
+| ------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------- |
+| [Component Configuration](/docs/integrating-puck/component-configuration) | Integrate your own components with Puck by providing render functions and configuring fields that map to your props. |
+| [Root Configuration](/docs/integrating-puck/root-configuration)           | Customize the root component that wraps all other Puck components.                                                   |
+| [Multi-column Layouts](/docs/integrating-puck/multi-column-layouts)       | Create multi-column layouts using nested components. Now supports advanced CSS layouts.                              |
+| [Categories](/docs/integrating-puck/categories)                           | Group your components in the side bar.                                                                               |
+| [Dynamic Props](/docs/integrating-puck/dynamic-props)                     | Dynamically set props after user input and mark fields as read-only                                                  |
+| [Dynamic Fields](/docs/integrating-puck/dynamic-fields)                   | Dynamically set fields based on user input                                                                           |
+| [External Data Sources](/docs/integrating-puck/external-data-sources)     | Load content from a third-party CMS or other data source                                                             |
+| [Server Components](/docs/integrating-puck/server-components)             | Opt-in support for React Server Components                                                                           |
+| [Data Migration](/docs/integrating-puck/data-migration)                   | Migrate between breaking Puck releases and your own breaking prop changes                                            |
+| [Viewports](/docs/integrating-puck/viewports)                             | Preview and edit your content in a same-origin iframe to simulate different viewports                                |
+| [Feature Toggling](/docs/integrating-puck/feature-toggling)               | Toggle Puck features, like duplication or deletion, via the permissions API.                                         |
+
+## Get Support
+
+If you have any questions about Puck, please open a [GitHub issue](https://github.com/puckeditor/puck/issues) or join us on [Discord](https://discord.gg/D9e4E3MQVZ).
+
+Or [book a discovery call](https://app.cal.com/chrisvxd/puck-enquiry/) for hands-on support and consultancy.
+
+## License
+
+Puck is licensed under MIT.