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

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']>()\n\n  const [fields] = useAllFormFields()\n\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  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","fields","window","values","shouldSendSchema","current","message","type","data","externallyUpdatedRelationship","undefined","postMessage","contentWindow","div","className","filter","Boolean","join","ref","height"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA;AAIA,SAASA,aAAa,QAAQ,wCAAuC;AACrE,SAASC,gBAAgB,QAAQ,4BAA2B;AAC5D,SAASC,iBAAiB,QAAQ,0CAAyC;AAC3E,SAASC,oBAAoB,QAAQ,gDAA+C;AACpF,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;IAEd,MAAM,CAACC,OAAO,GAAGxB;IAEjB,6DAA6D;IAC7D,yCAAyC;IACzC,+CAA+C;IAC/CI,UAAU;QACR,4FAA4F;QAC5F,IAAIoB,UAAUC,UAAU,iBAAiBA,UAAUb,YAAY;YAC7D,MAAMc,SAASxB,qBAAqBsB,QAAQ;YAE5C,oFAAoF;YACpF,yEAAyE;YACzE,kEAAkE;YAClE,qGAAqG;YACrG,MAAMG,mBACJ,CAACL,eAAeM,OAAO,IAAIN,eAAeM,OAAO,KAAKZ;YAExDM,eAAeM,OAAO,GAAGZ;YAEzB,MAAMa,UAAU;gBACdC,MAAM;gBACNC,MAAML;gBACNM,+BAA+Bb;gBAC/BE,iBAAiBM,mBAAmBN,kBAAkBY;YACxD;YAEA,wCAAwC;YACxC,IAAIjB,sBAAsB,WAAWD,SAASa,OAAO,EAAE;gBACrDb,SAASa,OAAO,CAACM,WAAW,CAACL,SAASX;YACxC;YAEA,kCAAkC;YAClC,IAAIF,sBAAsB,YAAYF,UAAUc,OAAO,EAAE;gBACvDd,UAAUc,OAAO,CAACO,aAAa,EAAED,YAAYL,SAASX;YACxD;QACF;IACF,GAAG;QACDM;QACAN;QACAL;QACAG;QACAD;QACAH;QACAE;QACAG;QACAI;QACAF;KACD;IAED,IAAIH,sBAAsB,UAAU;QAClC,qBACE,oBAACoB;YACCC,WAAW;gBACT5B;gBACAW,cAAcA,eAAe,gBAAgB,CAAC,EAAEX,UAAU,gBAAgB,CAAC;aAC5E,CACE6B,MAAM,CAACC,SACPC,IAAI,CAAC;yBAER,oBAACJ;YAAIC,WAAW,CAAC,EAAE5B,UAAU,SAAS,CAAC;yBACrC,oBAACD,oBAAuBG,sBACxB,oBAACyB;YAAIC,WAAW,CAAC,EAAE5B,UAAU,MAAM,CAAC;yBAClC,oBAACH,uBACEY,oBACC,oBAACX;YAAOkC,KAAK3B;YAAWG,oBAAoBA;YAAoBC,KAAKA;2BAErE,oBAACnB;YAAc2C,QAAO;;IAOpC;AACF,EAAC"}
+{"version":3,"file":"index.js","names":["c","_c","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","t0","current","window","values","shouldSendSchema","message","type","data","externallyUpdatedRelationship","postMessage","contentWindow","t1","t2","message_0","t3","t4","t5","filter","Boolean","t6","join","t7","_jsx","className","children","_jsxs","ref","height"],"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"],"mappings":"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","ignoreList":[]}

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;AAMlD,OAAO,KAAK,MAAM,OAAO,CAAA;AAIzB,OAAO,cAAc,CAAA;AASrB,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CAwGnD,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,83 +1,150 @@
 'use client';
-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 { c as _c } from "react/compiler-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+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';
 const baseClass = 'live-preview-toolbar-controls';
