@measured/puck 0.16.0-canary.53c8bfc → 0.16.0-canary.555902

package/dist/index.mjs

@@ -8,7 +8,7 @@ import {
   init_react_import,
   rootDroppableId,
   setupZone
-} from "./chunk-TM7CT64S.mjs";
+} from "./chunk-7CYJT5DS.mjs";
 
 // ../../node_modules/classnames/index.js
 var require_classnames = __commonJS({
@@ -80,31 +80,26 @@ init_react_import();
 // lib/get-class-name-factory.ts
 init_react_import();
 var import_classnames = __toESM(require_classnames());
-var getClassNameFactory = (rootClass, styles, { baseClass = "" } = {}) => (options = {}) => {
-  let descendant = false;
-  let modifiers = false;
+var getClassNameFactory = (rootClass, styles, config = { baseClass: "" }) => (options = {}) => {
   if (typeof options === "string") {
-    descendant = options;
-  } else if (typeof options === "object") {
-    modifiers = options;
-  }
-  if (descendant) {
+    const descendant = options;
     const style = styles[`${rootClass}-${descendant}`];
     if (style) {
-      return baseClass + styles[`${rootClass}-${descendant}`] || "";
+      return config.baseClass + styles[`${rootClass}-${descendant}`] || "";
     }
     return "";
-  } else if (modifiers) {
+  } else if (typeof options === "object") {
+    const modifiers = options;
     const prefixedModifiers = {};
     for (let modifier in modifiers) {
       prefixedModifiers[styles[`${rootClass}--${modifier}`]] = modifiers[modifier];
     }
     const c = styles[rootClass];
-    return baseClass + (0, import_classnames.default)(__spreadValues({
+    return config.baseClass + (0, import_classnames.default)(__spreadValues({
       [c]: !!c
     }, prefixedModifiers));
   } else {
-    return baseClass + styles[rootClass] || "";
+    return config.baseClass + styles[rootClass] || "";
   }
 };
 var get_class_name_factory_default = getClassNameFactory;
@@ -562,14 +557,14 @@ import {
 
 // lib/get-item.ts
 init_react_import();
-var getItem = (selector, data, dynamicProps = {}) => {
+function getItem(selector, data, dynamicProps = {}) {
   if (!selector.zone || selector.zone === rootDroppableId) {
     const item2 = data.content[selector.index];
     return (item2 == null ? void 0 : item2.props) ? __spreadProps(__spreadValues({}, item2), { props: dynamicProps[item2.props.id] || item2.props }) : void 0;
   }
   const item = setupZone(data, selector.zone).zones[selector.zone][selector.index];
   return (item == null ? void 0 : item.props) ? __spreadProps(__spreadValues({}, item), { props: dynamicProps[item.props.id] || item.props }) : void 0;
-};
+}
 
 // components/ViewportControls/default-viewports.ts
 init_react_import();
@@ -583,7 +578,7 @@ var defaultViewports = [
 import { UAParser } from "ua-parser-js";
 import { jsx as jsx4 } from "react/jsx-runtime";
 var defaultAppState = {
-  data: { content: [], root: { props: {} } },
+  data: { content: [], root: {} },
   ui: {
     leftSideBarVisible: true,
     rightSideBarVisible: true,
@@ -1378,7 +1373,7 @@ var ExternalInput = ({
                     }
                   ) })
                 ] })
-              ] }) : /* @__PURE__ */ jsx14(Heading, { rank: 2, size: "xs", children: field.placeholder || "Select data" }) }),
+              ] }) : /* @__PURE__ */ jsx14(Heading, { rank: "2", size: "xs", children: field.placeholder || "Select data" }) }),
               /* @__PURE__ */ jsxs7("div", { className: getClassNameModal("grid"), children: [
                 hasFilterFields && /* @__PURE__ */ jsx14("div", { className: getClassNameModal("filters"), children: hasFilterFields && Object.keys(filterFields).map((fieldName) => {
                   const filterField = filterFields[fieldName];
@@ -2818,7 +2813,7 @@ var SidebarSection = ({
             ),
             /* @__PURE__ */ jsx26(ChevronRight, { size: 16 })
           ] }, i)) : null,
-          /* @__PURE__ */ jsx26("div", { className: getClassName19("heading"), children: /* @__PURE__ */ jsx26(Heading, { rank: 2, size: "xs", children: title }) })
+          /* @__PURE__ */ jsx26("div", { className: getClassName19("heading"), children: /* @__PURE__ */ jsx26(Heading, { rank: "2", size: "xs", children: title }) })
         ] }) }),
         /* @__PURE__ */ jsx26("div", { className: getClassName19("content"), children }),
         isLoading && /* @__PURE__ */ jsx26("div", { className: getClassName19("loadingOverlay"), children: /* @__PURE__ */ jsx26(Loader, { size: 32 }) })
