@measured/puck 0.20.3-canary.d855fa8c → 0.21.0-canary.16a3eee1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.js CHANGED
@@ -153,6 +153,42 @@ var require_classnames = __commonJS({
153
153
  }
154
154
  });
155
155
 
156
+ // ../../node_modules/fast-deep-equal/index.js
157
+ var require_fast_deep_equal = __commonJS({
158
+ "../../node_modules/fast-deep-equal/index.js"(exports2, module2) {
159
+ "use strict";
160
+ init_react_import();
161
+ module2.exports = function equal(a, b) {
162
+ if (a === b) return true;
163
+ if (a && b && typeof a == "object" && typeof b == "object") {
164
+ if (a.constructor !== b.constructor) return false;
165
+ var length, i, keys;
166
+ if (Array.isArray(a)) {
167
+ length = a.length;
168
+ if (length != b.length) return false;
169
+ for (i = length; i-- !== 0; )
170
+ if (!equal(a[i], b[i])) return false;
171
+ return true;
172
+ }
173
+ if (a.constructor === RegExp) return a.source === b.source && a.flags === b.flags;
174
+ if (a.valueOf !== Object.prototype.valueOf) return a.valueOf() === b.valueOf();
175
+ if (a.toString !== Object.prototype.toString) return a.toString() === b.toString();
176
+ keys = Object.keys(a);
177
+ length = keys.length;
178
+ if (length !== Object.keys(b).length) return false;
179
+ for (i = length; i-- !== 0; )
180
+ if (!Object.prototype.hasOwnProperty.call(b, keys[i])) return false;
181
+ for (i = length; i-- !== 0; ) {
182
+ var key = keys[i];
183
+ if (!equal(a[key], b[key])) return false;
184
+ }
185
+ return true;
186
+ }
187
+ return a !== a && b !== b;
188
+ };
189
+ }
190
+ });
191
+
156
192
  // bundle/index.ts
157
193
  var bundle_exports = {};
