payload 1.4.2 → 1.5.0

package/dist/admin/components/views/collections/List/Cell/field-types/Date/index.js

@@ -1,10 +1,15 @@
-import React from 'react';
-import format from 'date-fns/format';
-import { useConfig } from '../../../../../../utilities/Config';
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importDefault(require("react"));
+const format_1 = __importDefault(require("date-fns/format"));
+const Config_1 = require("../../../../../../utilities/Config");
 const DateCell = ({ data, field }) => {
     var _a, _b;
-    const { admin: { dateFormat: dateFormatFromConfig } } = useConfig();
+    const { admin: { dateFormat: dateFormatFromConfig } } = (0, Config_1.useConfig)();
     const dateFormat = ((_b = (_a = field === null || field === void 0 ? void 0 : field.admin) === null || _a === void 0 ? void 0 : _a.date) === null || _b === void 0 ? void 0 : _b.displayFormat) || dateFormatFromConfig;
-    return (React.createElement("span", null, data && format(new Date(data), dateFormat)));
+    return (react_1.default.createElement("span", null, data && (0, format_1.default)(new Date(data), dateFormat)));
 };
-export default DateCell;
+exports.default = DateCell;

package/dist/admin/components/views/collections/List/Cell/field-types/JSON/index.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+import './index.scss';
+declare const JSONCell: ({ data }: {
+    data: any;
+}) => JSX.Element;
+export default JSONCell;

package/dist/admin/components/views/collections/List/Cell/field-types/JSON/index.js

@@ -0,0 +1,13 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importDefault(require("react"));
+require("./index.scss");
+const JSONCell = ({ data }) => {
+    const textToShow = data.length > 100 ? `${data.substring(0, 100)}\u2026` : data;
+    return (react_1.default.createElement("code", { className: "json-cell" },
+        react_1.default.createElement("span", null, JSON.stringify(textToShow))));
+};
+exports.default = JSONCell;

package/dist/admin/components/views/collections/List/Cell/field-types/JSON/index.scss

@@ -0,0 +1,17 @@
+@import '../../../../../../../scss/styles.scss';
+
+.json-cell {
+  font-size: 1rem;
+  line-height: base(1);
+  border: 0;
+  display: inline-flex;
+  vertical-align: middle;
+  background: var(--theme-elevation-150);
+  color: var(--theme-elevation-800);
+  border-radius: $style-radius-s;
+  padding: 0 base(0.25);
+  padding-left: base(0.0875 + 0.25);
+
+  background: var(--theme-elevation-100);
+  color: var(--theme-elevation-800);
+}

package/dist/admin/components/views/collections/List/Cell/field-types/Relationship/index.js

