@payloadcms/ui 3.80.0-internal-debug.4c84b90 → 3.80.0-internal.0311fce

package/dist/providers/LivePreview/collisionDetection.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/providers/LivePreview/collisionDetection.ts"],"sourcesContent":["import type { CollisionDetection } from '@dnd-kit/core'\n\nimport { rectIntersection } from '@dnd-kit/core'\n\n// If the toolbar exits the preview area, we need to reset its position\n// This will prevent the toolbar from getting stuck outside the preview area\nexport const customCollisionDetection: CollisionDetection = ({\n  collisionRect,\n  droppableContainers,\n  ...args\n}) => {\n  const droppableContainer = droppableContainers.find(({ id }) => id === 'live-preview-area')\n\n  const rectIntersectionCollisions = rectIntersection({\n    ...args,\n    collisionRect,\n    droppableContainers: [droppableContainer],\n  })\n\n  // Collision detection algorithms return an array of collisions\n  if (rectIntersectionCollisions.length === 0) {\n    // The preview area is not intersecting, return early\n    return rectIntersectionCollisions\n  }\n\n  // Compute whether the draggable element is completely contained within the preview area\n  const previewAreaRect = droppableContainer?.rect?.current\n\n  const isContained =\n    collisionRect.top >= previewAreaRect.top &&\n    collisionRect.left >= previewAreaRect.left &&\n    collisionRect.bottom <= previewAreaRect.bottom &&\n    collisionRect.right <= previewAreaRect.right\n\n  if (isContained) {\n    return rectIntersectionCollisions\n  }\n}\n"],"names":["rectIntersection","customCollisionDetection","collisionRect","droppableContainers","args","droppableContainer","find","id","rectIntersectionCollisions","length","previewAreaRect","rect","current","isContained","top","left","bottom","right"],"mappings":"AAEA,SAASA,gBAAgB,QAAQ,gBAAe;AAEhD,uEAAuE;AACvE,4EAA4E;AAC5E,OAAO,MAAMC,2BAA+C,CAAC,EAC3DC,aAAa,EACbC,mBAAmB,EACnB,GAAGC,MACJ;IACC,MAAMC,qBAAqBF,oBAAoBG,IAAI,CAAC,CAAC,EAAEC,EAAE,EAAE,GAAKA,OAAO;IAEvE,MAAMC,6BAA6BR,iBAAiB;QAClD,GAAGI,IAAI;QACPF;QACAC,qBAAqB;YAACE;SAAmB;IAC3C;IAEA,+DAA+D;IAC/D,IAAIG,2BAA2BC,MAAM,KAAK,GAAG;QAC3C,qDAAqD;QACrD,OAAOD;IACT;IAEA,wFAAwF;IACxF,MAAME,kBAAkBL,oBAAoBM,MAAMC;IAElD,MAAMC,cACJX,cAAcY,GAAG,IAAIJ,gBAAgBI,GAAG,IACxCZ,cAAca,IAAI,IAAIL,gBAAgBK,IAAI,IAC1Cb,cAAcc,MAAM,IAAIN,gBAAgBM,MAAM,IAC9Cd,cAAce,KAAK,IAAIP,gBAAgBO,KAAK;IAE9C,IAAIJ,aAAa;QACf,OAAOL;IACT;AACF,EAAC"}
+{"version":3,"file":"collisionDetection.js","names":["rectIntersection","customCollisionDetection","collisionRect","droppableContainers","args","droppableContainer","find","id","rectIntersectionCollisions","length","previewAreaRect","rect","current","isContained","top","left","bottom","right"],"sources":["../../../src/providers/LivePreview/collisionDetection.ts"],"sourcesContent":["import type { CollisionDetection } from '@dnd-kit/core'\n\nimport { rectIntersection } from '@dnd-kit/core'\n\n// If the toolbar exits the preview area, we need to reset its position\n// This will prevent the toolbar from getting stuck outside the preview area\nexport const customCollisionDetection: CollisionDetection = ({\n  collisionRect,\n  droppableContainers,\n  ...args\n}) => {\n  const droppableContainer = droppableContainers.find(({ id }) => id === 'live-preview-area')\n\n  const rectIntersectionCollisions = rectIntersection({\n    ...args,\n    collisionRect,\n    droppableContainers: [droppableContainer],\n  })\n\n  // Collision detection algorithms return an array of collisions\n  if (rectIntersectionCollisions.length === 0) {\n    // The preview area is not intersecting, return early\n    return rectIntersectionCollisions\n  }\n\n  // Compute whether the draggable element is completely contained within the preview area\n  const previewAreaRect = droppableContainer?.rect?.current\n\n  const isContained =\n    collisionRect.top >= previewAreaRect.top &&\n    collisionRect.left >= previewAreaRect.left &&\n    collisionRect.bottom <= previewAreaRect.bottom &&\n    collisionRect.right <= previewAreaRect.right\n\n  if (isContained) {\n    return rectIntersectionCollisions\n  }\n}\n"],"mappings":"AAEA,SAASA,gBAAgB,QAAQ;AAEjC;AACA;AACA,OAAO,MAAMC,wBAAA,GAA+CA,CAAC;EAC3DC,aAAa;EACbC,mBAAmB;EACnB,GAAGC;AAAA,CACJ;EACC,MAAMC,kBAAA,GAAqBF,mBAAA,CAAoBG,IAAI,CAAC,CAAC;IAAEC;EAAE,CAAE,KAAKA,EAAA,KAAO;EAEvE,MAAMC,0BAAA,GAA6BR,gBAAA,CAAiB;IAClD,GAAGI,IAAI;IACPF,aAAA;IACAC,mBAAA,EAAqB,CAACE,kBAAA;EACxB;EAEA;EACA,IAAIG,0BAAA,CAA2BC,MAAM,KAAK,GAAG;IAC3C;IACA,OAAOD,0BAAA;EACT;EAEA;EACA,MAAME,eAAA,GAAkBL,kBAAA,EAAoBM,IAAA,EAAMC,OAAA;EAElD,MAAMC,WAAA,GACJX,aAAA,CAAcY,GAAG,IAAIJ,eAAA,CAAgBI,GAAG,IACxCZ,aAAA,CAAca,IAAI,IAAIL,eAAA,CAAgBK,IAAI,IAC1Cb,aAAA,CAAcc,MAAM,IAAIN,eAAA,CAAgBM,MAAM,IAC9Cd,aAAA,CAAce,KAAK,IAAIP,eAAA,CAAgBO,KAAK;EAE9C,IAAIJ,WAAA,EAAa;IACf,OAAOL,0BAAA;EACT;AACF","ignoreList":[]}

