@payloadcms/next 3.0.0-canary.ff8c8fd → 3.0.0

package/dist/views/List/index.js

@@ -1,21 +1,36 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { HydrateAuthProvider, ListInfoProvider, ListQueryProvider, TableColumnsProvider } from '@payloadcms/ui';
-import { RenderComponent, formatAdminURL, getCreateMappedComponent } from '@payloadcms/ui/shared';
-import { createClientCollectionConfig } from '@payloadcms/ui/utilities/createClientConfig';
+import { DefaultListView, HydrateAuthProvider, ListQueryProvider } from '@payloadcms/ui';
+import { RenderServerComponent } from '@payloadcms/ui/elements/RenderServerComponent';
+import { renderFilters, renderTable } from '@payloadcms/ui/rsc';
+import { formatAdminURL, mergeListSearchAndWhere } from '@payloadcms/ui/shared';
 import { notFound } from 'next/navigation.js';
-import { deepCopyObjectSimple, mergeListSearchAndWhere } from 'payload';
 import { isNumber } from 'payload/shared';
 import React, { Fragment } from 'react';
-import { DefaultEditView } from '../Edit/Default/index.js';
-import { DefaultListView } from './Default/index.js';
+import { renderListViewSlots } from './renderListViewSlots.js';
 export { generateListMetadata } from './meta.js';
