@measured/puck 0.18.2-canary.b9ce5b7 → 0.18.2-canary.bdef789

package/dist/index.d.mts

@@ -1,8 +1,9 @@
-import { F as FieldProps, a as Field, D as DropZoneProps, C as Config, U as UserGenerics, b as Data, c as UiState, O as OnAction, P as Permissions, d as Plugin, e as Overrides, f as PuckAction, V as Viewports, I as IframeConfig, g as InitialHistory, h as DefaultComponentProps, i as DefaultRootFieldProps, H as History, A as AppState, E as ExtractPropsFromConfig, j as ExtractRootPropsFromConfig, k as ComponentDataMap } from './resolve-all-data-C-cc7ftj.mjs';
-export { Q as Adaptor, K as ArrayField, s as ArrayState, a3 as AsFieldProps, B as BaseData, z as BaseField, u as ComponentConfig, x as ComponentData, y as Content, Y as CustomField, a0 as DefaultRootProps, $ as DefaultRootRenderProps, l as Direction, m as DragAxis, X as ExternalField, W as ExternalFieldWithAdaptor, q as FieldRenderFunctions, Z as Fields, r as ItemWithId, M as MappedItem, N as NumberField, L as ObjectField, p as OverrideKey, t as PuckComponent, _ as PuckContext, J as RadioField, w as RootData, R as RootDataWithProps, v as RootDataWithoutProps, S as SelectField, T as TextField, G as TextareaField, n as Viewport, a4 as WithChildren, a1 as WithId, a2 as WithPuckProps, o as overrideKeys, a5 as resolveAllData } from './resolve-all-data-C-cc7ftj.mjs';
+import { F as FieldProps, a as Field, C as Config, D as Data, I as ItemSelector, b as DropZoneProps, U as UserGenerics, c as UiState, O as OnAction, P as Permissions, d as Plugin, e as Overrides, f as PuckAction, V as Viewports, g as IframeConfig, h as InitialHistory, i as DefaultComponentProps, j as DefaultRootFieldProps, H as History, A as AppState, E as ExtractPropsFromConfig, k as ExtractRootPropsFromConfig, l as ComponentDataMap } from './resolve-all-data-DzJEE28m.mjs';
+export { W as Adaptor, L as ArrayField, t as ArrayState, a4 as AsFieldProps, B as BaseData, G as BaseField, v as ComponentConfig, y as ComponentData, z as Content, Z as CustomField, a1 as DefaultRootProps, a0 as DefaultRootRenderProps, m as Direction, n as DragAxis, Y as ExternalField, X as ExternalFieldWithAdaptor, r as FieldRenderFunctions, _ as Fields, s as ItemWithId, M as MappedItem, N as NumberField, Q as ObjectField, q as OverrideKey, u as PuckComponent, $ as PuckContext, K as RadioField, x as RootData, R as RootDataWithProps, w as RootDataWithoutProps, S as SelectField, T as TextField, J as TextareaField, o as Viewport, a5 as WithChildren, a2 as WithId, a3 as WithPuckProps, p as overrideKeys, a6 as resolveAllData } from './resolve-all-data-DzJEE28m.mjs';
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as react from 'react';
 import { ReactNode, SyntheticEvent, ReactElement } from 'react';
