@payloadcms/next 3.0.0-beta.9 → 3.0.0-beta.91

package/dist/views/LivePreview/Context/context.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"context.d.ts","sourceRoot":"","sources":["../../../../src/views/LivePreview/Context/context.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAA;AACvD,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAA;AAC1D,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAIrC,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAA;AAC1D,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAA;AAEzD,MAAM,WAAW,sBAAsB;IACrC,UAAU,EAAE,OAAO,CAAA;IACnB,UAAU,EAAE,iBAAiB,CAAC,aAAa,CAAC,CAAC,MAAM,CAAC,CAAC,MAAM,CAAC,CAAA;IAC5D,WAAW,EAAE,iBAAiB,CAAC,aAAa,CAAC,CAAA;IAC7C,eAAe,CAAC,EAAE,UAAU,CAAC,OAAO,iBAAiB,CAAC,CAAA;IACtD,eAAe,EAAE,OAAO,CAAA;IACxB,SAAS,EAAE,KAAK,CAAC,SAAS,CAAC,iBAAiB,CAAC,CAAA;IAC7C,WAAW,EAAE,OAAO,CAAA;IACpB,kBAAkB,EAAE;QAClB,MAAM,EAAE,MAAM,CAAA;QACd,KAAK,EAAE,MAAM,CAAA;KACd,CAAA;IACD,eAAe,EAAE,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC,iBAAiB,CAAC,CAAA;IACrE,QAAQ,CAAC,EAAE,KAAK,CAAC,gBAAgB,CAAC,MAAM,GAAG,IAAI,CAAC,CAAA;IAChD,iBAAiB,EAAE,QAAQ,GAAG,OAAO,CAAA;IACrC,aAAa,EAAE,CAAC,UAAU,EAAE,OAAO,KAAK,IAAI,CAAA;IAC5C,aAAa,EAAE,CAAC,UAAU,EAAE,iBAAiB,CAAC,aAAa,CAAC,CAAC,MAAM,CAAC,CAAC,MAAM,CAAC,KAAK,IAAI,CAAA;IACrF,SAAS,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAA;IACnC,kBAAkB,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAA;IAC7C,qBAAqB,EAAE,CAAC,IAAI,EAAE;QAAE,MAAM,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAA;IACxE,oBAAoB,EAAE,CAAC,iBAAiB,EAAE,QAAQ,GAAG,OAAO,KAAK,IAAI,CAAA;IACrE,OAAO,EAAE,QAAQ,CAAC,iBAAiB,CAAC,CAAA;IACpC,kBAAkB,EAAE,CAAC,QAAQ,EAAE;QAAE,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAA;IAChE,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IACjC,OAAO,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAA;IAC/B,IAAI,EAAE;QACJ,MAAM,EAAE,MAAM,CAAA;QACd,KAAK,EAAE,MAAM,CAAA;KACd,CAAA;IACD,eAAe,EAAE;QACf,CAAC,EAAE,MAAM,CAAA;QACT,CAAC,EAAE,MAAM,CAAA;KACV,CAAA;IACD,GAAG,EAAE,MAAM,GAAG,SAAS,CAAA;IACvB,IAAI,EAAE,MAAM,CAAA;CACb;AAED,eAAO,MAAM,kBAAkB,iDAmC7B,CAAA;AAEF,eAAO,MAAM,qBAAqB,8BAAuC,CAAA"}
+{"version":3,"file":"context.d.ts","sourceRoot":"","sources":["../../../../src/views/LivePreview/Context/context.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAA;AAChD,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAA;AACvD,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AACrC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAI9B,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAA;AAC1D,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAA;AAEzD,MAAM,WAAW,sBAAsB;IACrC,UAAU,EAAE,OAAO,CAAA;IACnB,UAAU,EAAE,iBAAiB,CAAC,aAAa,CAAC,CAAC,MAAM,CAAC,CAAC,MAAM,CAAC,CAAA;IAC5D,WAAW,EAAE,iBAAiB,CAAC,aAAa,CAAC,CAAA;IAC7C,eAAe,CAAC,EAAE,UAAU,CAAC,OAAO,iBAAiB,CAAC,CAAA;IACtD,eAAe,EAAE,OAAO,CAAA;IACxB,SAAS,EAAE,KAAK,CAAC,SAAS,CAAC,iBAAiB,GAAG,IAAI,CAAC,CAAA;IACpD,WAAW,EAAE,OAAO,CAAA;IACpB,kBAAkB,EAAE;QAClB,MAAM,EAAE,MAAM,CAAA;QACd,KAAK,EAAE,MAAM,CAAA;KACd,CAAA;IACD,eAAe,EAAE,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC,iBAAiB,CAAC,CAAA;IACrE,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,MAAM,GAAG,IAAI,CAAC,CAAA;IACzC,iBAAiB,EAAE,QAAQ,GAAG,OAAO,CAAA;IACrC,aAAa,EAAE,CAAC,UAAU,EAAE,OAAO,KAAK,IAAI,CAAA;IAC5C,aAAa,EAAE,CAAC,UAAU,EAAE,iBAAiB,CAAC,aAAa,CAAC,CAAC,MAAM,CAAC,CAAC,MAAM,CAAC,KAAK,IAAI,CAAA;IACrF,SAAS,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAA;IACnC,kBAAkB,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAA;IAC7C,qBAAqB,EAAE,CAAC,IAAI,EAAE;QAAE,MAAM,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAA;IACxE,oBAAoB,EAAE,CAAC,iBAAiB,EAAE,QAAQ,GAAG,OAAO,KAAK,IAAI,CAAA;IACrE,OAAO,EAAE,QAAQ,CAAC,iBAAiB,CAAC,CAAA;IACpC,kBAAkB,EAAE,CAAC,QAAQ,EAAE;QAAE,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAA;IAChE,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IACjC,OAAO,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAA;IAC/B,IAAI,EAAE;QACJ,MAAM,EAAE,MAAM,CAAA;QACd,KAAK,EAAE,MAAM,CAAA;KACd,CAAA;IACD,eAAe,EAAE;QACf,CAAC,EAAE,MAAM,CAAA;QACT,CAAC,EAAE,MAAM,CAAA;KACV,CAAA;IACD,GAAG,EAAE,MAAM,GAAG,SAAS,CAAA;IACvB,IAAI,EAAE,MAAM,CAAA;CACb;AAED,eAAO,MAAM,kBAAkB,uCAmC7B,CAAA;AAEF,eAAO,MAAM,qBAAqB,8BAAuC,CAAA"}

package/dist/views/LivePreview/Context/context.js

@@ -1,40 +1,43 @@
+'use client';
+
 import { createContext, useContext } from 'react';
 export const LivePreviewContext = createContext({
-    appIsReady: false,
-    breakpoint: undefined,
-    breakpoints: undefined,
-    fieldSchemaJSON: undefined,
-    iframeHasLoaded: false,
-    iframeRef: undefined,
-    isPopupOpen: false,
-    measuredDeviceSize: {
-        height: 0,
-        width: 0
-    },
-    openPopupWindow: ()=>{},
-    popupRef: undefined,
-    previewWindowType: 'iframe',
-    setAppIsReady: ()=>{},
-    setBreakpoint: ()=>{},
-    setHeight: ()=>{},
-    setIframeHasLoaded: ()=>{},
-    setMeasuredDeviceSize: ()=>{},
-    setPreviewWindowType: ()=>{},
-    setSize: ()=>{},
-    setToolbarPosition: ()=>{},
-    setWidth: ()=>{},
-    setZoom: ()=>{},
-    size: {
-        height: 0,
-        width: 0
-    },
-    toolbarPosition: {
-        x: 0,
-        y: 0
-    },
-    url: undefined,
-    zoom: 1
+  appIsReady: false,
+  breakpoint: undefined,
+  breakpoints: undefined,
+  fieldSchemaJSON: undefined,
+  iframeHasLoaded: false,
+  iframeRef: undefined,
+  isPopupOpen: false,
+  measuredDeviceSize: {
+    height: 0,
+    width: 0
+  },
+  openPopupWindow: () => {},
+  popupRef: undefined,
+  previewWindowType: 'iframe',
+  setAppIsReady: () => {},
+  setBreakpoint: () => {},
+  setHeight: () => {},
+  setIframeHasLoaded: () => {},
+  setMeasuredDeviceSize: () => {},
+  setPreviewWindowType: () => {},
+  setSize: () => {},
+  setToolbarPosition: () => {},
+  setWidth: () => {},
+  setZoom: () => {},
+  size: {
+    height: 0,
+    width: 0
+  },
+  toolbarPosition: {
+    x: 0,
+    y: 0
+  },
+  url: undefined,
+  zoom: 1
 });
-export const useLivePreviewContext = ()=>useContext(LivePreviewContext);
-
+export const useLivePreviewContext = () => {
+  return useContext(LivePreviewContext);
+};
 //# sourceMappingURL=context.js.map

package/dist/views/LivePreview/Context/context.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/views/LivePreview/Context/context.ts"],"sourcesContent":["import type { LivePreviewConfig } from 'payload/config'\nimport type { fieldSchemaToJSON } from 'payload/utilities'\nimport type { Dispatch } from 'react'\n\nimport { createContext, useContext } from 'react'\n\nimport type { usePopupWindow } from '../usePopupWindow.js'\nimport type { SizeReducerAction } from './sizeReducer.js'\n\nexport interface LivePreviewContextType {\n  appIsReady: boolean\n  breakpoint: LivePreviewConfig['breakpoints'][number]['name']\n  breakpoints: LivePreviewConfig['breakpoints']\n  fieldSchemaJSON?: ReturnType<typeof fieldSchemaToJSON>\n  iframeHasLoaded: boolean\n  iframeRef: React.RefObject<HTMLIFrameElement>\n  isPopupOpen: boolean\n  measuredDeviceSize: {\n    height: number\n    width: number\n  }\n  openPopupWindow: ReturnType<typeof usePopupWindow>['openPopupWindow']\n  popupRef?: React.MutableRefObject<Window | null>\n  previewWindowType: 'iframe' | 'popup'\n  setAppIsReady: (appIsReady: boolean) => void\n  setBreakpoint: (breakpoint: LivePreviewConfig['breakpoints'][number]['name']) => void\n  setHeight: (height: number) => void\n  setIframeHasLoaded: (loaded: boolean) => void\n  setMeasuredDeviceSize: (size: { height: number; width: number }) => void\n  setPreviewWindowType: (previewWindowType: 'iframe' | 'popup') => void\n  setSize: Dispatch<SizeReducerAction>\n  setToolbarPosition: (position: { x: number; y: number }) => void\n  setWidth: (width: number) => void\n  setZoom: (zoom: number) => void\n  size: {\n    height: number\n    width: number\n  }\n  toolbarPosition: {\n    x: number\n    y: number\n  }\n  url: string | undefined\n  zoom: number\n}\n\nexport const LivePreviewContext = createContext<LivePreviewContextType>({\n  appIsReady: false,\n  breakpoint: undefined,\n  breakpoints: undefined,\n  fieldSchemaJSON: undefined,\n  iframeHasLoaded: false,\n  iframeRef: undefined,\n  isPopupOpen: false,\n  measuredDeviceSize: {\n    height: 0,\n    width: 0,\n  },\n  openPopupWindow: () => {},\n  popupRef: undefined,\n  previewWindowType: 'iframe',\n  setAppIsReady: () => {},\n  setBreakpoint: () => {},\n  setHeight: () => {},\n  setIframeHasLoaded: () => {},\n  setMeasuredDeviceSize: () => {},\n  setPreviewWindowType: () => {},\n  setSize: () => {},\n  setToolbarPosition: () => {},\n  setWidth: () => {},\n  setZoom: () => {},\n  size: {\n    height: 0,\n    width: 0,\n  },\n  toolbarPosition: {\n    x: 0,\n    y: 0,\n  },\n  url: undefined,\n  zoom: 1,\n})\n\nexport const useLivePreviewContext = () => useContext(LivePreviewContext)\n"],"names":["createContext","useContext","LivePreviewContext","appIsReady","breakpoint","undefined","breakpoints","fieldSchemaJSON","iframeHasLoaded","iframeRef","isPopupOpen","measuredDeviceSize","height","width","openPopupWindow","popupRef","previewWindowType","setAppIsReady","setBreakpoint","setHeight","setIframeHasLoaded","setMeasuredDeviceSize","setPreviewWindowType","setSize","setToolbarPosition","setWidth","setZoom","size","toolbarPosition","x","y","url","zoom","useLivePreviewContext"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAIA,SAASA,aAAa,EAAEC,UAAU,QAAQ,QAAO;AA0CjD,OAAO,MAAMC,qBAAqBF,cAAsC;IACtEG,YAAY;IACZC,YAAYC;IACZC,aAAaD;IACbE,iBAAiBF;IACjBG,iBAAiB;IACjBC,WAAWJ;IACXK,aAAa;IACbC,oBAAoB;QAClBC,QAAQ;QACRC,OAAO;IACT;IACAC,iBAAiB,KAAO;IACxBC,UAAUV;IACVW,mBAAmB;IACnBC,eAAe,KAAO;IACtBC,eAAe,KAAO;IACtBC,WAAW,KAAO;IAClBC,oBAAoB,KAAO;IAC3BC,uBAAuB,KAAO;IAC9BC,sBAAsB,KAAO;IAC7BC,SAAS,KAAO;IAChBC,oBAAoB,KAAO;IAC3BC,UAAU,KAAO;IACjBC,SAAS,KAAO;IAChBC,MAAM;QACJf,QAAQ;QACRC,OAAO;IACT;IACAe,iBAAiB;QACfC,GAAG;QACHC,GAAG;IACL;IACAC,KAAK1B;IACL2B,MAAM;AACR,GAAE;AAEF,OAAO,MAAMC,wBAAwB,IAAMhC,WAAWC,oBAAmB"}
+{"version":3,"file":"context.js","names":["createContext","useContext","LivePreviewContext","appIsReady","breakpoint","undefined","breakpoints","fieldSchemaJSON","iframeHasLoaded","iframeRef","isPopupOpen","measuredDeviceSize","height","width","openPopupWindow","popupRef","previewWindowType","setAppIsReady","setBreakpoint","setHeight","setIframeHasLoaded","setMeasuredDeviceSize","setPreviewWindowType","setSize","setToolbarPosition","setWidth","setZoom","size","toolbarPosition","x","y","url","zoom","useLivePreviewContext"],"sources":["../../../../src/views/LivePreview/Context/context.ts"],"sourcesContent":["'use client'\nimport type { LivePreviewConfig } from 'payload'\nimport type { fieldSchemaToJSON } from 'payload/shared'\nimport type { Dispatch } from 'react'\nimport type React from 'react'\n\nimport { createContext, useContext } from 'react'\n\nimport type { usePopupWindow } from '../usePopupWindow.js'\nimport type { SizeReducerAction } from './sizeReducer.js'\n\nexport interface LivePreviewContextType {\n  appIsReady: boolean\n  breakpoint: LivePreviewConfig['breakpoints'][number]['name']\n  breakpoints: LivePreviewConfig['breakpoints']\n  fieldSchemaJSON?: ReturnType<typeof fieldSchemaToJSON>\n  iframeHasLoaded: boolean\n  iframeRef: React.RefObject<HTMLIFrameElement | null>\n  isPopupOpen: boolean\n  measuredDeviceSize: {\n    height: number\n    width: number\n  }\n  openPopupWindow: ReturnType<typeof usePopupWindow>['openPopupWindow']\n  popupRef?: React.RefObject<Window | null>\n  previewWindowType: 'iframe' | 'popup'\n  setAppIsReady: (appIsReady: boolean) => void\n  setBreakpoint: (breakpoint: LivePreviewConfig['breakpoints'][number]['name']) => void\n  setHeight: (height: number) => void\n  setIframeHasLoaded: (loaded: boolean) => void\n  setMeasuredDeviceSize: (size: { height: number; width: number }) => void\n  setPreviewWindowType: (previewWindowType: 'iframe' | 'popup') => void\n  setSize: Dispatch<SizeReducerAction>\n  setToolbarPosition: (position: { x: number; y: number }) => void\n  setWidth: (width: number) => void\n  setZoom: (zoom: number) => void\n  size: {\n    height: number\n    width: number\n  }\n  toolbarPosition: {\n    x: number\n    y: number\n  }\n  url: string | undefined\n  zoom: number\n}\n\nexport const LivePreviewContext = createContext<LivePreviewContextType>({\n  appIsReady: false,\n  breakpoint: undefined,\n  breakpoints: undefined,\n  fieldSchemaJSON: undefined,\n  iframeHasLoaded: false,\n  iframeRef: undefined,\n  isPopupOpen: false,\n  measuredDeviceSize: {\n    height: 0,\n    width: 0,\n  },\n  openPopupWindow: () => {},\n  popupRef: undefined,\n  previewWindowType: 'iframe',\n  setAppIsReady: () => {},\n  setBreakpoint: () => {},\n  setHeight: () => {},\n  setIframeHasLoaded: () => {},\n  setMeasuredDeviceSize: () => {},\n  setPreviewWindowType: () => {},\n  setSize: () => {},\n  setToolbarPosition: () => {},\n  setWidth: () => {},\n  setZoom: () => {},\n  size: {\n    height: 0,\n    width: 0,\n  },\n  toolbarPosition: {\n    x: 0,\n    y: 0,\n  },\n  url: undefined,\n  zoom: 1,\n})\n\nexport const useLivePreviewContext = () => useContext(LivePreviewContext)\n"],"mappings":"AAAA;;AAMA,SAASA,aAAa,EAAEC,UAAU,QAAQ;AA0C1C,OAAO,MAAMC,kBAAA,GAAqBF,aAAA,CAAsC;EACtEG,UAAA,EAAY;EACZC,UAAA,EAAYC,SAAA;EACZC,WAAA,EAAaD,SAAA;EACbE,eAAA,EAAiBF,SAAA;EACjBG,eAAA,EAAiB;EACjBC,SAAA,EAAWJ,SAAA;EACXK,WAAA,EAAa;EACbC,kBAAA,EAAoB;IAClBC,MAAA,EAAQ;IACRC,KAAA,EAAO;EACT;EACAC,eAAA,EAAiBA,CAAA,MAAO;EACxBC,QAAA,EAAUV,SAAA;EACVW,iBAAA,EAAmB;EACnBC,aAAA,EAAeA,CAAA,MAAO;EACtBC,aAAA,EAAeA,CAAA,MAAO;EACtBC,SAAA,EAAWA,CAAA,MAAO;EAClBC,kBAAA,EAAoBA,CAAA,MAAO;EAC3BC,qBAAA,EAAuBA,CAAA,MAAO;EAC9BC,oBAAA,EAAsBA,CAAA,MAAO;EAC7BC,OAAA,EAASA,CAAA,MAAO;EAChBC,kBAAA,EAAoBA,CAAA,MAAO;EAC3BC,QAAA,EAAUA,CAAA,MAAO;EACjBC,OAAA,EAASA,CAAA,MAAO;EAChBC,IAAA,EAAM;IACJf,MAAA,EAAQ;IACRC,KAAA,EAAO;EACT;EACAe,eAAA,EAAiB;IACfC,CAAA,EAAG;IACHC,CAAA,EAAG;EACL;EACAC,GAAA,EAAK1B,SAAA;EACL2B,IAAA,EAAM;AACR;AAEA,OAAO,MAAMC,qBAAA,GAAwBA,CAAA;EAAA,OAAMhC,UAAA,CAAAC,kBAAW;AAAA","ignoreList":[]}

