payload 1.4.2 → 1.5.1

package/dist/admin/components/forms/field-types/Relationship/GetFilterOptions/index.js

@@ -1,26 +1,32 @@
-import { useEffect } from 'react';
-import equal from 'deep-equal';
-import { useAuth } from '../../../../utilities/Auth';
-import { useDocumentInfo } from '../../../../utilities/DocumentInfo';
-import { useAllFormFields } from '../../../Form/context';
-import { getFilterOptionsQuery } from '../../getFilterOptionsQuery';
-import reduceFieldsToValues from '../../../Form/reduceFieldsToValues';
-import getSiblingData from '../../../Form/getSiblingData';
-export const GetFilterOptions = ({ filterOptions, filterOptionsResult, setFilterOptionsResult, relationTo, path, }) => {
-    const [fields] = useAllFormFields();
-    const { id } = useDocumentInfo();
-    const { user } = useAuth();
-    useEffect(() => {
-        const data = reduceFieldsToValues(fields, true);
-        const siblingData = getSiblingData(fields, path);
-        const newFilterOptionsResult = getFilterOptionsQuery(filterOptions, {
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.GetFilterOptions = void 0;
+const react_1 = require("react");
+const deep_equal_1 = __importDefault(require("deep-equal"));
+const Auth_1 = require("../../../../utilities/Auth");
+const DocumentInfo_1 = require("../../../../utilities/DocumentInfo");
+const context_1 = require("../../../Form/context");
+const getFilterOptionsQuery_1 = require("../../getFilterOptionsQuery");
+const reduceFieldsToValues_1 = __importDefault(require("../../../Form/reduceFieldsToValues"));
+const getSiblingData_1 = __importDefault(require("../../../Form/getSiblingData"));
+const GetFilterOptions = ({ filterOptions, filterOptionsResult, setFilterOptionsResult, relationTo, path, }) => {
+    const [fields] = (0, context_1.useAllFormFields)();
+    const { id } = (0, DocumentInfo_1.useDocumentInfo)();
+    const { user } = (0, Auth_1.useAuth)();
+    (0, react_1.useEffect)(() => {
+        const data = (0, reduceFieldsToValues_1.default)(fields, true);
+        const siblingData = (0, getSiblingData_1.default)(fields, path);
+        const newFilterOptionsResult = (0, getFilterOptionsQuery_1.getFilterOptionsQuery)(filterOptions, {
             id,
             data,
             relationTo,
             siblingData,
             user,
         });
-        if (!equal(newFilterOptionsResult, filterOptionsResult)) {
+        if (!(0, deep_equal_1.default)(newFilterOptionsResult, filterOptionsResult)) {
             setFilterOptionsResult(newFilterOptionsResult);
         }
     }, [
@@ -35,3 +41,4 @@ export const GetFilterOptions = ({ filterOptions, filterOptionsResult, setFilter
     ]);
     return null;
 };
+exports.GetFilterOptions = GetFilterOptions;

package/dist/admin/components/forms/field-types/Relationship/createRelationMap.d.ts

@@ -1,7 +1,7 @@
-declare type RelationMap = {
+type RelationMap = {
     [relation: string]: unknown[];
 };
-declare type CreateRelationMap = (args: {
+type CreateRelationMap = (args: {
     hasMany: boolean;
     relationTo: string | string[];
     value: unknown;

package/dist/admin/components/forms/field-types/Relationship/createRelationMap.js

@@ -1,4 +1,7 @@
-export const createRelationMap = ({ hasMany, relationTo, value, }) => {
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.createRelationMap = void 0;
+const createRelationMap = ({ hasMany, relationTo, value, }) => {
     const hasMultipleRelations = Array.isArray(relationTo);
     let relationMap;
     if (Array.isArray(relationTo)) {
@@ -33,3 +36,4 @@ export const createRelationMap = ({ hasMany, relationTo, value, }) => {
     }
     return relationMap;
 };
+exports.createRelationMap = createRelationMap;

package/dist/admin/components/forms/field-types/Relationship/findOptionsByValue.d.ts

@@ -1,6 +1,6 @@
 import { Option } from '../../../elements/ReactSelect/types';
 import { OptionGroup, Value } from './types';
-declare type Args = {
+type Args = {
     value: Value | Value[];
     options: OptionGroup[];
 };

package/dist/admin/components/forms/field-types/Relationship/findOptionsByValue.js

@@ -1,4 +1,7 @@
-export const findOptionsByValue = ({ value, options }) => {
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.findOptionsByValue = void 0;
+const findOptionsByValue = ({ value, options }) => {
     if (value) {
         if (Array.isArray(value)) {
             return value.map((val) => {
@@ -31,3 +34,4 @@ export const findOptionsByValue = ({ value, options }) => {
     }
     return undefined;
 };
+exports.findOptionsByValue = findOptionsByValue;

package/dist/admin/components/forms/field-types/Relationship/index.js

@@ -1,56 +1,84 @@
-import React, { useCallback, useEffect, useState, useReducer, useRef, } from 'react';
-import qs from 'qs';
-import { useTranslation } from 'react-i18next';
-import { useConfig } from '../../../utilities/Config';
-import { useAuth } from '../../../utilities/Auth';
-import withCondition from '../../withCondition';
-import ReactSelect from '../../../elements/ReactSelect';
-import useField from '../../useField';
-import Label from '../../Label';
-import Error from '../../Error';
-import FieldDescription from '../../FieldDescription';
-import { relationship } from '../../../../../fields/validations';
-import { useFormProcessing } from '../../Form/context';
-import optionsReducer from './optionsReducer';
-import { createRelationMap } from './createRelationMap';
-import { useDebouncedCallback } from '../../../../hooks/useDebouncedCallback';
-import wordBoundariesRegex from '../../../../../utilities/wordBoundariesRegex';
-import { AddNewRelation } from './AddNew';
-import { findOptionsByValue } from './findOptionsByValue';
-import { GetFilterOptions } from './GetFilterOptions';
-import { SingleValue } from './select-components/SingleValue';
-import { MultiValueLabel } from './select-components/MultiValueLabel';
-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 qs_1 = __importDefault(require("qs"));
+const react_i18next_1 = require("react-i18next");
+const Config_1 = require("../../../utilities/Config");
+const Auth_1 = require("../../../utilities/Auth");
+const withCondition_1 = __importDefault(require("../../withCondition"));
+const ReactSelect_1 = __importDefault(require("../../../elements/ReactSelect"));
+const useField_1 = __importDefault(require("../../useField"));
+const Label_1 = __importDefault(require("../../Label"));
+const Error_1 = __importDefault(require("../../Error"));
+const FieldDescription_1 = __importDefault(require("../../FieldDescription"));
+const validations_1 = require("../../../../../fields/validations");
+const context_1 = require("../../Form/context");
+const optionsReducer_1 = __importDefault(require("./optionsReducer"));
+const createRelationMap_1 = require("./createRelationMap");
+const useDebouncedCallback_1 = require("../../../../hooks/useDebouncedCallback");
+const wordBoundariesRegex_1 = __importDefault(require("../../../../../utilities/wordBoundariesRegex"));
+const AddNew_1 = require("./AddNew");
+const findOptionsByValue_1 = require("./findOptionsByValue");
+const GetFilterOptions_1 = require("./GetFilterOptions");
+const SingleValue_1 = require("./select-components/SingleValue");
+const MultiValueLabel_1 = require("./select-components/MultiValueLabel");
+require("./index.scss");
 const maxResultsPerRequest = 10;
 const baseClass = 'relationship';
 const Relationship = (props) => {
-    const { relationTo, validate = relationship, path, name, required, label, hasMany, filterOptions, admin: { readOnly, style, className, width, description, condition, isSortable = true, } = {}, } = props;
-    const { serverURL, routes: { api, }, collections, } = useConfig();
-    const { t, i18n } = useTranslation('fields');
-    const { permissions } = useAuth();
-    const formProcessing = useFormProcessing();
+    const { relationTo, validate = validations_1.relationship, path, name, required, label, hasMany, filterOptions, admin: { readOnly, style, className, width, description, condition, isSortable = true, } = {}, } = props;
+    const { serverURL, routes: { api, }, collections, } = (0, Config_1.useConfig)();
+    const { t, i18n } = (0, react_i18next_1.useTranslation)('fields');
+    const { permissions } = (0, Auth_1.useAuth)();
+    const formProcessing = (0, context_1.useFormProcessing)();
     const hasMultipleRelations = Array.isArray(relationTo);
-    const [options, dispatchOptions] = useReducer(optionsReducer, []);
-    const [lastFullyLoadedRelation, setLastFullyLoadedRelation] = useState(-1);
-    const [lastLoadedPage, setLastLoadedPage] = useState(1);
-    const [errorLoading, setErrorLoading] = useState('');
-    const [filterOptionsResult, setFilterOptionsResult] = useState();
-    const [search, setSearch] = useState('');
-    const [isLoading, setIsLoading] = useState(false);
-    const [hasLoadedFirstPage, setHasLoadedFirstPage] = useState(false);
-    const [enableWordBoundarySearch, setEnableWordBoundarySearch] = useState(false);
-    const firstRun = useRef(true);
+    const [options, dispatchOptions] = (0, react_1.useReducer)(optionsReducer_1.default, []);
+    const [lastFullyLoadedRelation, setLastFullyLoadedRelation] = (0, react_1.useState)(-1);
+    const [lastLoadedPage, setLastLoadedPage] = (0, react_1.useState)(1);
+    const [errorLoading, setErrorLoading] = (0, react_1.useState)('');
+    const [filterOptionsResult, setFilterOptionsResult] = (0, react_1.useState)();
+    const [search, setSearch] = (0, react_1.useState)('');
+    const [isLoading, setIsLoading] = (0, react_1.useState)(false);
+    const [hasLoadedFirstPage, setHasLoadedFirstPage] = (0, react_1.useState)(false);
+    const [enableWordBoundarySearch, setEnableWordBoundarySearch] = (0, react_1.useState)(false);
+    const firstRun = (0, react_1.useRef)(true);
     const pathOrName = path || name;
-    const memoizedValidate = useCallback((value, validationOptions) => {
+    const memoizedValidate = (0, react_1.useCallback)((value, validationOptions) => {
         return validate(value, { ...validationOptions, required });
     }, [validate, required]);
-    const { value, showError, errorMessage, setValue, initialValue, } = useField({
+    const { value, showError, errorMessage, setValue, initialValue, } = (0, useField_1.default)({
         path: pathOrName,
         validate: memoizedValidate,
         condition,
     });
-    const [drawerIsOpen, setDrawerIsOpen] = useState(false);
-    const getResults = useCallback(async ({ lastFullyLoadedRelation: lastFullyLoadedRelationArg, lastLoadedPage: lastLoadedPageArg, search: searchArg, value: valueArg, sort, onSuccess, }) => {
+    const [drawerIsOpen, setDrawerIsOpen] = (0, react_1.useState)(false);
+    const getResults = (0, react_1.useCallback)(async ({ lastFullyLoadedRelation: lastFullyLoadedRelationArg, lastLoadedPage: lastLoadedPageArg, search: searchArg, value: valueArg, sort, onSuccess, }) => {
         if (!permissions) {
             return;
         }
@@ -59,7 +87,7 @@ const Relationship = (props) => {
         const relations = Array.isArray(relationTo) ? relationTo : [relationTo];
         const relationsToFetch = lastFullyLoadedRelationToUse === -1 ? relations : relations.slice(lastFullyLoadedRelationToUse + 1);
         let resultsFetched = 0;
-        const relationMap = createRelationMap({ hasMany, relationTo, value: valueArg });
+        const relationMap = (0, createRelationMap_1.createRelationMap)({ hasMany, relationTo, value: valueArg });
         if (!errorLoading) {
             relationsToFetch.reduce(async (priorRelation, relation) => {
                 var _a;
@@ -93,7 +121,7 @@ const Relationship = (props) => {
                     if (filterOptionsResult === null || filterOptionsResult === void 0 ? void 0 : filterOptionsResult[relation]) {
                         query.where.and.push(filterOptionsResult[relation]);
                     }
-                    const response = await fetch(`${serverURL}${api}/${relation}?${qs.stringify(query)}`, {
+                    const response = await fetch(`${serverURL}${api}/${relation}?${qs_1.default.stringify(query)}`, {
                         credentials: 'include',
                         headers: {
                             'Accept-Language': i18n.language,
@@ -140,11 +168,11 @@ const Relationship = (props) => {
         t,
         i18n,
     ]);
-    const updateSearch = useDebouncedCallback((searchArg, valueArg) => {
+    const updateSearch = (0, useDebouncedCallback_1.useDebouncedCallback)((searchArg, valueArg) => {
         getResults({ search: searchArg, value: valueArg, sort: true });
         setSearch(searchArg);
     }, [getResults]);
-    const handleInputChange = useCallback((searchArg, valueArg) => {
+    const handleInputChange = (0, react_1.useCallback)((searchArg, valueArg) => {
         if (search !== searchArg) {
             updateSearch(searchArg, valueArg);
         }
@@ -152,8 +180,8 @@ const Relationship = (props) => {
     // ///////////////////////////////////
     // Ensure we have an option for each value
     // ///////////////////////////////////
-    useEffect(() => {
-        const relationMap = createRelationMap({
+    (0, react_1.useEffect)(() => {
+        const relationMap = (0, createRelationMap_1.createRelationMap)({
             hasMany,
             relationTo,
             value,
@@ -175,7 +203,7 @@ const Relationship = (props) => {
                     limit: idsToLoad.length,
                 };
                 if (!errorLoading) {
-                    const response = await fetch(`${serverURL}${api}/${relation}?${qs.stringify(query)}`, {
+                    const response = await fetch(`${serverURL}${api}/${relation}?${qs_1.default.stringify(query)}`, {
                         credentials: 'include',
                         headers: {
                             'Accept-Language': i18n.language,
@@ -205,7 +233,7 @@ const Relationship = (props) => {
         relationTo,
     ]);
     // Determine if we should switch to word boundary search
-    useEffect(() => {
+    (0, react_1.useEffect)(() => {
         const relations = Array.isArray(relationTo) ? relationTo : [relationTo];
         const isIdOnly = relations.reduce((idOnly, relation) => {
             var _a;
@@ -217,7 +245,7 @@ const Relationship = (props) => {
     }, [relationTo, collections]);
     // When relationTo or filterOptionsResult changes, reset component
     // Note - effect should not run on first run
-    useEffect(() => {
+    (0, react_1.useEffect)(() => {
         if (firstRun.current) {
             firstRun.current = false;
             return;
@@ -227,7 +255,7 @@ const Relationship = (props) => {
         setLastLoadedPage(1);
         setHasLoadedFirstPage(false);
     }, [relationTo, filterOptionsResult]);
-    const onSave = useCallback((args) => {
+    const onSave = (0, react_1.useCallback)((args) => {
         dispatchOptions({ type: 'UPDATE', doc: args.doc, collection: args.collectionConfig, i18n });
     }, [i18n]);
     const classes = [
@@ -238,18 +266,18 @@ const Relationship = (props) => {
         errorLoading && 'error-loading',
         readOnly && `${baseClass}--read-only`,
     ].filter(Boolean).join(' ');
-    const valueToRender = findOptionsByValue({ value, options });
+    const valueToRender = (0, findOptionsByValue_1.findOptionsByValue)({ value, options });
     if (!Array.isArray(valueToRender) && (valueToRender === null || valueToRender === void 0 ? void 0 : valueToRender.value) === 'null')
         valueToRender.value = null;
-    return (React.createElement("div", { id: `field-${(pathOrName).replace(/\./gi, '__')}`, className: classes, style: {
+    return (react_1.default.createElement("div", { id: `field-${(pathOrName).replace(/\./gi, '__')}`, className: classes, style: {
             ...style,
             width,
         } },
-        React.createElement(Error, { showError: showError, message: errorMessage }),
-        React.createElement(Label, { htmlFor: pathOrName, label: label, required: required }),
-        React.createElement(GetFilterOptions, { ...{ filterOptionsResult, setFilterOptionsResult, filterOptions, path: pathOrName, relationTo } }),
-        !errorLoading && (React.createElement("div", { className: `${baseClass}__wrap` },
-            React.createElement(ReactSelect, { isDisabled: readOnly, onInputChange: (newSearch) => handleInputChange(newSearch, value), onChange: !readOnly ? (selected) => {
+        react_1.default.createElement(Error_1.default, { showError: showError, message: errorMessage }),
+        react_1.default.createElement(Label_1.default, { htmlFor: pathOrName, label: label, required: required }),
+        react_1.default.createElement(GetFilterOptions_1.GetFilterOptions, { ...{ filterOptionsResult, setFilterOptionsResult, filterOptions, path: pathOrName, relationTo } }),
+        !errorLoading && (react_1.default.createElement("div", { className: `${baseClass}__wrap` },
+            react_1.default.createElement(ReactSelect_1.default, { isDisabled: readOnly, onInputChange: (newSearch) => handleInputChange(newSearch, value), onChange: !readOnly ? (selected) => {
                     if (selected === null) {
                         setValue(hasMany ? [] : null);
                     }
@@ -282,8 +310,8 @@ const Relationship = (props) => {
                         sort: false,
                     });
                 }, value: valueToRender, showError: showError, disabled: formProcessing, options: options, isMulti: hasMany, isSortable: isSortable, isLoading: isLoading, components: {
-                    SingleValue,
-                    MultiValueLabel,
+                    SingleValue: SingleValue_1.SingleValue,
+                    MultiValueLabel: MultiValueLabel_1.MultiValueLabel,
                 }, selectProps: {
                     disableMouseDown: drawerIsOpen,
                     disableKeyDown: drawerIsOpen,
@@ -301,11 +329,11 @@ const Relationship = (props) => {
                         });
                     }
                 }, filterOption: enableWordBoundarySearch ? (item, searchFilter) => {
-                    const r = wordBoundariesRegex(searchFilter || '');
+                    const r = (0, wordBoundariesRegex_1.default)(searchFilter || '');
                     return r.test(item.label);
                 } : undefined }),
-            !readOnly && (React.createElement(AddNewRelation, { ...{ path: pathOrName, hasMany, relationTo, value, setValue, dispatchOptions } })))),
-        errorLoading && (React.createElement("div", { className: `${baseClass}__error-loading` }, errorLoading)),
-        React.createElement(FieldDescription, { value: value, description: description })));
+            !readOnly && (react_1.default.createElement(AddNew_1.AddNewRelation, { ...{ path: pathOrName, hasMany, relationTo, value, setValue, dispatchOptions } })))),
+        errorLoading && (react_1.default.createElement("div", { className: `${baseClass}__error-loading` }, errorLoading)),
+        react_1.default.createElement(FieldDescription_1.default, { value: value, description: description })));
 };
-export default withCondition(Relationship);
+exports.default = (0, withCondition_1.default)(Relationship);

package/dist/admin/components/forms/field-types/Relationship/optionsReducer.js

@@ -1,4 +1,6 @@
-import { getTranslation } from '../../../../../utilities/getTranslation';
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const getTranslation_1 = require("../../../../../utilities/getTranslation");
 const reduceToIDs = (options) => options.reduce((ids, option) => {
     if (option.options) {
         return [
@@ -76,7 +78,7 @@ const optionsReducer = (state, action) => {
             }
             else {
                 newOptions.push({
-                    label: getTranslation(collection.labels.plural, i18n),
+                    label: (0, getTranslation_1.getTranslation)(collection.labels.plural, i18n),
                     options: sort ? sortOptions(newSubOptions) : newSubOptions,
                 });
             }
@@ -87,4 +89,4 @@ const optionsReducer = (state, action) => {
         }
     }
 };
-export default optionsReducer;
+exports.default = optionsReducer;

package/dist/admin/components/forms/field-types/Relationship/select-components/MultiValueLabel/index.js

@@ -1,36 +1,66 @@
-import React, { Fragment, useEffect, useState } from 'react';
-import { useTranslation } from 'react-i18next';
-import { components } from 'react-select';
-import { useDocumentDrawer } from '../../../../../elements/DocumentDrawer';
-import Tooltip from '../../../../../elements/Tooltip';
-import Edit from '../../../../../icons/Edit';
-import { useAuth } from '../../../../../utilities/Auth';
-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 });
+exports.MultiValueLabel = void 0;
+const react_1 = __importStar(require("react"));
+const react_i18next_1 = require("react-i18next");
+const react_select_1 = require("react-select");
+const DocumentDrawer_1 = require("../../../../../elements/DocumentDrawer");
+const Tooltip_1 = __importDefault(require("../../../../../elements/Tooltip"));
+const Edit_1 = __importDefault(require("../../../../../icons/Edit"));
+const Auth_1 = require("../../../../../utilities/Auth");
+require("./index.scss");
 const baseClass = 'relationship--multi-value-label';
-export const MultiValueLabel = (props) => {
+const MultiValueLabel = (props) => {
     var _a, _b, _c;
     const { data: { value, relationTo, label, }, selectProps: { setDrawerIsOpen, draggableProps, onSave, }, } = props;
-    const { permissions } = useAuth();
-    const [showTooltip, setShowTooltip] = useState(false);
-    const { t } = useTranslation('general');
+    const { permissions } = (0, Auth_1.useAuth)();
+    const [showTooltip, setShowTooltip] = (0, react_1.useState)(false);
+    const { t } = (0, react_i18next_1.useTranslation)('general');
     const hasReadPermission = Boolean((_c = (_b = (_a = permissions === null || permissions === void 0 ? void 0 : permissions.collections) === null || _a === void 0 ? void 0 : _a[relationTo]) === null || _b === void 0 ? void 0 : _b.read) === null || _c === void 0 ? void 0 : _c.permission);
-    const [DocumentDrawer, DocumentDrawerToggler, { isDrawerOpen }] = useDocumentDrawer({
+    const [DocumentDrawer, DocumentDrawerToggler, { isDrawerOpen }] = (0, DocumentDrawer_1.useDocumentDrawer)({
         id: value === null || value === void 0 ? void 0 : value.toString(),
         collectionSlug: relationTo,
     });
-    useEffect(() => {
+    (0, react_1.useEffect)(() => {
         if (typeof setDrawerIsOpen === 'function')
             setDrawerIsOpen(isDrawerOpen);
     }, [isDrawerOpen, setDrawerIsOpen]);
-    return (React.createElement("div", { className: baseClass },
-        React.createElement("div", { className: `${baseClass}__content` },
-            React.createElement(components.MultiValueLabel, { ...props, innerProps: {
+    return (react_1.default.createElement("div", { className: baseClass },
+        react_1.default.createElement("div", { className: `${baseClass}__content` },
+            react_1.default.createElement(react_select_1.components.MultiValueLabel, { ...props, innerProps: {
                     className: `${baseClass}__text`,
                     ...draggableProps || {},
                 } })),
-        relationTo && hasReadPermission && (React.createElement(Fragment, null,
-            React.createElement(DocumentDrawerToggler, { className: `${baseClass}__drawer-toggler`, "aria-label": `Edit ${label}`, onMouseEnter: () => setShowTooltip(true), onMouseLeave: () => setShowTooltip(false), onClick: () => setShowTooltip(false) },
-                React.createElement(Tooltip, { className: `${baseClass}__tooltip`, show: showTooltip }, t('editLabel', { label: '' })),
-                React.createElement(Edit, null)),
-            React.createElement(DocumentDrawer, { onSave: onSave })))));
+        relationTo && hasReadPermission && (react_1.default.createElement(react_1.Fragment, null,
+            react_1.default.createElement(DocumentDrawerToggler, { className: `${baseClass}__drawer-toggler`, "aria-label": `Edit ${label}`, onMouseEnter: () => setShowTooltip(true), onMouseLeave: () => setShowTooltip(false), onClick: () => setShowTooltip(false) },
+                react_1.default.createElement(Tooltip_1.default, { className: `${baseClass}__tooltip`, show: showTooltip }, t('editLabel', { label: '' })),
+                react_1.default.createElement(Edit_1.default, null)),
+            react_1.default.createElement(DocumentDrawer, { onSave: onSave })))));
 };
+exports.MultiValueLabel = MultiValueLabel;

package/dist/admin/components/forms/field-types/Relationship/select-components/SingleValue/index.js

@@ -1,34 +1,64 @@
-import React, { Fragment, useEffect, useState } from 'react';
-import { useTranslation } from 'react-i18next';
-import { components as SelectComponents } from 'react-select';
-import { useDocumentDrawer } from '../../../../../elements/DocumentDrawer';
-import Tooltip from '../../../../../elements/Tooltip';
-import Edit from '../../../../../icons/Edit';
-import { useAuth } from '../../../../../utilities/Auth';
-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 });
+exports.SingleValue = void 0;
+const react_1 = __importStar(require("react"));
+const react_i18next_1 = require("react-i18next");
+const react_select_1 = require("react-select");
+const DocumentDrawer_1 = require("../../../../../elements/DocumentDrawer");
+const Tooltip_1 = __importDefault(require("../../../../../elements/Tooltip"));
+const Edit_1 = __importDefault(require("../../../../../icons/Edit"));
+const Auth_1 = require("../../../../../utilities/Auth");
+require("./index.scss");
 const baseClass = 'relationship--single-value';
-export const SingleValue = (props) => {
+const SingleValue = (props) => {
     var _a, _b, _c;
     const { data: { value, relationTo, label, }, children, selectProps: { selectProps: { setDrawerIsOpen, onSave, }, }, } = props;
-    const [showTooltip, setShowTooltip] = useState(false);
-    const { t } = useTranslation('general');
-    const { permissions } = useAuth();
+    const [showTooltip, setShowTooltip] = (0, react_1.useState)(false);
+    const { t } = (0, react_i18next_1.useTranslation)('general');
+    const { permissions } = (0, Auth_1.useAuth)();
     const hasReadPermission = Boolean((_c = (_b = (_a = permissions === null || permissions === void 0 ? void 0 : permissions.collections) === null || _a === void 0 ? void 0 : _a[relationTo]) === null || _b === void 0 ? void 0 : _b.read) === null || _c === void 0 ? void 0 : _c.permission);
-    const [DocumentDrawer, DocumentDrawerToggler, { isDrawerOpen }] = useDocumentDrawer({
+    const [DocumentDrawer, DocumentDrawerToggler, { isDrawerOpen }] = (0, DocumentDrawer_1.useDocumentDrawer)({
         id: value.toString(),
         collectionSlug: relationTo,
     });
-    useEffect(() => {
+    (0, react_1.useEffect)(() => {
         if (typeof setDrawerIsOpen === 'function')
             setDrawerIsOpen(isDrawerOpen);
     }, [isDrawerOpen, setDrawerIsOpen]);
-    return (React.createElement("div", { className: baseClass },
-        React.createElement("div", { className: `${baseClass}__label` },
-            React.createElement(SelectComponents.SingleValue, { ...props },
-                React.createElement("div", { className: `${baseClass}__text` }, children),
-                relationTo && hasReadPermission && (React.createElement(Fragment, null,
-                    React.createElement(DocumentDrawerToggler, { className: `${baseClass}__drawer-toggler`, "aria-label": t('editLabel', { label }), onMouseDown: (e) => e.stopPropagation(), onMouseEnter: () => setShowTooltip(true), onMouseLeave: () => setShowTooltip(false), onClick: () => setShowTooltip(false) },
-                        React.createElement(Tooltip, { className: `${baseClass}__tooltip`, show: showTooltip }, t('edit')),
-                        React.createElement(Edit, null)))))),
-        relationTo && hasReadPermission && (React.createElement(DocumentDrawer, { onSave: onSave }))));
+    return (react_1.default.createElement("div", { className: baseClass },
+        react_1.default.createElement("div", { className: `${baseClass}__label` },
+            react_1.default.createElement(react_select_1.components.SingleValue, { ...props },
+                react_1.default.createElement("div", { className: `${baseClass}__text` }, children),
+                relationTo && hasReadPermission && (react_1.default.createElement(react_1.Fragment, null,
+                    react_1.default.createElement(DocumentDrawerToggler, { className: `${baseClass}__drawer-toggler`, "aria-label": t('editLabel', { label }), onMouseDown: (e) => e.stopPropagation(), onMouseEnter: () => setShowTooltip(true), onMouseLeave: () => setShowTooltip(false), onClick: () => setShowTooltip(false) },
+                        react_1.default.createElement(Tooltip_1.default, { className: `${baseClass}__tooltip`, show: showTooltip }, t('edit')),
+                        react_1.default.createElement(Edit_1.default, null)))))),
+        relationTo && hasReadPermission && (react_1.default.createElement(DocumentDrawer, { onSave: onSave }))));
 };
+exports.SingleValue = SingleValue;