@@ -2851,7 +2846,7 @@ var remove = (list, index) => {
 
 // lib/reduce-related-zones.ts
 init_react_import();
-var reduceRelatedZones = (item, data, fn) => {
+function reduceRelatedZones(item, data, fn) {
   return __spreadProps(__spreadValues({}, data), {
     zones: Object.keys(data.zones || {}).reduce(
       (acc, key) => {
@@ -2865,28 +2860,34 @@ var reduceRelatedZones = (item, data, fn) => {
       {}
     )
   });
-};
+}
 var findRelatedByZoneId = (zoneId, data) => {
   const [zoneParentId] = getZoneId(zoneId);
-  return (data.zones[zoneId] || []).reduce((acc, zoneItem) => {
-    const related = findRelatedByItem(zoneItem, data);
-    if (zoneItem.props.id === zoneParentId) {
-      return __spreadProps(__spreadValues(__spreadValues({}, acc), related), { [zoneId]: zoneItem });
-    }
-    return __spreadValues(__spreadValues({}, acc), related);
-  }, {});
+  return (data.zones[zoneId] || []).reduce(
+    (acc, zoneItem) => {
+      const related = findRelatedByItem(zoneItem, data);
+      if (zoneItem.props.id === zoneParentId) {
+        return __spreadProps(__spreadValues(__spreadValues({}, acc), related), { [zoneId]: zoneItem });
+      }
+      return __spreadValues(__spreadValues({}, acc), related);
+    },
+    {}
+  );
 };
 var findRelatedByItem = (item, data) => {
-  return Object.keys(data.zones || {}).reduce((acc, zoneId) => {
-    const [zoneParentId] = getZoneId(zoneId);
-    if (item.props.id === zoneParentId) {
-      const related = findRelatedByZoneId(zoneId, data);
-      return __spreadProps(__spreadValues(__spreadValues({}, acc), related), {
-        [zoneId]: data.zones[zoneId]
-      });
-    }
-    return acc;
-  }, {});
+  return Object.keys(data.zones || {}).reduce(
+    (acc, zoneId) => {
+      const [zoneParentId] = getZoneId(zoneId);
+      if (item.props.id === zoneParentId) {
+        const related = findRelatedByZoneId(zoneId, data);
+        return __spreadProps(__spreadValues(__spreadValues({}, acc), related), {
+          [zoneId]: data.zones[zoneId]
+        });
+      }
+      return acc;
+    },
+    {}
+  );
 };
 var removeRelatedZones = (item, data) => {
   const newData = __spreadValues({}, data);
@@ -2896,7 +2897,7 @@ var removeRelatedZones = (item, data) => {
   });
   return newData;
 };
-var duplicateRelatedZones = (item, data, newId) => {
+function duplicateRelatedZones(item, data, newId) {
   return reduceRelatedZones(item, data, (acc, key, zone) => {
     const dupedZone = zone.map((zoneItem) => __spreadProps(__spreadValues({}, zoneItem), {
       props: __spreadProps(__spreadValues({}, zoneItem.props), { id: generateId(zoneItem.type) })
@@ -2911,7 +2912,7 @@ var duplicateRelatedZones = (item, data, newId) => {
       [`${newId}:${zoneId}`]: dupedZone
     });
   });
-};
+}
 
 // reducer/data.ts
 var zoneCache = {};
@@ -2935,7 +2936,7 @@ var replaceAction = (data, action) => {
     })
   });
 };