158
194
  __export(bundle_exports, {
@@ -1661,7 +1697,9 @@ var keyCodeMap = {
1661
1697
  KeyW: "w",
1662
1698
  KeyX: "x",
1663
1699
  KeyY: "y",
1664
- KeyZ: "z"
1700
+ KeyZ: "z",
1701
+ Delete: "delete",
1702
+ Backspace: "backspace"
1665
1703
  };
1666
1704
  var useHotkeyStore = (0, import_zustand.create)()(
1667
1705
  (0, import_middleware.subscribeWithSelector)((set) => ({
@@ -1685,8 +1723,10 @@ var monitorHotkeys = (doc) => {
1685
1723
  ([key2, value]) => value === !!combo[key2]
1686
1724
  );
1687
1725
  if (conditionMet) {
1688
- e.preventDefault();
1689
- cb();
1726
+ const handled = cb(e);
1727
+ if (handled !== false) {
1728
+ e.preventDefault();
1729
+ }
1690
1730
  }
1691
1731
  });
1692
1732
  if (key !== "meta" && key !== "ctrl" && key !== "shift") {
@@ -1910,7 +1950,7 @@ var flattenData = (state, config) => {
1910
1950
  (content) => content,
1911
1951
  (item) => {
1912
1952
  data.push(item);
1913
- return null;
1953
+ return item;
1914
1954
  }
1915
1955
  );
1916
1956
  return data;
@@ -1918,13 +1958,13 @@ var flattenData = (state, config) => {
1918
1958
 
1919
1959
  // lib/get-changed.ts
1920
1960
  init_react_import();
1921
- var import_fast_deep_equal = __toESM(require("fast-deep-equal"));
1961
+ var import_fast_equals = require("fast-equals");
1922
1962
  var getChanged = (newItem, oldItem) => {
1923
1963
  return newItem ? Object.keys(newItem.props || {}).reduce((acc, item) => {
1924
1964
  const newItemProps = (newItem == null ? void 0 : newItem.props) || {};
1925
1965
  const oldItemProps = (oldItem == null ? void 0 : oldItem.props) || {};
1926
1966
  return __spreadProps(__spreadValues({}, acc), {
1927
- [item]: !(0, import_fast_deep_equal.default)(oldItemProps[item], newItemProps[item])
1967
+ [item]: !(0, import_fast_equals.deepEqual)(oldItemProps[item], newItemProps[item])
1928
1968
  });
1929
1969
  }, {}) : {};
1930
1970
  };
@@ -2079,6 +2119,7 @@ var useRegisterFieldsSlice = (appStore, id) => {
2079
2119
  (reset) => __async(void 0, null, function* () {
2080
2120
  var _a, _b;
2081
2121
  const { fields, lastResolvedData } = appStore.getState().fields;
2122
+ const metadata = appStore.getState().metadata;
2082
2123
  const nodes = appStore.getState().state.indexes.nodes;
2083
2124
  const node = nodes[id || "root"];
2084
2125
  const componentData = node == null ? void 0 : node.data;
@@ -2108,6 +2149,7 @@ var useRegisterFieldsSlice = (appStore, id) => {
2108
2149
  changed,
2109
2150
  fields: defaultFields2,
2110
2151
  lastFields,
2152
+ metadata: __spreadValues(__spreadValues({}, metadata), componentConfig.metadata),
2111
2153
  lastData,
2112
2154
  appState: makeStatePublic(state),
2113
2155
  parent
@@ -2143,7 +2185,7 @@ var useRegisterFieldsSlice = (appStore, id) => {
2143
2185
 
2144
2186
  // lib/resolve-component-data.ts
2145
2187
  init_react_import();
2146
- var import_fast_deep_equal2 = __toESM(require("fast-deep-equal"));
2188
+ var import_fast_equals2 = require("fast-equals");
2147
2189
  var cache = { lastChange: {} };
2148
2190
  var resolveComponentData = (_0, _1, ..._2) => __async(void 0, [_0, _1, ..._2], function* (item, config, metadata = {}, onResolveStart, onResolveEnd, trigger = "replace") {
2149
2191
  const configForItem = "type" in item && item.type !== "root" ? config.components[item.type] : config.root;
@@ -2152,7 +2194,7 @@ var resolveComponentData = (_0, _1, ..._2) => __async(void 0, [_0, _1, ..._2], f
2152
2194
  const id = "id" in item.props ? item.props.id : "root";
2153
2195
  if (shouldRunResolver) {
2154
2196
  const { item: oldItem = null, resolved = {} } = cache.lastChange[id] || {};
2155
- if (trigger !== "force" && item && (0, import_fast_deep_equal2.default)(item, oldItem)) {
2197
+ if (trigger !== "force" && item && (0, import_fast_equals2.deepEqual)(item, oldItem)) {
2156
2198
  return { node: resolved, didChange: false };
2157
2199
  }
2158
2200
  const changed = getChanged(item, oldItem);
@@ -2202,7 +2244,7 @@ var resolveComponentData = (_0, _1, ..._2) => __async(void 0, [_0, _1, ..._2], f
2202
2244
  };
2203
2245
  return {
2204
2246
  node: itemWithResolvedChildren,
2205
- didChange: !(0, import_fast_deep_equal2.default)(item, itemWithResolvedChildren)
2247
+ didChange: !(0, import_fast_equals2.deepEqual)(item, itemWithResolvedChildren)
2206
2248
  };
2207
2249
  });
2208
2250
 
@@ -7046,7 +7088,7 @@ Drawer.Item = DrawerItem;
7046
7088
 
7047
7089
  // components/Puck/index.tsx
7048
7090
  init_react_import();
7049
- var import_react59 = require("react");
7091
+ var import_react60 = require("react");
7050
7092
 
7051
7093
  // components/SidebarSection/index.tsx
7052
7094
  init_react_import();
@@ -8584,9 +8626,70 @@ var usePreviewModeHotkeys = () => {
8584
8626
  useHotkey({ ctrl: true, i: true }, toggleInteractive);
8585
8627
  };
8586
8628
 
8587
- // lib/use-puck.ts
8629
+ // lib/use-delete-hotkeys.ts
8588
8630
  init_react_import();
8589
8631
  var import_react55 = require("react");
8632
+ var isElementVisible = (element) => {
8633
+ let current = element;
8634
+ while (current && current !== document.body) {
8635
+ const style = window.getComputedStyle(current);
8636
+ if (style.display === "none" || style.visibility === "hidden" || style.opacity === "0" || current.getAttribute("aria-hidden") === "true" || current.hasAttribute("hidden")) {
8637
+ return false;
8638
+ }
8639
+ current = current.parentElement;
8640
+ }
8641
+ return true;
8642
+ };
8643
+ var shouldBlockDeleteHotkey = (e) => {
8644
+ var _a;
8645
+ if (e == null ? void 0 : e.defaultPrevented) return true;
8646
+ const origin = ((_a = e == null ? void 0 : e.composedPath) == null ? void 0 : _a.call(e)[0]) || (e == null ? void 0 : e.target) || document.activeElement;
8647
+ if (origin instanceof HTMLElement) {
8648
+ const tag = origin.tagName.toLowerCase();
8649
+ if (tag === "input" || tag === "textarea" || tag === "select") return true;
8650
+ if (origin.isContentEditable) return true;
8651
+ const role = origin.getAttribute("role");
8652
+ if (role === "textbox" || role === "combobox" || role === "searchbox" || role === "listbox" || role === "grid") {
8653
+ return true;
8654
+ }
8655
+ }
8656
+ const modal = document.querySelector(
8657
+ 'dialog[open], [aria-modal="true"], [role="dialog"], [role="alertdialog"]'
8658
+ );
8659
+ if (modal && isElementVisible(modal)) {
8660
+ return true;
8661
+ }
8662
+ return false;
8663
+ };
8664
+ var useDeleteHotkeys = () => {
8665
+ const appStore = useAppStoreApi();
8666
+ const deleteSelectedComponent = (0, import_react55.useCallback)(
8667
+ (e) => {
8668
+ var _a;
8669
+ if (shouldBlockDeleteHotkey(e)) {
8670
+ return false;
8671
+ }
8672
+ const { state, dispatch, permissions, selectedItem } = appStore.getState();
8673
+ const sel = (_a = state.ui) == null ? void 0 : _a.itemSelector;
8674
+ if (!(sel == null ? void 0 : sel.zone) || !selectedItem) return true;
8675
+ if (!permissions.getPermissions({ item: selectedItem }).delete)
8676
+ return true;
8677
+ dispatch({
8678
+ type: "remove",
8679
+ index: sel.index,
8680
+ zone: sel.zone
8681
+ });
8682
+ return true;
8683
+ },
8684
+ [appStore]
8685
+ );
8686
+ useHotkey({ delete: true }, deleteSelectedComponent);
8687
+ useHotkey({ backspace: true }, deleteSelectedComponent);
8688
+ };
8689
+
8690
+ // lib/use-puck.ts
8691
+ init_react_import();
8692
+ var import_react56 = require("react");
8590
8693
  var import_zustand6 = require("zustand");
8591
8694
  var generateUsePuck = (store) => {
8592
8695
  const history = {
@@ -8613,7 +8716,7 @@ var generateUsePuck = (store) => {
8613
8716
  };
8614
8717
  return storeData;
8615
8718
  };
8616
- var UsePuckStoreContext = (0, import_react55.createContext)(
8719
+ var UsePuckStoreContext = (0, import_react56.createContext)(
8617
8720
  null
8618
8721
  );
8619
8722
  var convertToPickedStore = (store) => {
@@ -8627,12 +8730,12 @@ var convertToPickedStore = (store) => {
8627
8730
  };
8628
8731
  };
8629
8732
  var useRegisterUsePuckStore = (appStore) => {
8630
- const [usePuckStore] = (0, import_react55.useState)(
8733
+ const [usePuckStore] = (0, import_react56.useState)(
8631
8734
  () => (0, import_zustand6.createStore)(
8632
8735
  () => generateUsePuck(convertToPickedStore(appStore.getState()))
8633
8736
  )
8634
8737
  );
8635
- (0, import_react55.useEffect)(() => {
8738
+ (0, import_react56.useEffect)(() => {
8636
8739
  return appStore.subscribe(
8637
8740
  (store) => convertToPickedStore(store),
8638
8741
  (pickedStore) => {
@@ -8644,7 +8747,7 @@ var useRegisterUsePuckStore = (appStore) => {
8644
8747
  };
8645
8748
  function createUsePuck() {
8646
8749
  return function usePuck2(selector) {
8647
- const usePuckApi = (0, import_react55.useContext)(UsePuckStoreContext);
8750
+ const usePuckApi = (0, import_react56.useContext)(UsePuckStoreContext);
8648
8751
  if (!usePuckApi) {
8649
8752
  throw new Error("usePuck must be used inside <Puck>.");
8650
8753
  }
@@ -8656,7 +8759,7 @@ function createUsePuck() {
8656
8759
  };
8657
8760
  }
8658
8761
  function usePuck() {
8659
- (0, import_react55.useEffect)(() => {
8762
+ (0, import_react56.useEffect)(() => {
8660
8763
  console.warn(
8661
8764
  "You're using the `usePuck` method without a selector, which may cause unnecessary re-renders. Replace with `createUsePuck` and provide a selector for improved performance."
8662
8765
  );
@@ -8664,7 +8767,7 @@ function usePuck() {
8664
8767
  return createUsePuck()((s) => s);
8665
8768
  }
8666
8769
  function useGetPuck() {
8667
- const usePuckApi = (0, import_react55.useContext)(UsePuckStoreContext);
8770
+ const usePuckApi = (0, import_react56.useContext)(UsePuckStoreContext);
8668
8771
  if (!usePuckApi) {
8669
8772
  throw new Error("usePuckGet must be used inside <Puck>.");
8670
8773
  }
@@ -8672,11 +8775,11 @@ function useGetPuck() {
8672
8775
  }
8673
8776
 
8674
8777
  // components/Puck/index.tsx
8675
- var import_fast_deep_equal3 = __toESM(require("fast-deep-equal"));
8778
+ var import_fast_deep_equal = __toESM(require_fast_deep_equal());
8676
8779
 
8677
8780
  // components/Puck/components/Header/index.tsx
8678
8781
  init_react_import();
8679
- var import_react56 = require("react");
8782
+ var import_react57 = require("react");
8680
8783
 
8681
8784
  // components/MenuBar/index.tsx
8682
8785
  init_react_import();
@@ -8758,7 +8861,7 @@ var HeaderInner = () => {
8758
8861
  } = usePropsContext();
8759
8862
  const dispatch = useAppStore((s) => s.dispatch);
8760
8863
  const appStore = useAppStoreApi();
8761
- const defaultHeaderRender = (0, import_react56.useMemo)(() => {
8864
+ const defaultHeaderRender = (0, import_react57.useMemo)(() => {
8762
8865
  if (renderHeader) {
8763
8866
  console.warn(
8764
8867
  "`renderHeader` is deprecated. Please use `overrides.header` and the `usePuck` hook instead"
@@ -8773,7 +8876,7 @@ var HeaderInner = () => {
8773
8876
  }
8774
8877
  return DefaultOverride;
8775
8878
  }, [renderHeader]);
8776
- const defaultHeaderActionsRender = (0, import_react56.useMemo)(() => {
8879
+ const defaultHeaderActionsRender = (0, import_react57.useMemo)(() => {
8777
8880
  if (renderHeaderActions) {
8778
8881
  console.warn(
8779
8882
  "`renderHeaderActions` is deprecated. Please use `overrides.headerActions` and the `usePuck` hook instead."
@@ -8793,7 +8896,7 @@ var HeaderInner = () => {
8793
8896
  const CustomHeaderActions = useAppStore(
8794
8897
  (s) => s.overrides.headerActions || defaultHeaderActionsRender
8795
8898
  );
8796
- const [menuOpen, setMenuOpen] = (0, import_react56.useState)(false);
8899
+ const [menuOpen, setMenuOpen] = (0, import_react57.useState)(false);
8797
8900
  const rootTitle = useAppStore((s) => {
8798
8901
  var _a, _b;
8799
8902
  const rootData = (_a = s.state.indexes.nodes["root"]) == null ? void 0 : _a.data;
@@ -8803,7 +8906,7 @@ var HeaderInner = () => {
8803
8906
  const rightSideBarVisible = useAppStore(
8804
8907
  (s) => s.state.ui.rightSideBarVisible
8805
8908
  );
8806
- const toggleSidebars = (0, import_react56.useCallback)(
8909
+ const toggleSidebars = (0, import_react57.useCallback)(
8807
8910
  (sidebar) => {
8808
8911
  const widerViewport = window.matchMedia("(min-width: 638px)").matches;
8809
8912
  const sideBarVisible = sidebar === "left" ? leftSideBarVisible : rightSideBarVisible;
@@ -8906,14 +9009,14 @@ var HeaderInner = () => {
8906
9009
  }
8907
9010
  );
8908
9011
  };
8909
- var Header = (0, import_react56.memo)(HeaderInner);
9012
+ var Header = (0, import_react57.memo)(HeaderInner);
8910
9013
 
8911
9014
  // components/Puck/components/Sidebar/index.tsx
8912
9015
  init_react_import();
8913
9016
 
8914
9017
  // components/Puck/components/ResizeHandle/index.tsx
8915
9018
  init_react_import();
8916
- var import_react57 = require("react");
9019
+ var import_react58 = require("react");
8917
9020
 
8918
9021
  // css-module:/home/runner/work/puck/puck/packages/core/components/Puck/components/ResizeHandle/styles.module.css#css-module
8919
9022
  init_react_import();
@@ -8930,11 +9033,11 @@ var ResizeHandle = ({
8930
9033
  }) => {
8931
9034
  const { frameRef } = useCanvasFrame();
8932
9035
  const resetAutoZoom = useResetAutoZoom(frameRef);
8933
- const handleRef = (0, import_react57.useRef)(null);
8934
- const isDragging = (0, import_react57.useRef)(false);
8935
- const startX = (0, import_react57.useRef)(0);
8936
- const startWidth = (0, import_react57.useRef)(0);
8937
- const handleMouseMove = (0, import_react57.useCallback)(
9036
+ const handleRef = (0, import_react58.useRef)(null);
9037
+ const isDragging = (0, import_react58.useRef)(false);
9038
+ const startX = (0, import_react58.useRef)(0);
9039
+ const startWidth = (0, import_react58.useRef)(0);
9040
+ const handleMouseMove = (0, import_react58.useCallback)(
8938
9041
  (e) => {
8939
9042
  if (!isDragging.current) return;
8940
9043
  const delta = e.clientX - startX.current;
@@ -8945,7 +9048,7 @@ var ResizeHandle = ({
8945
9048
  },
8946
9049
  [onResize, position]
8947
9050
  );
8948
- const handleMouseUp = (0, import_react57.useCallback)(() => {
9051
+ const handleMouseUp = (0, import_react58.useCallback)(() => {
8949
9052
  var _a;
8950
9053
  if (!isDragging.current) return;
8951
9054
  isDragging.current = false;
@@ -8961,7 +9064,7 @@ var ResizeHandle = ({
8961
9064
  onResizeEnd(finalWidth);
8962
9065
  resetAutoZoom();
8963
9066
  }, [onResizeEnd]);
8964
- const handleMouseDown = (0, import_react57.useCallback)(
9067
+ const handleMouseDown = (0, import_react58.useCallback)(
8965
9068
  (e) => {
8966
9069
  var _a;
8967
9070
  isDragging.current = true;
@@ -9021,14 +9124,14 @@ var Sidebar = ({
9021
9124
 
9022
9125
  // lib/use-sidebar-resize.ts
9023
9126
  init_react_import();
9024
- var import_react58 = require("react");
9127
+ var import_react59 = require("react");
9025
9128
  function useSidebarResize(position, dispatch) {
9026
- const [width, setWidth] = (0, import_react58.useState)(null);
9027
- const sidebarRef = (0, import_react58.useRef)(null);
9129
+ const [width, setWidth] = (0, import_react59.useState)(null);
9130
+ const sidebarRef = (0, import_react59.useRef)(null);
9028
9131
  const storeWidth = useAppStore(
9029
9132
  (s) => position === "left" ? s.state.ui.leftSideBarWidth : s.state.ui.rightSideBarWidth
9030
9133
  );
9031
- (0, import_react58.useEffect)(() => {
9134
+ (0, import_react59.useEffect)(() => {
9032
9135
  if (typeof window !== "undefined" && !storeWidth) {
9033
9136
  try {
9034
9137
  const savedWidths = localStorage.getItem("puck-sidebar-widths");
@@ -9053,12 +9156,12 @@ function useSidebarResize(position, dispatch) {
9053
9156
  }
9054
9157
  }
9055
9158
  }, [dispatch, position, storeWidth]);
9056
- (0, import_react58.useEffect)(() => {
9159
+ (0, import_react59.useEffect)(() => {
9057
9160
  if (storeWidth !== void 0) {
9058
9161
  setWidth(storeWidth);
9059
9162
  }
9060
9163
  }, [storeWidth]);
9061
- const handleResizeEnd = (0, import_react58.useCallback)(
9164
+ const handleResizeEnd = (0, import_react59.useCallback)(
9062
9165
  (width2) => {
9063
9166
  dispatch({
9064
9167
  type: "setUi",
@@ -9113,11 +9216,11 @@ var FieldSideBar = () => {
9113
9216
  );
9114
9217
  return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(SidebarSection, { noPadding: true, noBorderTop: true, showBreadcrumbs: true, title, children: /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(Fields, {}) });
9115
9218
  };
9116
- var propsContext = (0, import_react59.createContext)({});
9219
+ var propsContext = (0, import_react60.createContext)({});
9117
9220
  function PropsProvider(props) {
9118
9221
  return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(propsContext.Provider, { value: props, children: props.children });
9119
9222
  }
9120
- var usePropsContext = () => (0, import_react59.useContext)(propsContext);
9223
+ var usePropsContext = () => (0, import_react60.useContext)(propsContext);
9121
9224
  function PuckProvider({ children }) {
9122
9225
  const {
9123
9226
  config,
@@ -9134,14 +9237,14 @@ function PuckProvider({ children }) {
9134
9237
  onAction,
9135
9238
  fieldTransforms
9136
9239
  } = usePropsContext();
9137
- const iframe = (0, import_react59.useMemo)(
9240
+ const iframe = (0, import_react60.useMemo)(
9138
9241
  () => __spreadValues({
9139
9242
  enabled: true,
9140
9243
  waitForStyles: true
9141
9244
  }, _iframe),
9142
9245
  [_iframe]
9143
9246
  );
9144
- const [generatedAppState] = (0, import_react59.useState)(() => {
9247
+ const [generatedAppState] = (0, import_react60.useState)(() => {
9145
9248
  var _a, _b, _c, _d, _e, _f, _g, _h, _i;
9146
9249
  const initial = __spreadValues(__spreadValues({}, defaultAppState.ui), initialUi);
9147
9250
  let clientUiState = {};
@@ -9201,7 +9304,7 @@ function PuckProvider({ children }) {
9201
9304
  return walkAppState(newAppState, config);
9202
9305
  });
9203
9306
  const { appendData = true } = _initialHistory || {};
9204
- const [blendedHistories] = (0, import_react59.useState)(
9307
+ const [blendedHistories] = (0, import_react60.useState)(
9205
9308
  [
9206
9309
  ...(_initialHistory == null ? void 0 : _initialHistory.histories) || [],
9207
9310
  ...appendData ? [{ state: generatedAppState }] : []
@@ -9221,7 +9324,7 @@ function PuckProvider({ children }) {
9221
9324
  overrides,
9222
9325
  plugins
9223
9326
  });
9224
- const loadedFieldTransforms = (0, import_react59.useMemo)(() => {
9327
+ const loadedFieldTransforms = (0, import_react60.useMemo)(() => {
9225
9328
  const _plugins = plugins || [];
9226
9329
  const pluginFieldTransforms = _plugins.reduce(
9227
9330
  (acc, plugin) => __spreadValues(__spreadValues({}, acc), plugin.fieldTransforms),
@@ -9229,7 +9332,7 @@ function PuckProvider({ children }) {
9229
9332
  );
9230
9333
  return __spreadValues(__spreadValues({}, pluginFieldTransforms), fieldTransforms);
9231
9334
  }, [fieldTransforms, plugins]);
9232
- const generateAppStore = (0, import_react59.useCallback)(
9335
+ const generateAppStore = (0, import_react60.useCallback)(
9233
9336
  (state) => {
9234
9337
  return {
9235
9338
  state,
@@ -9255,15 +9358,15 @@ function PuckProvider({ children }) {
9255
9358
  loadedFieldTransforms
9256
9359
  ]
9257
9360
  );
9258
- const [appStore] = (0, import_react59.useState)(
9361
+ const [appStore] = (0, import_react60.useState)(
9259
9362
  () => createAppStore(generateAppStore(initialAppState))
9260
9363
  );
9261
- (0, import_react59.useEffect)(() => {
9364
+ (0, import_react60.useEffect)(() => {
9262
9365
  if (process.env.NODE_ENV !== "production") {
9263
9366
  window.__PUCK_INTERNAL_DO_NOT_USE = { appStore };
9264
9367
  }
9265
9368
  }, [appStore]);
9266
- (0, import_react59.useEffect)(() => {
9369
+ (0, import_react60.useEffect)(() => {
9267
9370
  const state = appStore.getState().state;
9268
9371
  appStore.setState(__spreadValues({}, generateAppStore(state)));
9269
9372
  }, [config, plugins, loadedOverrides, viewports, iframe, onAction, metadata]);
@@ -9272,13 +9375,13 @@ function PuckProvider({ children }) {
9272
9375
  index: initialHistoryIndex,
9273
9376
  initialAppState
9274
9377
  });
9275
- const previousData = (0, import_react59.useRef)(null);
9276
- (0, import_react59.useEffect)(() => {
9378
+ const previousData = (0, import_react60.useRef)(null);
9379
+ (0, import_react60.useEffect)(() => {
9277
9380
  appStore.subscribe(
9278
9381
  (s) => s.state.data,
9279
9382
  (data) => {
9280
9383
  if (onChange) {
9281
- if ((0, import_fast_deep_equal3.default)(data, previousData.current)) return;
9384
+ if ((0, import_fast_deep_equal.default)(data, previousData.current)) return;
9282
9385
  onChange(data);
9283
9386
  previousData.current = data;
9284
9387
  }
@@ -9287,7 +9390,7 @@ function PuckProvider({ children }) {
9287
9390
  }, []);
9288
9391
  useRegisterPermissionsSlice(appStore, permissions);
9289
9392
  const uPuckStore = useRegisterUsePuckStore(appStore);
9290
- (0, import_react59.useEffect)(() => {
9393
+ (0, import_react60.useEffect)(() => {
9291
9394
  const { resolveAndCommitData } = appStore.getState();
9292
9395
  resolveAndCommitData();
9293
9396
  }, []);
@@ -9299,7 +9402,7 @@ function PuckLayout({ children }) {
9299
9402
  dnd,
9300
9403
  initialHistory: _initialHistory
9301
9404
  } = usePropsContext();
9302
- const iframe = (0, import_react59.useMemo)(
9405
+ const iframe = (0, import_react60.useMemo)(
9303
9406
  () => __spreadValues({
9304
9407
  enabled: true,
9305
9408
  waitForStyles: true
@@ -9324,7 +9427,7 @@ function PuckLayout({ children }) {
9324
9427
  sidebarRef: rightSidebarRef,
9325
9428
  handleResizeEnd: handleRightSidebarResizeEnd
9326
9429
  } = useSidebarResize("right", dispatch);
9327
- (0, import_react59.useEffect)(() => {
9430
+ (0, import_react60.useEffect)(() => {
9328
9431
  if (!window.matchMedia("(min-width: 638px)").matches) {
9329
9432
  dispatch({
9330
9433
  type: "setUi",
@@ -9348,17 +9451,18 @@ function PuckLayout({ children }) {
9348
9451
  };
9349
9452
  }, []);
9350
9453
  const overrides = useAppStore((s) => s.overrides);
9351
- const CustomPuck = (0, import_react59.useMemo)(
9454
+ const CustomPuck = (0, import_react60.useMemo)(
9352
9455
  () => overrides.puck || DefaultOverride,
9353
9456
  [overrides]
9354
9457
  );
9355
- const [mounted, setMounted] = (0, import_react59.useState)(false);
9356
- (0, import_react59.useEffect)(() => {
9458
+ const [mounted, setMounted] = (0, import_react60.useState)(false);
9459
+ (0, import_react60.useEffect)(() => {
9357
9460
  setMounted(true);
9358
9461
  }, []);
9359
9462
  const ready = useAppStore((s) => s.status === "READY");
9360
9463
  useMonitorHotkeys();
9361
- (0, import_react59.useEffect)(() => {
9464
+ useDeleteHotkeys();
9465
+ (0, import_react60.useEffect)(() => {
9362
9466
  if (ready && iframe.enabled) {
9363
9467
  const frameDoc = getFrame();
9364
9468
  if (frameDoc) {
package/dist/index.mjs CHANGED
@@ -18,14 +18,14 @@ import {
18
18
  setDeep,
19
19
  useGetPuck,
20
20
  usePuck
21
- } from "./chunk-QIGVND56.mjs";
21
+ } from "./chunk-JZ2BPCUI.mjs";
22
22
  import {
23
23
  init_react_import,
24
24
  migrate,
25
25
  resolveAllData,
26
26
  transformProps,
27
27
  walkTree
28
- } from "./chunk-OOLYDXKW.mjs";
28
+ } from "./chunk-X7YZ3YE7.mjs";
29
29
 
30
30
  // bundle/index.ts
31
31
  init_react_import();
@@ -1,4 +1,4 @@
1
- export { a7 as Adaptor, A as AppState, a5 as ArrayField, B as ArrayState, ak as AsFieldProps, N as BaseData, $ as BaseField, f as ComponentConfig, a as ComponentData, Z as ComponentDataMap, X as ComponentDataOptionalId, C as Config, _ as Content, ab as CustomField, aa as CustomFieldRender, j as Data, ah as DefaultComponentProps, K as DefaultComponents, ae as DefaultRootFieldProps, ag as DefaultRootProps, af as DefaultRootRenderProps, o as Direction, p as DragAxis, a9 as ExternalField, a8 as ExternalFieldWithAdaptor, L as ExtractConfigParams, am as ExtractField, h as Field, i as FieldProps, y as FieldRenderFunctions, u as FieldTransformFn, s as FieldTransformFnParams, g as FieldTransforms, F as Fields, H as History, I as IframeConfig, l as InitialHistory, z as ItemWithId, Y as MappedItem, M as Metadata, a1 as NumberField, a6 as ObjectField, k as OnAction, x as OverrideKey, O as Overrides, P as Permissions, d as Plugin, b as PuckAction, G as PuckComponent, ad as PuckContext, a4 as RadioField, c as ResolveDataTrigger, J as RootConfig, T as RootData, R as RootDataWithProps, Q as RootDataWithoutProps, a3 as SelectField, S as Slot, E as SlotComponent, ac as SlotField, a0 as TextField, a2 as TextareaField, e as UiState, U as UserGenerics, q as Viewport, V as Viewports, al as WithChildren, ai as WithId, aj as WithPuckProps, W as WithSlotProps, m as migrate, v as overrideKeys, r as resolveAllData, t as transformProps, w as walkTree } from './walk-tree-JdJYB16L.mjs';
1
+ export { a7 as Adaptor, A as AppState, a5 as ArrayField, B as ArrayState, ak as AsFieldProps, N as BaseData, $ as BaseField, f as ComponentConfig, a as ComponentData, Z as ComponentDataMap, X as ComponentDataOptionalId, C as Config, _ as Content, ab as CustomField, aa as CustomFieldRender, j as Data, ah as DefaultComponentProps, K as DefaultComponents, ae as DefaultRootFieldProps, ag as DefaultRootProps, af as DefaultRootRenderProps, o as Direction, p as DragAxis, a9 as ExternalField, a8 as ExternalFieldWithAdaptor, L as ExtractConfigParams, am as ExtractField, h as Field, i as FieldProps, y as FieldRenderFunctions, u as FieldTransformFn, s as FieldTransformFnParams, g as FieldTransforms, F as Fields, H as History, I as IframeConfig, l as InitialHistory, z as ItemWithId, Y as MappedItem, M as Metadata, a1 as NumberField, a6 as ObjectField, k as OnAction, x as OverrideKey, O as Overrides, P as Permissions, d as Plugin, b as PuckAction, G as PuckComponent, ad as PuckContext, a4 as RadioField, c as ResolveDataTrigger, J as RootConfig, T as RootData, R as RootDataWithProps, Q as RootDataWithoutProps, a3 as SelectField, S as Slot, E as SlotComponent, ac as SlotField, a0 as TextField, a2 as TextareaField, e as UiState, U as UserGenerics, q as Viewport, V as Viewports, al as WithChildren, ai as WithId, aj as WithPuckProps, W as WithSlotProps, m as migrate, v as overrideKeys, r as resolveAllData, t as transformProps, w as walkTree } from './walk-tree-Ctf3FZQI.mjs';
2
2
  export { Action, ActionBar, AutoField, Button, Drawer, DropZone, FieldLabel, Group, IconButton, Label, Puck, PuckApi, Render, UsePuckData, createUsePuck, registerOverlayPortal, renderContext, setDeep, useGetPuck, usePuck } from './index.mjs';
3
3
  import 'react';
4
4
  import 'react/jsx-runtime';
@@ -1,4 +1,4 @@
1
- export { a7 as Adaptor, A as AppState, a5 as ArrayField, B as ArrayState, ak as AsFieldProps, N as BaseData, $ as BaseField, f as ComponentConfig, a as ComponentData, Z as ComponentDataMap, X as ComponentDataOptionalId, C as Config, _ as Content, ab as CustomField, aa as CustomFieldRender, j as Data, ah as DefaultComponentProps, K as DefaultComponents, ae as DefaultRootFieldProps, ag as DefaultRootProps, af as DefaultRootRenderProps, o as Direction, p as DragAxis, a9 as ExternalField, a8 as ExternalFieldWithAdaptor, L as ExtractConfigParams, am as ExtractField, h as Field, i as FieldProps, y as FieldRenderFunctions, u as FieldTransformFn, s as FieldTransformFnParams, g as FieldTransforms, F as Fields, H as History, I as IframeConfig, l as InitialHistory, z as ItemWithId, Y as MappedItem, M as Metadata, a1 as NumberField, a6 as ObjectField, k as OnAction, x as OverrideKey, O as Overrides, P as Permissions, d as Plugin, b as PuckAction, G as PuckComponent, ad as PuckContext, a4 as RadioField, c as ResolveDataTrigger, J as RootConfig, T as RootData, R as RootDataWithProps, Q as RootDataWithoutProps, a3 as SelectField, S as Slot, E as SlotComponent, ac as SlotField, a0 as TextField, a2 as TextareaField, e as UiState, U as UserGenerics, q as Viewport, V as Viewports, al as WithChildren, ai as WithId, aj as WithPuckProps, W as WithSlotProps, m as migrate, v as overrideKeys, r as resolveAllData, t as transformProps, w as walkTree } from './walk-tree-JdJYB16L.js';
1
+ export { a7 as Adaptor, A as AppState, a5 as ArrayField, B as ArrayState, ak as AsFieldProps, N as BaseData, $ as BaseField, f as ComponentConfig, a as ComponentData, Z as ComponentDataMap, X as ComponentDataOptionalId, C as Config, _ as Content, ab as CustomField, aa as CustomFieldRender, j as Data, ah as DefaultComponentProps, K as DefaultComponents, ae as DefaultRootFieldProps, ag as DefaultRootProps, af as DefaultRootRenderProps, o as Direction, p as DragAxis, a9 as ExternalField, a8 as ExternalFieldWithAdaptor, L as ExtractConfigParams, am as ExtractField, h as Field, i as FieldProps, y as FieldRenderFunctions, u as FieldTransformFn, s as FieldTransformFnParams, g as FieldTransforms, F as Fields, H as History, I as IframeConfig, l as InitialHistory, z as ItemWithId, Y as MappedItem, M as Metadata, a1 as NumberField, a6 as ObjectField, k as OnAction, x as OverrideKey, O as Overrides, P as Permissions, d as Plugin, b as PuckAction, G as PuckComponent, ad as PuckContext, a4 as RadioField, c as ResolveDataTrigger, J as RootConfig, T as RootData, R as RootDataWithProps, Q as RootDataWithoutProps, a3 as SelectField, S as Slot, E as SlotComponent, ac as SlotField, a0 as TextField, a2 as TextareaField, e as UiState, U as UserGenerics, q as Viewport, V as Viewports, al as WithChildren, ai as WithId, aj as WithPuckProps, W as WithSlotProps, m as migrate, v as overrideKeys, r as resolveAllData, t as transformProps, w as walkTree } from './walk-tree-Ctf3FZQI.js';
2
2
  export { Action, ActionBar, AutoField, Button, Drawer, DropZone, FieldLabel, Group, IconButton, Label, Puck, PuckApi, Render, UsePuckData, createUsePuck, registerOverlayPortal, renderContext, setDeep, useGetPuck, usePuck } from './index.js';
3
3
  import 'react';
4
4
  import 'react/jsx-runtime';