@contentful/field-editor-reference 6.16.1 → 6.17.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -71,16 +71,23 @@ const styles = {
71
71
  }),
72
72
  inputWrapper: (0, _emotion.css)({
73
73
  position: 'relative',
74
- padding: `0 ${_f36tokens.default.spacing2Xs}`
74
+ padding: `${_f36tokens.default.spacing2Xs} ${_f36tokens.default.spacingXs}`
75
+ }),
76
+ title: (0, _emotion.css)({
77
+ paddingTop: _f36tokens.default.spacing2Xs,
78
+ fontWeight: _f36tokens.default.fontWeightMedium
75
79
  }),
76
80
  searchInput: (0, _emotion.css)({
77
81
  paddingRight: _f36tokens.default.spacingXl,
78
- textOverflow: 'ellipsis'
82
+ textOverflow: 'ellipsis',
83
+ minHeight: '32px',
84
+ maxHeight: '32px'
79
85
  }),
80
86
  searchIcon: (0, _emotion.css)({
81
87
  position: 'absolute',
82
88
  right: _f36tokens.default.spacingM,
83
- top: _f36tokens.default.spacingS,
89
+ top: '50%',
90
+ transform: 'translateY(-50%)',
84
91
  zIndex: Number(_f36tokens.default.zIndexDefault),
85
92
  fill: _f36tokens.default.gray600
86
93
  }),
@@ -89,10 +96,11 @@ const styles = {
89
96
  margin: '10px 0'
90
97
  }),
91
98
  dropdownList: (0, _emotion.css)({
99
+ minWidth: '230px',
92
100
  borderColor: _f36tokens.default.gray200
93
101
  })
94
102
  };
95
- const CreateEntryMenuTrigger = ({ contentTypes, suggestedContentTypeId, contentTypesLabel, onSelect, testId, dropdownSettings = {
103
+ const CreateEntryMenuTrigger = ({ contentTypes, suggestedContentTypeId, contentTypesLabel, title, onSelect, testId, dropdownSettings = {
96
104
  position: 'bottom-left'
97
105
  }, customDropdownItems, children, menuProps, filterExperienceTypes = true })=>{
98
106
  const [isOpen, setOpen] = (0, _react.useState)(false);
@@ -181,18 +189,21 @@ const CreateEntryMenuTrigger = ({ contentTypes, suggestedContentTypeId, contentT
181
189
  },
182
190
  ref: menuListRef,
183
191
  testId: "add-entry-menu"
184
- }, Boolean(customDropdownItems) && /*#__PURE__*/ _react.default.createElement(_react.default.Fragment, null, customDropdownItems, /*#__PURE__*/ _react.default.createElement(_f36components.Menu.Divider, null)), isSearchable && /*#__PURE__*/ _react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/ _react.default.createElement("div", {
192
+ }, 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, {
193
+ className: styles.title
194
+ }, title), isSearchable && /*#__PURE__*/ _react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/ _react.default.createElement("div", {
185
195
  ref: textField,
186
196
  className: styles.inputWrapper
187
197
  }, /*#__PURE__*/ _react.default.createElement(_f36components.TextInput, {
188
198
  className: styles.searchInput,
189
- placeholder: "Search all content types",
199
+ placeholder: "Search content type",
190
200
  testId: "add-entry-menu-search",
191
201
  value: searchInput,
192
202
  onChange: (e)=>setSearchInput(e.target.value)
193
203
  }), /*#__PURE__*/ _react.default.createElement(_f36icons.MagnifyingGlassIcon, {
204
+ size: "small",
194
205
  className: styles.searchIcon
195
- })), /*#__PURE__*/ _react.default.createElement(_f36components.Menu.Divider, null)), 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, {
206
+ }))), 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, {
196
207
  testId: "suggested",
197
208
  onClick: ()=>handleSelect(suggestedContentType)
198
209
  }, (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, {
@@ -15,16 +15,23 @@ const styles = {
15
15
  }),
16
16
  inputWrapper: css({
17
17
  position: 'relative',
18
- padding: `0 ${tokens.spacing2Xs}`
18
+ padding: `${tokens.spacing2Xs} ${tokens.spacingXs}`
19
+ }),
20
+ title: css({
21
+ paddingTop: tokens.spacing2Xs,
22
+ fontWeight: tokens.fontWeightMedium
19
23
  }),
20
24
  searchInput: css({
21
25
  paddingRight: tokens.spacingXl,
22
- textOverflow: 'ellipsis'
26
+ textOverflow: 'ellipsis',
27
+ minHeight: '32px',
28
+ maxHeight: '32px'
23
29
  }),
24
30
  searchIcon: css({
25
31
  position: 'absolute',
26
32
  right: tokens.spacingM,
27
- top: tokens.spacingS,
33
+ top: '50%',
34
+ transform: 'translateY(-50%)',
28
35
  zIndex: Number(tokens.zIndexDefault),
29
36
  fill: tokens.gray600
30
37
  }),
@@ -33,10 +40,11 @@ const styles = {
33
40
  margin: '10px 0'
34
41
  }),