-const zoomOptions = [
-    50,
-    75,
-    100,
-    125,
-    150,
-    200
-];
-const customOption = {
-    label: 'Custom',
-    value: 'custom'
-};
-export const ToolbarControls = ()=>{
-    const { breakpoint, breakpoints, setBreakpoint, setPreviewWindowType, setZoom, url, zoom } = useLivePreviewContext();
-    return /*#__PURE__*/ React.createElement("div", {
-        className: baseClass
-    }, breakpoints?.length > 0 && /*#__PURE__*/ React.createElement(Popup, {
-        button: /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("span", null, breakpoints.find((bp)=>bp.name == breakpoint)?.label ?? customOption.label), " ", /*#__PURE__*/ React.createElement(Chevron, {
+const zoomOptions = [50, 75, 100, 125, 150, 200];
+export const ToolbarControls = () => {
+  const $ = _c(14);
+  const {
+    breakpoint,
+    breakpoints,
+    setBreakpoint,
+    setPreviewWindowType,
+    setZoom,
+    url,
+    zoom
+  } = useLivePreviewContext();
+  const {
+    t
+  } = useTranslation();
+  let t0;
+  if ($[0] !== t || $[1] !== breakpoints || $[2] !== breakpoint || $[3] !== setBreakpoint || $[4] !== zoom || $[5] !== setZoom || $[6] !== setPreviewWindowType || $[7] !== url) {
+    const customOption = {
+      label: t("general:custom"),
+      value: "custom"
+    };
+    let t2;
+    if ($[9] !== zoom || $[10] !== setZoom) {
+      t2 = t3 => {
+        const {
+          close: close_0
+        } = t3;
+        return _jsx(PopupList.ButtonGroup, {
+          children: _jsx(React.Fragment, {
+            children: zoomOptions.map(zoomValue => _jsxs(PopupList.Button, {
+              active: zoom * 100 == zoomValue,
+              onClick: () => {
+                setZoom(zoomValue / 100);
+                close_0();
+              },
+              children: [zoomValue, "%"]
+            }, zoomValue))
+          })
+        });
+      };
+      $[9] = zoom;
+      $[10] = setZoom;
+      $[11] = t2;
+    } else {
+      t2 = $[11];
+    }
+    let t3;
+    if ($[12] !== setPreviewWindowType) {
+      t3 = e => {
+        e.preventDefault();
+        setPreviewWindowType("popup");
+      };
+      $[12] = setPreviewWindowType;
+      $[13] = t3;
+    } else {
+      t3 = $[13];
+    }
+    t0 = _jsxs("div", {
+      className: baseClass,
+      children: [breakpoints?.length > 0 && _jsx(Popup, {
+        button: _jsxs(React.Fragment, {
+          children: [_jsx("span", {
+            children: breakpoints.find(bp => bp.name == breakpoint)?.label ?? customOption.label
+          }), "\xA0", _jsx(ChevronIcon, {
             className: `${baseClass}__chevron`
-        })),
+          })]
+        }),
         className: `${baseClass}__breakpoint`,
         horizontalAlign: "right",
-        render: ({ close })=>/*#__PURE__*/ React.createElement(PopupList.ButtonGroup, null, /*#__PURE__*/ React.createElement(React.Fragment, null, breakpoints.map((bp)=>/*#__PURE__*/ React.createElement(PopupList.Button, {
-                    active: bp.name == breakpoint,
-                    key: bp.name,
-                    onClick: ()=>{
-                        setBreakpoint(bp.name);
-                        close();
-                    }
-                }, bp.label)), breakpoint === 'custom' && /*#__PURE__*/ React.createElement(PopupList.Button, {
+        render: t1 => {
+          const {
+            close
+          } = t1;
+          return _jsx(PopupList.ButtonGroup, {
+            children: _jsxs(React.Fragment, {
+              children: [breakpoints.map(bp_0 => _jsx(PopupList.Button, {
+                active: bp_0.name == breakpoint,
+                onClick: () => {
+                  setBreakpoint(bp_0.name);
+                  close();
+                },
+                children: bp_0.label
+              }, bp_0.name)), breakpoint === "custom" && _jsx(PopupList.Button, {
                 active: breakpoint == customOption.value,
-                onClick: ()=>{
-                    setBreakpoint(customOption.value);
-                    close();
-                }
-            }, customOption.label))),
+                onClick: () => {
+                  setBreakpoint(customOption.value);
+                  close();
+                },
+                children: customOption.label
+              })]
+            })
+          });
+        },
         showScrollbar: true,
         verticalAlign: "bottom"
-    }), /*#__PURE__*/ React.createElement("div", {
-        className: `${baseClass}__device-size`
-    }, /*#__PURE__*/ React.createElement(PreviewFrameSizeInput, {
-        axis: "x"
-    }), /*#__PURE__*/ React.createElement("span", {
-        className: `${baseClass}__size-divider`
-    }, /*#__PURE__*/ React.createElement(X, null)), /*#__PURE__*/ React.createElement(PreviewFrameSizeInput, {
-        axis: "y"
-    })), /*#__PURE__*/ React.createElement(Popup, {
-        button: /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("span", null, zoom * 100, "%"), " ", /*#__PURE__*/ React.createElement(Chevron, {
+      }), _jsxs("div", {
+        className: `${baseClass}__device-size`,
+        children: [_jsx(PreviewFrameSizeInput, {
+          axis: "x"
+        }), _jsx("span", {
+          className: `${baseClass}__size-divider`,
+          children: _jsx(XIcon, {})
+        }), _jsx(PreviewFrameSizeInput, {
+          axis: "y"
+        })]
+      }), _jsx(Popup, {
+        button: _jsxs(React.Fragment, {
+          children: [_jsxs("span", {
+            children: [zoom * 100, "%"]
+          }), "\xA0", _jsx(ChevronIcon, {
             className: `${baseClass}__chevron`
-        })),
+          })]
+        }),
         className: `${baseClass}__zoom`,
         horizontalAlign: "right",
-        render: ({ close })=>/*#__PURE__*/ React.createElement(PopupList.ButtonGroup, null, /*#__PURE__*/ React.createElement(React.Fragment, null, zoomOptions.map((zoomValue)=>/*#__PURE__*/ React.createElement(PopupList.Button, {
-                    active: zoom * 100 == zoomValue,
-                    key: zoomValue,
-                    onClick: ()=>{
-                        setZoom(zoomValue / 100);
-                        close();
-                    }
-                }, zoomValue, "%")))),
+        render: t2,
         showScrollbar: true,
         verticalAlign: "bottom"
-    }), /*#__PURE__*/ React.createElement("a", {
+      }), _jsx("a", {
         className: `${baseClass}__external`,
         href: url,
-        onClick: (e)=>{
-            e.preventDefault();
-            setPreviewWindowType('popup');
-        },
-        type: "button"
-    }, /*#__PURE__*/ React.createElement(LinkIcon, null)));
+        onClick: t3,
+        type: "button",
+        children: _jsx(LinkIcon, {})
+      })]
+    });
+    $[0] = t;
+    $[1] = breakpoints;
+    $[2] = breakpoint;
+    $[3] = setBreakpoint;
+    $[4] = zoom;
+    $[5] = setZoom;
+    $[6] = setPreviewWindowType;
+    $[7] = url;
+    $[8] = t0;
+  } else {
+    t0 = $[8];
+  }
+  return t0;
 };
