@payloadcms/ui 3.0.0-canary.6041f49 → 3.0.0-canary.690108d

package/dist/elements/ListControls/index.scss

@@ -5,6 +5,9 @@
     display: flex;
     align-items: center;
     background-color: var(--theme-elevation-50);
+    border-radius: var(--style-radius-m);
+    padding: base(0.6);
+    gap: base(0.6);
   }
 
   .search-filter {
@@ -18,21 +21,13 @@
   &__buttons-wrap {
     display: flex;
     align-items: center;
-    gap: base(0.5);
-
-    [dir='ltr'] & {
-      margin-right: base(0.5);
-    }
-
-    [dir='rtl'] & {
-      margin-left: base(0.5);
-    }
+    gap: base(0.2);
 
     .pill {
-      background-color: var(--theme-elevation-200);
+      background-color: var(--theme-elevation-150);
 
       &:hover {
-        background-color: var(--theme-elevation-150);
+        background-color: var(--theme-elevation-100);
       }
     }
   }
@@ -53,11 +48,22 @@
     &__wrap {
       flex-wrap: wrap;
       background-color: unset;
+      padding: 0;
+      position: relative;
+    }
+
+    .icon--search {
+      position: absolute;
+      top: base(0.4);
+      inset-inline-start: base(0.4);
+      z-index: 1;
     }
 
     .search-filter {
-      margin-bottom: base(0.5);
       width: 100%;
+      input {
+        padding: base(0.4) base(2);
+      }
     }
 
     &__buttons-wrap {
@@ -70,11 +76,8 @@
       }
 
       .pill {
-        padding: base(0.5) base(1);
-
-        svg {
-          margin-left: auto;
-        }
+        padding: base(0.2) base(0.2) base(0.2) base(0.4);
+        justify-content: space-between;
       }
     }
 

package/dist/elements/ListDrawer/DrawerContent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DrawerContent.d.ts","sourceRoot":"","sources":["../../../src/elements/ListDrawer/DrawerContent.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAuD,MAAM,OAAO,CAAA;AAE3E,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,YAAY,CAAA;AAoCjD,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CA2QvD,CAAA"}
+{"version":3,"file":"DrawerContent.d.ts","sourceRoot":"","sources":["../../../src/elements/ListDrawer/DrawerContent.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAuD,MAAM,OAAO,CAAA;AAE3E,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,YAAY,CAAA;AAoCjD,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAgRvD,CAAA"}

package/dist/elements/ListDrawer/DrawerContent.js

@@ -1,12 +1,13 @@
 'use client';
-import * as facelessUIImport from '@faceless-ui/modal';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useModal } from '@faceless-ui/modal';
 import { getTranslation } from '@payloadcms/translations';
 import React, { useCallback, useEffect, useReducer, useState } from 'react';
-import { FieldLabel } from '../../forms/FieldLabel/index.js';
-import usePayloadAPI from '../../hooks/usePayloadAPI.js';
-import { X } from '../../icons/X/index.js';
+import { FieldLabel } from '../../fields/FieldLabel/index.js';
+import { usePayloadAPI } from '../../hooks/usePayloadAPI.js';
+import { XIcon } from '../../icons/X/index.js';
 import { useAuth } from '../../providers/Auth/index.js';
-import { useComponentMap } from '../../providers/ComponentMap/index.js';
+import { RenderComponent } from '../../providers/Config/RenderComponent.js';
 import { useConfig } from '../../providers/Config/index.js';
 import { ListInfoProvider } from '../../providers/ListInfo/index.js';
 import { ListQueryProvider } from '../../providers/ListQuery/index.js';
