@measured/puck 0.16.0-canary.2c52d27 → 0.16.0-canary.3298831

package/dist/index.d.ts

@@ -10,6 +10,7 @@ type InsertAction = {
     componentType: string;
     destinationIndex: number;
     destinationZone: string;
+    id?: string;
 };
 type DuplicateAction = {
     type: "duplicate";

package/dist/index.js

@@ -31282,34 +31282,37 @@ var replaceAction = (data, action) => {
     })
   });
 };
-var reduceData = (data, action, config) => {
-  if (action.type === "insert") {
-    const emptyComponentData = {
-      type: action.componentType,
-      props: __spreadProps(__spreadValues({}, config.components[action.componentType].defaultProps || {}), {
-        id: generateId(action.componentType)
-      })
-    };
-    if (action.destinationZone === rootDroppableId) {
-      return __spreadProps(__spreadValues({}, data), {
-        content: insert(
-          data.content,
-          action.destinationIndex,
-          emptyComponentData
-        )
-      });
-    }
-    const newData = setupZone(data, action.destinationZone);
+var insertAction = (data, action, config) => {
+  const emptyComponentData = {
+    type: action.componentType,
+    props: __spreadProps(__spreadValues({}, config.components[action.componentType].defaultProps || {}), {
+      id: action.id || generateId(action.componentType)
+    })
+  };
+  if (action.destinationZone === rootDroppableId) {
     return __spreadProps(__spreadValues({}, data), {
-      zones: __spreadProps(__spreadValues({}, newData.zones), {
-        [action.destinationZone]: insert(
-          newData.zones[action.destinationZone],
-          action.destinationIndex,
-          emptyComponentData
-        )
-      })
+      content: insert(
+        data.content,
+        action.destinationIndex,
+        emptyComponentData
+      )
     });
   }
+  const newData = setupZone(data, action.destinationZone);
+  return __spreadProps(__spreadValues({}, data), {
+    zones: __spreadProps(__spreadValues({}, newData.zones), {
+      [action.destinationZone]: insert(
+        newData.zones[action.destinationZone],
+        action.destinationIndex,
+        emptyComponentData
+      )
+    })
+  });
+};
+var reduceData = (data, action, config) => {
+  if (action.type === "insert") {
+    return insertAction(data, action, config);
+  }
   if (action.type === "duplicate") {
     const item = getItem(
       { index: action.sourceIndex, zone: action.sourceZone },
@@ -31773,20 +31776,8 @@ var MenuBar = ({
       },
       children: /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: getClassName19("inner"), children: [
         /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: getClassName19("history"), children: [
-          /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(IconButton, { title: "undo", disabled: !hasPast, onClick: back, children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
-            Undo2,
-            {
-              size: 21,
-              stroke: hasPast ? "var(--puck-color-black)" : "var(--puck-color-grey-08)"
-            }
-          ) }),
-          /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(IconButton, { title: "redo", disabled: !hasFuture, onClick: forward, children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
-            Redo2,
-            {
-              size: 21,
-              stroke: hasFuture ? "var(--puck-color-black)" : "var(--puck-color-grey-08)"
-            }
-          ) })
+          /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(IconButton, { title: "undo", disabled: !hasPast, onClick: back, children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Undo2, { size: 21 }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(IconButton, { title: "redo", disabled: !hasFuture, onClick: forward, children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Redo2, { size: 21 }) })
         ] }),
         /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_jsx_runtime25.Fragment, { children: renderHeaderActions && renderHeaderActions({
           state: appState,
@@ -33203,6 +33194,38 @@ var Canvas = () => {
   );
 };
 
+// lib/insert-component.ts
+init_react_import();
+var insertComponent = (componentType, zone, index, {
+  config,
+  dispatch,
+  resolveData,
+  state
+}) => {
+  const id = generateId(componentType);
+  const insertActionData = {
+    type: "insert",
+    componentType,
+    destinationIndex: index,
+    destinationZone: zone,
+    id
+  };
+  const insertedData = insertAction(state.data, insertActionData, config);
+  dispatch(__spreadProps(__spreadValues({}, insertActionData), {
+    // Dispatch insert rather set, as user's may rely on this via onAction
+    recordHistory: false
+  }));
+  const itemSelector = {
+    index,
+    zone
+  };
+  dispatch({ type: "setUi", ui: { itemSelector } });
+  resolveData({
+    data: insertedData,
+    ui: __spreadProps(__spreadValues({}, state.ui), { itemSelector })
+  });
+};
+
 // components/Puck/index.tsx
 var import_jsx_runtime36 = require("react/jsx-runtime");
 var getClassName26 = get_class_name_factory_default("Puck", styles_module_default14);
@@ -33448,16 +33471,12 @@ function Puck({
               }
               if (droppedItem.source.droppableId.startsWith("component-list") && droppedItem.destination) {
                 const [_, componentType] = droppedItem.draggableId.split("::");
-                dispatch({
-                  type: "insert",
-                  componentType: componentType || droppedItem.draggableId,
-                  destinationIndex: droppedItem.destination.index,
-                  destinationZone: droppedItem.destination.droppableId
-                });
-                setItemSelector({
-                  index: droppedItem.destination.index,
-                  zone: droppedItem.destination.droppableId
-                });
+                insertComponent(
+                  componentType || droppedItem.draggableId,
+                  droppedItem.destination.droppableId,
+                  droppedItem.destination.index,
+                  { config, dispatch, resolveData, state: appState }
+                );
                 return;
               } else {
                 const { source, destination } = droppedItem;

package/package.json

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