-
 //# sourceMappingURL=index.js.map

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 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]\nconst customOption = {\n  label: 'Custom', // TODO: Add i18n to this string\n  value: 'custom',\n}\n\nexport const ToolbarControls: React.FC<EditViewProps> = () => {\n  const { breakpoint, breakpoints, setBreakpoint, setPreviewWindowType, setZoom, url, zoom } =\n    useLivePreviewContext()\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","React","useLivePreviewContext","PreviewFrameSizeInput","baseClass","zoomOptions","customOption","label","value","ToolbarControls","breakpoint","breakpoints","setBreakpoint","setPreviewWindowType","setZoom","url","zoom","div","className","length","button","Fragment","span","find","bp","name","horizontalAlign","render","close","ButtonGroup","map","Button","active","key","onClick","showScrollbar","verticalAlign","axis","zoomValue","a","href","e","preventDefault","type"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA;AAIA,SAASA,KAAK,EAAEC,SAAS,QAAQ,gCAA+B;AAChE,SAASC,OAAO,QAAQ,+BAA8B;AACtD,SAASC,QAAQ,QAAQ,4BAA2B;AACpD,SAASC,CAAC,QAAQ,yBAAwB;AAC1C,OAAOC,WAAW,QAAO;AAEzB,SAASC,qBAAqB,QAAQ,2BAA0B;AAChE,SAASC,qBAAqB,QAAQ,wBAAuB;AAG7D,MAAMC,YAAY;AAClB,MAAMC,cAAc;IAAC;IAAI;IAAI;IAAK;IAAK;IAAK;CAAI;AAChD,MAAMC,eAAe;IACnBC,OAAO;IACPC,OAAO;AACT;AAEA,OAAO,MAAMC,kBAA2C;IACtD,MAAM,EAAEC,UAAU,EAAEC,WAAW,EAAEC,aAAa,EAAEC,oBAAoB,EAAEC,OAAO,EAAEC,GAAG,EAAEC,IAAI,EAAE,GACxFd;IAEF,qBACE,oBAACe;QAAIC,WAAWd;OACbO,aAAaQ,SAAS,mBACrB,oBAACvB;QACCwB,sBACE,oBAACnB,MAAMoB,QAAQ,sBACb,oBAACC,cACEX,YAAYY,IAAI,CAAC,CAACC,KAAOA,GAAGC,IAAI,IAAIf,aAAaH,SAASD,aAAaC,KAAK,GACxE,mBAEP,oBAACT;YAAQoB,WAAW,CAAC,EAAEd,UAAU,SAAS,CAAC;;QAG/Cc,WAAW,CAAC,EAAEd,UAAU,YAAY,CAAC;QACrCsB,iBAAgB;QAChBC,QAAQ,CAAC,EAAEC,KAAK,EAAE,iBAChB,oBAAC/B,UAAUgC,WAAW,sBACpB,oBAAC5B,MAAMoB,QAAQ,QACZV,YAAYmB,GAAG,CAAC,CAACN,mBAChB,oBAAC3B,UAAUkC,MAAM;oBACfC,QAAQR,GAAGC,IAAI,IAAIf;oBACnBuB,KAAKT,GAAGC,IAAI;oBACZS,SAAS;wBACPtB,cAAcY,GAAGC,IAAI;wBACrBG;oBACF;mBAECJ,GAAGjB,KAAK,IAIZG,eAAe,0BACd,oBAACb,UAAUkC,MAAM;gBACfC,QAAQtB,cAAcJ,aAAaE,KAAK;gBACxC0B,SAAS;oBACPtB,cAAcN,aAAaE,KAAK;oBAChCoB;gBACF;eAECtB,aAAaC,KAAK;QAM7B4B,eAAAA;QACAC,eAAc;sBAGlB,oBAACnB;QAAIC,WAAW,CAAC,EAAEd,UAAU,aAAa,CAAC;qBACzC,oBAACD;QAAsBkC,MAAK;sBAC5B,oBAACf;QAAKJ,WAAW,CAAC,EAAEd,UAAU,cAAc,CAAC;qBAC3C,oBAACJ,yBAEH,oBAACG;QAAsBkC,MAAK;uBAE9B,oBAACzC;QACCwB,sBACE,oBAACnB,MAAMoB,QAAQ,sBACb,oBAACC,cAAMN,OAAO,KAAI,MAAQ,mBAE1B,oBAAClB;YAAQoB,WAAW,CAAC,EAAEd,UAAU,SAAS,CAAC;;QAG/Cc,WAAW,CAAC,EAAEd,UAAU,MAAM,CAAC;QAC/BsB,iBAAgB;QAChBC,QAAQ,CAAC,EAAEC,KAAK,EAAE,iBAChB,oBAAC/B,UAAUgC,WAAW,sBACpB,oBAAC5B,MAAMoB,QAAQ,QACZhB,YAAYyB,GAAG,CAAC,CAACQ,0BAChB,oBAACzC,UAAUkC,MAAM;oBACfC,QAAQhB,OAAO,OAAOsB;oBACtBL,KAAKK;oBACLJ,SAAS;wBACPpB,QAAQwB,YAAY;wBACpBV;oBACF;mBAECU,WAAU;QAMrBH,eAAAA;QACAC,eAAc;sBAEhB,oBAACG;QACCrB,WAAW,CAAC,EAAEd,UAAU,UAAU,CAAC;QACnCoC,MAAMzB;QACNmB,SAAS,CAACO;YACRA,EAAEC,cAAc;YAChB7B,qBAAqB;QACvB;QACA8B,MAAK;qBAEL,oBAAC5C;AAIT,EAAC"}
+{"version":3,"file":"index.js","names":["c","_c","ChevronIcon","LinkIcon","Popup","PopupList","XIcon","useTranslation","React","useLivePreviewContext","PreviewFrameSizeInput","baseClass","zoomOptions","ToolbarControls","$","breakpoint","breakpoints","setBreakpoint","setPreviewWindowType","setZoom","url","zoom","t","t0","customOption","label","value","t2","t3","close","close_0","_jsx","ButtonGroup","children","Fragment","map","zoomValue","_jsxs","Button","active","onClick","e","preventDefault","className","length","button","find","bp","name","horizontalAlign","render","t1","bp_0","axis","href","type"],"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"],"mappings":"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","ignoreList":[]}

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

