@payloadcms/next 3.0.0-canary.cee5702 → 3.0.0-canary.cf66341

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/views/LivePreview/IFrame/index.tsx"],"sourcesContent":["'use client'\nimport React, { forwardRef } from 'react'\n\nimport { useLivePreviewContext } from '../Context/context.js'\nimport './index.scss'\n\nconst baseClass = 'live-preview-iframe'\n\ntype Props = {\n  setIframeHasLoaded: (value: boolean) => void\n  url: string\n}\n\nexport const IFrame = forwardRef<HTMLIFrameElement, Props>((props, ref) => {\n  const { setIframeHasLoaded, url } = props\n\n  const { zoom } = useLivePreviewContext()\n\n  return (\n    <iframe\n      className={baseClass}\n      onLoad={() => {\n        setIframeHasLoaded(true)\n      }}\n      ref={ref}\n      src={url}\n      style={{\n        transform: typeof zoom === 'number' ? `scale(${zoom}) ` : undefined,\n      }}\n      title={url}\n    />\n  )\n})\n"],"names":["React","forwardRef","useLivePreviewContext","baseClass","IFrame","props","ref","setIframeHasLoaded","url","zoom","iframe","className","onLoad","src","style","transform","undefined","title"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;","mappings":"AAAA;;AACA,OAAOA,SAASC,UAAU,QAAQ,QAAO;AAEzC,SAASC,qBAAqB,QAAQ,wBAAuB;AAG7D,MAAMC,YAAY;AAOlB,OAAO,MAAMC,uBAASH,WAAqC,CAACI,OAAOC;IACjE,MAAM,EAAEC,kBAAkB,EAAEC,GAAG,EAAE,GAAGH;IAEpC,MAAM,EAAEI,IAAI,EAAE,GAAGP;IAEjB,qBACE,KAACQ;QACCC,WAAWR;QACXS,QAAQ;YACNL,mBAAmB;QACrB;QACAD,KAAKA;QACLO,KAAKL;QACLM,OAAO;YACLC,WAAW,OAAON,SAAS,WAAW,CAAC,MAAM,EAAEA,KAAK,EAAE,CAAC,GAAGO;QAC5D;QACAC,OAAOT;;AAGb,GAAE"}
+{"version":3,"sources":["../../../../src/views/LivePreview/IFrame/index.tsx"],"sourcesContent":["'use client'\nimport React, { forwardRef } from 'react'\n\nimport { useLivePreviewContext } from '../Context/context.js'\nimport './index.scss'\n\nconst baseClass = 'live-preview-iframe'\n\ntype Props = {\n  setIframeHasLoaded: (value: boolean) => void\n  url: string\n}\n\nexport const IFrame = forwardRef<HTMLIFrameElement, Props>((props, ref) => {\n  const { setIframeHasLoaded, url } = props\n\n  const { zoom } = useLivePreviewContext()\n\n  return (\n    <iframe\n      className={baseClass}\n      onLoad={() => {\n        setIframeHasLoaded(true)\n      }}\n      ref={ref}\n      src={url}\n      style={{\n        transform: typeof zoom === 'number' ? `scale(${zoom}) ` : undefined,\n      }}\n      title={url}\n    />\n  )\n})\n"],"names":["React","forwardRef","useLivePreviewContext","baseClass","IFrame","props","ref","setIframeHasLoaded","url","zoom","iframe","className","onLoad","src","style","transform","undefined","title"],"mappings":"AAAA;;AACA,OAAOA,SAASC,UAAU,QAAQ,QAAO;AAEzC,SAASC,qBAAqB,QAAQ,wBAAuB;AAG7D,MAAMC,YAAY;AAOlB,OAAO,MAAMC,uBAASH,WAAqC,CAACI,OAAOC;IACjE,MAAM,EAAEC,kBAAkB,EAAEC,GAAG,EAAE,GAAGH;IAEpC,MAAM,EAAEI,IAAI,EAAE,GAAGP;IAEjB,qBACE,KAACQ;QACCC,WAAWR;QACXS,QAAQ;YACNL,mBAAmB;QACrB;QACAD,KAAKA;QACLO,KAAKL;QACLM,OAAO;YACLC,WAAW,OAAON,SAAS,WAAW,CAAC,MAAM,EAAEA,KAAK,EAAE,CAAC,GAAGO;QAC5D;QACAC,OAAOT;;AAGb,GAAE"}

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

@@ -1,4 +1,4 @@
-import type { EditViewProps } from 'payload/types';
+import type { EditViewProps } from 'payload';
 import React from 'react';
 import './index.scss';
 export declare const LivePreview: React.FC<EditViewProps>;

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/views/LivePreview/Preview/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,eAAe,CAAA;AAMlD,OAAO,KAAoB,MAAM,OAAO,CAAA;AAMxC,OAAO,cAAc,CAAA;AAIrB,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CAgH/C,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/views/LivePreview/Preview/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAA;AAI5C,OAAO,KAAoB,MAAM,OAAO,CAAA;AAMxC,OAAO,cAAc,CAAA;AAIrB,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CAgH/C,CAAA"}

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

