@measured/puck 0.10.0-canary.6a9145c → 0.10.0-canary.8d47fd7

package/dist/index.d.ts

@@ -111,14 +111,14 @@ type ArrayState = {
     items: ItemWithId[];
     openId: string;
 };
-type AppState = {
+type UiState = {
     leftSideBarVisible: boolean;
     itemSelector?: ItemSelector | null;
     arrayState: Record<string, ArrayState | undefined>;
 };
-type AppData = {
+type AppState = {
     data: Data;
-    state: AppState;
+    ui: UiState;
 };
 
 declare const Button: ({ children, href, onClick, variant, type, disabled, tabIndex, newTab, fullWidth, icon, size, }: {
@@ -171,8 +171,8 @@ type RemoveAction = {
     zone: string;
 };
 type SetStateAction = {
-    type: "setState";
-    state: Partial<AppState>;
+    type: "setUi";
+    ui: Partial<UiState>;
 };
 type SetDataAction = {
     type: "setData";
@@ -180,7 +180,7 @@ type SetDataAction = {
 };
 type SetAction = {
     type: "set";
-    appData: Partial<AppData>;
+    state: Partial<AppState>;
 };
 type RegisterZoneAction = {
     type: "registerZone";
@@ -292,4 +292,4 @@ declare const FieldLabel: ({ children, icon, label, }: {
     label: string;
 }) => react_jsx_runtime.JSX.Element;
 
-export { Adaptor, AppData, AppState, ArrayState, Button, ComponentConfig, Config, Content, Data, DefaultComponentProps, DefaultRootProps, DropZone, DropZoneProvider, Field, FieldLabel, Fields, IconButton, ItemWithId, MappedItem, Puck, Render, dropZoneContext };
+export { Adaptor, AppState, ArrayState, Button, ComponentConfig, Config, Content, Data, DefaultComponentProps, DefaultRootProps, DropZone, DropZoneProvider, Field, FieldLabel, Fields, IconButton, ItemWithId, MappedItem, Puck, Render, UiState, dropZoneContext };

package/dist/index.js

@@ -3175,28 +3175,28 @@ var DragIcon = () => /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { class
 // components/Puck/context.tsx
 init_react_import();
 var import_react24 = require("react");
-var defaultAppData = {
+var defaultAppState = {
   data: { content: [], root: { title: "" } },
-  state: {
+  ui: {
     leftSideBarVisible: true,
     arrayState: {}
   }
 };
 var appContext = (0, import_react24.createContext)({
-  appData: defaultAppData,
+  state: defaultAppState,
   dispatch: () => null
 });
 var AppProvider = appContext.Provider;
 var useAppContext = () => {
   const mainContext = (0, import_react24.useContext)(appContext);
-  const selectedItem = mainContext.appData.state.itemSelector ? getItem(mainContext.appData.state.itemSelector, mainContext.appData.data) : void 0;
+  const selectedItem = mainContext.state.ui.itemSelector ? getItem(mainContext.state.ui.itemSelector, mainContext.state.data) : void 0;
   return __spreadProps(__spreadValues({}, mainContext), {
     // Helpers
     selectedItem,
-    setState: (state, recordHistory) => {
+    setUi: (ui, recordHistory) => {
       return mainContext.dispatch({
-        type: "setState",
-        state,
+        type: "setUi",
+        ui,
         recordHistory
       });
     }
@@ -3216,8 +3216,8 @@ var ArrayField = ({
   label
 }) => {
   const [arrayFieldId] = (0, import_react25.useState)(generateId("ArrayField"));
-  const { appData, setState } = useAppContext();
-  const arrayState = appData.state.arrayState[arrayFieldId] || {
+  const { state, setUi } = useAppContext();
+  const arrayState = state.ui.arrayState[arrayFieldId] || {
     items: Array.from(value).map((v) => ({
       _arrayId: generateId("ArrayItem"),
       data: v
@@ -3226,9 +3226,9 @@ var ArrayField = ({
   };
   const setArrayState = (0, import_react25.useCallback)(
     (newArrayState, recordHistory = false) => {
-      setState(
+      setUi(
         {
-          arrayState: __spreadProps(__spreadValues({}, appData.state.arrayState), {
+          arrayState: __spreadProps(__spreadValues({}, state.ui.arrayState), {
             [arrayFieldId]: __spreadValues(__spreadValues({}, arrayState), newArrayState)
           })
         },
@@ -3903,7 +3903,7 @@ var convertPathDataToBreadcrumbs = (selectedItem, pathData, data) => {
 };
 var useBreadcrumbs = (renderCount) => {
   const {
-    appData: { data },
+    state: { data },
     selectedItem
   } = useAppContext();
   const dzContext = (0, import_react28.useContext)(dropZoneContext);
@@ -3930,7 +3930,7 @@ var SidebarSection = ({
   showBreadcrumbs,
   noPadding
 }) => {
-  const { setState } = useAppContext();
+  const { setUi } = useAppContext();
   const breadcrumbs = useBreadcrumbs(1);
   return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: getClassName16({ noPadding }), style: { background }, children: [
     /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: getClassName16("title"), children: /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: getClassName16("breadcrumbs"), children: [
@@ -3939,7 +3939,7 @@ var SidebarSection = ({
           "div",
           {
             className: getClassName16("breadcrumbLabel"),
-            onClick: () => setState({ itemSelector: breadcrumb.selector }),
+            onClick: () => setUi({ itemSelector: breadcrumb.selector }),
             children: breadcrumb.label
           }
         ),
@@ -4008,30 +4008,35 @@ var import_use_debounce2 = require("use-debounce");
 var DEBOUNCE_TIME = 250;
 var RECORD_DIFF = "RECORD_DIFF";
 var historyEmitter = (0, import_event_emitter.default)();
-var recordDiff = (newAppData) => historyEmitter.emit(RECORD_DIFF, newAppData);
-var _recordHistory = ({ snapshot, newSnapshot, record, dispatch }) => {
+var recordDiff = (newAppState) => historyEmitter.emit(RECORD_DIFF, newAppState);
+var _recordHistory = ({
+  snapshot,
+  newSnapshot,
+  record,
+  dispatch
+}) => {
   record({
     forward: () => {
-      dispatch({ type: "set", appData: newSnapshot });
+      dispatch({ type: "set", state: newSnapshot });
     },
     rewind: () => {
-      dispatch({ type: "set", appData: snapshot });
+      dispatch({ type: "set", state: snapshot });
     }
   });
 };
 function usePuckHistory({
-  appData,
+  appState,
   dispatch
 }) {
   const { canForward, canRewind, rewind, forward, record } = useActionHistory();
   (0, import_react_hotkeys_hook.useHotkeys)("meta+z", rewind, { preventDefault: true });
   (0, import_react_hotkeys_hook.useHotkeys)("meta+shift+z", forward, { preventDefault: true });
   (0, import_react_hotkeys_hook.useHotkeys)("meta+y", forward, { preventDefault: true });
-  const [snapshot] = (0, import_use_debounce2.useDebounce)(appData, DEBOUNCE_TIME);
-  const handleRecordDiff = (0, import_use_debounce2.useDebouncedCallback)((newAppData) => {
+  const [snapshot] = (0, import_use_debounce2.useDebounce)(appState, DEBOUNCE_TIME);
+  const handleRecordDiff = (0, import_use_debounce2.useDebouncedCallback)((newAppState) => {
     return _recordHistory({
       snapshot,
-      newSnapshot: newAppData,
+      newSnapshot: newAppState,
       record,
       dispatch
     });
@@ -4326,11 +4331,11 @@ var reduceData = (data, action, config) => {
 
 // reducer/state.ts
 init_react_import();
-var reduceState = (state, action) => {
-  if (action.type === "setState") {
-    return __spreadValues(__spreadValues({}, state), action.state);
+var reduceState = (ui, action) => {
+  if (action.type === "setUi") {
+    return __spreadValues(__spreadValues({}, ui), action.ui);
   }
-  return state;
+  return ui;
 };
 
 // reducer/actions.tsx
@@ -4338,8 +4343,8 @@ init_react_import();
 
 // reducer/index.ts
 var storeInterceptor = (reducer) => {
-  return (appData, action) => {
-    const newAppData = reducer(appData, action);
+  return (state, action) => {
+    const newAppState = reducer(state, action);
     const isValidType = ![
       "registerZone",
       "unregisterZone",
@@ -4348,18 +4353,18 @@ var storeInterceptor = (reducer) => {
       "set"
     ].includes(action.type);
     if (typeof action.recordHistory !== "undefined" ? action.recordHistory : isValidType) {
-      recordDiff(newAppData);
+      recordDiff(newAppState);
     }
-    return newAppData;
+    return newAppState;
   };
 };
-var createReducer = ({ config }) => storeInterceptor((appData, action) => {
-  const data = reduceData(appData.data, action, config);
-  const state = reduceState(appData.state, action);
+var createReducer = ({ config }) => storeInterceptor((state, action) => {
+  const data = reduceData(state.data, action, config);
+  const ui = reduceState(state.ui, action);
   if (action.type === "set") {
-    return __spreadValues(__spreadValues({}, appData), action.appData);
+    return __spreadValues(__spreadValues({}, state), action.state);
   }
-  return { data, state };
+  return { data, ui };
 });
 
 // components/LayerTree/index.tsx
@@ -4527,19 +4532,19 @@ var areaContainsZones = (data, area) => {
 
 // lib/flush-zones.ts
 init_react_import();
-var flushZones = (appData) => {
-  const containsZones = typeof appData.data.zones !== "undefined";
+var flushZones = (appState) => {
+  const containsZones = typeof appState.data.zones !== "undefined";
   if (containsZones) {
-    Object.keys(appData.data.zones || {}).forEach((zone) => {
-      addToZoneCache(zone, appData.data.zones[zone]);
+    Object.keys(appState.data.zones || {}).forEach((zone) => {
+      addToZoneCache(zone, appState.data.zones[zone]);
     });
-    return __spreadProps(__spreadValues({}, appData), {
-      data: __spreadProps(__spreadValues({}, appData.data), {
+    return __spreadProps(__spreadValues({}, appState), {
+      data: __spreadProps(__spreadValues({}, appState.data), {
         zones: {}
       })
     });
   }
-  return appData;
+  return appState;
 };
 
 // components/Puck/index.tsx
@@ -4571,28 +4576,24 @@ function Puck({
 }) {
   var _a, _b;
   const [reducer] = (0, import_react32.useState)(() => createReducer({ config }));
-  const initialAppData = {
-    data: initialData,
-    state: {
-      leftSideBarVisible: true,
-      arrayState: {}
-    }
-  };
-  const [appData, dispatch] = (0, import_react32.useReducer)(
+  const initialAppState = __spreadProps(__spreadValues({}, defaultAppState), {
+    data: initialData
+  });
+  const [appState, dispatch] = (0, import_react32.useReducer)(
     reducer,
-    flushZones(initialAppData)
+    flushZones(initialAppState)
   );
-  const { data, state } = appData;
+  const { data, ui } = appState;
   const { canForward, canRewind, rewind, forward } = usePuckHistory({
-    appData,
+    appState,
     dispatch
   });
-  const { itemSelector, leftSideBarVisible } = state;
+  const { itemSelector, leftSideBarVisible } = ui;
   const setItemSelector = (0, import_react32.useCallback)(
     (newItemSelector) => {
       dispatch({
-        type: "setState",
-        state: { itemSelector: newItemSelector }
+        type: "setUi",
+        ui: { itemSelector: newItemSelector }
       });
     },
     []
@@ -4646,7 +4647,7 @@ function Puck({
   }, [data]);
   const { onDragStartOrUpdate, placeholderStyle } = usePlaceholderStyle();
   const [draggedItem, setDraggedItem] = (0, import_react32.useState)();
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "puck", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(AppProvider, { value: { appData, dispatch }, children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "puck", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(AppProvider, { value: { state: appState, dispatch }, children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
     import_react_beautiful_dnd5.DragDropContext,
     {
       onDragUpdate: (update) => {
@@ -4773,8 +4774,8 @@ function Puck({
                                   IconButton,
                                   {
                                     onClick: () => dispatch({
-                                      type: "setState",
-                                      state: {
+                                      type: "setUi",
+                                      ui: {
                                         leftSideBarVisible: !leftSideBarVisible
                                       }
                                     }),

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@measured/puck",
-  "version": "0.10.0-canary.6a9145c",
+  "version": "0.10.0-canary.8d47fd7",
   "private": false,
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",