-var insertAction = (data, action, config) => {
+function insertAction(data, action, config) {
   const emptyComponentData = {
     type: action.componentType,
     props: __spreadProps(__spreadValues({}, config.components[action.componentType].defaultProps || {}), {
@@ -2961,8 +2962,8 @@ var insertAction = (data, action, config) => {
       )
     })
   });
-};
-var reduceData = (data, action, config) => {
+}
+function reduceData(data, action, config) {
   if (action.type === "insert") {
     return insertAction(data, action, config);
   }
@@ -3111,7 +3112,7 @@ var reduceData = (data, action, config) => {
     return __spreadValues(__spreadValues({}, data), action.data(data));
   }
   return data;
-};
+}
 
 // reducer/state.ts
 init_react_import();
@@ -3129,7 +3130,7 @@ var reduceUi = (ui, action) => {
 init_react_import();
 
 // reducer/index.ts
-var storeInterceptor = (reducer, record, onAction) => {
+function storeInterceptor(reducer, record, onAction) {
   return (state, action) => {
     const newAppState = reducer(state, action);
     const isValidType = ![
@@ -3145,7 +3146,7 @@ var storeInterceptor = (reducer, record, onAction) => {
     onAction == null ? void 0 : onAction(action, newAppState, state);
     return newAppState;
   };
-};
+}
 var setAction = (state, action) => {
   if (typeof action.state === "object") {
     return __spreadValues(__spreadValues({}, state), action.state);
@@ -3260,28 +3261,30 @@ var applyDynamicProps = (data, dynamicProps, rootData) => {
 // lib/resolve-root-data.ts
 init_react_import();
 var cache3 = {};
-var resolveRootData = (data, config) => __async(void 0, null, function* () {
-  var _a, _b, _c, _d, _e;
-  if (((_a = config.root) == null ? void 0 : _a.resolveData) && data.root.props) {
-    if (((_b = cache3.lastChange) == null ? void 0 : _b.original) === data.root) {
-      return cache3.lastChange.resolved;
+function resolveRootData(data, config) {
+  return __async(this, null, function* () {
+    var _a, _b, _c, _d, _e;
+    if (((_a = config.root) == null ? void 0 : _a.resolveData) && data.root.props) {
+      if (((_b = cache3.lastChange) == null ? void 0 : _b.original) === data.root) {
+        return cache3.lastChange.resolved;
+      }
+      const changed = getChanged(data.root, (_c = cache3.lastChange) == null ? void 0 : _c.original);
+      const rootWithProps = data.root;
+      const resolvedRoot = yield (_e = config.root) == null ? void 0 : _e.resolveData(rootWithProps, {
+        changed,
+        lastData: ((_d = cache3.lastChange) == null ? void 0 : _d.original) || {}
+      });
+      cache3.lastChange = {
+        original: data.root,
+        resolved: resolvedRoot
+      };
+      return __spreadProps(__spreadValues(__spreadValues({}, data.root), resolvedRoot), {
+        props: __spreadValues(__spreadValues({}, data.root.props), resolvedRoot.props)
+      });
     }
-    const changed = getChanged(data.root, (_c = cache3.lastChange) == null ? void 0 : _c.original);
-    const rootWithProps = data.root;
-    const resolvedRoot = yield (_e = config.root) == null ? void 0 : _e.resolveData(rootWithProps, {
-      changed,
-      lastData: ((_d = cache3.lastChange) == null ? void 0 : _d.original) || {}
-    });
-    cache3.lastChange = {
-      original: data.root,
-      resolved: resolvedRoot
-    };
-    return __spreadProps(__spreadValues(__spreadValues({}, data.root), resolvedRoot), {
-      props: __spreadValues(__spreadValues({}, data.root.props), resolvedRoot.props)
-    });
-  }
-  return data.root;
-});
+    return data.root;
+  });
+}
 
 // lib/use-resolved-data.ts
 var useResolvedData = (appState, config, dispatch) => {
@@ -3386,15 +3389,14 @@ var styles_module_default14 = { "MenuBar": "_MenuBar_8pf8c_1", "MenuBar--menuOpe
 // components/MenuBar/index.tsx
 import { Fragment as Fragment12, jsx as jsx27, jsxs as jsxs14 } from "react/jsx-runtime";
 var getClassName20 = get_class_name_factory_default("MenuBar", styles_module_default14);
-var MenuBar = ({
+function MenuBar({
   appState,
-  data = { content: [], root: {} },
   dispatch,
   menuOpen = false,
   onPublish,
   renderHeaderActions,
   setMenuOpen
-}) => {
+}) {
   const {
     history: { back, forward, historyStore }
   } = useAppContext();
@@ -3425,7 +3427,7 @@ var MenuBar = ({
       ] })
     }
   );
-};
+}
 
 // css-module:/home/runner/work/puck/puck/packages/core/components/Puck/styles.module.css#css-module
 init_react_import();
@@ -3458,9 +3460,7 @@ var useResolvedFields = () => {
   const componentConfig = selectedItem ? config.components[selectedItem.type] : null;
   const defaultFields = selectedItem ? componentConfig == null ? void 0 : componentConfig.fields : rootFields;
   const rootProps = data.root.props || data.root;
-  const [lastSelectedData, setLastSelectedData] = useState14(
-    {}
-  );
+  const [lastSelectedData, setLastSelectedData] = useState14({});
   const [resolvedFields, setResolvedFields] = useState14(defaultFields || {});
   const [fieldsLoading, setFieldsLoading] = useState14(false);
   const defaultResolveFields = (_componentData, _params) => defaultFields;
@@ -3623,7 +3623,7 @@ var Fields = () => {
               `${selectedItem.props.id}_${fieldName}`
             );
           } else {
-            const { readOnly = {} } = data.root;
+            const readOnly = data.root.readOnly || {};
             return /* @__PURE__ */ jsx28(
               AutoFieldPrivate,
               {
@@ -4084,13 +4084,9 @@ var Preview = ({ id = "puck-preview" }) => {
   const Page = useCallback7(
     (pageProps) => {
       var _a, _b;
-      return ((_a = config.root) == null ? void 0 : _a.render) ? (_b = config.root) == null ? void 0 : _b.render(__spreadProps(__spreadValues({
+      return ((_a = config.root) == null ? void 0 : _a.render) ? (_b = config.root) == null ? void 0 : _b.render(__spreadValues({
         id: "puck-root"
-      }, pageProps), {
-        editMode: true,
-        // DEPRECATED
-        puck: { renderDropZone: DropZone, isEditing: true }
-      })) : /* @__PURE__ */ jsx33(Fragment15, { children: pageProps.children });
+      }, pageProps)) : /* @__PURE__ */ jsx33(Fragment15, { children: pageProps.children });
     },
     [config.root]
   );
@@ -4114,14 +4110,28 @@ var Preview = ({ id = "puck-preview" }) => {
             setStatus("READY");
           },
           children: /* @__PURE__ */ jsx33(autoFrameContext.Consumer, { children: ({ document: document2 }) => {
-            const inner = /* @__PURE__ */ jsx33(Page, __spreadProps(__spreadValues({ dispatch, state }, rootProps), { children: /* @__PURE__ */ jsx33(DropZone, { zone: rootDroppableId }) }));
+            const inner = /* @__PURE__ */ jsx33(
+              Page,
+              __spreadProps(__spreadValues({}, rootProps), {
+                puck: { renderDropZone: DropZone, isEditing: true },
+                editMode: true,
+                children: /* @__PURE__ */ jsx33(DropZone, { zone: rootDroppableId })
+              })
+            );
             if (Frame) {
               return /* @__PURE__ */ jsx33(Frame, { document: document2, children: inner });
             }
             return inner;
           } })
         }
-      ) : /* @__PURE__ */ jsx33("div", { id: "preview-frame", className: getClassName23("frame"), children: /* @__PURE__ */ jsx33(Page, __spreadProps(__spreadValues({ dispatch, state }, rootProps), { children: /* @__PURE__ */ jsx33(DropZone, { zone: rootDroppableId }) })) })
+      ) : /* @__PURE__ */ jsx33("div", { id: "preview-frame", className: getClassName23("frame"), children: /* @__PURE__ */ jsx33(
+        Page,
+        __spreadProps(__spreadValues({}, rootProps), {
+          puck: { renderDropZone: DropZone, isEditing: true },
+          editMode: true,
+          children: /* @__PURE__ */ jsx33(DropZone, { zone: rootDroppableId })
+        })
+      ) })
     }
   );
 };
@@ -4923,7 +4933,8 @@ var loadOverrides = ({
 }) => {
   const collected = __spreadValues({}, overrides);
   plugins == null ? void 0 : plugins.forEach((plugin) => {
-    Object.keys(plugin.overrides).forEach((overridesType) => {
+    Object.keys(plugin.overrides).forEach((_overridesType) => {
+      const overridesType = _overridesType;
       if (overridesType === "fieldTypes") {
         const fieldTypes = plugin.overrides.fieldTypes;
         Object.keys(fieldTypes).forEach((fieldType) => {
@@ -4963,7 +4974,7 @@ var getLayoutClassName = get_class_name_factory_default("PuckLayout", styles_mod
 function Puck({
   children,
   config,
-  data: initialData = { content: [], root: {} },
+  data: initialData,
   ui: initialUi,
   onChange,
   onPublish,
@@ -4985,10 +4996,14 @@ function Puck({
   var _a;
   const historyStore = useHistoryStore(initialHistory);
   const [reducer] = useState20(
-    () => createReducer({ config, record: historyStore.record, onAction })
+    () => createReducer({
+      config,
+      record: historyStore.record,
+      onAction
+    })
   );
   const [initialAppState] = useState20(() => {
-    var _a2, _b, _c, _d, _e, _f, _g;
+    var _a2, _b, _c, _d, _e, _f, _g, _h, _i;
     const initial = __spreadValues(__spreadValues({}, defaultAppState.ui), initialUi);
     let clientUiState = {};
     if (typeof window !== "undefined") {
@@ -5008,20 +5023,20 @@ function Puck({
         clientUiState = {
           viewports: __spreadProps(__spreadValues({}, initial.viewports), {
             current: __spreadProps(__spreadValues({}, initial.viewports.current), {
-              height: ((_b = (_a2 = initialUi == null ? void 0 : initialUi.viewports) == null ? void 0 : _a2.current) == null ? void 0 : _b.height) || viewports[closestViewport].height || "auto",
-              width: ((_d = (_c = initialUi == null ? void 0 : initialUi.viewports) == null ? void 0 : _c.current) == null ? void 0 : _d.width) || viewports[closestViewport].width
+              height: ((_b = (_a2 = initialUi == null ? void 0 : initialUi.viewports) == null ? void 0 : _a2.current) == null ? void 0 : _b.height) || ((_c = viewports[closestViewport]) == null ? void 0 : _c.height) || "auto",
+              width: ((_e = (_d = initialUi == null ? void 0 : initialUi.viewports) == null ? void 0 : _d.current) == null ? void 0 : _e.width) || ((_f = viewports[closestViewport]) == null ? void 0 : _f.width)
             })
           })
         };
       }
     }
-    if (Object.keys((initialData == null ? void 0 : initialData.root) || {}).length > 0 && !((_e = initialData == null ? void 0 : initialData.root) == null ? void 0 : _e.props)) {
+    if (Object.keys((initialData == null ? void 0 : initialData.root) || {}).length > 0 && !((_g = initialData == null ? void 0 : initialData.root) == null ? void 0 : _g.props)) {
       console.error(
         "Warning: Defining props on `root` is deprecated. Please use `root.props`, or republish this page to migrate automatically."
       );
     }
-    const rootProps2 = ((_f = initialData == null ? void 0 : initialData.root) == null ? void 0 : _f.props) || (initialData == null ? void 0 : initialData.root) || {};
-    const defaultedRootProps = __spreadValues(__spreadValues({}, (_g = config.root) == null ? void 0 : _g.defaultProps), rootProps2);
+    const rootProps2 = ((_h = initialData == null ? void 0 : initialData.root) == null ? void 0 : _h.props) || (initialData == null ? void 0 : initialData.root) || {};
+    const defaultedRootProps = __spreadValues(__spreadValues({}, (_i = config.root) == null ? void 0 : _i.defaultProps), rootProps2);
     return __spreadProps(__spreadValues({}, defaultAppState), {
       data: __spreadProps(__spreadValues({}, initialData), {
         root: __spreadProps(__spreadValues({}, initialData == null ? void 0 : initialData.root), { props: defaultedRootProps }),
@@ -5313,7 +5328,7 @@ function Puck({
                                 }
                               )
                             ] }),
-                            /* @__PURE__ */ jsx38("div", { className: getLayoutClassName("headerTitle"), children: /* @__PURE__ */ jsxs21(Heading, { rank: 2, size: "xs", children: [
+                            /* @__PURE__ */ jsx38("div", { className: getLayoutClassName("headerTitle"), children: /* @__PURE__ */ jsxs21(Heading, { rank: "2", size: "xs", children: [
                               headerTitle || rootProps.title || "Page",
                               headerPath && /* @__PURE__ */ jsxs21(Fragment19, { children: [
                                 " ",
@@ -5341,7 +5356,6 @@ function Puck({
                                 MenuBar,
                                 {
                                   appState,
-                                  data,
                                   dispatch,
                                   onPublish,
                                   menuOpen,
@@ -5397,10 +5411,7 @@ Puck.Preview = Preview;
 // components/Render/index.tsx
 init_react_import();
 import { jsx as jsx39 } from "react/jsx-runtime";
-function Render({
-  config,
-  data
-}) {
+function Render({ config, data }) {
   var _a;
   const defaultedData = __spreadProps(__spreadValues({}, data), {
     root: data.root || {},

package/dist/rsc.d.mts

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { C as Config, D as Data } from './Config-CkVFT1_w.mjs';
+import { C as Config, D as Data } from './Config-RpUGTBxI.mjs';
 import 'react';
 
 declare function Render<UserConfig extends Config = Config>({ config, data, }: {

package/dist/rsc.d.ts

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { C as Config, D as Data } from './Config-CkVFT1_w.js';
+import { C as Config, D as Data } from './Config-RpUGTBxI.js';
 import 'react';
 
 declare function Render<UserConfig extends Config = Config>({ config, data, }: {

package/dist/rsc.js

@@ -58,12 +58,16 @@ var import_react = __toESM(require("react"));
 var rootDroppableId = "default-zone";
 
 // lib/setup-zone.ts
+function ensureZones(data) {
+  return __spreadProps(__spreadValues({}, data), {
+    zones: data.zones || {}
+  });
+}
 var setupZone = (data, zoneKey) => {
   if (zoneKey === rootDroppableId) {
     return data;
   }
-  const newData = __spreadValues({}, data);
-  newData.zones = data.zones || {};
+  const newData = ensureZones(data);
   newData.zones[zoneKey] = newData.zones[zoneKey] || [];
   return newData;
 };

package/dist/rsc.mjs

@@ -4,7 +4,7 @@ import {
   init_react_import,
   rootDroppableId,
   setupZone
-} from "./chunk-TM7CT64S.mjs";
+} from "./chunk-7CYJT5DS.mjs";
 
 // rsc.tsx
 init_react_import();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@measured/puck",
-  "version": "0.16.0-canary.53c8bfc",
+  "version": "0.16.0-canary.555902",
   "author": "Measured Corporation Ltd <hello@measured.co>",
   "repository": "measuredco/puck",
   "bugs": "https://github.com/measuredco/puck/issues",
@@ -10,9 +10,16 @@
   "types": "./dist/index.d.ts",
   "exports": {
     ".": {
-      "import": "./dist/index.mjs",
-      "require": "./dist/index.js",
-      "types": "./dist/index.d.ts"
+      "react-server": {
+        "import": "./dist/rsc.mjs",
+        "require": "./dist/rsc.js",
+        "types": "./dist/rsc.d.ts"
+      },
+      "default": {
+        "import": "./dist/index.mjs",
+        "require": "./dist/index.js",
+        "types": "./dist/index.d.ts"
+      }
     },
     "./rsc": {
       "import": "./dist/rsc.mjs",
@@ -44,9 +51,11 @@
     "@testing-library/react": "^14.0.0",
     "@types/deep-diff": "^1.0.3",
     "@types/jest": "^29.5.4",
+    "@types/object-hash": "^3.0.6",
     "@types/react": "^18.2.0",
     "@types/react-dom": "^18.2.0",
     "@types/ua-parser-js": "^0.7.39",
+    "@types/uuid": "^10.0.0",
     "css-box-model": "^1.2.1",
     "eslint": "^7.32.0",
     "eslint-config-custom": "*",