@payloadcms/next 3.0.0-beta.6 → 3.0.0-beta.61

package/dist/views/List/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/views/List/index.tsx"],"names":[],"mappings":"AASA,OAAO,EAAE,KAAK,cAAc,EAAE,MAAM,eAAe,CAAA;AAEnD,OAAO,KAAmB,MAAM,OAAO,CAAA;AAOvC,OAAO,EAAE,oBAAoB,EAAE,MAAM,WAAW,CAAA;AAEhD,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,cAAc,CAqI7C,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/views/List/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAS,MAAM,SAAS,CAAA;AAYpD,OAAO,KAAmB,MAAM,OAAO,CAAA;AAMvC,OAAO,EAAE,oBAAoB,EAAE,MAAM,WAAW,CAAA;AAEhD,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,cAAc,CA8J7C,CAAA"}

package/dist/views/List/index.js

@@ -1,23 +1,17 @@
-import { HydrateClientUser } from '@payloadcms/ui/elements/HydrateClientUser';
-import { RenderCustomComponent } from '@payloadcms/ui/elements/RenderCustomComponent';
-import { TableColumnsProvider } from '@payloadcms/ui/elements/TableColumns';
-import { ListInfoProvider } from '@payloadcms/ui/providers/ListInfo';
-import { ListQueryProvider } from '@payloadcms/ui/providers/ListQuery';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { HydrateClientUser, ListInfoProvider, ListQueryProvider, TableColumnsProvider } from '@payloadcms/ui';
+import { RenderCustomComponent } from '@payloadcms/ui/shared';
 import { notFound } from 'next/navigation.js';
-import { createClientCollectionConfig } from 'payload/config';
-import { isNumber, mergeListSearchAndWhere } from 'payload/utilities';
+import { createClientCollectionConfig, mergeListSearchAndWhere } from 'payload';
+import { isNumber, isReactComponentOrFunction } from 'payload/shared';
 import React, { Fragment } from 'react';
-import { UnauthorizedView } from '../Unauthorized/index.js';
 import { DefaultListView } from './Default/index.js';
 export { generateListMetadata } from './meta.js';