+import { UniqueIdentifier } from '@dnd-kit/abstract';
 
 declare const ActionBar: {
     ({ label, children, }: {
@@ -78,6 +79,47 @@ declare const Drawer: {
     }) => react_jsx_runtime.JSX.Element;
 };
 
+type PathData = Record<string, {
+    path: string[];
+    label: string;
+}>;
+type DropZoneContext<UserConfig extends Config = Config> = {
+    data: Data;
+    config: UserConfig;
+    componentState?: Record<string, any>;
+    itemSelector?: ItemSelector | null;
+    setItemSelector?: (newIndex: ItemSelector | null) => void;
+    areaId?: string;
+    zoneCompound?: string;
+    index?: number;
+    hoveringComponent?: string | null;
+    setHoveringComponent?: (id: string | null) => void;
+    registerZoneArea?: (areaId: string) => void;
+    areasWithZones?: Record<string, boolean>;
+    registerZone?: (zoneCompound: string) => void;
+    unregisterZone?: (zoneCompound: string) => void;
+    activeZones?: Record<string, boolean>;
+    pathData?: PathData;
+    registerPath?: (id: string, selector: ItemSelector, label: string) => void;
+    unregisterPath?: (id: string) => void;
+    mode?: "edit" | "render";
+    depth: number;
+    registerLocalZone?: (zone: string, active: boolean) => void;
+    unregisterLocalZone?: (zone: string) => void;
+    path: string[];
+} | null;
+declare const dropZoneContext: react.Context<DropZoneContext<Config>>;
+declare const DropZoneProvider: ({ children, value, }: {
+    children: ReactNode;
+    value: DropZoneContext;
+}) => react_jsx_runtime.JSX.Element;
+
+type DropZoneDndData = {
+    areaId?: string;
+    depth: number;
+    path: UniqueIdentifier[];
+    isDroppableTarget: boolean;
+};
 declare const DropZone: react.ForwardRefExoticComponent<DropZoneProps & react.RefAttributes<HTMLDivElement>>;
 
 declare const IconButton: ({ children, href, onClick, variant, type, disabled, tabIndex, newTab, fullWidth, title, }: {
@@ -194,4 +236,4 @@ declare const usePuck: <UserConfig extends Config = Config>() => {
     selectedItem: ComponentDataMap<ExtractPropsFromConfig<UserConfig>> | null;
 };
 
-export { Action, ActionBar, AppState, AutoField, Button, ComponentDataMap, Config, Data, DefaultComponentProps, DefaultRootFieldProps, Drawer, DropZone, ExtractPropsFromConfig, ExtractRootPropsFromConfig, Field, FieldLabel, FieldProps, Group, History, IconButton, IframeConfig, InitialHistory, Label, OnAction, Overrides, Permissions, Plugin, Puck, PuckAction, Render, UiState, UserGenerics, Viewports, migrate, transformProps, usePuck };
+export { Action, ActionBar, AppState, AutoField, Button, ComponentDataMap, Config, Data, DefaultComponentProps, DefaultRootFieldProps, Drawer, DropZone, type DropZoneDndData, DropZoneProvider, ExtractPropsFromConfig, ExtractRootPropsFromConfig, Field, FieldLabel, FieldProps, Group, History, IconButton, IframeConfig, InitialHistory, Label, OnAction, Overrides, Permissions, Plugin, Puck, PuckAction, Render, UiState, UserGenerics, Viewports, dropZoneContext, migrate, transformProps, usePuck };

package/dist/index.d.ts

@@ -1,8 +1,9 @@
-import { F as FieldProps, a as Field, D as DropZoneProps, C as Config, U as UserGenerics, b as Data, c as UiState, O as OnAction, P as Permissions, d as Plugin, e as Overrides, f as PuckAction, V as Viewports, I as IframeConfig, g as InitialHistory, h as DefaultComponentProps, i as DefaultRootFieldProps, H as History, A as AppState, E as ExtractPropsFromConfig, j as ExtractRootPropsFromConfig, k as ComponentDataMap } from './resolve-all-data-C-cc7ftj.js';
-export { Q as Adaptor, K as ArrayField, s as ArrayState, a3 as AsFieldProps, B as BaseData, z as BaseField, u as ComponentConfig, x as ComponentData, y as Content, Y as CustomField, a0 as DefaultRootProps, $ as DefaultRootRenderProps, l as Direction, m as DragAxis, X as ExternalField, W as ExternalFieldWithAdaptor, q as FieldRenderFunctions, Z as Fields, r as ItemWithId, M as MappedItem, N as NumberField, L as ObjectField, p as OverrideKey, t as PuckComponent, _ as PuckContext, J as RadioField, w as RootData, R as RootDataWithProps, v as RootDataWithoutProps, S as SelectField, T as TextField, G as TextareaField, n as Viewport, a4 as WithChildren, a1 as WithId, a2 as WithPuckProps, o as overrideKeys, a5 as resolveAllData } from './resolve-all-data-C-cc7ftj.js';
+import { F as FieldProps, a as Field, C as Config, D as Data, I as ItemSelector, b as DropZoneProps, U as UserGenerics, c as UiState, O as OnAction, P as Permissions, d as Plugin, e as Overrides, f as PuckAction, V as Viewports, g as IframeConfig, h as InitialHistory, i as DefaultComponentProps, j as DefaultRootFieldProps, H as History, A as AppState, E as ExtractPropsFromConfig, k as ExtractRootPropsFromConfig, l as ComponentDataMap } from './resolve-all-data-DzJEE28m.js';
+export { W as Adaptor, L as ArrayField, t as ArrayState, a4 as AsFieldProps, B as BaseData, G as BaseField, v as ComponentConfig, y as ComponentData, z as Content, Z as CustomField, a1 as DefaultRootProps, a0 as DefaultRootRenderProps, m as Direction, n as DragAxis, Y as ExternalField, X as ExternalFieldWithAdaptor, r as FieldRenderFunctions, _ as Fields, s as ItemWithId, M as MappedItem, N as NumberField, Q as ObjectField, q as OverrideKey, u as PuckComponent, $ as PuckContext, K as RadioField, x as RootData, R as RootDataWithProps, w as RootDataWithoutProps, S as SelectField, T as TextField, J as TextareaField, o as Viewport, a5 as WithChildren, a2 as WithId, a3 as WithPuckProps, p as overrideKeys, a6 as resolveAllData } from './resolve-all-data-DzJEE28m.js';
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as react from 'react';
 import { ReactNode, SyntheticEvent, ReactElement } from 'react';
+import { UniqueIdentifier } from '@dnd-kit/abstract';
 
 declare const ActionBar: {
     ({ label, children, }: {
@@ -78,6 +79,47 @@ declare const Drawer: {
     }) => react_jsx_runtime.JSX.Element;
 };
 
+type PathData = Record<string, {
+    path: string[];
+    label: string;
+}>;
+type DropZoneContext<UserConfig extends Config = Config> = {
+    data: Data;
+    config: UserConfig;
+    componentState?: Record<string, any>;
+    itemSelector?: ItemSelector | null;
+    setItemSelector?: (newIndex: ItemSelector | null) => void;
+    areaId?: string;
+    zoneCompound?: string;
+    index?: number;
+    hoveringComponent?: string | null;
+    setHoveringComponent?: (id: string | null) => void;
+    registerZoneArea?: (areaId: string) => void;
+    areasWithZones?: Record<string, boolean>;
+    registerZone?: (zoneCompound: string) => void;
+    unregisterZone?: (zoneCompound: string) => void;
+    activeZones?: Record<string, boolean>;
+    pathData?: PathData;
+    registerPath?: (id: string, selector: ItemSelector, label: string) => void;
+    unregisterPath?: (id: string) => void;
+    mode?: "edit" | "render";
+    depth: number;
+    registerLocalZone?: (zone: string, active: boolean) => void;
+    unregisterLocalZone?: (zone: string) => void;
+    path: string[];
+} | null;
+declare const dropZoneContext: react.Context<DropZoneContext<Config>>;
+declare const DropZoneProvider: ({ children, value, }: {
+    children: ReactNode;
+    value: DropZoneContext;
+}) => react_jsx_runtime.JSX.Element;
+
+type DropZoneDndData = {
+    areaId?: string;
+    depth: number;
+    path: UniqueIdentifier[];
+    isDroppableTarget: boolean;
+};
 declare const DropZone: react.ForwardRefExoticComponent<DropZoneProps & react.RefAttributes<HTMLDivElement>>;
 
 declare const IconButton: ({ children, href, onClick, variant, type, disabled, tabIndex, newTab, fullWidth, title, }: {
@@ -194,4 +236,4 @@ declare const usePuck: <UserConfig extends Config = Config>() => {
     selectedItem: ComponentDataMap<ExtractPropsFromConfig<UserConfig>> | null;
 };
 
-export { Action, ActionBar, AppState, AutoField, Button, ComponentDataMap, Config, Data, DefaultComponentProps, DefaultRootFieldProps, Drawer, DropZone, ExtractPropsFromConfig, ExtractRootPropsFromConfig, Field, FieldLabel, FieldProps, Group, History, IconButton, IframeConfig, InitialHistory, Label, OnAction, Overrides, Permissions, Plugin, Puck, PuckAction, Render, UiState, UserGenerics, Viewports, migrate, transformProps, usePuck };
+export { Action, ActionBar, AppState, AutoField, Button, ComponentDataMap, Config, Data, DefaultComponentProps, DefaultRootFieldProps, Drawer, DropZone, type DropZoneDndData, DropZoneProvider, ExtractPropsFromConfig, ExtractRootPropsFromConfig, Field, FieldLabel, FieldProps, Group, History, IconButton, IframeConfig, InitialHistory, Label, OnAction, Overrides, Permissions, Plugin, Puck, PuckAction, Render, UiState, UserGenerics, Viewports, dropZoneContext, migrate, transformProps, usePuck };

package/dist/index.js

@@ -169,12 +169,14 @@ __export(core_exports, {
   Button: () => Button,
   Drawer: () => Drawer,
   DropZone: () => DropZone,
+  DropZoneProvider: () => DropZoneProvider,
   FieldLabel: () => FieldLabel,
   Group: () => Group,
   IconButton: () => IconButton,
   Label: () => Label,
   Puck: () => Puck,
   Render: () => Render,
+  dropZoneContext: () => dropZoneContext,
   migrate: () => migrate,
   overrideKeys: () => overrideKeys,
   resolveAllData: () => resolveAllData,
@@ -3959,7 +3961,6 @@ var DropZoneRender = (0, import_react29.forwardRef)(
     }) });
   }
 );
-var DropZonePure = (props) => /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(DropZone, __spreadValues({}, props));
 var DropZone = (0, import_react29.forwardRef)(
   function DropZone2(props, ref) {
     const ctx = (0, import_react29.useContext)(dropZoneContext);
@@ -4066,25 +4067,6 @@ var GlobalPosition = class {
   }
 };
 
-// lib/bubble-pointer-event.ts
-init_react_import();
-var BaseEvent = typeof PointerEvent !== "undefined" ? PointerEvent : Event;
-var BubbledPointerEvent = class extends BaseEvent {
-  constructor(type, data) {
-    super(type, data);
-    this._originalTarget = null;
-    this.originalTarget = data.originalTarget;
-  }
-  // Necessary for Firefox
-  set originalTarget(target) {
-    this._originalTarget = target;
-  }
-  // Necessary for Firefox
-  get originalTarget() {
-    return this._originalTarget;
-  }
-};
-
 // lib/dnd/NestedDroppablePlugin.ts
 var depthSort = (candidates) => {
   return candidates.sort((a, b) => {
@@ -4209,7 +4191,7 @@ var createNestedDroppablePlugin = ({ onChange }, id) => class NestedDroppablePlu
     }
     const cleanupEffect = (0, import_state.effects)(() => {
       const handleMove = (event) => {
-        const target = event instanceof BubbledPointerEvent ? event.originalTarget || event.target : event.target;
+        const target = event.originalTarget || event.target;
         const position = new GlobalPosition(target, {
           x: event.clientX,
           y: event.clientY
@@ -5724,10 +5706,7 @@ var useResolvedFields = () => {
   const [fieldsLoading, setFieldsLoading] = (0, import_react36.useState)(false);
   const lastFields = (0, import_react36.useRef)(defaultFields);
   const defaultResolveFields = (_componentData, _params) => defaultFields;
-  const componentData = (0, import_react36.useMemo)(
-    () => selectedItem ? selectedItem : { props: rootProps, readOnly: data.root.readOnly || {} },
-    [selectedItem, rootProps, data.root.readOnly]
-  );
+  const componentData = selectedItem ? selectedItem : { props: rootProps, readOnly: data.root.readOnly };
   const hasComponentResolver = selectedItem && (componentConfig == null ? void 0 : componentConfig.resolveFields);
   const hasRootResolver = !selectedItem && ((_b = config.root) == null ? void 0 : _b.resolveFields);
   const hasResolver = hasComponentResolver || hasRootResolver;
@@ -5783,13 +5762,7 @@ var useResolvedFields = () => {
       }
     }
     setResolvedFields(defaultFields);
-  }, [
-    defaultFields,
-    state.ui.itemSelector,
-    hasResolver,
-    parent,
-    resolveFields
-  ]);
+  }, [defaultFields, state.ui.itemSelector, hasResolver, parent]);
   useOnValueChange(
     state.ui.itemSelector,
     () => {
@@ -6397,14 +6370,13 @@ function Render({
           config.root.render,
           __spreadProps(__spreadValues({}, rootProps), {
             puck: {
-              renderDropZone: DropZonePure,
-              isEditing: false,
-              dragRef: null
+              renderDropZone: DropZone,
+              isEditing: false
             },
             title,
             editMode: false,
             id: "puck-root",
-            children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(DropZonePure, { zone: rootDroppableId })
+            children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(DropZone, { zone: rootDroppableId })
           })
         )
       }
@@ -6420,7 +6392,7 @@ function Render({
         depth: 0,
         path: []
       },
-      children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(DropZonePure, { zone: rootDroppableId })
+      children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(DropZone, { zone: rootDroppableId })
     }
   );
 }
@@ -6434,8 +6406,21 @@ var useBubbleIframeEvents = (ref) => {
     var _a;
     if (ref.current && status === "READY") {
       const iframe = ref.current;
+      class BubbledPointerEventClass extends PointerEvent {
+        constructor(type, data) {
+          super(type, data);
+          this._originalTarget = null;
+          this.originalTarget = data.originalTarget;
+        }
+        set originalTarget(target) {
+          this._originalTarget = target;
+        }
+        get originalTarget() {
+          return this._originalTarget;
+        }
+      }
       const handlePointerMove = (event) => {
-        const evt = new BubbledPointerEvent("pointermove", __spreadProps(__spreadValues({}, event), {
+        const evt = new BubbledPointerEventClass("pointermove", __spreadProps(__spreadValues({}, event), {
           bubbles: true,
           cancelable: false,
           clientX: event.clientX,
@@ -6480,12 +6465,12 @@ var Preview2 = ({ id = "puck-preview" }) => {
     Page,
     __spreadProps(__spreadValues({}, rootProps), {
       puck: {
-        renderDropZone: DropZonePure,
+        renderDropZone: DropZone,
         isEditing: true,
         dragRef: null
       },
       editMode: true,
-      children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(DropZonePure, { zone: rootDroppableId })
+      children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(DropZone, { zone: rootDroppableId })
     })
   ) : /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(Render, { data: state.data, config });
   return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
@@ -7448,11 +7433,6 @@ var usePreviewModeHotkeys = (dispatch, iframeEnabled) => {
     preventDefault: true,
     document: resolvedFrame
   });
-  (0, import_react_hotkeys_hook2.useHotkeys)("ctrl+i", toggleInteractive, { preventDefault: true });
-  (0, import_react_hotkeys_hook2.useHotkeys)("ctrl+i", toggleInteractiveIframe, {
-    preventDefault: true,
-    document: resolvedFrame
-  });
 };
 
 // components/Puck/index.tsx
@@ -7968,12 +7948,14 @@ var usePuck = () => {
   Button,
   Drawer,
   DropZone,
+  DropZoneProvider,
   FieldLabel,
   Group,
   IconButton,
   Label,
   Puck,
   Render,
+  dropZoneContext,
   migrate,
   overrideKeys,
   resolveAllData,

package/dist/index.mjs

@@ -3804,7 +3804,6 @@ var DropZoneRender = forwardRef3(
     }) });
   }
 );
-var DropZonePure = (props) => /* @__PURE__ */ jsx22(DropZone, __spreadValues({}, props));
 var DropZone = forwardRef3(
   function DropZone2(props, ref) {
     const ctx = useContext6(dropZoneContext);
@@ -3911,25 +3910,6 @@ var GlobalPosition = class {
   }
 };
 
-// lib/bubble-pointer-event.ts
-init_react_import();
-var BaseEvent = typeof PointerEvent !== "undefined" ? PointerEvent : Event;
-var BubbledPointerEvent = class extends BaseEvent {
-  constructor(type, data) {
-    super(type, data);
-    this._originalTarget = null;
-    this.originalTarget = data.originalTarget;
-  }
-  // Necessary for Firefox
-  set originalTarget(target) {
-    this._originalTarget = target;
-  }
-  // Necessary for Firefox
-  get originalTarget() {
-    return this._originalTarget;
-  }
-};
-
 // lib/dnd/NestedDroppablePlugin.ts
 var depthSort = (candidates) => {
   return candidates.sort((a, b) => {
@@ -4054,7 +4034,7 @@ var createNestedDroppablePlugin = ({ onChange }, id) => class NestedDroppablePlu
     }
     const cleanupEffect = effects(() => {
       const handleMove = (event) => {
-        const target = event instanceof BubbledPointerEvent ? event.originalTarget || event.target : event.target;
+        const target = event.originalTarget || event.target;
         const position = new GlobalPosition(target, {
           x: event.clientX,
           y: event.clientY
@@ -5584,10 +5564,7 @@ var useResolvedFields = () => {
   const [fieldsLoading, setFieldsLoading] = useState19(false);
   const lastFields = useRef5(defaultFields);
   const defaultResolveFields = (_componentData, _params) => defaultFields;
-  const componentData = useMemo11(
-    () => selectedItem ? selectedItem : { props: rootProps, readOnly: data.root.readOnly || {} },
-    [selectedItem, rootProps, data.root.readOnly]
-  );
+  const componentData = selectedItem ? selectedItem : { props: rootProps, readOnly: data.root.readOnly };
   const hasComponentResolver = selectedItem && (componentConfig == null ? void 0 : componentConfig.resolveFields);
   const hasRootResolver = !selectedItem && ((_b = config.root) == null ? void 0 : _b.resolveFields);
   const hasResolver = hasComponentResolver || hasRootResolver;
@@ -5643,13 +5620,7 @@ var useResolvedFields = () => {
       }
     }
     setResolvedFields(defaultFields);
-  }, [
-    defaultFields,
-    state.ui.itemSelector,
-    hasResolver,
-    parent,
-    resolveFields
-  ]);
+  }, [defaultFields, state.ui.itemSelector, hasResolver, parent]);
   useOnValueChange(
     state.ui.itemSelector,
     () => {
@@ -6262,14 +6233,13 @@ function Render({
           config.root.render,
           __spreadProps(__spreadValues({}, rootProps), {
             puck: {
-              renderDropZone: DropZonePure,
-              isEditing: false,
-              dragRef: null
+              renderDropZone: DropZone,
+              isEditing: false
             },
             title,
             editMode: false,
             id: "puck-root",
-            children: /* @__PURE__ */ jsx32(DropZonePure, { zone: rootDroppableId })
+            children: /* @__PURE__ */ jsx32(DropZone, { zone: rootDroppableId })
           })
         )
       }
@@ -6285,7 +6255,7 @@ function Render({
         depth: 0,
         path: []
       },
-      children: /* @__PURE__ */ jsx32(DropZonePure, { zone: rootDroppableId })
+      children: /* @__PURE__ */ jsx32(DropZone, { zone: rootDroppableId })
     }
   );
 }
@@ -6299,8 +6269,21 @@ var useBubbleIframeEvents = (ref) => {
     var _a;
     if (ref.current && status === "READY") {
       const iframe = ref.current;
+      class BubbledPointerEventClass extends PointerEvent {
+        constructor(type, data) {
+          super(type, data);
+          this._originalTarget = null;
+          this.originalTarget = data.originalTarget;
+        }
+        set originalTarget(target) {
+          this._originalTarget = target;
+        }
+        get originalTarget() {
+          return this._originalTarget;
+        }
+      }
       const handlePointerMove = (event) => {
-        const evt = new BubbledPointerEvent("pointermove", __spreadProps(__spreadValues({}, event), {
+        const evt = new BubbledPointerEventClass("pointermove", __spreadProps(__spreadValues({}, event), {
           bubbles: true,
           cancelable: false,
           clientX: event.clientX,
@@ -6345,12 +6328,12 @@ var Preview2 = ({ id = "puck-preview" }) => {
     Page,
     __spreadProps(__spreadValues({}, rootProps), {
       puck: {
-        renderDropZone: DropZonePure,
+        renderDropZone: DropZone,
         isEditing: true,
         dragRef: null
       },
       editMode: true,
-      children: /* @__PURE__ */ jsx33(DropZonePure, { zone: rootDroppableId })
+      children: /* @__PURE__ */ jsx33(DropZone, { zone: rootDroppableId })
     })
   ) : /* @__PURE__ */ jsx33(Render, { data: state.data, config });
   return /* @__PURE__ */ jsx33(
@@ -7319,11 +7302,6 @@ var usePreviewModeHotkeys = (dispatch, iframeEnabled) => {
     preventDefault: true,
     document: resolvedFrame
   });
-  useHotkeys2("ctrl+i", toggleInteractive, { preventDefault: true });
-  useHotkeys2("ctrl+i", toggleInteractiveIframe, {
-    preventDefault: true,
-    document: resolvedFrame
-  });
 };
 
 // components/Puck/index.tsx
@@ -7798,12 +7776,14 @@ export {
   Button,
   Drawer,
   DropZone,
+  DropZoneProvider,
   FieldLabel,
   Group,
   IconButton,
   Label,
   Puck,
   Render,
+  dropZoneContext,
   migrate,
   overrideKeys,
   resolveAllData,

package/dist/{resolve-all-data-C-cc7ftj.d.mts → resolve-all-data-DzJEE28m.d.mts}

@@ -182,7 +182,7 @@ type Config<Props extends DefaultComponentProps = DefaultComponentProps, RootPro
     components: {
         [ComponentName in keyof Props]: Omit<ComponentConfig<Props[ComponentName], Props[ComponentName]>, "type">;
     };
-    root?: Partial<ComponentConfig<WithChildren<RootProps>, AsFieldProps<RootProps>, RootData<AsFieldProps<RootProps>>>>;
+    root?: Partial<ComponentConfig<DefaultRootRenderProps<RootProps>, AsFieldProps<RootProps>, RootData<AsFieldProps<RootProps>>>>;
 };
 
 type WithId<Props> = Props & {
@@ -459,4 +459,4 @@ type PuckAction = {
 
 declare function resolveAllData<Props extends DefaultComponentProps = DefaultComponentProps, RootProps extends Record<string, any> = DefaultRootFieldProps>(data: Partial<Data>, config: Config, onResolveStart?: (item: ComponentData) => void, onResolveEnd?: (item: ComponentData) => void): Promise<Data<Props, RootProps>>;
 
-export { type DefaultRootRenderProps as $, type AppState as A, type BaseData as B, type Config as C, type DropZoneProps as D, type ExtractPropsFromConfig as E, type FieldProps as F, type TextareaField as G, type History as H, type IframeConfig as I, type RadioField as J, type ArrayField as K, type ObjectField as L, type MappedItem as M, type NumberField as N, type OnAction as O, type Permissions as P, type Adaptor as Q, type RootDataWithProps as R, type SelectField as S, type TextField as T, type UserGenerics as U, type Viewports as V, type ExternalFieldWithAdaptor as W, type ExternalField as X, type CustomField as Y, type Fields as Z, type PuckContext as _, type Field as a, type DefaultRootProps as a0, type WithId as a1, type WithPuckProps as a2, type AsFieldProps as a3, type WithChildren as a4, resolveAllData as a5, type Data as b, type UiState as c, type Plugin as d, type Overrides as e, type PuckAction as f, type InitialHistory as g, type DefaultComponentProps as h, type DefaultRootFieldProps as i, type ExtractRootPropsFromConfig as j, type ComponentDataMap as k, type Direction as l, type DragAxis as m, type Viewport as n, overrideKeys as o, type OverrideKey as p, type FieldRenderFunctions as q, type ItemWithId as r, type ArrayState as s, type PuckComponent as t, type ComponentConfig as u, type RootDataWithoutProps as v, type RootData as w, type ComponentData as x, type Content as y, type BaseField as z };
+export { type PuckContext as $, type AppState as A, type BaseData as B, type Config as C, type Data as D, type ExtractPropsFromConfig as E, type FieldProps as F, type BaseField as G, type History as H, type ItemSelector as I, type TextareaField as J, type RadioField as K, type ArrayField as L, type MappedItem as M, type NumberField as N, type OnAction as O, type Permissions as P, type ObjectField as Q, type RootDataWithProps as R, type SelectField as S, type TextField as T, type UserGenerics as U, type Viewports as V, type Adaptor as W, type ExternalFieldWithAdaptor as X, type ExternalField as Y, type CustomField as Z, type Fields as _, type Field as a, type DefaultRootRenderProps as a0, type DefaultRootProps as a1, type WithId as a2, type WithPuckProps as a3, type AsFieldProps as a4, type WithChildren as a5, resolveAllData as a6, type DropZoneProps as b, type UiState as c, type Plugin as d, type Overrides as e, type PuckAction as f, type IframeConfig as g, type InitialHistory as h, type DefaultComponentProps as i, type DefaultRootFieldProps as j, type ExtractRootPropsFromConfig as k, type ComponentDataMap as l, type Direction as m, type DragAxis as n, type Viewport as o, overrideKeys as p, type OverrideKey as q, type FieldRenderFunctions as r, type ItemWithId as s, type ArrayState as t, type PuckComponent as u, type ComponentConfig as v, type RootDataWithoutProps as w, type RootData as x, type ComponentData as y, type Content as z };

package/dist/{resolve-all-data-C-cc7ftj.d.ts → resolve-all-data-DzJEE28m.d.ts}

@@ -182,7 +182,7 @@ type Config<Props extends DefaultComponentProps = DefaultComponentProps, RootPro
     components: {
         [ComponentName in keyof Props]: Omit<ComponentConfig<Props[ComponentName], Props[ComponentName]>, "type">;
     };
-    root?: Partial<ComponentConfig<WithChildren<RootProps>, AsFieldProps<RootProps>, RootData<AsFieldProps<RootProps>>>>;
+    root?: Partial<ComponentConfig<DefaultRootRenderProps<RootProps>, AsFieldProps<RootProps>, RootData<AsFieldProps<RootProps>>>>;
 };
 
 type WithId<Props> = Props & {
@@ -459,4 +459,4 @@ type PuckAction = {
 
 declare function resolveAllData<Props extends DefaultComponentProps = DefaultComponentProps, RootProps extends Record<string, any> = DefaultRootFieldProps>(data: Partial<Data>, config: Config, onResolveStart?: (item: ComponentData) => void, onResolveEnd?: (item: ComponentData) => void): Promise<Data<Props, RootProps>>;
 
-export { type DefaultRootRenderProps as $, type AppState as A, type BaseData as B, type Config as C, type DropZoneProps as D, type ExtractPropsFromConfig as E, type FieldProps as F, type TextareaField as G, type History as H, type IframeConfig as I, type RadioField as J, type ArrayField as K, type ObjectField as L, type MappedItem as M, type NumberField as N, type OnAction as O, type Permissions as P, type Adaptor as Q, type RootDataWithProps as R, type SelectField as S, type TextField as T, type UserGenerics as U, type Viewports as V, type ExternalFieldWithAdaptor as W, type ExternalField as X, type CustomField as Y, type Fields as Z, type PuckContext as _, type Field as a, type DefaultRootProps as a0, type WithId as a1, type WithPuckProps as a2, type AsFieldProps as a3, type WithChildren as a4, resolveAllData as a5, type Data as b, type UiState as c, type Plugin as d, type Overrides as e, type PuckAction as f, type InitialHistory as g, type DefaultComponentProps as h, type DefaultRootFieldProps as i, type ExtractRootPropsFromConfig as j, type ComponentDataMap as k, type Direction as l, type DragAxis as m, type Viewport as n, overrideKeys as o, type OverrideKey as p, type FieldRenderFunctions as q, type ItemWithId as r, type ArrayState as s, type PuckComponent as t, type ComponentConfig as u, type RootDataWithoutProps as v, type RootData as w, type ComponentData as x, type Content as y, type BaseField as z };
+export { type PuckContext as $, type AppState as A, type BaseData as B, type Config as C, type Data as D, type ExtractPropsFromConfig as E, type FieldProps as F, type BaseField as G, type History as H, type ItemSelector as I, type TextareaField as J, type RadioField as K, type ArrayField as L, type MappedItem as M, type NumberField as N, type OnAction as O, type Permissions as P, type ObjectField as Q, type RootDataWithProps as R, type SelectField as S, type TextField as T, type UserGenerics as U, type Viewports as V, type Adaptor as W, type ExternalFieldWithAdaptor as X, type ExternalField as Y, type CustomField as Z, type Fields as _, type Field as a, type DefaultRootRenderProps as a0, type DefaultRootProps as a1, type WithId as a2, type WithPuckProps as a3, type AsFieldProps as a4, type WithChildren as a5, resolveAllData as a6, type DropZoneProps as b, type UiState as c, type Plugin as d, type Overrides as e, type PuckAction as f, type IframeConfig as g, type InitialHistory as h, type DefaultComponentProps as i, type DefaultRootFieldProps as j, type ExtractRootPropsFromConfig as k, type ComponentDataMap as l, type Direction as m, type DragAxis as n, type Viewport as o, overrideKeys as p, type OverrideKey as q, type FieldRenderFunctions as r, type ItemWithId as s, type ArrayState as t, type PuckComponent as u, type ComponentConfig as v, type RootDataWithoutProps as w, type RootData as x, type ComponentData as y, type Content as z };

package/dist/rsc.d.mts

@@ -1,11 +1,11 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { C as Config, U as UserGenerics } from './resolve-all-data-C-cc7ftj.mjs';
-export { a5 as resolveAllData } from './resolve-all-data-C-cc7ftj.mjs';
+import { C as Config, D as Data } from './resolve-all-data-DzJEE28m.mjs';
+export { a6 as resolveAllData } from './resolve-all-data-DzJEE28m.mjs';
 import 'react';
 
-declare function Render<UserConfig extends Config = Config, G extends UserGenerics<UserConfig> = UserGenerics<UserConfig>>({ config, data }: {
+declare function Render<UserConfig extends Config = Config>({ config, data, }: {
     config: UserConfig;
-    data: G["UserData"];
+    data: Data;
 }): react_jsx_runtime.JSX.Element;
 
 export { Render };

package/dist/rsc.d.ts

@@ -1,11 +1,11 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { C as Config, U as UserGenerics } from './resolve-all-data-C-cc7ftj.js';
-export { a5 as resolveAllData } from './resolve-all-data-C-cc7ftj.js';
+import { C as Config, D as Data } from './resolve-all-data-DzJEE28m.js';
+export { a6 as resolveAllData } from './resolve-all-data-DzJEE28m.js';
 import 'react';
 
-declare function Render<UserConfig extends Config = Config, G extends UserGenerics<UserConfig> = UserGenerics<UserConfig>>({ config, data }: {
+declare function Render<UserConfig extends Config = Config>({ config, data, }: {
     config: UserConfig;
-    data: G["UserData"];
+    data: Data;
 }): react_jsx_runtime.JSX.Element;
 
 export { Render };

package/dist/rsc.js

@@ -131,7 +131,10 @@ function DropZoneRender({
     return null;
   }) });
 }
-function Render({ config, data }) {
+function Render({
+  config,
+  data
+}) {
   var _a;
   if ((_a = config.root) == null ? void 0 : _a.render) {
     const rootProps = data.root.props || data.root;
@@ -141,8 +144,7 @@ function Render({ config, data }) {
       __spreadProps(__spreadValues({}, rootProps), {
         puck: {
           renderDropZone: ({ zone }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(DropZoneRender, { zone, data, config }),
-          isEditing: false,
-          dragRef: null
+          isEditing: false
         },
         title,
         editMode: false,

package/dist/rsc.mjs

@@ -52,7 +52,10 @@ function DropZoneRender({
     return null;
   }) });
 }
-function Render({ config, data }) {
+function Render({
+  config,
+  data
+}) {
   var _a;
   if ((_a = config.root) == null ? void 0 : _a.render) {
     const rootProps = data.root.props || data.root;
@@ -62,8 +65,7 @@ function Render({ config, data }) {
       __spreadProps(__spreadValues({}, rootProps), {
         puck: {
           renderDropZone: ({ zone }) => /* @__PURE__ */ jsx(DropZoneRender, { zone, data, config }),
-          isEditing: false,
-          dragRef: null
+          isEditing: false
         },
         title,
         editMode: false,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@measured/puck",
-  "version": "0.18.2-canary.b9ce5b7",
+  "version": "0.18.2-canary.bdef789",
   "author": "Measured Corporation Ltd <hello@measured.co>",
   "repository": "measuredco/puck",
   "bugs": "https://github.com/measuredco/puck/issues",