payload 1.4.2 → 1.5.1

package/dist/admin/components/elements/CopyToClipboard/types.d.ts

@@ -1,4 +1,4 @@
-export declare type Props = {
+export type Props = {
     value?: string;
     defaultMessage?: string;
     successMessage?: string;

package/dist/admin/components/elements/CopyToClipboard/types.js

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

package/dist/admin/components/elements/DatePicker/DatePicker.js

@@ -1,9 +1,14 @@
-import React from 'react';
-import DatePicker from 'react-datepicker';
-import CalendarIcon from '../../icons/Calendar';
-import XIcon from '../../icons/X';
-import 'react-datepicker/dist/react-datepicker.css';
-import './index.scss';
+"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_datepicker_1 = __importDefault(require("react-datepicker"));
+const Calendar_1 = __importDefault(require("../../icons/Calendar"));
+const X_1 = __importDefault(require("../../icons/X"));
+require("react-datepicker/dist/react-datepicker.css");
+require("./index.scss");
 const baseClass = 'date-time-picker';
 const DateTime = (props) => {
     const { value, onChange, displayFormat, pickerAppearance = 'dayAndTime', minDate, maxDate, monthsToShow = 1, minTime, maxTime, timeIntervals = 30, timeFormat = 'h:mm aa', readOnly, placeholder: placeholderText, } = props;
@@ -40,16 +45,16 @@ const DateTime = (props) => {
         baseClass,
         `${baseClass}__appearance--${pickerAppearance}`,
     ].filter(Boolean).join(' ');
-    return (React.createElement("div", { className: classes },
-        React.createElement("div", { className: `${baseClass}__icon-wrap` },
-            dateTimePickerProps.selected && (React.createElement("button", { type: "button", className: `${baseClass}__clear-button`, onClick: () => onChange(null) },
-                React.createElement(XIcon, null))),
-            React.createElement(CalendarIcon, null)),
-        React.createElement("div", { className: `${baseClass}__input-wrapper` },
-            React.createElement(DatePicker, { ...dateTimePickerProps, onChange: (val) => onChange(val), popperModifiers: {
+    return (react_1.default.createElement("div", { className: classes },
+        react_1.default.createElement("div", { className: `${baseClass}__icon-wrap` },
+            dateTimePickerProps.selected && (react_1.default.createElement("button", { type: "button", className: `${baseClass}__clear-button`, onClick: () => onChange(null) },
+                react_1.default.createElement(X_1.default, null))),
+            react_1.default.createElement(Calendar_1.default, null)),
+        react_1.default.createElement("div", { className: `${baseClass}__input-wrapper` },
+            react_1.default.createElement(react_datepicker_1.default, { ...dateTimePickerProps, onChange: (val) => onChange(val), popperModifiers: {
                     preventOverflow: {
                         enabled: true,
                     },
                 } }))));
 };
-export default DateTime;
+exports.default = DateTime;

package/dist/admin/components/elements/DatePicker/index.js

@@ -1,6 +1,34 @@
-import React, { Suspense, lazy } from 'react';
-import Loading from '../Loading';
-const DatePicker = lazy(() => import('./DatePicker'));
-const DatePickerField = (props) => (React.createElement(Suspense, { fallback: React.createElement(Loading, null) },
-    React.createElement(DatePicker, { ...props })));
-export default DatePickerField;
+"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 Loading_1 = __importDefault(require("../Loading"));
+const DatePicker = (0, react_1.lazy)(() => Promise.resolve().then(() => __importStar(require('./DatePicker'))));
+const DatePickerField = (props) => (react_1.default.createElement(react_1.Suspense, { fallback: react_1.default.createElement(Loading_1.default, null) },
+    react_1.default.createElement(DatePicker, { ...props })));
+exports.default = DatePickerField;

package/dist/admin/components/elements/DatePicker/types.d.ts

@@ -1,23 +1,23 @@
-declare type SharedProps = {
+type SharedProps = {
     displayFormat?: string;
     pickerAppearance?: 'dayAndTime' | 'timeOnly' | 'dayOnly' | 'monthOnly';
 };
-declare type TimePickerProps = {
+type TimePickerProps = {
     minTime?: Date;
     maxTime?: Date;
     timeIntervals?: number;
     timeFormat?: string;
 };
-declare type DayPickerProps = {
+type DayPickerProps = {
     monthsToShow?: 1 | 2;
     minDate?: Date;
     maxDate?: Date;
 };
-declare type MonthPickerProps = {
+type MonthPickerProps = {
     minDate?: Date;
     maxDate?: Date;
 };
-export declare type ConditionalDateProps = SharedProps & DayPickerProps & TimePickerProps & {
+export type ConditionalDateProps = SharedProps & DayPickerProps & TimePickerProps & {
     pickerAppearance?: 'dayAndTime';
 } | SharedProps & TimePickerProps & {
     pickerAppearance: 'timeOnly';
@@ -26,7 +26,7 @@ export declare type ConditionalDateProps = SharedProps & DayPickerProps & TimePi
 } | SharedProps & MonthPickerProps & {
     pickerAppearance: 'monthOnly';
 };
-export declare type Props = SharedProps & DayPickerProps & TimePickerProps & {
+export type Props = SharedProps & DayPickerProps & TimePickerProps & {
     value?: Date;
     onChange?: (val: Date) => void;
     readOnly?: boolean;

package/dist/admin/components/elements/DatePicker/types.js

@@ -1,3 +1,2 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidHlwZXMuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9zcmMvYWRtaW4vY29tcG9uZW50cy9lbGVtZW50cy9EYXRlUGlja2VyL3R5cGVzLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiIifQ==

package/dist/admin/components/elements/DeleteDocument/index.js

@@ -1,35 +1,63 @@
-import React, { useState, useCallback } from 'react';
-import { toast } from 'react-toastify';
-import { useHistory } from 'react-router-dom';
-import { Modal, useModal } from '@faceless-ui/modal';
-import { Trans, useTranslation } from 'react-i18next';
-import { useConfig } from '../../utilities/Config';
-import Button from '../Button';
-import MinimalTemplate from '../../templates/Minimal';
-import { useForm } from '../../forms/Form/context';
-import useTitle from '../../../hooks/useTitle';
-import { requests } from '../../../api';
-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_toastify_1 = require("react-toastify");
+const react_router_dom_1 = require("react-router-dom");
+const modal_1 = require("@faceless-ui/modal");
+const react_i18next_1 = require("react-i18next");
+const Config_1 = require("../../utilities/Config");
+const Button_1 = __importDefault(require("../Button"));
+const Minimal_1 = __importDefault(require("../../templates/Minimal"));
+const context_1 = require("../../forms/Form/context");
+const useTitle_1 = __importDefault(require("../../../hooks/useTitle"));
+const api_1 = require("../../../api");
+const getTranslation_1 = require("../../../../utilities/getTranslation");
+require("./index.scss");
 const baseClass = 'delete-document';
 const DeleteDocument = (props) => {
     const { title: titleFromProps, id, buttonId, collection: { admin: { useAsTitle, }, slug, labels: { singular, } = {}, } = {}, } = props;
-    const { serverURL, routes: { api, admin } } = useConfig();
-    const { setModified } = useForm();
-    const [deleting, setDeleting] = useState(false);
-    const { toggleModal } = useModal();
-    const history = useHistory();
-    const { t, i18n } = useTranslation('general');
-    const title = useTitle(useAsTitle) || id;
+    const { serverURL, routes: { api, admin } } = (0, Config_1.useConfig)();
+    const { setModified } = (0, context_1.useForm)();
+    const [deleting, setDeleting] = (0, react_1.useState)(false);
+    const { toggleModal } = (0, modal_1.useModal)();
+    const history = (0, react_router_dom_1.useHistory)();
+    const { t, i18n } = (0, react_i18next_1.useTranslation)('general');
+    const title = (0, useTitle_1.default)(useAsTitle) || id;
     const titleToRender = titleFromProps || title;
     const modalSlug = `delete-${id}`;
-    const addDefaultError = useCallback(() => {
-        toast.error(t('error:deletingTitle', { title }));
+    const addDefaultError = (0, react_1.useCallback)(() => {
+        react_toastify_1.toast.error(t('error:deletingTitle', { title }));
     }, [t, title]);
-    const handleDelete = useCallback(() => {
+    const handleDelete = (0, react_1.useCallback)(() => {
         setDeleting(true);
         setModified(false);
-        requests.delete(`${serverURL}${api}/${slug}/${id}`, {
+        api_1.requests.delete(`${serverURL}${api}/${slug}/${id}`, {
             headers: {
                 'Content-Type': 'application/json',
                 'Accept-Language': i18n.language,
@@ -39,12 +67,12 @@ const DeleteDocument = (props) => {
                 const json = await res.json();
                 if (res.status < 400) {
                     toggleModal(modalSlug);
-                    toast.success(t('titleDeleted', { label: getTranslation(singular, i18n), title }));
+                    react_toastify_1.toast.success(t('titleDeleted', { label: (0, getTranslation_1.getTranslation)(singular, i18n), title }));
                     return history.push(`${admin}/collections/${slug}`);
                 }
                 toggleModal(modalSlug);
                 if (json.errors) {
-                    json.errors.forEach((error) => toast.error(error.message));
+                    json.errors.forEach((error) => react_toastify_1.toast.error(error.message));
                 }
                 else {
                     addDefaultError();
@@ -57,22 +85,22 @@ const DeleteDocument = (props) => {
         });
     }, [setModified, serverURL, api, slug, id, toggleModal, modalSlug, t, singular, i18n, title, history, admin, addDefaultError]);
     if (id) {
-        return (React.createElement(React.Fragment, null,
-            React.createElement("button", { type: "button", id: buttonId, className: `${baseClass}__toggle`, onClick: (e) => {
+        return (react_1.default.createElement(react_1.default.Fragment, null,
+            react_1.default.createElement("button", { type: "button", id: buttonId, className: `${baseClass}__toggle`, onClick: (e) => {
                     e.preventDefault();
                     setDeleting(false);
                     toggleModal(modalSlug);
                 } }, t('delete')),
-            React.createElement(Modal, { slug: modalSlug, className: baseClass },
-                React.createElement(MinimalTemplate, { className: `${baseClass}__template` },
-                    React.createElement("h1", null, t('confirmDeletion')),
-                    React.createElement("p", null,
-                        React.createElement(Trans, { i18nKey: "aboutToDelete", values: { label: getTranslation(singular, i18n), title: titleToRender }, t: t },
+            react_1.default.createElement(modal_1.Modal, { slug: modalSlug, className: baseClass },
+                react_1.default.createElement(Minimal_1.default, { className: `${baseClass}__template` },
+                    react_1.default.createElement("h1", null, t('confirmDeletion')),
+                    react_1.default.createElement("p", null,
+                        react_1.default.createElement(react_i18next_1.Trans, { i18nKey: "aboutToDelete", values: { label: (0, getTranslation_1.getTranslation)(singular, i18n), title: titleToRender }, t: t },
                             "aboutToDelete",
-                            React.createElement("strong", null, titleToRender))),
-                    React.createElement(Button, { id: "confirm-cancel", buttonStyle: "secondary", type: "button", onClick: deleting ? undefined : () => toggleModal(modalSlug) }, t('cancel')),
-                    React.createElement(Button, { onClick: deleting ? undefined : handleDelete, id: "confirm-delete" }, deleting ? t('deleting') : t('confirm'))))));
+                            react_1.default.createElement("strong", null, titleToRender))),
+                    react_1.default.createElement(Button_1.default, { id: "confirm-cancel", buttonStyle: "secondary", type: "button", onClick: deleting ? undefined : () => toggleModal(modalSlug) }, t('cancel')),
+                    react_1.default.createElement(Button_1.default, { onClick: deleting ? undefined : handleDelete, id: "confirm-delete" }, deleting ? t('deleting') : t('confirm'))))));
     }
     return null;
 };
-export default DeleteDocument;
+exports.default = DeleteDocument;

package/dist/admin/components/elements/DeleteDocument/types.d.ts

@@ -1,5 +1,5 @@
 import { SanitizedCollectionConfig } from '../../../../collections/config/types';
-export declare type Props = {
+export type Props = {
     collection?: SanitizedCollectionConfig;
     id?: string;
     buttonId?: string;

package/dist/admin/components/elements/DeleteDocument/types.js

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

package/dist/admin/components/elements/DocumentDrawer/DrawerContent.js

@@ -1,44 +1,73 @@
-import React, { useCallback, useEffect, useRef, useState } from 'react';
-import { useModal } from '@faceless-ui/modal';
-import { useTranslation } from 'react-i18next';
-import { toast } from 'react-toastify';
-import DefaultEdit from '../../views/collections/Edit/Default';
-import X from '../../icons/X';
-import buildStateFromSchema from '../../forms/Form/buildStateFromSchema';
-import { getTranslation } from '../../../../utilities/getTranslation';
-import Button from '../Button';
-import { useConfig } from '../../utilities/Config';
-import { useLocale } from '../../utilities/Locale';
-import { useAuth } from '../../utilities/Auth';
-import { DocumentInfoProvider } from '../../utilities/DocumentInfo';
-import RenderCustomComponent from '../../utilities/RenderCustomComponent';
-import usePayloadAPI from '../../../hooks/usePayloadAPI';
-import formatFields from '../../views/collections/Edit/formatFields';
-import { useRelatedCollections } from '../../forms/field-types/Relationship/AddNew/useRelatedCollections';
-import IDLabel from '../IDLabel';
-import { baseClass } from '.';
-export const DocumentDrawerContent = ({ collectionSlug, id, drawerSlug, onSave: onSaveFromProps, customHeader, }) => {
+"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 });
+exports.DocumentDrawerContent = void 0;
+const react_1 = __importStar(require("react"));
+const modal_1 = require("@faceless-ui/modal");
+const react_i18next_1 = require("react-i18next");
+const react_toastify_1 = require("react-toastify");
+const Default_1 = __importDefault(require("../../views/collections/Edit/Default"));
+const X_1 = __importDefault(require("../../icons/X"));
+const buildStateFromSchema_1 = __importDefault(require("../../forms/Form/buildStateFromSchema"));
+const getTranslation_1 = require("../../../../utilities/getTranslation");
+const Button_1 = __importDefault(require("../Button"));
+const Config_1 = require("../../utilities/Config");
+const Locale_1 = require("../../utilities/Locale");
+const Auth_1 = require("../../utilities/Auth");
+const DocumentInfo_1 = require("../../utilities/DocumentInfo");
+const RenderCustomComponent_1 = __importDefault(require("../../utilities/RenderCustomComponent"));
+const usePayloadAPI_1 = __importDefault(require("../../../hooks/usePayloadAPI"));
+const formatFields_1 = __importDefault(require("../../views/collections/Edit/formatFields"));
+const useRelatedCollections_1 = require("../../forms/field-types/Relationship/AddNew/useRelatedCollections");
+const IDLabel_1 = __importDefault(require("../IDLabel"));
+const _1 = require(".");
+const DocumentDrawerContent = ({ collectionSlug, id, drawerSlug, onSave: onSaveFromProps, customHeader, }) => {
     var _a, _b, _c;
-    const { serverURL, routes: { api } } = useConfig();
-    const { toggleModal, modalState, closeModal } = useModal();
-    const locale = useLocale();
-    const { permissions, user } = useAuth();
-    const [initialState, setInitialState] = useState();
-    const { t, i18n } = useTranslation(['fields', 'general']);
-    const hasInitializedState = useRef(false);
-    const [isOpen, setIsOpen] = useState(false);
-    const [collectionConfig] = useRelatedCollections(collectionSlug);
-    const [fields, setFields] = useState(() => formatFields(collectionConfig, true));
-    useEffect(() => {
-        setFields(formatFields(collectionConfig, true));
+    const { serverURL, routes: { api } } = (0, Config_1.useConfig)();
+    const { toggleModal, modalState, closeModal } = (0, modal_1.useModal)();
+    const locale = (0, Locale_1.useLocale)();
+    const { permissions, user } = (0, Auth_1.useAuth)();
+    const [initialState, setInitialState] = (0, react_1.useState)();
+    const { t, i18n } = (0, react_i18next_1.useTranslation)(['fields', 'general']);
+    const hasInitializedState = (0, react_1.useRef)(false);
+    const [isOpen, setIsOpen] = (0, react_1.useState)(false);
+    const [collectionConfig] = (0, useRelatedCollections_1.useRelatedCollections)(collectionSlug);
+    const [fields, setFields] = (0, react_1.useState)(() => (0, formatFields_1.default)(collectionConfig, true));
+    (0, react_1.useEffect)(() => {
+        setFields((0, formatFields_1.default)(collectionConfig, true));
     }, [collectionSlug, collectionConfig]);
-    const [{ data, isLoading: isLoadingDocument, isError }] = usePayloadAPI((id ? `${serverURL}${api}/${collectionSlug}/${id}` : null), { initialParams: { 'fallback-locale': 'null', depth: 0, draft: 'true' } });
-    useEffect(() => {
+    const [{ data, isLoading: isLoadingDocument, isError }] = (0, usePayloadAPI_1.default)((id ? `${serverURL}${api}/${collectionSlug}/${id}` : null), { initialParams: { 'fallback-locale': 'null', depth: 0, draft: 'true' } });
+    (0, react_1.useEffect)(() => {
         if (isLoadingDocument) {
             return;
         }
         const awaitInitialState = async () => {
-            const state = await buildStateFromSchema({
+            const state = await (0, buildStateFromSchema_1.default)({
                 fieldSchema: fields,
                 data,
                 user,
@@ -52,18 +81,18 @@ export const DocumentDrawerContent = ({ collectionSlug, id, drawerSlug, onSave:
         awaitInitialState();
         hasInitializedState.current = true;
     }, [data, fields, id, user, locale, isLoadingDocument, t]);
-    useEffect(() => {
+    (0, react_1.useEffect)(() => {
         var _a;
         setIsOpen(Boolean((_a = modalState[drawerSlug]) === null || _a === void 0 ? void 0 : _a.isOpen));
     }, [modalState, drawerSlug]);
-    useEffect(() => {
+    (0, react_1.useEffect)(() => {
         var _a;
         if (isOpen && !isLoadingDocument && isError) {
             closeModal(drawerSlug);
-            toast.error(((_a = data.errors) === null || _a === void 0 ? void 0 : _a[0].message) || t('error:unspecific'));
+            react_toastify_1.toast.error(((_a = data.errors) === null || _a === void 0 ? void 0 : _a[0].message) || t('error:unspecific'));
         }
     }, [isError, t, isOpen, data, drawerSlug, closeModal, isLoadingDocument]);
-    const onSave = useCallback((args) => {
+    const onSave = (0, react_1.useCallback)((args) => {
         if (typeof onSaveFromProps === 'function') {
             onSaveFromProps({
                 ...args,
@@ -73,8 +102,8 @@ export const DocumentDrawerContent = ({ collectionSlug, id, drawerSlug, onSave:
     }, [collectionConfig, onSaveFromProps]);
     if (isError)
         return null;
-    return (React.createElement(DocumentInfoProvider, { collection: collectionConfig },
-        React.createElement(RenderCustomComponent, { DefaultComponent: DefaultEdit, CustomComponent: (_c = (_b = (_a = collectionConfig.admin) === null || _a === void 0 ? void 0 : _a.components) === null || _b === void 0 ? void 0 : _b.views) === null || _c === void 0 ? void 0 : _c.Edit, componentProps: {
+    return (react_1.default.createElement(DocumentInfo_1.DocumentInfoProvider, { collection: collectionConfig },
+        react_1.default.createElement(RenderCustomComponent_1.default, { DefaultComponent: Default_1.default, CustomComponent: (_c = (_b = (_a = collectionConfig.admin) === null || _a === void 0 ? void 0 : _a.components) === null || _b === void 0 ? void 0 : _b.views) === null || _c === void 0 ? void 0 : _c.Edit, componentProps: {
                 isLoading: !initialState,
                 data,
                 id,
@@ -90,11 +119,12 @@ export const DocumentDrawerContent = ({ collectionSlug, id, drawerSlug, onSave:
                 disableActions: true,
                 me: true,
                 disableLeaveWithoutSaving: true,
-                customHeader: (React.createElement("div", { className: `${baseClass}__header` },
-                    React.createElement("div", { className: `${baseClass}__header-content` },
-                        React.createElement("h2", { className: `${baseClass}__header-text` }, !customHeader ? t(!id ? 'fields:addNewLabel' : 'general:editLabel', { label: getTranslation(collectionConfig.labels.singular, i18n) }) : customHeader),
-                        React.createElement(Button, { buttonStyle: "none", className: `${baseClass}__header-close`, onClick: () => toggleModal(drawerSlug), "aria-label": t('general:close') },
-                            React.createElement(X, null))),
-                    id && (React.createElement(IDLabel, { id: id })))),
+                customHeader: (react_1.default.createElement("div", { className: `${_1.baseClass}__header` },
+                    react_1.default.createElement("div", { className: `${_1.baseClass}__header-content` },
+                        react_1.default.createElement("h2", { className: `${_1.baseClass}__header-text` }, !customHeader ? t(!id ? 'fields:addNewLabel' : 'general:editLabel', { label: (0, getTranslation_1.getTranslation)(collectionConfig.labels.singular, i18n) }) : customHeader),
+                        react_1.default.createElement(Button_1.default, { buttonStyle: "none", className: `${_1.baseClass}__header-close`, onClick: () => toggleModal(drawerSlug), "aria-label": t('general:close') },
+                            react_1.default.createElement(X_1.default, null))),
+                    id && (react_1.default.createElement(IDLabel_1.default, { id: id })))),
             } })));
 };
+exports.DocumentDrawerContent = DocumentDrawerContent;

package/dist/admin/components/elements/DocumentDrawer/index.js

@@ -1,58 +1,86 @@
-import React, { useCallback, useEffect, useId, useMemo, useState } from 'react';
-import { useModal } from '@faceless-ui/modal';
-import { useTranslation } from 'react-i18next';
-import { getTranslation } from '../../../../utilities/getTranslation';
-import { Drawer, DrawerToggler } from '../Drawer';
-import { useRelatedCollections } from '../../forms/field-types/Relationship/AddNew/useRelatedCollections';
-import { useEditDepth } from '../../utilities/EditDepth';
-import { DocumentDrawerContent } from './DrawerContent';
-import './index.scss';
-export const baseClass = 'doc-drawer';
+"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;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useDocumentDrawer = exports.DocumentDrawer = exports.DocumentDrawerToggler = exports.baseClass = void 0;
+const react_1 = __importStar(require("react"));
+const modal_1 = require("@faceless-ui/modal");
+const react_i18next_1 = require("react-i18next");
+const getTranslation_1 = require("../../../../utilities/getTranslation");
+const Drawer_1 = require("../Drawer");
+const useRelatedCollections_1 = require("../../forms/field-types/Relationship/AddNew/useRelatedCollections");
+const EditDepth_1 = require("../../utilities/EditDepth");
+const DrawerContent_1 = require("./DrawerContent");
+require("./index.scss");
+exports.baseClass = 'doc-drawer';
 const formatDocumentDrawerSlug = ({ collectionSlug, id, depth, uuid, }) => `doc-drawer_${collectionSlug}_${depth}${id ? `_${id}` : ''}_${uuid}`;
-export const DocumentDrawerToggler = ({ children, className, drawerSlug, id, collectionSlug, disabled, ...rest }) => {
-    const { t, i18n } = useTranslation(['fields', 'general']);
-    const [collectionConfig] = useRelatedCollections(collectionSlug);
-    return (React.createElement(DrawerToggler, { slug: drawerSlug, formatSlug: false, className: [
+const DocumentDrawerToggler = ({ children, className, drawerSlug, id, collectionSlug, disabled, ...rest }) => {
+    const { t, i18n } = (0, react_i18next_1.useTranslation)(['fields', 'general']);
+    const [collectionConfig] = (0, useRelatedCollections_1.useRelatedCollections)(collectionSlug);
+    return (react_1.default.createElement(Drawer_1.DrawerToggler, { slug: drawerSlug, formatSlug: false, className: [
             className,
-            `${baseClass}__toggler`,
-        ].filter(Boolean).join(' '), disabled: disabled, "aria-label": t(!id ? 'fields:addNewLabel' : 'general:editLabel', { label: getTranslation(collectionConfig.labels.singular, i18n) }), ...rest }, children));
+            `${exports.baseClass}__toggler`,
+        ].filter(Boolean).join(' '), disabled: disabled, "aria-label": t(!id ? 'fields:addNewLabel' : 'general:editLabel', { label: (0, getTranslation_1.getTranslation)(collectionConfig.labels.singular, i18n) }), ...rest }, children));
 };
-export const DocumentDrawer = (props) => {
+exports.DocumentDrawerToggler = DocumentDrawerToggler;
+const DocumentDrawer = (props) => {
     const { drawerSlug } = props;
-    return (React.createElement(Drawer, { slug: drawerSlug, formatSlug: false, className: baseClass },
-        React.createElement(DocumentDrawerContent, { ...props })));
+    return (react_1.default.createElement(Drawer_1.Drawer, { slug: drawerSlug, formatSlug: false, className: exports.baseClass },
+        react_1.default.createElement(DrawerContent_1.DocumentDrawerContent, { ...props })));
 };
-export const useDocumentDrawer = ({ id, collectionSlug }) => {
-    const drawerDepth = useEditDepth();
-    const uuid = useId();
-    const { modalState, toggleModal, closeModal, openModal } = useModal();
-    const [isOpen, setIsOpen] = useState(false);
+exports.DocumentDrawer = DocumentDrawer;
+const useDocumentDrawer = ({ id, collectionSlug }) => {
+    const drawerDepth = (0, EditDepth_1.useEditDepth)();
+    const uuid = (0, react_1.useId)();
+    const { modalState, toggleModal, closeModal, openModal } = (0, modal_1.useModal)();
+    const [isOpen, setIsOpen] = (0, react_1.useState)(false);
     const drawerSlug = formatDocumentDrawerSlug({
         collectionSlug,
         id,
         depth: drawerDepth,
         uuid,
     });
-    useEffect(() => {
+    (0, react_1.useEffect)(() => {
         var _a;
         setIsOpen(Boolean((_a = modalState[drawerSlug]) === null || _a === void 0 ? void 0 : _a.isOpen));
     }, [modalState, drawerSlug]);
-    const toggleDrawer = useCallback(() => {
+    const toggleDrawer = (0, react_1.useCallback)(() => {
         toggleModal(drawerSlug);
     }, [toggleModal, drawerSlug]);
-    const closeDrawer = useCallback(() => {
+    const closeDrawer = (0, react_1.useCallback)(() => {
         closeModal(drawerSlug);
     }, [closeModal, drawerSlug]);
-    const openDrawer = useCallback(() => {
+    const openDrawer = (0, react_1.useCallback)(() => {
         openModal(drawerSlug);
     }, [openModal, drawerSlug]);
-    const MemoizedDrawer = useMemo(() => {
-        return ((props) => (React.createElement(DocumentDrawer, { ...props, collectionSlug: collectionSlug, id: id, drawerSlug: drawerSlug, key: drawerSlug })));
+    const MemoizedDrawer = (0, react_1.useMemo)(() => {
+        return ((props) => (react_1.default.createElement(exports.DocumentDrawer, { ...props, collectionSlug: collectionSlug, id: id, drawerSlug: drawerSlug, key: drawerSlug })));
     }, [id, drawerSlug, collectionSlug]);
-    const MemoizedDrawerToggler = useMemo(() => {
-        return ((props) => (React.createElement(DocumentDrawerToggler, { ...props, id: id, collectionSlug: collectionSlug, drawerSlug: drawerSlug })));
+    const MemoizedDrawerToggler = (0, react_1.useMemo)(() => {
+        return ((props) => (react_1.default.createElement(exports.DocumentDrawerToggler, { ...props, id: id, collectionSlug: collectionSlug, drawerSlug: drawerSlug })));
     }, [id, drawerSlug, collectionSlug]);
-    const MemoizedDrawerState = useMemo(() => ({
+    const MemoizedDrawerState = (0, react_1.useMemo)(() => ({
         drawerSlug,
         drawerDepth,
         isDrawerOpen: isOpen,
@@ -66,3 +94,4 @@ export const useDocumentDrawer = ({ id, collectionSlug }) => {
         MemoizedDrawerState,
     ];
 };
+exports.useDocumentDrawer = useDocumentDrawer;

package/dist/admin/components/elements/DocumentDrawer/types.d.ts

@@ -1,6 +1,6 @@
 import React, { HTMLAttributes } from 'react';
 import { SanitizedCollectionConfig } from '../../../../collections/config/types';
-export declare type DocumentDrawerProps = {
+export type DocumentDrawerProps = {
     collectionSlug: string;
     id?: string;
     onSave?: (json: {
@@ -11,7 +11,7 @@ export declare type DocumentDrawerProps = {
     customHeader?: React.ReactNode;
     drawerSlug?: string;
 };
-export declare type DocumentTogglerProps = HTMLAttributes<HTMLButtonElement> & {
+export type DocumentTogglerProps = HTMLAttributes<HTMLButtonElement> & {
     children?: React.ReactNode;
     className?: string;
     drawerSlug?: string;
@@ -19,7 +19,7 @@ export declare type DocumentTogglerProps = HTMLAttributes<HTMLButtonElement> & {
     collectionSlug: string;
     disabled?: boolean;
 };
-export declare type UseDocumentDrawer = (args: {
+export type UseDocumentDrawer = (args: {
     id?: string;
     collectionSlug: string;
 }) => [

package/dist/admin/components/elements/DocumentDrawer/types.js

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