@contentful/field-editor-reference 5.19.0 → 5.20.0

package/dist/cjs/resources/testHelpers/resourceEditorHelpers.js

@@ -9,11 +9,11 @@ function _export(target, all) {
     });
 }
 _export(exports, {
-    mockSdkForField: function() {
-        return mockSdkForField;
-    },
     createFakeEntryResource: function() {
         return createFakeEntryResource;
+    },
+    mockSdkForField: function() {
+        return mockSdkForField;
     }
 });
 function mockSdkForField(fieldDefinition, fieldValue) {
@@ -22,13 +22,17 @@ function mockSdkForField(fieldDefinition, fieldValue) {
             getValue: jest.fn(()=>fieldValue),
             setValue: jest.fn(()=>Promise.resolve(undefined)),
             removeValue: jest.fn(),
+            // eslint-disable-next-line -- test helper
             onSchemaErrorsChanged: ()=>{},
+            // eslint-disable-next-line -- test helper
             onIsDisabledChanged: ()=>{},
+            // eslint-disable-next-line -- test helper
             onValueChanged: ()=>{},
             ...fieldDefinition,
             locale: 'en'
         },
         dialogs: {
+            // @ts-expect-error wait app-sdk version update
             selectSingleResourceEntry: jest.fn().mockResolvedValue({
                 sys: {
                     type: 'Entry',
@@ -68,15 +72,18 @@ function mockSdkForField(fieldDefinition, fieldValue) {
             contentType: 'testCT'
         },
         space: {
+            // @ts-expect-error wait app-sdk version update
+            // eslint-disable-next-line -- test helper
             onEntityChanged: ()=>{}
         },
+        // @ts-expect-error
         navigator: {
             onSlideInNavigation: ()=>()=>({})
         }
     };
 }
-const createFakeEntryResource = ({ title , id , space  })=>{
-    const { id: spaceId , name: spaceName  } = space;
+const createFakeEntryResource = ({ title, id, space })=>{
+    const { id: spaceId, name: spaceName } = space;
     return {
         resource: {
             sys: {

package/dist/cjs/resources/useResourceLinkActions.js

@@ -29,7 +29,7 @@ const getUpdatedValue = (field, entries, apiUrl)=>{
         return toLinkItem(entries[0], apiUrl);
     }
 };
-function useResourceLinkActions({ dialogs , field , onAfterLink , apiUrl  }) {
+function useResourceLinkActions({ dialogs, field, onAfterLink, apiUrl }) {
     const handleAfterLink = (0, _react.useCallback)((entries)=>{
         if (!onAfterLink) {
             return;
@@ -51,10 +51,14 @@ function useResourceLinkActions({ dialogs , field , onAfterLink , apiUrl  }) {
     ]);
     const multiple = field.type === 'Array';
     const onLinkExisting = (0, _react.useMemo)(()=>{
-        const promptSelection = multiple ? async ()=>await dialogs.selectMultipleResourceEntries({
+        const promptSelection = multiple ? async ()=>// @ts-expect-error wait for update of app-sdk version
+            await dialogs.selectMultipleResourceEntries({
+                // @ts-expect-error wait for update of app-sdk version
                 allowedResources: field.allowedResources
             }) : async ()=>[
+                // @ts-expect-error wait for update of app-sdk version
                 await dialogs.selectSingleResourceEntry({
+                    // @ts-expect-error wait for update of app-sdk version
                     allowedResources: field.allowedResources
                 })
             ];
@@ -65,6 +69,7 @@ function useResourceLinkActions({ dialogs , field , onAfterLink , apiUrl  }) {
             }
             onLinkedExisting(res);
         };
+    // @ts-expect-error wait for update of app-sdk version
     }, [
         dialogs,
         field.allowedResources,
@@ -73,7 +78,9 @@ function useResourceLinkActions({ dialogs , field , onAfterLink , apiUrl  }) {
     ]);
     return {
         onLinkExisting,
+        // @ts-expect-error
         onLinkedExisting,
+        // hardcoded values to match interface for standard reference field actions
         entityType: 'Entry',
         contentTypes: [],
         canCreateEntity: false,
@@ -82,7 +89,9 @@ function useResourceLinkActions({ dialogs , field , onAfterLink , apiUrl  }) {
         isDisabled: false,
         isEmpty: false,
         isFull: false,
+        // eslint-disable-next-line -- hardcoded values to match interface for standard reference field actions
         onCreate: async ()=>{},
+        // eslint-disable-next-line -- hardcoded values to match interface for standard reference field actions
         onCreated: ()=>{}
     };
 }

package/dist/cjs/types.js

@@ -9,14 +9,14 @@ function _export(target, all) {
     });
 }
 _export(exports, {
+    Asset: function() {
+        return _fieldeditorshared.Asset;
+    },
     Entry: function() {
         return _fieldeditorshared.Entry;
     },
     File: function() {
         return _fieldeditorshared.File;
-    },
-    Asset: function() {
-        return _fieldeditorshared.Asset;
     }
 });
 const _fieldeditorshared = require("@contentful/field-editor-shared");

package/dist/cjs/utils/fromFieldValidations.js

@@ -8,13 +8,14 @@ Object.defineProperty(exports, "fromFieldValidations", {
         return fromFieldValidations;
     }
 });
-const _isNumber = _interop_require_default(require("lodash/isNumber"));
+const _isNumber = /*#__PURE__*/ _interop_require_default(require("lodash/isNumber"));
 function _interop_require_default(obj) {
     return obj && obj.__esModule ? obj : {
         default: obj
     };
 }
 function fromFieldValidations(field) {
+    // eslint-disable-next-line -- TODO: describe this disable  @typescript-eslint/no-explicit-any
     const validations = [
         ...field.validations,
         ...field.type === 'Array' ? field.items?.validations ?? [] : []

package/dist/cjs/utils/useSortIDs.js

@@ -8,7 +8,7 @@ Object.defineProperty(exports, "useSortIDs", {
         return useSortIDs;
     }
 });
-const _react = _interop_require_wildcard(require("react"));
+const _react = /*#__PURE__*/ _interop_require_wildcard(require("react"));
 const _sortable = require("@dnd-kit/sortable");
 function _getRequireWildcardCache(nodeInterop) {
     if (typeof WeakMap !== "function") return null;
@@ -31,7 +31,9 @@ function _interop_require_wildcard(obj, nodeInterop) {
     if (cache && cache.has(obj)) {
         return cache.get(obj);
     }
-    var newObj = {};
+    var newObj = {
+        __proto__: null
+    };
     var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
     for(var key in obj){
         if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
@@ -51,7 +53,7 @@ function _interop_require_wildcard(obj, nodeInterop) {
 }
 const useSortIDs = (items)=>{
     const ids = (items || []).map((item, index)=>{
-        const { type  } = item.sys;
+        const { type } = item.sys;
         return {
             id: type === 'ResourceLink' ? `${item.sys.urn}-${index}` : `${item.sys.id}-${index}`
         };
@@ -60,7 +62,7 @@ const useSortIDs = (items)=>{
     _react.default.useEffect(()=>{
         if (items.length !== sortIDs.length) {
             const ids = items.map((item, index)=>{
-                const { type  } = item.sys;
+                const { type } = item.sys;
                 return {
                     id: type === 'ResourceLink' ? `${item.sys.urn}-${index}` : `${item.sys.id}-${index}`
                 };

package/dist/esm/__fixtures__/FakeSdk.js

@@ -49,7 +49,7 @@ export function newReferenceEditorFakeSdk(props) {
         locales,
         cmaAdapter: createFakeCMAAdapter({
             Entry: {
-                get: async ({ entryId  })=>{
+                get: async ({ entryId })=>{
                     if (props?.fetchDelay) {
                         await delay(props.fetchDelay);
                     }
@@ -66,7 +66,7 @@ export function newReferenceEditorFakeSdk(props) {
                 }
             },
             Asset: {
-                get: async ({ assetId  })=>{
+                get: async ({ assetId })=>{
                     if (props?.fetchDelay) {
                         await delay(props.fetchDelay);
                     }
@@ -91,7 +91,7 @@ export function newReferenceEditorFakeSdk(props) {
                 }
             },
             ContentType: {
-                get: async ({ contentTypeId  })=>{
+                get: async ({ contentTypeId })=>{
                     if (contentTypeId === contentTypes.published.sys.id) {
                         return contentTypes.published;
                     }

package/dist/esm/assets/MultipleMediaEditor.js

@@ -12,16 +12,16 @@ const styles = {
     })
 };
 export function MultipleMediaEditor(props) {
-    return React.createElement(MultipleReferenceEditor, {
+    return /*#__PURE__*/ React.createElement(MultipleReferenceEditor, {
         ...props,
         entityType: "Asset"
-    }, (childrenProps)=>React.createElement(SortableLinkList, {
+    }, (childrenProps)=>/*#__PURE__*/ React.createElement(SortableLinkList, {
             ...childrenProps,
             sortingStrategy: childrenProps.viewType === 'card' ? rectSortingStrategy : verticalListSortingStrategy,
             className: cx({
                 [styles.gridContainer]: childrenProps.viewType === 'card'
             })
-        }, ({ items , item , index , isDisabled , DragHandle  })=>React.createElement(FetchingWrappedAssetCard, {
+        }, ({ items, item, index, isDisabled, DragHandle })=>/*#__PURE__*/ React.createElement(FetchingWrappedAssetCard, {
                 ...childrenProps,
                 isDisabled: isDisabled,
                 key: `${item.sys.id}-${index}`,

package/dist/esm/assets/SingleMediaEditor.js

@@ -2,10 +2,10 @@ import * as React from 'react';
 import { SingleReferenceEditor } from '../common/SingleReferenceEditor';
 import { FetchingWrappedAssetCard } from './WrappedAssetCard/FetchingWrappedAssetCard';
 export function SingleMediaEditor(props) {
-    return React.createElement(SingleReferenceEditor, {
+    return /*#__PURE__*/ React.createElement(SingleReferenceEditor, {
         ...props,
         entityType: "Asset"
-    }, ({ entityId , isDisabled , setValue  })=>React.createElement(FetchingWrappedAssetCard, {
+    }, ({ entityId, isDisabled, setValue })=>/*#__PURE__*/ React.createElement(FetchingWrappedAssetCard, {
             ...props,
             viewType: "big_card",
             assetId: entityId,

package/dist/esm/assets/WrappedAssetCard/AssetCardActions.js

@@ -42,42 +42,42 @@ function downloadAsset(url) {
     window.open(url, '_blank', 'noopener,noreferrer');
 }
 export function renderAssetInfo(props) {
-    const { entityFile  } = props;
+    const { entityFile } = props;
     const fileName = get(entityFile, 'fileName');
     const mimeType = get(entityFile, 'contentType');
     const fileSize = get(entityFile, 'details.size');
     const image = get(entityFile, 'details.image');
     return [
-        React.createElement(Menu.SectionTitle, {
+        /*#__PURE__*/ React.createElement(Menu.SectionTitle, {
             key: "file-section"
         }, "File info"),
-        React.createElement(Menu.Item, {
+        /*#__PURE__*/ React.createElement(Menu.Item, {
             key: "file-information",
             className: styles.fileInformation.menuItem,
             isDisabled: true
-        }, React.createElement("dl", {
+        }, /*#__PURE__*/ React.createElement("dl", {
             className: styles.fileInformation.dl
-        }, fileName && React.createElement(React.Fragment, null, React.createElement("dt", null, "File Name:"), React.createElement(Text, {
+        }, fileName && /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("dt", null, "File Name:"), /*#__PURE__*/ React.createElement(Text, {
             as: "dd",
             isTruncated: true
-        }, fileName)), mimeType && React.createElement(React.Fragment, null, React.createElement("dt", null, "File Type:"), React.createElement(Text, {
+        }, fileName)), mimeType && /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("dt", null, "File Type:"), /*#__PURE__*/ React.createElement(Text, {
             as: "dd",
             isTruncated: true
-        }, mimeType)), fileSize && React.createElement(React.Fragment, null, React.createElement("dt", null, "Size:"), React.createElement("dd", null, shortenStorageUnit(fileSize, 'B'))), image && React.createElement(React.Fragment, null, React.createElement("dt", null, "Dimensions:"), React.createElement("dd", null, `${image.width} × ${image.height}`))))
+        }, mimeType)), fileSize && /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("dt", null, "Size:"), /*#__PURE__*/ React.createElement("dd", null, shortenStorageUnit(fileSize, 'B'))), image && /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("dt", null, "Dimensions:"), /*#__PURE__*/ React.createElement("dd", null, `${image.width} × ${image.height}`))))
     ];
 }
 export function renderActions(props) {
-    const { entityFile , isDisabled , onEdit , onRemove  } = props;
+    const { entityFile, isDisabled, onEdit, onRemove } = props;
     return [
-        React.createElement(Menu.SectionTitle, {
+        /*#__PURE__*/ React.createElement(Menu.SectionTitle, {
             key: "section-title"
         }, "Actions"),
-        onEdit ? React.createElement(Menu.Item, {
+        onEdit ? /*#__PURE__*/ React.createElement(Menu.Item, {
             key: "edit",
             onClick: onEdit,
             testId: "card-action-edit"
         }, "Edit") : null,
-        entityFile ? React.createElement(Menu.Item, {
+        entityFile ? /*#__PURE__*/ React.createElement(Menu.Item, {
             key: "download",
             onClick: ()=>{
                 if (typeof entityFile.url === 'string') {
@@ -86,7 +86,7 @@ export function renderActions(props) {
             },
             testId: "card-action-download"
         }, "Download") : null,
-        onRemove ? React.createElement(Menu.Item, {
+        onRemove ? /*#__PURE__*/ React.createElement(Menu.Item, {
             key: "remove",
             disabled: isDisabled,
             onClick: onRemove,

package/dist/esm/assets/WrappedAssetCard/FetchingWrappedAssetCard.js

@@ -5,8 +5,8 @@ import { MissingEntityCard } from '../../components';
 import { WrappedAssetCard } from './WrappedAssetCard';
 import { WrappedAssetLink } from './WrappedAssetLink';
 export function FetchingWrappedAssetCard(props) {
-    const { data: asset , status  } = useEntity('Asset', props.assetId);
-    const { getEntityScheduledActions  } = useEntityLoader();
+    const { data: asset, status } = useEntity('Asset', props.assetId);
+    const { getEntityScheduledActions } = useEntityLoader();
     const loadEntityScheduledActions = React.useCallback(()=>getEntityScheduledActions('Asset', props.assetId), [
         getEntityScheduledActions,
         props.assetId
@@ -18,11 +18,12 @@ export function FetchingWrappedAssetCard(props) {
                 entity: 'Asset'
             });
         }
+    // eslint-disable-next-line react-hooks/exhaustive-deps -- TODO: Evaluate the dependencies
     }, [
         asset
     ]);
     const onEdit = async ()=>{
-        const { slide  } = await props.sdk.navigator.openAsset(props.assetId, {
+        const { slide } = await props.sdk.navigator.openAsset(props.assetId, {
             slideIn: true
         });
         props.onAction && props.onAction({
@@ -44,7 +45,7 @@ export function FetchingWrappedAssetCard(props) {
     };
     return React.useMemo(()=>{
         if (status === 'error') {
-            const card = React.createElement(MissingEntityCard, {
+            const card = /*#__PURE__*/ React.createElement(MissingEntityCard, {
                 entityType: "Asset",
                 asSquare: props.viewType !== 'link',
                 isDisabled: props.isDisabled,
@@ -61,7 +62,7 @@ export function FetchingWrappedAssetCard(props) {
             }
             return card;
         }
-        const { getEntityUrl  } = props;
+        const { getEntityUrl } = props;
         const size = props.viewType === 'big_card' ? 'default' : 'small';
         const commonProps = {
             asset,
@@ -76,24 +77,25 @@ export function FetchingWrappedAssetCard(props) {
         };
         if (props.viewType === 'link') {
             if (status === 'loading') {
-                return React.createElement(EntryCard, {
+                return /*#__PURE__*/ React.createElement(EntryCard, {
                     size: "small",
                     isLoading: true
                 });
             }
-            return React.createElement(WrappedAssetLink, {
+            return /*#__PURE__*/ React.createElement(WrappedAssetLink, {
                 ...commonProps,
                 href: commonProps.entityUrl,
                 getEntityScheduledActions: loadEntityScheduledActions
             });
         }
         if (status === 'loading') {
-            return React.createElement(AssetCard, {
+            return /*#__PURE__*/ React.createElement(AssetCard, {
                 size: size,
                 isLoading: true
             });
         }
         function renderDefaultCard(props) {
+            // isClickable has a default value, so omit it from the props
             const builtinCardProps = {
                 ...commonProps,
                 ...props,
@@ -101,19 +103,22 @@ export function FetchingWrappedAssetCard(props) {
                 asset: (props?.entity) || commonProps.asset,
                 getAssetUrl: getEntityUrl
             };
-            return React.createElement(WrappedAssetCard, builtinCardProps);
+            return /*#__PURE__*/ React.createElement(WrappedAssetCard, builtinCardProps);
         }
         if (props.renderCustomCard) {
             const customProps = {
                 ...commonProps,
                 entity: commonProps.asset
             };
+            // LinkActionsProps are injected higher SingleReferenceEditor/MultipleReferenceEditor
             const renderedCustomCard = props.renderCustomCard(customProps, {}, renderDefaultCard);
+            // Only `false` indicates to render the original card. E.g. `null` would result in no card.
             if (renderedCustomCard !== false) {
                 return renderedCustomCard;
             }
         }
         return renderDefaultCard();
+    // eslint-disable-next-line react-hooks/exhaustive-deps -- TODO: Evaluate the dependencies
     }, [
         props,
         status,

package/dist/esm/assets/WrappedAssetCard/WrappedAssetCard.js

@@ -3,6 +3,7 @@ import { AssetCard } from '@contentful/f36-components';
 import { ClockIcon } from '@contentful/f36-icons';
 import tokens from '@contentful/f36-tokens';
 import { entityHelpers } from '@contentful/field-editor-shared';
+// @ts-expect-error
 import mimetype from '@contentful/mimetype';
 import { css } from 'emotion';
 import { MissingEntityCard, ScheduledIconWithTooltip } from '../../components';
@@ -28,6 +29,7 @@ const styles = {
 const defaultProps = {
     isClickable: true
 };
+// eslint-disable-next-line -- TODO: describe this disable  @typescript-eslint/no-explicit-any
 function getFileType(file) {
     if (!file) {
         return 'archive';
@@ -39,10 +41,11 @@ function getFileType(file) {
     return groupToIconMap[groupName] || 'archive';
 }
 export const WrappedAssetCard = (props)=>{
-    const { className , onEdit , getAssetUrl , onRemove , size , isDisabled , isSelected , isClickable  } = props;
+    const { className, onEdit, getAssetUrl, onRemove, size, isDisabled, isSelected, isClickable } = props;
+    // @ts-expect-error
     const status = entityHelpers.getEntryStatus(props.asset.sys);
     if (status === 'deleted') {
-        return React.createElement(MissingEntityCard, {
+        return /*#__PURE__*/ React.createElement(MissingEntityCard, {
             entityType: "Asset",
             asSquare: true,
             isDisabled: props.isDisabled,
@@ -57,7 +60,7 @@ export const WrappedAssetCard = (props)=>{
     });
     const entityFile = props.asset.fields.file ? props.asset.fields.file[props.localeCode] || props.asset.fields.file[props.defaultLocaleCode] : undefined;
     const href = getAssetUrl ? getAssetUrl(props.asset.sys.id) : undefined;
-    return React.createElement(AssetCard, {
+    return /*#__PURE__*/ React.createElement(AssetCard, {
         as: href ? 'a' : 'article',
         type: getFileType(entityFile),
         title: entityTitle,
@@ -65,22 +68,27 @@ export const WrappedAssetCard = (props)=>{
         isSelected: isSelected,
         href: href,
         status: status,
-        icon: React.createElement(ScheduledIconWithTooltip, {
+        icon: /*#__PURE__*/ React.createElement(ScheduledIconWithTooltip, {
             getEntityScheduledActions: props.getEntityScheduledActions,
             entityType: "Asset",
             entityId: props.asset.sys.id
-        }, React.createElement(ClockIcon, {
+        }, /*#__PURE__*/ React.createElement(ClockIcon, {
             className: styles.scheduleIcon,
             size: "small",
             variant: "muted",
             testId: "schedule-icon"
         })),
         src: entityFile && entityFile.url ? size === 'small' ? `${entityFile.url}?w=150&h=150&fit=thumb` : `${entityFile.url}?h=300` : '',
-        onClick: isClickable ? (e)=>{
+        onClick: // Providing an onClick handler messes up with some rich text
+        // features e.g. pressing ENTER on a card to add a new paragraph
+        // underneath. It's crucial not to pass a custom handler when
+        // isClickable is disabled which in the case of RT it's.
+        isClickable ? (e)=>{
             e.preventDefault();
             onEdit && onEdit();
         } : undefined,
-        onKeyDown: isClickable ? (e)=>{
+        /* todo - remove this when onKeyDown is allowed as a prop for BaseCard in forma 36
+      // @ts-expect-error */ onKeyDown: isClickable ? (e)=>{
             if (e.key === 'Enter' && onEdit) {
                 e.preventDefault();
                 onEdit();

package/dist/esm/assets/WrappedAssetCard/WrappedAssetLink.js

@@ -12,10 +12,11 @@ const styles = {
     })
 };
 export const WrappedAssetLink = (props)=>{
-    const { className , href , onEdit , onRemove , isDisabled  } = props;
+    const { className, href, onEdit, onRemove, isDisabled } = props;
+    // @ts-expect-error
     const status = entityHelpers.getEntryStatus(props.asset.sys);
     if (status === 'deleted') {
-        return React.createElement(MissingEntityCard, {
+        return /*#__PURE__*/ React.createElement(MissingEntityCard, {
             entityType: "Asset",
             isDisabled: props.isDisabled,
             onRemove: props.onRemove
@@ -28,7 +29,7 @@ export const WrappedAssetLink = (props)=>{
         defaultTitle: 'Untitled'
     });
     const entityFile = props.asset.fields.file ? props.asset.fields.file[props.localeCode] || props.asset.fields.file[props.defaultLocaleCode] : undefined;
-    return React.createElement(EntryCard, {
+    return /*#__PURE__*/ React.createElement(EntryCard, {
         as: href ? 'a' : 'article',
         contentType: "Asset",
         title: entityTitle,
@@ -36,14 +37,14 @@ export const WrappedAssetLink = (props)=>{
         href: href,
         size: "small",
         status: status,
-        thumbnailElement: entityFile && isValidImage(entityFile) ? React.createElement(AssetThumbnail, {
+        thumbnailElement: entityFile && isValidImage(entityFile) ? /*#__PURE__*/ React.createElement(AssetThumbnail, {
             file: entityFile
         }) : undefined,
-        icon: React.createElement(ScheduledIconWithTooltip, {
+        icon: /*#__PURE__*/ React.createElement(ScheduledIconWithTooltip, {
             getEntityScheduledActions: props.getEntityScheduledActions,
             entityType: "Asset",
             entityId: props.asset.sys.id
-        }, React.createElement(ClockIcon, {
+        }, /*#__PURE__*/ React.createElement(ClockIcon, {
             className: styles.scheduleIcon,
             size: "small",
             variant: "muted",