@@ -1,60 +1,99 @@
 'use client';
+
+import { c as _c } from "react/compiler-runtime";
+import { jsx as _jsx } from "react/jsx-runtime";
 import React, { useCallback, useEffect } from 'react';
 import { useLivePreviewContext } from '../../Context/context.js';
 const baseClass = 'toolbar-input';
-export const PreviewFrameSizeInput = (props)=>{
-    const { axis } = props;
-    const { breakpoint, measuredDeviceSize, setBreakpoint, setSize, size, zoom } = useLivePreviewContext();
-    const [internalState, setInternalState] = React.useState((axis === 'x' ? measuredDeviceSize?.width : measuredDeviceSize?.height) || 0);
-    // when the input is changed manually, we need to set the breakpoint as `custom`
-    // this will then allow us to set an explicit width and height
-    const handleChange = useCallback((e)=>{
-        let newValue = Number(e.target.value);
-        if (newValue < 0) newValue = 0;
-        setInternalState(newValue);
-        setBreakpoint('custom');
-        // be sure to set _both_ axis values to so that the other axis doesn't fallback to 0 on initial change
-        // this is because the `responsive` size is '100%' in CSS, and `0` in initial state
-        setSize({
-            type: 'reset',
-            value: {
-                height: axis === 'y' ? newValue : Number(measuredDeviceSize?.height.toFixed(0)) * zoom,
-                width: axis === 'x' ? newValue : Number(measuredDeviceSize?.width.toFixed(0)) * zoom
-            }
-        });
-    }, [
-        axis,
-        setBreakpoint,
-        measuredDeviceSize,
-        setSize,
-        zoom
-    ]);
-    // if the breakpoint is `responsive` then the device's div will have `100%` width and height
-    // so we need to take the measurements provided by `actualDeviceSize` and sync internal state
-    useEffect(()=>{
-        if (breakpoint === 'responsive' && measuredDeviceSize) {
-            if (axis === 'x') setInternalState(Number(measuredDeviceSize.width.toFixed(0)) * zoom);
-            else setInternalState(Number(measuredDeviceSize.height.toFixed(0)) * zoom);
+export const PreviewFrameSizeInput = props => {
+  const $ = _c(17);
+  const {
+    axis
+  } = props;
+  const {
+    breakpoint,
+    measuredDeviceSize,
+    setBreakpoint,
+    setSize,
+    size,
+    zoom
+  } = useLivePreviewContext();
+  const [internalState, setInternalState] = React.useState((axis === "x" ? measuredDeviceSize?.width : measuredDeviceSize?.height) || 0);
+  let t0;
+  if ($[0] !== setBreakpoint || $[1] !== setSize || $[2] !== axis || $[3] !== measuredDeviceSize || $[4] !== zoom) {
+    t0 = e => {
+      let newValue = Number(e.target.value);
+      if (newValue < 0) {
+        newValue = 0;
+      }
+      setInternalState(newValue);
+      setBreakpoint("custom");
+      setSize({
+        type: "reset",
+        value: {
+          height: axis === "y" ? newValue : Number(measuredDeviceSize?.height.toFixed(0)) * zoom,
+          width: axis === "x" ? newValue : Number(measuredDeviceSize?.width.toFixed(0)) * zoom
         }
-        if (breakpoint !== 'responsive' && size) {
-            setInternalState(axis === 'x' ? size.width : size.height);
+      });
+    };
+    $[0] = setBreakpoint;
+    $[1] = setSize;
+    $[2] = axis;
+    $[3] = measuredDeviceSize;
+    $[4] = zoom;
+    $[5] = t0;
+  } else {
+    t0 = $[5];
+  }
+  const handleChange = t0;
+  let t1;
+  let t2;
+  if ($[6] !== breakpoint || $[7] !== measuredDeviceSize || $[8] !== axis || $[9] !== zoom || $[10] !== size) {
+    t1 = () => {
+      if (breakpoint === "responsive" && measuredDeviceSize) {
+        if (axis === "x") {
+          setInternalState(Number(measuredDeviceSize.width.toFixed(0)) * zoom);
+        } else {
+          setInternalState(Number(measuredDeviceSize.height.toFixed(0)) * zoom);
         }
-    }, [
-        breakpoint,
-        axis,
-        measuredDeviceSize,
-        size,
-        zoom
-    ]);
-    return /*#__PURE__*/ React.createElement("input", {
-        className: baseClass,
-        min: 0,
-        name: axis === 'x' ? 'live-preview-width' : 'live-preview-height',
-        onChange: handleChange,
-        step: 1,
-        type: "number",
-        value: internalState || 0
+      }
+      if (breakpoint !== "responsive" && size) {
+        setInternalState(axis === "x" ? size.width : size.height);
+      }
+    };
+    t2 = [breakpoint, axis, measuredDeviceSize, size, zoom];
+    $[6] = breakpoint;
+    $[7] = measuredDeviceSize;
+    $[8] = axis;
+    $[9] = zoom;
+    $[10] = size;
+    $[11] = t1;
+    $[12] = t2;
+  } else {
+    t1 = $[11];
+    t2 = $[12];
+  }
+  useEffect(t1, t2);
+  const t3 = axis === "x" ? "live-preview-width" : "live-preview-height";
+  const t4 = internalState || 0;
+  let t5;
+  if ($[13] !== t3 || $[14] !== handleChange || $[15] !== t4) {
+    t5 = _jsx("input", {
+      className: baseClass,
+      min: 0,
+      name: t3,
+      onChange: handleChange,
+      step: 1,
+      type: "number",
+      value: t4
     });
+    $[13] = t3;
+    $[14] = handleChange;
+    $[15] = t4;
+    $[16] = t5;
+  } else {
+    t5 = $[16];
+  }
+  return t5;
 };
-
 //# sourceMappingURL=index.js.map

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,oBAACc;QACCC,WAAWxB;QACXyB,KAAK;QACLC,MAAMvB,SAAS,MAAM,uBAAuB;QAC5CwB,UAAUZ;QACVa,MAAM;QACNP,MAAK;QACLD,OAAOV,iBAAiB;;AAG9B,EAAC"}
+{"version":3,"file":"index.js","names":["c","_c","React","useCallback","useEffect","useLivePreviewContext","baseClass","PreviewFrameSizeInput","props","$","axis","breakpoint","measuredDeviceSize","setBreakpoint","setSize","size","zoom","internalState","setInternalState","useState","width","height","t0","e","newValue","Number","target","value","type","toFixed","handleChange","t1","t2","t3","t4","t5","_jsx","className","min","name","onChange","step"],"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"],"mappings":"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","ignoreList":[]}

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"}