@@ -1,23 +1,51 @@
-import React, { useState, useEffect } from 'react';
-import { useTranslation } from 'react-i18next';
-import { useConfig } from '../../../../../../utilities/Config';
-import useIntersect from '../../../../../../../hooks/useIntersect';
-import { useListRelationships } from '../../../RelationshipProvider';
-import { getTranslation } from '../../../../../../../../utilities/getTranslation';
-import './index.scss';
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importStar(require("react"));
+const react_i18next_1 = require("react-i18next");
+const Config_1 = require("../../../../../../utilities/Config");
+const useIntersect_1 = __importDefault(require("../../../../../../../hooks/useIntersect"));
+const RelationshipProvider_1 = require("../../../RelationshipProvider");
+const getTranslation_1 = require("../../../../../../../../utilities/getTranslation");
+require("./index.scss");
 const baseClass = 'relationship-cell';
 const totalToShow = 3;
 const RelationshipCell = (props) => {
     var _a;
     const { field, data: cellData } = props;
-    const { collections, routes } = useConfig();
-    const [intersectionRef, entry] = useIntersect();
-    const [values, setValues] = useState([]);
-    const { getRelationships, documents } = useListRelationships();
-    const [hasRequested, setHasRequested] = useState(false);
-    const { t, i18n } = useTranslation('general');
+    const { collections, routes } = (0, Config_1.useConfig)();
+    const [intersectionRef, entry] = (0, useIntersect_1.default)();
+    const [values, setValues] = (0, react_1.useState)([]);
+    const { getRelationships, documents } = (0, RelationshipProvider_1.useListRelationships)();
+    const [hasRequested, setHasRequested] = (0, react_1.useState)(false);
+    const { t, i18n } = (0, react_i18next_1.useTranslation)('general');
     const isAboveViewport = ((_a = entry === null || entry === void 0 ? void 0 : entry.boundingClientRect) === null || _a === void 0 ? void 0 : _a.top) < window.innerHeight;
-    useEffect(() => {
+    (0, react_1.useEffect)(() => {
         if (cellData && isAboveViewport && !hasRequested) {
             const formattedValues = [];
             const arrayCellData = Array.isArray(cellData) ? cellData : [cellData];
@@ -37,11 +65,11 @@ const RelationshipCell = (props) => {
             setValues(formattedValues);
         }
     }, [cellData, field, collections, isAboveViewport, routes.api, hasRequested, getRelationships]);
-    return (React.createElement("div", { className: baseClass, ref: intersectionRef },
+    return (react_1.default.createElement("div", { className: baseClass, ref: intersectionRef },
         values.map(({ relationTo, value }, i) => {
             const document = documents[relationTo][value];
             const relatedCollection = collections.find(({ slug }) => slug === relationTo);
-            return (React.createElement(React.Fragment, { key: i },
+            return (react_1.default.createElement(react_1.default.Fragment, { key: i },
                 document === false && `${t('untitled')} - ID: ${value}`,
                 document === null && t('loading'),
                 document && (document[relatedCollection.admin.useAsTitle] ? document[relatedCollection.admin.useAsTitle] : `${t('untitled')} - ID: ${value}`),
@@ -49,6 +77,6 @@ const RelationshipCell = (props) => {
         }),
         Array.isArray(cellData) && cellData.length > totalToShow
             && t('fields:itemsAndMore', { items: '', count: cellData.length - totalToShow }),
-        values.length === 0 && t('noLabel', { label: getTranslation(field.label, i18n) })));
+        values.length === 0 && t('noLabel', { label: (0, getTranslation_1.getTranslation)(field.label, i18n) })));
 };
-export default RelationshipCell;
+exports.default = RelationshipCell;

package/dist/admin/components/views/collections/List/Cell/field-types/Richtext/index.js

@@ -1,7 +1,12 @@
-import React from 'react';
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importDefault(require("react"));
 const RichTextCell = ({ data }) => {
     const flattenedText = data === null || data === void 0 ? void 0 : data.map((i) => { var _a; return (_a = i === null || i === void 0 ? void 0 : i.children) === null || _a === void 0 ? void 0 : _a.map((c) => c.text); }).join(' ');
     const textToShow = (flattenedText === null || flattenedText === void 0 ? void 0 : flattenedText.length) > 100 ? `${flattenedText.slice(0, 100)}\u2026` : flattenedText;
-    return (React.createElement("span", null, textToShow));
+    return (react_1.default.createElement("span", null, textToShow));
 };
-export default RichTextCell;
+exports.default = RichTextCell;

package/dist/admin/components/views/collections/List/Cell/field-types/Select/index.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import { SelectField } from '../../../../../../../../fields/config/types';
-declare type Props = {
+type Props = {
     data: any;
     field: SelectField;
 };

package/dist/admin/components/views/collections/List/Cell/field-types/Select/index.js

@@ -1,17 +1,22 @@
-import React from 'react';
-import { useTranslation } from 'react-i18next';
-import { optionsAreObjects } from '../../../../../../../../fields/config/types';
-import { getTranslation } from '../../../../../../../../utilities/getTranslation';
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importDefault(require("react"));
+const react_i18next_1 = require("react-i18next");
+const types_1 = require("../../../../../../../../fields/config/types");
+const getTranslation_1 = require("../../../../../../../../utilities/getTranslation");
 const SelectCell = ({ data, field }) => {
-    const { i18n } = useTranslation();
+    const { i18n } = (0, react_i18next_1.useTranslation)();
     const findLabel = (items) => items.map((i) => {
         var _a, _b;
         const found = (_b = (_a = field.options
             .filter((f) => f.value === i)) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.label;
-        return getTranslation(found, i18n);
+        return (0, getTranslation_1.getTranslation)(found, i18n);
     }).join(', ');
     let content = '';
-    if (optionsAreObjects(field.options)) {
+    if ((0, types_1.optionsAreObjects)(field.options)) {
         content = Array.isArray(data)
             ? findLabel(data) // hasMany
             : findLabel([data]);
@@ -21,6 +26,6 @@ const SelectCell = ({ data, field }) => {
             ? data.join(', ') // hasMany
             : data;
     }
-    return (React.createElement("span", null, content));
+    return (react_1.default.createElement("span", null, content));
 };
-export default SelectCell;
+exports.default = SelectCell;

package/dist/admin/components/views/collections/List/Cell/field-types/Textarea/index.js

@@ -1,6 +1,11 @@
-import React from 'react';
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importDefault(require("react"));
 const TextareaCell = ({ data }) => {
     const textToShow = (data === null || data === void 0 ? void 0 : data.length) > 100 ? `${data.substr(0, 100)}\u2026` : data;
-    return (React.createElement("span", null, textToShow));
+    return (react_1.default.createElement("span", null, textToShow));
 };
-export default TextareaCell;
+exports.default = TextareaCell;

package/dist/admin/components/views/collections/List/Cell/field-types/index.d.ts

@@ -18,6 +18,9 @@ declare const _default: {
         data: any;
         field: any;
     }) => JSX.Element;
+    json: ({ data }: {
+        data: any;
+    }) => JSX.Element;
     relationship: (props: any) => JSX.Element;
     richText: ({ data }: {
         data: any;

package/dist/admin/components/views/collections/List/Cell/field-types/index.js

@@ -1,22 +1,29 @@
-import array from './Array';
-import blocks from './Blocks';
-import checkbox from './Checkbox';
-import code from './Code';
-import date from './Date';
-import relationship from './Relationship';
-import richText from './Richtext';
-import select from './Select';
-import textarea from './Textarea';
-export default {
-    array,
-    blocks,
-    code,
-    checkbox,
-    date,
-    relationship,
-    richText,
-    select,
-    radio: select,
-    textarea,
-    upload: relationship,
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const Array_1 = __importDefault(require("./Array"));
+const Blocks_1 = __importDefault(require("./Blocks"));
+const Checkbox_1 = __importDefault(require("./Checkbox"));
+const Code_1 = __importDefault(require("./Code"));
+const Date_1 = __importDefault(require("./Date"));
+const JSON_1 = __importDefault(require("./JSON"));
+const Relationship_1 = __importDefault(require("./Relationship"));
+const Richtext_1 = __importDefault(require("./Richtext"));
+const Select_1 = __importDefault(require("./Select"));
+const Textarea_1 = __importDefault(require("./Textarea"));
+exports.default = {
+    array: Array_1.default,
+    blocks: Blocks_1.default,
+    code: Code_1.default,
+    checkbox: Checkbox_1.default,
+    date: Date_1.default,
+    json: JSON_1.default,
+    relationship: Relationship_1.default,
+    richText: Richtext_1.default,
+    select: Select_1.default,
+    radio: Select_1.default,
+    textarea: Textarea_1.default,
+    upload: Relationship_1.default,
 };

package/dist/admin/components/views/collections/List/Cell/index.js

@@ -1,20 +1,25 @@
-import React from 'react';
-import { Link } from 'react-router-dom';
-import { useTranslation } from 'react-i18next';
-import { useConfig } from '../../../../utilities/Config';
-import RenderCustomComponent from '../../../../utilities/RenderCustomComponent';
-import cellComponents from './field-types';
-import { getTranslation } from '../../../../../../utilities/getTranslation';
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importDefault(require("react"));
+const react_router_dom_1 = require("react-router-dom");
+const react_i18next_1 = require("react-i18next");
+const Config_1 = require("../../../../utilities/Config");
+const RenderCustomComponent_1 = __importDefault(require("../../../../utilities/RenderCustomComponent"));
+const field_types_1 = __importDefault(require("./field-types"));
+const getTranslation_1 = require("../../../../../../utilities/getTranslation");
 const DefaultCell = (props) => {
     const { field, collection: { slug, }, cellData, rowData: { id, } = {}, link = true, onClick, className, } = props;
-    const { routes: { admin } } = useConfig();
-    const { t, i18n } = useTranslation('general');
+    const { routes: { admin } } = (0, Config_1.useConfig)();
+    const { t, i18n } = (0, react_i18next_1.useTranslation)('general');
     let WrapElement = 'span';
     const wrapElementProps = {
         className,
     };
     if (link) {
-        WrapElement = Link;
+        WrapElement = react_router_dom_1.Link;
         wrapElementProps.to = `${admin}/collections/${slug}/${id}`;
     }
     if (typeof onClick === 'function') {
@@ -24,20 +29,20 @@ const DefaultCell = (props) => {
             onClick(props);
         };
     }
-    const CellComponent = cellData && cellComponents[field.type];
+    const CellComponent = cellData && field_types_1.default[field.type];
     if (!CellComponent) {
-        return (React.createElement(WrapElement, { ...wrapElementProps },
-            ((cellData === '' || typeof cellData === 'undefined') && 'label' in field) && t('noLabel', { label: getTranslation(typeof field.label === 'function' ? 'data' : field.label || 'data', i18n) }),
+        return (react_1.default.createElement(WrapElement, { ...wrapElementProps },
+            ((cellData === '' || typeof cellData === 'undefined') && 'label' in field) && t('noLabel', { label: (0, getTranslation_1.getTranslation)(typeof field.label === 'function' ? 'data' : field.label || 'data', i18n) }),
             typeof cellData === 'string' && cellData,
             typeof cellData === 'number' && cellData,
             typeof cellData === 'object' && JSON.stringify(cellData)));
     }
-    return (React.createElement(WrapElement, { ...wrapElementProps },
-        React.createElement(CellComponent, { field: field, data: cellData })));
+    return (react_1.default.createElement(WrapElement, { ...wrapElementProps },
+        react_1.default.createElement(CellComponent, { field: field, data: cellData })));
 };
 const Cell = (props) => {
     const { colIndex, collection, cellData, rowData, field, field: { admin: { components: { Cell: CustomCell, } = {}, } = {}, }, link, onClick, className, } = props;
-    return (React.createElement(RenderCustomComponent, { componentProps: {
+    return (react_1.default.createElement(RenderCustomComponent_1.default, { componentProps: {
             rowData,
             colIndex,
             cellData,
@@ -48,4 +53,4 @@ const Cell = (props) => {
             className,
         }, CustomComponent: CustomCell, DefaultComponent: DefaultCell }));
 };
-export default Cell;
+exports.default = Cell;

package/dist/admin/components/views/collections/List/Cell/types.d.ts

@@ -1,6 +1,6 @@
 import { Field } from '../../../../../../fields/config/types';
 import { SanitizedCollectionConfig } from '../../../../../../collections/config/types';
-export declare type Props = {
+export type Props = {
     field: Field;
     colIndex: number;
     collection: SanitizedCollectionConfig;

package/dist/admin/components/views/collections/List/Cell/types.js

@@ -1 +1,2 @@
-export {};
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/admin/components/views/collections/List/Default.js

@@ -1,56 +1,84 @@
-import React, { Fragment } from 'react';
-import { useHistory } from 'react-router-dom';
-import { useTranslation } from 'react-i18next';
-import { useConfig } from '../../../utilities/Config';
-import UploadGallery from '../../../elements/UploadGallery';
-import Eyebrow from '../../../elements/Eyebrow';
-import Paginator from '../../../elements/Paginator';
-import ListControls from '../../../elements/ListControls';
-import Pill from '../../../elements/Pill';
-import Button from '../../../elements/Button';
-import Table from '../../../elements/Table';
-import Meta from '../../../utilities/Meta';
-import ViewDescription from '../../../elements/ViewDescription';
-import PerPage from '../../../elements/PerPage';
-import { Gutter } from '../../../elements/Gutter';
-import { RelationshipProvider } from './RelationshipProvider';
-import { getTranslation } from '../../../../../utilities/getTranslation';
-import './index.scss';
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importStar(require("react"));
+const react_router_dom_1 = require("react-router-dom");
+const react_i18next_1 = require("react-i18next");
+const Config_1 = require("../../../utilities/Config");
+const UploadGallery_1 = __importDefault(require("../../../elements/UploadGallery"));
+const Eyebrow_1 = __importDefault(require("../../../elements/Eyebrow"));
+const Paginator_1 = __importDefault(require("../../../elements/Paginator"));
+const ListControls_1 = __importDefault(require("../../../elements/ListControls"));
+const Pill_1 = __importDefault(require("../../../elements/Pill"));
+const Button_1 = __importDefault(require("../../../elements/Button"));
+const Table_1 = __importDefault(require("../../../elements/Table"));
+const Meta_1 = __importDefault(require("../../../utilities/Meta"));
+const ViewDescription_1 = __importDefault(require("../../../elements/ViewDescription"));
+const PerPage_1 = __importDefault(require("../../../elements/PerPage"));
+const Gutter_1 = require("../../../elements/Gutter");
+const RelationshipProvider_1 = require("./RelationshipProvider");
+const getTranslation_1 = require("../../../../../utilities/getTranslation");
+require("./index.scss");
 const baseClass = 'collection-list';
 const DefaultList = (props) => {
     var _a, _b;
     const { collection, collection: { upload, slug, labels: { singular: singularLabel, plural: pluralLabel, }, admin: { description, } = {}, }, data, newDocumentURL, limit, tableColumns, columnNames, setColumns, hasCreatePermission, disableEyebrow, modifySearchParams, disableCardLink, onCardClick, handleSortChange, handleWhereChange, handlePageChange, handlePerPageChange, customHeader, } = props;
-    const { routes: { admin } } = useConfig();
-    const history = useHistory();
-    const { t, i18n } = useTranslation('general');
-    return (React.createElement("div", { className: baseClass },
-        React.createElement(Meta, { title: getTranslation(collection.labels.plural, i18n) }),
-        !disableEyebrow && (React.createElement(Eyebrow, null)),
-        React.createElement(Gutter, { className: `${baseClass}__wrap` },
-            React.createElement("header", { className: `${baseClass}__header` },
+    const { routes: { admin } } = (0, Config_1.useConfig)();
+    const history = (0, react_router_dom_1.useHistory)();
+    const { t, i18n } = (0, react_i18next_1.useTranslation)('general');
+    return (react_1.default.createElement("div", { className: baseClass },
+        react_1.default.createElement(Meta_1.default, { title: (0, getTranslation_1.getTranslation)(collection.labels.plural, i18n) }),
+        !disableEyebrow && (react_1.default.createElement(Eyebrow_1.default, null)),
+        react_1.default.createElement(Gutter_1.Gutter, { className: `${baseClass}__wrap` },
+            react_1.default.createElement("header", { className: `${baseClass}__header` },
                 customHeader && customHeader,
-                !customHeader && (React.createElement(Fragment, null,
-                    React.createElement("h1", null, getTranslation(pluralLabel, i18n)),
-                    hasCreatePermission && (React.createElement(Pill, { to: newDocumentURL }, t('createNew'))),
-                    description && (React.createElement("div", { className: `${baseClass}__sub-header` },
-                        React.createElement(ViewDescription, { description: description })))))),
-            React.createElement(ListControls, { collection: collection, columns: columnNames, setColumns: setColumns, enableColumns: Boolean(!upload), enableSort: Boolean(upload), modifySearchQuery: modifySearchParams, handleSortChange: handleSortChange, handleWhereChange: handleWhereChange }),
-            (data.docs && data.docs.length > 0) && (React.createElement(React.Fragment, null,
-                !upload && (React.createElement(RelationshipProvider, null,
-                    React.createElement(Table, { data: data.docs, columns: tableColumns }))),
-                upload && (React.createElement(UploadGallery, { docs: data.docs, collection: collection, onCardClick: (doc) => {
+                !customHeader && (react_1.default.createElement(react_1.Fragment, null,
+                    react_1.default.createElement("h1", null, (0, getTranslation_1.getTranslation)(pluralLabel, i18n)),
+                    hasCreatePermission && (react_1.default.createElement(Pill_1.default, { to: newDocumentURL }, t('createNew'))),
+                    description && (react_1.default.createElement("div", { className: `${baseClass}__sub-header` },
+                        react_1.default.createElement(ViewDescription_1.default, { description: description })))))),
+            react_1.default.createElement(ListControls_1.default, { collection: collection, columns: columnNames, setColumns: setColumns, enableColumns: Boolean(!upload), enableSort: Boolean(upload), modifySearchQuery: modifySearchParams, handleSortChange: handleSortChange, handleWhereChange: handleWhereChange }),
+            (data.docs && data.docs.length > 0) && (react_1.default.createElement(react_1.default.Fragment, null,
+                !upload && (react_1.default.createElement(RelationshipProvider_1.RelationshipProvider, null,
+                    react_1.default.createElement(Table_1.default, { data: data.docs, columns: tableColumns }))),
+                upload && (react_1.default.createElement(UploadGallery_1.default, { docs: data.docs, collection: collection, onCardClick: (doc) => {
                         if (typeof onCardClick === 'function')
                             onCardClick(doc);
                         if (!disableCardLink)
                             history.push(`${admin}/collections/${slug}/${doc.id}`);
                     } })))),
-            data.docs && data.docs.length === 0 && (React.createElement("div", { className: `${baseClass}__no-results` },
-                React.createElement("p", null, t('noResults', { label: getTranslation(pluralLabel, i18n) })),
-                hasCreatePermission && newDocumentURL && (React.createElement(Button, { el: "link", to: newDocumentURL }, t('createNewLabel', { label: getTranslation(singularLabel, i18n) }))))),
-            React.createElement("div", { className: `${baseClass}__page-controls` },
-                React.createElement(Paginator, { limit: data.limit, totalPages: data.totalPages, page: data.page, hasPrevPage: data.hasPrevPage, hasNextPage: data.hasNextPage, prevPage: data.prevPage, nextPage: data.nextPage, numberOfNeighbors: 1, disableHistoryChange: modifySearchParams === false, onChange: handlePageChange }),
-                (data === null || data === void 0 ? void 0 : data.totalDocs) > 0 && (React.createElement(Fragment, null,
-                    React.createElement("div", { className: `${baseClass}__page-info` },
+            data.docs && data.docs.length === 0 && (react_1.default.createElement("div", { className: `${baseClass}__no-results` },
+                react_1.default.createElement("p", null, t('noResults', { label: (0, getTranslation_1.getTranslation)(pluralLabel, i18n) })),
+                hasCreatePermission && newDocumentURL && (react_1.default.createElement(Button_1.default, { el: "link", to: newDocumentURL }, t('createNewLabel', { label: (0, getTranslation_1.getTranslation)(singularLabel, i18n) }))))),
+            react_1.default.createElement("div", { className: `${baseClass}__page-controls` },
+                react_1.default.createElement(Paginator_1.default, { limit: data.limit, totalPages: data.totalPages, page: data.page, hasPrevPage: data.hasPrevPage, hasNextPage: data.hasNextPage, prevPage: data.prevPage, nextPage: data.nextPage, numberOfNeighbors: 1, disableHistoryChange: modifySearchParams === false, onChange: handlePageChange }),
+                (data === null || data === void 0 ? void 0 : data.totalDocs) > 0 && (react_1.default.createElement(react_1.Fragment, null,
+                    react_1.default.createElement("div", { className: `${baseClass}__page-info` },
                         (data.page * data.limit) - (data.limit - 1),
                         "-",
                         data.totalPages > 1 && data.totalPages !== data.page ? (data.limit * data.page) : data.totalDocs,
@@ -58,6 +86,6 @@ const DefaultList = (props) => {
                         t('of'),
                         ' ',
                         data.totalDocs),
-                    React.createElement(PerPage, { limits: (_b = (_a = collection === null || collection === void 0 ? void 0 : collection.admin) === null || _a === void 0 ? void 0 : _a.pagination) === null || _b === void 0 ? void 0 : _b.limits, limit: limit, modifySearchParams: modifySearchParams, handleChange: handlePerPageChange })))))));
+                    react_1.default.createElement(PerPage_1.default, { limits: (_b = (_a = collection === null || collection === void 0 ? void 0 : collection.admin) === null || _a === void 0 ? void 0 : _a.pagination) === null || _b === void 0 ? void 0 : _b.limits, limit: limit, modifySearchParams: modifySearchParams, handleChange: handlePerPageChange })))))));
 };
-export default DefaultList;
+exports.default = DefaultList;

package/dist/admin/components/views/collections/List/RelationshipProvider/index.d.ts

@@ -1,11 +1,11 @@
 import React from 'react';
 import { TypeWithID } from '../../../../../../collections/config/types';
-export declare type Documents = {
+export type Documents = {
     [slug: string]: {
         [id: string | number]: TypeWithID | null | false;
     };
 };
-declare type ListRelationshipContext = {
+type ListRelationshipContext = {
     getRelationships: (docs: {
         relationTo: string;
         value: number | string;