package/dist/providers/LivePreview/context.js

@@ -1,67 +1,62 @@
 'use client';
+
 import { createContext, use } from 'react';
-/**
-   * The URL that has finished loading in the iframe or popup.
-   * For example, if you set the `url`, it will begin to load into the iframe,
-   * but `loadedURL` will not be set until the iframe's `onLoad` event fires.
-   */ /**
-   * Sets the URL of the preview (either iframe or popup).
-   * Will trigger a reload of the window.
-   */ /**
-   * The live preview url property can be either a string or a function that returns a string.
-   * It is important to know which one it is, so that we can opt in/out of certain behaviors, e.g. calling the server to get the URL.
-   */ export const LivePreviewContext = createContext({
-    appIsReady: false,
-    breakpoint: undefined,
-    breakpoints: undefined,
-    iframeRef: undefined,
-    isLivePreviewEnabled: undefined,
-    isLivePreviewing: false,
-    isPopupOpen: false,
-    isPreviewEnabled: undefined,
-    measuredDeviceSize: {
-        height: 0,
-        width: 0
-    },
-    openPopupWindow: ()=>{},
-    popupRef: undefined,
-    previewURL: undefined,
-    previewWindowType: 'iframe',
-    setAppIsReady: ()=>{},
-    setBreakpoint: ()=>{},
-    setHeight: ()=>{},
-    setIsLivePreviewing: ()=>{},
-    setLoadedURL: ()=>{},
-    setMeasuredDeviceSize: ()=>{},
-    setPreviewURL: ()=>{},
-    setPreviewWindowType: ()=>{},
-    setSize: ()=>{},
-    setToolbarPosition: ()=>{},
-    setURL: ()=>{},
-    setWidth: ()=>{},
-    setZoom: ()=>{},
-    size: {
-        height: 0,
-        width: 0
-    },
-    toolbarPosition: {
-        x: 0,
-        y: 0
-    },
-    typeofLivePreviewURL: undefined,
-    url: undefined,
-    zoom: 1
+export const LivePreviewContext = createContext({
+  appIsReady: false,
+  breakpoint: undefined,
+  breakpoints: undefined,
+  iframeRef: undefined,
+  isLivePreviewEnabled: undefined,
+  isLivePreviewing: false,
+  isPopupOpen: false,
+  isPreviewEnabled: undefined,
+  measuredDeviceSize: {
+    height: 0,
+    width: 0
+  },
+  openPopupWindow: () => {},
+  popupRef: undefined,
+  previewURL: undefined,
+  previewWindowType: 'iframe',
+  setAppIsReady: () => {},
+  setBreakpoint: () => {},
+  setHeight: () => {},
+  setIsLivePreviewing: () => {},
+  setLoadedURL: () => {},
+  setMeasuredDeviceSize: () => {},
+  setPreviewURL: () => {},
+  setPreviewWindowType: () => {},
+  setSize: () => {},
+  setToolbarPosition: () => {},
+  setURL: () => {},
+  setWidth: () => {},
+  setZoom: () => {},
+  size: {
+    height: 0,
+    width: 0
+  },
+  toolbarPosition: {
+    x: 0,
+    y: 0
+  },
+  typeofLivePreviewURL: undefined,
+  url: undefined,
+  zoom: 1
 });
-export const useLivePreviewContext = ()=>use(LivePreviewContext);
+export const useLivePreviewContext = () => use(LivePreviewContext);
 /**
  * Hook to access live preview context values. Separated to prevent breaking changes. In the future this hook can be removed in favour of just using the LivePreview one.
- */ export const usePreviewURL = ()=>{
-    const { isPreviewEnabled, previewURL, setPreviewURL } = use(LivePreviewContext);
-    return {
-        isPreviewEnabled,
-        previewURL,
-        setPreviewURL
-    };
+ */
+export const usePreviewURL = () => {
+  const {
+    isPreviewEnabled,
+    previewURL,
+    setPreviewURL
+  } = use(LivePreviewContext);
+  return {
+    isPreviewEnabled,
+    previewURL,
+    setPreviewURL
+  };
 };
-
 //# sourceMappingURL=context.js.map

package/dist/providers/LivePreview/context.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/providers/LivePreview/context.ts"],"sourcesContent":["'use client'\nimport type { LivePreviewConfig, LivePreviewURLType } from 'payload'\nimport type { Dispatch } from 'react'\nimport type React from 'react'\n\nimport { createContext, use } from 'react'\n\nimport type { usePopupWindow } from '../../hooks/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  iframeRef: React.RefObject<HTMLIFrameElement | null>\n  isLivePreviewEnabled: boolean\n  isLivePreviewing: boolean\n  isPopupOpen: boolean\n  isPreviewEnabled: boolean\n  listeningForMessages?: boolean\n  /**\n   * The URL that has finished loading in the iframe or popup.\n   * For example, if you set the `url`, it will begin to load into the iframe,\n   * but `loadedURL` will not be set until the iframe's `onLoad` event fires.\n   */\n  loadedURL?: string\n  measuredDeviceSize: {\n    height: number\n    width: number\n  }\n  openPopupWindow: ReturnType<typeof usePopupWindow>['openPopupWindow']\n  popupRef?: React.RefObject<null | Window>\n  previewURL?: string\n  previewWindowType: 'iframe' | 'popup'\n  setAppIsReady: (appIsReady: boolean) => void\n  setBreakpoint: (breakpoint: LivePreviewConfig['breakpoints'][number]['name']) => void\n  setHeight: (height: number) => void\n  setIsLivePreviewing: (isLivePreviewing: boolean) => void\n  setLoadedURL: (loadedURL: string) => void\n  setMeasuredDeviceSize: (size: { height: number; width: number }) => void\n  setPreviewURL: (url: string) => void\n  setPreviewWindowType: (previewWindowType: 'iframe' | 'popup') => void\n  setSize: Dispatch<SizeReducerAction>\n  setToolbarPosition: (position: { x: number; y: number }) => void\n\n  /**\n   * Sets the URL of the preview (either iframe or popup).\n   * Will trigger a reload of the window.\n   */\n  setURL: (url: string) => 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  /**\n   * The live preview url property can be either a string or a function that returns a string.\n   * It is important to know which one it is, so that we can opt in/out of certain behaviors, e.g. calling the server to get the URL.\n   */\n  typeofLivePreviewURL?: 'function' | 'string'\n  url: LivePreviewURLType\n  zoom: number\n}\n\nexport const LivePreviewContext = createContext<LivePreviewContextType>({\n  appIsReady: false,\n  breakpoint: undefined,\n  breakpoints: undefined,\n  iframeRef: undefined,\n  isLivePreviewEnabled: undefined,\n  isLivePreviewing: false,\n  isPopupOpen: false,\n  isPreviewEnabled: undefined,\n  measuredDeviceSize: {\n    height: 0,\n    width: 0,\n  },\n  openPopupWindow: () => {},\n  popupRef: undefined,\n  previewURL: undefined,\n  previewWindowType: 'iframe',\n  setAppIsReady: () => {},\n  setBreakpoint: () => {},\n  setHeight: () => {},\n  setIsLivePreviewing: () => {},\n  setLoadedURL: () => {},\n  setMeasuredDeviceSize: () => {},\n  setPreviewURL: () => {},\n  setPreviewWindowType: () => {},\n  setSize: () => {},\n  setToolbarPosition: () => {},\n  setURL: () => {},\n  setWidth: () => {},\n  setZoom: () => {},\n  size: {\n    height: 0,\n    width: 0,\n  },\n  toolbarPosition: {\n    x: 0,\n    y: 0,\n  },\n  typeofLivePreviewURL: undefined,\n  url: undefined,\n  zoom: 1,\n})\n\nexport const useLivePreviewContext = () => use(LivePreviewContext)\n\n/**\n * Hook to access live preview context values. Separated to prevent breaking changes. In the future this hook can be removed in favour of just using the LivePreview one.\n */\nexport const usePreviewURL = () => {\n  const { isPreviewEnabled, previewURL, setPreviewURL } = use(LivePreviewContext)\n\n  return { isPreviewEnabled, previewURL, setPreviewURL }\n}\n"],"names":["createContext","use","LivePreviewContext","appIsReady","breakpoint","undefined","breakpoints","iframeRef","isLivePreviewEnabled","isLivePreviewing","isPopupOpen","isPreviewEnabled","measuredDeviceSize","height","width","openPopupWindow","popupRef","previewURL","previewWindowType","setAppIsReady","setBreakpoint","setHeight","setIsLivePreviewing","setLoadedURL","setMeasuredDeviceSize","setPreviewURL","setPreviewWindowType","setSize","setToolbarPosition","setURL","setWidth","setZoom","size","toolbarPosition","x","y","typeofLivePreviewURL","url","zoom","useLivePreviewContext","usePreviewURL"],"mappings":"AAAA;AAKA,SAASA,aAAa,EAAEC,GAAG,QAAQ,QAAO;AAexC;;;;GAIC,GAqBD;;;GAGC,GAYD;;;GAGC,GAMH,OAAO,MAAMC,qBAAqBF,cAAsC;IACtEG,YAAY;IACZC,YAAYC;IACZC,aAAaD;IACbE,WAAWF;IACXG,sBAAsBH;IACtBI,kBAAkB;IAClBC,aAAa;IACbC,kBAAkBN;IAClBO,oBAAoB;QAClBC,QAAQ;QACRC,OAAO;IACT;IACAC,iBAAiB,KAAO;IACxBC,UAAUX;IACVY,YAAYZ;IACZa,mBAAmB;IACnBC,eAAe,KAAO;IACtBC,eAAe,KAAO;IACtBC,WAAW,KAAO;IAClBC,qBAAqB,KAAO;IAC5BC,cAAc,KAAO;IACrBC,uBAAuB,KAAO;IAC9BC,eAAe,KAAO;IACtBC,sBAAsB,KAAO;IAC7BC,SAAS,KAAO;IAChBC,oBAAoB,KAAO;IAC3BC,QAAQ,KAAO;IACfC,UAAU,KAAO;IACjBC,SAAS,KAAO;IAChBC,MAAM;QACJnB,QAAQ;QACRC,OAAO;IACT;IACAmB,iBAAiB;QACfC,GAAG;QACHC,GAAG;IACL;IACAC,sBAAsB/B;IACtBgC,KAAKhC;IACLiC,MAAM;AACR,GAAE;AAEF,OAAO,MAAMC,wBAAwB,IAAMtC,IAAIC,oBAAmB;AAElE;;CAEC,GACD,OAAO,MAAMsC,gBAAgB;IAC3B,MAAM,EAAE7B,gBAAgB,EAAEM,UAAU,EAAEQ,aAAa,EAAE,GAAGxB,IAAIC;IAE5D,OAAO;QAAES;QAAkBM;QAAYQ;IAAc;AACvD,EAAC"}
+{"version":3,"file":"context.js","names":["createContext","use","LivePreviewContext","appIsReady","breakpoint","undefined","breakpoints","iframeRef","isLivePreviewEnabled","isLivePreviewing","isPopupOpen","isPreviewEnabled","measuredDeviceSize","height","width","openPopupWindow","popupRef","previewURL","previewWindowType","setAppIsReady","setBreakpoint","setHeight","setIsLivePreviewing","setLoadedURL","setMeasuredDeviceSize","setPreviewURL","setPreviewWindowType","setSize","setToolbarPosition","setURL","setWidth","setZoom","size","toolbarPosition","x","y","typeofLivePreviewURL","url","zoom","useLivePreviewContext","usePreviewURL"],"sources":["../../../src/providers/LivePreview/context.ts"],"sourcesContent":["'use client'\nimport type { LivePreviewConfig, LivePreviewURLType } from 'payload'\nimport type { Dispatch } from 'react'\nimport type React from 'react'\n\nimport { createContext, use } from 'react'\n\nimport type { usePopupWindow } from '../../hooks/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  iframeRef: React.RefObject<HTMLIFrameElement | null>\n  isLivePreviewEnabled: boolean\n  isLivePreviewing: boolean\n  isPopupOpen: boolean\n  isPreviewEnabled: boolean\n  listeningForMessages?: boolean\n  /**\n   * The URL that has finished loading in the iframe or popup.\n   * For example, if you set the `url`, it will begin to load into the iframe,\n   * but `loadedURL` will not be set until the iframe's `onLoad` event fires.\n   */\n  loadedURL?: string\n  measuredDeviceSize: {\n    height: number\n    width: number\n  }\n  openPopupWindow: ReturnType<typeof usePopupWindow>['openPopupWindow']\n  popupRef?: React.RefObject<null | Window>\n  previewURL?: string\n  previewWindowType: 'iframe' | 'popup'\n  setAppIsReady: (appIsReady: boolean) => void\n  setBreakpoint: (breakpoint: LivePreviewConfig['breakpoints'][number]['name']) => void\n  setHeight: (height: number) => void\n  setIsLivePreviewing: (isLivePreviewing: boolean) => void\n  setLoadedURL: (loadedURL: string) => void\n  setMeasuredDeviceSize: (size: { height: number; width: number }) => void\n  setPreviewURL: (url: string) => void\n  setPreviewWindowType: (previewWindowType: 'iframe' | 'popup') => void\n  setSize: Dispatch<SizeReducerAction>\n  setToolbarPosition: (position: { x: number; y: number }) => void\n\n  /**\n   * Sets the URL of the preview (either iframe or popup).\n   * Will trigger a reload of the window.\n   */\n  setURL: (url: string) => 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  /**\n   * The live preview url property can be either a string or a function that returns a string.\n   * It is important to know which one it is, so that we can opt in/out of certain behaviors, e.g. calling the server to get the URL.\n   */\n  typeofLivePreviewURL?: 'function' | 'string'\n  url: LivePreviewURLType\n  zoom: number\n}\n\nexport const LivePreviewContext = createContext<LivePreviewContextType>({\n  appIsReady: false,\n  breakpoint: undefined,\n  breakpoints: undefined,\n  iframeRef: undefined,\n  isLivePreviewEnabled: undefined,\n  isLivePreviewing: false,\n  isPopupOpen: false,\n  isPreviewEnabled: undefined,\n  measuredDeviceSize: {\n    height: 0,\n    width: 0,\n  },\n  openPopupWindow: () => {},\n  popupRef: undefined,\n  previewURL: undefined,\n  previewWindowType: 'iframe',\n  setAppIsReady: () => {},\n  setBreakpoint: () => {},\n  setHeight: () => {},\n  setIsLivePreviewing: () => {},\n  setLoadedURL: () => {},\n  setMeasuredDeviceSize: () => {},\n  setPreviewURL: () => {},\n  setPreviewWindowType: () => {},\n  setSize: () => {},\n  setToolbarPosition: () => {},\n  setURL: () => {},\n  setWidth: () => {},\n  setZoom: () => {},\n  size: {\n    height: 0,\n    width: 0,\n  },\n  toolbarPosition: {\n    x: 0,\n    y: 0,\n  },\n  typeofLivePreviewURL: undefined,\n  url: undefined,\n  zoom: 1,\n})\n\nexport const useLivePreviewContext = () => use(LivePreviewContext)\n\n/**\n * Hook to access live preview context values. Separated to prevent breaking changes. In the future this hook can be removed in favour of just using the LivePreview one.\n */\nexport const usePreviewURL = () => {\n  const { isPreviewEnabled, previewURL, setPreviewURL } = use(LivePreviewContext)\n\n  return { isPreviewEnabled, previewURL, setPreviewURL }\n}\n"],"mappings":"AAAA;;AAKA,SAASA,aAAa,EAAEC,GAAG,QAAQ;AAgEnC,OAAO,MAAMC,kBAAA,GAAqBF,aAAA,CAAsC;EACtEG,UAAA,EAAY;EACZC,UAAA,EAAYC,SAAA;EACZC,WAAA,EAAaD,SAAA;EACbE,SAAA,EAAWF,SAAA;EACXG,oBAAA,EAAsBH,SAAA;EACtBI,gBAAA,EAAkB;EAClBC,WAAA,EAAa;EACbC,gBAAA,EAAkBN,SAAA;EAClBO,kBAAA,EAAoB;IAClBC,MAAA,EAAQ;IACRC,KAAA,EAAO;EACT;EACAC,eAAA,EAAiBA,CAAA,MAAO;EACxBC,QAAA,EAAUX,SAAA;EACVY,UAAA,EAAYZ,SAAA;EACZa,iBAAA,EAAmB;EACnBC,aAAA,EAAeA,CAAA,MAAO;EACtBC,aAAA,EAAeA,CAAA,MAAO;EACtBC,SAAA,EAAWA,CAAA,MAAO;EAClBC,mBAAA,EAAqBA,CAAA,MAAO;EAC5BC,YAAA,EAAcA,CAAA,MAAO;EACrBC,qBAAA,EAAuBA,CAAA,MAAO;EAC9BC,aAAA,EAAeA,CAAA,MAAO;EACtBC,oBAAA,EAAsBA,CAAA,MAAO;EAC7BC,OAAA,EAASA,CAAA,MAAO;EAChBC,kBAAA,EAAoBA,CAAA,MAAO;EAC3BC,MAAA,EAAQA,CAAA,MAAO;EACfC,QAAA,EAAUA,CAAA,MAAO;EACjBC,OAAA,EAASA,CAAA,MAAO;EAChBC,IAAA,EAAM;IACJnB,MAAA,EAAQ;IACRC,KAAA,EAAO;EACT;EACAmB,eAAA,EAAiB;IACfC,CAAA,EAAG;IACHC,CAAA,EAAG;EACL;EACAC,oBAAA,EAAsB/B,SAAA;EACtBgC,GAAA,EAAKhC,SAAA;EACLiC,IAAA,EAAM;AACR;AAEA,OAAO,MAAMC,qBAAA,GAAwBA,CAAA,KAAMtC,GAAA,CAAIC,kBAAA;AAE/C;;;AAGA,OAAO,MAAMsC,aAAA,GAAgBA,CAAA;EAC3B,MAAM;IAAE7B,gBAAgB;IAAEM,UAAU;IAAEQ;EAAa,CAAE,GAAGxB,GAAA,CAAIC,kBAAA;EAE5D,OAAO;IAAES,gBAAA;IAAkBM,UAAA;IAAYQ;EAAc;AACvD","ignoreList":[]}

package/dist/providers/LivePreview/index.js

@@ -1,5 +1,6 @@
 'use client';
-import { jsxDEV as _jsxDEV } from "react/jsx-dev-runtime";
+
+import { jsx as _jsx } from "react/jsx-runtime";
 import { DndContext } from '@dnd-kit/core';
 import React, { useCallback, useEffect, useId, useMemo, useRef, useState } from 'react';
 import { usePopupWindow } from '../../hooks/usePopupWindow.js';
@@ -9,237 +10,216 @@ import { formatAbsoluteURL } from '../../utilities/formatAbsoluteURL.js';
 import { customCollisionDetection } from './collisionDetection.js';
 import { LivePreviewContext } from './context.js';
 import { sizeReducer } from './sizeReducer.js';
-/**
-   * This specifically relates to `admin.preview` function in the config instead of live preview.
-   */ /**
-   * This specifically relates to `admin.preview` function in the config instead of live preview.
-   */ export const LivePreviewProvider = ({ breakpoints: incomingBreakpoints, children, isLivePreviewEnabled, isLivePreviewing: incomingIsLivePreviewing, isPreviewEnabled, previewURL: previewURLFromProps, typeofLivePreviewURL, url: urlFromProps })=>{
-    const [previewWindowType, setPreviewWindowType] = useState('iframe');
-    const [isLivePreviewing, setIsLivePreviewing] = useState(incomingIsLivePreviewing);
-    const breakpoints = useMemo(()=>[
-            ...incomingBreakpoints || [],
-            {
-                name: 'responsive',
-                height: '100%',
-                label: 'Responsive',
-                width: '100%'
-            }
-        ], [
-        incomingBreakpoints
-    ]);
-    const [url, setURL] = useState('');
-    const [previewURL, setPreviewURL] = useState(previewURLFromProps);
-    const { isPopupOpen, openPopupWindow, popupRef } = usePopupWindow({
-        eventType: 'payload-live-preview',
-        url
-    });
-    const [appIsReady, setAppIsReady] = useState(false);
-    const [listeningForMessages, setListeningForMessages] = useState(false);
-    const { collectionSlug, globalSlug } = useDocumentInfo();
-    const isFirstRender = useRef(true);
-    const { setPreference } = usePreferences();
-    const iframeRef = React.useRef(null);
-    const [loadedURL, setLoadedURL] = useState();
-    const [zoom, setZoom] = useState(1);
-    const [position, setPosition] = useState({
-        x: 0,
-        y: 0
+export const LivePreviewProvider = ({
+  breakpoints: incomingBreakpoints,
+  children,
+  isLivePreviewEnabled,
+  isLivePreviewing: incomingIsLivePreviewing,
+  isPreviewEnabled,
+  previewURL: previewURLFromProps,
+  typeofLivePreviewURL,
+  url: urlFromProps
+}) => {
+  const [previewWindowType, setPreviewWindowType] = useState('iframe');
+  const [isLivePreviewing, setIsLivePreviewing] = useState(incomingIsLivePreviewing);
+  const breakpoints = useMemo(() => [...(incomingBreakpoints || []), {
+    name: 'responsive',
+    height: '100%',
+    label: 'Responsive',
+    width: '100%'
+  }], [incomingBreakpoints]);
+  const [url, setURL] = useState('');
+  const [previewURL, setPreviewURL] = useState(previewURLFromProps);
+  const {
+    isPopupOpen,
+    openPopupWindow,
+    popupRef
+  } = usePopupWindow({
+    eventType: 'payload-live-preview',
+    url
+  });
+  const [appIsReady, setAppIsReady] = useState(false);
+  const [listeningForMessages, setListeningForMessages] = useState(false);
+  const {
+    collectionSlug,
+    globalSlug
+  } = useDocumentInfo();
+  const isFirstRender = useRef(true);
+  const {
+    setPreference
+  } = usePreferences();
+  const iframeRef = React.useRef(null);
+  const [loadedURL, setLoadedURL] = useState();
+  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');
+  /**
+  * A "middleware" callback fn that does some additional work before `setURL`.
+  * This is what we provide through context, bc it:
+  *  - ensures the URL is absolute
+  *  - resets `appIsReady` to `false` while the new URL is loading
+  */
+  const setLivePreviewURL = useCallback(_incomingURL => {
+    let incomingURL;
+    if (typeof _incomingURL === 'string') {
+      incomingURL = formatAbsoluteURL(_incomingURL);
+    }
+    if (!incomingURL) {
+      setIsLivePreviewing(false);
+    }
+    if (incomingURL !== url) {
+      setAppIsReady(false);
+      setURL(incomingURL);
+    }
+  }, [url]);
+  /**
+  * `url` needs to be relative to the window, which cannot be done on initial render.
+  */
+  useEffect(() => {
+    if (typeof urlFromProps === 'string') {
+      setURL(formatAbsoluteURL(urlFromProps));
+    }
+  }, [urlFromProps]);
+  // 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 [size, setSize] = React.useReducer(sizeReducer, {
-        height: 0,
-        width: 0
+  }, [setSize]);
+  const setHeight = useCallback(height => {
+    setSize({
+      type: 'height',
+      value: height
     });
-    const [measuredDeviceSize, setMeasuredDeviceSize] = useState({
-        height: 0,
-        width: 0
-    });
-    const [breakpoint, setBreakpoint] = React.useState('responsive');
-    /**
-   * A "middleware" callback fn that does some additional work before `setURL`.
-   * This is what we provide through context, bc it:
-   *  - ensures the URL is absolute
-   *  - resets `appIsReady` to `false` while the new URL is loading
-   */ const setLivePreviewURL = useCallback((_incomingURL)=>{
-        let incomingURL;
-        if (typeof _incomingURL === 'string') {
-            incomingURL = formatAbsoluteURL(_incomingURL);
-        }
-        if (!incomingURL) {
-            setIsLivePreviewing(false);
-        }
-        if (incomingURL !== url) {
-            setAppIsReady(false);
-            setURL(incomingURL);
+  }, [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
         }
-    }, [
-        url
-    ]);
-    /**
-   * `url` needs to be relative to the window, which cannot be done on initial render.
-   */ useEffect(()=>{
-        if (typeof urlFromProps === 'string') {
-            setURL(formatAbsoluteURL(urlFromProps));
+      });
+    }
+  }, [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);
         }
-    }, [
-        urlFromProps
-    ]);
-    // 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
-    ]);
-    useEffect(()=>{
-        if (isFirstRender.current) {
-            isFirstRender.current = false;
-            return;
-        }
-        void setPreference(collectionSlug ? `collection-${collectionSlug}` : `global-${globalSlug}`, {
-            editViewType: isLivePreviewing ? 'live-preview' : 'default'
-        }, true);
-    }, [
-        isLivePreviewing,
-        setPreference,
-        collectionSlug,
-        globalSlug
-    ]);
-    const dndContextID = useId();
-    return /*#__PURE__*/ _jsxDEV(LivePreviewContext, {
-        value: {
-            appIsReady,
-            breakpoint,
-            breakpoints,
-            iframeRef,
-            isLivePreviewEnabled,
-            isLivePreviewing,
-            isPopupOpen,
-            isPreviewEnabled,
-            listeningForMessages,
-            loadedURL,
-            measuredDeviceSize,
-            openPopupWindow,
-            popupRef,
-            previewURL,
-            previewWindowType,
-            setAppIsReady,
-            setBreakpoint,
-            setHeight,
-            setIsLivePreviewing,
-            setLoadedURL,
-            setMeasuredDeviceSize,
-            setPreviewURL,
-            setPreviewWindowType: handleWindowChange,
-            setSize,
-            setToolbarPosition: setPosition,
-            setURL: setLivePreviewURL,
-            setWidth,
-            setZoom,
-            size,
-            toolbarPosition: position,
-            typeofLivePreviewURL,
-            url,
-            zoom
-        },
-        children: /*#__PURE__*/ _jsxDEV(DndContext, {
-            collisionDetection: customCollisionDetection,
-            // Provide stable ID to fix hydration issues: https://github.com/clauderic/dnd-kit/issues/926
-            id: dndContextID,
-            onDragEnd: handleDragEnd,
-            children: children
-        }, void 0, false, {
-            fileName: "src/providers/LivePreview/index.tsx",
-            lineNumber: 291,
-            columnNumber: 7
-        }, this)
-    }, void 0, false, {
-        fileName: "src/providers/LivePreview/index.tsx",
-        lineNumber: 254,
-        columnNumber: 5
-    }, this);
+    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]);
+  useEffect(() => {
+    if (isFirstRender.current) {
+      isFirstRender.current = false;
+      return;
+    }
+    void setPreference(collectionSlug ? `collection-${collectionSlug}` : `global-${globalSlug}`, {
+      editViewType: isLivePreviewing ? 'live-preview' : 'default'
+    }, true);
+  }, [isLivePreviewing, setPreference, collectionSlug, globalSlug]);
+  const dndContextID = useId();
+  return /*#__PURE__*/_jsx(LivePreviewContext, {
+    value: {
+      appIsReady,
+      breakpoint,
+      breakpoints,
+      iframeRef,
+      isLivePreviewEnabled,
+      isLivePreviewing,
+      isPopupOpen,
+      isPreviewEnabled,
+      listeningForMessages,
+      loadedURL,
+      measuredDeviceSize,
+      openPopupWindow,
+      popupRef,
+      previewURL,
+      previewWindowType,
+      setAppIsReady,
+      setBreakpoint,
+      setHeight,
+      setIsLivePreviewing,
+      setLoadedURL,
+      setMeasuredDeviceSize,
+      setPreviewURL,
+      setPreviewWindowType: handleWindowChange,
+      setSize,
+      setToolbarPosition: setPosition,
+      setURL: setLivePreviewURL,
+      setWidth,
+      setZoom,
+      size,
+      toolbarPosition: position,
+      typeofLivePreviewURL,
+      url,
+      zoom
+    },
+    children: /*#__PURE__*/_jsx(DndContext, {
+      collisionDetection: customCollisionDetection,
+      // Provide stable ID to fix hydration issues: https://github.com/clauderic/dnd-kit/issues/926
+      id: dndContextID,
+      onDragEnd: handleDragEnd,
+      children: children
+    })
+  });
 };
-
 //# sourceMappingURL=index.js.map