-export const ListView = async ({
-  initPageResult,
-  params,
-  searchParams
-}) => {
+export const renderListView = async args => {
+  const {
+    clientConfig,
+    customCellProps,
+    disableBulkDelete,
+    disableBulkEdit,
+    drawerSlug,
+    enableRowSelections,
+    initPageResult,
+    params,
+    query: queryFromArgs,
+    searchParams
+  } = args;
   const {
     collectionConfig,
+    collectionConfig: {
+      slug: collectionSlug,
+      admin: {
+        useAsTitle
+      },
+      defaultSort,
+      fields
+    },
     locale: fullLocale,
     permissions,
     req,
@@ -26,15 +41,15 @@ export const ListView = async ({
       payload: {
         config
       },
-      query,
+      query: queryFromReq,
       user
     },
     visibleEntities
   } = initPageResult;
-  const collectionSlug = collectionConfig?.slug;
-  if (!permissions?.collections?.[collectionSlug]?.read?.permission) {
-    notFound();
+  if (!permissions?.collections?.[collectionSlug]?.read) {
+    throw new Error('not-found');
   }
+  const query = queryFromArgs || queryFromReq;
   let listPreferences;
   const preferenceKey = `${collectionSlug}-list`;
   try {
@@ -60,7 +75,7 @@ export const ListView = async ({
         }]
       }
     })?.then(res => res?.docs?.[0]?.value);
-  } catch (error) {} // eslint-disable-line no-empty
+  } catch (_err) {} // eslint-disable-line no-empty
   const {
     routes: {
       admin: adminRoute
@@ -68,23 +83,35 @@ export const ListView = async ({
   } = config;
   if (collectionConfig) {
     if (!visibleEntities.collections.includes(collectionSlug)) {
-      return notFound();
+      throw new Error('not-found');
     }
     const page = isNumber(query?.page) ? Number(query.page) : 0;
-    const whereQuery = mergeListSearchAndWhere({
+    let whereQuery = mergeListSearchAndWhere({
       collectionConfig,
-      query: {
-        search: typeof query?.search === 'string' ? query.search : undefined,
-        where: query?.where || undefined
-      }
+      search: typeof query?.search === 'string' ? query.search : undefined,
+      where: query?.where || 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 sort = query?.sort && typeof query.sort === 'string' ? query.sort : listPreferences?.sort || (typeof collectionConfig.defaultSort === 'string' ? collectionConfig.defaultSort : undefined);
+    if (typeof collectionConfig.admin?.baseListFilter === 'function') {
+      const baseListFilter = await collectionConfig.admin.baseListFilter({
+        limit,
+        page,
+        req,
+        sort
+      });
+      if (baseListFilter) {
+        whereQuery = {
+          and: [whereQuery, baseListFilter].filter(Boolean)
+        };
+      }
+    }
     const data = await payload.find({
       collection: collectionSlug,
       depth: 0,
       draft: true,
-      fallbackLocale: null,
+      fallbackLocale: false,
+      includeLockStatus: true,
       limit,
       locale,
       overrideAccess: false,
@@ -94,75 +121,109 @@ export const ListView = async ({
       user,
       where: whereQuery || {}
     });
-    const createMappedComponent = getCreateMappedComponent({
-      importMap: payload.importMap,
-      serverProps: {
-        collectionConfig,
-        collectionSlug,
-        data,
-        hasCreatePermission: permissions?.collections?.[collectionSlug]?.create?.permission,
-        i18n,
-        limit,
-        listPreferences,
-        listSearchableFields: collectionConfig.admin.listSearchableFields,
-        locale: fullLocale,
-        newDocumentURL: formatAdminURL({
-          adminRoute,
-          path: `/collections/${collectionSlug}/create`
-        }),
-        params,
-        payload,
-        permissions,
-        searchParams,
-        user
-      }
+    const clientCollectionConfig = clientConfig.collections.find(c => c.slug === collectionSlug);
+    const {
+      columnState,
+      Table
+    } = renderTable({
+      collectionConfig: clientCollectionConfig,
+      columnPreferences: listPreferences?.columns,
+      customCellProps,
+      docs: data.docs,
+      drawerSlug,
+      enableRowSelections,
+      fields,
+      i18n: req.i18n,
+      payload,
+      useAsTitle
     });
-    const ListComponent = createMappedComponent(collectionConfig?.admin?.components?.views?.list?.Component, undefined, DefaultListView, 'collectionConfig?.admin?.components?.views?.list?.Component');
-    let clientCollectionConfig = deepCopyObjectSimple(collectionConfig);
-    clientCollectionConfig = createClientCollectionConfig({
-      DefaultEditView,
-      DefaultListView,
-      clientCollection: clientCollectionConfig,
-      collection: collectionConfig,
-      createMappedComponent,
+    const renderedFilters = renderFilters(fields, req.payload.importMap);
+    const staticDescription = typeof collectionConfig.admin.description === 'function' ? collectionConfig.admin.description({
+      t: i18n.t
+    }) : collectionConfig.admin.description;
+    const sharedClientProps = {
+      collectionSlug,
+      hasCreatePermission: permissions?.collections?.[collectionSlug]?.create,
+      newDocumentURL: formatAdminURL({
+        adminRoute,
+        path: `/collections/${collectionSlug}/create`
+      })
+    };
+    const sharedServerProps = {
+      collectionConfig,
       i18n,
-      importMap: payload.importMap,
-      payload
+      limit,
+      locale: fullLocale,
+      params,
+      payload,
+      permissions,
+      searchParams,
+      user
+    };
+    const listViewSlots = renderListViewSlots({
+      clientProps: sharedClientProps,
+      collectionConfig,
+      description: staticDescription,
+      payload,
+      serverProps: sharedServerProps
     });
-    return /*#__PURE__*/_jsxs(Fragment, {
-      children: [/*#__PURE__*/_jsx(HydrateAuthProvider, {
-        permissions: permissions
-      }), /*#__PURE__*/_jsx(ListInfoProvider, {
-        collectionConfig: clientCollectionConfig,
-        collectionSlug: collectionSlug,
-        hasCreatePermission: permissions?.collections?.[collectionSlug]?.create?.permission,
-        newDocumentURL: formatAdminURL({
-          adminRoute,
-          path: `/collections/${collectionSlug}/create`
-        }),
-        children: /*#__PURE__*/_jsx(ListQueryProvider, {
+    const clientProps = {
+      ...listViewSlots,
+      ...sharedClientProps,
+      columnState,
+      disableBulkDelete,
+      disableBulkEdit,
+      enableRowSelections,
+      listPreferences,
+      renderedFilters,
+      Table
+    };
+    const isInDrawer = Boolean(drawerSlug);
+    return {
+      List: /*#__PURE__*/_jsxs(Fragment, {
+        children: [/*#__PURE__*/_jsx(HydrateAuthProvider, {
+          permissions: permissions
+        }), /*#__PURE__*/_jsx(ListQueryProvider, {
+          collectionSlug: collectionSlug,
           data: data,
-          defaultLimit: limit || collectionConfig?.admin?.pagination?.defaultLimit,
+          defaultLimit: limit,
           defaultSort: sort,
-          modifySearchParams: true,
+          modifySearchParams: !isInDrawer,
           preferenceKey: preferenceKey,
-          children: /*#__PURE__*/_jsx(TableColumnsProvider, {
-            collectionSlug: collectionSlug,
-            enableRowSelections: true,
-            listPreferences: listPreferences,
-            preferenceKey: preferenceKey,
-            children: /*#__PURE__*/_jsx(RenderComponent, {
-              clientProps: {
-                collectionSlug,
-                listSearchableFields: collectionConfig?.admin?.listSearchableFields
-              },
-              mappedComponent: ListComponent
-            })
+          children: /*#__PURE__*/_jsx(RenderServerComponent, {
+            clientProps: clientProps,
+            Component: collectionConfig?.admin?.components?.views?.list?.Component,
+            Fallback: DefaultListView,
+            importMap: payload.importMap,
+            serverProps: {
+              ...sharedServerProps,
+              data,
+              listPreferences,
+              listSearchableFields: collectionConfig.admin.listSearchableFields
+            }
           })
-        })
-      })]
+        })]
+      })
+    };
+  }
+  throw new Error('not-found');
+};
+export const ListView = async args => {
+  try {
+    const {
+      List: RenderedList
+    } = await renderListView({
+      ...args,
+      enableRowSelections: true
     });
+    return RenderedList;
+  } catch (error) {
+    if (error.message === 'not-found') {
+      notFound();
+    } else {
+      console.error(error) // eslint-disable-line no-console
+      ;
+    }
   }
-  return notFound();
 };
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["HydrateAuthProvider","ListInfoProvider","ListQueryProvider","TableColumnsProvider","RenderComponent","formatAdminURL","getCreateMappedComponent","createClientCollectionConfig","notFound","deepCopyObjectSimple","mergeListSearchAndWhere","isNumber","React","Fragment","DefaultEditView","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","and","key","equals","id","then","res","docs","value","error","routes","admin","adminRoute","includes","page","Number","whereQuery","search","undefined","pagination","defaultLimit","sort","defaultSort","data","draft","fallbackLocale","overrideAccess","createMappedComponent","importMap","serverProps","hasCreatePermission","create","listSearchableFields","newDocumentURL","path","ListComponent","components","views","list","Component","clientCollectionConfig","clientCollection","_jsxs","_jsx","modifySearchParams","enableRowSelections","clientProps","mappedComponent"],"sources":["../../../src/views/List/index.tsx"],"sourcesContent":["import type { AdminViewProps, ClientCollectionConfig, Where } from 'payload'\n\nimport {\n  HydrateAuthProvider,\n  ListInfoProvider,\n  ListQueryProvider,\n  TableColumnsProvider,\n} from '@payloadcms/ui'\nimport { RenderComponent, formatAdminURL, getCreateMappedComponent } from '@payloadcms/ui/shared'\nimport { createClientCollectionConfig } from '@payloadcms/ui/utilities/createClientConfig'\nimport { notFound } from 'next/navigation.js'\nimport { deepCopyObjectSimple, mergeListSearchAndWhere } from 'payload'\nimport { isNumber } from 'payload/shared'\nimport React, { Fragment } from 'react'\n\nimport type { ListPreferences } from './Default/types.js'\n\nimport { DefaultEditView } from '../Edit/Default/index.js'\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          and: [\n            {\n              key: {\n                equals: preferenceKey,\n              },\n            },\n            {\n              'user.relationTo': {\n                equals: user.collection,\n              },\n            },\n            {\n              'user.value': {\n                equals: user?.id,\n              },\n            },\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: adminRoute },\n  } = config\n\n  if (collectionConfig) {\n    if (!visibleEntities.collections.includes(collectionSlug)) {\n      return notFound()\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 createMappedComponent = getCreateMappedComponent({\n      importMap: payload.importMap,\n      serverProps: {\n        collectionConfig,\n        collectionSlug,\n        data,\n        hasCreatePermission: permissions?.collections?.[collectionSlug]?.create?.permission,\n        i18n,\n        limit,\n        listPreferences,\n        listSearchableFields: collectionConfig.admin.listSearchableFields,\n        locale: fullLocale,\n        newDocumentURL: formatAdminURL({\n          adminRoute,\n          path: `/collections/${collectionSlug}/create`,\n        }),\n        params,\n        payload,\n        permissions,\n        searchParams,\n        user,\n      },\n    })\n\n    const ListComponent = createMappedComponent(\n      collectionConfig?.admin?.components?.views?.list?.Component,\n      undefined,\n      DefaultListView,\n      'collectionConfig?.admin?.components?.views?.list?.Component',\n    )\n\n    let clientCollectionConfig = deepCopyObjectSimple(\n      collectionConfig,\n    ) as unknown as ClientCollectionConfig\n    clientCollectionConfig = createClientCollectionConfig({\n      DefaultEditView,\n      DefaultListView,\n      clientCollection: clientCollectionConfig,\n      collection: collectionConfig,\n      createMappedComponent,\n      i18n,\n      importMap: payload.importMap,\n      payload,\n    })\n\n    return (\n      <Fragment>\n        <HydrateAuthProvider permissions={permissions} />\n        <ListInfoProvider\n          collectionConfig={clientCollectionConfig}\n          collectionSlug={collectionSlug}\n          hasCreatePermission={permissions?.collections?.[collectionSlug]?.create?.permission}\n          newDocumentURL={formatAdminURL({\n            adminRoute,\n            path: `/collections/${collectionSlug}/create`,\n          })}\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              <RenderComponent\n                clientProps={{\n                  collectionSlug,\n                  listSearchableFields: collectionConfig?.admin?.listSearchableFields,\n                }}\n                mappedComponent={ListComponent}\n              />\n            </TableColumnsProvider>\n          </ListQueryProvider>\n        </ListInfoProvider>\n      </Fragment>\n    )\n  }\n\n  return notFound()\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"index.js","names":["DefaultListView","HydrateAuthProvider","ListQueryProvider","RenderServerComponent","renderFilters","renderTable","formatAdminURL","mergeListSearchAndWhere","notFound","isNumber","React","Fragment","renderListViewSlots","generateListMetadata","renderListView","args","clientConfig","customCellProps","disableBulkDelete","disableBulkEdit","drawerSlug","enableRowSelections","initPageResult","params","query","queryFromArgs","searchParams","collectionConfig","slug","collectionSlug","admin","useAsTitle","defaultSort","fields","locale","fullLocale","permissions","req","i18n","payload","config","queryFromReq","user","visibleEntities","collections","read","Error","listPreferences","preferenceKey","find","collection","depth","limit","where","and","key","equals","id","then","res","docs","value","_err","routes","adminRoute","includes","page","Number","whereQuery","search","undefined","pagination","defaultLimit","sort","baseListFilter","filter","Boolean","data","draft","fallbackLocale","includeLockStatus","overrideAccess","clientCollectionConfig","c","columnState","Table","columnPreferences","columns","renderedFilters","importMap","staticDescription","description","t","sharedClientProps","hasCreatePermission","create","newDocumentURL","path","sharedServerProps","listViewSlots","clientProps","serverProps","isInDrawer","List","_jsxs","_jsx","modifySearchParams","Component","components","views","list","Fallback","listSearchableFields","ListView","RenderedList","error","message","console"],"sources":["../../../src/views/List/index.tsx"],"sourcesContent":["import type {\n  ListComponentClientProps,\n  ListComponentServerProps,\n  ListPreferences,\n  ListViewClientProps,\n} from '@payloadcms/ui'\nimport type { AdminViewProps, ListQuery, Where } from 'payload'\n\nimport { DefaultListView, HydrateAuthProvider, ListQueryProvider } from '@payloadcms/ui'\nimport { RenderServerComponent } from '@payloadcms/ui/elements/RenderServerComponent'\nimport { renderFilters, renderTable } from '@payloadcms/ui/rsc'\nimport { formatAdminURL, mergeListSearchAndWhere } from '@payloadcms/ui/shared'\nimport { notFound } from 'next/navigation.js'\nimport { isNumber } from 'payload/shared'\nimport React, { Fragment } from 'react'\n\nimport { renderListViewSlots } from './renderListViewSlots.js'\n\nexport { generateListMetadata } from './meta.js'\n\ntype ListViewArgs = {\n  customCellProps?: Record<string, any>\n  disableBulkDelete?: boolean\n  disableBulkEdit?: boolean\n  enableRowSelections: boolean\n  query: ListQuery\n} & AdminViewProps\n\nexport const renderListView = async (\n  args: ListViewArgs,\n): Promise<{\n  List: React.ReactNode\n}> => {\n  const {\n    clientConfig,\n    customCellProps,\n    disableBulkDelete,\n    disableBulkEdit,\n    drawerSlug,\n    enableRowSelections,\n    initPageResult,\n    params,\n    query: queryFromArgs,\n    searchParams,\n  } = args\n\n  const {\n    collectionConfig,\n    collectionConfig: {\n      slug: collectionSlug,\n      admin: { useAsTitle },\n      defaultSort,\n      fields,\n    },\n    locale: fullLocale,\n    permissions,\n    req,\n    req: {\n      i18n,\n      locale,\n      payload,\n      payload: { config },\n      query: queryFromReq,\n      user,\n    },\n    visibleEntities,\n  } = initPageResult\n\n  if (!permissions?.collections?.[collectionSlug]?.read) {\n    throw new Error('not-found')\n  }\n\n  const query = queryFromArgs || queryFromReq\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          and: [\n            {\n              key: {\n                equals: preferenceKey,\n              },\n            },\n            {\n              'user.relationTo': {\n                equals: user.collection,\n              },\n            },\n            {\n              'user.value': {\n                equals: user?.id,\n              },\n            },\n          ],\n        },\n      })\n      ?.then((res) => res?.docs?.[0]?.value)) as ListPreferences\n  } catch (_err) {} // eslint-disable-line no-empty\n\n  const {\n    routes: { admin: adminRoute },\n  } = config\n\n  if (collectionConfig) {\n    if (!visibleEntities.collections.includes(collectionSlug)) {\n      throw new Error('not-found')\n    }\n\n    const page = isNumber(query?.page) ? Number(query.page) : 0\n\n    let whereQuery = mergeListSearchAndWhere({\n      collectionConfig,\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\n    const sort =\n      query?.sort && typeof query.sort === 'string'\n        ? query.sort\n        : listPreferences?.sort ||\n          (typeof collectionConfig.defaultSort === 'string'\n            ? collectionConfig.defaultSort\n            : undefined)\n\n    if (typeof collectionConfig.admin?.baseListFilter === 'function') {\n      const baseListFilter = await collectionConfig.admin.baseListFilter({\n        limit,\n        page,\n        req,\n        sort,\n      })\n\n      if (baseListFilter) {\n        whereQuery = {\n          and: [whereQuery, baseListFilter].filter(Boolean),\n        }\n      }\n    }\n\n    const data = await payload.find({\n      collection: collectionSlug,\n      depth: 0,\n      draft: true,\n      fallbackLocale: false,\n      includeLockStatus: true,\n      limit,\n      locale,\n      overrideAccess: false,\n      page,\n      req,\n      sort,\n      user,\n      where: whereQuery || {},\n    })\n\n    const clientCollectionConfig = clientConfig.collections.find((c) => c.slug === collectionSlug)\n\n    const { columnState, Table } = renderTable({\n      collectionConfig: clientCollectionConfig,\n      columnPreferences: listPreferences?.columns,\n      customCellProps,\n      docs: data.docs,\n      drawerSlug,\n      enableRowSelections,\n      fields,\n      i18n: req.i18n,\n      payload,\n      useAsTitle,\n    })\n\n    const renderedFilters = renderFilters(fields, req.payload.importMap)\n\n    const staticDescription =\n      typeof collectionConfig.admin.description === 'function'\n        ? collectionConfig.admin.description({ t: i18n.t })\n        : collectionConfig.admin.description\n\n    const sharedClientProps: ListComponentClientProps = {\n      collectionSlug,\n      hasCreatePermission: permissions?.collections?.[collectionSlug]?.create,\n      newDocumentURL: formatAdminURL({\n        adminRoute,\n        path: `/collections/${collectionSlug}/create`,\n      }),\n    }\n\n    const sharedServerProps: ListComponentServerProps = {\n      collectionConfig,\n      i18n,\n      limit,\n      locale: fullLocale,\n      params,\n      payload,\n      permissions,\n      searchParams,\n      user,\n    }\n\n    const listViewSlots = renderListViewSlots({\n      clientProps: sharedClientProps,\n      collectionConfig,\n      description: staticDescription,\n      payload,\n      serverProps: sharedServerProps,\n    })\n\n    const clientProps: ListViewClientProps = {\n      ...listViewSlots,\n      ...sharedClientProps,\n      columnState,\n      disableBulkDelete,\n      disableBulkEdit,\n      enableRowSelections,\n      listPreferences,\n      renderedFilters,\n      Table,\n    }\n\n    const isInDrawer = Boolean(drawerSlug)\n\n    return {\n      List: (\n        <Fragment>\n          <HydrateAuthProvider permissions={permissions} />\n          <ListQueryProvider\n            collectionSlug={collectionSlug}\n            data={data}\n            defaultLimit={limit}\n            defaultSort={sort}\n            modifySearchParams={!isInDrawer}\n            preferenceKey={preferenceKey}\n          >\n            <RenderServerComponent\n              clientProps={clientProps}\n              Component={collectionConfig?.admin?.components?.views?.list?.Component}\n              Fallback={DefaultListView}\n              importMap={payload.importMap}\n              serverProps={{\n                ...sharedServerProps,\n                data,\n                listPreferences,\n                listSearchableFields: collectionConfig.admin.listSearchableFields,\n              }}\n            />\n          </ListQueryProvider>\n        </Fragment>\n      ),\n    }\n  }\n\n  throw new Error('not-found')\n}\n\nexport const ListView: React.FC<ListViewArgs> = async (args) => {\n  try {\n    const { List: RenderedList } = await renderListView({ ...args, enableRowSelections: true })\n    return RenderedList\n  } catch (error) {\n    if (error.message === 'not-found') {\n      notFound()\n    } else {\n      console.error(error) // eslint-disable-line no-console\n    }\n  }\n}\n"],"mappings":"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","ignoreList":[]}

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

@@ -0,0 +1,12 @@
+import type { ListComponentClientProps, ListComponentServerProps, ListViewSlots } from '@payloadcms/ui';
+import type { Payload, SanitizedCollectionConfig, StaticDescription } from 'payload';
+type Args = {
+    clientProps: ListComponentClientProps;
+    collectionConfig: SanitizedCollectionConfig;
+    description?: StaticDescription;
+    payload: Payload;
+    serverProps: ListComponentServerProps;
+};
+export declare const renderListViewSlots: ({ clientProps, collectionConfig, description, payload, serverProps, }: Args) => ListViewSlots;
+export {};
+//# sourceMappingURL=renderListViewSlots.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"renderListViewSlots.d.ts","sourceRoot":"","sources":["../../../src/views/List/renderListViewSlots.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,wBAAwB,EACxB,wBAAwB,EACxB,aAAa,EACd,MAAM,gBAAgB,CAAA;AACvB,OAAO,KAAK,EAAE,OAAO,EAAE,yBAAyB,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAA;AAIpF,KAAK,IAAI,GAAG;IACV,WAAW,EAAE,wBAAwB,CAAA;IACrC,gBAAgB,EAAE,yBAAyB,CAAA;IAC3C,WAAW,CAAC,EAAE,iBAAiB,CAAA;IAC/B,OAAO,EAAE,OAAO,CAAA;IAChB,WAAW,EAAE,wBAAwB,CAAA;CACtC,CAAA;AACD,eAAO,MAAM,mBAAmB,0EAM7B,IAAI,KAAG,aA8DT,CAAA"}

package/dist/views/List/renderListViewSlots.js

@@ -0,0 +1,56 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { RenderServerComponent } from '@payloadcms/ui/elements/RenderServerComponent';
+export const renderListViewSlots = ({
+  clientProps,
+  collectionConfig,
+  description,
+  payload,
+  serverProps
+}) => {
+  const result = {};
+  if (collectionConfig.admin.components?.afterList) {
+    result.AfterList = /*#__PURE__*/_jsx(RenderServerComponent, {
+      clientProps: clientProps,
+      Component: collectionConfig.admin.components.afterList,
+      importMap: payload.importMap,
+      serverProps: serverProps
+    });
+  }
+  if (collectionConfig.admin.components?.afterListTable) {
+    result.AfterListTable = /*#__PURE__*/_jsx(RenderServerComponent, {
+      clientProps: clientProps,
+      Component: collectionConfig.admin.components.afterListTable,
+      importMap: payload.importMap,
+      serverProps: serverProps
+    });
+  }
+  if (collectionConfig.admin.components?.beforeList) {
+    result.BeforeList = /*#__PURE__*/_jsx(RenderServerComponent, {
+      clientProps: clientProps,
+      Component: collectionConfig.admin.components.beforeList,
+      importMap: payload.importMap,
+      serverProps: serverProps
+    });
+  }
+  if (collectionConfig.admin.components?.beforeListTable) {
+    result.BeforeListTable = /*#__PURE__*/_jsx(RenderServerComponent, {
+      clientProps: clientProps,
+      Component: collectionConfig.admin.components.beforeListTable,
+      importMap: payload.importMap,
+      serverProps: serverProps
+    });
+  }
+  if (collectionConfig.admin.components?.Description) {
+    result.Description = /*#__PURE__*/_jsx(RenderServerComponent, {
+      clientProps: {
+        description,
+        ...clientProps
+      },
+      Component: collectionConfig.admin.components.Description,
+      importMap: payload.importMap,
+      serverProps: serverProps
+    });
+  }
+  return result;
+};
+//# sourceMappingURL=renderListViewSlots.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"renderListViewSlots.js","names":["RenderServerComponent","renderListViewSlots","clientProps","collectionConfig","description","payload","serverProps","result","admin","components","afterList","AfterList","_jsx","Component","importMap","afterListTable","AfterListTable","beforeList","BeforeList","beforeListTable","BeforeListTable","Description"],"sources":["../../../src/views/List/renderListViewSlots.tsx"],"sourcesContent":["import type {\n  ListComponentClientProps,\n  ListComponentServerProps,\n  ListViewSlots,\n} from '@payloadcms/ui'\nimport type { Payload, SanitizedCollectionConfig, StaticDescription } from 'payload'\n\nimport { RenderServerComponent } from '@payloadcms/ui/elements/RenderServerComponent'\n\ntype Args = {\n  clientProps: ListComponentClientProps\n  collectionConfig: SanitizedCollectionConfig\n  description?: StaticDescription\n  payload: Payload\n  serverProps: ListComponentServerProps\n}\nexport const renderListViewSlots = ({\n  clientProps,\n  collectionConfig,\n  description,\n  payload,\n  serverProps,\n}: Args): ListViewSlots => {\n  const result: ListViewSlots = {} as ListViewSlots\n\n  if (collectionConfig.admin.components?.afterList) {\n    result.AfterList = (\n      <RenderServerComponent\n        clientProps={clientProps}\n        Component={collectionConfig.admin.components.afterList}\n        importMap={payload.importMap}\n        serverProps={serverProps}\n      />\n    )\n  }\n\n  if (collectionConfig.admin.components?.afterListTable) {\n    result.AfterListTable = (\n      <RenderServerComponent\n        clientProps={clientProps}\n        Component={collectionConfig.admin.components.afterListTable}\n        importMap={payload.importMap}\n        serverProps={serverProps}\n      />\n    )\n  }\n\n  if (collectionConfig.admin.components?.beforeList) {\n    result.BeforeList = (\n      <RenderServerComponent\n        clientProps={clientProps}\n        Component={collectionConfig.admin.components.beforeList}\n        importMap={payload.importMap}\n        serverProps={serverProps}\n      />\n    )\n  }\n\n  if (collectionConfig.admin.components?.beforeListTable) {\n    result.BeforeListTable = (\n      <RenderServerComponent\n        clientProps={clientProps}\n        Component={collectionConfig.admin.components.beforeListTable}\n        importMap={payload.importMap}\n        serverProps={serverProps}\n      />\n    )\n  }\n\n  if (collectionConfig.admin.components?.Description) {\n    result.Description = (\n      <RenderServerComponent\n        clientProps={{\n          description,\n          ...clientProps,\n        }}\n        Component={collectionConfig.admin.components.Description}\n        importMap={payload.importMap}\n        serverProps={serverProps}\n      />\n    )\n  }\n\n  return result\n}\n"],"mappings":";AAOA,SAASA,qBAAqB,QAAQ;AAStC,OAAO,MAAMC,mBAAA,GAAsBA,CAAC;EAClCC,WAAW;EACXC,gBAAgB;EAChBC,WAAW;EACXC,OAAO;EACPC;AAAW,CACN;EACL,MAAMC,MAAA,GAAwB,CAAC;EAE/B,IAAIJ,gBAAA,CAAiBK,KAAK,CAACC,UAAU,EAAEC,SAAA,EAAW;IAChDH,MAAA,CAAOI,SAAS,gBACdC,IAAA,CAACZ,qBAAA;MACCE,WAAA,EAAaA,WAAA;MACbW,SAAA,EAAWV,gBAAA,CAAiBK,KAAK,CAACC,UAAU,CAACC,SAAS;MACtDI,SAAA,EAAWT,OAAA,CAAQS,SAAS;MAC5BR,WAAA,EAAaA;;EAGnB;EAEA,IAAIH,gBAAA,CAAiBK,KAAK,CAACC,UAAU,EAAEM,cAAA,EAAgB;IACrDR,MAAA,CAAOS,cAAc,gBACnBJ,IAAA,CAACZ,qBAAA;MACCE,WAAA,EAAaA,WAAA;MACbW,SAAA,EAAWV,gBAAA,CAAiBK,KAAK,CAACC,UAAU,CAACM,cAAc;MAC3DD,SAAA,EAAWT,OAAA,CAAQS,SAAS;MAC5BR,WAAA,EAAaA;;EAGnB;EAEA,IAAIH,gBAAA,CAAiBK,KAAK,CAACC,UAAU,EAAEQ,UAAA,EAAY;IACjDV,MAAA,CAAOW,UAAU,gBACfN,IAAA,CAACZ,qBAAA;MACCE,WAAA,EAAaA,WAAA;MACbW,SAAA,EAAWV,gBAAA,CAAiBK,KAAK,CAACC,UAAU,CAACQ,UAAU;MACvDH,SAAA,EAAWT,OAAA,CAAQS,SAAS;MAC5BR,WAAA,EAAaA;;EAGnB;EAEA,IAAIH,gBAAA,CAAiBK,KAAK,CAACC,UAAU,EAAEU,eAAA,EAAiB;IACtDZ,MAAA,CAAOa,eAAe,gBACpBR,IAAA,CAACZ,qBAAA;MACCE,WAAA,EAAaA,WAAA;MACbW,SAAA,EAAWV,gBAAA,CAAiBK,KAAK,CAACC,UAAU,CAACU,eAAe;MAC5DL,SAAA,EAAWT,OAAA,CAAQS,SAAS;MAC5BR,WAAA,EAAaA;;EAGnB;EAEA,IAAIH,gBAAA,CAAiBK,KAAK,CAACC,UAAU,EAAEY,WAAA,EAAa;IAClDd,MAAA,CAAOc,WAAW,gBAChBT,IAAA,CAACZ,qBAAA;MACCE,WAAA,EAAa;QACXE,WAAA;QACA,GAAGF;MACL;MACAW,SAAA,EAAWV,gBAAA,CAAiBK,KAAK,CAACC,UAAU,CAACY,WAAW;MACxDP,SAAA,EAAWT,OAAA,CAAQS,SAAS;MAC5BR,WAAA,EAAaA;;EAGnB;EAEA,OAAOC,MAAA;AACT","ignoreList":[]}

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

@@ -17,7 +17,7 @@ export interface LivePreviewContextType {
         width: number;
     };
     openPopupWindow: ReturnType<typeof usePopupWindow>['openPopupWindow'];
-    popupRef?: React.RefObject<Window | null>;
+    popupRef?: React.RefObject<null | Window>;
     previewWindowType: 'iframe' | 'popup';
     setAppIsReady: (appIsReady: boolean) => void;
     setBreakpoint: (breakpoint: LivePreviewConfig['breakpoints'][number]['name']) => void;

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

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

@@ -1 +1 @@
-{"version":3,"file":"context.js","names":["createContext","useContext","LivePreviewContext","appIsReady","breakpoint","undefined","breakpoints","fieldSchemaJSON","iframeHasLoaded","iframeRef","isPopupOpen","measuredDeviceSize","height","width","openPopupWindow","popupRef","previewWindowType","setAppIsReady","setBreakpoint","setHeight","setIframeHasLoaded","setMeasuredDeviceSize","setPreviewWindowType","setSize","setToolbarPosition","setWidth","setZoom","size","toolbarPosition","x","y","url","zoom","useLivePreviewContext"],"sources":["../../../../src/views/LivePreview/Context/context.ts"],"sourcesContent":["'use client'\nimport type { LivePreviewConfig } from 'payload'\nimport type { fieldSchemaToJSON } from 'payload/shared'\nimport type { Dispatch } from 'react'\nimport type React from 'react'\n\nimport { createContext, useContext } from 'react'\n\nimport type { usePopupWindow } from '../usePopupWindow.js'\nimport type { SizeReducerAction } from './sizeReducer.js'\n\nexport interface LivePreviewContextType {\n  appIsReady: boolean\n  breakpoint: LivePreviewConfig['breakpoints'][number]['name']\n  breakpoints: LivePreviewConfig['breakpoints']\n  fieldSchemaJSON?: ReturnType<typeof fieldSchemaToJSON>\n  iframeHasLoaded: boolean\n  iframeRef: React.RefObject<HTMLIFrameElement | null>\n  isPopupOpen: boolean\n  measuredDeviceSize: {\n    height: number\n    width: number\n  }\n  openPopupWindow: ReturnType<typeof usePopupWindow>['openPopupWindow']\n  popupRef?: React.RefObject<Window | null>\n  previewWindowType: 'iframe' | 'popup'\n  setAppIsReady: (appIsReady: boolean) => void\n  setBreakpoint: (breakpoint: LivePreviewConfig['breakpoints'][number]['name']) => void\n  setHeight: (height: number) => void\n  setIframeHasLoaded: (loaded: boolean) => void\n  setMeasuredDeviceSize: (size: { height: number; width: number }) => void\n  setPreviewWindowType: (previewWindowType: 'iframe' | 'popup') => void\n  setSize: Dispatch<SizeReducerAction>\n  setToolbarPosition: (position: { x: number; y: number }) => void\n  setWidth: (width: number) => void\n  setZoom: (zoom: number) => void\n  size: {\n    height: number\n    width: number\n  }\n  toolbarPosition: {\n    x: number\n    y: number\n  }\n  url: string | undefined\n  zoom: number\n}\n\nexport const LivePreviewContext = createContext<LivePreviewContextType>({\n  appIsReady: false,\n  breakpoint: undefined,\n  breakpoints: undefined,\n  fieldSchemaJSON: undefined,\n  iframeHasLoaded: false,\n  iframeRef: undefined,\n  isPopupOpen: false,\n  measuredDeviceSize: {\n    height: 0,\n    width: 0,\n  },\n  openPopupWindow: () => {},\n  popupRef: undefined,\n  previewWindowType: 'iframe',\n  setAppIsReady: () => {},\n  setBreakpoint: () => {},\n  setHeight: () => {},\n  setIframeHasLoaded: () => {},\n  setMeasuredDeviceSize: () => {},\n  setPreviewWindowType: () => {},\n  setSize: () => {},\n  setToolbarPosition: () => {},\n  setWidth: () => {},\n  setZoom: () => {},\n  size: {\n    height: 0,\n    width: 0,\n  },\n  toolbarPosition: {\n    x: 0,\n    y: 0,\n  },\n  url: undefined,\n  zoom: 1,\n})\n\nexport const useLivePreviewContext = () => useContext(LivePreviewContext)\n"],"mappings":"AAAA;;AAMA,SAASA,aAAa,EAAEC,UAAU,QAAQ;AA0C1C,OAAO,MAAMC,kBAAA,GAAqBF,aAAA,CAAsC;EACtEG,UAAA,EAAY;EACZC,UAAA,EAAYC,SAAA;EACZC,WAAA,EAAaD,SAAA;EACbE,eAAA,EAAiBF,SAAA;EACjBG,eAAA,EAAiB;EACjBC,SAAA,EAAWJ,SAAA;EACXK,WAAA,EAAa;EACbC,kBAAA,EAAoB;IAClBC,MAAA,EAAQ;IACRC,KAAA,EAAO;EACT;EACAC,eAAA,EAAiBA,CAAA,MAAO;EACxBC,QAAA,EAAUV,SAAA;EACVW,iBAAA,EAAmB;EACnBC,aAAA,EAAeA,CAAA,MAAO;EACtBC,aAAA,EAAeA,CAAA,MAAO;EACtBC,SAAA,EAAWA,CAAA,MAAO;EAClBC,kBAAA,EAAoBA,CAAA,MAAO;EAC3BC,qBAAA,EAAuBA,CAAA,MAAO;EAC9BC,oBAAA,EAAsBA,CAAA,MAAO;EAC7BC,OAAA,EAASA,CAAA,MAAO;EAChBC,kBAAA,EAAoBA,CAAA,MAAO;EAC3BC,QAAA,EAAUA,CAAA,MAAO;EACjBC,OAAA,EAASA,CAAA,MAAO;EAChBC,IAAA,EAAM;IACJf,MAAA,EAAQ;IACRC,KAAA,EAAO;EACT;EACAe,eAAA,EAAiB;IACfC,CAAA,EAAG;IACHC,CAAA,EAAG;EACL;EACAC,GAAA,EAAK1B,SAAA;EACL2B,IAAA,EAAM;AACR;AAEA,OAAO,MAAMC,qBAAA,GAAwBA,CAAA;EAAA,OAAMhC,UAAA,CAAAC,kBAAW;AAAA","ignoreList":[]}
+{"version":3,"file":"context.js","names":["createContext","useContext","LivePreviewContext","appIsReady","breakpoint","undefined","breakpoints","fieldSchemaJSON","iframeHasLoaded","iframeRef","isPopupOpen","measuredDeviceSize","height","width","openPopupWindow","popupRef","previewWindowType","setAppIsReady","setBreakpoint","setHeight","setIframeHasLoaded","setMeasuredDeviceSize","setPreviewWindowType","setSize","setToolbarPosition","setWidth","setZoom","size","toolbarPosition","x","y","url","zoom","useLivePreviewContext"],"sources":["../../../../src/views/LivePreview/Context/context.ts"],"sourcesContent":["'use client'\nimport type { LivePreviewConfig } from 'payload'\nimport type { fieldSchemaToJSON } from 'payload/shared'\nimport type { Dispatch } from 'react'\nimport type React from 'react'\n\nimport { createContext, useContext } from 'react'\n\nimport type { usePopupWindow } from '../usePopupWindow.js'\nimport type { SizeReducerAction } from './sizeReducer.js'\n\nexport interface LivePreviewContextType {\n  appIsReady: boolean\n  breakpoint: LivePreviewConfig['breakpoints'][number]['name']\n  breakpoints: LivePreviewConfig['breakpoints']\n  fieldSchemaJSON?: ReturnType<typeof fieldSchemaToJSON>\n  iframeHasLoaded: boolean\n  iframeRef: React.RefObject<HTMLIFrameElement | null>\n  isPopupOpen: boolean\n  measuredDeviceSize: {\n    height: number\n    width: number\n  }\n  openPopupWindow: ReturnType<typeof usePopupWindow>['openPopupWindow']\n  popupRef?: React.RefObject<null | Window>\n  previewWindowType: 'iframe' | 'popup'\n  setAppIsReady: (appIsReady: boolean) => void\n  setBreakpoint: (breakpoint: LivePreviewConfig['breakpoints'][number]['name']) => void\n  setHeight: (height: number) => void\n  setIframeHasLoaded: (loaded: boolean) => void\n  setMeasuredDeviceSize: (size: { height: number; width: number }) => void\n  setPreviewWindowType: (previewWindowType: 'iframe' | 'popup') => void\n  setSize: Dispatch<SizeReducerAction>\n  setToolbarPosition: (position: { x: number; y: number }) => void\n  setWidth: (width: number) => void\n  setZoom: (zoom: number) => void\n  size: {\n    height: number\n    width: number\n  }\n  toolbarPosition: {\n    x: number\n    y: number\n  }\n  url: string | undefined\n  zoom: number\n}\n\nexport const LivePreviewContext = createContext<LivePreviewContextType>({\n  appIsReady: false,\n  breakpoint: undefined,\n  breakpoints: undefined,\n  fieldSchemaJSON: undefined,\n  iframeHasLoaded: false,\n  iframeRef: undefined,\n  isPopupOpen: false,\n  measuredDeviceSize: {\n    height: 0,\n    width: 0,\n  },\n  openPopupWindow: () => {},\n  popupRef: undefined,\n  previewWindowType: 'iframe',\n  setAppIsReady: () => {},\n  setBreakpoint: () => {},\n  setHeight: () => {},\n  setIframeHasLoaded: () => {},\n  setMeasuredDeviceSize: () => {},\n  setPreviewWindowType: () => {},\n  setSize: () => {},\n  setToolbarPosition: () => {},\n  setWidth: () => {},\n  setZoom: () => {},\n  size: {\n    height: 0,\n    width: 0,\n  },\n  toolbarPosition: {\n    x: 0,\n    y: 0,\n  },\n  url: undefined,\n  zoom: 1,\n})\n\nexport const useLivePreviewContext = () => useContext(LivePreviewContext)\n"],"mappings":"AAAA;;AAMA,SAASA,aAAa,EAAEC,UAAU,QAAQ;AA0C1C,OAAO,MAAMC,kBAAA,GAAqBF,aAAA,CAAsC;EACtEG,UAAA,EAAY;EACZC,UAAA,EAAYC,SAAA;EACZC,WAAA,EAAaD,SAAA;EACbE,eAAA,EAAiBF,SAAA;EACjBG,eAAA,EAAiB;EACjBC,SAAA,EAAWJ,SAAA;EACXK,WAAA,EAAa;EACbC,kBAAA,EAAoB;IAClBC,MAAA,EAAQ;IACRC,KAAA,EAAO;EACT;EACAC,eAAA,EAAiBA,CAAA,MAAO;EACxBC,QAAA,EAAUV,SAAA;EACVW,iBAAA,EAAmB;EACnBC,aAAA,EAAeA,CAAA,MAAO;EACtBC,aAAA,EAAeA,CAAA,MAAO;EACtBC,SAAA,EAAWA,CAAA,MAAO;EAClBC,kBAAA,EAAoBA,CAAA,MAAO;EAC3BC,qBAAA,EAAuBA,CAAA,MAAO;EAC9BC,oBAAA,EAAsBA,CAAA,MAAO;EAC7BC,OAAA,EAASA,CAAA,MAAO;EAChBC,kBAAA,EAAoBA,CAAA,MAAO;EAC3BC,QAAA,EAAUA,CAAA,MAAO;EACjBC,OAAA,EAASA,CAAA,MAAO;EAChBC,IAAA,EAAM;IACJf,MAAA,EAAQ;IACRC,KAAA,EAAO;EACT;EACAe,eAAA,EAAiB;IACfC,CAAA,EAAG;IACHC,CAAA,EAAG;EACL;EACAC,GAAA,EAAK1B,SAAA;EACL2B,IAAA,EAAM;AACR;AAEA,OAAO,MAAMC,qBAAA,GAAwBA,CAAA;EAAA,OAAMhC,UAAA,CAAAC,kBAAW;AAAA","ignoreList":[]}

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

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

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

@@ -100,7 +100,9 @@ export const LivePreviewProvider = ({
   const handleWindowChange = useCallback(type => {
     setAppIsReady(false);
     setPreviewWindowType(type);
-    if (type === 'popup') openPopupWindow();
+    if (type === 'popup') {
+      openPopupWindow();
+    }
   }, [openPopupWindow]);
   // when the user closes the popup window, switch back to the iframe
   // the `usePopupWindow` reports the `isPopupOpen` state for us to use here

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

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

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

@@ -13,8 +13,8 @@ export type SizeReducerAction = {
     };
 };
 export declare const sizeReducer: (state: SizeReducerState, action: SizeReducerAction) => {
-    width: number;
     height: number;
+    width: number;
 };
 export {};
 //# sourceMappingURL=sizeReducer.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"sizeReducer.d.ts","sourceRoot":"","sources":["../../../../src/views/LivePreview/Context/sizeReducer.ts"],"names":[],"mappings":"AAWA,KAAK,gBAAgB,GAAG;IACtB,MAAM,EAAE,MAAM,CAAA;IACd,KAAK,EAAE,MAAM,CAAA;CACd,CAAA;AAED,MAAM,MAAM,iBAAiB,GACzB;IACE,IAAI,EAAE,QAAQ,GAAG,OAAO,CAAA;IACxB,KAAK,EAAE,MAAM,CAAA;CACd,GACD;IACE,IAAI,EAAE,OAAO,CAAA;IACb,KAAK,EAAE;QACL,MAAM,EAAE,MAAM,CAAA;QACd,KAAK,EAAE,MAAM,CAAA;KACd,CAAA;CACF,CAAA;AAEL,eAAO,MAAM,WAAW,UAAW,gBAAgB,UAAU,iBAAiB;;YAjBpE,MAAM;CA0Bf,CAAA"}
+{"version":3,"file":"sizeReducer.d.ts","sourceRoot":"","sources":["../../../../src/views/LivePreview/Context/sizeReducer.ts"],"names":[],"mappings":"AAWA,KAAK,gBAAgB,GAAG;IACtB,MAAM,EAAE,MAAM,CAAA;IACd,KAAK,EAAE,MAAM,CAAA;CACd,CAAA;AAED,MAAM,MAAM,iBAAiB,GACzB;IACE,IAAI,EAAE,QAAQ,GAAG,OAAO,CAAA;IACxB,KAAK,EAAE,MAAM,CAAA;CACd,GACD;IACE,IAAI,EAAE,OAAO,CAAA;IACb,KAAK,EAAE;QACL,MAAM,EAAE,MAAM,CAAA;QACd,KAAK,EAAE,MAAM,CAAA;KACd,CAAA;CACF,CAAA;AAEL,eAAO,MAAM,WAAW,UAAW,gBAAgB,UAAU,iBAAiB;;WAhBrE,MAAM;CAyBd,CAAA"}

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

@@ -10,15 +10,15 @@
 // },
 export const sizeReducer = (state, action) => {
   switch (action.type) {
-    case 'width':
+    case 'height':
       return {
         ...state,
-        width: action.value
+        height: action.value
       };
-    case 'height':
+    case 'width':
       return {
         ...state,
-        height: action.value
+        width: action.value
       };
     default:
       return {

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

@@ -1 +1 @@
-{"version":3,"file":"sizeReducer.js","names":["sizeReducer","state","action","type","width","value","height"],"sources":["../../../../src/views/LivePreview/Context/sizeReducer.ts"],"sourcesContent":["// export const sizeReducer: (state, action) => {\n//   switch (action.type) {\n//     case 'width':\n//       return { ...state, width: action.value }\n//     case 'height':\n//       return { ...state, height: action.value }\n//     default:\n//       return { ...state, ...(action?.value || {}) }\n//   }\n// },\n\ntype SizeReducerState = {\n  height: number\n  width: number\n}\n\nexport type SizeReducerAction =\n  | {\n      type: 'height' | 'width'\n      value: number\n    }\n  | {\n      type: 'reset'\n      value: {\n        height: number\n        width: number\n      }\n    }\n\nexport const sizeReducer = (state: SizeReducerState, action: SizeReducerAction) => {\n  switch (action.type) {\n    case 'width':\n      return { ...state, width: action.value }\n    case 'height':\n      return { ...state, height: action.value }\n    default:\n      return { ...state, ...(action?.value || {}) }\n  }\n}\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAoBA,OAAO,MAAMA,WAAA,GAAcA,CAACC,KAAA,EAAyBC,MAAA;EACnD,QAAQA,MAAA,CAAOC,IAAI;IACjB,KAAK;MACH,OAAO;QAAE,GAAGF,KAAK;QAAEG,KAAA,EAAOF,MAAA,CAAOG;MAAM;IACzC,KAAK;MACH,OAAO;QAAE,GAAGJ,KAAK;QAAEK,MAAA,EAAQJ,MAAA,CAAOG;MAAM;IAC1C;MACE,OAAO;QAAE,GAAGJ,KAAK;QAAE,IAAIC,MAAA,EAAQG,KAAA,IAAS,CAAC,CAAC;MAAE;EAChD;AACF","ignoreList":[]}
+{"version":3,"file":"sizeReducer.js","names":["sizeReducer","state","action","type","height","value","width"],"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 'height':\n      return { ...state, height: action.value }\n    case 'width':\n      return { ...state, width: action.value }\n    default:\n      return { ...state, ...(action?.value || {}) }\n  }\n}\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAoBA,OAAO,MAAMA,WAAA,GAAcA,CAACC,KAAA,EAAyBC,MAAA;EACnD,QAAQA,MAAA,CAAOC,IAAI;IACjB,KAAK;MACH,OAAO;QAAE,GAAGF,KAAK;QAAEG,MAAA,EAAQF,MAAA,CAAOG;MAAM;IAC1C,KAAK;MACH,OAAO;QAAE,GAAGJ,KAAK;QAAEK,KAAA,EAAOJ,MAAA,CAAOG;MAAM;IACzC;MACE,OAAO;QAAE,GAAGJ,KAAK;QAAE,IAAIC,MAAA,EAAQG,KAAA,IAAS,CAAC,CAAC;MAAE;EAChD;AACF","ignoreList":[]}

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

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