@contentful/field-editor-reference 6.16.2 → 6.18.0

package/dist/cjs/components/CreateEntryLinkButton/CreateEntryMenuTrigger.js

@@ -12,6 +12,7 @@ const _react = /*#__PURE__*/ _interop_require_wildcard(require("react"));
 const _f36components = require("@contentful/f36-components");
 const _f36icons = require("@contentful/f36-icons");
 const _f36tokens = /*#__PURE__*/ _interop_require_default(require("@contentful/f36-tokens"));
+const _core = require("@lingui/core");
 const _emotion = require("emotion");
 const _get = /*#__PURE__*/ _interop_require_default(require("lodash/get"));
 function _interop_require_default(obj) {
@@ -96,10 +97,14 @@ const styles = {
         margin: '10px 0'
     }),
     dropdownList: (0, _emotion.css)({
+        minWidth: '230px',
         borderColor: _f36tokens.default.gray200
     })
 };
-const CreateEntryMenuTrigger = ({ contentTypes, suggestedContentTypeId, contentTypesLabel, title, onSelect, testId, dropdownSettings = {
+const CreateEntryMenuTrigger = ({ contentTypes, suggestedContentTypeId, contentTypesLabel = _core.i18n._({
+    id: "FieldEditors.Reference.CreateEntryMenuTrigger.AllContentTypesLabel",
+    message: "All Content Types"
+}), title, onSelect, testId = 'create-entry-button-menu-trigger', dropdownSettings = {
     position: 'bottom-left'
 }, customDropdownItems, children, menuProps, filterExperienceTypes = true })=>{
     const [isOpen, setOpen] = (0, _react.useState)(false);
@@ -160,12 +165,21 @@ const CreateEntryMenuTrigger = ({ contentTypes, suggestedContentTypeId, contentT
         isOpen
     ]);
     const renderSearchResultsCount = (resultsLength)=>resultsLength ? /*#__PURE__*/ _react.default.createElement(_f36components.Menu.SectionTitle, {
-            testId: "add-entru-menu-search-results"
-        }, resultsLength, " result", resultsLength > 1 ? 's' : '') : null;
+            testId: "add-entry-menu-search-results"
+        }, _core.i18n._({
+            id: "FieldEditors.Reference.CreateEntryMenuTrigger.SearchContentTypeResultsLabel",
+            message: "{resultsLength, plural, one {# result} other {# results}}",
+            values: {
+                resultsLength: resultsLength
+            }
+        })) : null;
     const isSearchable = filteredContentTypes.length > MAX_ITEMS_WITHOUT_SEARCH;
     const maxDropdownHeight = suggestedContentTypeId ? 300 : 250;
     const suggestedContentType = filteredContentTypes.find((ct)=>ct.sys.id === suggestedContentTypeId);
-    const searchFilteredContentTypes = filteredContentTypes.filter((ct)=>!searchInput || (0, _get.default)(ct, 'name', 'Untitled').toLowerCase().includes(searchInput.toLowerCase()));
+    const searchFilteredContentTypes = filteredContentTypes.filter((ct)=>!searchInput || (0, _get.default)(ct, 'name', _core.i18n._({
+            id: "FieldEditors.Reference.CreateEntryMenuTrigger.SearchContentTypeFallbackLabel",
+            message: "Untitled"
+        })).toLowerCase().includes(searchInput.toLowerCase()));
     return /*#__PURE__*/ _react.default.createElement("span", {
         className: styles.wrapper,
         ref: wrapper,
@@ -183,38 +197,45 @@ const CreateEntryMenuTrigger = ({ contentTypes, suggestedContentTypeId, contentT
     })), isOpen && /*#__PURE__*/ _react.default.createElement(_f36components.Menu.List, {
         className: styles.dropdownList,
         style: {
-            width: dropdownWidth != undefined ? `${dropdownWidth}px` : undefined,
+            width: dropdownWidth !== undefined ? `${dropdownWidth}px` : undefined,
             maxHeight: `${maxDropdownHeight}px`
         },
         ref: menuListRef,
         testId: "add-entry-menu"
     }, Boolean(customDropdownItems) && /*#__PURE__*/ _react.default.createElement(_react.default.Fragment, null, customDropdownItems, /*#__PURE__*/ _react.default.createElement(_f36components.Menu.Divider, null)), title && /*#__PURE__*/ _react.default.createElement(_f36components.Menu.SectionTitle, {
         className: styles.title
-    }, title), isSearchable && /*#__PURE__*/ _react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/ _react.default.createElement("div", {
+    }, title), isSearchable && /*#__PURE__*/ _react.default.createElement("div", {
         ref: textField,
         className: styles.inputWrapper
     }, /*#__PURE__*/ _react.default.createElement(_f36components.TextInput, {
         className: styles.searchInput,
-        placeholder: "Search content type",
+        placeholder: _core.i18n._({
+            id: "FieldEditors.Reference.CreateEntryMenuTrigger.SearchContentTypePlaceholder",
+            message: "Search content type"
+        }),
         testId: "add-entry-menu-search",
         value: searchInput,
         onChange: (e)=>setSearchInput(e.target.value)
     }), /*#__PURE__*/ _react.default.createElement(_f36icons.MagnifyingGlassIcon, {
         size: "small",
         className: styles.searchIcon
-    }))), searchInput && renderSearchResultsCount(searchFilteredContentTypes.length), suggestedContentType && !searchInput && /*#__PURE__*/ _react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/ _react.default.createElement(_f36components.Menu.SectionTitle, null, "Suggested Content Type"), /*#__PURE__*/ _react.default.createElement(_f36components.Menu.Item, {
+    })), searchInput && renderSearchResultsCount(searchFilteredContentTypes.length), suggestedContentType && !searchInput && /*#__PURE__*/ _react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/ _react.default.createElement(_f36components.Menu.SectionTitle, null, _core.i18n._({
+        id: "FieldEditors.Reference.CreateEntryMenuTrigger.SuggestedContentTypeLabel",
+        message: "Suggested Content Type"
+    })), /*#__PURE__*/ _react.default.createElement(_f36components.Menu.Item, {
         testId: "suggested",
         onClick: ()=>handleSelect(suggestedContentType)
     }, (0, _get.default)(suggestedContentType, 'name')), /*#__PURE__*/ _react.default.createElement(_f36components.Menu.Divider, null)), !searchInput && /*#__PURE__*/ _react.default.createElement(_f36components.Menu.SectionTitle, null, contentTypesLabel), searchFilteredContentTypes.length ? searchFilteredContentTypes.map((contentType, i)=>/*#__PURE__*/ _react.default.createElement(_f36components.Menu.Item, {
             testId: "contentType",
             key: `${(0, _get.default)(contentType, 'name')}-${i}`,
             onClick: ()=>handleSelect(contentType)
-        }, (0, _get.default)(contentType, 'name', 'Untitled'))) : /*#__PURE__*/ _react.default.createElement(_f36components.Menu.Item, {
-        testId: "add-entru-menu-search-results"
-    }, "No results found"))));
-};
-CreateEntryMenuTrigger.defaultProps = {
-    testId: 'create-entry-button-menu-trigger',
-    contentTypesLabel: 'All Content Types',
-    filterExperienceTypes: true
+        }, (0, _get.default)(contentType, 'name', _core.i18n._({
+            id: "FieldEditors.Reference.CreateEntryMenuTrigger.ContentTypeFallbackLabel",
+            message: "Untitled"
+        })))) : /*#__PURE__*/ _react.default.createElement(_f36components.Menu.Item, {
+        testId: "add-entry-menu-search-results"
+    }, _core.i18n._({
+        id: "FieldEditors.Reference.CreateEntryMenuTrigger.NoResultsLabel",
+        message: "No results found"
+    })))));
 };