package/dist/views/LivePreview/Context/index.d.ts

@@ -1,5 +1,4 @@
-import type { LivePreviewConfig } from 'payload/config';
-import type { ClientFieldConfig } from 'payload/types';
+import type { ClientField, LivePreviewConfig } from 'payload';
 import React from 'react';
 import type { usePopupWindow } from '../usePopupWindow.js';
 export type LivePreviewProviderProps = {
@@ -10,10 +9,10 @@ export type LivePreviewProviderProps = {
         height: number;
         width: number;
     };
-    fieldSchema: ClientFieldConfig[];
+    fieldSchema: ClientField[];
     isPopupOpen?: boolean;
     openPopupWindow?: ReturnType<typeof usePopupWindow>['openPopupWindow'];
-    popupRef?: React.MutableRefObject<Window>;
+    popupRef?: React.RefObject<Window>;
     url?: string;
 };
 export declare const LivePreviewProvider: React.FC<LivePreviewProviderProps>;

package/dist/views/LivePreview/Context/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/views/LivePreview/Context/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAA;AACvD,OAAO,KAAK,EAAE,iBAAiB,EAAS,MAAM,eAAe,CAAA;AAI7D,OAAO,KAA2C,MAAM,OAAO,CAAA;AAE/D,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAA;AAM1D,MAAM,MAAM,wBAAwB,GAAG;IACrC,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,WAAW,CAAC,EAAE,iBAAiB,CAAC,aAAa,CAAC,CAAA;IAC9C,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,UAAU,CAAC,EAAE;QACX,MAAM,EAAE,MAAM,CAAA;QACd,KAAK,EAAE,MAAM,CAAA;KACd,CAAA;IACD,WAAW,EAAE,iBAAiB,EAAE,CAAA;IAChC,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,eAAe,CAAC,EAAE,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC,iBAAiB,CAAC,CAAA;IACtE,QAAQ,CAAC,EAAE,KAAK,CAAC,gBAAgB,CAAC,MAAM,CAAC,CAAA;IACzC,GAAG,CAAC,EAAE,MAAM,CAAA;CACb,CAAA;AAED,eAAO,MAAM,mBAAmB,EAAE,KAAK,CAAC,EAAE,CAAC,wBAAwB,CA0KlE,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/views/LivePreview/Context/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAA;AAI7D,OAAO,KAA2C,MAAM,OAAO,CAAA;AAE/D,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAA;AAM1D,MAAM,MAAM,wBAAwB,GAAG;IACrC,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,WAAW,CAAC,EAAE,iBAAiB,CAAC,aAAa,CAAC,CAAA;IAC9C,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,UAAU,CAAC,EAAE;QACX,MAAM,EAAE,MAAM,CAAA;QACd,KAAK,EAAE,MAAM,CAAA;KACd,CAAA;IACD,WAAW,EAAE,WAAW,EAAE,CAAA;IAC1B,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,eAAe,CAAC,EAAE,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC,iBAAiB,CAAC,CAAA;IACtE,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,MAAM,CAAC,CAAA;IAClC,GAAG,CAAC,EAAE,MAAM,CAAA;CACb,CAAA;AAED,eAAO,MAAM,mBAAmB,EAAE,KAAK,CAAC,EAAE,CAAC,wBAAwB,CA0KlE,CAAA"}