35
42
  dropdownList: css({
43
+ minWidth: '230px',
36
44
  borderColor: tokens.gray200
37
45
  })
38
46
  };
39
- export const CreateEntryMenuTrigger = ({ contentTypes, suggestedContentTypeId, contentTypesLabel, onSelect, testId, dropdownSettings = {
47
+ export const CreateEntryMenuTrigger = ({ contentTypes, suggestedContentTypeId, contentTypesLabel, title, onSelect, testId, dropdownSettings = {
40
48
  position: 'bottom-left'
41
49
  }, customDropdownItems, children, menuProps, filterExperienceTypes = true })=>{
42
50
  const [isOpen, setOpen] = useState(false);
@@ -125,18 +133,21 @@ export const CreateEntryMenuTrigger = ({ contentTypes, suggestedContentTypeId, c
125
133
  },
126
134
  ref: menuListRef,
127
135
  testId: "add-entry-menu"
128
- }, Boolean(customDropdownItems) && /*#__PURE__*/ React.createElement(React.Fragment, null, customDropdownItems, /*#__PURE__*/ React.createElement(Menu.Divider, null)), isSearchable && /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("div", {
136
+ }, Boolean(customDropdownItems) && /*#__PURE__*/ React.createElement(React.Fragment, null, customDropdownItems, /*#__PURE__*/ React.createElement(Menu.Divider, null)), title && /*#__PURE__*/ React.createElement(Menu.SectionTitle, {
137
+ className: styles.title
138
+ }, title), isSearchable && /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("div", {
129
139
  ref: textField,
130
140
  className: styles.inputWrapper
131
141
  }, /*#__PURE__*/ React.createElement(TextInput, {
132
142
  className: styles.searchInput,
133
- placeholder: "Search all content types",
143
+ placeholder: "Search content type",
134
144
  testId: "add-entry-menu-search",
135
145
  value: searchInput,
136
146
  onChange: (e)=>setSearchInput(e.target.value)
137
147
  }), /*#__PURE__*/ React.createElement(MagnifyingGlassIcon, {
148
+ size: "small",
138
149
  className: styles.searchIcon
139
- })), /*#__PURE__*/ React.createElement(Menu.Divider, null)), 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, {
150
+ }))), 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, {
140
151
  testId: "suggested",
141
152
  onClick: ()=>handleSelect(suggestedContentType)
142
153
  }, 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, {
@@ -6,13 +6,14 @@ type CreateEntryMenuTriggerChildProps = {
6
6
  isSelecting: boolean;
7
7
  };
8
8
  export type CreateEntryMenuTriggerChild = (props: CreateEntryMenuTriggerChildProps) => React.ReactElement;
9
- export type CreateCustomEntryMenuItems = ({ closeMenu }: {
9
+ export type CreateCustomEntryMenuItems = ({ closeMenu, }: {
10
10
  closeMenu: Function;
11
11
  }) => React.ReactElement;
12
12
  interface CreateEntryMenuTrigger {
13
13
  contentTypes: ContentType[];
14
14
  suggestedContentTypeId?: string;
15
15
  contentTypesLabel?: string;
16
+ title?: string;
16
17
  onSelect: (contentTypeId: string) => Promise<unknown>;
17
18
  testId?: string;
18
19
  dropdownSettings?: {
@@ -25,7 +26,7 @@ interface CreateEntryMenuTrigger {
25
26
  filterExperienceTypes?: boolean;
26
27
  }
27
28
  export declare const CreateEntryMenuTrigger: {
28
- ({ contentTypes, suggestedContentTypeId, contentTypesLabel, onSelect, testId, dropdownSettings, customDropdownItems, children, menuProps, filterExperienceTypes }: CreateEntryMenuTrigger): React.JSX.Element;
29
+ ({ contentTypes, suggestedContentTypeId, contentTypesLabel, title, onSelect, testId, dropdownSettings, customDropdownItems, children, menuProps, filterExperienceTypes, }: CreateEntryMenuTrigger): React.JSX.Element;
29
30
  defaultProps: {
30
31
  testId: string;
31
32
  contentTypesLabel: string;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@contentful/field-editor-reference",
3
- "version": "6.16.1",
3
+ "version": "6.17.0",
4
4
  "main": "dist/cjs/index.js",
5
5
  "module": "dist/esm/index.js",
6
6
  "types": "dist/types/index.d.ts",
@@ -68,5 +68,5 @@
68
68
  "publishConfig": {
69
69
  "registry": "https://npm.pkg.github.com/"
70
70
  },
71
- "gitHead": "8eb283ee95c049cf760a110ebeafd769c5e30391"
71
+ "gitHead": "fdd4f24a3d228412061a01660a1281813535b4eb"
72
72
  }