package/dist/cjs/components/CreateEntryLinkButton/CreateEntryMenuTrigger.spec.js

@@ -179,7 +179,7 @@ describe('CreateEntryMenuTrigger general', ()=>{
             preventDefault: _noop.default
         });
         expect(getAllByTestId('contentType')).toHaveLength(10);
-        expect(getByTestId('add-entru-menu-search-results').textContent).toBe('10 results');
+        expect(getByTestId('add-entry-menu-search-results').textContent).toBe('10 results');
         _react1.fireEvent.change(input, {
             target: {
                 value: '3'
@@ -187,14 +187,14 @@ describe('CreateEntryMenuTrigger general', ()=>{
             preventDefault: _noop.default
         });
         expect(getAllByTestId('contentType')).toHaveLength(1);
-        expect(getByTestId('add-entru-menu-search-results').textContent).toBe('1 result');
+        expect(getByTestId('add-entry-menu-search-results').textContent).toBe('1 result');
         _react1.fireEvent.change(input, {
             target: {
                 value: '4'
             },
             preventDefault: _noop.default
         });
-        expect(getByTestId('add-entru-menu-search-results').textContent).toBe('No results found');
+        expect(getByTestId('add-entry-menu-search-results').textContent).toBe('No results found');
     });
     it('shows suggestedContentType in the list', ()=>{
         const { getByTestId } = (0, _react1.render)(/*#__PURE__*/ _react.createElement(_CreateEntryMenuTrigger.CreateEntryMenuTrigger, {

package/dist/esm/components/CreateEntryLinkButton/CreateEntryMenuTrigger.js

@@ -2,6 +2,7 @@ import React, { useState, useRef, useEffect, useMemo } from 'react';
 import { TextInput, Menu } from '@contentful/f36-components';
 import { MagnifyingGlassIcon } from '@contentful/f36-icons';
 import tokens from '@contentful/f36-tokens';
+import { i18n as $_i18n } from "@lingui/core";
 import { css } from 'emotion';
 import get from 'lodash/get';
 const MAX_ITEMS_WITHOUT_SEARCH = 5;
@@ -40,10 +41,14 @@ const styles = {
         margin: '10px 0'
     }),
     dropdownList: css({
+        minWidth: '230px',
         borderColor: tokens.gray200
     })
 };
-export const CreateEntryMenuTrigger = ({ contentTypes, suggestedContentTypeId, contentTypesLabel, title, onSelect, testId, dropdownSettings = {
+export const CreateEntryMenuTrigger = ({ contentTypes, suggestedContentTypeId, contentTypesLabel = $_i18n._({
+    id: "FieldEditors.Reference.CreateEntryMenuTrigger.AllContentTypesLabel",
+    message: "All Content Types"
+}), title, onSelect, testId = 'create-entry-button-menu-trigger', dropdownSettings = {
     position: 'bottom-left'
 }, customDropdownItems, children, menuProps, filterExperienceTypes = true })=>{
     const [isOpen, setOpen] = useState(false);
@@ -104,12 +109,21 @@ export const CreateEntryMenuTrigger = ({ contentTypes, suggestedContentTypeId, c
         isOpen
     ]);
     const renderSearchResultsCount = (resultsLength)=>resultsLength ? /*#__PURE__*/ React.createElement(Menu.SectionTitle, {
-            testId: "add-entru-menu-search-results"
-        }, resultsLength, " result", resultsLength > 1 ? 's' : '') : null;
+            testId: "add-entry-menu-search-results"
+        }, $_i18n._({
+            id: "FieldEditors.Reference.CreateEntryMenuTrigger.SearchContentTypeResultsLabel",
+            message: "{resultsLength, plural, one {# result} other {# results}}",
+            values: {
+                resultsLength: resultsLength
+            }
+        })) : null;
     const isSearchable = filteredContentTypes.length > MAX_ITEMS_WITHOUT_SEARCH;
     const maxDropdownHeight = suggestedContentTypeId ? 300 : 250;
     const suggestedContentType = filteredContentTypes.find((ct)=>ct.sys.id === suggestedContentTypeId);
-    const searchFilteredContentTypes = filteredContentTypes.filter((ct)=>!searchInput || get(ct, 'name', 'Untitled').toLowerCase().includes(searchInput.toLowerCase()));
+    const searchFilteredContentTypes = filteredContentTypes.filter((ct)=>!searchInput || get(ct, 'name', $_i18n._({
+            id: "FieldEditors.Reference.CreateEntryMenuTrigger.SearchContentTypeFallbackLabel",
+            message: "Untitled"
+        })).toLowerCase().includes(searchInput.toLowerCase()));
     return /*#__PURE__*/ React.createElement("span", {
         className: styles.wrapper,
         ref: wrapper,
@@ -127,38 +141,45 @@ export const CreateEntryMenuTrigger = ({ contentTypes, suggestedContentTypeId, c
     })), isOpen && /*#__PURE__*/ React.createElement(Menu.List, {
         className: styles.dropdownList,
         style: {
-            width: dropdownWidth != undefined ? `${dropdownWidth}px` : undefined,
+            width: dropdownWidth !== undefined ? `${dropdownWidth}px` : undefined,
             maxHeight: `${maxDropdownHeight}px`
         },
         ref: menuListRef,
         testId: "add-entry-menu"
     }, Boolean(customDropdownItems) && /*#__PURE__*/ React.createElement(React.Fragment, null, customDropdownItems, /*#__PURE__*/ React.createElement(Menu.Divider, null)), title && /*#__PURE__*/ React.createElement(Menu.SectionTitle, {
         className: styles.title
-    }, title), isSearchable && /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("div", {
+    }, title), isSearchable && /*#__PURE__*/ React.createElement("div", {
         ref: textField,
         className: styles.inputWrapper
     }, /*#__PURE__*/ React.createElement(TextInput, {
         className: styles.searchInput,
-        placeholder: "Search content type",
+        placeholder: $_i18n._({
+            id: "FieldEditors.Reference.CreateEntryMenuTrigger.SearchContentTypePlaceholder",
+            message: "Search content type"
+        }),
         testId: "add-entry-menu-search",
         value: searchInput,
         onChange: (e)=>setSearchInput(e.target.value)
     }), /*#__PURE__*/ React.createElement(MagnifyingGlassIcon, {
         size: "small",
         className: styles.searchIcon
-    }))), searchInput && renderSearchResultsCount(searchFilteredContentTypes.length), suggestedContentType && !searchInput && /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement(Menu.SectionTitle, null, "Suggested Content Type"), /*#__PURE__*/ React.createElement(Menu.Item, {
+    })), searchInput && renderSearchResultsCount(searchFilteredContentTypes.length), suggestedContentType && !searchInput && /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement(Menu.SectionTitle, null, $_i18n._({
+        id: "FieldEditors.Reference.CreateEntryMenuTrigger.SuggestedContentTypeLabel",
+        message: "Suggested Content Type"
+    })), /*#__PURE__*/ React.createElement(Menu.Item, {
         testId: "suggested",
         onClick: ()=>handleSelect(suggestedContentType)
     }, get(suggestedContentType, 'name')), /*#__PURE__*/ React.createElement(Menu.Divider, null)), !searchInput && /*#__PURE__*/ React.createElement(Menu.SectionTitle, null, contentTypesLabel), searchFilteredContentTypes.length ? searchFilteredContentTypes.map((contentType, i)=>/*#__PURE__*/ React.createElement(Menu.Item, {
             testId: "contentType",
             key: `${get(contentType, 'name')}-${i}`,
             onClick: ()=>handleSelect(contentType)
-        }, get(contentType, 'name', 'Untitled'))) : /*#__PURE__*/ React.createElement(Menu.Item, {
-        testId: "add-entru-menu-search-results"
-    }, "No results found"))));
-};
-CreateEntryMenuTrigger.defaultProps = {
-    testId: 'create-entry-button-menu-trigger',
-    contentTypesLabel: 'All Content Types',
-    filterExperienceTypes: true
+        }, get(contentType, 'name', $_i18n._({
+            id: "FieldEditors.Reference.CreateEntryMenuTrigger.ContentTypeFallbackLabel",
+            message: "Untitled"
+        })))) : /*#__PURE__*/ React.createElement(Menu.Item, {
+        testId: "add-entry-menu-search-results"
+    }, $_i18n._({
+        id: "FieldEditors.Reference.CreateEntryMenuTrigger.NoResultsLabel",
+        message: "No results found"
+    })))));
 };

