@contentful/field-editor-rich-text 3.12.1 → 3.12.2
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.
- package/dist/cjs/plugins/CommandPalette/components/CommandList.js +8 -4
- package/dist/cjs/plugins/CommandPalette/useCommands.js +9 -7
- package/dist/esm/plugins/CommandPalette/components/CommandList.js +8 -4
- package/dist/esm/plugins/CommandPalette/useCommands.js +9 -7
- package/dist/types/plugins/CommandPalette/useCommands.d.ts +1 -0
- package/package.json +2 -2
|
@@ -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.
|
|
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
|
};
|
|
@@ -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
|
|
92
|
-
const
|
|
93
|
-
const
|
|
94
|
-
const
|
|
95
|
-
const blockContentTypesToUse =
|
|
96
|
-
const inlineContentTypesToUse =
|
|
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 ?
|
|
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) {
|
|
@@ -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.
|
|
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
|
};
|
|
@@ -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
|
|
74
|
-
const
|
|
75
|
-
const
|
|
76
|
-
const
|
|
77
|
-
const blockContentTypesToUse =
|
|
78
|
-
const inlineContentTypesToUse =
|
|
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 ?
|
|
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/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@contentful/field-editor-rich-text",
|
|
3
|
-
"version": "3.12.
|
|
3
|
+
"version": "3.12.2",
|
|
4
4
|
"source": "./src/index.tsx",
|
|
5
5
|
"main": "dist/cjs/index.js",
|
|
6
6
|
"module": "dist/esm/index.js",
|
|
@@ -81,5 +81,5 @@
|
|
|
81
81
|
"prism-react-renderer": "2.0.5",
|
|
82
82
|
"react": ">=16.14.0"
|
|
83
83
|
},
|
|
84
|
-
"gitHead": "
|
|
84
|
+
"gitHead": "9bad77d2a0b24a95df55d6af5057d84a68a7c880"
|
|
85
85
|
}
|