@@ -1,9 +1,7 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { ShimmerEffect } from '@payloadcms/ui/elements/ShimmerEffect';
-import { useAllFormFields } from '@payloadcms/ui/forms/Form';
-import { useDocumentEvents } from '@payloadcms/ui/providers/DocumentEvents';
-import { reduceFieldsToValues } from '@payloadcms/ui/utilities/reduceFieldsToValues';
+import { ShimmerEffect, useAllFormFields, useDocumentEvents } from '@payloadcms/ui';
+import { reduceFieldsToValues } from 'payload/shared';
 import React, { useEffect } from 'react';
 import { useLivePreviewContext } from '../Context/context.js';
 import { DeviceContainer } from '../Device/index.js';

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/views/LivePreview/Preview/index.tsx"],"sourcesContent":["'use client'\n\nimport type { EditViewProps } from 'payload/types'\n\nimport { ShimmerEffect } from '@payloadcms/ui/elements/ShimmerEffect'\nimport { useAllFormFields } from '@payloadcms/ui/forms/Form'\nimport { useDocumentEvents } from '@payloadcms/ui/providers/DocumentEvents'\nimport { reduceFieldsToValues } from '@payloadcms/ui/utilities/reduceFieldsToValues'\nimport React, { useEffect } from 'react'\n\nimport { useLivePreviewContext } from '../Context/context.js'\nimport { DeviceContainer } from '../Device/index.js'\nimport { IFrame } from '../IFrame/index.js'\nimport { LivePreviewToolbar } from '../Toolbar/index.js'\nimport './index.scss'\n\nconst baseClass = 'live-preview-window'\n\nexport const LivePreview: React.FC<EditViewProps> = (props) => {\n  const {\n    appIsReady,\n    iframeHasLoaded,\n    iframeRef,\n    popupRef,\n    previewWindowType,\n    setIframeHasLoaded,\n    url,\n  } = useLivePreviewContext()\n\n  const { mostRecentUpdate } = useDocumentEvents()\n\n  const { breakpoint, fieldSchemaJSON } = useLivePreviewContext()\n\n  const prevWindowType =\n    React.useRef<ReturnType<typeof useLivePreviewContext>['previewWindowType']>(undefined)\n\n  const [fields] = useAllFormFields()\n\n  // For client-side apps, send data through `window.postMessage`\n  // The preview could either be an iframe embedded on the page\n  // Or it could be a separate popup window\n  // We need to transmit data to both accordingly\n  useEffect(() => {\n    // For performance, do no reduce fields to values until after the iframe or popup has loaded\n    if (fields && window && 'postMessage' in window && appIsReady) {\n      const values = reduceFieldsToValues(fields, true)\n\n      // To reduce on large `postMessage` payloads, only send `fieldSchemaToJSON` one time\n      // To do this, the underlying JS function maintains a cache of this value\n      // So we need to send it through each time the window type changes\n      // But only once per window type change, not on every render, because this is a potentially large obj\n      const shouldSendSchema =\n        !prevWindowType.current || prevWindowType.current !== previewWindowType\n\n      prevWindowType.current = previewWindowType\n\n      const message = {\n        type: 'payload-live-preview',\n        data: values,\n        externallyUpdatedRelationship: mostRecentUpdate,\n        fieldSchemaJSON: shouldSendSchema ? fieldSchemaJSON : undefined,\n      }\n\n      // Post message to external popup window\n      if (previewWindowType === 'popup' && popupRef.current) {\n        popupRef.current.postMessage(message, url)\n      }\n\n      // Post message to embedded iframe\n      if (previewWindowType === 'iframe' && iframeRef.current) {\n        iframeRef.current.contentWindow?.postMessage(message, url)\n      }\n    }\n  }, [\n    fields,\n    url,\n    iframeHasLoaded,\n    previewWindowType,\n    popupRef,\n    appIsReady,\n    iframeRef,\n    setIframeHasLoaded,\n    fieldSchemaJSON,\n    mostRecentUpdate,\n  ])\n\n  // To support SSR, we transmit a `window.postMessage` event without a payload\n  // This is because the event will ultimately trigger a server-side roundtrip\n  // i.e., save, save draft, autosave, etc. will fire `router.refresh()`\n  useEffect(() => {\n    const message = {\n      type: 'payload-document-event',\n    }\n\n    // Post message to external popup window\n    if (previewWindowType === 'popup' && popupRef.current) {\n      popupRef.current.postMessage(message, url)\n    }\n\n    // Post message to embedded iframe\n    if (previewWindowType === 'iframe' && iframeRef.current) {\n      iframeRef.current.contentWindow?.postMessage(message, url)\n    }\n  }, [mostRecentUpdate, iframeRef, popupRef, previewWindowType, url])\n\n  if (previewWindowType === 'iframe') {\n    return (\n      <div\n        className={[\n          baseClass,\n          breakpoint && breakpoint !== 'responsive' && `${baseClass}--has-breakpoint`,\n        ]\n          .filter(Boolean)\n          .join(' ')}\n      >\n        <div className={`${baseClass}__wrapper`}>\n          <LivePreviewToolbar {...props} />\n          <div className={`${baseClass}__main`}>\n            <DeviceContainer>\n              {url ? (\n                <IFrame ref={iframeRef} setIframeHasLoaded={setIframeHasLoaded} url={url} />\n              ) : (\n                <ShimmerEffect height=\"100%\" />\n              )}\n            </DeviceContainer>\n          </div>\n        </div>\n      </div>\n    )\n  }\n}\n"],"names":["ShimmerEffect","useAllFormFields","useDocumentEvents","reduceFieldsToValues","React","useEffect","useLivePreviewContext","DeviceContainer","IFrame","LivePreviewToolbar","baseClass","LivePreview","props","appIsReady","iframeHasLoaded","iframeRef","popupRef","previewWindowType","setIframeHasLoaded","url","mostRecentUpdate","breakpoint","fieldSchemaJSON","prevWindowType","useRef","undefined","fields","window","values","shouldSendSchema","current","message","type","data","externallyUpdatedRelationship","postMessage","contentWindow","div","className","filter","Boolean","join","ref","height"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
+{"version":3,"sources":["../../../../src/views/LivePreview/Preview/index.tsx"],"sourcesContent":["'use client'\n\nimport type { EditViewProps } from 'payload'\n\nimport { ShimmerEffect, useAllFormFields, useDocumentEvents } from '@payloadcms/ui'\nimport { reduceFieldsToValues } from 'payload/shared'\nimport React, { useEffect } from 'react'\n\nimport { useLivePreviewContext } from '../Context/context.js'\nimport { DeviceContainer } from '../Device/index.js'\nimport { IFrame } from '../IFrame/index.js'\nimport { LivePreviewToolbar } from '../Toolbar/index.js'\nimport './index.scss'\n\nconst baseClass = 'live-preview-window'\n\nexport const LivePreview: React.FC<EditViewProps> = (props) => {\n  const {\n    appIsReady,\n    iframeHasLoaded,\n    iframeRef,\n    popupRef,\n    previewWindowType,\n    setIframeHasLoaded,\n    url,\n  } = useLivePreviewContext()\n\n  const { mostRecentUpdate } = useDocumentEvents()\n\n  const { breakpoint, fieldSchemaJSON } = useLivePreviewContext()\n\n  const prevWindowType =\n    React.useRef<ReturnType<typeof useLivePreviewContext>['previewWindowType']>(undefined)\n\n  const [fields] = useAllFormFields()\n\n  // For client-side apps, send data through `window.postMessage`\n  // The preview could either be an iframe embedded on the page\n  // Or it could be a separate popup window\n  // We need to transmit data to both accordingly\n  useEffect(() => {\n    // For performance, do no reduce fields to values until after the iframe or popup has loaded\n    if (fields && window && 'postMessage' in window && appIsReady) {\n      const values = reduceFieldsToValues(fields, true)\n\n      // To reduce on large `postMessage` payloads, only send `fieldSchemaToJSON` one time\n      // To do this, the underlying JS function maintains a cache of this value\n      // So we need to send it through each time the window type changes\n      // But only once per window type change, not on every render, because this is a potentially large obj\n      const shouldSendSchema =\n        !prevWindowType.current || prevWindowType.current !== previewWindowType\n\n      prevWindowType.current = previewWindowType\n\n      const message = {\n        type: 'payload-live-preview',\n        data: values,\n        externallyUpdatedRelationship: mostRecentUpdate,\n        fieldSchemaJSON: shouldSendSchema ? fieldSchemaJSON : undefined,\n      }\n\n      // Post message to external popup window\n      if (previewWindowType === 'popup' && popupRef.current) {\n        popupRef.current.postMessage(message, url)\n      }\n\n      // Post message to embedded iframe\n      if (previewWindowType === 'iframe' && iframeRef.current) {\n        iframeRef.current.contentWindow?.postMessage(message, url)\n      }\n    }\n  }, [\n    fields,\n    url,\n    iframeHasLoaded,\n    previewWindowType,\n    popupRef,\n    appIsReady,\n    iframeRef,\n    setIframeHasLoaded,\n    fieldSchemaJSON,\n    mostRecentUpdate,\n  ])\n\n  // To support SSR, we transmit a `window.postMessage` event without a payload\n  // This is because the event will ultimately trigger a server-side roundtrip\n  // i.e., save, save draft, autosave, etc. will fire `router.refresh()`\n  useEffect(() => {\n    const message = {\n      type: 'payload-document-event',\n    }\n\n    // Post message to external popup window\n    if (previewWindowType === 'popup' && popupRef.current) {\n      popupRef.current.postMessage(message, url)\n    }\n\n    // Post message to embedded iframe\n    if (previewWindowType === 'iframe' && iframeRef.current) {\n      iframeRef.current.contentWindow?.postMessage(message, url)\n    }\n  }, [mostRecentUpdate, iframeRef, popupRef, previewWindowType, url])\n\n  if (previewWindowType === 'iframe') {\n    return (\n      <div\n        className={[\n          baseClass,\n          breakpoint && breakpoint !== 'responsive' && `${baseClass}--has-breakpoint`,\n        ]\n          .filter(Boolean)\n          .join(' ')}\n      >\n        <div className={`${baseClass}__wrapper`}>\n          <LivePreviewToolbar {...props} />\n          <div className={`${baseClass}__main`}>\n            <DeviceContainer>\n              {url ? (\n                <IFrame ref={iframeRef} setIframeHasLoaded={setIframeHasLoaded} url={url} />\n              ) : (\n                <ShimmerEffect height=\"100%\" />\n              )}\n            </DeviceContainer>\n          </div>\n        </div>\n      </div>\n    )\n  }\n}\n"],"names":["ShimmerEffect","useAllFormFields","useDocumentEvents","reduceFieldsToValues","React","useEffect","useLivePreviewContext","DeviceContainer","IFrame","LivePreviewToolbar","baseClass","LivePreview","props","appIsReady","iframeHasLoaded","iframeRef","popupRef","previewWindowType","setIframeHasLoaded","url","mostRecentUpdate","breakpoint","fieldSchemaJSON","prevWindowType","useRef","undefined","fields","window","values","shouldSendSchema","current","message","type","data","externallyUpdatedRelationship","postMessage","contentWindow","div","className","filter","Boolean","join","ref","height"],"mappings":"AAAA;;AAIA,SAASA,aAAa,EAAEC,gBAAgB,EAAEC,iBAAiB,QAAQ,iBAAgB;AACnF,SAASC,oBAAoB,QAAQ,iBAAgB;AACrD,OAAOC,SAASC,SAAS,QAAQ,QAAO;AAExC,SAASC,qBAAqB,QAAQ,wBAAuB;AAC7D,SAASC,eAAe,QAAQ,qBAAoB;AACpD,SAASC,MAAM,QAAQ,qBAAoB;AAC3C,SAASC,kBAAkB,QAAQ,sBAAqB;AAGxD,MAAMC,YAAY;AAElB,OAAO,MAAMC,cAAuC,CAACC;IACnD,MAAM,EACJC,UAAU,EACVC,eAAe,EACfC,SAAS,EACTC,QAAQ,EACRC,iBAAiB,EACjBC,kBAAkB,EAClBC,GAAG,EACJ,GAAGb;IAEJ,MAAM,EAAEc,gBAAgB,EAAE,GAAGlB;IAE7B,MAAM,EAAEmB,UAAU,EAAEC,eAAe,EAAE,GAAGhB;IAExC,MAAMiB,iBACJnB,MAAMoB,MAAM,CAAgEC;IAE9E,MAAM,CAACC,OAAO,GAAGzB;IAEjB,+DAA+D;IAC/D,6DAA6D;IAC7D,yCAAyC;IACzC,+CAA+C;IAC/CI,UAAU;QACR,4FAA4F;QAC5F,IAAIqB,UAAUC,UAAU,iBAAiBA,UAAUd,YAAY;YAC7D,MAAMe,SAASzB,qBAAqBuB,QAAQ;YAE5C,oFAAoF;YACpF,yEAAyE;YACzE,kEAAkE;YAClE,qGAAqG;YACrG,MAAMG,mBACJ,CAACN,eAAeO,OAAO,IAAIP,eAAeO,OAAO,KAAKb;YAExDM,eAAeO,OAAO,GAAGb;YAEzB,MAAMc,UAAU;gBACdC,MAAM;gBACNC,MAAML;gBACNM,+BAA+Bd;gBAC/BE,iBAAiBO,mBAAmBP,kBAAkBG;YACxD;YAEA,wCAAwC;YACxC,IAAIR,sBAAsB,WAAWD,SAASc,OAAO,EAAE;gBACrDd,SAASc,OAAO,CAACK,WAAW,CAACJ,SAASZ;YACxC;YAEA,kCAAkC;YAClC,IAAIF,sBAAsB,YAAYF,UAAUe,OAAO,EAAE;gBACvDf,UAAUe,OAAO,CAACM,aAAa,EAAED,YAAYJ,SAASZ;YACxD;QACF;IACF,GAAG;QACDO;QACAP;QACAL;QACAG;QACAD;QACAH;QACAE;QACAG;QACAI;QACAF;KACD;IAED,6EAA6E;IAC7E,4EAA4E;IAC5E,sEAAsE;IACtEf,UAAU;QACR,MAAM0B,UAAU;YACdC,MAAM;QACR;QAEA,wCAAwC;QACxC,IAAIf,sBAAsB,WAAWD,SAASc,OAAO,EAAE;YACrDd,SAASc,OAAO,CAACK,WAAW,CAACJ,SAASZ;QACxC;QAEA,kCAAkC;QAClC,IAAIF,sBAAsB,YAAYF,UAAUe,OAAO,EAAE;YACvDf,UAAUe,OAAO,CAACM,aAAa,EAAED,YAAYJ,SAASZ;QACxD;IACF,GAAG;QAACC;QAAkBL;QAAWC;QAAUC;QAAmBE;KAAI;IAElE,IAAIF,sBAAsB,UAAU;QAClC,qBACE,KAACoB;YACCC,WAAW;gBACT5B;gBACAW,cAAcA,eAAe,gBAAgB,CAAC,EAAEX,UAAU,gBAAgB,CAAC;aAC5E,CACE6B,MAAM,CAACC,SACPC,IAAI,CAAC;sBAER,cAAA,MAACJ;gBAAIC,WAAW,CAAC,EAAE5B,UAAU,SAAS,CAAC;;kCACrC,KAACD;wBAAoB,GAAGG,KAAK;;kCAC7B,KAACyB;wBAAIC,WAAW,CAAC,EAAE5B,UAAU,MAAM,CAAC;kCAClC,cAAA,KAACH;sCACEY,oBACC,KAACX;gCAAOkC,KAAK3B;gCAAWG,oBAAoBA;gCAAoBC,KAAKA;+CAErE,KAACnB;gCAAc2C,QAAO;;;;;;;IAOpC;AACF,EAAC"}

package/dist/views/LivePreview/Toolbar/Controls/index.d.ts

@@ -1,4 +1,4 @@
-import type { EditViewProps } from 'payload/types';
+import type { EditViewProps } from 'payload';
 import React from 'react';
 import './index.scss';
 export declare const ToolbarControls: React.FC<EditViewProps>;

package/dist/views/LivePreview/Toolbar/Controls/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/views/LivePreview/Toolbar/Controls/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,eAAe,CAAA;AAOlD,OAAO,KAAK,MAAM,OAAO,CAAA;AAIzB,OAAO,cAAc,CAAA;AAKrB,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CA8GnD,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/views/LivePreview/Toolbar/Controls/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAA;AAG5C,OAAO,KAAK,MAAM,OAAO,CAAA;AAIzB,OAAO,cAAc,CAAA;AAKrB,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CA8GnD,CAAA"}

package/dist/views/LivePreview/Toolbar/Controls/index.js

@@ -1,10 +1,6 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Popup, PopupList } from '@payloadcms/ui/elements/Popup';
-import { Chevron } from '@payloadcms/ui/icons/Chevron';
-import { LinkIcon } from '@payloadcms/ui/icons/Link';
-import { X } from '@payloadcms/ui/icons/X';
-import { useTranslation } from '@payloadcms/ui/providers/Translation';
+import { ChevronIcon, LinkIcon, Popup, PopupList, XIcon, useTranslation } from '@payloadcms/ui';
 import React from 'react';
 import { useLivePreviewContext } from '../../Context/context.js';
 import { PreviewFrameSizeInput } from '../SizeInput/index.js';
@@ -34,7 +30,7 @@ export const ToolbarControls = ()=>{
                             children: breakpoints.find((bp)=>bp.name == breakpoint)?.label ?? customOption.label
                         }),
                         " ",
-                        /*#__PURE__*/ _jsx(Chevron, {
+                        /*#__PURE__*/ _jsx(ChevronIcon, {
                             className: `${baseClass}__chevron`
                         })
                     ]
@@ -74,7 +70,7 @@ export const ToolbarControls = ()=>{
                     }),
                     /*#__PURE__*/ _jsx("span", {
                         className: `${baseClass}__size-divider`,
-                        children: /*#__PURE__*/ _jsx(X, {})
+                        children: /*#__PURE__*/ _jsx(XIcon, {})
                     }),
                     /*#__PURE__*/ _jsx(PreviewFrameSizeInput, {
                         axis: "y"
@@ -91,7 +87,7 @@ export const ToolbarControls = ()=>{
                             ]
                         }),
                         " ",