package/dist/esm/components/CreateEntryLinkButton/CreateEntryMenuTrigger.spec.js

@@ -129,7 +129,7 @@ describe('CreateEntryMenuTrigger general', ()=>{
             preventDefault: noop
         });
         expect(getAllByTestId('contentType')).toHaveLength(10);
-        expect(getByTestId('add-entru-menu-search-results').textContent).toBe('10 results');
+        expect(getByTestId('add-entry-menu-search-results').textContent).toBe('10 results');
         fireEvent.change(input, {
             target: {
                 value: '3'
@@ -137,14 +137,14 @@ describe('CreateEntryMenuTrigger general', ()=>{
             preventDefault: noop
         });
         expect(getAllByTestId('contentType')).toHaveLength(1);
-        expect(getByTestId('add-entru-menu-search-results').textContent).toBe('1 result');
+        expect(getByTestId('add-entry-menu-search-results').textContent).toBe('1 result');
         fireEvent.change(input, {
             target: {
                 value: '4'
             },
             preventDefault: noop
         });
-        expect(getByTestId('add-entru-menu-search-results').textContent).toBe('No results found');
+        expect(getByTestId('add-entry-menu-search-results').textContent).toBe('No results found');
     });
     it('shows suggestedContentType in the list', ()=>{
         const { getByTestId } = render(/*#__PURE__*/ React.createElement(CreateEntryMenuTrigger, {

package/dist/types/components/CreateEntryLinkButton/CreateEntryMenuTrigger.d.ts

@@ -1,13 +1,13 @@
 import React from 'react';
-import { MenuProps } from '@contentful/f36-components';
-import { ContentType } from '../../types';
+import { type MenuProps } from '@contentful/f36-components';
+import type { ContentType } from '../../types';
 type CreateEntryMenuTriggerChildProps = {
     isOpen: boolean;
     isSelecting: boolean;
 };
 export type CreateEntryMenuTriggerChild = (props: CreateEntryMenuTriggerChildProps) => React.ReactElement;
 export type CreateCustomEntryMenuItems = ({ closeMenu, }: {
-    closeMenu: Function;
+    closeMenu: () => void;
 }) => React.ReactElement;
 interface CreateEntryMenuTrigger {
     contentTypes: ContentType[];
@@ -25,12 +25,5 @@ interface CreateEntryMenuTrigger {
     menuProps?: Omit<MenuProps, 'children'>;
     filterExperienceTypes?: boolean;
 }
-export declare const CreateEntryMenuTrigger: {
-    ({ contentTypes, suggestedContentTypeId, contentTypesLabel, title, onSelect, testId, dropdownSettings, customDropdownItems, children, menuProps, filterExperienceTypes, }: CreateEntryMenuTrigger): React.JSX.Element;
-    defaultProps: {
-        testId: string;
-        contentTypesLabel: string;
-        filterExperienceTypes: boolean;
-    };
-};
+export declare const CreateEntryMenuTrigger: ({ contentTypes, suggestedContentTypeId, contentTypesLabel, title, onSelect, testId, dropdownSettings, customDropdownItems, children, menuProps, filterExperienceTypes, }: CreateEntryMenuTrigger) => React.JSX.Element;
 export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@contentful/field-editor-reference",
-  "version": "6.16.2",
+  "version": "6.18.0",
   "main": "dist/cjs/index.js",
   "module": "dist/esm/index.js",
   "types": "dist/types/index.d.ts",
@@ -68,5 +68,5 @@
   "publishConfig": {
     "registry": "https://npm.pkg.github.com/"
   },
-  "gitHead": "c5b21141d6963ac4afe1a596c379d63668466afe"
+  "gitHead": "b25d0af70c82c9e29505335ce636f2e32e6cb927"
 }