@contentful/field-editor-rich-text 3.12.1 → 3.12.3

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.
Files changed (6) hide show
  1. package/dist/cjs/plugins/CommandPalette/components/CommandList.js +8 -4
  2. package/dist/cjs/plugins/CommandPalette/useCommands.js +9 -7
  3. package/dist/esm/plugins/CommandPalette/components/CommandList.js +8 -4
  4. package/dist/esm/plugins/CommandPalette/useCommands.js +9 -7
  5. package/dist/types/plugins/CommandPalette/useCommands.d.ts +1 -0
  6. package/package.json +5 -5
package/dist/cjs/plugins/CommandPalette/components/CommandList.js CHANGED
@@ -101,10 +101,13 @@ const Asset = ({ command , selectedItem })=>_react.createElement("button", {
101
101
  height: "30",
102
102
  className: _CommandListstyles.default.thumbnail
103
103
  }), _react.createElement("span", null, command.label)));
104
- const Item = ({ command })=>_react.createElement("button", {
104
+ const Item = ({ command , selectedItem })=>_react.createElement("button", {
105
105
  key: command.id,
106
106
  id: command.id,
107
- className: _CommandListstyles.default.menuItem
107
+ className: (0, _emotion.cx)(_CommandListstyles.default.menuItem, {
108
+ [_CommandListstyles.default.menuItemSelected]: command.id === selectedItem
109
+ }),
110
+ onClick: command.callback
108
111
  }, command.label);
109
112
  const CommandListItems = ({ commandItems , selectedItem })=>{
110
113
  return _react.createElement(_react.Fragment, null, commandItems.map((command)=>{
@@ -112,13 +115,14 @@ const CommandListItems = ({ commandItems , selectedItem })=>{
112
115
  key: command.group,
113
116
  commandGroup: command,
114
117
  selectedItem: selectedItem
115
- }) : command.callback ? _react.createElement(Asset, {
118
+ }) : command.asset ? _react.createElement(Asset, {
116
119
  key: command.id,
117
120
  command: command,
118
121
  selectedItem: selectedItem
119
122
  }) : _react.createElement(Item, {
120
123
  key: command.id,
121
- command: command
124
+ command: command,
125
+ selectedItem: selectedItem
122
126
  });
123
127
  }));
124
128
  };
package/dist/cjs/plugins/CommandPalette/useCommands.js CHANGED
@@ -88,12 +88,13 @@ const useCommands = (sdk, query, editor)=>{
88
88
  const contentTypes = sdk.space.getCachedContentTypes();
89
89
  const { inlineAllowed , entriesAllowed , assetsAllowed } = getCommandPermissions(sdk, editor);
90
90
  const allowedContentTypesFromValidation = getAllowedContentTypesFromValidation(sdk.field.validations);
91
- const filteredBlockContentTypes = contentTypes.filter((contentType)=>allowedContentTypesFromValidation[_richtexttypes.BLOCKS.EMBEDDED_ENTRY]?.[contentType.sys.id]);
92
- const filteredInlineContentTypes = contentTypes.filter((contentType)=>allowedContentTypesFromValidation[_richtexttypes.INLINES.EMBEDDED_ENTRY]?.[contentType.sys.id]);
93
- const isBlockContentTypeFiltered = filteredBlockContentTypes.length > 0;
94
- const isInlineContentTypeFiltered = filteredInlineContentTypes.length > 0;
95
- const blockContentTypesToUse = isBlockContentTypeFiltered ? filteredBlockContentTypes : contentTypes;
96
- const inlineContentTypesToUse = isInlineContentTypeFiltered ? filteredInlineContentTypes : contentTypes;
91
+ const filterContentTypesByValidation = (type)=>contentTypes.filter((contentType)=>allowedContentTypesFromValidation[type]?.[contentType.sys.id]);
92
+ const filteredBlockContentTypes = filterContentTypesByValidation(_richtexttypes.BLOCKS.EMBEDDED_ENTRY);
93
+ const filteredInlineContentTypes = filterContentTypesByValidation(_richtexttypes.INLINES.EMBEDDED_ENTRY);
94
+ const getContentTypeToUse = (allowed, isFiltered, filteredTypes)=>allowed ? isFiltered ? filteredTypes : contentTypes : [];
95
+ const blockContentTypesToUse = getContentTypeToUse(entriesAllowed, filteredBlockContentTypes.length > 0, filteredBlockContentTypes);
96
+ const inlineContentTypesToUse = getContentTypeToUse(inlineAllowed, filteredInlineContentTypes.length > 0, filteredInlineContentTypes);
97
+ const relevantContentTypes = contentTypes.filter((ct)=>blockContentTypesToUse.includes(ct) || inlineContentTypesToUse.includes(ct));
97
98
  const [commands, setCommands] = (0, _react.useState)(()=>{
98
99
  const getEmbedEntry = (contentType)=>{
99
100
  return {
@@ -168,7 +169,7 @@ const useCommands = (sdk, query, editor)=>{
168
169
  }
169
170
  };
170
171
  };
171
- const contentTypeCommands = entriesAllowed || inlineAllowed ? contentTypes.map((contentType)=>{
172
+ const contentTypeCommands = entriesAllowed || inlineAllowed ? relevantContentTypes.map((contentType)=>{
172
173
  const blockEmbedAllowed = blockContentTypesToUse.some((ct)=>ct.sys.id === contentType.sys.id);
173
174
  const inlineEmbedAllowed = inlineContentTypesToUse.some((ct)=>ct.sys.id === contentType.sys.id);
174
175
  const commands = [];
@@ -206,6 +207,7 @@ const useCommands = (sdk, query, editor)=>{
206
207
  id: asset.entity.sys.id,
207
208
  label: asset.displayTitle,
208
209
  thumbnail: asset.thumbnail,
210
+ asset: true,
209
211
  callback: ()=>{
210
212
  removeCommand(editor);
211
213
  if (editor.selection) {
package/dist/esm/plugins/CommandPalette/components/CommandList.js CHANGED
@@ -47,10 +47,13 @@ const Asset = ({ command , selectedItem })=>React.createElement("button", {
47
47
  height: "30",
48
48
  className: styles.thumbnail
49
49
  }), React.createElement("span", null, command.label)));
50
- const Item = ({ command })=>React.createElement("button", {
50
+ const Item = ({ command , selectedItem })=>React.createElement("button", {
51
51
  key: command.id,
52
52
  id: command.id,
53
- className: styles.menuItem
53
+ className: cx(styles.menuItem, {
54
+ [styles.menuItemSelected]: command.id === selectedItem
55
+ }),
56
+ onClick: command.callback
54
57
  }, command.label);
55
58
  const CommandListItems = ({ commandItems , selectedItem })=>{
56
59
  return React.createElement(React.Fragment, null, commandItems.map((command)=>{
@@ -58,13 +61,14 @@ const CommandListItems = ({ commandItems , selectedItem })=>{
58
61
  key: command.group,
59
62
  commandGroup: command,
60
63
  selectedItem: selectedItem
61
- }) : command.callback ? React.createElement(Asset, {
64
+ }) : command.asset ? React.createElement(Asset, {
62
65
  key: command.id,
63
66
  command: command,
64
67
  selectedItem: selectedItem
65
68
  }) : React.createElement(Item, {
66
69
  key: command.id,
67
- command: command
70
+ command: command,
71
+ selectedItem: selectedItem
68
72
  });
69
73
  }));
70
74
  };
package/dist/esm/plugins/CommandPalette/useCommands.js CHANGED
@@ -70,12 +70,13 @@ export const useCommands = (sdk, query, editor)=>{
70
70
  const contentTypes = sdk.space.getCachedContentTypes();
71
71
  const { inlineAllowed , entriesAllowed , assetsAllowed } = getCommandPermissions(sdk, editor);
72
72
  const allowedContentTypesFromValidation = getAllowedContentTypesFromValidation(sdk.field.validations);
73
- const filteredBlockContentTypes = contentTypes.filter((contentType)=>allowedContentTypesFromValidation[BLOCKS.EMBEDDED_ENTRY]?.[contentType.sys.id]);
74
- const filteredInlineContentTypes = contentTypes.filter((contentType)=>allowedContentTypesFromValidation[INLINES.EMBEDDED_ENTRY]?.[contentType.sys.id]);
75
- const isBlockContentTypeFiltered = filteredBlockContentTypes.length > 0;
76
- const isInlineContentTypeFiltered = filteredInlineContentTypes.length > 0;
77
- const blockContentTypesToUse = isBlockContentTypeFiltered ? filteredBlockContentTypes : contentTypes;
78
- const inlineContentTypesToUse = isInlineContentTypeFiltered ? filteredInlineContentTypes : contentTypes;
73
+ const filterContentTypesByValidation = (type)=>contentTypes.filter((contentType)=>allowedContentTypesFromValidation[type]?.[contentType.sys.id]);
74
+ const filteredBlockContentTypes = filterContentTypesByValidation(BLOCKS.EMBEDDED_ENTRY);
75
+ const filteredInlineContentTypes = filterContentTypesByValidation(INLINES.EMBEDDED_ENTRY);
76
+ const getContentTypeToUse = (allowed, isFiltered, filteredTypes)=>allowed ? isFiltered ? filteredTypes : contentTypes : [];
77
+ const blockContentTypesToUse = getContentTypeToUse(entriesAllowed, filteredBlockContentTypes.length > 0, filteredBlockContentTypes);
78
+ const inlineContentTypesToUse = getContentTypeToUse(inlineAllowed, filteredInlineContentTypes.length > 0, filteredInlineContentTypes);
79
+ const relevantContentTypes = contentTypes.filter((ct)=>blockContentTypesToUse.includes(ct) || inlineContentTypesToUse.includes(ct));
79
80
  const [commands, setCommands] = useState(()=>{
80
81
  const getEmbedEntry = (contentType)=>{
81
82
  return {
@@ -150,7 +151,7 @@ export const useCommands = (sdk, query, editor)=>{
150
151
  }
151
152
  };
152
153
  };
153
- const contentTypeCommands = entriesAllowed || inlineAllowed ? contentTypes.map((contentType)=>{
154
+ const contentTypeCommands = entriesAllowed || inlineAllowed ? relevantContentTypes.map((contentType)=>{
154
155
  const blockEmbedAllowed = blockContentTypesToUse.some((ct)=>ct.sys.id === contentType.sys.id);
155
156
  const inlineEmbedAllowed = inlineContentTypesToUse.some((ct)=>ct.sys.id === contentType.sys.id);
156
157
  const commands = [];
@@ -188,6 +189,7 @@ export const useCommands = (sdk, query, editor)=>{
188
189
  id: asset.entity.sys.id,
189
190
  label: asset.displayTitle,
190
191
  thumbnail: asset.thumbnail,
192
+ asset: true,
191
193
  callback: ()=>{
192
194
  removeCommand(editor);
193
195
  if (editor.selection) {
package/dist/types/plugins/CommandPalette/useCommands.d.ts CHANGED
@@ -5,6 +5,7 @@ export interface Command {
5
5
  thumbnail?: string;
6
6
  label: string;
7
7
  callback?: () => void;
8
+ asset?: boolean;
8
9
  }
9
10
  export interface CommandGroup {
10
11
  group: string;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@contentful/field-editor-rich-text",
3
- "version": "3.12.1",
3
+ "version": "3.12.3",
4
4
  "source": "./src/index.tsx",
5
5
  "main": "dist/cjs/index.js",
6
6
  "module": "dist/esm/index.js",
@@ -44,8 +44,8 @@
44
44
  "@contentful/f36-icons": "^4.1.1",
45
45
  "@contentful/f36-tokens": "^4.0.0",
46
46
  "@contentful/f36-utils": "^4.19.0",
47
- "@contentful/field-editor-reference": "^5.16.1",
48
- "@contentful/field-editor-shared": "^1.4.0",
47
+ "@contentful/field-editor-reference": "^5.16.2",
48
+ "@contentful/field-editor-shared": "^1.4.1",
49
49
  "@contentful/rich-text-plain-text-renderer": "^16.0.4",
50
50
  "@contentful/rich-text-types": "16.3.0",
51
51
  "@popperjs/core": "^2.11.5",
@@ -74,12 +74,12 @@
74
74
  "react-dom": ">=16.14.0"
75
75
  },
76
76
  "devDependencies": {
77
- "@contentful/field-editor-test-utils": "^1.4.1",
77
+ "@contentful/field-editor-test-utils": "^1.4.2",
78
78
  "@contentful/rich-text-react-renderer": "^15.16.4",
79
79
  "@types/is-hotkey": "^0.1.6",
80
80
  "@udecode/plate-test-utils": "^3.2.0",
81
81
  "prism-react-renderer": "2.0.5",
82
82
  "react": ">=16.14.0"
83
83
  },
84
- "gitHead": "b5c00e8e8a9bc89016de965cffd49f54bf7a6299"
84
+ "gitHead": "0fc8da4aa8ad8603c3adf4bd77b26ba46de11e33"
85
85
  }