@@ -40,7 +41,6 @@ const hoistQueryParamsToAnd = (where, queryParams)=>{
     return where;
 };
 export const ListDrawerContent = ({ collectionSlugs, customHeader, drawerSlug, filterOptions, onSelect, selectedCollection })=>{
-    const { useModal } = facelessUIImport;
     const { i18n, t } = useTranslation();
     const { permissions } = useAuth();
     const { setPreference } = usePreferences();
@@ -50,15 +50,14 @@ export const ListDrawerContent = ({ collectionSlugs, customHeader, drawerSlug, f
     const [page, setPage] = useState(1);
     const [where, setWhere] = useState(null);
     const [search, setSearch] = useState('');
-    const { componentMap } = useComponentMap();
-    const { collections, routes: { api }, serverURL } = useConfig();
+    const { config: { collections, routes: { api }, serverURL } } = useConfig();
     const enabledCollectionConfigs = collections.filter(({ slug })=>{
         return collectionSlugs.includes(slug);
     });
     const [selectedCollectionConfig, setSelectedCollectionConfig] = useState(()=>{
         return enabledCollectionConfigs.find(({ slug })=>slug === selectedCollection) || enabledCollectionConfigs?.[0];
     });
-    const { List } = componentMap.collections?.[selectedCollectionConfig?.slug] || {};
+    const List = selectedCollectionConfig?.admin?.components.views.list.Component;
     const [selectedOption, setSelectedOption] = useState(()=>selectedCollectionConfig ? {
             label: getTranslation(selectedCollectionConfig.labels.singular, i18n),
             value: selectedCollectionConfig.slug
@@ -88,7 +87,7 @@ export const ListDrawerContent = ({ collectionSlugs, customHeader, drawerSlug, f
         collectionSlug: selectedCollectionConfig.slug
     });
     useEffect(()=>{
-        if (selectedOption) {
+        if (selectedOption && !Array.isArray(selectedOption)) {
             setSelectedCollectionConfig(enabledCollectionConfigs.find(({ slug })=>selectedOption.value === slug));
         }
     }, [
@@ -102,11 +101,17 @@ export const ListDrawerContent = ({ collectionSlugs, customHeader, drawerSlug, f
     const apiURL = isOpen ? `${serverURL}${api}/${selectedCollectionConfig.slug}` : null;
     const [cacheBust, dispatchCacheBust] = useReducer((state)=>state + 1, 0) // used to force a re-fetch even when apiURL is unchanged
     ;
-    const [{ data, isError, isLoading: isLoadingList }, { setParams }] = usePayloadAPI(apiURL, {});
+    const [{ data, isError, isLoading: isLoadingList }, { setParams }] = usePayloadAPI(apiURL, {
+        initialParams: {
+            depth: 0
+        }
+    });
     const moreThanOneAvailableCollection = enabledCollectionConfigs.length > 1;
     useEffect(()=>{
         const { slug, admin: { listSearchableFields, useAsTitle } = {}, versions } = selectedCollectionConfig;
-        const params = {};
+        const params = {
+            depth: 0
+        };
         let copyOfWhere = {
             ...where || {}
         };
@@ -183,78 +188,110 @@ export const ListDrawerContent = ({ collectionSlugs, customHeader, drawerSlug, f
         return null;
     }
     if (isLoadingList) {
-        return /*#__PURE__*/ React.createElement(LoadingOverlay, null);
+        return /*#__PURE__*/ _jsx(LoadingOverlay, {});
     }
-    return /*#__PURE__*/ React.createElement(ListInfoProvider, {
-        Header: /*#__PURE__*/ React.createElement("header", {
-            className: `${baseClass}__header`
-        }, /*#__PURE__*/ React.createElement("div", {
-            className: `${baseClass}__header-wrap`
-        }, /*#__PURE__*/ React.createElement("div", {
-            className: `${baseClass}__header-content`
-        }, /*#__PURE__*/ React.createElement("h2", {
-            className: `${baseClass}__header-text`
-        }, !customHeader ? getTranslation(selectedCollectionConfig?.labels?.plural, i18n) : customHeader), hasCreatePermission && /*#__PURE__*/ React.createElement(DocumentDrawerToggler, {
-            className: `${baseClass}__create-new-button`
-        }, /*#__PURE__*/ React.createElement(Pill, null, t('general:createNew')))), /*#__PURE__*/ React.createElement("button", {
-            "aria-label": t('general:close'),
-            className: `${baseClass}__header-close`,
-            onClick: ()=>{
-                closeModal(drawerSlug);
-            },
-            type: "button"
-        }, /*#__PURE__*/ React.createElement(X, null))), selectedCollectionConfig?.admin?.description && /*#__PURE__*/ React.createElement("div", {
-            className: `${baseClass}__sub-header`
-        }, /*#__PURE__*/ React.createElement(ViewDescription, {
-            description: selectedCollectionConfig.admin.description
-        })), moreThanOneAvailableCollection && /*#__PURE__*/ React.createElement("div", {
-            className: `${baseClass}__select-collection-wrap`
-        }, /*#__PURE__*/ React.createElement(FieldLabel, {
-            label: t('upload:selectCollectionToBrowse')
-        }), /*#__PURE__*/ React.createElement(ReactSelect, {
-            className: `${baseClass}__select-collection`,
-            onChange: setSelectedOption,
-            options: enabledCollectionConfigs.map((coll)=>({
-                    label: getTranslation(coll.labels.singular, i18n),
-                    value: coll.slug
-                })),
-            value: selectedOption
-        }))),
+    return /*#__PURE__*/ _jsx(ListInfoProvider, {
+        Header: /*#__PURE__*/ _jsxs("header", {
+            className: `${baseClass}__header`,
+            children: [
+                /*#__PURE__*/ _jsxs("div", {
+                    className: `${baseClass}__header-wrap`,
+                    children: [
+                        /*#__PURE__*/ _jsxs("div", {
+                            className: `${baseClass}__header-content`,
+                            children: [
+                                /*#__PURE__*/ _jsx("h2", {
+                                    className: `${baseClass}__header-text`,
+                                    children: !customHeader ? getTranslation(selectedCollectionConfig?.labels?.plural, i18n) : customHeader
+                                }),
+                                hasCreatePermission && /*#__PURE__*/ _jsx(DocumentDrawerToggler, {
+                                    className: `${baseClass}__create-new-button`,
+                                    children: /*#__PURE__*/ _jsx(Pill, {
+                                        children: t('general:createNew')
+                                    })
+                                })
+                            ]
+                        }),
+                        /*#__PURE__*/ _jsx("button", {
+                            "aria-label": t('general:close'),
+                            className: `${baseClass}__header-close`,
+                            onClick: ()=>{
+                                closeModal(drawerSlug);
+                            },
+                            type: "button",
+                            children: /*#__PURE__*/ _jsx(XIcon, {})
+                        })
+                    ]
+                }),
+                selectedCollectionConfig?.admin?.description && /*#__PURE__*/ _jsx("div", {
+                    className: `${baseClass}__sub-header`,
+                    children: /*#__PURE__*/ _jsx(ViewDescription, {
+                        description: selectedCollectionConfig.admin.description
+                    })
+                }),
+                moreThanOneAvailableCollection && /*#__PURE__*/ _jsxs("div", {
+                    className: `${baseClass}__select-collection-wrap`,
+                    children: [
+                        /*#__PURE__*/ _jsx(FieldLabel, {
+                            field: null,
+                            label: t('upload:selectCollectionToBrowse')
+                        }),
+                        /*#__PURE__*/ _jsx(ReactSelect, {
+                            className: `${baseClass}__select-collection`,
+                            onChange: setSelectedOption,
+                            options: enabledCollectionConfigs.map((coll)=>({
+                                    label: getTranslation(coll.labels.singular, i18n),
+                                    value: coll.slug
+                                })),
+                            value: selectedOption
+                        })
+                    ]
+                })
+            ]
+        }),
         collectionConfig: selectedCollectionConfig,
         collectionSlug: selectedCollectionConfig.slug,
         hasCreatePermission: hasCreatePermission,
-        newDocumentURL: null
-    }, /*#__PURE__*/ React.createElement(ListQueryProvider, {
-        data: data,
-        defaultLimit: limit || selectedCollectionConfig?.admin?.pagination?.defaultLimit,
-        defaultSort: sort,
-        handlePageChange: setPage,
-        handlePerPageChange: setLimit,
-        handleSearchChange: setSearch,
-        handleSortChange: setSort,
-        handleWhereChange: setWhere,
-        modifySearchParams: false,
-        preferenceKey: preferenceKey
-    }, /*#__PURE__*/ React.createElement(TableColumnsProvider, {
-        cellProps: [
-            {
-                className: `${baseClass}__first-cell`,
-                link: false,
-                onClick: ({ collectionSlug: rowColl, rowData })=>{
-                    if (typeof onSelect === 'function') {
-                        onSelect({
-                            collectionSlug: rowColl,
-                            docID: rowData.id
-                        });
+        newDocumentURL: null,
+        children: /*#__PURE__*/ _jsx(ListQueryProvider, {
+            data: data,
+            defaultLimit: limit || selectedCollectionConfig?.admin?.pagination?.defaultLimit,
+            defaultSort: sort,
+            handlePageChange: setPage,
+            handlePerPageChange: setLimit,
+            handleSearchChange: setSearch,
+            handleSortChange: setSort,
+            handleWhereChange: setWhere,
+            modifySearchParams: false,
+            preferenceKey: preferenceKey,
+            children: /*#__PURE__*/ _jsxs(TableColumnsProvider, {
+                cellProps: [
+                    {
+                        className: `${baseClass}__first-cell`,
+                        link: false,
+                        onClick: ({ collectionSlug: rowColl, rowData })=>{
+                            if (typeof onSelect === 'function') {
+                                onSelect({
+                                    collectionSlug: rowColl,
+                                    docID: rowData.id
+                                });
+                            }
+                        }
                     }
-                }
-            }
-        ],
-        collectionSlug: selectedCollectionConfig.slug,
-        preferenceKey: preferenceKey
-    }, List, /*#__PURE__*/ React.createElement(DocumentDrawer, {
-        onSave: onCreateNew
-    }))));
+                ],
+                collectionSlug: selectedCollectionConfig.slug,
+                preferenceKey: preferenceKey,
+                children: [
+                    /*#__PURE__*/ _jsx(RenderComponent, {
+                        mappedComponent: List
+                    }),
+                    /*#__PURE__*/ _jsx(DocumentDrawer, {
+                        onSave: onCreateNew
+                    })
+                ]
+            })
+        })
+    });
 };
 
 //# sourceMappingURL=DrawerContent.js.map

package/dist/elements/ListDrawer/DrawerContent.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/ListDrawer/DrawerContent.tsx"],"sourcesContent":["'use client'\nimport type { ClientCollectionConfig } from 'payload/types'\nimport type { Where } from 'payload/types'\n\nimport * as facelessUIImport from '@faceless-ui/modal'\nimport { getTranslation } from '@payloadcms/translations'\nimport React, { useCallback, useEffect, useReducer, useState } from 'react'\n\nimport type { ListDrawerProps } from './types.js'\n\nimport { FieldLabel } from '../../forms/FieldLabel/index.js'\nimport usePayloadAPI from '../../hooks/usePayloadAPI.js'\nimport { X } from '../../icons/X/index.js'\nimport { useAuth } from '../../providers/Auth/index.js'\nimport { useComponentMap } from '../../providers/ComponentMap/index.js'\nimport { useConfig } from '../../providers/Config/index.js'\nimport { ListInfoProvider } from '../../providers/ListInfo/index.js'\nimport { ListQueryProvider } from '../../providers/ListQuery/index.js'\nimport { usePreferences } from '../../providers/Preferences/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { useDocumentDrawer } from '../DocumentDrawer/index.js'\nimport { LoadingOverlay } from '../Loading/index.js'\nimport { Pill } from '../Pill/index.js'\nimport { ReactSelect } from '../ReactSelect/index.js'\nimport { TableColumnsProvider } from '../TableColumns/index.js'\nimport { ViewDescription } from '../ViewDescription/index.js'\nimport { baseClass } from './index.js'\n\nconst hoistQueryParamsToAnd = (where: Where, queryParams: Where) => {\n  if ('and' in where) {\n    where.and.push(queryParams)\n  } else if ('or' in where) {\n    where = {\n      and: [where, queryParams],\n    }\n  } else {\n    where = {\n      and: [where, queryParams],\n    }\n  }\n\n  return where\n}\n\nexport const ListDrawerContent: React.FC<ListDrawerProps> = ({\n  collectionSlugs,\n  customHeader,\n  drawerSlug,\n  filterOptions,\n  onSelect,\n  selectedCollection,\n}) => {\n  const { useModal } = facelessUIImport\n\n  const { i18n, t } = useTranslation()\n  const { permissions } = useAuth()\n  const { setPreference } = usePreferences()\n  const { closeModal, isModalOpen } = useModal()\n  const [limit, setLimit] = useState<number>()\n  const [sort, setSort] = useState<string>(null)\n  const [page, setPage] = useState<number>(1)\n  const [where, setWhere] = useState<Where>(null)\n  const [search, setSearch] = useState<string>('')\n\n  const { componentMap } = useComponentMap()\n\n  const {\n    collections,\n    routes: { api },\n    serverURL,\n  } = useConfig()\n\n  const enabledCollectionConfigs = collections.filter(({ slug }) => {\n    return collectionSlugs.includes(slug)\n  })\n\n  const [selectedCollectionConfig, setSelectedCollectionConfig] = useState<ClientCollectionConfig>(\n    () => {\n      return (\n        enabledCollectionConfigs.find(({ slug }) => slug === selectedCollection) ||\n        enabledCollectionConfigs?.[0]\n      )\n    },\n  )\n\n  const { List } = componentMap.collections?.[selectedCollectionConfig?.slug] || {}\n\n  const [selectedOption, setSelectedOption] = useState<{ label: string; value: string }>(() =>\n    selectedCollectionConfig\n      ? {\n          label: getTranslation(selectedCollectionConfig.labels.singular, i18n),\n          value: selectedCollectionConfig.slug,\n        }\n      : undefined,\n  )\n\n  // const [fields, setFields] = useState<Field[]>(() => formatFields(selectedCollectionConfig))\n\n  useEffect(() => {\n    // setFields(formatFields(selectedCollectionConfig))\n  }, [selectedCollectionConfig])\n\n  // allow external control of selected collection, same as the initial state logic above\n  useEffect(() => {\n    if (selectedCollection) {\n      // if passed a selection, find it and check if it's enabled\n      const selectedConfig =\n        enabledCollectionConfigs.find(({ slug }) => slug === selectedCollection) ||\n        enabledCollectionConfigs?.[0]\n      setSelectedCollectionConfig(selectedConfig)\n    }\n  }, [selectedCollection, enabledCollectionConfigs, onSelect, t])\n\n  const preferenceKey = `${selectedCollectionConfig.slug}-list`\n\n  // this is the 'create new' drawer\n  const [DocumentDrawer, DocumentDrawerToggler, { drawerSlug: documentDrawerSlug }] =\n    useDocumentDrawer({\n      collectionSlug: selectedCollectionConfig.slug,\n    })\n\n  useEffect(() => {\n    if (selectedOption) {\n      setSelectedCollectionConfig(\n        enabledCollectionConfigs.find(({ slug }) => selectedOption.value === slug),\n      )\n    }\n  }, [selectedOption, enabledCollectionConfigs])\n\n  const collectionPermissions = permissions?.collections?.[selectedCollectionConfig?.slug]\n  const hasCreatePermission = collectionPermissions?.create?.permission\n\n  // If modal is open, get active page of upload gallery\n  const isOpen = isModalOpen(drawerSlug)\n  const apiURL = isOpen ? `${serverURL}${api}/${selectedCollectionConfig.slug}` : null\n  const [cacheBust, dispatchCacheBust] = useReducer((state) => state + 1, 0) // used to force a re-fetch even when apiURL is unchanged\n  const [{ data, isError, isLoading: isLoadingList }, { setParams }] = usePayloadAPI(apiURL, {})\n  const moreThanOneAvailableCollection = enabledCollectionConfigs.length > 1\n\n  useEffect(() => {\n    const {\n      slug,\n      admin: { listSearchableFields, useAsTitle } = {},\n      versions,\n    } = selectedCollectionConfig\n    const params: {\n      cacheBust?: number\n      draft?: string\n      limit?: number\n      page?: number\n      search?: string\n      sort?: string\n      where?: unknown\n    } = {}\n\n    let copyOfWhere = { ...(where || {}) }\n    const filterOption = filterOptions?.[slug]\n\n    if (filterOptions && typeof filterOption !== 'boolean') {\n      copyOfWhere = hoistQueryParamsToAnd(copyOfWhere, filterOption)\n    }\n\n    if (search) {\n      const searchAsConditions = (listSearchableFields || [useAsTitle]).map((fieldName) => {\n        return {\n          [fieldName]: {\n            like: search,\n          },\n        }\n      }, [])\n\n      if (searchAsConditions.length > 0) {\n        const searchFilter: Where = {\n          or: [...searchAsConditions],\n        }\n\n        copyOfWhere = hoistQueryParamsToAnd(copyOfWhere, searchFilter)\n      }\n    }\n\n    if (page) params.page = page\n    if (sort) params.sort = sort\n    if (cacheBust) params.cacheBust = cacheBust\n    if (copyOfWhere) params.where = copyOfWhere\n    if (versions?.drafts) params.draft = 'true'\n\n    setParams(params)\n  }, [page, sort, where, search, cacheBust, filterOptions, selectedCollectionConfig, t, setParams])\n\n  useEffect(() => {\n    const newPreferences = {\n      limit,\n      sort,\n    }\n\n    void setPreference(preferenceKey, newPreferences, true)\n  }, [sort, limit, setPreference, preferenceKey])\n\n  const onCreateNew = useCallback(\n    ({ doc }) => {\n      if (typeof onSelect === 'function') {\n        onSelect({\n          collectionSlug: selectedCollectionConfig.slug,\n          docID: doc.id,\n        })\n      }\n      dispatchCacheBust()\n      closeModal(documentDrawerSlug)\n      closeModal(drawerSlug)\n    },\n    [closeModal, documentDrawerSlug, drawerSlug, onSelect, selectedCollectionConfig],\n  )\n\n  if (!selectedCollectionConfig || isError) {\n    return null\n  }\n\n  if (isLoadingList) {\n    return <LoadingOverlay />\n  }\n\n  return (\n    <ListInfoProvider\n      Header={\n        <header className={`${baseClass}__header`}>\n          <div className={`${baseClass}__header-wrap`}>\n            <div className={`${baseClass}__header-content`}>\n              <h2 className={`${baseClass}__header-text`}>\n                {!customHeader\n                  ? getTranslation(selectedCollectionConfig?.labels?.plural, i18n)\n                  : customHeader}\n              </h2>\n              {hasCreatePermission && (\n                <DocumentDrawerToggler className={`${baseClass}__create-new-button`}>\n                  <Pill>{t('general:createNew')}</Pill>\n                </DocumentDrawerToggler>\n              )}\n            </div>\n            <button\n              aria-label={t('general:close')}\n              className={`${baseClass}__header-close`}\n              onClick={() => {\n                closeModal(drawerSlug)\n              }}\n              type=\"button\"\n            >\n              <X />\n            </button>\n          </div>\n          {selectedCollectionConfig?.admin?.description && (\n            <div className={`${baseClass}__sub-header`}>\n              <ViewDescription description={selectedCollectionConfig.admin.description} />\n            </div>\n          )}\n          {moreThanOneAvailableCollection && (\n            <div className={`${baseClass}__select-collection-wrap`}>\n              <FieldLabel label={t('upload:selectCollectionToBrowse')} />\n              <ReactSelect\n                className={`${baseClass}__select-collection`}\n                onChange={setSelectedOption} // this is only changing the options which is not rerunning my effect\n                options={enabledCollectionConfigs.map((coll) => ({\n                  label: getTranslation(coll.labels.singular, i18n),\n                  value: coll.slug,\n                }))}\n                value={selectedOption}\n              />\n            </div>\n          )}\n        </header>\n      }\n      collectionConfig={selectedCollectionConfig}\n      collectionSlug={selectedCollectionConfig.slug}\n      hasCreatePermission={hasCreatePermission}\n      newDocumentURL={null}\n    >\n      <ListQueryProvider\n        data={data}\n        defaultLimit={limit || selectedCollectionConfig?.admin?.pagination?.defaultLimit}\n        defaultSort={sort}\n        handlePageChange={setPage}\n        handlePerPageChange={setLimit}\n        handleSearchChange={setSearch}\n        handleSortChange={setSort}\n        handleWhereChange={setWhere}\n        modifySearchParams={false}\n        preferenceKey={preferenceKey}\n      >\n        <TableColumnsProvider\n          cellProps={[\n            {\n              className: `${baseClass}__first-cell`,\n              link: false,\n              onClick: ({ collectionSlug: rowColl, rowData }) => {\n                if (typeof onSelect === 'function') {\n                  onSelect({\n                    collectionSlug: rowColl,\n                    docID: rowData.id as string,\n                  })\n                }\n              },\n            },\n          ]}\n          collectionSlug={selectedCollectionConfig.slug}\n          preferenceKey={preferenceKey}\n        >\n          {List}\n          <DocumentDrawer onSave={onCreateNew} />\n        </TableColumnsProvider>\n      </ListQueryProvider>\n    </ListInfoProvider>\n  )\n}\n"],"names":["facelessUIImport","getTranslation","React","useCallback","useEffect","useReducer","useState","FieldLabel","usePayloadAPI","X","useAuth","useComponentMap","useConfig","ListInfoProvider","ListQueryProvider","usePreferences","useTranslation","useDocumentDrawer","LoadingOverlay","Pill","ReactSelect","TableColumnsProvider","ViewDescription","baseClass","hoistQueryParamsToAnd","where","queryParams","and","push","ListDrawerContent","collectionSlugs","customHeader","drawerSlug","filterOptions","onSelect","selectedCollection","useModal","i18n","t","permissions","setPreference","closeModal","isModalOpen","limit","setLimit","sort","setSort","page","setPage","setWhere","search","setSearch","componentMap","collections","routes","api","serverURL","enabledCollectionConfigs","filter","slug","includes","selectedCollectionConfig","setSelectedCollectionConfig","find","List","selectedOption","setSelectedOption","label","labels","singular","value","undefined","selectedConfig","preferenceKey","DocumentDrawer","DocumentDrawerToggler","documentDrawerSlug","collectionSlug","collectionPermissions","hasCreatePermission","create","permission","isOpen","apiURL","cacheBust","dispatchCacheBust","state","data","isError","isLoading","isLoadingList","setParams","moreThanOneAvailableCollection","length","admin","listSearchableFields","useAsTitle","versions","params","copyOfWhere","filterOption","searchAsConditions","map","fieldName","like","searchFilter","or","drafts","draft","newPreferences","onCreateNew","doc","docID","id","Header","header","className","div","h2","plural","button","aria-label","onClick","type","description","onChange","options","coll","collectionConfig","newDocumentURL","defaultLimit","pagination","defaultSort","handlePageChange","handlePerPageChange","handleSearchChange","handleSortChange","handleWhereChange","modifySearchParams","cellProps","link","rowColl","rowData","onSave"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
+{"version":3,"sources":["../../../src/elements/ListDrawer/DrawerContent.tsx"],"sourcesContent":["'use client'\nimport type { ClientCollectionConfig, Where } from 'payload'\n\nimport { useModal } from '@faceless-ui/modal'\nimport { getTranslation } from '@payloadcms/translations'\nimport React, { useCallback, useEffect, useReducer, useState } from 'react'\n\nimport type { ListDrawerProps } from './types.js'\n\nimport { FieldLabel } from '../../fields/FieldLabel/index.js'\nimport { usePayloadAPI } from '../../hooks/usePayloadAPI.js'\nimport { XIcon } from '../../icons/X/index.js'\nimport { useAuth } from '../../providers/Auth/index.js'\nimport { RenderComponent } from '../../providers/Config/RenderComponent.js'\nimport { useConfig } from '../../providers/Config/index.js'\nimport { ListInfoProvider } from '../../providers/ListInfo/index.js'\nimport { ListQueryProvider } from '../../providers/ListQuery/index.js'\nimport { usePreferences } from '../../providers/Preferences/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { useDocumentDrawer } from '../DocumentDrawer/index.js'\nimport { LoadingOverlay } from '../Loading/index.js'\nimport { Pill } from '../Pill/index.js'\nimport { type Option, ReactSelect } from '../ReactSelect/index.js'\nimport { TableColumnsProvider } from '../TableColumns/index.js'\nimport { ViewDescription } from '../ViewDescription/index.js'\nimport { baseClass } from './index.js'\n\nconst hoistQueryParamsToAnd = (where: Where, queryParams: Where) => {\n  if ('and' in where) {\n    where.and.push(queryParams)\n  } else if ('or' in where) {\n    where = {\n      and: [where, queryParams],\n    }\n  } else {\n    where = {\n      and: [where, queryParams],\n    }\n  }\n\n  return where\n}\n\nexport const ListDrawerContent: React.FC<ListDrawerProps> = ({\n  collectionSlugs,\n  customHeader,\n  drawerSlug,\n  filterOptions,\n  onSelect,\n  selectedCollection,\n}) => {\n  const { i18n, t } = useTranslation()\n  const { permissions } = useAuth()\n  const { setPreference } = usePreferences()\n  const { closeModal, isModalOpen } = useModal()\n  const [limit, setLimit] = useState<number>()\n  const [sort, setSort] = useState<string>(null)\n  const [page, setPage] = useState<number>(1)\n  const [where, setWhere] = useState<Where>(null)\n  const [search, setSearch] = useState<string>('')\n\n  const {\n    config: {\n      collections,\n      routes: { api },\n      serverURL,\n    },\n  } = useConfig()\n\n  const enabledCollectionConfigs = collections.filter(({ slug }) => {\n    return collectionSlugs.includes(slug)\n  })\n\n  const [selectedCollectionConfig, setSelectedCollectionConfig] = useState<ClientCollectionConfig>(\n    () => {\n      return (\n        enabledCollectionConfigs.find(({ slug }) => slug === selectedCollection) ||\n        enabledCollectionConfigs?.[0]\n      )\n    },\n  )\n\n  const List = selectedCollectionConfig?.admin?.components.views.list.Component\n\n  const [selectedOption, setSelectedOption] = useState<Option | Option[]>(() =>\n    selectedCollectionConfig\n      ? {\n          label: getTranslation(selectedCollectionConfig.labels.singular, i18n),\n          value: selectedCollectionConfig.slug,\n        }\n      : undefined,\n  )\n\n  // const [fields, setFields] = useState<Field[]>(() => formatFields(selectedCollectionConfig))\n\n  useEffect(() => {\n    // setFields(formatFields(selectedCollectionConfig))\n  }, [selectedCollectionConfig])\n\n  // allow external control of selected collection, same as the initial state logic above\n  useEffect(() => {\n    if (selectedCollection) {\n      // if passed a selection, find it and check if it's enabled\n      const selectedConfig =\n        enabledCollectionConfigs.find(({ slug }) => slug === selectedCollection) ||\n        enabledCollectionConfigs?.[0]\n      setSelectedCollectionConfig(selectedConfig)\n    }\n  }, [selectedCollection, enabledCollectionConfigs, onSelect, t])\n\n  const preferenceKey = `${selectedCollectionConfig.slug}-list`\n\n  // this is the 'create new' drawer\n  const [DocumentDrawer, DocumentDrawerToggler, { drawerSlug: documentDrawerSlug }] =\n    useDocumentDrawer({\n      collectionSlug: selectedCollectionConfig.slug,\n    })\n\n  useEffect(() => {\n    if (selectedOption && !Array.isArray(selectedOption)) {\n      setSelectedCollectionConfig(\n        enabledCollectionConfigs.find(({ slug }) => selectedOption.value === slug),\n      )\n    }\n  }, [selectedOption, enabledCollectionConfigs])\n\n  const collectionPermissions = permissions?.collections?.[selectedCollectionConfig?.slug]\n  const hasCreatePermission = collectionPermissions?.create?.permission\n\n  // If modal is open, get active page of upload gallery\n  const isOpen = isModalOpen(drawerSlug)\n  const apiURL = isOpen ? `${serverURL}${api}/${selectedCollectionConfig.slug}` : null\n  const [cacheBust, dispatchCacheBust] = useReducer((state) => state + 1, 0) // used to force a re-fetch even when apiURL is unchanged\n  const [{ data, isError, isLoading: isLoadingList }, { setParams }] = usePayloadAPI(apiURL, {\n    initialParams: {\n      depth: 0,\n    },\n  })\n  const moreThanOneAvailableCollection = enabledCollectionConfigs.length > 1\n\n  useEffect(() => {\n    const {\n      slug,\n      admin: { listSearchableFields, useAsTitle } = {},\n      versions,\n    } = selectedCollectionConfig\n    const params: {\n      cacheBust?: number\n      depth?: number\n      draft?: string\n      limit?: number\n      page?: number\n      search?: string\n      sort?: string\n      where?: unknown\n    } = {\n      depth: 0,\n    }\n\n    let copyOfWhere = { ...(where || {}) }\n    const filterOption = filterOptions?.[slug]\n\n    if (filterOptions && typeof filterOption !== 'boolean') {\n      copyOfWhere = hoistQueryParamsToAnd(copyOfWhere, filterOption)\n    }\n\n    if (search) {\n      const searchAsConditions = (listSearchableFields || [useAsTitle]).map((fieldName) => {\n        return {\n          [fieldName]: {\n            like: search,\n          },\n        }\n      }, [])\n\n      if (searchAsConditions.length > 0) {\n        const searchFilter: Where = {\n          or: [...searchAsConditions],\n        }\n\n        copyOfWhere = hoistQueryParamsToAnd(copyOfWhere, searchFilter)\n      }\n    }\n\n    if (page) params.page = page\n    if (sort) params.sort = sort\n    if (cacheBust) params.cacheBust = cacheBust\n    if (copyOfWhere) params.where = copyOfWhere\n    if (versions?.drafts) params.draft = 'true'\n\n    setParams(params)\n  }, [page, sort, where, search, cacheBust, filterOptions, selectedCollectionConfig, t, setParams])\n\n  useEffect(() => {\n    const newPreferences = {\n      limit,\n      sort,\n    }\n\n    void setPreference(preferenceKey, newPreferences, true)\n  }, [sort, limit, setPreference, preferenceKey])\n\n  const onCreateNew = useCallback(\n    ({ doc }) => {\n      if (typeof onSelect === 'function') {\n        onSelect({\n          collectionSlug: selectedCollectionConfig.slug,\n          docID: doc.id,\n        })\n      }\n      dispatchCacheBust()\n      closeModal(documentDrawerSlug)\n      closeModal(drawerSlug)\n    },\n    [closeModal, documentDrawerSlug, drawerSlug, onSelect, selectedCollectionConfig],\n  )\n\n  if (!selectedCollectionConfig || isError) {\n    return null\n  }\n\n  if (isLoadingList) {\n    return <LoadingOverlay />\n  }\n\n  return (\n    <ListInfoProvider\n      Header={\n        <header className={`${baseClass}__header`}>\n          <div className={`${baseClass}__header-wrap`}>\n            <div className={`${baseClass}__header-content`}>\n              <h2 className={`${baseClass}__header-text`}>\n                {!customHeader\n                  ? getTranslation(selectedCollectionConfig?.labels?.plural, i18n)\n                  : customHeader}\n              </h2>\n              {hasCreatePermission && (\n                <DocumentDrawerToggler className={`${baseClass}__create-new-button`}>\n                  <Pill>{t('general:createNew')}</Pill>\n                </DocumentDrawerToggler>\n              )}\n            </div>\n            <button\n              aria-label={t('general:close')}\n              className={`${baseClass}__header-close`}\n              onClick={() => {\n                closeModal(drawerSlug)\n              }}\n              type=\"button\"\n            >\n              <XIcon />\n            </button>\n          </div>\n          {selectedCollectionConfig?.admin?.description && (\n            <div className={`${baseClass}__sub-header`}>\n              <ViewDescription description={selectedCollectionConfig.admin.description} />\n            </div>\n          )}\n          {moreThanOneAvailableCollection && (\n            <div className={`${baseClass}__select-collection-wrap`}>\n              <FieldLabel field={null} label={t('upload:selectCollectionToBrowse')} />\n              <ReactSelect\n                className={`${baseClass}__select-collection`}\n                onChange={setSelectedOption} // this is only changing the options which is not rerunning my effect\n                options={enabledCollectionConfigs.map((coll) => ({\n                  label: getTranslation(coll.labels.singular, i18n),\n                  value: coll.slug,\n                }))}\n                value={selectedOption}\n              />\n            </div>\n          )}\n        </header>\n      }\n      collectionConfig={selectedCollectionConfig}\n      collectionSlug={selectedCollectionConfig.slug}\n      hasCreatePermission={hasCreatePermission}\n      newDocumentURL={null}\n    >\n      <ListQueryProvider\n        data={data}\n        defaultLimit={limit || selectedCollectionConfig?.admin?.pagination?.defaultLimit}\n        defaultSort={sort}\n        handlePageChange={setPage}\n        handlePerPageChange={setLimit}\n        handleSearchChange={setSearch}\n        handleSortChange={setSort}\n        handleWhereChange={setWhere}\n        modifySearchParams={false}\n        preferenceKey={preferenceKey}\n      >\n        <TableColumnsProvider\n          cellProps={[\n            {\n              className: `${baseClass}__first-cell`,\n              link: false,\n              onClick: ({ collectionSlug: rowColl, rowData }) => {\n                if (typeof onSelect === 'function') {\n                  onSelect({\n                    collectionSlug: rowColl,\n                    docID: rowData.id as string,\n                  })\n                }\n              },\n            },\n          ]}\n          collectionSlug={selectedCollectionConfig.slug}\n          preferenceKey={preferenceKey}\n        >\n          <RenderComponent mappedComponent={List} />\n          <DocumentDrawer onSave={onCreateNew} />\n        </TableColumnsProvider>\n      </ListQueryProvider>\n    </ListInfoProvider>\n  )\n}\n"],"names":["useModal","getTranslation","React","useCallback","useEffect","useReducer","useState","FieldLabel","usePayloadAPI","XIcon","useAuth","RenderComponent","useConfig","ListInfoProvider","ListQueryProvider","usePreferences","useTranslation","useDocumentDrawer","LoadingOverlay","Pill","ReactSelect","TableColumnsProvider","ViewDescription","baseClass","hoistQueryParamsToAnd","where","queryParams","and","push","ListDrawerContent","collectionSlugs","customHeader","drawerSlug","filterOptions","onSelect","selectedCollection","i18n","t","permissions","setPreference","closeModal","isModalOpen","limit","setLimit","sort","setSort","page","setPage","setWhere","search","setSearch","config","collections","routes","api","serverURL","enabledCollectionConfigs","filter","slug","includes","selectedCollectionConfig","setSelectedCollectionConfig","find","List","admin","components","views","list","Component","selectedOption","setSelectedOption","label","labels","singular","value","undefined","selectedConfig","preferenceKey","DocumentDrawer","DocumentDrawerToggler","documentDrawerSlug","collectionSlug","Array","isArray","collectionPermissions","hasCreatePermission","create","permission","isOpen","apiURL","cacheBust","dispatchCacheBust","state","data","isError","isLoading","isLoadingList","setParams","initialParams","depth","moreThanOneAvailableCollection","length","listSearchableFields","useAsTitle","versions","params","copyOfWhere","filterOption","searchAsConditions","map","fieldName","like","searchFilter","or","drafts","draft","newPreferences","onCreateNew","doc","docID","id","Header","header","className","div","h2","plural","button","aria-label","onClick","type","description","field","onChange","options","coll","collectionConfig","newDocumentURL","defaultLimit","pagination","defaultSort","handlePageChange","handlePerPageChange","handleSearchChange","handleSortChange","handleWhereChange","modifySearchParams","cellProps","link","rowColl","rowData","mappedComponent","onSave"],"mappings":"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"}

package/dist/elements/ListDrawer/index.js

@@ -1,36 +1,42 @@
 'use client';
-import * as facelessUIImport from '@faceless-ui/modal';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { createElement as _createElement } from "react";
+import { useModal } from '@faceless-ui/modal';
 import React, { useCallback, useEffect, useId, useMemo, useState } from 'react';
 export * from './types.js';
 import { useConfig } from '../../providers/Config/index.js';
 import { useEditDepth } from '../../providers/EditDepth/index.js';
 import { Drawer, DrawerToggler } from '../Drawer/index.js';
 import { ListDrawerContent } from './DrawerContent.js';
+import './index.scss';
 export const baseClass = 'list-drawer';
 export const formatListDrawerSlug = ({ depth, uuid })=>`list-drawer_${depth}_${uuid}`;
 export const ListDrawerToggler = ({ children, className, disabled, drawerSlug, ...rest })=>{
-    return /*#__PURE__*/ React.createElement(DrawerToggler, {
+    return /*#__PURE__*/ _jsx(DrawerToggler, {
         className: [
             className,
             `${baseClass}__toggler`
         ].filter(Boolean).join(' '),
         disabled: disabled,
         slug: drawerSlug,
-        ...rest
-    }, children);
+        ...rest,
+        children: children
+    });
 };
 export const ListDrawer = (props)=>{
     const { drawerSlug } = props;
-    return /*#__PURE__*/ React.createElement(Drawer, {
+    return /*#__PURE__*/ _jsx(Drawer, {
         Header: null,
         className: baseClass,
         gutter: false,
-        slug: drawerSlug
-    }, /*#__PURE__*/ React.createElement(ListDrawerContent, props));
+        slug: drawerSlug,
+        children: /*#__PURE__*/ _jsx(ListDrawerContent, {
+            ...props
+        })
+    });
 };
 export const useListDrawer = ({ collectionSlugs: collectionSlugsFromProps, filterOptions, selectedCollection, uploads })=>{
-    const { useModal } = facelessUIImport;
-    const { collections } = useConfig();
+    const { config: { collections } } = useConfig();
     const drawerDepth = useEditDepth();
     const uuid = useId();
     const { closeModal, modalState, openModal, toggleModal } = useModal();
@@ -80,7 +86,7 @@ export const useListDrawer = ({ collectionSlugs: collectionSlugsFromProps, filte
         openModal
     ]);
     const MemoizedDrawer = useMemo(()=>{
-        return (props)=>/*#__PURE__*/ React.createElement(ListDrawer, {
+        return (props)=>/*#__PURE__*/ _createElement(ListDrawer, {
                 ...props,
                 closeDrawer: closeDrawer,
                 collectionSlugs: collectionSlugs,
@@ -99,7 +105,7 @@ export const useListDrawer = ({ collectionSlugs: collectionSlugsFromProps, filte
         filterOptions
     ]);
     const MemoizedDrawerToggler = useMemo(()=>{
-        return (props)=>/*#__PURE__*/ React.createElement(ListDrawerToggler, {
+        return (props)=>/*#__PURE__*/ _jsx(ListDrawerToggler, {
                 ...props,
                 drawerSlug: drawerSlug
             });

package/dist/elements/ListDrawer/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/ListDrawer/index.tsx"],"sourcesContent":["'use client'\nimport * as facelessUIImport from '@faceless-ui/modal'\nimport React, { useCallback, useEffect, useId, useMemo, useState } from 'react'\n\nimport type { ListDrawerProps, ListTogglerProps, UseListDrawer } from './types.js'\n\nexport * from './types.js'\n\nimport { useConfig } from '../../providers/Config/index.js'\nimport { useEditDepth } from '../../providers/EditDepth/index.js'\nimport { Drawer, DrawerToggler } from '../Drawer/index.js'\nimport { ListDrawerContent } from './DrawerContent.js'\nimport './index.scss'\n\nexport const baseClass = 'list-drawer'\n\nexport const formatListDrawerSlug = ({\n  depth,\n  uuid,\n}: {\n  depth: number\n  uuid: string // supply when creating a new document and no id is available\n}) => `list-drawer_${depth}_${uuid}`\n\nexport const ListDrawerToggler: React.FC<ListTogglerProps> = ({\n  children,\n  className,\n  disabled,\n  drawerSlug,\n  ...rest\n}) => {\n  return (\n    <DrawerToggler\n      className={[className, `${baseClass}__toggler`].filter(Boolean).join(' ')}\n      disabled={disabled}\n      slug={drawerSlug}\n      {...rest}\n    >\n      {children}\n    </DrawerToggler>\n  )\n}\n\nexport const ListDrawer: React.FC<ListDrawerProps> = (props) => {\n  const { drawerSlug } = props\n\n  return (\n    <Drawer Header={null} className={baseClass} gutter={false} slug={drawerSlug}>\n      <ListDrawerContent {...props} />\n    </Drawer>\n  )\n}\n\nexport const useListDrawer: UseListDrawer = ({\n  collectionSlugs: collectionSlugsFromProps,\n  filterOptions,\n  selectedCollection,\n  uploads,\n}) => {\n  const { useModal } = facelessUIImport\n\n  const { collections } = useConfig()\n  const drawerDepth = useEditDepth()\n  const uuid = useId()\n  const { closeModal, modalState, openModal, toggleModal } = useModal()\n  const [isOpen, setIsOpen] = useState(false)\n  const [collectionSlugs, setCollectionSlugs] = useState(collectionSlugsFromProps)\n\n  const drawerSlug = formatListDrawerSlug({\n    depth: drawerDepth,\n    uuid,\n  })\n\n  useEffect(() => {\n    setIsOpen(Boolean(modalState[drawerSlug]?.isOpen))\n  }, [modalState, drawerSlug])\n\n  useEffect(() => {\n    if (!collectionSlugs || collectionSlugs.length === 0) {\n      const filteredCollectionSlugs = collections.filter(({ upload }) => {\n        if (uploads) {\n          return Boolean(upload) === true\n        }\n        return true\n      })\n\n      setCollectionSlugs(filteredCollectionSlugs.map(({ slug }) => slug))\n    }\n  }, [collectionSlugs, uploads, collections])\n  const toggleDrawer = useCallback(() => {\n    toggleModal(drawerSlug)\n  }, [toggleModal, drawerSlug])\n\n  const closeDrawer = useCallback(() => {\n    closeModal(drawerSlug)\n  }, [drawerSlug, closeModal])\n\n  const openDrawer = useCallback(() => {\n    openModal(drawerSlug)\n  }, [drawerSlug, openModal])\n\n  const MemoizedDrawer = useMemo(() => {\n    return (props) => (\n      <ListDrawer\n        {...props}\n        closeDrawer={closeDrawer}\n        collectionSlugs={collectionSlugs}\n        drawerSlug={drawerSlug}\n        filterOptions={filterOptions}\n        key={drawerSlug}\n        selectedCollection={selectedCollection}\n        uploads={uploads}\n      />\n    )\n  }, [drawerSlug, collectionSlugs, uploads, closeDrawer, selectedCollection, filterOptions])\n\n  const MemoizedDrawerToggler = useMemo(() => {\n    return (props) => <ListDrawerToggler {...props} drawerSlug={drawerSlug} />\n  }, [drawerSlug])\n\n  const MemoizedDrawerState = useMemo(\n    () => ({\n      closeDrawer,\n      drawerDepth,\n      drawerSlug,\n      isDrawerOpen: isOpen,\n      openDrawer,\n      toggleDrawer,\n    }),\n    [drawerDepth, drawerSlug, isOpen, toggleDrawer, closeDrawer, openDrawer],\n  )\n\n  return [MemoizedDrawer, MemoizedDrawerToggler, MemoizedDrawerState]\n}\n"],"names":["facelessUIImport","React","useCallback","useEffect","useId","useMemo","useState","useConfig","useEditDepth","Drawer","DrawerToggler","ListDrawerContent","baseClass","formatListDrawerSlug","depth","uuid","ListDrawerToggler","children","className","disabled","drawerSlug","rest","filter","Boolean","join","slug","ListDrawer","props","Header","gutter","useListDrawer","collectionSlugs","collectionSlugsFromProps","filterOptions","selectedCollection","uploads","useModal","collections","drawerDepth","closeModal","modalState","openModal","toggleModal","isOpen","setIsOpen","setCollectionSlugs","length","filteredCollectionSlugs","upload","map","toggleDrawer","closeDrawer","openDrawer","MemoizedDrawer","key","MemoizedDrawerToggler","MemoizedDrawerState","isDrawerOpen"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA;AACA,YAAYA,sBAAsB,qBAAoB;AACtD,OAAOC,SAASC,WAAW,EAAEC,SAAS,EAAEC,KAAK,EAAEC,OAAO,EAAEC,QAAQ,QAAQ,QAAO;AAI/E,cAAc,aAAY;AAE1B,SAASC,SAAS,QAAQ,kCAAiC;AAC3D,SAASC,YAAY,QAAQ,qCAAoC;AACjE,SAASC,MAAM,EAAEC,aAAa,QAAQ,qBAAoB;AAC1D,SAASC,iBAAiB,QAAQ,qBAAoB;AAGtD,OAAO,MAAMC,YAAY,cAAa;AAEtC,OAAO,MAAMC,uBAAuB,CAAC,EACnCC,KAAK,EACLC,IAAI,EAIL,GAAK,CAAC,YAAY,EAAED,MAAM,CAAC,EAAEC,KAAK,CAAC,CAAA;AAEpC,OAAO,MAAMC,oBAAgD,CAAC,EAC5DC,QAAQ,EACRC,SAAS,EACTC,QAAQ,EACRC,UAAU,EACV,GAAGC,MACJ;IACC,qBACE,oBAACX;QACCQ,WAAW;YAACA;YAAW,CAAC,EAAEN,UAAU,SAAS,CAAC;SAAC,CAACU,MAAM,CAACC,SAASC,IAAI,CAAC;QACrEL,UAAUA;QACVM,MAAML;QACL,GAAGC,IAAI;OAEPJ;AAGP,EAAC;AAED,OAAO,MAAMS,aAAwC,CAACC;IACpD,MAAM,EAAEP,UAAU,EAAE,GAAGO;IAEvB,qBACE,oBAAClB;QAAOmB,QAAQ;QAAMV,WAAWN;QAAWiB,QAAQ;QAAOJ,MAAML;qBAC/D,oBAACT,mBAAsBgB;AAG7B,EAAC;AAED,OAAO,MAAMG,gBAA+B,CAAC,EAC3CC,iBAAiBC,wBAAwB,EACzCC,aAAa,EACbC,kBAAkB,EAClBC,OAAO,EACR;IACC,MAAM,EAAEC,QAAQ,EAAE,GAAGpC;IAErB,MAAM,EAAEqC,WAAW,EAAE,GAAG9B;IACxB,MAAM+B,cAAc9B;IACpB,MAAMO,OAAOX;IACb,MAAM,EAAEmC,UAAU,EAAEC,UAAU,EAAEC,SAAS,EAAEC,WAAW,EAAE,GAAGN;IAC3D,MAAM,CAACO,QAAQC,UAAU,GAAGtC,SAAS;IACrC,MAAM,CAACyB,iBAAiBc,mBAAmB,GAAGvC,SAAS0B;IAEvD,MAAMZ,aAAaP,qBAAqB;QACtCC,OAAOwB;QACPvB;IACF;IAEAZ,UAAU;QACRyC,UAAUrB,QAAQiB,UAAU,CAACpB,WAAW,EAAEuB;IAC5C,GAAG;QAACH;QAAYpB;KAAW;IAE3BjB,UAAU;QACR,IAAI,CAAC4B,mBAAmBA,gBAAgBe,MAAM,KAAK,GAAG;YACpD,MAAMC,0BAA0BV,YAAYf,MAAM,CAAC,CAAC,EAAE0B,MAAM,EAAE;gBAC5D,IAAIb,SAAS;oBACX,OAAOZ,QAAQyB,YAAY;gBAC7B;gBACA,OAAO;YACT;YAEAH,mBAAmBE,wBAAwBE,GAAG,CAAC,CAAC,EAAExB,IAAI,EAAE,GAAKA;QAC/D;IACF,GAAG;QAACM;QAAiBI;QAASE;KAAY;IAC1C,MAAMa,eAAehD,YAAY;QAC/BwC,YAAYtB;IACd,GAAG;QAACsB;QAAatB;KAAW;IAE5B,MAAM+B,cAAcjD,YAAY;QAC9BqC,WAAWnB;IACb,GAAG;QAACA;QAAYmB;KAAW;IAE3B,MAAMa,aAAalD,YAAY;QAC7BuC,UAAUrB;IACZ,GAAG;QAACA;QAAYqB;KAAU;IAE1B,MAAMY,iBAAiBhD,QAAQ;QAC7B,OAAO,CAACsB,sBACN,oBAACD;gBACE,GAAGC,KAAK;gBACTwB,aAAaA;gBACbpB,iBAAiBA;gBACjBX,YAAYA;gBACZa,eAAeA;gBACfqB,KAAKlC;gBACLc,oBAAoBA;gBACpBC,SAASA;;IAGf,GAAG;QAACf;QAAYW;QAAiBI;QAASgB;QAAajB;QAAoBD;KAAc;IAEzF,MAAMsB,wBAAwBlD,QAAQ;QACpC,OAAO,CAACsB,sBAAU,oBAACX;gBAAmB,GAAGW,KAAK;gBAAEP,YAAYA;;IAC9D,GAAG;QAACA;KAAW;IAEf,MAAMoC,sBAAsBnD,QAC1B,IAAO,CAAA;YACL8C;YACAb;YACAlB;YACAqC,cAAcd;YACdS;YACAF;QACF,CAAA,GACA;QAACZ;QAAalB;QAAYuB;QAAQO;QAAcC;QAAaC;KAAW;IAG1E,OAAO;QAACC;QAAgBE;QAAuBC;KAAoB;AACrE,EAAC"}
+{"version":3,"sources":["../../../src/elements/ListDrawer/index.tsx"],"sourcesContent":["'use client'\nimport { useModal } from '@faceless-ui/modal'\nimport React, { useCallback, useEffect, useId, useMemo, useState } from 'react'\n\nimport type { ListDrawerProps, ListTogglerProps, UseListDrawer } from './types.js'\n\nexport * from './types.js'\n\nimport { useConfig } from '../../providers/Config/index.js'\nimport { useEditDepth } from '../../providers/EditDepth/index.js'\nimport { Drawer, DrawerToggler } from '../Drawer/index.js'\nimport { ListDrawerContent } from './DrawerContent.js'\nimport './index.scss'\n\nexport const baseClass = 'list-drawer'\n\nexport const formatListDrawerSlug = ({\n  depth,\n  uuid,\n}: {\n  depth: number\n  uuid: string // supply when creating a new document and no id is available\n}) => `list-drawer_${depth}_${uuid}`\n\nexport const ListDrawerToggler: React.FC<ListTogglerProps> = ({\n  children,\n  className,\n  disabled,\n  drawerSlug,\n  ...rest\n}) => {\n  return (\n    <DrawerToggler\n      className={[className, `${baseClass}__toggler`].filter(Boolean).join(' ')}\n      disabled={disabled}\n      slug={drawerSlug}\n      {...rest}\n    >\n      {children}\n    </DrawerToggler>\n  )\n}\n\nexport const ListDrawer: React.FC<ListDrawerProps> = (props) => {\n  const { drawerSlug } = props\n\n  return (\n    <Drawer Header={null} className={baseClass} gutter={false} slug={drawerSlug}>\n      <ListDrawerContent {...props} />\n    </Drawer>\n  )\n}\n\nexport const useListDrawer: UseListDrawer = ({\n  collectionSlugs: collectionSlugsFromProps,\n  filterOptions,\n  selectedCollection,\n  uploads,\n}) => {\n  const {\n    config: { collections },\n  } = useConfig()\n  const drawerDepth = useEditDepth()\n  const uuid = useId()\n  const { closeModal, modalState, openModal, toggleModal } = useModal()\n  const [isOpen, setIsOpen] = useState(false)\n  const [collectionSlugs, setCollectionSlugs] = useState(collectionSlugsFromProps)\n\n  const drawerSlug = formatListDrawerSlug({\n    depth: drawerDepth,\n    uuid,\n  })\n\n  useEffect(() => {\n    setIsOpen(Boolean(modalState[drawerSlug]?.isOpen))\n  }, [modalState, drawerSlug])\n\n  useEffect(() => {\n    if (!collectionSlugs || collectionSlugs.length === 0) {\n      const filteredCollectionSlugs = collections.filter(({ upload }) => {\n        if (uploads) {\n          return Boolean(upload) === true\n        }\n        return true\n      })\n\n      setCollectionSlugs(filteredCollectionSlugs.map(({ slug }) => slug))\n    }\n  }, [collectionSlugs, uploads, collections])\n  const toggleDrawer = useCallback(() => {\n    toggleModal(drawerSlug)\n  }, [toggleModal, drawerSlug])\n\n  const closeDrawer = useCallback(() => {\n    closeModal(drawerSlug)\n  }, [drawerSlug, closeModal])\n\n  const openDrawer = useCallback(() => {\n    openModal(drawerSlug)\n  }, [drawerSlug, openModal])\n\n  const MemoizedDrawer = useMemo(() => {\n    return (props) => (\n      <ListDrawer\n        {...props}\n        closeDrawer={closeDrawer}\n        collectionSlugs={collectionSlugs}\n        drawerSlug={drawerSlug}\n        filterOptions={filterOptions}\n        key={drawerSlug}\n        selectedCollection={selectedCollection}\n        uploads={uploads}\n      />\n    )\n  }, [drawerSlug, collectionSlugs, uploads, closeDrawer, selectedCollection, filterOptions])\n\n  const MemoizedDrawerToggler = useMemo(() => {\n    return (props) => <ListDrawerToggler {...props} drawerSlug={drawerSlug} />\n  }, [drawerSlug])\n\n  const MemoizedDrawerState = useMemo(\n    () => ({\n      closeDrawer,\n      drawerDepth,\n      drawerSlug,\n      isDrawerOpen: isOpen,\n      openDrawer,\n      toggleDrawer,\n    }),\n    [drawerDepth, drawerSlug, isOpen, toggleDrawer, closeDrawer, openDrawer],\n  )\n\n  return [MemoizedDrawer, MemoizedDrawerToggler, MemoizedDrawerState]\n}\n"],"names":["useModal","React","useCallback","useEffect","useId","useMemo","useState","useConfig","useEditDepth","Drawer","DrawerToggler","ListDrawerContent","baseClass","formatListDrawerSlug","depth","uuid","ListDrawerToggler","children","className","disabled","drawerSlug","rest","filter","Boolean","join","slug","ListDrawer","props","Header","gutter","useListDrawer","collectionSlugs","collectionSlugsFromProps","filterOptions","selectedCollection","uploads","config","collections","drawerDepth","closeModal","modalState","openModal","toggleModal","isOpen","setIsOpen","setCollectionSlugs","length","filteredCollectionSlugs","upload","map","toggleDrawer","closeDrawer","openDrawer","MemoizedDrawer","key","MemoizedDrawerToggler","MemoizedDrawerState","isDrawerOpen"],"mappings":"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"}

package/dist/elements/ListDrawer/index.scss

@@ -65,11 +65,11 @@
     height: base(1);
 
     svg {
-      width: base(2.75);
-      height: base(2.75);
+      width: base(2);
+      height: base(2);
       position: relative;
-      left: base(-0.825);
-      top: base(-0.825);
+      inset-inline-start: base(-0.5);
+      top: base(-0.5);
 
       .stroke {
         stroke-width: 2px;

package/dist/elements/ListDrawer/types.d.ts

@@ -1,24 +1,23 @@
-/// <reference types="react/experimental" resolution-mode="require"/>
-import type { FilterOptionsResult, SanitizedCollectionConfig } from 'payload/types';
+import type { FilterOptionsResult, SanitizedCollectionConfig } from 'payload';
 import type React from 'react';
 import type { HTMLAttributes } from 'react';
 export type ListDrawerProps = {
-    collectionSlugs: string[];
-    customHeader?: React.ReactNode;
-    drawerSlug?: string;
-    filterOptions?: FilterOptionsResult;
-    onSelect?: (args: {
+    readonly collectionSlugs: string[];
+    readonly customHeader?: React.ReactNode;
+    readonly drawerSlug?: string;
+    readonly filterOptions?: FilterOptionsResult;
+    readonly onSelect?: (args: {
         collectionSlug: SanitizedCollectionConfig['slug'];
         docID: string;
     }) => void;
-    selectedCollection?: string;
+    readonly selectedCollection?: string;
 };
-export type ListTogglerProps = HTMLAttributes<HTMLButtonElement> & {
+export type ListTogglerProps = {
     children?: React.ReactNode;
     className?: string;
     disabled?: boolean;
     drawerSlug?: string;
-};
+} & HTMLAttributes<HTMLButtonElement>;
 export type UseListDrawer = (args: {
     collectionSlugs?: string[];
     filterOptions?: FilterOptionsResult;

package/dist/elements/ListDrawer/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/elements/ListDrawer/types.ts"],"names":[],"mappings":";AAAA,OAAO,KAAK,EAAE,mBAAmB,EAAE,yBAAyB,EAAE,MAAM,eAAe,CAAA;AACnF,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AAE3C,MAAM,MAAM,eAAe,GAAG;IAC5B,eAAe,EAAE,MAAM,EAAE,CAAA;IACzB,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC9B,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,aAAa,CAAC,EAAE,mBAAmB,CAAA;IACnC,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE;QAAE,cAAc,EAAE,yBAAyB,CAAC,MAAM,CAAC,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAA;IAC/F,kBAAkB,CAAC,EAAE,MAAM,CAAA;CAC5B,CAAA;AAED,MAAM,MAAM,gBAAgB,GAAG,cAAc,CAAC,iBAAiB,CAAC,GAAG;IACjE,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,UAAU,CAAC,EAAE,MAAM,CAAA;CACpB,CAAA;AAED,MAAM,MAAM,aAAa,GAAG,CAAC,IAAI,EAAE;IACjC,eAAe,CAAC,EAAE,MAAM,EAAE,CAAA;IAC1B,aAAa,CAAC,EAAE,mBAAmB,CAAA;IACnC,kBAAkB,CAAC,EAAE,MAAM,CAAA;IAC3B,OAAO,CAAC,EAAE,OAAO,CAAA;CAClB,KAAK;IACJ,KAAK,CAAC,EAAE,CAAC,IAAI,CAAC,eAAe,EAAE,UAAU,CAAC,CAAC;IAC3C,KAAK,CAAC,EAAE,CAAC,IAAI,CAAC,gBAAgB,EAAE,UAAU,GAAG,WAAW,GAAG,UAAU,CAAC,CAAC;IACvE;QACE,WAAW,EAAE,MAAM,IAAI,CAAA;QACvB,WAAW,EAAE,MAAM,CAAA;QACnB,UAAU,EAAE,MAAM,CAAA;QAClB,YAAY,EAAE,OAAO,CAAA;QACrB,UAAU,EAAE,MAAM,IAAI,CAAA;QACtB,YAAY,EAAE,MAAM,IAAI,CAAA;KACzB;CACF,CAAA"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/elements/ListDrawer/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,mBAAmB,EAAE,yBAAyB,EAAE,MAAM,SAAS,CAAA;AAC7E,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AAE3C,MAAM,MAAM,eAAe,GAAG;IAC5B,QAAQ,CAAC,eAAe,EAAE,MAAM,EAAE,CAAA;IAClC,QAAQ,CAAC,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACvC,QAAQ,CAAC,UAAU,CAAC,EAAE,MAAM,CAAA;IAC5B,QAAQ,CAAC,aAAa,CAAC,EAAE,mBAAmB,CAAA;IAC5C,QAAQ,CAAC,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE;QACzB,cAAc,EAAE,yBAAyB,CAAC,MAAM,CAAC,CAAA;QACjD,KAAK,EAAE,MAAM,CAAA;KACd,KAAK,IAAI,CAAA;IACV,QAAQ,CAAC,kBAAkB,CAAC,EAAE,MAAM,CAAA;CACrC,CAAA;AAED,MAAM,MAAM,gBAAgB,GAAG;IAC7B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,UAAU,CAAC,EAAE,MAAM,CAAA;CACpB,GAAG,cAAc,CAAC,iBAAiB,CAAC,CAAA;AAErC,MAAM,MAAM,aAAa,GAAG,CAAC,IAAI,EAAE;IACjC,eAAe,CAAC,EAAE,MAAM,EAAE,CAAA;IAC1B,aAAa,CAAC,EAAE,mBAAmB,CAAA;IACnC,kBAAkB,CAAC,EAAE,MAAM,CAAA;IAC3B,OAAO,CAAC,EAAE,OAAO,CAAA;CAClB,KAAK;IACJ,KAAK,CAAC,EAAE,CAAC,IAAI,CAAC,eAAe,EAAE,UAAU,CAAC,CAAC;IAC3C,KAAK,CAAC,EAAE,CAAC,IAAI,CAAC,gBAAgB,EAAE,UAAU,GAAG,WAAW,GAAG,UAAU,CAAC,CAAC;IACvE;QACE,WAAW,EAAE,MAAM,IAAI,CAAA;QACvB,WAAW,EAAE,MAAM,CAAA;QACnB,UAAU,EAAE,MAAM,CAAA;QAClB,YAAY,EAAE,OAAO,CAAA;QACrB,UAAU,EAAE,MAAM,IAAI,CAAA;QACtB,YAAY,EAAE,MAAM,IAAI,CAAA;KACzB;CACF,CAAA"}

package/dist/elements/ListDrawer/types.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/ListDrawer/types.ts"],"sourcesContent":["import type { FilterOptionsResult, SanitizedCollectionConfig } from 'payload/types'\nimport type React from 'react'\nimport type { HTMLAttributes } from 'react'\n\nexport type ListDrawerProps = {\n  collectionSlugs: string[]\n  customHeader?: React.ReactNode\n  drawerSlug?: string\n  filterOptions?: FilterOptionsResult\n  onSelect?: (args: { collectionSlug: SanitizedCollectionConfig['slug']; docID: string }) => void\n  selectedCollection?: string\n}\n\nexport type ListTogglerProps = HTMLAttributes<HTMLButtonElement> & {\n  children?: React.ReactNode\n  className?: string\n  disabled?: boolean\n  drawerSlug?: string\n}\n\nexport type UseListDrawer = (args: {\n  collectionSlugs?: string[]\n  filterOptions?: FilterOptionsResult\n  selectedCollection?: string\n  uploads?: boolean // finds all collections with upload: true\n}) => [\n  React.FC<Pick<ListDrawerProps, 'onSelect'>>, // drawer\n  React.FC<Pick<ListTogglerProps, 'children' | 'className' | 'disabled'>>, // toggler\n  {\n    closeDrawer: () => void\n    drawerDepth: number\n    drawerSlug: string\n    isDrawerOpen: boolean\n    openDrawer: () => void\n    toggleDrawer: () => void\n  },\n]\n"],"names":[],"rangeMappings":"","mappings":"AAoBA,WAgBC"}
+{"version":3,"sources":["../../../src/elements/ListDrawer/types.ts"],"sourcesContent":["import type { FilterOptionsResult, SanitizedCollectionConfig } from 'payload'\nimport type React from 'react'\nimport type { HTMLAttributes } from 'react'\n\nexport type ListDrawerProps = {\n  readonly collectionSlugs: string[]\n  readonly customHeader?: React.ReactNode\n  readonly drawerSlug?: string\n  readonly filterOptions?: FilterOptionsResult\n  readonly onSelect?: (args: {\n    collectionSlug: SanitizedCollectionConfig['slug']\n    docID: string\n  }) => void\n  readonly selectedCollection?: string\n}\n\nexport type ListTogglerProps = {\n  children?: React.ReactNode\n  className?: string\n  disabled?: boolean\n  drawerSlug?: string\n} & HTMLAttributes<HTMLButtonElement>\n\nexport type UseListDrawer = (args: {\n  collectionSlugs?: string[]\n  filterOptions?: FilterOptionsResult\n  selectedCollection?: string\n  uploads?: boolean // finds all collections with upload: true\n}) => [\n  React.FC<Pick<ListDrawerProps, 'onSelect'>>, // drawer\n  React.FC<Pick<ListTogglerProps, 'children' | 'className' | 'disabled'>>, // toggler\n  {\n    closeDrawer: () => void\n    drawerDepth: number\n    drawerSlug: string\n    isDrawerOpen: boolean\n    openDrawer: () => void\n    toggleDrawer: () => void\n  },\n]\n"],"names":[],"mappings":"AAuBA,WAgBC"}