-export const ListView = async ({ initPageResult, searchParams })=>{
-    const { collectionConfig, permissions, req: { locale, payload, payload: { config }, query, user }, visibleEntities } = initPageResult;
+export const ListView = async ({ initPageResult, params, searchParams })=>{
+    const { collectionConfig, locale: fullLocale, permissions, req, req: { i18n, locale, payload, payload: { config }, query, user }, visibleEntities } = initPageResult;
     const collectionSlug = collectionConfig?.slug;
     if (!permissions?.collections?.[collectionSlug]?.read?.permission) {
-        return /*#__PURE__*/ React.createElement(UnauthorizedView, {
-            initPageResult: initPageResult,
-            searchParams: searchParams
-        });
+        notFound();
     }
     let listPreferences;
     const preferenceKey = `${collectionSlug}-list`;
@@ -26,6 +20,7 @@ export const ListView = async ({ initPageResult, searchParams })=>{
             collection: 'payload-preferences',
             depth: 0,
             limit: 1,
+            req,
             user,
             where: {
                 key: {
@@ -43,10 +38,10 @@ export const ListView = async ({ initPageResult, searchParams })=>{
         let CustomListView = null;
         if (CustomList && typeof CustomList === 'function') {
             CustomListView = CustomList;
-        } else if (typeof CustomList === 'object' && typeof CustomList.Component === 'function') {
+        } else if (typeof CustomList === 'object' && isReactComponentOrFunction(CustomList.Component)) {
             CustomListView = CustomList.Component;
         }
-        const page = isNumber(query?.page) ? query.page : 0;
+        const page = isNumber(query?.page) ? Number(query.page) : 0;
         const whereQuery = mergeListSearchAndWhere({
             collectionConfig,
             query: {
@@ -54,8 +49,8 @@ export const ListView = async ({ initPageResult, searchParams })=>{
                 where: query?.where || undefined
             }
         });
-        const limit = isNumber(query?.limit) ? query.limit : listPreferences?.limit || collectionConfig.admin.pagination.defaultLimit;
-        const sort = query?.sort && typeof query.sort === 'string' ? query.sort : listPreferences?.sort || undefined;
+        const limit = isNumber(query?.limit) ? Number(query.limit) : listPreferences?.limit || collectionConfig.admin.pagination.defaultLimit;
+        const sort = query?.sort && typeof query.sort === 'string' ? query.sort : listPreferences?.sort || collectionConfig.defaultSort || undefined;
         const data = await payload.find({
             collection: collectionSlug,
             depth: 0,
@@ -65,6 +60,7 @@ export const ListView = async ({ initPageResult, searchParams })=>{
             locale,
             overrideAccess: false,
             page,
+            req,
             sort,
             user,
             where: whereQuery || {}
@@ -73,33 +69,56 @@ export const ListView = async ({ initPageResult, searchParams })=>{
             collectionSlug,
             listSearchableFields: collectionConfig.admin.listSearchableFields
         };
-        return /*#__PURE__*/ React.createElement(Fragment, null, /*#__PURE__*/ React.createElement(HydrateClientUser, {
-            permissions: permissions,
-            user: user
-        }), /*#__PURE__*/ React.createElement(ListInfoProvider, {
-            collectionConfig: createClientCollectionConfig({
-                collection: collectionConfig,
-                t: initPageResult.req.i18n.t
-            }),
-            collectionSlug: collectionSlug,
-            hasCreatePermission: permissions?.collections?.[collectionSlug]?.create?.permission,
-            newDocumentURL: `${admin}/collections/${collectionSlug}/create`
-        }, /*#__PURE__*/ React.createElement(ListQueryProvider, {
-            data: data,
-            defaultLimit: limit || collectionConfig?.admin?.pagination?.defaultLimit,
-            defaultSort: sort,
-            modifySearchParams: true,
-            preferenceKey: preferenceKey
-        }, /*#__PURE__*/ React.createElement(TableColumnsProvider, {
-            collectionSlug: collectionSlug,
-            enableRowSelections: true,
-            listPreferences: listPreferences,
-            preferenceKey: preferenceKey
-        }, /*#__PURE__*/ React.createElement(RenderCustomComponent, {
-            CustomComponent: CustomListView,
-            DefaultComponent: DefaultListView,
-            componentProps: viewComponentProps
-        })))));
+        return /*#__PURE__*/ _jsxs(Fragment, {
+            children: [
+                /*#__PURE__*/ _jsx(HydrateClientUser, {
+                    permissions: permissions,
+                    user: user
+                }),
+                /*#__PURE__*/ _jsx(ListInfoProvider, {
+                    collectionConfig: createClientCollectionConfig({
+                        collection: collectionConfig,
+                        t: initPageResult.req.i18n.t
+                    }),
+                    collectionSlug: collectionSlug,
+                    hasCreatePermission: permissions?.collections?.[collectionSlug]?.create?.permission,
+                    newDocumentURL: `${admin}/collections/${collectionSlug}/create`,
+                    children: /*#__PURE__*/ _jsx(ListQueryProvider, {
+                        data: data,
+                        defaultLimit: limit || collectionConfig?.admin?.pagination?.defaultLimit,
+                        defaultSort: sort,
+                        modifySearchParams: true,
+                        preferenceKey: preferenceKey,
+                        children: /*#__PURE__*/ _jsx(TableColumnsProvider, {
+                            collectionSlug: collectionSlug,
+                            enableRowSelections: true,
+                            listPreferences: listPreferences,
+                            preferenceKey: preferenceKey,
+                            children: /*#__PURE__*/ _jsx(RenderCustomComponent, {
+                                CustomComponent: CustomListView,
+                                DefaultComponent: DefaultListView,
+                                componentProps: viewComponentProps,
+                                serverOnlyProps: {
+                                    collectionConfig,
+                                    data,
+                                    hasCreatePermission: permissions?.collections?.[collectionSlug]?.create?.permission,
+                                    i18n,
+                                    limit,
+                                    listPreferences,
+                                    locale: fullLocale,
+                                    newDocumentURL: `${admin}/collections/${collectionSlug}/create`,
+                                    params,
+                                    payload,
+                                    permissions,
+                                    searchParams,
+                                    user
+                                }
+                            })
+                        })
+                    })
+                })
+            ]
+        });
     }
     return notFound();
 };

package/dist/views/List/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/views/List/index.tsx"],"sourcesContent":["import type { Where } from 'payload/types'\n\nimport { HydrateClientUser } from '@payloadcms/ui/elements/HydrateClientUser'\nimport { RenderCustomComponent } from '@payloadcms/ui/elements/RenderCustomComponent'\nimport { TableColumnsProvider } from '@payloadcms/ui/elements/TableColumns'\nimport { ListInfoProvider } from '@payloadcms/ui/providers/ListInfo'\nimport { ListQueryProvider } from '@payloadcms/ui/providers/ListQuery'\nimport { notFound } from 'next/navigation.js'\nimport { createClientCollectionConfig } from 'payload/config'\nimport { type AdminViewProps } from 'payload/types'\nimport { isNumber, mergeListSearchAndWhere } from 'payload/utilities'\nimport React, { Fragment } from 'react'\n\nimport type { DefaultListViewProps, ListPreferences } from './Default/types.js'\n\nimport { UnauthorizedView } from '../Unauthorized/index.js'\nimport { DefaultListView } from './Default/index.js'\n\nexport { generateListMetadata } from './meta.js'\n\nexport const ListView: React.FC<AdminViewProps> = async ({ initPageResult, searchParams }) => {\n  const {\n    collectionConfig,\n    permissions,\n    req: {\n      locale,\n      payload,\n      payload: { config },\n      query,\n      user,\n    },\n    visibleEntities,\n  } = initPageResult\n\n  const collectionSlug = collectionConfig?.slug\n\n  if (!permissions?.collections?.[collectionSlug]?.read?.permission) {\n    return <UnauthorizedView initPageResult={initPageResult} searchParams={searchParams} />\n  }\n\n  let listPreferences: ListPreferences\n  const preferenceKey = `${collectionSlug}-list`\n\n  try {\n    listPreferences = (await payload\n      .find({\n        collection: 'payload-preferences',\n        depth: 0,\n        limit: 1,\n        user,\n        where: {\n          key: {\n            equals: preferenceKey,\n          },\n        },\n      })\n      ?.then((res) => res?.docs?.[0]?.value)) as ListPreferences\n  } catch (error) {} // eslint-disable-line no-empty\n\n  const {\n    routes: { admin },\n  } = config\n\n  if (collectionConfig) {\n    const {\n      admin: { components: { views: { List: CustomList } = {} } = {} },\n    } = collectionConfig\n\n    if (!visibleEntities.collections.includes(collectionSlug)) {\n      return notFound()\n    }\n\n    let CustomListView = null\n\n    if (CustomList && typeof CustomList === 'function') {\n      CustomListView = CustomList\n    } else if (typeof CustomList === 'object' && typeof CustomList.Component === 'function') {\n      CustomListView = CustomList.Component\n    }\n\n    const page = isNumber(query?.page) ? query.page : 0\n    const whereQuery = mergeListSearchAndWhere({\n      collectionConfig,\n      query: {\n        search: typeof query?.search === 'string' ? query.search : undefined,\n        where: (query?.where as Where) || undefined,\n      },\n    })\n    const limit = isNumber(query?.limit)\n      ? query.limit\n      : listPreferences?.limit || collectionConfig.admin.pagination.defaultLimit\n    const sort =\n      query?.sort && typeof query.sort === 'string'\n        ? query.sort\n        : listPreferences?.sort || undefined\n\n    const data = await payload.find({\n      collection: collectionSlug,\n      depth: 0,\n      draft: true,\n      fallbackLocale: null,\n      limit,\n      locale,\n      overrideAccess: false,\n      page,\n      sort,\n      user,\n      where: whereQuery || {},\n    })\n\n    const viewComponentProps: DefaultListViewProps = {\n      collectionSlug,\n      listSearchableFields: collectionConfig.admin.listSearchableFields,\n    }\n\n    return (\n      <Fragment>\n        <HydrateClientUser permissions={permissions} user={user} />\n        <ListInfoProvider\n          collectionConfig={createClientCollectionConfig({\n            collection: collectionConfig,\n            t: initPageResult.req.i18n.t,\n          })}\n          collectionSlug={collectionSlug}\n          hasCreatePermission={permissions?.collections?.[collectionSlug]?.create?.permission}\n          newDocumentURL={`${admin}/collections/${collectionSlug}/create`}\n        >\n          <ListQueryProvider\n            data={data}\n            defaultLimit={limit || collectionConfig?.admin?.pagination?.defaultLimit}\n            defaultSort={sort}\n            modifySearchParams\n            preferenceKey={preferenceKey}\n          >\n            <TableColumnsProvider\n              collectionSlug={collectionSlug}\n              enableRowSelections\n              listPreferences={listPreferences}\n              preferenceKey={preferenceKey}\n            >\n              <RenderCustomComponent\n                CustomComponent={CustomListView}\n                DefaultComponent={DefaultListView}\n                componentProps={viewComponentProps}\n              />\n            </TableColumnsProvider>\n          </ListQueryProvider>\n        </ListInfoProvider>\n      </Fragment>\n    )\n  }\n\n  return notFound()\n}\n"],"names":["HydrateClientUser","RenderCustomComponent","TableColumnsProvider","ListInfoProvider","ListQueryProvider","notFound","createClientCollectionConfig","isNumber","mergeListSearchAndWhere","React","Fragment","UnauthorizedView","DefaultListView","generateListMetadata","ListView","initPageResult","searchParams","collectionConfig","permissions","req","locale","payload","config","query","user","visibleEntities","collectionSlug","slug","collections","read","permission","listPreferences","preferenceKey","find","collection","depth","limit","where","key","equals","then","res","docs","value","error","routes","admin","components","views","List","CustomList","includes","CustomListView","Component","page","whereQuery","search","undefined","pagination","defaultLimit","sort","data","draft","fallbackLocale","overrideAccess","viewComponentProps","listSearchableFields","t","i18n","hasCreatePermission","create","newDocumentURL","defaultSort","modifySearchParams","enableRowSelections","CustomComponent","DefaultComponent","componentProps"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAEA,SAASA,iBAAiB,QAAQ,4CAA2C;AAC7E,SAASC,qBAAqB,QAAQ,gDAA+C;AACrF,SAASC,oBAAoB,QAAQ,uCAAsC;AAC3E,SAASC,gBAAgB,QAAQ,oCAAmC;AACpE,SAASC,iBAAiB,QAAQ,qCAAoC;AACtE,SAASC,QAAQ,QAAQ,qBAAoB;AAC7C,SAASC,4BAA4B,QAAQ,iBAAgB;AAE7D,SAASC,QAAQ,EAAEC,uBAAuB,QAAQ,oBAAmB;AACrE,OAAOC,SAASC,QAAQ,QAAQ,QAAO;AAIvC,SAASC,gBAAgB,QAAQ,2BAA0B;AAC3D,SAASC,eAAe,QAAQ,qBAAoB;AAEpD,SAASC,oBAAoB,QAAQ,YAAW;AAEhD,OAAO,MAAMC,WAAqC,OAAO,EAAEC,cAAc,EAAEC,YAAY,EAAE;IACvF,MAAM,EACJC,gBAAgB,EAChBC,WAAW,EACXC,KAAK,EACHC,MAAM,EACNC,OAAO,EACPA,SAAS,EAAEC,MAAM,EAAE,EACnBC,KAAK,EACLC,IAAI,EACL,EACDC,eAAe,EAChB,GAAGV;IAEJ,MAAMW,iBAAiBT,kBAAkBU;IAEzC,IAAI,CAACT,aAAaU,aAAa,CAACF,eAAe,EAAEG,MAAMC,YAAY;QACjE,qBAAO,oBAACnB;YAAiBI,gBAAgBA;YAAgBC,cAAcA;;IACzE;IAEA,IAAIe;IACJ,MAAMC,gBAAgB,CAAC,EAAEN,eAAe,KAAK,CAAC;IAE9C,IAAI;QACFK,kBAAmB,MAAMV,QACtBY,IAAI,CAAC;YACJC,YAAY;YACZC,OAAO;YACPC,OAAO;YACPZ;YACAa,OAAO;gBACLC,KAAK;oBACHC,QAAQP;gBACV;YACF;QACF,IACEQ,KAAK,CAACC,MAAQA,KAAKC,MAAM,CAAC,EAAE,EAAEC;IACpC,EAAE,OAAOC,OAAO,CAAC,EAAE,+BAA+B;IAElD,MAAM,EACJC,QAAQ,EAAEC,KAAK,EAAE,EAClB,GAAGxB;IAEJ,IAAIL,kBAAkB;QACpB,MAAM,EACJ6B,OAAO,EAAEC,YAAY,EAAEC,OAAO,EAAEC,MAAMC,UAAU,EAAE,GAAG,CAAC,CAAC,EAAE,GAAG,CAAC,CAAC,EAAE,EACjE,GAAGjC;QAEJ,IAAI,CAACQ,gBAAgBG,WAAW,CAACuB,QAAQ,CAACzB,iBAAiB;YACzD,OAAOrB;QACT;QAEA,IAAI+C,iBAAiB;QAErB,IAAIF,cAAc,OAAOA,eAAe,YAAY;YAClDE,iBAAiBF;QACnB,OAAO,IAAI,OAAOA,eAAe,YAAY,OAAOA,WAAWG,SAAS,KAAK,YAAY;YACvFD,iBAAiBF,WAAWG,SAAS;QACvC;QAEA,MAAMC,OAAO/C,SAASgB,OAAO+B,QAAQ/B,MAAM+B,IAAI,GAAG;QAClD,MAAMC,aAAa/C,wBAAwB;YACzCS;YACAM,OAAO;gBACLiC,QAAQ,OAAOjC,OAAOiC,WAAW,WAAWjC,MAAMiC,MAAM,GAAGC;gBAC3DpB,OAAO,AAACd,OAAOc,SAAmBoB;YACpC;QACF;QACA,MAAMrB,QAAQ7B,SAASgB,OAAOa,SAC1Bb,MAAMa,KAAK,GACXL,iBAAiBK,SAASnB,iBAAiB6B,KAAK,CAACY,UAAU,CAACC,YAAY;QAC5E,MAAMC,OACJrC,OAAOqC,QAAQ,OAAOrC,MAAMqC,IAAI,KAAK,WACjCrC,MAAMqC,IAAI,GACV7B,iBAAiB6B,QAAQH;QAE/B,MAAMI,OAAO,MAAMxC,QAAQY,IAAI,CAAC;YAC9BC,YAAYR;YACZS,OAAO;YACP2B,OAAO;YACPC,gBAAgB;YAChB3B;YACAhB;YACA4C,gBAAgB;YAChBV;YACAM;YACApC;YACAa,OAAOkB,cAAc,CAAC;QACxB;QAEA,MAAMU,qBAA2C;YAC/CvC;YACAwC,sBAAsBjD,iBAAiB6B,KAAK,CAACoB,oBAAoB;QACnE;QAEA,qBACE,oBAACxD,8BACC,oBAACV;YAAkBkB,aAAaA;YAAaM,MAAMA;0BACnD,oBAACrB;YACCc,kBAAkBX,6BAA6B;gBAC7C4B,YAAYjB;gBACZkD,GAAGpD,eAAeI,GAAG,CAACiD,IAAI,CAACD,CAAC;YAC9B;YACAzC,gBAAgBA;YAChB2C,qBAAqBnD,aAAaU,aAAa,CAACF,eAAe,EAAE4C,QAAQxC;YACzEyC,gBAAgB,CAAC,EAAEzB,MAAM,aAAa,EAAEpB,eAAe,OAAO,CAAC;yBAE/D,oBAACtB;YACCyD,MAAMA;YACNF,cAAcvB,SAASnB,kBAAkB6B,OAAOY,YAAYC;YAC5Da,aAAaZ;YACba,oBAAAA;YACAzC,eAAeA;yBAEf,oBAAC9B;YACCwB,gBAAgBA;YAChBgD,qBAAAA;YACA3C,iBAAiBA;YACjBC,eAAeA;yBAEf,oBAAC/B;YACC0E,iBAAiBvB;YACjBwB,kBAAkBhE;YAClBiE,gBAAgBZ;;IAO9B;IAEA,OAAO5D;AACT,EAAC"}
+{"version":3,"sources":["../../../src/views/List/index.tsx"],"sourcesContent":["import type { AdminViewProps, Where } from 'payload'\n\nimport {\n  HydrateClientUser,\n  ListInfoProvider,\n  ListQueryProvider,\n  TableColumnsProvider,\n} from '@payloadcms/ui'\nimport { RenderCustomComponent } from '@payloadcms/ui/shared'\nimport { notFound } from 'next/navigation.js'\nimport { createClientCollectionConfig, mergeListSearchAndWhere } from 'payload'\nimport { isNumber, isReactComponentOrFunction } from 'payload/shared'\nimport React, { Fragment } from 'react'\n\nimport type { DefaultListViewProps, ListPreferences } from './Default/types.js'\n\nimport { DefaultListView } from './Default/index.js'\n\nexport { generateListMetadata } from './meta.js'\n\nexport const ListView: React.FC<AdminViewProps> = async ({\n  initPageResult,\n  params,\n  searchParams,\n}) => {\n  const {\n    collectionConfig,\n    locale: fullLocale,\n    permissions,\n    req,\n    req: {\n      i18n,\n      locale,\n      payload,\n      payload: { config },\n      query,\n      user,\n    },\n    visibleEntities,\n  } = initPageResult\n\n  const collectionSlug = collectionConfig?.slug\n\n  if (!permissions?.collections?.[collectionSlug]?.read?.permission) {\n    notFound()\n  }\n\n  let listPreferences: ListPreferences\n  const preferenceKey = `${collectionSlug}-list`\n\n  try {\n    listPreferences = (await payload\n      .find({\n        collection: 'payload-preferences',\n        depth: 0,\n        limit: 1,\n        req,\n        user,\n        where: {\n          key: {\n            equals: preferenceKey,\n          },\n        },\n      })\n      ?.then((res) => res?.docs?.[0]?.value)) as ListPreferences\n  } catch (error) {} // eslint-disable-line no-empty\n\n  const {\n    routes: { admin },\n  } = config\n\n  if (collectionConfig) {\n    const {\n      admin: { components: { views: { List: CustomList } = {} } = {} },\n    } = collectionConfig\n\n    if (!visibleEntities.collections.includes(collectionSlug)) {\n      return notFound()\n    }\n\n    let CustomListView = null\n\n    if (CustomList && typeof CustomList === 'function') {\n      CustomListView = CustomList\n    } else if (typeof CustomList === 'object' && isReactComponentOrFunction(CustomList.Component)) {\n      CustomListView = CustomList.Component\n    }\n\n    const page = isNumber(query?.page) ? Number(query.page) : 0\n    const whereQuery = mergeListSearchAndWhere({\n      collectionConfig,\n      query: {\n        search: typeof query?.search === 'string' ? query.search : undefined,\n        where: (query?.where as Where) || undefined,\n      },\n    })\n    const limit = isNumber(query?.limit)\n      ? Number(query.limit)\n      : listPreferences?.limit || collectionConfig.admin.pagination.defaultLimit\n    const sort =\n      query?.sort && typeof query.sort === 'string'\n        ? query.sort\n        : listPreferences?.sort || collectionConfig.defaultSort || undefined\n\n    const data = await payload.find({\n      collection: collectionSlug,\n      depth: 0,\n      draft: true,\n      fallbackLocale: null,\n      limit,\n      locale,\n      overrideAccess: false,\n      page,\n      req,\n      sort,\n      user,\n      where: whereQuery || {},\n    })\n\n    const viewComponentProps: DefaultListViewProps = {\n      collectionSlug,\n      listSearchableFields: collectionConfig.admin.listSearchableFields,\n    }\n\n    return (\n      <Fragment>\n        <HydrateClientUser permissions={permissions} user={user} />\n        <ListInfoProvider\n          collectionConfig={createClientCollectionConfig({\n            collection: collectionConfig,\n            t: initPageResult.req.i18n.t,\n          })}\n          collectionSlug={collectionSlug}\n          hasCreatePermission={permissions?.collections?.[collectionSlug]?.create?.permission}\n          newDocumentURL={`${admin}/collections/${collectionSlug}/create`}\n        >\n          <ListQueryProvider\n            data={data}\n            defaultLimit={limit || collectionConfig?.admin?.pagination?.defaultLimit}\n            defaultSort={sort}\n            modifySearchParams\n            preferenceKey={preferenceKey}\n          >\n            <TableColumnsProvider\n              collectionSlug={collectionSlug}\n              enableRowSelections\n              listPreferences={listPreferences}\n              preferenceKey={preferenceKey}\n            >\n              <RenderCustomComponent\n                CustomComponent={CustomListView}\n                DefaultComponent={DefaultListView}\n                componentProps={viewComponentProps}\n                serverOnlyProps={{\n                  collectionConfig,\n                  data,\n                  hasCreatePermission:\n                    permissions?.collections?.[collectionSlug]?.create?.permission,\n                  i18n,\n                  limit,\n                  listPreferences,\n                  locale: fullLocale,\n                  newDocumentURL: `${admin}/collections/${collectionSlug}/create`,\n                  params,\n                  payload,\n                  permissions,\n                  searchParams,\n                  user,\n                }}\n              />\n            </TableColumnsProvider>\n          </ListQueryProvider>\n        </ListInfoProvider>\n      </Fragment>\n    )\n  }\n\n  return notFound()\n}\n"],"names":["HydrateClientUser","ListInfoProvider","ListQueryProvider","TableColumnsProvider","RenderCustomComponent","notFound","createClientCollectionConfig","mergeListSearchAndWhere","isNumber","isReactComponentOrFunction","React","Fragment","DefaultListView","generateListMetadata","ListView","initPageResult","params","searchParams","collectionConfig","locale","fullLocale","permissions","req","i18n","payload","config","query","user","visibleEntities","collectionSlug","slug","collections","read","permission","listPreferences","preferenceKey","find","collection","depth","limit","where","key","equals","then","res","docs","value","error","routes","admin","components","views","List","CustomList","includes","CustomListView","Component","page","Number","whereQuery","search","undefined","pagination","defaultLimit","sort","defaultSort","data","draft","fallbackLocale","overrideAccess","viewComponentProps","listSearchableFields","t","hasCreatePermission","create","newDocumentURL","modifySearchParams","enableRowSelections","CustomComponent","DefaultComponent","componentProps","serverOnlyProps"],"mappings":"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"}

package/dist/views/List/meta.d.ts

@@ -1,7 +1,7 @@
 import type { Metadata } from 'next';
-import type { SanitizedCollectionConfig } from 'payload/types';
+import type { SanitizedCollectionConfig } from 'payload';
 import type { GenerateViewMetadata } from '../Root/index.js';
-export declare const generateListMetadata: (args: Parameters<GenerateViewMetadata>[0] & {
+export declare const generateListMetadata: (args: {
     collectionConfig: SanitizedCollectionConfig;
-}) => Promise<Metadata>;
+} & Parameters<GenerateViewMetadata>[0]) => Promise<Metadata>;
 //# sourceMappingURL=meta.d.ts.map

package/dist/views/List/meta.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"meta.d.ts","sourceRoot":"","sources":["../../../src/views/List/meta.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,MAAM,CAAA;AACpC,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,eAAe,CAAA;AAI9D,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,kBAAkB,CAAA;AAI5D,eAAO,MAAM,oBAAoB,SACzB,WAAW,oBAAoB,CAAC,CAAC,CAAC,CAAC,GAAG;IAC1C,gBAAgB,EAAE,yBAAyB,CAAA;CAC5C,KACA,QAAQ,QAAQ,CAiBlB,CAAA"}
+{"version":3,"file":"meta.d.ts","sourceRoot":"","sources":["../../../src/views/List/meta.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,MAAM,CAAA;AACpC,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,SAAS,CAAA;AAIxD,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,kBAAkB,CAAA;AAI5D,eAAO,MAAM,oBAAoB,SACzB;IACJ,gBAAgB,EAAE,yBAAyB,CAAA;CAC5C,GAAG,UAAU,CAAC,oBAAoB,CAAC,CAAC,CAAC,CAAC,KACtC,OAAO,CAAC,QAAQ,CAmBlB,CAAA"}

package/dist/views/List/meta.js

@@ -9,10 +9,12 @@ export const generateListMetadata = async (args)=>{
         title = getTranslation(collectionConfig.labels.plural, i18n);
     }
     return meta({
-        config,
+        ...config.admin.meta || {},
         description,
         keywords,
-        title
+        serverURL: config.serverURL,
+        title,
+        ...collectionConfig.admin.meta || {}
     });
 };
 

package/dist/views/List/meta.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/views/List/meta.ts"],"sourcesContent":["import type { Metadata } from 'next'\nimport type { SanitizedCollectionConfig } from 'payload/types'\n\nimport { getTranslation } from '@payloadcms/translations'\n\nimport type { GenerateViewMetadata } from '../Root/index.js'\n\nimport { meta } from '../../utilities/meta.js'\n\nexport const generateListMetadata = async (\n  args: Parameters<GenerateViewMetadata>[0] & {\n    collectionConfig: SanitizedCollectionConfig\n  },\n): Promise<Metadata> => {\n  const { collectionConfig, config, i18n } = args\n\n  let title: string = ''\n  const description: string = ''\n  const keywords: string = ''\n\n  if (collectionConfig) {\n    title = getTranslation(collectionConfig.labels.plural, i18n)\n  }\n\n  return meta({\n    config,\n    description,\n    keywords,\n    title,\n  })\n}\n"],"names":["getTranslation","meta","generateListMetadata","args","collectionConfig","config","i18n","title","description","keywords","labels","plural"],"rangeMappings":";;;;;;;;;;;;;;;;","mappings":"AAGA,SAASA,cAAc,QAAQ,2BAA0B;AAIzD,SAASC,IAAI,QAAQ,0BAAyB;AAE9C,OAAO,MAAMC,uBAAuB,OAClCC;IAIA,MAAM,EAAEC,gBAAgB,EAAEC,MAAM,EAAEC,IAAI,EAAE,GAAGH;IAE3C,IAAII,QAAgB;IACpB,MAAMC,cAAsB;IAC5B,MAAMC,WAAmB;IAEzB,IAAIL,kBAAkB;QACpBG,QAAQP,eAAeI,iBAAiBM,MAAM,CAACC,MAAM,EAAEL;IACzD;IAEA,OAAOL,KAAK;QACVI;QACAG;QACAC;QACAF;IACF;AACF,EAAC"}
+{"version":3,"sources":["../../../src/views/List/meta.ts"],"sourcesContent":["import type { Metadata } from 'next'\nimport type { SanitizedCollectionConfig } from 'payload'\n\nimport { getTranslation } from '@payloadcms/translations'\n\nimport type { GenerateViewMetadata } from '../Root/index.js'\n\nimport { meta } from '../../utilities/meta.js'\n\nexport const generateListMetadata = async (\n  args: {\n    collectionConfig: SanitizedCollectionConfig\n  } & Parameters<GenerateViewMetadata>[0],\n): Promise<Metadata> => {\n  const { collectionConfig, config, i18n } = args\n\n  let title: string = ''\n  const description: string = ''\n  const keywords: string = ''\n\n  if (collectionConfig) {\n    title = getTranslation(collectionConfig.labels.plural, i18n)\n  }\n\n  return meta({\n    ...(config.admin.meta || {}),\n    description,\n    keywords,\n    serverURL: config.serverURL,\n    title,\n    ...(collectionConfig.admin.meta || {}),\n  })\n}\n"],"names":["getTranslation","meta","generateListMetadata","args","collectionConfig","config","i18n","title","description","keywords","labels","plural","admin","serverURL"],"mappings":"AAGA,SAASA,cAAc,QAAQ,2BAA0B;AAIzD,SAASC,IAAI,QAAQ,0BAAyB;AAE9C,OAAO,MAAMC,uBAAuB,OAClCC;IAIA,MAAM,EAAEC,gBAAgB,EAAEC,MAAM,EAAEC,IAAI,EAAE,GAAGH;IAE3C,IAAII,QAAgB;IACpB,MAAMC,cAAsB;IAC5B,MAAMC,WAAmB;IAEzB,IAAIL,kBAAkB;QACpBG,QAAQP,eAAeI,iBAAiBM,MAAM,CAACC,MAAM,EAAEL;IACzD;IAEA,OAAOL,KAAK;QACV,GAAII,OAAOO,KAAK,CAACX,IAAI,IAAI,CAAC,CAAC;QAC3BO;QACAC;QACAI,WAAWR,OAAOQ,SAAS;QAC3BN;QACA,GAAIH,iBAAiBQ,KAAK,CAACX,IAAI,IAAI,CAAC,CAAC;IACvC;AACF,EAAC"}

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/views/LivePreview/Context/collisionDetection.ts"],"sourcesContent":["import type { CollisionDetection } from '@dnd-kit/core'\n\nimport { rectIntersection } from '@dnd-kit/core'\n\n// If the toolbar exits the preview area, we need to reset its position\n// This will prevent the toolbar from getting stuck outside the preview area\nexport const customCollisionDetection: CollisionDetection = ({\n  collisionRect,\n  droppableContainers,\n  ...args\n}) => {\n  const droppableContainer = droppableContainers.find(({ id }) => id === 'live-preview-area')\n\n  const rectIntersectionCollisions = rectIntersection({\n    ...args,\n    collisionRect,\n    droppableContainers: [droppableContainer],\n  })\n\n  // Collision detection algorithms return an array of collisions\n  if (rectIntersectionCollisions.length === 0) {\n    // The preview area is not intersecting, return early\n    return rectIntersectionCollisions\n  }\n\n  // Compute whether the draggable element is completely contained within the preview area\n  const previewAreaRect = droppableContainer?.rect?.current\n\n  const isContained =\n    collisionRect.top >= previewAreaRect.top &&\n    collisionRect.left >= previewAreaRect.left &&\n    collisionRect.bottom <= previewAreaRect.bottom &&\n    collisionRect.right <= previewAreaRect.right\n\n  if (isContained) {\n    return rectIntersectionCollisions\n  }\n}\n"],"names":["rectIntersection","customCollisionDetection","collisionRect","droppableContainers","args","droppableContainer","find","id","rectIntersectionCollisions","length","previewAreaRect","rect","current","isContained","top","left","bottom","right"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAEA,SAASA,gBAAgB,QAAQ,gBAAe;AAEhD,uEAAuE;AACvE,4EAA4E;AAC5E,OAAO,MAAMC,2BAA+C,CAAC,EAC3DC,aAAa,EACbC,mBAAmB,EACnB,GAAGC,MACJ;IACC,MAAMC,qBAAqBF,oBAAoBG,IAAI,CAAC,CAAC,EAAEC,EAAE,EAAE,GAAKA,OAAO;IAEvE,MAAMC,6BAA6BR,iBAAiB;QAClD,GAAGI,IAAI;QACPF;QACAC,qBAAqB;YAACE;SAAmB;IAC3C;IAEA,+DAA+D;IAC/D,IAAIG,2BAA2BC,MAAM,KAAK,GAAG;QAC3C,qDAAqD;QACrD,OAAOD;IACT;IAEA,wFAAwF;IACxF,MAAME,kBAAkBL,oBAAoBM,MAAMC;IAElD,MAAMC,cACJX,cAAcY,GAAG,IAAIJ,gBAAgBI,GAAG,IACxCZ,cAAca,IAAI,IAAIL,gBAAgBK,IAAI,IAC1Cb,cAAcc,MAAM,IAAIN,gBAAgBM,MAAM,IAC9Cd,cAAce,KAAK,IAAIP,gBAAgBO,KAAK;IAE9C,IAAIJ,aAAa;QACf,OAAOL;IACT;AACF,EAAC"}
+{"version":3,"sources":["../../../../src/views/LivePreview/Context/collisionDetection.ts"],"sourcesContent":["import type { CollisionDetection } from '@dnd-kit/core'\n\nimport { rectIntersection } from '@dnd-kit/core'\n\n// If the toolbar exits the preview area, we need to reset its position\n// This will prevent the toolbar from getting stuck outside the preview area\nexport const customCollisionDetection: CollisionDetection = ({\n  collisionRect,\n  droppableContainers,\n  ...args\n}) => {\n  const droppableContainer = droppableContainers.find(({ id }) => id === 'live-preview-area')\n\n  const rectIntersectionCollisions = rectIntersection({\n    ...args,\n    collisionRect,\n    droppableContainers: [droppableContainer],\n  })\n\n  // Collision detection algorithms return an array of collisions\n  if (rectIntersectionCollisions.length === 0) {\n    // The preview area is not intersecting, return early\n    return rectIntersectionCollisions\n  }\n\n  // Compute whether the draggable element is completely contained within the preview area\n  const previewAreaRect = droppableContainer?.rect?.current\n\n  const isContained =\n    collisionRect.top >= previewAreaRect.top &&\n    collisionRect.left >= previewAreaRect.left &&\n    collisionRect.bottom <= previewAreaRect.bottom &&\n    collisionRect.right <= previewAreaRect.right\n\n  if (isContained) {\n    return rectIntersectionCollisions\n  }\n}\n"],"names":["rectIntersection","customCollisionDetection","collisionRect","droppableContainers","args","droppableContainer","find","id","rectIntersectionCollisions","length","previewAreaRect","rect","current","isContained","top","left","bottom","right"],"mappings":"AAEA,SAASA,gBAAgB,QAAQ,gBAAe;AAEhD,uEAAuE;AACvE,4EAA4E;AAC5E,OAAO,MAAMC,2BAA+C,CAAC,EAC3DC,aAAa,EACbC,mBAAmB,EACnB,GAAGC,MACJ;IACC,MAAMC,qBAAqBF,oBAAoBG,IAAI,CAAC,CAAC,EAAEC,EAAE,EAAE,GAAKA,OAAO;IAEvE,MAAMC,6BAA6BR,iBAAiB;QAClD,GAAGI,IAAI;QACPF;QACAC,qBAAqB;YAACE;SAAmB;IAC3C;IAEA,+DAA+D;IAC/D,IAAIG,2BAA2BC,MAAM,KAAK,GAAG;QAC3C,qDAAqD;QACrD,OAAOD;IACT;IAEA,wFAAwF;IACxF,MAAME,kBAAkBL,oBAAoBM,MAAMC;IAElD,MAAMC,cACJX,cAAcY,GAAG,IAAIJ,gBAAgBI,GAAG,IACxCZ,cAAca,IAAI,IAAIL,gBAAgBK,IAAI,IAC1Cb,cAAcc,MAAM,IAAIN,gBAAgBM,MAAM,IAC9Cd,cAAce,KAAK,IAAIP,gBAAgBO,KAAK;IAE9C,IAAIJ,aAAa;QACf,OAAOL;IACT;AACF,EAAC"}

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

@@ -1,5 +1,5 @@
-import type { LivePreviewConfig } from 'payload/config';
-import type { fieldSchemaToJSON } from 'payload/utilities';
+import type { LivePreviewConfig } from 'payload';
+import type { fieldSchemaToJSON } from 'payload/shared';
 import type { Dispatch } from 'react';
 import type { usePopupWindow } from '../usePopupWindow.js';
 import type { SizeReducerAction } from './sizeReducer.js';
@@ -9,7 +9,7 @@ export interface LivePreviewContextType {
     breakpoints: LivePreviewConfig['breakpoints'];
     fieldSchemaJSON?: ReturnType<typeof fieldSchemaToJSON>;
     iframeHasLoaded: boolean;
-    iframeRef: React.RefObject<HTMLIFrameElement>;
+    iframeRef: React.RefObject<HTMLIFrameElement | null>;
     isPopupOpen: boolean;
     measuredDeviceSize: {
         height: number;

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

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

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/views/LivePreview/Context/context.ts"],"sourcesContent":["import type { LivePreviewConfig } from 'payload/config'\nimport type { fieldSchemaToJSON } from 'payload/utilities'\nimport type { Dispatch } from 'react'\n\nimport { createContext, useContext } from 'react'\n\nimport type { usePopupWindow } from '../usePopupWindow.js'\nimport type { SizeReducerAction } from './sizeReducer.js'\n\nexport interface LivePreviewContextType {\n  appIsReady: boolean\n  breakpoint: LivePreviewConfig['breakpoints'][number]['name']\n  breakpoints: LivePreviewConfig['breakpoints']\n  fieldSchemaJSON?: ReturnType<typeof fieldSchemaToJSON>\n  iframeHasLoaded: boolean\n  iframeRef: React.RefObject<HTMLIFrameElement>\n  isPopupOpen: boolean\n  measuredDeviceSize: {\n    height: number\n    width: number\n  }\n  openPopupWindow: ReturnType<typeof usePopupWindow>['openPopupWindow']\n  popupRef?: React.MutableRefObject<Window | null>\n  previewWindowType: 'iframe' | 'popup'\n  setAppIsReady: (appIsReady: boolean) => void\n  setBreakpoint: (breakpoint: LivePreviewConfig['breakpoints'][number]['name']) => void\n  setHeight: (height: number) => void\n  setIframeHasLoaded: (loaded: boolean) => void\n  setMeasuredDeviceSize: (size: { height: number; width: number }) => void\n  setPreviewWindowType: (previewWindowType: 'iframe' | 'popup') => void\n  setSize: Dispatch<SizeReducerAction>\n  setToolbarPosition: (position: { x: number; y: number }) => void\n  setWidth: (width: number) => void\n  setZoom: (zoom: number) => void\n  size: {\n    height: number\n    width: number\n  }\n  toolbarPosition: {\n    x: number\n    y: number\n  }\n  url: string | undefined\n  zoom: number\n}\n\nexport const LivePreviewContext = createContext<LivePreviewContextType>({\n  appIsReady: false,\n  breakpoint: undefined,\n  breakpoints: undefined,\n  fieldSchemaJSON: undefined,\n  iframeHasLoaded: false,\n  iframeRef: undefined,\n  isPopupOpen: false,\n  measuredDeviceSize: {\n    height: 0,\n    width: 0,\n  },\n  openPopupWindow: () => {},\n  popupRef: undefined,\n  previewWindowType: 'iframe',\n  setAppIsReady: () => {},\n  setBreakpoint: () => {},\n  setHeight: () => {},\n  setIframeHasLoaded: () => {},\n  setMeasuredDeviceSize: () => {},\n  setPreviewWindowType: () => {},\n  setSize: () => {},\n  setToolbarPosition: () => {},\n  setWidth: () => {},\n  setZoom: () => {},\n  size: {\n    height: 0,\n    width: 0,\n  },\n  toolbarPosition: {\n    x: 0,\n    y: 0,\n  },\n  url: undefined,\n  zoom: 1,\n})\n\nexport const useLivePreviewContext = () => useContext(LivePreviewContext)\n"],"names":["createContext","useContext","LivePreviewContext","appIsReady","breakpoint","undefined","breakpoints","fieldSchemaJSON","iframeHasLoaded","iframeRef","isPopupOpen","measuredDeviceSize","height","width","openPopupWindow","popupRef","previewWindowType","setAppIsReady","setBreakpoint","setHeight","setIframeHasLoaded","setMeasuredDeviceSize","setPreviewWindowType","setSize","setToolbarPosition","setWidth","setZoom","size","toolbarPosition","x","y","url","zoom","useLivePreviewContext"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAIA,SAASA,aAAa,EAAEC,UAAU,QAAQ,QAAO;AA0CjD,OAAO,MAAMC,qBAAqBF,cAAsC;IACtEG,YAAY;IACZC,YAAYC;IACZC,aAAaD;IACbE,iBAAiBF;IACjBG,iBAAiB;IACjBC,WAAWJ;IACXK,aAAa;IACbC,oBAAoB;QAClBC,QAAQ;QACRC,OAAO;IACT;IACAC,iBAAiB,KAAO;IACxBC,UAAUV;IACVW,mBAAmB;IACnBC,eAAe,KAAO;IACtBC,eAAe,KAAO;IACtBC,WAAW,KAAO;IAClBC,oBAAoB,KAAO;IAC3BC,uBAAuB,KAAO;IAC9BC,sBAAsB,KAAO;IAC7BC,SAAS,KAAO;IAChBC,oBAAoB,KAAO;IAC3BC,UAAU,KAAO;IACjBC,SAAS,KAAO;IAChBC,MAAM;QACJf,QAAQ;QACRC,OAAO;IACT;IACAe,iBAAiB;QACfC,GAAG;QACHC,GAAG;IACL;IACAC,KAAK1B;IACL2B,MAAM;AACR,GAAE;AAEF,OAAO,MAAMC,wBAAwB,IAAMhC,WAAWC,oBAAmB"}
+{"version":3,"sources":["../../../../src/views/LivePreview/Context/context.ts"],"sourcesContent":["import type { LivePreviewConfig } from 'payload'\nimport type { fieldSchemaToJSON } from 'payload/shared'\nimport type { Dispatch } from 'react'\n\nimport { createContext, useContext } from 'react'\n\nimport type { usePopupWindow } from '../usePopupWindow.js'\nimport type { SizeReducerAction } from './sizeReducer.js'\n\nexport interface LivePreviewContextType {\n  appIsReady: boolean\n  breakpoint: LivePreviewConfig['breakpoints'][number]['name']\n  breakpoints: LivePreviewConfig['breakpoints']\n  fieldSchemaJSON?: ReturnType<typeof fieldSchemaToJSON>\n  iframeHasLoaded: boolean\n  iframeRef: React.RefObject<HTMLIFrameElement | null>\n  isPopupOpen: boolean\n  measuredDeviceSize: {\n    height: number\n    width: number\n  }\n  openPopupWindow: ReturnType<typeof usePopupWindow>['openPopupWindow']\n  popupRef?: React.MutableRefObject<Window | null>\n  previewWindowType: 'iframe' | 'popup'\n  setAppIsReady: (appIsReady: boolean) => void\n  setBreakpoint: (breakpoint: LivePreviewConfig['breakpoints'][number]['name']) => void\n  setHeight: (height: number) => void\n  setIframeHasLoaded: (loaded: boolean) => void\n  setMeasuredDeviceSize: (size: { height: number; width: number }) => void\n  setPreviewWindowType: (previewWindowType: 'iframe' | 'popup') => void\n  setSize: Dispatch<SizeReducerAction>\n  setToolbarPosition: (position: { x: number; y: number }) => void\n  setWidth: (width: number) => void\n  setZoom: (zoom: number) => void\n  size: {\n    height: number\n    width: number\n  }\n  toolbarPosition: {\n    x: number\n    y: number\n  }\n  url: string | undefined\n  zoom: number\n}\n\nexport const LivePreviewContext = createContext<LivePreviewContextType>({\n  appIsReady: false,\n  breakpoint: undefined,\n  breakpoints: undefined,\n  fieldSchemaJSON: undefined,\n  iframeHasLoaded: false,\n  iframeRef: undefined,\n  isPopupOpen: false,\n  measuredDeviceSize: {\n    height: 0,\n    width: 0,\n  },\n  openPopupWindow: () => {},\n  popupRef: undefined,\n  previewWindowType: 'iframe',\n  setAppIsReady: () => {},\n  setBreakpoint: () => {},\n  setHeight: () => {},\n  setIframeHasLoaded: () => {},\n  setMeasuredDeviceSize: () => {},\n  setPreviewWindowType: () => {},\n  setSize: () => {},\n  setToolbarPosition: () => {},\n  setWidth: () => {},\n  setZoom: () => {},\n  size: {\n    height: 0,\n    width: 0,\n  },\n  toolbarPosition: {\n    x: 0,\n    y: 0,\n  },\n  url: undefined,\n  zoom: 1,\n})\n\nexport const useLivePreviewContext = () => useContext(LivePreviewContext)\n"],"names":["createContext","useContext","LivePreviewContext","appIsReady","breakpoint","undefined","breakpoints","fieldSchemaJSON","iframeHasLoaded","iframeRef","isPopupOpen","measuredDeviceSize","height","width","openPopupWindow","popupRef","previewWindowType","setAppIsReady","setBreakpoint","setHeight","setIframeHasLoaded","setMeasuredDeviceSize","setPreviewWindowType","setSize","setToolbarPosition","setWidth","setZoom","size","toolbarPosition","x","y","url","zoom","useLivePreviewContext"],"mappings":"AAIA,SAASA,aAAa,EAAEC,UAAU,QAAQ,QAAO;AA0CjD,OAAO,MAAMC,qBAAqBF,cAAsC;IACtEG,YAAY;IACZC,YAAYC;IACZC,aAAaD;IACbE,iBAAiBF;IACjBG,iBAAiB;IACjBC,WAAWJ;IACXK,aAAa;IACbC,oBAAoB;QAClBC,QAAQ;QACRC,OAAO;IACT;IACAC,iBAAiB,KAAO;IACxBC,UAAUV;IACVW,mBAAmB;IACnBC,eAAe,KAAO;IACtBC,eAAe,KAAO;IACtBC,WAAW,KAAO;IAClBC,oBAAoB,KAAO;IAC3BC,uBAAuB,KAAO;IAC9BC,sBAAsB,KAAO;IAC7BC,SAAS,KAAO;IAChBC,oBAAoB,KAAO;IAC3BC,UAAU,KAAO;IACjBC,SAAS,KAAO;IAChBC,MAAM;QACJf,QAAQ;QACRC,OAAO;IACT;IACAe,iBAAiB;QACfC,GAAG;QACHC,GAAG;IACL;IACAC,KAAK1B;IACL2B,MAAM;AACR,GAAE;AAEF,OAAO,MAAMC,wBAAwB,IAAMhC,WAAWC,oBAAmB"}

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

@@ -1,5 +1,4 @@
-import type { LivePreviewConfig } from 'payload/config';
-import type { ClientFieldConfig } from 'payload/types';
+import type { ClientFieldConfig, LivePreviewConfig } from 'payload';
 import React from 'react';
 import type { usePopupWindow } from '../usePopupWindow.js';
 export type LivePreviewProviderProps = {

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

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

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

@@ -1,6 +1,7 @@
 'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
 import { DndContext } from '@dnd-kit/core';
-import { fieldSchemaToJSON } from 'payload/utilities';
+import { fieldSchemaToJSON } from 'payload/shared';
 import React, { useCallback, useEffect, useState } from 'react';
 import { customCollisionDetection } from './collisionDetection.js';
 import { LivePreviewContext } from './context.js';
@@ -116,7 +117,7 @@ export const LivePreviewProvider = ({ breakpoints, children, fieldSchema, isPopu
         isPopupOpen,
         handleWindowChange
     ]);
-    return /*#__PURE__*/ React.createElement(LivePreviewContext.Provider, {
+    return /*#__PURE__*/ _jsx(LivePreviewContext.Provider, {
         value: {
             appIsReady,
             breakpoint,
@@ -143,11 +144,13 @@ export const LivePreviewProvider = ({ breakpoints, children, fieldSchema, isPopu
             toolbarPosition: position,
             url,
             zoom
-        }
-    }, /*#__PURE__*/ React.createElement(DndContext, {
-        collisionDetection: customCollisionDetection,
-        onDragEnd: handleDragEnd
-    }, listeningForMessages && children));
+        },
+        children: /*#__PURE__*/ _jsx(DndContext, {
+            collisionDetection: customCollisionDetection,
+            onDragEnd: handleDragEnd,
+            children: listeningForMessages && children
+        })
+    });
 };
 
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/views/LivePreview/Context/index.tsx"],"sourcesContent":["'use client'\nimport type { LivePreviewConfig } from 'payload/config'\nimport type { ClientFieldConfig, Field } from 'payload/types'\n\nimport { DndContext } from '@dnd-kit/core'\nimport { fieldSchemaToJSON } from 'payload/utilities'\nimport React, { useCallback, useEffect, useState } from 'react'\n\nimport type { usePopupWindow } from '../usePopupWindow.js'\n\nimport { customCollisionDetection } from './collisionDetection.js'\nimport { LivePreviewContext } from './context.js'\nimport { sizeReducer } from './sizeReducer.js'\n\nexport type LivePreviewProviderProps = {\n  appIsReady?: boolean\n  breakpoints?: LivePreviewConfig['breakpoints']\n  children: React.ReactNode\n  deviceSize?: {\n    height: number\n    width: number\n  }\n  fieldSchema: ClientFieldConfig[]\n  isPopupOpen?: boolean\n  openPopupWindow?: ReturnType<typeof usePopupWindow>['openPopupWindow']\n  popupRef?: React.MutableRefObject<Window>\n  url?: string\n}\n\nexport const LivePreviewProvider: React.FC<LivePreviewProviderProps> = ({\n  breakpoints,\n  children,\n  fieldSchema,\n  isPopupOpen,\n  openPopupWindow,\n  popupRef,\n  url,\n}) => {\n  const [previewWindowType, setPreviewWindowType] = useState<'iframe' | 'popup'>('iframe')\n\n  const [appIsReady, setAppIsReady] = useState(false)\n  const [listeningForMessages, setListeningForMessages] = useState(false)\n\n  const iframeRef = React.useRef<HTMLIFrameElement>(null)\n\n  const [iframeHasLoaded, setIframeHasLoaded] = useState(false)\n\n  const [zoom, setZoom] = useState(1)\n\n  const [position, setPosition] = useState({ x: 0, y: 0 })\n\n  const [size, setSize] = React.useReducer(sizeReducer, { height: 0, width: 0 })\n\n  const [measuredDeviceSize, setMeasuredDeviceSize] = useState({\n    height: 0,\n    width: 0,\n  })\n\n  const [breakpoint, setBreakpoint] =\n    React.useState<LivePreviewConfig['breakpoints'][0]['name']>('responsive')\n\n  const [fieldSchemaJSON] = useState(() => {\n    return fieldSchemaToJSON(fieldSchema)\n  })\n\n  // The toolbar needs to freely drag and drop around the page\n  const handleDragEnd = (ev) => {\n    // only update position if the toolbar is completely within the preview area\n    // otherwise reset it back to the previous position\n    // TODO: reset to the nearest edge of the preview area\n    if (ev.over && ev.over.id === 'live-preview-area') {\n      const newPos = {\n        x: position.x + ev.delta.x,\n        y: position.y + ev.delta.y,\n      }\n\n      setPosition(newPos)\n    } else {\n      // reset\n    }\n  }\n\n  const setWidth = useCallback(\n    (width) => {\n      setSize({ type: 'width', value: width })\n    },\n    [setSize],\n  )\n\n  const setHeight = useCallback(\n    (height) => {\n      setSize({ type: 'height', value: height })\n    },\n    [setSize],\n  )\n\n  // explicitly set new width and height when as new breakpoints are selected\n  // exclude `custom` breakpoint as it is handled by the `setWidth` and `setHeight` directly\n  useEffect(() => {\n    const foundBreakpoint = breakpoints?.find((bp) => bp.name === breakpoint)\n\n    if (\n      foundBreakpoint &&\n      breakpoint !== 'responsive' &&\n      breakpoint !== 'custom' &&\n      typeof foundBreakpoint?.width === 'number' &&\n      typeof foundBreakpoint?.height === 'number'\n    ) {\n      setSize({\n        type: 'reset',\n        value: {\n          height: foundBreakpoint.height,\n          width: foundBreakpoint.width,\n        },\n      })\n    }\n  }, [breakpoint, breakpoints])\n\n  // Receive the `ready` message from the popup window\n  // This indicates that the app is ready to receive `window.postMessage` events\n  // This is also the only cross-origin way of detecting when a popup window has loaded\n  // Unlike iframe elements which have an `onLoad` handler, there is no way to access `window.open` on popups\n  useEffect(() => {\n    const handleMessage = (event: MessageEvent) => {\n      if (\n        url?.startsWith(event.origin) &&\n        event.data &&\n        typeof event.data === 'object' &&\n        event.data.type === 'payload-live-preview'\n      ) {\n        if (event.data.ready) {\n          setAppIsReady(true)\n        }\n      }\n    }\n\n    window.addEventListener('message', handleMessage)\n\n    setListeningForMessages(true)\n\n    return () => {\n      window.removeEventListener('message', handleMessage)\n    }\n  }, [url, listeningForMessages])\n\n  const handleWindowChange = useCallback(\n    (type: 'iframe' | 'popup') => {\n      setAppIsReady(false)\n      setPreviewWindowType(type)\n      if (type === 'popup') openPopupWindow()\n    },\n    [openPopupWindow],\n  )\n\n  // when the user closes the popup window, switch back to the iframe\n  // the `usePopupWindow` reports the `isPopupOpen` state for us to use here\n  useEffect(() => {\n    const newPreviewWindowType = isPopupOpen ? 'popup' : 'iframe'\n\n    if (newPreviewWindowType !== previewWindowType) {\n      handleWindowChange('iframe')\n    }\n  }, [previewWindowType, isPopupOpen, handleWindowChange])\n\n  return (\n    <LivePreviewContext.Provider\n      value={{\n        appIsReady,\n        breakpoint,\n        breakpoints,\n        fieldSchemaJSON,\n        iframeHasLoaded,\n        iframeRef,\n        isPopupOpen,\n        measuredDeviceSize,\n        openPopupWindow,\n        popupRef,\n        previewWindowType,\n        setAppIsReady,\n        setBreakpoint,\n        setHeight,\n        setIframeHasLoaded,\n        setMeasuredDeviceSize,\n        setPreviewWindowType: handleWindowChange,\n        setSize,\n        setToolbarPosition: setPosition,\n        setWidth,\n        setZoom,\n        size,\n        toolbarPosition: position,\n        url,\n        zoom,\n      }}\n    >\n      <DndContext collisionDetection={customCollisionDetection} onDragEnd={handleDragEnd}>\n        {listeningForMessages && children}\n      </DndContext>\n    </LivePreviewContext.Provider>\n  )\n}\n"],"names":["DndContext","fieldSchemaToJSON","React","useCallback","useEffect","useState","customCollisionDetection","LivePreviewContext","sizeReducer","LivePreviewProvider","breakpoints","children","fieldSchema","isPopupOpen","openPopupWindow","popupRef","url","previewWindowType","setPreviewWindowType","appIsReady","setAppIsReady","listeningForMessages","setListeningForMessages","iframeRef","useRef","iframeHasLoaded","setIframeHasLoaded","zoom","setZoom","position","setPosition","x","y","size","setSize","useReducer","height","width","measuredDeviceSize","setMeasuredDeviceSize","breakpoint","setBreakpoint","fieldSchemaJSON","handleDragEnd","ev","over","id","newPos","delta","setWidth","type","value","setHeight","foundBreakpoint","find","bp","name","handleMessage","event","startsWith","origin","data","ready","window","addEventListener","removeEventListener","handleWindowChange","newPreviewWindowType","Provider","setToolbarPosition","toolbarPosition","collisionDetection","onDragEnd"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
+{"version":3,"sources":["../../../../src/views/LivePreview/Context/index.tsx"],"sourcesContent":["'use client'\nimport type { ClientFieldConfig, LivePreviewConfig } from 'payload'\n\nimport { DndContext } from '@dnd-kit/core'\nimport { fieldSchemaToJSON } from 'payload/shared'\nimport React, { useCallback, useEffect, useState } from 'react'\n\nimport type { usePopupWindow } from '../usePopupWindow.js'\n\nimport { customCollisionDetection } from './collisionDetection.js'\nimport { LivePreviewContext } from './context.js'\nimport { sizeReducer } from './sizeReducer.js'\n\nexport type LivePreviewProviderProps = {\n  appIsReady?: boolean\n  breakpoints?: LivePreviewConfig['breakpoints']\n  children: React.ReactNode\n  deviceSize?: {\n    height: number\n    width: number\n  }\n  fieldSchema: ClientFieldConfig[]\n  isPopupOpen?: boolean\n  openPopupWindow?: ReturnType<typeof usePopupWindow>['openPopupWindow']\n  popupRef?: React.MutableRefObject<Window>\n  url?: string\n}\n\nexport const LivePreviewProvider: React.FC<LivePreviewProviderProps> = ({\n  breakpoints,\n  children,\n  fieldSchema,\n  isPopupOpen,\n  openPopupWindow,\n  popupRef,\n  url,\n}) => {\n  const [previewWindowType, setPreviewWindowType] = useState<'iframe' | 'popup'>('iframe')\n\n  const [appIsReady, setAppIsReady] = useState(false)\n  const [listeningForMessages, setListeningForMessages] = useState(false)\n\n  const iframeRef = React.useRef<HTMLIFrameElement>(null)\n\n  const [iframeHasLoaded, setIframeHasLoaded] = useState(false)\n\n  const [zoom, setZoom] = useState(1)\n\n  const [position, setPosition] = useState({ x: 0, y: 0 })\n\n  const [size, setSize] = React.useReducer(sizeReducer, { height: 0, width: 0 })\n\n  const [measuredDeviceSize, setMeasuredDeviceSize] = useState({\n    height: 0,\n    width: 0,\n  })\n\n  const [breakpoint, setBreakpoint] =\n    React.useState<LivePreviewConfig['breakpoints'][0]['name']>('responsive')\n\n  const [fieldSchemaJSON] = useState(() => {\n    return fieldSchemaToJSON(fieldSchema)\n  })\n\n  // The toolbar needs to freely drag and drop around the page\n  const handleDragEnd = (ev) => {\n    // only update position if the toolbar is completely within the preview area\n    // otherwise reset it back to the previous position\n    // TODO: reset to the nearest edge of the preview area\n    if (ev.over && ev.over.id === 'live-preview-area') {\n      const newPos = {\n        x: position.x + ev.delta.x,\n        y: position.y + ev.delta.y,\n      }\n\n      setPosition(newPos)\n    } else {\n      // reset\n    }\n  }\n\n  const setWidth = useCallback(\n    (width) => {\n      setSize({ type: 'width', value: width })\n    },\n    [setSize],\n  )\n\n  const setHeight = useCallback(\n    (height) => {\n      setSize({ type: 'height', value: height })\n    },\n    [setSize],\n  )\n\n  // explicitly set new width and height when as new breakpoints are selected\n  // exclude `custom` breakpoint as it is handled by the `setWidth` and `setHeight` directly\n  useEffect(() => {\n    const foundBreakpoint = breakpoints?.find((bp) => bp.name === breakpoint)\n\n    if (\n      foundBreakpoint &&\n      breakpoint !== 'responsive' &&\n      breakpoint !== 'custom' &&\n      typeof foundBreakpoint?.width === 'number' &&\n      typeof foundBreakpoint?.height === 'number'\n    ) {\n      setSize({\n        type: 'reset',\n        value: {\n          height: foundBreakpoint.height,\n          width: foundBreakpoint.width,\n        },\n      })\n    }\n  }, [breakpoint, breakpoints])\n\n  // Receive the `ready` message from the popup window\n  // This indicates that the app is ready to receive `window.postMessage` events\n  // This is also the only cross-origin way of detecting when a popup window has loaded\n  // Unlike iframe elements which have an `onLoad` handler, there is no way to access `window.open` on popups\n  useEffect(() => {\n    const handleMessage = (event: MessageEvent) => {\n      if (\n        url?.startsWith(event.origin) &&\n        event.data &&\n        typeof event.data === 'object' &&\n        event.data.type === 'payload-live-preview'\n      ) {\n        if (event.data.ready) {\n          setAppIsReady(true)\n        }\n      }\n    }\n\n    window.addEventListener('message', handleMessage)\n\n    setListeningForMessages(true)\n\n    return () => {\n      window.removeEventListener('message', handleMessage)\n    }\n  }, [url, listeningForMessages])\n\n  const handleWindowChange = useCallback(\n    (type: 'iframe' | 'popup') => {\n      setAppIsReady(false)\n      setPreviewWindowType(type)\n      if (type === 'popup') openPopupWindow()\n    },\n    [openPopupWindow],\n  )\n\n  // when the user closes the popup window, switch back to the iframe\n  // the `usePopupWindow` reports the `isPopupOpen` state for us to use here\n  useEffect(() => {\n    const newPreviewWindowType = isPopupOpen ? 'popup' : 'iframe'\n\n    if (newPreviewWindowType !== previewWindowType) {\n      handleWindowChange('iframe')\n    }\n  }, [previewWindowType, isPopupOpen, handleWindowChange])\n\n  return (\n    <LivePreviewContext.Provider\n      value={{\n        appIsReady,\n        breakpoint,\n        breakpoints,\n        fieldSchemaJSON,\n        iframeHasLoaded,\n        iframeRef,\n        isPopupOpen,\n        measuredDeviceSize,\n        openPopupWindow,\n        popupRef,\n        previewWindowType,\n        setAppIsReady,\n        setBreakpoint,\n        setHeight,\n        setIframeHasLoaded,\n        setMeasuredDeviceSize,\n        setPreviewWindowType: handleWindowChange,\n        setSize,\n        setToolbarPosition: setPosition,\n        setWidth,\n        setZoom,\n        size,\n        toolbarPosition: position,\n        url,\n        zoom,\n      }}\n    >\n      <DndContext collisionDetection={customCollisionDetection} onDragEnd={handleDragEnd}>\n        {listeningForMessages && children}\n      </DndContext>\n    </LivePreviewContext.Provider>\n  )\n}\n"],"names":["DndContext","fieldSchemaToJSON","React","useCallback","useEffect","useState","customCollisionDetection","LivePreviewContext","sizeReducer","LivePreviewProvider","breakpoints","children","fieldSchema","isPopupOpen","openPopupWindow","popupRef","url","previewWindowType","setPreviewWindowType","appIsReady","setAppIsReady","listeningForMessages","setListeningForMessages","iframeRef","useRef","iframeHasLoaded","setIframeHasLoaded","zoom","setZoom","position","setPosition","x","y","size","setSize","useReducer","height","width","measuredDeviceSize","setMeasuredDeviceSize","breakpoint","setBreakpoint","fieldSchemaJSON","handleDragEnd","ev","over","id","newPos","delta","setWidth","type","value","setHeight","foundBreakpoint","find","bp","name","handleMessage","event","startsWith","origin","data","ready","window","addEventListener","removeEventListener","handleWindowChange","newPreviewWindowType","Provider","setToolbarPosition","toolbarPosition","collisionDetection","onDragEnd"],"mappings":"AAAA;;AAGA,SAASA,UAAU,QAAQ,gBAAe;AAC1C,SAASC,iBAAiB,QAAQ,iBAAgB;AAClD,OAAOC,SAASC,WAAW,EAAEC,SAAS,EAAEC,QAAQ,QAAQ,QAAO;AAI/D,SAASC,wBAAwB,QAAQ,0BAAyB;AAClE,SAASC,kBAAkB,QAAQ,eAAc;AACjD,SAASC,WAAW,QAAQ,mBAAkB;AAiB9C,OAAO,MAAMC,sBAA0D,CAAC,EACtEC,WAAW,EACXC,QAAQ,EACRC,WAAW,EACXC,WAAW,EACXC,eAAe,EACfC,QAAQ,EACRC,GAAG,EACJ;IACC,MAAM,CAACC,mBAAmBC,qBAAqB,GAAGb,SAA6B;IAE/E,MAAM,CAACc,YAAYC,cAAc,GAAGf,SAAS;IAC7C,MAAM,CAACgB,sBAAsBC,wBAAwB,GAAGjB,SAAS;IAEjE,MAAMkB,YAAYrB,MAAMsB,MAAM,CAAoB;IAElD,MAAM,CAACC,iBAAiBC,mBAAmB,GAAGrB,SAAS;IAEvD,MAAM,CAACsB,MAAMC,QAAQ,GAAGvB,SAAS;IAEjC,MAAM,CAACwB,UAAUC,YAAY,GAAGzB,SAAS;QAAE0B,GAAG;QAAGC,GAAG;IAAE;IAEtD,MAAM,CAACC,MAAMC,QAAQ,GAAGhC,MAAMiC,UAAU,CAAC3B,aAAa;QAAE4B,QAAQ;QAAGC,OAAO;IAAE;IAE5E,MAAM,CAACC,oBAAoBC,sBAAsB,GAAGlC,SAAS;QAC3D+B,QAAQ;QACRC,OAAO;IACT;IAEA,MAAM,CAACG,YAAYC,cAAc,GAC/BvC,MAAMG,QAAQ,CAA8C;IAE9D,MAAM,CAACqC,gBAAgB,GAAGrC,SAAS;QACjC,OAAOJ,kBAAkBW;IAC3B;IAEA,4DAA4D;IAC5D,MAAM+B,gBAAgB,CAACC;QACrB,4EAA4E;QAC5E,mDAAmD;QACnD,sDAAsD;QACtD,IAAIA,GAAGC,IAAI,IAAID,GAAGC,IAAI,CAACC,EAAE,KAAK,qBAAqB;YACjD,MAAMC,SAAS;gBACbhB,GAAGF,SAASE,CAAC,GAAGa,GAAGI,KAAK,CAACjB,CAAC;gBAC1BC,GAAGH,SAASG,CAAC,GAAGY,GAAGI,KAAK,CAAChB,CAAC;YAC5B;YAEAF,YAAYiB;QACd,OAAO;QACL,QAAQ;QACV;IACF;IAEA,MAAME,WAAW9C,YACf,CAACkC;QACCH,QAAQ;YAAEgB,MAAM;YAASC,OAAOd;QAAM;IACxC,GACA;QAACH;KAAQ;IAGX,MAAMkB,YAAYjD,YAChB,CAACiC;QACCF,QAAQ;YAAEgB,MAAM;YAAUC,OAAOf;QAAO;IAC1C,GACA;QAACF;KAAQ;IAGX,2EAA2E;IAC3E,0FAA0F;IAC1F9B,UAAU;QACR,MAAMiD,kBAAkB3C,aAAa4C,KAAK,CAACC,KAAOA,GAAGC,IAAI,KAAKhB;QAE9D,IACEa,mBACAb,eAAe,gBACfA,eAAe,YACf,OAAOa,iBAAiBhB,UAAU,YAClC,OAAOgB,iBAAiBjB,WAAW,UACnC;YACAF,QAAQ;gBACNgB,MAAM;gBACNC,OAAO;oBACLf,QAAQiB,gBAAgBjB,MAAM;oBAC9BC,OAAOgB,gBAAgBhB,KAAK;gBAC9B;YACF;QACF;IACF,GAAG;QAACG;QAAY9B;KAAY;IAE5B,oDAAoD;IACpD,8EAA8E;IAC9E,qFAAqF;IACrF,2GAA2G;IAC3GN,UAAU;QACR,MAAMqD,gBAAgB,CAACC;YACrB,IACE1C,KAAK2C,WAAWD,MAAME,MAAM,KAC5BF,MAAMG,IAAI,IACV,OAAOH,MAAMG,IAAI,KAAK,YACtBH,MAAMG,IAAI,CAACX,IAAI,KAAK,wBACpB;gBACA,IAAIQ,MAAMG,IAAI,CAACC,KAAK,EAAE;oBACpB1C,cAAc;gBAChB;YACF;QACF;QAEA2C,OAAOC,gBAAgB,CAAC,WAAWP;QAEnCnC,wBAAwB;QAExB,OAAO;YACLyC,OAAOE,mBAAmB,CAAC,WAAWR;QACxC;IACF,GAAG;QAACzC;QAAKK;KAAqB;IAE9B,MAAM6C,qBAAqB/D,YACzB,CAAC+C;QACC9B,cAAc;QACdF,qBAAqBgC;QACrB,IAAIA,SAAS,SAASpC;IACxB,GACA;QAACA;KAAgB;IAGnB,mEAAmE;IACnE,0EAA0E;IAC1EV,UAAU;QACR,MAAM+D,uBAAuBtD,cAAc,UAAU;QAErD,IAAIsD,yBAAyBlD,mBAAmB;YAC9CiD,mBAAmB;QACrB;IACF,GAAG;QAACjD;QAAmBJ;QAAaqD;KAAmB;IAEvD,qBACE,KAAC3D,mBAAmB6D,QAAQ;QAC1BjB,OAAO;YACLhC;YACAqB;YACA9B;YACAgC;YACAjB;YACAF;YACAV;YACAyB;YACAxB;YACAC;YACAE;YACAG;YACAqB;YACAW;YACA1B;YACAa;YACArB,sBAAsBgD;YACtBhC;YACAmC,oBAAoBvC;YACpBmB;YACArB;YACAK;YACAqC,iBAAiBzC;YACjBb;YACAW;QACF;kBAEA,cAAA,KAAC3B;YAAWuE,oBAAoBjE;YAA0BkE,WAAW7B;sBAClEtB,wBAAwBV;;;AAIjC,EAAC"}

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/views/LivePreview/Context/sizeReducer.ts"],"sourcesContent":["// export const sizeReducer: (state, action) => {\n//   switch (action.type) {\n//     case 'width':\n//       return { ...state, width: action.value }\n//     case 'height':\n//       return { ...state, height: action.value }\n//     default:\n//       return { ...state, ...(action?.value || {}) }\n//   }\n// },\n\ntype SizeReducerState = {\n  height: number\n  width: number\n}\n\nexport type SizeReducerAction =\n  | {\n      type: 'height' | 'width'\n      value: number\n    }\n  | {\n      type: 'reset'\n      value: {\n        height: number\n        width: number\n      }\n    }\n\nexport const sizeReducer = (state: SizeReducerState, action: SizeReducerAction) => {\n  switch (action.type) {\n    case 'width':\n      return { ...state, width: action.value }\n    case 'height':\n      return { ...state, height: action.value }\n    default:\n      return { ...state, ...(action?.value || {}) }\n  }\n}\n"],"names":["sizeReducer","state","action","type","width","value","height"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,iDAAiD;AACjD,2BAA2B;AAC3B,oBAAoB;AACpB,iDAAiD;AACjD,qBAAqB;AACrB,kDAAkD;AAClD,eAAe;AACf,sDAAsD;AACtD,MAAM;AACN,KAAK;AAoBL,OAAO,MAAMA,cAAc,CAACC,OAAyBC;IACnD,OAAQA,OAAOC,IAAI;QACjB,KAAK;YACH,OAAO;gBAAE,GAAGF,KAAK;gBAAEG,OAAOF,OAAOG,KAAK;YAAC;QACzC,KAAK;YACH,OAAO;gBAAE,GAAGJ,KAAK;gBAAEK,QAAQJ,OAAOG,KAAK;YAAC;QAC1C;YACE,OAAO;gBAAE,GAAGJ,KAAK;gBAAE,GAAIC,QAAQG,SAAS,CAAC,CAAC;YAAE;IAChD;AACF,EAAC"}
+{"version":3,"sources":["../../../../src/views/LivePreview/Context/sizeReducer.ts"],"sourcesContent":["// export const sizeReducer: (state, action) => {\n//   switch (action.type) {\n//     case 'width':\n//       return { ...state, width: action.value }\n//     case 'height':\n//       return { ...state, height: action.value }\n//     default:\n//       return { ...state, ...(action?.value || {}) }\n//   }\n// },\n\ntype SizeReducerState = {\n  height: number\n  width: number\n}\n\nexport type SizeReducerAction =\n  | {\n      type: 'height' | 'width'\n      value: number\n    }\n  | {\n      type: 'reset'\n      value: {\n        height: number\n        width: number\n      }\n    }\n\nexport const sizeReducer = (state: SizeReducerState, action: SizeReducerAction) => {\n  switch (action.type) {\n    case 'width':\n      return { ...state, width: action.value }\n    case 'height':\n      return { ...state, height: action.value }\n    default:\n      return { ...state, ...(action?.value || {}) }\n  }\n}\n"],"names":["sizeReducer","state","action","type","width","value","height"],"mappings":"AAAA,iDAAiD;AACjD,2BAA2B;AAC3B,oBAAoB;AACpB,iDAAiD;AACjD,qBAAqB;AACrB,kDAAkD;AAClD,eAAe;AACf,sDAAsD;AACtD,MAAM;AACN,KAAK;AAoBL,OAAO,MAAMA,cAAc,CAACC,OAAyBC;IACnD,OAAQA,OAAOC,IAAI;QACjB,KAAK;YACH,OAAO;gBAAE,GAAGF,KAAK;gBAAEG,OAAOF,OAAOG,KAAK;YAAC;QACzC,KAAK;YACH,OAAO;gBAAE,GAAGJ,KAAK;gBAAEK,QAAQJ,OAAOG,KAAK;YAAC;QAC1C;YACE,OAAO;gBAAE,GAAGJ,KAAK;gBAAE,GAAIC,QAAQG,SAAS,CAAC,CAAC;YAAE;IAChD;AACF,EAAC"}

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

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

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

@@ -1,17 +1,21 @@
 'use client';
-import { useResize } from '@payloadcms/ui/hooks/useResize';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useResize } from '@payloadcms/ui';
 import React, { useEffect } from 'react';
 import { useLivePreviewContext } from '../Context/context.js';
 export const DeviceContainer = (props)=>{
     const { children } = props;
     const deviceFrameRef = React.useRef(null);
-    const { breakpoint, setMeasuredDeviceSize, size, zoom } = useLivePreviewContext();
+    const outerFrameRef = React.useRef(null);
+    const { breakpoint, setMeasuredDeviceSize, size: desiredSize, zoom } = useLivePreviewContext();
     // Keep an accurate measurement of the actual device size as it is truly rendered
     // This is helpful when `sizes` are non-number units like percentages, etc.
-    const { size: measuredDeviceSize } = useResize(deviceFrameRef);
+    const { size: measuredDeviceSize } = useResize(deviceFrameRef.current);
+    const { size: outerFrameSize } = useResize(outerFrameRef.current);
+    let deviceIsLargerThanFrame = false;
     // Sync the measured device size with the context so that other components can use it
     // This happens from the bottom up so that as this component mounts and unmounts,
-    // Its size is freshly populated again upon re-mounting, i.e. going from iframe->popup->iframe
+    // its size is freshly populated again upon re-mounting, i.e. going from iframe->popup->iframe
     useEffect(()=>{
         if (measuredDeviceSize) {
             setMeasuredDeviceSize(measuredDeviceSize);
@@ -24,28 +28,54 @@ export const DeviceContainer = (props)=>{
     let margin = '0';
     if (breakpoint && breakpoint !== 'responsive') {
         x = '-50%';
-        if (typeof zoom === 'number' && typeof size.width === 'number' && typeof size.height === 'number') {
-            const scaledWidth = size.width / zoom;
-            const difference = scaledWidth - size.width;
-            x = `${difference / 2}px`;
+        if (typeof zoom === 'number' && typeof desiredSize.width === 'number' && typeof desiredSize.height === 'number' && typeof measuredDeviceSize.width === 'number' && typeof measuredDeviceSize.height === 'number') {
             margin = '0 auto';
+            const scaledDesiredWidth = desiredSize.width / zoom;
+            const scaledDeviceWidth = measuredDeviceSize.width * zoom;
+            const scaledDeviceDifferencePixels = scaledDesiredWidth - desiredSize.width;
+            deviceIsLargerThanFrame = scaledDeviceWidth > outerFrameSize.width;
+            if (deviceIsLargerThanFrame) {
+                if (zoom > 1) {
+                    const differenceFromDeviceToFrame = measuredDeviceSize.width - outerFrameSize.width;
+                    if (differenceFromDeviceToFrame < 0) x = `${differenceFromDeviceToFrame / 2}px`;
+                    else x = '0';
+                } else {
+                    x = '0';
+                }
+            } else {
+                if (zoom >= 1) {
+                    x = `${scaledDeviceDifferencePixels / 2}px`;
+                } else {
+                    const differenceFromDeviceToFrame = outerFrameSize.width - scaledDeviceWidth;
+                    x = `${differenceFromDeviceToFrame / 2}px`;
+                    margin = '0';
+                }
+            }
         }
     }
     let width = zoom ? `${100 / zoom}%` : '100%';
     let height = zoom ? `${100 / zoom}%` : '100%';
     if (breakpoint !== 'responsive') {
-        width = `${size?.width / (typeof zoom === 'number' ? zoom : 1)}px`;
-        height = `${size?.height / (typeof zoom === 'number' ? zoom : 1)}px`;
+        width = `${desiredSize?.width / (typeof zoom === 'number' ? zoom : 1)}px`;
+        height = `${desiredSize?.height / (typeof zoom === 'number' ? zoom : 1)}px`;
     }
-    return /*#__PURE__*/ React.createElement("div", {
-        ref: deviceFrameRef,
+    return /*#__PURE__*/ _jsx("div", {
+        ref: outerFrameRef,
         style: {
-            height,
-            margin,
-            transform: `translate3d(${x}, 0, 0)`,
-            width
-        }
-    }, children);
+            height: '100%',
+            width: '100%'
+        },
+        children: /*#__PURE__*/ _jsx("div", {
+            ref: deviceFrameRef,
+            style: {
+                height,
+                margin,
+                transform: `translate3d(${x}, 0, 0)`,
+                width
+            },
+            children: children
+        })
+    });
 };
 
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/views/LivePreview/Device/index.tsx"],"sourcesContent":["'use client'\nimport { useResize } from '@payloadcms/ui/hooks/useResize'\nimport React, { useEffect } from 'react'\n\nimport { useLivePreviewContext } from '../Context/context.js'\n\nexport const DeviceContainer: React.FC<{\n  children: React.ReactNode\n}> = (props) => {\n  const { children } = props\n\n  const deviceFrameRef = React.useRef<HTMLDivElement>(null)\n\n  const { breakpoint, setMeasuredDeviceSize, size, zoom } = useLivePreviewContext()\n\n  // Keep an accurate measurement of the actual device size as it is truly rendered\n  // This is helpful when `sizes` are non-number units like percentages, etc.\n  const { size: measuredDeviceSize } = useResize(deviceFrameRef)\n\n  // Sync the measured device size with the context so that other components can use it\n  // This happens from the bottom up so that as this component mounts and unmounts,\n  // Its size is freshly populated again upon re-mounting, i.e. going from iframe->popup->iframe\n  useEffect(() => {\n    if (measuredDeviceSize) {\n      setMeasuredDeviceSize(measuredDeviceSize)\n    }\n  }, [measuredDeviceSize, setMeasuredDeviceSize])\n\n  let x = '0'\n  let margin = '0'\n\n  if (breakpoint && breakpoint !== 'responsive') {\n    x = '-50%'\n\n    if (\n      typeof zoom === 'number' &&\n      typeof size.width === 'number' &&\n      typeof size.height === 'number'\n    ) {\n      const scaledWidth = size.width / zoom\n      const difference = scaledWidth - size.width\n      x = `${difference / 2}px`\n      margin = '0 auto'\n    }\n  }\n\n  let width = zoom ? `${100 / zoom}%` : '100%'\n  let height = zoom ? `${100 / zoom}%` : '100%'\n\n  if (breakpoint !== 'responsive') {\n    width = `${size?.width / (typeof zoom === 'number' ? zoom : 1)}px`\n    height = `${size?.height / (typeof zoom === 'number' ? zoom : 1)}px`\n  }\n\n  return (\n    <div\n      ref={deviceFrameRef}\n      style={{\n        height,\n        margin,\n        transform: `translate3d(${x}, 0, 0)`,\n        width,\n      }}\n    >\n      {children}\n    </div>\n  )\n}\n"],"names":["useResize","React","useEffect","useLivePreviewContext","DeviceContainer","props","children","deviceFrameRef","useRef","breakpoint","setMeasuredDeviceSize","size","zoom","measuredDeviceSize","x","margin","width","height","scaledWidth","difference","div","ref","style","transform"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA;AACA,SAASA,SAAS,QAAQ,iCAAgC;AAC1D,OAAOC,SAASC,SAAS,QAAQ,QAAO;AAExC,SAASC,qBAAqB,QAAQ,wBAAuB;AAE7D,OAAO,MAAMC,kBAER,CAACC;IACJ,MAAM,EAAEC,QAAQ,EAAE,GAAGD;IAErB,MAAME,iBAAiBN,MAAMO,MAAM,CAAiB;IAEpD,MAAM,EAAEC,UAAU,EAAEC,qBAAqB,EAAEC,IAAI,EAAEC,IAAI,EAAE,GAAGT;IAE1D,iFAAiF;IACjF,2EAA2E;IAC3E,MAAM,EAAEQ,MAAME,kBAAkB,EAAE,GAAGb,UAAUO;IAE/C,qFAAqF;IACrF,iFAAiF;IACjF,8FAA8F;IAC9FL,UAAU;QACR,IAAIW,oBAAoB;YACtBH,sBAAsBG;QACxB;IACF,GAAG;QAACA;QAAoBH;KAAsB;IAE9C,IAAII,IAAI;IACR,IAAIC,SAAS;IAEb,IAAIN,cAAcA,eAAe,cAAc;QAC7CK,IAAI;QAEJ,IACE,OAAOF,SAAS,YAChB,OAAOD,KAAKK,KAAK,KAAK,YACtB,OAAOL,KAAKM,MAAM,KAAK,UACvB;YACA,MAAMC,cAAcP,KAAKK,KAAK,GAAGJ;YACjC,MAAMO,aAAaD,cAAcP,KAAKK,KAAK;YAC3CF,IAAI,CAAC,EAAEK,aAAa,EAAE,EAAE,CAAC;YACzBJ,SAAS;QACX;IACF;IAEA,IAAIC,QAAQJ,OAAO,CAAC,EAAE,MAAMA,KAAK,CAAC,CAAC,GAAG;IACtC,IAAIK,SAASL,OAAO,CAAC,EAAE,MAAMA,KAAK,CAAC,CAAC,GAAG;IAEvC,IAAIH,eAAe,cAAc;QAC/BO,QAAQ,CAAC,EAAEL,MAAMK,QAAS,CAAA,OAAOJ,SAAS,WAAWA,OAAO,CAAA,EAAG,EAAE,CAAC;QAClEK,SAAS,CAAC,EAAEN,MAAMM,SAAU,CAAA,OAAOL,SAAS,WAAWA,OAAO,CAAA,EAAG,EAAE,CAAC;IACtE;IAEA,qBACE,oBAACQ;QACCC,KAAKd;QACLe,OAAO;YACLL;YACAF;YACAQ,WAAW,CAAC,YAAY,EAAET,EAAE,OAAO,CAAC;YACpCE;QACF;OAECV;AAGP,EAAC"}
+{"version":3,"sources":["../../../../src/views/LivePreview/Device/index.tsx"],"sourcesContent":["'use client'\nimport { useResize } from '@payloadcms/ui'\nimport React, { useEffect } from 'react'\n\nimport { useLivePreviewContext } from '../Context/context.js'\n\nexport const DeviceContainer: React.FC<{\n  children: React.ReactNode\n}> = (props) => {\n  const { children } = props\n\n  const deviceFrameRef = React.useRef<HTMLDivElement>(null)\n  const outerFrameRef = React.useRef<HTMLDivElement>(null)\n\n  const { breakpoint, setMeasuredDeviceSize, size: desiredSize, zoom } = useLivePreviewContext()\n\n  // Keep an accurate measurement of the actual device size as it is truly rendered\n  // This is helpful when `sizes` are non-number units like percentages, etc.\n  const { size: measuredDeviceSize } = useResize(deviceFrameRef.current)\n  const { size: outerFrameSize } = useResize(outerFrameRef.current)\n\n  let deviceIsLargerThanFrame: boolean = false\n\n  // Sync the measured device size with the context so that other components can use it\n  // This happens from the bottom up so that as this component mounts and unmounts,\n  // its size is freshly populated again upon re-mounting, i.e. going from iframe->popup->iframe\n  useEffect(() => {\n    if (measuredDeviceSize) {\n      setMeasuredDeviceSize(measuredDeviceSize)\n    }\n  }, [measuredDeviceSize, setMeasuredDeviceSize])\n\n  let x = '0'\n  let margin = '0'\n\n  if (breakpoint && breakpoint !== 'responsive') {\n    x = '-50%'\n\n    if (\n      typeof zoom === 'number' &&\n      typeof desiredSize.width === 'number' &&\n      typeof desiredSize.height === 'number' &&\n      typeof measuredDeviceSize.width === 'number' &&\n      typeof measuredDeviceSize.height === 'number'\n    ) {\n      margin = '0 auto'\n      const scaledDesiredWidth = desiredSize.width / zoom\n      const scaledDeviceWidth = measuredDeviceSize.width * zoom\n      const scaledDeviceDifferencePixels = scaledDesiredWidth - desiredSize.width\n      deviceIsLargerThanFrame = scaledDeviceWidth > outerFrameSize.width\n\n      if (deviceIsLargerThanFrame) {\n        if (zoom > 1) {\n          const differenceFromDeviceToFrame = measuredDeviceSize.width - outerFrameSize.width\n          if (differenceFromDeviceToFrame < 0) x = `${differenceFromDeviceToFrame / 2}px`\n          else x = '0'\n        } else {\n          x = '0'\n        }\n      } else {\n        if (zoom >= 1) {\n          x = `${scaledDeviceDifferencePixels / 2}px`\n        } else {\n          const differenceFromDeviceToFrame = outerFrameSize.width - scaledDeviceWidth\n          x = `${differenceFromDeviceToFrame / 2}px`\n          margin = '0'\n        }\n      }\n    }\n  }\n\n  let width = zoom ? `${100 / zoom}%` : '100%'\n  let height = zoom ? `${100 / zoom}%` : '100%'\n\n  if (breakpoint !== 'responsive') {\n    width = `${desiredSize?.width / (typeof zoom === 'number' ? zoom : 1)}px`\n    height = `${desiredSize?.height / (typeof zoom === 'number' ? zoom : 1)}px`\n  }\n\n  return (\n    <div\n      ref={outerFrameRef}\n      style={{\n        height: '100%',\n        width: '100%',\n      }}\n    >\n      <div\n        ref={deviceFrameRef}\n        style={{\n          height,\n          margin,\n          transform: `translate3d(${x}, 0, 0)`,\n          width,\n        }}\n      >\n        {children}\n      </div>\n    </div>\n  )\n}\n"],"names":["useResize","React","useEffect","useLivePreviewContext","DeviceContainer","props","children","deviceFrameRef","useRef","outerFrameRef","breakpoint","setMeasuredDeviceSize","size","desiredSize","zoom","measuredDeviceSize","current","outerFrameSize","deviceIsLargerThanFrame","x","margin","width","height","scaledDesiredWidth","scaledDeviceWidth","scaledDeviceDifferencePixels","differenceFromDeviceToFrame","div","ref","style","transform"],"mappings":"AAAA;;AACA,SAASA,SAAS,QAAQ,iBAAgB;AAC1C,OAAOC,SAASC,SAAS,QAAQ,QAAO;AAExC,SAASC,qBAAqB,QAAQ,wBAAuB;AAE7D,OAAO,MAAMC,kBAER,CAACC;IACJ,MAAM,EAAEC,QAAQ,EAAE,GAAGD;IAErB,MAAME,iBAAiBN,MAAMO,MAAM,CAAiB;IACpD,MAAMC,gBAAgBR,MAAMO,MAAM,CAAiB;IAEnD,MAAM,EAAEE,UAAU,EAAEC,qBAAqB,EAAEC,MAAMC,WAAW,EAAEC,IAAI,EAAE,GAAGX;IAEvE,iFAAiF;IACjF,2EAA2E;IAC3E,MAAM,EAAES,MAAMG,kBAAkB,EAAE,GAAGf,UAAUO,eAAeS,OAAO;IACrE,MAAM,EAAEJ,MAAMK,cAAc,EAAE,GAAGjB,UAAUS,cAAcO,OAAO;IAEhE,IAAIE,0BAAmC;IAEvC,qFAAqF;IACrF,iFAAiF;IACjF,8FAA8F;IAC9FhB,UAAU;QACR,IAAIa,oBAAoB;YACtBJ,sBAAsBI;QACxB;IACF,GAAG;QAACA;QAAoBJ;KAAsB;IAE9C,IAAIQ,IAAI;IACR,IAAIC,SAAS;IAEb,IAAIV,cAAcA,eAAe,cAAc;QAC7CS,IAAI;QAEJ,IACE,OAAOL,SAAS,YAChB,OAAOD,YAAYQ,KAAK,KAAK,YAC7B,OAAOR,YAAYS,MAAM,KAAK,YAC9B,OAAOP,mBAAmBM,KAAK,KAAK,YACpC,OAAON,mBAAmBO,MAAM,KAAK,UACrC;YACAF,SAAS;YACT,MAAMG,qBAAqBV,YAAYQ,KAAK,GAAGP;YAC/C,MAAMU,oBAAoBT,mBAAmBM,KAAK,GAAGP;YACrD,MAAMW,+BAA+BF,qBAAqBV,YAAYQ,KAAK;YAC3EH,0BAA0BM,oBAAoBP,eAAeI,KAAK;YAElE,IAAIH,yBAAyB;gBAC3B,IAAIJ,OAAO,GAAG;oBACZ,MAAMY,8BAA8BX,mBAAmBM,KAAK,GAAGJ,eAAeI,KAAK;oBACnF,IAAIK,8BAA8B,GAAGP,IAAI,CAAC,EAAEO,8BAA8B,EAAE,EAAE,CAAC;yBAC1EP,IAAI;gBACX,OAAO;oBACLA,IAAI;gBACN;YACF,OAAO;gBACL,IAAIL,QAAQ,GAAG;oBACbK,IAAI,CAAC,EAAEM,+BAA+B,EAAE,EAAE,CAAC;gBAC7C,OAAO;oBACL,MAAMC,8BAA8BT,eAAeI,KAAK,GAAGG;oBAC3DL,IAAI,CAAC,EAAEO,8BAA8B,EAAE,EAAE,CAAC;oBAC1CN,SAAS;gBACX;YACF;QACF;IACF;IAEA,IAAIC,QAAQP,OAAO,CAAC,EAAE,MAAMA,KAAK,CAAC,CAAC,GAAG;IACtC,IAAIQ,SAASR,OAAO,CAAC,EAAE,MAAMA,KAAK,CAAC,CAAC,GAAG;IAEvC,IAAIJ,eAAe,cAAc;QAC/BW,QAAQ,CAAC,EAAER,aAAaQ,QAAS,CAAA,OAAOP,SAAS,WAAWA,OAAO,CAAA,EAAG,EAAE,CAAC;QACzEQ,SAAS,CAAC,EAAET,aAAaS,SAAU,CAAA,OAAOR,SAAS,WAAWA,OAAO,CAAA,EAAG,EAAE,CAAC;IAC7E;IAEA,qBACE,KAACa;QACCC,KAAKnB;QACLoB,OAAO;YACLP,QAAQ;YACRD,OAAO;QACT;kBAEA,cAAA,KAACM;YACCC,KAAKrB;YACLsB,OAAO;gBACLP;gBACAF;gBACAU,WAAW,CAAC,YAAY,EAAEX,EAAE,OAAO,CAAC;gBACpCE;YACF;sBAECf;;;AAIT,EAAC"}