-                        /*#__PURE__*/ _jsx(Chevron, {
+                        /*#__PURE__*/ _jsx(ChevronIcon, {
                             className: `${baseClass}__chevron`
                         })
                     ]

package/dist/views/LivePreview/Toolbar/Controls/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/views/LivePreview/Toolbar/Controls/index.tsx"],"sourcesContent":["'use client'\n\nimport type { EditViewProps } from 'payload/types'\n\nimport { Popup, PopupList } from '@payloadcms/ui/elements/Popup'\nimport { Chevron } from '@payloadcms/ui/icons/Chevron'\nimport { LinkIcon } from '@payloadcms/ui/icons/Link'\nimport { X } from '@payloadcms/ui/icons/X'\nimport { useTranslation } from '@payloadcms/ui/providers/Translation'\nimport React from 'react'\n\nimport { useLivePreviewContext } from '../../Context/context.js'\nimport { PreviewFrameSizeInput } from '../SizeInput/index.js'\nimport './index.scss'\n\nconst baseClass = 'live-preview-toolbar-controls'\nconst zoomOptions = [50, 75, 100, 125, 150, 200]\n\nexport const ToolbarControls: React.FC<EditViewProps> = () => {\n  const { breakpoint, breakpoints, setBreakpoint, setPreviewWindowType, setZoom, url, zoom } =\n    useLivePreviewContext()\n  const { t } = useTranslation()\n\n  const customOption = {\n    label: t('general:custom'),\n    value: 'custom',\n  }\n\n  return (\n    <div className={baseClass}>\n      {breakpoints?.length > 0 && (\n        <Popup\n          button={\n            <React.Fragment>\n              <span>\n                {breakpoints.find((bp) => bp.name == breakpoint)?.label ?? customOption.label}\n              </span>\n              &nbsp;\n              <Chevron className={`${baseClass}__chevron`} />\n            </React.Fragment>\n          }\n          className={`${baseClass}__breakpoint`}\n          horizontalAlign=\"right\"\n          render={({ close }) => (\n            <PopupList.ButtonGroup>\n              <React.Fragment>\n                {breakpoints.map((bp) => (\n                  <PopupList.Button\n                    active={bp.name == breakpoint}\n                    key={bp.name}\n                    onClick={() => {\n                      setBreakpoint(bp.name)\n                      close()\n                    }}\n                  >\n                    {bp.label}\n                  </PopupList.Button>\n                ))}\n                {/* Dynamically add this option so that it only appears when the width and height inputs are explicitly changed */}\n                {breakpoint === 'custom' && (\n                  <PopupList.Button\n                    active={breakpoint == customOption.value}\n                    onClick={() => {\n                      setBreakpoint(customOption.value)\n                      close()\n                    }}\n                  >\n                    {customOption.label}\n                  </PopupList.Button>\n                )}\n              </React.Fragment>\n            </PopupList.ButtonGroup>\n          )}\n          showScrollbar\n          verticalAlign=\"bottom\"\n        />\n      )}\n      <div className={`${baseClass}__device-size`}>\n        <PreviewFrameSizeInput axis=\"x\" />\n        <span className={`${baseClass}__size-divider`}>\n          <X />\n        </span>\n        <PreviewFrameSizeInput axis=\"y\" />\n      </div>\n      <Popup\n        button={\n          <React.Fragment>\n            <span>{zoom * 100}%</span>\n            &nbsp;\n            <Chevron className={`${baseClass}__chevron`} />\n          </React.Fragment>\n        }\n        className={`${baseClass}__zoom`}\n        horizontalAlign=\"right\"\n        render={({ close }) => (\n          <PopupList.ButtonGroup>\n            <React.Fragment>\n              {zoomOptions.map((zoomValue) => (\n                <PopupList.Button\n                  active={zoom * 100 == zoomValue}\n                  key={zoomValue}\n                  onClick={() => {\n                    setZoom(zoomValue / 100)\n                    close()\n                  }}\n                >\n                  {zoomValue}%\n                </PopupList.Button>\n              ))}\n            </React.Fragment>\n          </PopupList.ButtonGroup>\n        )}\n        showScrollbar\n        verticalAlign=\"bottom\"\n      />\n      <a\n        className={`${baseClass}__external`}\n        href={url}\n        onClick={(e) => {\n          e.preventDefault()\n          setPreviewWindowType('popup')\n        }}\n        type=\"button\"\n      >\n        <LinkIcon />\n      </a>\n    </div>\n  )\n}\n"],"names":["Popup","PopupList","Chevron","LinkIcon","X","useTranslation","React","useLivePreviewContext","PreviewFrameSizeInput","baseClass","zoomOptions","ToolbarControls","breakpoint","breakpoints","setBreakpoint","setPreviewWindowType","setZoom","url","zoom","t","customOption","label","value","div","className","length","button","Fragment","span","find","bp","name","horizontalAlign","render","close","ButtonGroup","map","Button","active","onClick","showScrollbar","verticalAlign","axis","zoomValue","a","href","e","preventDefault","type"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
+{"version":3,"sources":["../../../../../src/views/LivePreview/Toolbar/Controls/index.tsx"],"sourcesContent":["'use client'\n\nimport type { EditViewProps } from 'payload'\n\nimport { ChevronIcon, LinkIcon, Popup, PopupList, XIcon, useTranslation } from '@payloadcms/ui'\nimport React from 'react'\n\nimport { useLivePreviewContext } from '../../Context/context.js'\nimport { PreviewFrameSizeInput } from '../SizeInput/index.js'\nimport './index.scss'\n\nconst baseClass = 'live-preview-toolbar-controls'\nconst zoomOptions = [50, 75, 100, 125, 150, 200]\n\nexport const ToolbarControls: React.FC<EditViewProps> = () => {\n  const { breakpoint, breakpoints, setBreakpoint, setPreviewWindowType, setZoom, url, zoom } =\n    useLivePreviewContext()\n  const { t } = useTranslation()\n\n  const customOption = {\n    label: t('general:custom'),\n    value: 'custom',\n  }\n\n  return (\n    <div className={baseClass}>\n      {breakpoints?.length > 0 && (\n        <Popup\n          button={\n            <React.Fragment>\n              <span>\n                {breakpoints.find((bp) => bp.name == breakpoint)?.label ?? customOption.label}\n              </span>\n              &nbsp;\n              <ChevronIcon className={`${baseClass}__chevron`} />\n            </React.Fragment>\n          }\n          className={`${baseClass}__breakpoint`}\n          horizontalAlign=\"right\"\n          render={({ close }) => (\n            <PopupList.ButtonGroup>\n              <React.Fragment>\n                {breakpoints.map((bp) => (\n                  <PopupList.Button\n                    active={bp.name == breakpoint}\n                    key={bp.name}\n                    onClick={() => {\n                      setBreakpoint(bp.name)\n                      close()\n                    }}\n                  >\n                    {bp.label}\n                  </PopupList.Button>\n                ))}\n                {/* Dynamically add this option so that it only appears when the width and height inputs are explicitly changed */}\n                {breakpoint === 'custom' && (\n                  <PopupList.Button\n                    active={breakpoint == customOption.value}\n                    onClick={() => {\n                      setBreakpoint(customOption.value)\n                      close()\n                    }}\n                  >\n                    {customOption.label}\n                  </PopupList.Button>\n                )}\n              </React.Fragment>\n            </PopupList.ButtonGroup>\n          )}\n          showScrollbar\n          verticalAlign=\"bottom\"\n        />\n      )}\n      <div className={`${baseClass}__device-size`}>\n        <PreviewFrameSizeInput axis=\"x\" />\n        <span className={`${baseClass}__size-divider`}>\n          <XIcon />\n        </span>\n        <PreviewFrameSizeInput axis=\"y\" />\n      </div>\n      <Popup\n        button={\n          <React.Fragment>\n            <span>{zoom * 100}%</span>\n            &nbsp;\n            <ChevronIcon className={`${baseClass}__chevron`} />\n          </React.Fragment>\n        }\n        className={`${baseClass}__zoom`}\n        horizontalAlign=\"right\"\n        render={({ close }) => (\n          <PopupList.ButtonGroup>\n            <React.Fragment>\n              {zoomOptions.map((zoomValue) => (\n                <PopupList.Button\n                  active={zoom * 100 == zoomValue}\n                  key={zoomValue}\n                  onClick={() => {\n                    setZoom(zoomValue / 100)\n                    close()\n                  }}\n                >\n                  {zoomValue}%\n                </PopupList.Button>\n              ))}\n            </React.Fragment>\n          </PopupList.ButtonGroup>\n        )}\n        showScrollbar\n        verticalAlign=\"bottom\"\n      />\n      <a\n        className={`${baseClass}__external`}\n        href={url}\n        onClick={(e) => {\n          e.preventDefault()\n          setPreviewWindowType('popup')\n        }}\n        type=\"button\"\n      >\n        <LinkIcon />\n      </a>\n    </div>\n  )\n}\n"],"names":["ChevronIcon","LinkIcon","Popup","PopupList","XIcon","useTranslation","React","useLivePreviewContext","PreviewFrameSizeInput","baseClass","zoomOptions","ToolbarControls","breakpoint","breakpoints","setBreakpoint","setPreviewWindowType","setZoom","url","zoom","t","customOption","label","value","div","className","length","button","Fragment","span","find","bp","name","horizontalAlign","render","close","ButtonGroup","map","Button","active","onClick","showScrollbar","verticalAlign","axis","zoomValue","a","href","e","preventDefault","type"],"mappings":"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"}

package/dist/views/LivePreview/Toolbar/SizeInput/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/views/LivePreview/Toolbar/SizeInput/index.tsx"],"sourcesContent":["'use client'\nimport React, { useCallback, useEffect } from 'react'\n\nimport { useLivePreviewContext } from '../../Context/context.js'\nimport './index.scss'\n\nconst baseClass = 'toolbar-input'\n\nexport const PreviewFrameSizeInput: React.FC<{\n  axis?: 'x' | 'y'\n}> = (props) => {\n  const { axis } = props\n\n  const { breakpoint, measuredDeviceSize, setBreakpoint, setSize, size, zoom } =\n    useLivePreviewContext()\n\n  const [internalState, setInternalState] = React.useState<number>(\n    (axis === 'x' ? measuredDeviceSize?.width : measuredDeviceSize?.height) || 0,\n  )\n\n  // when the input is changed manually, we need to set the breakpoint as `custom`\n  // this will then allow us to set an explicit width and height\n  const handleChange = useCallback(\n    (e: React.ChangeEvent<HTMLInputElement>) => {\n      let newValue = Number(e.target.value)\n\n      if (newValue < 0) newValue = 0\n\n      setInternalState(newValue)\n      setBreakpoint('custom')\n\n      // be sure to set _both_ axis values to so that the other axis doesn't fallback to 0 on initial change\n      // this is because the `responsive` size is '100%' in CSS, and `0` in initial state\n      setSize({\n        type: 'reset',\n        value: {\n          height: axis === 'y' ? newValue : Number(measuredDeviceSize?.height.toFixed(0)) * zoom,\n          width: axis === 'x' ? newValue : Number(measuredDeviceSize?.width.toFixed(0)) * zoom,\n        },\n      })\n    },\n    [axis, setBreakpoint, measuredDeviceSize, setSize, zoom],\n  )\n\n  // if the breakpoint is `responsive` then the device's div will have `100%` width and height\n  // so we need to take the measurements provided by `actualDeviceSize` and sync internal state\n  useEffect(() => {\n    if (breakpoint === 'responsive' && measuredDeviceSize) {\n      if (axis === 'x') setInternalState(Number(measuredDeviceSize.width.toFixed(0)) * zoom)\n      else setInternalState(Number(measuredDeviceSize.height.toFixed(0)) * zoom)\n    }\n\n    if (breakpoint !== 'responsive' && size) {\n      setInternalState(axis === 'x' ? size.width : size.height)\n    }\n  }, [breakpoint, axis, measuredDeviceSize, size, zoom])\n\n  return (\n    <input\n      className={baseClass}\n      min={0}\n      name={axis === 'x' ? 'live-preview-width' : 'live-preview-height'}\n      onChange={handleChange}\n      step={1}\n      type=\"number\"\n      value={internalState || 0}\n    />\n  )\n}\n"],"names":["React","useCallback","useEffect","useLivePreviewContext","baseClass","PreviewFrameSizeInput","props","axis","breakpoint","measuredDeviceSize","setBreakpoint","setSize","size","zoom","internalState","setInternalState","useState","width","height","handleChange","e","newValue","Number","target","value","type","toFixed","input","className","min","name","onChange","step"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA;;AACA,OAAOA,SAASC,WAAW,EAAEC,SAAS,QAAQ,QAAO;AAErD,SAASC,qBAAqB,QAAQ,2BAA0B;AAGhE,MAAMC,YAAY;AAElB,OAAO,MAAMC,wBAER,CAACC;IACJ,MAAM,EAAEC,IAAI,EAAE,GAAGD;IAEjB,MAAM,EAAEE,UAAU,EAAEC,kBAAkB,EAAEC,aAAa,EAAEC,OAAO,EAAEC,IAAI,EAAEC,IAAI,EAAE,GAC1EV;IAEF,MAAM,CAACW,eAAeC,iBAAiB,GAAGf,MAAMgB,QAAQ,CACtD,AAACT,CAAAA,SAAS,MAAME,oBAAoBQ,QAAQR,oBAAoBS,MAAK,KAAM;IAG7E,gFAAgF;IAChF,8DAA8D;IAC9D,MAAMC,eAAelB,YACnB,CAACmB;QACC,IAAIC,WAAWC,OAAOF,EAAEG,MAAM,CAACC,KAAK;QAEpC,IAAIH,WAAW,GAAGA,WAAW;QAE7BN,iBAAiBM;QACjBX,cAAc;QAEd,sGAAsG;QACtG,mFAAmF;QACnFC,QAAQ;YACNc,MAAM;YACND,OAAO;gBACLN,QAAQX,SAAS,MAAMc,WAAWC,OAAOb,oBAAoBS,OAAOQ,QAAQ,MAAMb;gBAClFI,OAAOV,SAAS,MAAMc,WAAWC,OAAOb,oBAAoBQ,MAAMS,QAAQ,MAAMb;YAClF;QACF;IACF,GACA;QAACN;QAAMG;QAAeD;QAAoBE;QAASE;KAAK;IAG1D,4FAA4F;IAC5F,6FAA6F;IAC7FX,UAAU;QACR,IAAIM,eAAe,gBAAgBC,oBAAoB;YACrD,IAAIF,SAAS,KAAKQ,iBAAiBO,OAAOb,mBAAmBQ,KAAK,CAACS,OAAO,CAAC,MAAMb;iBAC5EE,iBAAiBO,OAAOb,mBAAmBS,MAAM,CAACQ,OAAO,CAAC,MAAMb;QACvE;QAEA,IAAIL,eAAe,gBAAgBI,MAAM;YACvCG,iBAAiBR,SAAS,MAAMK,KAAKK,KAAK,GAAGL,KAAKM,MAAM;QAC1D;IACF,GAAG;QAACV;QAAYD;QAAME;QAAoBG;QAAMC;KAAK;IAErD,qBACE,KAACc;QACCC,WAAWxB;QACXyB,KAAK;QACLC,MAAMvB,SAAS,MAAM,uBAAuB;QAC5CwB,UAAUZ;QACVa,MAAM;QACNP,MAAK;QACLD,OAAOV,iBAAiB;;AAG9B,EAAC"}
+{"version":3,"sources":["../../../../../src/views/LivePreview/Toolbar/SizeInput/index.tsx"],"sourcesContent":["'use client'\nimport React, { useCallback, useEffect } from 'react'\n\nimport { useLivePreviewContext } from '../../Context/context.js'\nimport './index.scss'\n\nconst baseClass = 'toolbar-input'\n\nexport const PreviewFrameSizeInput: React.FC<{\n  axis?: 'x' | 'y'\n}> = (props) => {\n  const { axis } = props\n\n  const { breakpoint, measuredDeviceSize, setBreakpoint, setSize, size, zoom } =\n    useLivePreviewContext()\n\n  const [internalState, setInternalState] = React.useState<number>(\n    (axis === 'x' ? measuredDeviceSize?.width : measuredDeviceSize?.height) || 0,\n  )\n\n  // when the input is changed manually, we need to set the breakpoint as `custom`\n  // this will then allow us to set an explicit width and height\n  const handleChange = useCallback(\n    (e: React.ChangeEvent<HTMLInputElement>) => {\n      let newValue = Number(e.target.value)\n\n      if (newValue < 0) newValue = 0\n\n      setInternalState(newValue)\n      setBreakpoint('custom')\n\n      // be sure to set _both_ axis values to so that the other axis doesn't fallback to 0 on initial change\n      // this is because the `responsive` size is '100%' in CSS, and `0` in initial state\n      setSize({\n        type: 'reset',\n        value: {\n          height: axis === 'y' ? newValue : Number(measuredDeviceSize?.height.toFixed(0)) * zoom,\n          width: axis === 'x' ? newValue : Number(measuredDeviceSize?.width.toFixed(0)) * zoom,\n        },\n      })\n    },\n    [axis, setBreakpoint, measuredDeviceSize, setSize, zoom],\n  )\n\n  // if the breakpoint is `responsive` then the device's div will have `100%` width and height\n  // so we need to take the measurements provided by `actualDeviceSize` and sync internal state\n  useEffect(() => {\n    if (breakpoint === 'responsive' && measuredDeviceSize) {\n      if (axis === 'x') setInternalState(Number(measuredDeviceSize.width.toFixed(0)) * zoom)\n      else setInternalState(Number(measuredDeviceSize.height.toFixed(0)) * zoom)\n    }\n\n    if (breakpoint !== 'responsive' && size) {\n      setInternalState(axis === 'x' ? size.width : size.height)\n    }\n  }, [breakpoint, axis, measuredDeviceSize, size, zoom])\n\n  return (\n    <input\n      className={baseClass}\n      min={0}\n      name={axis === 'x' ? 'live-preview-width' : 'live-preview-height'}\n      onChange={handleChange}\n      step={1}\n      type=\"number\"\n      value={internalState || 0}\n    />\n  )\n}\n"],"names":["React","useCallback","useEffect","useLivePreviewContext","baseClass","PreviewFrameSizeInput","props","axis","breakpoint","measuredDeviceSize","setBreakpoint","setSize","size","zoom","internalState","setInternalState","useState","width","height","handleChange","e","newValue","Number","target","value","type","toFixed","input","className","min","name","onChange","step"],"mappings":"AAAA;;AACA,OAAOA,SAASC,WAAW,EAAEC,SAAS,QAAQ,QAAO;AAErD,SAASC,qBAAqB,QAAQ,2BAA0B;AAGhE,MAAMC,YAAY;AAElB,OAAO,MAAMC,wBAER,CAACC;IACJ,MAAM,EAAEC,IAAI,EAAE,GAAGD;IAEjB,MAAM,EAAEE,UAAU,EAAEC,kBAAkB,EAAEC,aAAa,EAAEC,OAAO,EAAEC,IAAI,EAAEC,IAAI,EAAE,GAC1EV;IAEF,MAAM,CAACW,eAAeC,iBAAiB,GAAGf,MAAMgB,QAAQ,CACtD,AAACT,CAAAA,SAAS,MAAME,oBAAoBQ,QAAQR,oBAAoBS,MAAK,KAAM;IAG7E,gFAAgF;IAChF,8DAA8D;IAC9D,MAAMC,eAAelB,YACnB,CAACmB;QACC,IAAIC,WAAWC,OAAOF,EAAEG,MAAM,CAACC,KAAK;QAEpC,IAAIH,WAAW,GAAGA,WAAW;QAE7BN,iBAAiBM;QACjBX,cAAc;QAEd,sGAAsG;QACtG,mFAAmF;QACnFC,QAAQ;YACNc,MAAM;YACND,OAAO;gBACLN,QAAQX,SAAS,MAAMc,WAAWC,OAAOb,oBAAoBS,OAAOQ,QAAQ,MAAMb;gBAClFI,OAAOV,SAAS,MAAMc,WAAWC,OAAOb,oBAAoBQ,MAAMS,QAAQ,MAAMb;YAClF;QACF;IACF,GACA;QAACN;QAAMG;QAAeD;QAAoBE;QAASE;KAAK;IAG1D,4FAA4F;IAC5F,6FAA6F;IAC7FX,UAAU;QACR,IAAIM,eAAe,gBAAgBC,oBAAoB;YACrD,IAAIF,SAAS,KAAKQ,iBAAiBO,OAAOb,mBAAmBQ,KAAK,CAACS,OAAO,CAAC,MAAMb;iBAC5EE,iBAAiBO,OAAOb,mBAAmBS,MAAM,CAACQ,OAAO,CAAC,MAAMb;QACvE;QAEA,IAAIL,eAAe,gBAAgBI,MAAM;YACvCG,iBAAiBR,SAAS,MAAMK,KAAKK,KAAK,GAAGL,KAAKM,MAAM;QAC1D;IACF,GAAG;QAACV;QAAYD;QAAME;QAAoBG;QAAMC;KAAK;IAErD,qBACE,KAACc;QACCC,WAAWxB;QACXyB,KAAK;QACLC,MAAMvB,SAAS,MAAM,uBAAuB;QAC5CwB,UAAUZ;QACVa,MAAM;QACNP,MAAK;QACLD,OAAOV,iBAAiB;;AAG9B,EAAC"}

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

@@ -1,7 +1,7 @@
-import type { EditViewProps } from 'payload/types';
+import type { EditViewProps } from 'payload';
 import React from 'react';
 import './index.scss';
-export declare const LivePreviewToolbar: React.FC<EditViewProps & {
+export declare const LivePreviewToolbar: React.FC<{
     draggable?: boolean;
-}>;
+} & EditViewProps>;
 //# sourceMappingURL=index.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/views/LivePreview/Toolbar/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,eAAe,CAAA;AAIlD,OAAO,KAAK,MAAM,OAAO,CAAA;AAIzB,OAAO,cAAc,CAAA;AAgDrB,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CACvC,aAAa,GAAG;IACd,SAAS,CAAC,EAAE,OAAO,CAAA;CACpB,CASF,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/views/LivePreview/Toolbar/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAA;AAI5C,OAAO,KAAK,MAAM,OAAO,CAAA;AAIzB,OAAO,cAAc,CAAA;AAgDrB,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CACvC;IACE,SAAS,CAAC,EAAE,OAAO,CAAA;CACpB,GAAG,aAAa,CASlB,CAAA"}

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

@@ -1,7 +1,7 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useDraggable } from '@dnd-kit/core';
-import { DragHandle } from '@payloadcms/ui/icons/DragHandle';
+import { DragHandleIcon } from '@payloadcms/ui';
 import React from 'react';
 import { useLivePreviewContext } from '../Context/context.js';
 import { ToolbarControls } from './Controls/index.js';
@@ -30,7 +30,7 @@ const DraggableToolbar = (props)=>{
                 className: `${baseClass}__drag-handle`,
                 ref: setNodeRef,
                 type: "button",
-                children: /*#__PURE__*/ _jsx(DragHandle, {})
+                children: /*#__PURE__*/ _jsx(DragHandleIcon, {})
             }),
             /*#__PURE__*/ _jsx(ToolbarControls, {
                 ...props

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/views/LivePreview/Toolbar/index.tsx"],"sourcesContent":["'use client'\nimport type { EditViewProps } from 'payload/types'\n\nimport { useDraggable } from '@dnd-kit/core'\nimport { DragHandle } from '@payloadcms/ui/icons/DragHandle'\nimport React from 'react'\n\nimport { useLivePreviewContext } from '../Context/context.js'\nimport { ToolbarControls } from './Controls/index.js'\nimport './index.scss'\n\nconst baseClass = 'live-preview-toolbar'\n\nconst DraggableToolbar: React.FC<EditViewProps> = (props) => {\n  const { toolbarPosition } = useLivePreviewContext()\n\n  const { attributes, listeners, setNodeRef, transform } = useDraggable({\n    id: 'live-preview-toolbar',\n  })\n\n  return (\n    <div\n      className={[baseClass, `${baseClass}--draggable`].join(' ')}\n      style={{\n        left: `${toolbarPosition.x}px`,\n        top: `${toolbarPosition.y}px`,\n        ...(transform\n          ? {\n              transform: transform\n                ? `translate3d(${transform?.x || 0}px, ${transform?.y || 0}px, 0)`\n                : undefined,\n            }\n          : {}),\n      }}\n    >\n      <button\n        {...listeners}\n        {...attributes}\n        className={`${baseClass}__drag-handle`}\n        ref={setNodeRef}\n        type=\"button\"\n      >\n        <DragHandle />\n      </button>\n      <ToolbarControls {...props} />\n    </div>\n  )\n}\n\nconst StaticToolbar: React.FC<EditViewProps> = (props) => {\n  return (\n    <div className={[baseClass, `${baseClass}--static`].join(' ')}>\n      <ToolbarControls {...props} />\n    </div>\n  )\n}\n\nexport const LivePreviewToolbar: React.FC<\n  EditViewProps & {\n    draggable?: boolean\n  }\n> = (props) => {\n  const { draggable } = props\n\n  if (draggable) {\n    return <DraggableToolbar {...props} />\n  }\n\n  return <StaticToolbar {...props} />\n}\n"],"names":["useDraggable","DragHandle","React","useLivePreviewContext","ToolbarControls","baseClass","DraggableToolbar","props","toolbarPosition","attributes","listeners","setNodeRef","transform","id","div","className","join","style","left","x","top","y","undefined","button","ref","type","StaticToolbar","LivePreviewToolbar","draggable"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA;;AAGA,SAASA,YAAY,QAAQ,gBAAe;AAC5C,SAASC,UAAU,QAAQ,kCAAiC;AAC5D,OAAOC,WAAW,QAAO;AAEzB,SAASC,qBAAqB,QAAQ,wBAAuB;AAC7D,SAASC,eAAe,QAAQ,sBAAqB;AAGrD,MAAMC,YAAY;AAElB,MAAMC,mBAA4C,CAACC;IACjD,MAAM,EAAEC,eAAe,EAAE,GAAGL;IAE5B,MAAM,EAAEM,UAAU,EAAEC,SAAS,EAAEC,UAAU,EAAEC,SAAS,EAAE,GAAGZ,aAAa;QACpEa,IAAI;IACN;IAEA,qBACE,MAACC;QACCC,WAAW;YAACV;YAAW,CAAC,EAAEA,UAAU,WAAW,CAAC;SAAC,CAACW,IAAI,CAAC;QACvDC,OAAO;YACLC,MAAM,CAAC,EAAEV,gBAAgBW,CAAC,CAAC,EAAE,CAAC;YAC9BC,KAAK,CAAC,EAAEZ,gBAAgBa,CAAC,CAAC,EAAE,CAAC;YAC7B,GAAIT,YACA;gBACEA,WAAWA,YACP,CAAC,YAAY,EAAEA,WAAWO,KAAK,EAAE,IAAI,EAAEP,WAAWS,KAAK,EAAE,MAAM,CAAC,GAChEC;YACN,IACA,CAAC,CAAC;QACR;;0BAEA,KAACC;gBACE,GAAGb,SAAS;gBACZ,GAAGD,UAAU;gBACdM,WAAW,CAAC,EAAEV,UAAU,aAAa,CAAC;gBACtCmB,KAAKb;gBACLc,MAAK;0BAEL,cAAA,KAACxB;;0BAEH,KAACG;gBAAiB,GAAGG,KAAK;;;;AAGhC;AAEA,MAAMmB,gBAAyC,CAACnB;IAC9C,qBACE,KAACO;QAAIC,WAAW;YAACV;YAAW,CAAC,EAAEA,UAAU,QAAQ,CAAC;SAAC,CAACW,IAAI,CAAC;kBACvD,cAAA,KAACZ;YAAiB,GAAGG,KAAK;;;AAGhC;AAEA,OAAO,MAAMoB,qBAIT,CAACpB;IACH,MAAM,EAAEqB,SAAS,EAAE,GAAGrB;IAEtB,IAAIqB,WAAW;QACb,qBAAO,KAACtB;YAAkB,GAAGC,KAAK;;IACpC;IAEA,qBAAO,KAACmB;QAAe,GAAGnB,KAAK;;AACjC,EAAC"}
+{"version":3,"sources":["../../../../src/views/LivePreview/Toolbar/index.tsx"],"sourcesContent":["'use client'\nimport type { EditViewProps } from 'payload'\n\nimport { useDraggable } from '@dnd-kit/core'\nimport { DragHandleIcon } from '@payloadcms/ui'\nimport React from 'react'\n\nimport { useLivePreviewContext } from '../Context/context.js'\nimport { ToolbarControls } from './Controls/index.js'\nimport './index.scss'\n\nconst baseClass = 'live-preview-toolbar'\n\nconst DraggableToolbar: React.FC<EditViewProps> = (props) => {\n  const { toolbarPosition } = useLivePreviewContext()\n\n  const { attributes, listeners, setNodeRef, transform } = useDraggable({\n    id: 'live-preview-toolbar',\n  })\n\n  return (\n    <div\n      className={[baseClass, `${baseClass}--draggable`].join(' ')}\n      style={{\n        left: `${toolbarPosition.x}px`,\n        top: `${toolbarPosition.y}px`,\n        ...(transform\n          ? {\n              transform: transform\n                ? `translate3d(${transform?.x || 0}px, ${transform?.y || 0}px, 0)`\n                : undefined,\n            }\n          : {}),\n      }}\n    >\n      <button\n        {...listeners}\n        {...attributes}\n        className={`${baseClass}__drag-handle`}\n        ref={setNodeRef}\n        type=\"button\"\n      >\n        <DragHandleIcon />\n      </button>\n      <ToolbarControls {...props} />\n    </div>\n  )\n}\n\nconst StaticToolbar: React.FC<EditViewProps> = (props) => {\n  return (\n    <div className={[baseClass, `${baseClass}--static`].join(' ')}>\n      <ToolbarControls {...props} />\n    </div>\n  )\n}\n\nexport const LivePreviewToolbar: React.FC<\n  {\n    draggable?: boolean\n  } & EditViewProps\n> = (props) => {\n  const { draggable } = props\n\n  if (draggable) {\n    return <DraggableToolbar {...props} />\n  }\n\n  return <StaticToolbar {...props} />\n}\n"],"names":["useDraggable","DragHandleIcon","React","useLivePreviewContext","ToolbarControls","baseClass","DraggableToolbar","props","toolbarPosition","attributes","listeners","setNodeRef","transform","id","div","className","join","style","left","x","top","y","undefined","button","ref","type","StaticToolbar","LivePreviewToolbar","draggable"],"mappings":"AAAA;;AAGA,SAASA,YAAY,QAAQ,gBAAe;AAC5C,SAASC,cAAc,QAAQ,iBAAgB;AAC/C,OAAOC,WAAW,QAAO;AAEzB,SAASC,qBAAqB,QAAQ,wBAAuB;AAC7D,SAASC,eAAe,QAAQ,sBAAqB;AAGrD,MAAMC,YAAY;AAElB,MAAMC,mBAA4C,CAACC;IACjD,MAAM,EAAEC,eAAe,EAAE,GAAGL;IAE5B,MAAM,EAAEM,UAAU,EAAEC,SAAS,EAAEC,UAAU,EAAEC,SAAS,EAAE,GAAGZ,aAAa;QACpEa,IAAI;IACN;IAEA,qBACE,MAACC;QACCC,WAAW;YAACV;YAAW,CAAC,EAAEA,UAAU,WAAW,CAAC;SAAC,CAACW,IAAI,CAAC;QACvDC,OAAO;YACLC,MAAM,CAAC,EAAEV,gBAAgBW,CAAC,CAAC,EAAE,CAAC;YAC9BC,KAAK,CAAC,EAAEZ,gBAAgBa,CAAC,CAAC,EAAE,CAAC;YAC7B,GAAIT,YACA;gBACEA,WAAWA,YACP,CAAC,YAAY,EAAEA,WAAWO,KAAK,EAAE,IAAI,EAAEP,WAAWS,KAAK,EAAE,MAAM,CAAC,GAChEC;YACN,IACA,CAAC,CAAC;QACR;;0BAEA,KAACC;gBACE,GAAGb,SAAS;gBACZ,GAAGD,UAAU;gBACdM,WAAW,CAAC,EAAEV,UAAU,aAAa,CAAC;gBACtCmB,KAAKb;gBACLc,MAAK;0BAEL,cAAA,KAACxB;;0BAEH,KAACG;gBAAiB,GAAGG,KAAK;;;;AAGhC;AAEA,MAAMmB,gBAAyC,CAACnB;IAC9C,qBACE,KAACO;QAAIC,WAAW;YAACV;YAAW,CAAC,EAAEA,UAAU,QAAQ,CAAC;SAAC,CAACW,IAAI,CAAC;kBACvD,cAAA,KAACZ;YAAiB,GAAGG,KAAK;;;AAGhC;AAEA,OAAO,MAAMoB,qBAIT,CAACpB;IACH,MAAM,EAAEqB,SAAS,EAAE,GAAGrB;IAEtB,IAAIqB,WAAW;QACb,qBAAO,KAACtB;YAAkB,GAAGC,KAAK;;IACpC;IAEA,qBAAO,KAACmB;QAAe,GAAGnB,KAAK;;AACjC,EAAC"}

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/views/LivePreview/ToolbarArea/index.tsx"],"sourcesContent":["'use client'\nimport { useDroppable } from '@dnd-kit/core'\nimport React from 'react'\n\nimport './index.scss'\n\nconst baseClass = 'toolbar-area'\n\nexport const ToolbarArea: React.FC<{\n  children: React.ReactNode\n}> = (props) => {\n  const { children } = props\n\n  const { setNodeRef } = useDroppable({\n    id: 'live-preview-area',\n  })\n\n  return (\n    <div className={baseClass} ref={setNodeRef}>\n      {children}\n    </div>\n  )\n}\n"],"names":["useDroppable","React","baseClass","ToolbarArea","props","children","setNodeRef","id","div","className","ref"],"rangeMappings":";;;;;;;;;;;;;;;","mappings":"AAAA;;AACA,SAASA,YAAY,QAAQ,gBAAe;AAC5C,OAAOC,WAAW,QAAO;AAIzB,MAAMC,YAAY;AAElB,OAAO,MAAMC,cAER,CAACC;IACJ,MAAM,EAAEC,QAAQ,EAAE,GAAGD;IAErB,MAAM,EAAEE,UAAU,EAAE,GAAGN,aAAa;QAClCO,IAAI;IACN;IAEA,qBACE,KAACC;QAAIC,WAAWP;QAAWQ,KAAKJ;kBAC7BD;;AAGP,EAAC"}
+{"version":3,"sources":["../../../../src/views/LivePreview/ToolbarArea/index.tsx"],"sourcesContent":["'use client'\nimport { useDroppable } from '@dnd-kit/core'\nimport React from 'react'\n\nimport './index.scss'\n\nconst baseClass = 'toolbar-area'\n\nexport const ToolbarArea: React.FC<{\n  children: React.ReactNode\n}> = (props) => {\n  const { children } = props\n\n  const { setNodeRef } = useDroppable({\n    id: 'live-preview-area',\n  })\n\n  return (\n    <div className={baseClass} ref={setNodeRef}>\n      {children}\n    </div>\n  )\n}\n"],"names":["useDroppable","React","baseClass","ToolbarArea","props","children","setNodeRef","id","div","className","ref"],"mappings":"AAAA;;AACA,SAASA,YAAY,QAAQ,gBAAe;AAC5C,OAAOC,WAAW,QAAO;AAIzB,MAAMC,YAAY;AAElB,OAAO,MAAMC,cAER,CAACC;IACJ,MAAM,EAAEC,QAAQ,EAAE,GAAGD;IAErB,MAAM,EAAEE,UAAU,EAAE,GAAGN,aAAa;QAClCO,IAAI;IACN;IAEA,qBACE,KAACC;QAAIC,WAAWP;QAAWQ,KAAKJ;kBAC7BD;;AAGP,EAAC"}

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

@@ -1,10 +1,9 @@
-import type { LivePreviewConfig } from 'payload/config';
-import type { Data } from 'payload/types';
+import type { Data, LivePreviewConfig } from 'payload';
 import React from 'react';
 import './index.scss';
 export declare const LivePreviewClient: React.FC<{
-    breakpoints: LivePreviewConfig['breakpoints'];
-    initialData: Data;
-    url: string;
+    readonly breakpoints: LivePreviewConfig['breakpoints'];
+    readonly initialData: Data;
+    readonly url: string;
 }>;
 //# sourceMappingURL=index.client.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.client.d.ts","sourceRoot":"","sources":["../../../src/views/LivePreview/index.client.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAA;AACvD,OAAO,KAAK,EAA4D,IAAI,EAAE,MAAM,eAAe,CAAA;AAcnG,OAAO,KAAgC,MAAM,OAAO,CAAA;AAQpD,OAAO,cAAc,CAAA;AAiLrB,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC;IACvC,WAAW,EAAE,iBAAiB,CAAC,aAAa,CAAC,CAAA;IAC7C,WAAW,EAAE,IAAI,CAAA;IACjB,GAAG,EAAE,MAAM,CAAA;CACZ,CA2DA,CAAA"}
+{"version":3,"file":"index.client.d.ts","sourceRoot":"","sources":["../../../src/views/LivePreview/index.client.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAKV,IAAI,EACJ,iBAAiB,EAClB,MAAM,SAAS,CAAA;AAehB,OAAO,KAAgC,MAAM,OAAO,CAAA;AAQpD,OAAO,cAAc,CAAA;AAiLrB,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC;IACvC,QAAQ,CAAC,WAAW,EAAE,iBAAiB,CAAC,aAAa,CAAC,CAAA;IACtD,QAAQ,CAAC,WAAW,EAAE,IAAI,CAAA;IAC1B,QAAQ,CAAC,GAAG,EAAE,MAAM,CAAA;CACrB,CAmDA,CAAA"}

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

@@ -1,17 +1,7 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { DocumentControls } from '@payloadcms/ui/elements/DocumentControls';
-import { DocumentFields } from '@payloadcms/ui/elements/DocumentFields';
-import { Form } from '@payloadcms/ui/forms/Form';
-import { SetViewActions } from '@payloadcms/ui/providers/Actions';
-import { useAuth } from '@payloadcms/ui/providers/Auth';
-import { useComponentMap } from '@payloadcms/ui/providers/ComponentMap';
-import { useConfig } from '@payloadcms/ui/providers/Config';
-import { useDocumentEvents } from '@payloadcms/ui/providers/DocumentEvents';
-import { useDocumentInfo } from '@payloadcms/ui/providers/DocumentInfo';
-import { OperationProvider } from '@payloadcms/ui/providers/Operation';
-import { useTranslation } from '@payloadcms/ui/providers/Translation';
-import { getFormState } from '@payloadcms/ui/utilities/getFormState';
+import { DocumentControls, DocumentFields, Form, OperationProvider, SetViewActions, useAuth, useConfig, useDocumentEvents, useDocumentInfo, useTranslation } from '@payloadcms/ui';
+import { getFormState } from '@payloadcms/ui/shared';
 import React, { Fragment, useCallback } from 'react';
 import { LeaveWithoutSaving } from '../../elements/LeaveWithoutSaving/index.js';
 import { SetDocumentStepNav } from '../Edit/Default/SetDocumentStepNav/index.js';
@@ -21,10 +11,10 @@ import { LivePreviewProvider } from './Context/index.js';
 import { LivePreview } from './Preview/index.js';
 import { usePopupWindow } from './usePopupWindow.js';
 const baseClass = 'live-preview';
-const PreviewView = ({ apiRoute, collectionConfig, config, fieldMap, globalConfig, schemaPath, serverURL })=>{
+const PreviewView = ({ apiRoute, collectionConfig, config, fields, globalConfig, schemaPath, serverURL })=>{
     const { id, AfterDocument, AfterFields, BeforeDocument, BeforeFields, action, apiURL, collectionSlug, disableActions, disableLeaveWithoutSaving, docPermissions, getDocPreferences, globalSlug, hasPublishPermission, hasSavePermission, initialData, initialState, isEditing, isInitializing, onSave: onSaveFromProps } = useDocumentInfo();
     const operation = id ? 'update' : 'create';
-    const { admin: { user: userSlug } } = useConfig();
+    const { config: { admin: { user: userSlug } } } = useConfig();
     const { t } = useTranslation();
     const { previewWindowType } = useLivePreviewContext();
     const { refreshCookieAsync, user } = useAuth();
@@ -76,110 +66,101 @@ const PreviewView = ({ apiRoute, collectionConfig, config, fieldMap, globalConfi
         schemaPath,
         getDocPreferences
     ]);
-    return /*#__PURE__*/ _jsx(Fragment, {
-        children: /*#__PURE__*/ _jsx(OperationProvider, {
-            operation: operation,
-            children: /*#__PURE__*/ _jsxs(Form, {
-                action: action,
-                className: `${baseClass}__form`,
-                disabled: !hasSavePermission,
-                initialState: initialState,
-                isInitializing: isInitializing,
-                method: id ? 'PATCH' : 'POST',
-                onChange: [
-                    onChange
-                ],
-                onSuccess: onSave,
-                children: [
-                    (collectionConfig && !(collectionConfig.versions?.drafts && collectionConfig.versions?.drafts?.autosave) || globalConfig && !(globalConfig.versions?.drafts && globalConfig.versions?.drafts?.autosave)) && !disableLeaveWithoutSaving && /*#__PURE__*/ _jsx(LeaveWithoutSaving, {}),
-                    /*#__PURE__*/ _jsx(SetDocumentStepNav, {
-                        collectionSlug: collectionSlug,
-                        globalLabel: globalConfig?.label,
-                        globalSlug: globalSlug,
-                        id: id,
-                        pluralLabel: collectionConfig ? collectionConfig?.labels?.plural : undefined,
-                        useAsTitle: collectionConfig ? collectionConfig?.admin?.useAsTitle : undefined,
-                        view: t('general:livePreview')
-                    }),
-                    /*#__PURE__*/ _jsx(SetDocumentTitle, {
-                        collectionConfig: collectionConfig,
-                        config: config,
-                        fallback: id?.toString() || '',
-                        globalConfig: globalConfig
-                    }),
-                    /*#__PURE__*/ _jsx(DocumentControls, {
-                        apiURL: apiURL,
-                        data: initialData,
-                        disableActions: disableActions,
-                        hasPublishPermission: hasPublishPermission,
-                        hasSavePermission: hasSavePermission,
-                        id: id,
-                        isEditing: isEditing,
-                        permissions: docPermissions,
-                        slug: collectionConfig?.slug || globalConfig?.slug
-                    }),
-                    /*#__PURE__*/ _jsxs("div", {
-                        className: [
-                            baseClass,
-                            previewWindowType === 'popup' && `${baseClass}--detached`
-                        ].filter(Boolean).join(' '),
-                        children: [
-                            /*#__PURE__*/ _jsxs("div", {
-                                className: [
-                                    `${baseClass}__main`,
-                                    previewWindowType === 'popup' && `${baseClass}__main--popup-open`
-                                ].filter(Boolean).join(' '),
-                                children: [
-                                    BeforeDocument,
-                                    /*#__PURE__*/ _jsx(DocumentFields, {
-                                        AfterFields: AfterFields,
-                                        BeforeFields: BeforeFields,
-                                        docPermissions: docPermissions,
-                                        fieldMap: fieldMap,
-                                        forceSidebarWrap: true,
-                                        readOnly: !hasSavePermission,
-                                        schemaPath: collectionSlug || globalSlug
-                                    }),
-                                    AfterDocument
-                                ]
-                            }),
-                            /*#__PURE__*/ _jsx(LivePreview, {
-                                collectionSlug: collectionSlug,
-                                globalSlug: globalSlug
-                            })
-                        ]
-                    })
-                ]
-            })
+    return /*#__PURE__*/ _jsx(OperationProvider, {
+        operation: operation,
+        children: /*#__PURE__*/ _jsxs(Form, {
+            action: action,
+            className: `${baseClass}__form`,
+            disabled: !hasSavePermission,
+            initialState: initialState,
+            isInitializing: isInitializing,
+            method: id ? 'PATCH' : 'POST',
+            onChange: [
+                onChange
+            ],
+            onSuccess: onSave,
+            children: [
+                (collectionConfig && !(collectionConfig.versions?.drafts && collectionConfig.versions?.drafts?.autosave) || globalConfig && !(globalConfig.versions?.drafts && globalConfig.versions?.drafts?.autosave)) && !disableLeaveWithoutSaving && /*#__PURE__*/ _jsx(LeaveWithoutSaving, {}),
+                /*#__PURE__*/ _jsx(SetDocumentStepNav, {
+                    collectionSlug: collectionSlug,
+                    globalLabel: globalConfig?.label,
+                    globalSlug: globalSlug,
+                    id: id,
+                    pluralLabel: collectionConfig ? collectionConfig?.labels?.plural : undefined,
+                    useAsTitle: collectionConfig ? collectionConfig?.admin?.useAsTitle : undefined,
+                    view: t('general:livePreview')
+                }),
+                /*#__PURE__*/ _jsx(SetDocumentTitle, {
+                    collectionConfig: collectionConfig,
+                    config: config,
+                    fallback: id?.toString() || '',
+                    globalConfig: globalConfig
+                }),
+                /*#__PURE__*/ _jsx(DocumentControls, {
+                    apiURL: apiURL,
+                    data: initialData,
+                    disableActions: disableActions,
+                    hasPublishPermission: hasPublishPermission,
+                    hasSavePermission: hasSavePermission,
+                    id: id,
+                    isEditing: isEditing,
+                    permissions: docPermissions,
+                    slug: collectionConfig?.slug || globalConfig?.slug
+                }),
+                /*#__PURE__*/ _jsxs("div", {
+                    className: [
+                        baseClass,
+                        previewWindowType === 'popup' && `${baseClass}--detached`
+                    ].filter(Boolean).join(' '),
+                    children: [
+                        /*#__PURE__*/ _jsxs("div", {
+                            className: [
+                                `${baseClass}__main`,
+                                previewWindowType === 'popup' && `${baseClass}__main--popup-open`
+                            ].filter(Boolean).join(' '),
+                            children: [
+                                BeforeDocument,
+                                /*#__PURE__*/ _jsx(DocumentFields, {
+                                    AfterFields: AfterFields,
+                                    BeforeFields: BeforeFields,
+                                    docPermissions: docPermissions,
+                                    fields: fields,
+                                    forceSidebarWrap: true,
+                                    readOnly: !hasSavePermission,
+                                    schemaPath: collectionSlug || globalSlug
+                                }),
+                                AfterDocument
+                            ]
+                        }),
+                        /*#__PURE__*/ _jsx(LivePreview, {
+                            collectionSlug: collectionSlug,
+                            globalSlug: globalSlug
+                        })
+                    ]
+                })
+            ]
         })
     });
 };
 export const LivePreviewClient = (props)=>{
     const { breakpoints, url } = props;
     const { collectionSlug, globalSlug } = useDocumentInfo();
-    const config = useConfig();
+    const { config, config: { routes: { api: apiRoute }, serverURL }, getEntityConfig } = useConfig();
     const { isPopupOpen, openPopupWindow, popupRef } = usePopupWindow({
         eventType: 'payload-live-preview',
         url
     });
-    const { collections, globals, routes: { api: apiRoute }, serverURL } = config;
-    const collectionConfig = collectionSlug && collections.find((collection)=>collection.slug === collectionSlug);
-    const globalConfig = globalSlug && globals.find((global)=>global.slug === globalSlug);
-    const schemaPath = collectionSlug || globalSlug;
-    const { getComponentMap } = useComponentMap();
-    const componentMap = getComponentMap({
-        collectionSlug,
-        globalSlug
+    const collectionConfig = getEntityConfig({
+        collectionSlug
     });
-    const { getFieldMap } = useComponentMap();
-    const fieldMap = getFieldMap({
-        collectionSlug: collectionConfig?.slug,
-        globalSlug: globalConfig?.slug
+    const globalConfig = getEntityConfig({
+        globalSlug
     });
+    const schemaPath = collectionSlug || globalSlug;
     return /*#__PURE__*/ _jsxs(Fragment, {
         children: [
             /*#__PURE__*/ _jsx(SetViewActions, {
-                actions: componentMap?.actionsMap?.Edit?.LivePreview
+                actions: (collectionConfig || globalConfig)?.admin?.components?.views?.edit?.livePreview?.actions
             }),
             /*#__PURE__*/ _jsx(LivePreviewProvider, {
                 breakpoints: breakpoints,
@@ -192,7 +173,7 @@ export const LivePreviewClient = (props)=>{
                     apiRoute: apiRoute,
                     collectionConfig: collectionConfig,
                     config: config,
-                    fieldMap: fieldMap,
+                    fields: (collectionConfig || globalConfig)?.fields,
                     globalConfig: globalConfig,
                     schemaPath: schemaPath,
                     serverURL: serverURL

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/views/LivePreview/index.client.tsx"],"sourcesContent":["'use client'\nimport type { FormProps } from '@payloadcms/ui/forms/Form'\nimport type { FieldMap } from '@payloadcms/ui/utilities/buildComponentMap'\nimport type { LivePreviewConfig } from 'payload/config'\nimport type { ClientCollectionConfig, ClientConfig, ClientGlobalConfig, Data } from 'payload/types'\n\nimport { DocumentControls } from '@payloadcms/ui/elements/DocumentControls'\nimport { DocumentFields } from '@payloadcms/ui/elements/DocumentFields'\nimport { Form } from '@payloadcms/ui/forms/Form'\nimport { SetViewActions } from '@payloadcms/ui/providers/Actions'\nimport { useAuth } from '@payloadcms/ui/providers/Auth'\nimport { useComponentMap } from '@payloadcms/ui/providers/ComponentMap'\nimport { useConfig } from '@payloadcms/ui/providers/Config'\nimport { useDocumentEvents } from '@payloadcms/ui/providers/DocumentEvents'\nimport { useDocumentInfo } from '@payloadcms/ui/providers/DocumentInfo'\nimport { OperationProvider } from '@payloadcms/ui/providers/Operation'\nimport { useTranslation } from '@payloadcms/ui/providers/Translation'\nimport { getFormState } from '@payloadcms/ui/utilities/getFormState'\nimport React, { Fragment, useCallback } from 'react'\n\nimport { LeaveWithoutSaving } from '../../elements/LeaveWithoutSaving/index.js'\nimport { SetDocumentStepNav } from '../Edit/Default/SetDocumentStepNav/index.js'\nimport { SetDocumentTitle } from '../Edit/Default/SetDocumentTitle/index.js'\nimport { useLivePreviewContext } from './Context/context.js'\nimport { LivePreviewProvider } from './Context/index.js'\nimport { LivePreview } from './Preview/index.js'\nimport './index.scss'\nimport { usePopupWindow } from './usePopupWindow.js'\n\nconst baseClass = 'live-preview'\n\ntype Props = {\n  apiRoute: string\n  collectionConfig?: ClientCollectionConfig\n  config: ClientConfig\n  fieldMap: FieldMap\n  globalConfig?: ClientGlobalConfig\n  schemaPath: string\n  serverURL: string\n}\n\nconst PreviewView: React.FC<Props> = ({\n  apiRoute,\n  collectionConfig,\n  config,\n  fieldMap,\n  globalConfig,\n  schemaPath,\n  serverURL,\n}) => {\n  const {\n    id,\n    AfterDocument,\n    AfterFields,\n    BeforeDocument,\n    BeforeFields,\n    action,\n    apiURL,\n    collectionSlug,\n    disableActions,\n    disableLeaveWithoutSaving,\n    docPermissions,\n    getDocPreferences,\n    globalSlug,\n    hasPublishPermission,\n    hasSavePermission,\n    initialData,\n    initialState,\n    isEditing,\n    isInitializing,\n    onSave: onSaveFromProps,\n  } = useDocumentInfo()\n\n  const operation = id ? 'update' : 'create'\n\n  const {\n    admin: { user: userSlug },\n  } = useConfig()\n  const { t } = useTranslation()\n  const { previewWindowType } = useLivePreviewContext()\n  const { refreshCookieAsync, user } = useAuth()\n  const { reportUpdate } = useDocumentEvents()\n\n  const onSave = useCallback(\n    (json) => {\n      reportUpdate({\n        id,\n        entitySlug: collectionSlug,\n        updatedAt: json?.result?.updatedAt || new Date().toISOString(),\n      })\n\n      // If we're editing the doc of the logged-in user,\n      // Refresh the cookie to get new permissions\n      if (user && collectionSlug === userSlug && id === user.id) {\n        void refreshCookieAsync()\n      }\n\n      if (typeof onSaveFromProps === 'function') {\n        void onSaveFromProps({\n          ...json,\n          operation: id ? 'update' : 'create',\n        })\n      }\n    },\n    [collectionSlug, id, onSaveFromProps, refreshCookieAsync, reportUpdate, user, userSlug],\n  )\n\n  const onChange: FormProps['onChange'][0] = useCallback(\n    async ({ formState: prevFormState }) => {\n      const docPreferences = await getDocPreferences()\n\n      return getFormState({\n        apiRoute,\n        body: {\n          id,\n          docPreferences,\n          formState: prevFormState,\n          operation,\n          schemaPath,\n        },\n        serverURL,\n      })\n    },\n    [serverURL, apiRoute, id, operation, schemaPath, getDocPreferences],\n  )\n\n  return (\n    <Fragment>\n      <OperationProvider operation={operation}>\n        <Form\n          action={action}\n          className={`${baseClass}__form`}\n          disabled={!hasSavePermission}\n          initialState={initialState}\n          isInitializing={isInitializing}\n          method={id ? 'PATCH' : 'POST'}\n          onChange={[onChange]}\n          onSuccess={onSave}\n        >\n          {((collectionConfig &&\n            !(collectionConfig.versions?.drafts && collectionConfig.versions?.drafts?.autosave)) ||\n            (globalConfig &&\n              !(globalConfig.versions?.drafts && globalConfig.versions?.drafts?.autosave))) &&\n            !disableLeaveWithoutSaving && <LeaveWithoutSaving />}\n          <SetDocumentStepNav\n            collectionSlug={collectionSlug}\n            globalLabel={globalConfig?.label}\n            globalSlug={globalSlug}\n            id={id}\n            pluralLabel={collectionConfig ? collectionConfig?.labels?.plural : undefined}\n            useAsTitle={collectionConfig ? collectionConfig?.admin?.useAsTitle : undefined}\n            view={t('general:livePreview')}\n          />\n          <SetDocumentTitle\n            collectionConfig={collectionConfig}\n            config={config}\n            fallback={id?.toString() || ''}\n            globalConfig={globalConfig}\n          />\n          <DocumentControls\n            apiURL={apiURL}\n            data={initialData}\n            disableActions={disableActions}\n            hasPublishPermission={hasPublishPermission}\n            hasSavePermission={hasSavePermission}\n            id={id}\n            isEditing={isEditing}\n            permissions={docPermissions}\n            slug={collectionConfig?.slug || globalConfig?.slug}\n          />\n          <div\n            className={[baseClass, previewWindowType === 'popup' && `${baseClass}--detached`]\n              .filter(Boolean)\n              .join(' ')}\n          >\n            <div\n              className={[\n                `${baseClass}__main`,\n                previewWindowType === 'popup' && `${baseClass}__main--popup-open`,\n              ]\n                .filter(Boolean)\n                .join(' ')}\n            >\n              {BeforeDocument}\n              <DocumentFields\n                AfterFields={AfterFields}\n                BeforeFields={BeforeFields}\n                docPermissions={docPermissions}\n                fieldMap={fieldMap}\n                forceSidebarWrap\n                readOnly={!hasSavePermission}\n                schemaPath={collectionSlug || globalSlug}\n              />\n              {AfterDocument}\n            </div>\n            <LivePreview collectionSlug={collectionSlug} globalSlug={globalSlug} />\n          </div>\n        </Form>\n      </OperationProvider>\n    </Fragment>\n  )\n}\n\nexport const LivePreviewClient: React.FC<{\n  breakpoints: LivePreviewConfig['breakpoints']\n  initialData: Data\n  url: string\n}> = (props) => {\n  const { breakpoints, url } = props\n  const { collectionSlug, globalSlug } = useDocumentInfo()\n\n  const config = useConfig()\n\n  const { isPopupOpen, openPopupWindow, popupRef } = usePopupWindow({\n    eventType: 'payload-live-preview',\n    url,\n  })\n\n  const {\n    collections,\n    globals,\n    routes: { api: apiRoute },\n    serverURL,\n  } = config\n\n  const collectionConfig =\n    collectionSlug && collections.find((collection) => collection.slug === collectionSlug)\n\n  const globalConfig = globalSlug && globals.find((global) => global.slug === globalSlug)\n\n  const schemaPath = collectionSlug || globalSlug\n\n  const { getComponentMap } = useComponentMap()\n\n  const componentMap = getComponentMap({ collectionSlug, globalSlug })\n\n  const { getFieldMap } = useComponentMap()\n\n  const fieldMap = getFieldMap({\n    collectionSlug: collectionConfig?.slug,\n    globalSlug: globalConfig?.slug,\n  })\n\n  return (\n    <Fragment>\n      <SetViewActions actions={componentMap?.actionsMap?.Edit?.LivePreview} />\n      <LivePreviewProvider\n        breakpoints={breakpoints}\n        fieldSchema={collectionConfig?.fields || globalConfig?.fields}\n        isPopupOpen={isPopupOpen}\n        openPopupWindow={openPopupWindow}\n        popupRef={popupRef}\n        url={url}\n      >\n        <PreviewView\n          apiRoute={apiRoute}\n          collectionConfig={collectionConfig}\n          config={config}\n          fieldMap={fieldMap}\n          globalConfig={globalConfig}\n          schemaPath={schemaPath}\n          serverURL={serverURL}\n        />\n      </LivePreviewProvider>\n    </Fragment>\n  )\n}\n"],"names":["DocumentControls","DocumentFields","Form","SetViewActions","useAuth","useComponentMap","useConfig","useDocumentEvents","useDocumentInfo","OperationProvider","useTranslation","getFormState","React","Fragment","useCallback","LeaveWithoutSaving","SetDocumentStepNav","SetDocumentTitle","useLivePreviewContext","LivePreviewProvider","LivePreview","usePopupWindow","baseClass","PreviewView","apiRoute","collectionConfig","config","fieldMap","globalConfig","schemaPath","serverURL","id","AfterDocument","AfterFields","BeforeDocument","BeforeFields","action","apiURL","collectionSlug","disableActions","disableLeaveWithoutSaving","docPermissions","getDocPreferences","globalSlug","hasPublishPermission","hasSavePermission","initialData","initialState","isEditing","isInitializing","onSave","onSaveFromProps","operation","admin","user","userSlug","t","previewWindowType","refreshCookieAsync","reportUpdate","json","entitySlug","updatedAt","result","Date","toISOString","onChange","formState","prevFormState","docPreferences","body","className","disabled","method","onSuccess","versions","drafts","autosave","globalLabel","label","pluralLabel","labels","plural","undefined","useAsTitle","view","fallback","toString","data","permissions","slug","div","filter","Boolean","join","forceSidebarWrap","readOnly","LivePreviewClient","props","breakpoints","url","isPopupOpen","openPopupWindow","popupRef","eventType","collections","globals","routes","api","find","collection","global","getComponentMap","componentMap","getFieldMap","actions","actionsMap","Edit","fieldSchema","fields"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
+{"version":3,"sources":["../../../src/views/LivePreview/index.client.tsx"],"sourcesContent":["'use client'\nimport type { FormProps } from '@payloadcms/ui'\nimport type {\n  ClientCollectionConfig,\n  ClientConfig,\n  ClientField,\n  ClientGlobalConfig,\n  Data,\n  LivePreviewConfig,\n} from 'payload'\n\nimport {\n  DocumentControls,\n  DocumentFields,\n  Form,\n  OperationProvider,\n  SetViewActions,\n  useAuth,\n  useConfig,\n  useDocumentEvents,\n  useDocumentInfo,\n  useTranslation,\n} from '@payloadcms/ui'\nimport { getFormState } from '@payloadcms/ui/shared'\nimport React, { Fragment, useCallback } from 'react'\n\nimport { LeaveWithoutSaving } from '../../elements/LeaveWithoutSaving/index.js'\nimport { SetDocumentStepNav } from '../Edit/Default/SetDocumentStepNav/index.js'\nimport { SetDocumentTitle } from '../Edit/Default/SetDocumentTitle/index.js'\nimport { useLivePreviewContext } from './Context/context.js'\nimport { LivePreviewProvider } from './Context/index.js'\nimport { LivePreview } from './Preview/index.js'\nimport './index.scss'\nimport { usePopupWindow } from './usePopupWindow.js'\n\nconst baseClass = 'live-preview'\n\ntype Props = {\n  readonly apiRoute: string\n  readonly collectionConfig?: ClientCollectionConfig\n  readonly config: ClientConfig\n  readonly fields: ClientField[]\n  readonly globalConfig?: ClientGlobalConfig\n  readonly schemaPath: string\n  readonly serverURL: string\n}\n\nconst PreviewView: React.FC<Props> = ({\n  apiRoute,\n  collectionConfig,\n  config,\n  fields,\n  globalConfig,\n  schemaPath,\n  serverURL,\n}) => {\n  const {\n    id,\n    AfterDocument,\n    AfterFields,\n    BeforeDocument,\n    BeforeFields,\n    action,\n    apiURL,\n    collectionSlug,\n    disableActions,\n    disableLeaveWithoutSaving,\n    docPermissions,\n    getDocPreferences,\n    globalSlug,\n    hasPublishPermission,\n    hasSavePermission,\n    initialData,\n    initialState,\n    isEditing,\n    isInitializing,\n    onSave: onSaveFromProps,\n  } = useDocumentInfo()\n\n  const operation = id ? 'update' : 'create'\n\n  const {\n    config: {\n      admin: { user: userSlug },\n    },\n  } = useConfig()\n  const { t } = useTranslation()\n  const { previewWindowType } = useLivePreviewContext()\n  const { refreshCookieAsync, user } = useAuth()\n  const { reportUpdate } = useDocumentEvents()\n\n  const onSave = useCallback(\n    (json) => {\n      reportUpdate({\n        id,\n        entitySlug: collectionSlug,\n        updatedAt: json?.result?.updatedAt || new Date().toISOString(),\n      })\n\n      // If we're editing the doc of the logged-in user,\n      // Refresh the cookie to get new permissions\n      if (user && collectionSlug === userSlug && id === user.id) {\n        void refreshCookieAsync()\n      }\n\n      if (typeof onSaveFromProps === 'function') {\n        void onSaveFromProps({\n          ...json,\n          operation: id ? 'update' : 'create',\n        })\n      }\n    },\n    [collectionSlug, id, onSaveFromProps, refreshCookieAsync, reportUpdate, user, userSlug],\n  )\n\n  const onChange: FormProps['onChange'][0] = useCallback(\n    async ({ formState: prevFormState }) => {\n      const docPreferences = await getDocPreferences()\n\n      return getFormState({\n        apiRoute,\n        body: {\n          id,\n          docPreferences,\n          formState: prevFormState,\n          operation,\n          schemaPath,\n        },\n        serverURL,\n      })\n    },\n    [serverURL, apiRoute, id, operation, schemaPath, getDocPreferences],\n  )\n\n  return (\n    <OperationProvider operation={operation}>\n      <Form\n        action={action}\n        className={`${baseClass}__form`}\n        disabled={!hasSavePermission}\n        initialState={initialState}\n        isInitializing={isInitializing}\n        method={id ? 'PATCH' : 'POST'}\n        onChange={[onChange]}\n        onSuccess={onSave}\n      >\n        {((collectionConfig &&\n          !(collectionConfig.versions?.drafts && collectionConfig.versions?.drafts?.autosave)) ||\n          (globalConfig &&\n            !(globalConfig.versions?.drafts && globalConfig.versions?.drafts?.autosave))) &&\n          !disableLeaveWithoutSaving && <LeaveWithoutSaving />}\n        <SetDocumentStepNav\n          collectionSlug={collectionSlug}\n          globalLabel={globalConfig?.label}\n          globalSlug={globalSlug}\n          id={id}\n          pluralLabel={collectionConfig ? collectionConfig?.labels?.plural : undefined}\n          useAsTitle={collectionConfig ? collectionConfig?.admin?.useAsTitle : undefined}\n          view={t('general:livePreview')}\n        />\n        <SetDocumentTitle\n          collectionConfig={collectionConfig}\n          config={config}\n          fallback={id?.toString() || ''}\n          globalConfig={globalConfig}\n        />\n        <DocumentControls\n          apiURL={apiURL}\n          data={initialData}\n          disableActions={disableActions}\n          hasPublishPermission={hasPublishPermission}\n          hasSavePermission={hasSavePermission}\n          id={id}\n          isEditing={isEditing}\n          permissions={docPermissions}\n          slug={collectionConfig?.slug || globalConfig?.slug}\n        />\n        <div\n          className={[baseClass, previewWindowType === 'popup' && `${baseClass}--detached`]\n            .filter(Boolean)\n            .join(' ')}\n        >\n          <div\n            className={[\n              `${baseClass}__main`,\n              previewWindowType === 'popup' && `${baseClass}__main--popup-open`,\n            ]\n              .filter(Boolean)\n              .join(' ')}\n          >\n            {BeforeDocument}\n            <DocumentFields\n              AfterFields={AfterFields}\n              BeforeFields={BeforeFields}\n              docPermissions={docPermissions}\n              fields={fields}\n              forceSidebarWrap\n              readOnly={!hasSavePermission}\n              schemaPath={collectionSlug || globalSlug}\n            />\n            {AfterDocument}\n          </div>\n          <LivePreview collectionSlug={collectionSlug} globalSlug={globalSlug} />\n        </div>\n      </Form>\n    </OperationProvider>\n  )\n}\n\nexport const LivePreviewClient: React.FC<{\n  readonly breakpoints: LivePreviewConfig['breakpoints']\n  readonly initialData: Data\n  readonly url: string\n}> = (props) => {\n  const { breakpoints, url } = props\n  const { collectionSlug, globalSlug } = useDocumentInfo()\n\n  const {\n    config,\n    config: {\n      routes: { api: apiRoute },\n      serverURL,\n    },\n    getEntityConfig,\n  } = useConfig()\n\n  const { isPopupOpen, openPopupWindow, popupRef } = usePopupWindow({\n    eventType: 'payload-live-preview',\n    url,\n  })\n\n  const collectionConfig = getEntityConfig({ collectionSlug }) as ClientCollectionConfig\n\n  const globalConfig = getEntityConfig({ globalSlug }) as ClientGlobalConfig\n\n  const schemaPath = collectionSlug || globalSlug\n\n  return (\n    <Fragment>\n      <SetViewActions\n        actions={\n          (collectionConfig || globalConfig)?.admin?.components?.views?.edit?.livePreview?.actions\n        }\n      />\n      <LivePreviewProvider\n        breakpoints={breakpoints}\n        fieldSchema={collectionConfig?.fields || globalConfig?.fields}\n        isPopupOpen={isPopupOpen}\n        openPopupWindow={openPopupWindow}\n        popupRef={popupRef}\n        url={url}\n      >\n        <PreviewView\n          apiRoute={apiRoute}\n          collectionConfig={collectionConfig}\n          config={config}\n          fields={(collectionConfig || globalConfig)?.fields}\n          globalConfig={globalConfig}\n          schemaPath={schemaPath}\n          serverURL={serverURL}\n        />\n      </LivePreviewProvider>\n    </Fragment>\n  )\n}\n"],"names":["DocumentControls","DocumentFields","Form","OperationProvider","SetViewActions","useAuth","useConfig","useDocumentEvents","useDocumentInfo","useTranslation","getFormState","React","Fragment","useCallback","LeaveWithoutSaving","SetDocumentStepNav","SetDocumentTitle","useLivePreviewContext","LivePreviewProvider","LivePreview","usePopupWindow","baseClass","PreviewView","apiRoute","collectionConfig","config","fields","globalConfig","schemaPath","serverURL","id","AfterDocument","AfterFields","BeforeDocument","BeforeFields","action","apiURL","collectionSlug","disableActions","disableLeaveWithoutSaving","docPermissions","getDocPreferences","globalSlug","hasPublishPermission","hasSavePermission","initialData","initialState","isEditing","isInitializing","onSave","onSaveFromProps","operation","admin","user","userSlug","t","previewWindowType","refreshCookieAsync","reportUpdate","json","entitySlug","updatedAt","result","Date","toISOString","onChange","formState","prevFormState","docPreferences","body","className","disabled","method","onSuccess","versions","drafts","autosave","globalLabel","label","pluralLabel","labels","plural","undefined","useAsTitle","view","fallback","toString","data","permissions","slug","div","filter","Boolean","join","forceSidebarWrap","readOnly","LivePreviewClient","props","breakpoints","url","routes","api","getEntityConfig","isPopupOpen","openPopupWindow","popupRef","eventType","actions","components","views","edit","livePreview","fieldSchema"],"mappings":"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"}