package/dist/views/LivePreview/Context/index.js

@@ -1,153 +1,148 @@
 'use client';
+
+import { jsx as _jsx } from "react/jsx-runtime";
 import { DndContext } from '@dnd-kit/core';
-import { fieldSchemaToJSON } from 'payload/utilities';
+import { fieldSchemaToJSON } from 'payload/shared';
 import React, { useCallback, useEffect, useState } from 'react';
 import { customCollisionDetection } from './collisionDetection.js';
 import { LivePreviewContext } from './context.js';
 import { sizeReducer } from './sizeReducer.js';
-export const LivePreviewProvider = ({ breakpoints, children, fieldSchema, isPopupOpen, openPopupWindow, popupRef, url })=>{
-    const [previewWindowType, setPreviewWindowType] = useState('iframe');
-    const [appIsReady, setAppIsReady] = useState(false);
-    const [listeningForMessages, setListeningForMessages] = useState(false);
-    const iframeRef = React.useRef(null);
-    const [iframeHasLoaded, setIframeHasLoaded] = useState(false);
-    const [zoom, setZoom] = useState(1);
-    const [position, setPosition] = useState({
-        x: 0,
-        y: 0
-    });
-    const [size, setSize] = React.useReducer(sizeReducer, {
-        height: 0,
-        width: 0
-    });
-    const [measuredDeviceSize, setMeasuredDeviceSize] = useState({
-        height: 0,
-        width: 0
+export const LivePreviewProvider = ({
+  breakpoints,
+  children,
+  fieldSchema,
+  isPopupOpen,
+  openPopupWindow,
+  popupRef,
+  url
+}) => {
+  const [previewWindowType, setPreviewWindowType] = useState('iframe');
+  const [appIsReady, setAppIsReady] = useState(false);
+  const [listeningForMessages, setListeningForMessages] = useState(false);
+  const iframeRef = React.useRef(null);
+  const [iframeHasLoaded, setIframeHasLoaded] = useState(false);
+  const [zoom, setZoom] = useState(1);
+  const [position, setPosition] = useState({
+    x: 0,
+    y: 0
+  });
+  const [size, setSize] = React.useReducer(sizeReducer, {
+    height: 0,
+    width: 0
+  });
+  const [measuredDeviceSize, setMeasuredDeviceSize] = useState({
+    height: 0,
+    width: 0
+  });
+  const [breakpoint, setBreakpoint] = React.useState('responsive');
+  const [fieldSchemaJSON] = useState(() => {
+    return fieldSchemaToJSON(fieldSchema);
+  });
+  // The toolbar needs to freely drag and drop around the page
+  const handleDragEnd = ev => {
+    // only update position if the toolbar is completely within the preview area
+    // otherwise reset it back to the previous position
+    // TODO: reset to the nearest edge of the preview area
+    if (ev.over && ev.over.id === 'live-preview-area') {
+      const newPos = {
+        x: position.x + ev.delta.x,
+        y: position.y + ev.delta.y
+      };
+      setPosition(newPos);
+    } else {
+      // reset
+    }
+  };
+  const setWidth = useCallback(width => {
+    setSize({
+      type: 'width',
+      value: width
     });
-    const [breakpoint, setBreakpoint] = React.useState('responsive');
-    const [fieldSchemaJSON] = useState(()=>{
-        return fieldSchemaToJSON(fieldSchema);
+  }, [setSize]);
+  const setHeight = useCallback(height => {
+    setSize({
+      type: 'height',
+      value: height
     });
-    // The toolbar needs to freely drag and drop around the page
-    const handleDragEnd = (ev)=>{
-        // only update position if the toolbar is completely within the preview area
-        // otherwise reset it back to the previous position
-        // TODO: reset to the nearest edge of the preview area
-        if (ev.over && ev.over.id === 'live-preview-area') {
-            const newPos = {
-                x: position.x + ev.delta.x,
-                y: position.y + ev.delta.y
-            };
-            setPosition(newPos);
-        } else {
-        // reset
-        }
-    };
-    const setWidth = useCallback((width)=>{
-        setSize({
-            type: 'width',
-            value: width
-        });
-    }, [
-        setSize
-    ]);
-    const setHeight = useCallback((height)=>{
-        setSize({
-            type: 'height',
-            value: height
-        });
-    }, [
-        setSize
-    ]);
-    // explicitly set new width and height when as new breakpoints are selected
-    // exclude `custom` breakpoint as it is handled by the `setWidth` and `setHeight` directly
-    useEffect(()=>{
-        const foundBreakpoint = breakpoints?.find((bp)=>bp.name === breakpoint);
-        if (foundBreakpoint && breakpoint !== 'responsive' && breakpoint !== 'custom' && typeof foundBreakpoint?.width === 'number' && typeof foundBreakpoint?.height === 'number') {
-            setSize({
-                type: 'reset',
-                value: {
-                    height: foundBreakpoint.height,
-                    width: foundBreakpoint.width
-                }
-            });
-        }
-    }, [
-        breakpoint,
-        breakpoints
-    ]);
-    // Receive the `ready` message from the popup window
-    // This indicates that the app is ready to receive `window.postMessage` events
-    // This is also the only cross-origin way of detecting when a popup window has loaded
-    // Unlike iframe elements which have an `onLoad` handler, there is no way to access `window.open` on popups
-    useEffect(()=>{
-        const handleMessage = (event)=>{
-            if (url?.startsWith(event.origin) && event.data && typeof event.data === 'object' && event.data.type === 'payload-live-preview') {
-                if (event.data.ready) {
-                    setAppIsReady(true);
-                }
-            }
-        };
-        window.addEventListener('message', handleMessage);
-        setListeningForMessages(true);
-        return ()=>{
-            window.removeEventListener('message', handleMessage);
-        };
-    }, [
-        url,
-        listeningForMessages
-    ]);
-    const handleWindowChange = useCallback((type)=>{
-        setAppIsReady(false);
-        setPreviewWindowType(type);
-        if (type === 'popup') openPopupWindow();
-    }, [
-        openPopupWindow
-    ]);
-    // when the user closes the popup window, switch back to the iframe
-    // the `usePopupWindow` reports the `isPopupOpen` state for us to use here
-    useEffect(()=>{
-        const newPreviewWindowType = isPopupOpen ? 'popup' : 'iframe';
-        if (newPreviewWindowType !== previewWindowType) {
-            handleWindowChange('iframe');
-        }
-    }, [
-        previewWindowType,
-        isPopupOpen,
-        handleWindowChange
-    ]);
-    return /*#__PURE__*/ React.createElement(LivePreviewContext.Provider, {
+  }, [setSize]);
+  // explicitly set new width and height when as new breakpoints are selected
+  // exclude `custom` breakpoint as it is handled by the `setWidth` and `setHeight` directly
+  useEffect(() => {
+    const foundBreakpoint = breakpoints?.find(bp => bp.name === breakpoint);
+    if (foundBreakpoint && breakpoint !== 'responsive' && breakpoint !== 'custom' && typeof foundBreakpoint?.width === 'number' && typeof foundBreakpoint?.height === 'number') {
+      setSize({
+        type: 'reset',
         value: {
-            appIsReady,
-            breakpoint,
-            breakpoints,
-            fieldSchemaJSON,
-            iframeHasLoaded,
-            iframeRef,
-            isPopupOpen,
-            measuredDeviceSize,
-            openPopupWindow,
-            popupRef,
-            previewWindowType,
-            setAppIsReady,
-            setBreakpoint,
-            setHeight,
-            setIframeHasLoaded,
-            setMeasuredDeviceSize,
-            setPreviewWindowType: handleWindowChange,
-            setSize,
-            setToolbarPosition: setPosition,
-            setWidth,
-            setZoom,
-            size,
-            toolbarPosition: position,
-            url,
-            zoom
+          height: foundBreakpoint.height,
+          width: foundBreakpoint.width
+        }
+      });
+    }
+  }, [breakpoint, breakpoints]);
+  // Receive the `ready` message from the popup window
+  // This indicates that the app is ready to receive `window.postMessage` events
+  // This is also the only cross-origin way of detecting when a popup window has loaded
+  // Unlike iframe elements which have an `onLoad` handler, there is no way to access `window.open` on popups
+  useEffect(() => {
+    const handleMessage = event => {
+      if (url?.startsWith(event.origin) && event.data && typeof event.data === 'object' && event.data.type === 'payload-live-preview') {
+        if (event.data.ready) {
+          setAppIsReady(true);
         }
-    }, /*#__PURE__*/ React.createElement(DndContext, {
-        collisionDetection: customCollisionDetection,
-        onDragEnd: handleDragEnd
-    }, listeningForMessages && children));
+      }
+    };
+    window.addEventListener('message', handleMessage);
+    setListeningForMessages(true);
+    return () => {
+      window.removeEventListener('message', handleMessage);
+    };
+  }, [url, listeningForMessages]);
+  const handleWindowChange = useCallback(type => {
+    setAppIsReady(false);
+    setPreviewWindowType(type);
+    if (type === 'popup') openPopupWindow();
+  }, [openPopupWindow]);
+  // when the user closes the popup window, switch back to the iframe
+  // the `usePopupWindow` reports the `isPopupOpen` state for us to use here
+  useEffect(() => {
+    const newPreviewWindowType = isPopupOpen ? 'popup' : 'iframe';
+    if (newPreviewWindowType !== previewWindowType) {
+      handleWindowChange('iframe');
+    }
+  }, [previewWindowType, isPopupOpen, handleWindowChange]);
+  return /*#__PURE__*/_jsx(LivePreviewContext.Provider, {
+    value: {
+      appIsReady,
+      breakpoint,
+      breakpoints,
+      fieldSchemaJSON,
+      iframeHasLoaded,
+      iframeRef,
+      isPopupOpen,
+      measuredDeviceSize,
+      openPopupWindow,
+      popupRef,
+      previewWindowType,
+      setAppIsReady,
+      setBreakpoint,
+      setHeight,
+      setIframeHasLoaded,
+      setMeasuredDeviceSize,
+      setPreviewWindowType: handleWindowChange,
+      setSize,
+      setToolbarPosition: setPosition,
+      setWidth,
+      setZoom,
+      size,
+      toolbarPosition: position,
+      url,
+      zoom
+    },
+    children: /*#__PURE__*/_jsx(DndContext, {
+      collisionDetection: customCollisionDetection,
+      onDragEnd: handleDragEnd,
+      children: listeningForMessages && children
+    })
+  });
 };
-
 //# sourceMappingURL=index.js.map

package/dist/views/LivePreview/Context/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/views/LivePreview/Context/index.tsx"],"sourcesContent":["'use client'\nimport type { LivePreviewConfig } from 'payload/config'\nimport type { ClientFieldConfig, Field } from 'payload/types'\n\nimport { DndContext } from '@dnd-kit/core'\nimport { fieldSchemaToJSON } from 'payload/utilities'\nimport React, { useCallback, useEffect, useState } from 'react'\n\nimport type { usePopupWindow } from '../usePopupWindow.js'\n\nimport { customCollisionDetection } from './collisionDetection.js'\nimport { LivePreviewContext } from './context.js'\nimport { sizeReducer } from './sizeReducer.js'\n\nexport type LivePreviewProviderProps = {\n  appIsReady?: boolean\n  breakpoints?: LivePreviewConfig['breakpoints']\n  children: React.ReactNode\n  deviceSize?: {\n    height: number\n    width: number\n  }\n  fieldSchema: ClientFieldConfig[]\n  isPopupOpen?: boolean\n  openPopupWindow?: ReturnType<typeof usePopupWindow>['openPopupWindow']\n  popupRef?: React.MutableRefObject<Window>\n  url?: string\n}\n\nexport const LivePreviewProvider: React.FC<LivePreviewProviderProps> = ({\n  breakpoints,\n  children,\n  fieldSchema,\n  isPopupOpen,\n  openPopupWindow,\n  popupRef,\n  url,\n}) => {\n  const [previewWindowType, setPreviewWindowType] = useState<'iframe' | 'popup'>('iframe')\n\n  const [appIsReady, setAppIsReady] = useState(false)\n  const [listeningForMessages, setListeningForMessages] = useState(false)\n\n  const iframeRef = React.useRef<HTMLIFrameElement>(null)\n\n  const [iframeHasLoaded, setIframeHasLoaded] = useState(false)\n\n  const [zoom, setZoom] = useState(1)\n\n  const [position, setPosition] = useState({ x: 0, y: 0 })\n\n  const [size, setSize] = React.useReducer(sizeReducer, { height: 0, width: 0 })\n\n  const [measuredDeviceSize, setMeasuredDeviceSize] = useState({\n    height: 0,\n    width: 0,\n  })\n\n  const [breakpoint, setBreakpoint] =\n    React.useState<LivePreviewConfig['breakpoints'][0]['name']>('responsive')\n\n  const [fieldSchemaJSON] = useState(() => {\n    return fieldSchemaToJSON(fieldSchema)\n  })\n\n  // The toolbar needs to freely drag and drop around the page\n  const handleDragEnd = (ev) => {\n    // only update position if the toolbar is completely within the preview area\n    // otherwise reset it back to the previous position\n    // TODO: reset to the nearest edge of the preview area\n    if (ev.over && ev.over.id === 'live-preview-area') {\n      const newPos = {\n        x: position.x + ev.delta.x,\n        y: position.y + ev.delta.y,\n      }\n\n      setPosition(newPos)\n    } else {\n      // reset\n    }\n  }\n\n  const setWidth = useCallback(\n    (width) => {\n      setSize({ type: 'width', value: width })\n    },\n    [setSize],\n  )\n\n  const setHeight = useCallback(\n    (height) => {\n      setSize({ type: 'height', value: height })\n    },\n    [setSize],\n  )\n\n  // explicitly set new width and height when as new breakpoints are selected\n  // exclude `custom` breakpoint as it is handled by the `setWidth` and `setHeight` directly\n  useEffect(() => {\n    const foundBreakpoint = breakpoints?.find((bp) => bp.name === breakpoint)\n\n    if (\n      foundBreakpoint &&\n      breakpoint !== 'responsive' &&\n      breakpoint !== 'custom' &&\n      typeof foundBreakpoint?.width === 'number' &&\n      typeof foundBreakpoint?.height === 'number'\n    ) {\n      setSize({\n        type: 'reset',\n        value: {\n          height: foundBreakpoint.height,\n          width: foundBreakpoint.width,\n        },\n      })\n    }\n  }, [breakpoint, breakpoints])\n\n  // Receive the `ready` message from the popup window\n  // This indicates that the app is ready to receive `window.postMessage` events\n  // This is also the only cross-origin way of detecting when a popup window has loaded\n  // Unlike iframe elements which have an `onLoad` handler, there is no way to access `window.open` on popups\n  useEffect(() => {\n    const handleMessage = (event: MessageEvent) => {\n      if (\n        url?.startsWith(event.origin) &&\n        event.data &&\n        typeof event.data === 'object' &&\n        event.data.type === 'payload-live-preview'\n      ) {\n        if (event.data.ready) {\n          setAppIsReady(true)\n        }\n      }\n    }\n\n    window.addEventListener('message', handleMessage)\n\n    setListeningForMessages(true)\n\n    return () => {\n      window.removeEventListener('message', handleMessage)\n    }\n  }, [url, listeningForMessages])\n\n  const handleWindowChange = useCallback(\n    (type: 'iframe' | 'popup') => {\n      setAppIsReady(false)\n      setPreviewWindowType(type)\n      if (type === 'popup') openPopupWindow()\n    },\n    [openPopupWindow],\n  )\n\n  // when the user closes the popup window, switch back to the iframe\n  // the `usePopupWindow` reports the `isPopupOpen` state for us to use here\n  useEffect(() => {\n    const newPreviewWindowType = isPopupOpen ? 'popup' : 'iframe'\n\n    if (newPreviewWindowType !== previewWindowType) {\n      handleWindowChange('iframe')\n    }\n  }, [previewWindowType, isPopupOpen, handleWindowChange])\n\n  return (\n    <LivePreviewContext.Provider\n      value={{\n        appIsReady,\n        breakpoint,\n        breakpoints,\n        fieldSchemaJSON,\n        iframeHasLoaded,\n        iframeRef,\n        isPopupOpen,\n        measuredDeviceSize,\n        openPopupWindow,\n        popupRef,\n        previewWindowType,\n        setAppIsReady,\n        setBreakpoint,\n        setHeight,\n        setIframeHasLoaded,\n        setMeasuredDeviceSize,\n        setPreviewWindowType: handleWindowChange,\n        setSize,\n        setToolbarPosition: setPosition,\n        setWidth,\n        setZoom,\n        size,\n        toolbarPosition: position,\n        url,\n        zoom,\n      }}\n    >\n      <DndContext collisionDetection={customCollisionDetection} onDragEnd={handleDragEnd}>\n        {listeningForMessages && children}\n      </DndContext>\n    </LivePreviewContext.Provider>\n  )\n}\n"],"names":["DndContext","fieldSchemaToJSON","React","useCallback","useEffect","useState","customCollisionDetection","LivePreviewContext","sizeReducer","LivePreviewProvider","breakpoints","children","fieldSchema","isPopupOpen","openPopupWindow","popupRef","url","previewWindowType","setPreviewWindowType","appIsReady","setAppIsReady","listeningForMessages","setListeningForMessages","iframeRef","useRef","iframeHasLoaded","setIframeHasLoaded","zoom","setZoom","position","setPosition","x","y","size","setSize","useReducer","height","width","measuredDeviceSize","setMeasuredDeviceSize","breakpoint","setBreakpoint","fieldSchemaJSON","handleDragEnd","ev","over","id","newPos","delta","setWidth","type","value","setHeight","foundBreakpoint","find","bp","name","handleMessage","event","startsWith","origin","data","ready","window","addEventListener","removeEventListener","handleWindowChange","newPreviewWindowType","Provider","setToolbarPosition","toolbarPosition","collisionDetection","onDragEnd"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
+{"version":3,"file":"index.js","names":["DndContext","fieldSchemaToJSON","React","useCallback","useEffect","useState","customCollisionDetection","LivePreviewContext","sizeReducer","LivePreviewProvider","breakpoints","children","fieldSchema","isPopupOpen","openPopupWindow","popupRef","url","previewWindowType","setPreviewWindowType","appIsReady","setAppIsReady","listeningForMessages","setListeningForMessages","iframeRef","useRef","iframeHasLoaded","setIframeHasLoaded","zoom","setZoom","position","setPosition","x","y","size","setSize","useReducer","height","width","measuredDeviceSize","setMeasuredDeviceSize","breakpoint","setBreakpoint","fieldSchemaJSON","handleDragEnd","ev","over","id","newPos","delta","setWidth","type","value","setHeight","foundBreakpoint","find","bp","name","handleMessage","event","startsWith","origin","data","ready","window","addEventListener","removeEventListener","handleWindowChange","newPreviewWindowType","_jsx","Provider","setToolbarPosition","toolbarPosition","collisionDetection","onDragEnd"],"sources":["../../../../src/views/LivePreview/Context/index.tsx"],"sourcesContent":["'use client'\nimport type { ClientField, LivePreviewConfig } from 'payload'\n\nimport { DndContext } from '@dnd-kit/core'\nimport { fieldSchemaToJSON } from 'payload/shared'\nimport React, { useCallback, useEffect, useState } from 'react'\n\nimport type { usePopupWindow } from '../usePopupWindow.js'\n\nimport { customCollisionDetection } from './collisionDetection.js'\nimport { LivePreviewContext } from './context.js'\nimport { sizeReducer } from './sizeReducer.js'\n\nexport type LivePreviewProviderProps = {\n  appIsReady?: boolean\n  breakpoints?: LivePreviewConfig['breakpoints']\n  children: React.ReactNode\n  deviceSize?: {\n    height: number\n    width: number\n  }\n  fieldSchema: ClientField[]\n  isPopupOpen?: boolean\n  openPopupWindow?: ReturnType<typeof usePopupWindow>['openPopupWindow']\n  popupRef?: React.RefObject<Window>\n  url?: string\n}\n\nexport const LivePreviewProvider: React.FC<LivePreviewProviderProps> = ({\n  breakpoints,\n  children,\n  fieldSchema,\n  isPopupOpen,\n  openPopupWindow,\n  popupRef,\n  url,\n}) => {\n  const [previewWindowType, setPreviewWindowType] = useState<'iframe' | 'popup'>('iframe')\n\n  const [appIsReady, setAppIsReady] = useState(false)\n  const [listeningForMessages, setListeningForMessages] = useState(false)\n\n  const iframeRef = React.useRef<HTMLIFrameElement>(null)\n\n  const [iframeHasLoaded, setIframeHasLoaded] = useState(false)\n\n  const [zoom, setZoom] = useState(1)\n\n  const [position, setPosition] = useState({ x: 0, y: 0 })\n\n  const [size, setSize] = React.useReducer(sizeReducer, { height: 0, width: 0 })\n\n  const [measuredDeviceSize, setMeasuredDeviceSize] = useState({\n    height: 0,\n    width: 0,\n  })\n\n  const [breakpoint, setBreakpoint] =\n    React.useState<LivePreviewConfig['breakpoints'][0]['name']>('responsive')\n\n  const [fieldSchemaJSON] = useState(() => {\n    return fieldSchemaToJSON(fieldSchema)\n  })\n\n  // The toolbar needs to freely drag and drop around the page\n  const handleDragEnd = (ev) => {\n    // only update position if the toolbar is completely within the preview area\n    // otherwise reset it back to the previous position\n    // TODO: reset to the nearest edge of the preview area\n    if (ev.over && ev.over.id === 'live-preview-area') {\n      const newPos = {\n        x: position.x + ev.delta.x,\n        y: position.y + ev.delta.y,\n      }\n\n      setPosition(newPos)\n    } else {\n      // reset\n    }\n  }\n\n  const setWidth = useCallback(\n    (width) => {\n      setSize({ type: 'width', value: width })\n    },\n    [setSize],\n  )\n\n  const setHeight = useCallback(\n    (height) => {\n      setSize({ type: 'height', value: height })\n    },\n    [setSize],\n  )\n\n  // explicitly set new width and height when as new breakpoints are selected\n  // exclude `custom` breakpoint as it is handled by the `setWidth` and `setHeight` directly\n  useEffect(() => {\n    const foundBreakpoint = breakpoints?.find((bp) => bp.name === breakpoint)\n\n    if (\n      foundBreakpoint &&\n      breakpoint !== 'responsive' &&\n      breakpoint !== 'custom' &&\n      typeof foundBreakpoint?.width === 'number' &&\n      typeof foundBreakpoint?.height === 'number'\n    ) {\n      setSize({\n        type: 'reset',\n        value: {\n          height: foundBreakpoint.height,\n          width: foundBreakpoint.width,\n        },\n      })\n    }\n  }, [breakpoint, breakpoints])\n\n  // Receive the `ready` message from the popup window\n  // This indicates that the app is ready to receive `window.postMessage` events\n  // This is also the only cross-origin way of detecting when a popup window has loaded\n  // Unlike iframe elements which have an `onLoad` handler, there is no way to access `window.open` on popups\n  useEffect(() => {\n    const handleMessage = (event: MessageEvent) => {\n      if (\n        url?.startsWith(event.origin) &&\n        event.data &&\n        typeof event.data === 'object' &&\n        event.data.type === 'payload-live-preview'\n      ) {\n        if (event.data.ready) {\n          setAppIsReady(true)\n        }\n      }\n    }\n\n    window.addEventListener('message', handleMessage)\n\n    setListeningForMessages(true)\n\n    return () => {\n      window.removeEventListener('message', handleMessage)\n    }\n  }, [url, listeningForMessages])\n\n  const handleWindowChange = useCallback(\n    (type: 'iframe' | 'popup') => {\n      setAppIsReady(false)\n      setPreviewWindowType(type)\n      if (type === 'popup') openPopupWindow()\n    },\n    [openPopupWindow],\n  )\n\n  // when the user closes the popup window, switch back to the iframe\n  // the `usePopupWindow` reports the `isPopupOpen` state for us to use here\n  useEffect(() => {\n    const newPreviewWindowType = isPopupOpen ? 'popup' : 'iframe'\n\n    if (newPreviewWindowType !== previewWindowType) {\n      handleWindowChange('iframe')\n    }\n  }, [previewWindowType, isPopupOpen, handleWindowChange])\n\n  return (\n    <LivePreviewContext.Provider\n      value={{\n        appIsReady,\n        breakpoint,\n        breakpoints,\n        fieldSchemaJSON,\n        iframeHasLoaded,\n        iframeRef,\n        isPopupOpen,\n        measuredDeviceSize,\n        openPopupWindow,\n        popupRef,\n        previewWindowType,\n        setAppIsReady,\n        setBreakpoint,\n        setHeight,\n        setIframeHasLoaded,\n        setMeasuredDeviceSize,\n        setPreviewWindowType: handleWindowChange,\n        setSize,\n        setToolbarPosition: setPosition,\n        setWidth,\n        setZoom,\n        size,\n        toolbarPosition: position,\n        url,\n        zoom,\n      }}\n    >\n      <DndContext collisionDetection={customCollisionDetection} onDragEnd={handleDragEnd}>\n        {listeningForMessages && children}\n      </DndContext>\n    </LivePreviewContext.Provider>\n  )\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/views/LivePreview/Context/sizeReducer.js

@@ -8,24 +8,23 @@
 //       return { ...state, ...(action?.value || {}) }
 //   }
 // },
-export const sizeReducer = (state, action)=>{
-    switch(action.type){
-        case 'width':
-            return {
-                ...state,
-                width: action.value
-            };
-        case 'height':
-            return {
-                ...state,
-                height: action.value
-            };
-        default:
-            return {
-                ...state,
-                ...action?.value || {}
-            };
-    }
+export const sizeReducer = (state, action) => {
+  switch (action.type) {
+    case 'width':
+      return {
+        ...state,
+        width: action.value
+      };
+    case 'height':
+      return {
+        ...state,
+        height: action.value
+      };
+    default:
+      return {
+        ...state,
+        ...(action?.value || {})
+      };
+  }
 };
-
 //# sourceMappingURL=sizeReducer.js.map

package/dist/views/LivePreview/Context/sizeReducer.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/views/LivePreview/Context/sizeReducer.ts"],"sourcesContent":["// export const sizeReducer: (state, action) => {\n//   switch (action.type) {\n//     case 'width':\n//       return { ...state, width: action.value }\n//     case 'height':\n//       return { ...state, height: action.value }\n//     default:\n//       return { ...state, ...(action?.value || {}) }\n//   }\n// },\n\ntype SizeReducerState = {\n  height: number\n  width: number\n}\n\nexport type SizeReducerAction =\n  | {\n      type: 'height' | 'width'\n      value: number\n    }\n  | {\n      type: 'reset'\n      value: {\n        height: number\n        width: number\n      }\n    }\n\nexport const sizeReducer = (state: SizeReducerState, action: SizeReducerAction) => {\n  switch (action.type) {\n    case 'width':\n      return { ...state, width: action.value }\n    case 'height':\n      return { ...state, height: action.value }\n    default:\n      return { ...state, ...(action?.value || {}) }\n  }\n}\n"],"names":["sizeReducer","state","action","type","width","value","height"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,iDAAiD;AACjD,2BAA2B;AAC3B,oBAAoB;AACpB,iDAAiD;AACjD,qBAAqB;AACrB,kDAAkD;AAClD,eAAe;AACf,sDAAsD;AACtD,MAAM;AACN,KAAK;AAoBL,OAAO,MAAMA,cAAc,CAACC,OAAyBC;IACnD,OAAQA,OAAOC,IAAI;QACjB,KAAK;YACH,OAAO;gBAAE,GAAGF,KAAK;gBAAEG,OAAOF,OAAOG,KAAK;YAAC;QACzC,KAAK;YACH,OAAO;gBAAE,GAAGJ,KAAK;gBAAEK,QAAQJ,OAAOG,KAAK;YAAC;QAC1C;YACE,OAAO;gBAAE,GAAGJ,KAAK;gBAAE,GAAIC,QAAQG,SAAS,CAAC,CAAC;YAAE;IAChD;AACF,EAAC"}
+{"version":3,"file":"sizeReducer.js","names":["sizeReducer","state","action","type","width","value","height"],"sources":["../../../../src/views/LivePreview/Context/sizeReducer.ts"],"sourcesContent":["// export const sizeReducer: (state, action) => {\n//   switch (action.type) {\n//     case 'width':\n//       return { ...state, width: action.value }\n//     case 'height':\n//       return { ...state, height: action.value }\n//     default:\n//       return { ...state, ...(action?.value || {}) }\n//   }\n// },\n\ntype SizeReducerState = {\n  height: number\n  width: number\n}\n\nexport type SizeReducerAction =\n  | {\n      type: 'height' | 'width'\n      value: number\n    }\n  | {\n      type: 'reset'\n      value: {\n        height: number\n        width: number\n      }\n    }\n\nexport const sizeReducer = (state: SizeReducerState, action: SizeReducerAction) => {\n  switch (action.type) {\n    case 'width':\n      return { ...state, width: action.value }\n    case 'height':\n      return { ...state, height: action.value }\n    default:\n      return { ...state, ...(action?.value || {}) }\n  }\n}\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAoBA,OAAO,MAAMA,WAAA,GAAcA,CAACC,KAAA,EAAyBC,MAAA;EACnD,QAAQA,MAAA,CAAOC,IAAI;IACjB,KAAK;MACH,OAAO;QAAE,GAAGF,KAAK;QAAEG,KAAA,EAAOF,MAAA,CAAOG;MAAM;IACzC,KAAK;MACH,OAAO;QAAE,GAAGJ,KAAK;QAAEK,MAAA,EAAQJ,MAAA,CAAOG;MAAM;IAC1C;MACE,OAAO;QAAE,GAAGJ,KAAK;QAAE,IAAIC,MAAA,EAAQG,KAAA,IAAS,CAAC,CAAC;MAAE;EAChD;AACF","ignoreList":[]}

package/dist/views/LivePreview/Device/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/views/LivePreview/Device/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAoB,MAAM,OAAO,CAAA;AAIxC,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC;IACrC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAC1B,CA2DA,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/views/LivePreview/Device/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAoB,MAAM,OAAO,CAAA;AAIxC,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC;IACrC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAC1B,CA4FA,CAAA"}