@contentful/field-editor-rich-text 4.17.9 → 4.19.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.
@@ -24,11 +24,11 @@ const _platecommon = require("@udecode/plate-common");
24
24
  const _emotion = require("emotion");
25
25
  const _fastdeepequal = /*#__PURE__*/ _interop_require_default(require("fast-deep-equal"));
26
26
  const _noop = /*#__PURE__*/ _interop_require_default(require("lodash/noop"));
27
+ const _usedeepcompare = require("use-deep-compare");
27
28
  const _CharConstraints = require("./CharConstraints");
28
29
  const _ContentfulEditorProvider = require("./ContentfulEditorProvider");
29
30
  const _editoroverrides = require("./editor-overrides");
30
- const _toSlateValue = require("./helpers/toSlateValue");
31
- const _misc = require("./internal/misc");
31
+ const _toSlateDoc = require("./helpers/toSlateDoc");
32
32
  const _plugins = require("./plugins");
33
33
  const _RichTextEditorstyles = require("./RichTextEditor.styles");
34
34
  const _SdkProvider = require("./SdkProvider");
@@ -90,14 +90,10 @@ const ConnectedRichTextEditor = (props)=>{
90
90
  restrictedMarks,
91
91
  withCharValidation
92
92
  ]);
93
- const initialValue = _react.useMemo(()=>{
94
- return (0, _misc.normalizeInitialValue)({
95
- plugins,
96
- disableCorePlugins: _plugins.disableCorePlugins
97
- }, (0, _toSlateValue.toSlateValue)(props.value));
93
+ const initialValue = (0, _usedeepcompare.useDeepCompareMemo)(()=>{
94
+ return (0, _toSlateDoc.toSlateDoc)(props.value);
98
95
  }, [
99
- props.value,
100
- plugins
96
+ props.value
101
97
  ]);
102
98
  const direction = sdk.locales.direction[sdk.field.locale] ?? 'ltr';
103
99
  const classNames = (0, _emotion.cx)(_RichTextEditorstyles.styles.editor, props.minHeight !== undefined ? (0, _emotion.css)({
@@ -0,0 +1,436 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", {
3
+ value: true
4
+ });
5
+ const _richtexttypes = require("@contentful/rich-text-types");
6
+ const _nodeFactory = require("../nodeFactory");
7
+ const _toSlateDoc = require("../toSlateDoc");
8
+ describe('toSlateDoc', ()=>{
9
+ const cases = [
10
+ {
11
+ title: 'undefined documents',
12
+ input: undefined,
13
+ expected: [
14
+ {
15
+ type: 'paragraph',
16
+ children: [
17
+ {
18
+ text: ''
19
+ }
20
+ ],
21
+ data: {}
22
+ }
23
+ ]
24
+ },
25
+ {
26
+ title: 'empty documents',
27
+ input: (0, _nodeFactory.document)(),
28
+ expected: [
29
+ {
30
+ type: 'paragraph',
31
+ children: [
32
+ {
33
+ text: ''
34
+ }
35
+ ],
36
+ data: {}
37
+ }
38
+ ]
39
+ },
40
+ {
41
+ title: 'empty hyperlinks',
42
+ input: (0, _nodeFactory.document)((0, _nodeFactory.block)(_richtexttypes.BLOCKS.PARAGRAPH, {}, (0, _nodeFactory.inline)(_richtexttypes.INLINES.HYPERLINK), (0, _nodeFactory.inline)(_richtexttypes.INLINES.HYPERLINK, {}, (0, _nodeFactory.text)('')))),
43
+ expected: [
44
+ {
45
+ type: 'paragraph',
46
+ children: [
47
+ {
48
+ text: ''
49
+ }
50
+ ],
51
+ data: {}
52
+ }
53
+ ]
54
+ },
55
+ {
56
+ title: 'adjacent text nodes with identical marks',
57
+ input: (0, _nodeFactory.document)((0, _nodeFactory.block)(_richtexttypes.BLOCKS.PARAGRAPH, {}, (0, _nodeFactory.text)('This '), (0, _nodeFactory.text)(''), (0, _nodeFactory.text)('should be one '), (0, _nodeFactory.text)('text node.'), (0, _nodeFactory.text)(' but this is unique.', [
58
+ {
59
+ type: 'bold'
60
+ }
61
+ ]), (0, _nodeFactory.text)(' and this should be merged ', [
62
+ {
63
+ type: 'italic'
64
+ }
65
+ ]), (0, _nodeFactory.text)('with this.', [
66
+ {
67
+ type: 'italic'
68
+ }
69
+ ]))),
70
+ expected: [
71
+ {
72
+ type: 'paragraph',
73
+ children: [
74
+ {
75
+ text: 'This should be one text node.',
76
+ data: {}
77
+ },
78
+ {
79
+ text: ' but this is unique.',
80
+ bold: true,
81
+ data: {}
82
+ },
83
+ {
84
+ text: ' and this should be merged with this.',
85
+ italic: true,
86
+ data: {}
87
+ }
88
+ ],
89
+ data: {}
90
+ }
91
+ ]
92
+ },
93
+ {
94
+ title: 'inlines without surrounding text',
95
+ input: (0, _nodeFactory.document)((0, _nodeFactory.block)(_richtexttypes.BLOCKS.PARAGRAPH, {}, (0, _nodeFactory.inline)(_richtexttypes.INLINES.EMBEDDED_ENTRY), (0, _nodeFactory.inline)(_richtexttypes.INLINES.EMBEDDED_RESOURCE))),
96
+ expected: [
97
+ {
98
+ type: 'paragraph',
99
+ children: [
100
+ {
101
+ text: ''
102
+ },
103
+ {
104
+ type: _richtexttypes.INLINES.EMBEDDED_ENTRY,
105
+ data: {},
106
+ children: [
107
+ {
108
+ text: ''
109
+ }
110
+ ]
111
+ },
112
+ {
113
+ text: ''
114
+ },
115
+ {
116
+ type: _richtexttypes.INLINES.EMBEDDED_RESOURCE,
117
+ data: {},
118
+ children: [
119
+ {
120
+ text: ''
121
+ }
122
+ ]
123
+ },
124
+ {
125
+ text: ''
126
+ }
127
+ ],
128
+ data: {}
129
+ }
130
+ ]
131
+ },
132
+ {
133
+ title: 'uneven tables',
134
+ input: (0, _nodeFactory.document)((0, _nodeFactory.block)('table', {}, (0, _nodeFactory.block)('table-row', {}, (0, _nodeFactory.block)('table-header-cell', {}, (0, _nodeFactory.block)('paragraph', {}, (0, _nodeFactory.text)('cell #1')))), (0, _nodeFactory.block)('table-row', {}, (0, _nodeFactory.block)('table-cell', {}, (0, _nodeFactory.block)('paragraph', {}, (0, _nodeFactory.text)('cell #1'))), (0, _nodeFactory.block)('table-cell', {}, (0, _nodeFactory.block)('paragraph', {}, (0, _nodeFactory.text)('cell #2'))), (0, _nodeFactory.block)('table-cell', {}, (0, _nodeFactory.block)('paragraph', {}, (0, _nodeFactory.text)('cell #3')))), (0, _nodeFactory.block)('table-row', {}, (0, _nodeFactory.block)('table-cell', {}, (0, _nodeFactory.block)('paragraph', {}, (0, _nodeFactory.text)('cell #1'))), (0, _nodeFactory.block)('table-cell', {}, (0, _nodeFactory.block)('paragraph', {}, (0, _nodeFactory.text)('cell #2')))))),
135
+ expected: [
136
+ {
137
+ type: 'table',
138
+ data: {},
139
+ children: [
140
+ {
141
+ type: 'table-row',
142
+ data: {},
143
+ children: [
144
+ {
145
+ type: 'table-header-cell',
146
+ data: {},
147
+ children: [
148
+ {
149
+ type: 'paragraph',
150
+ data: {},
151
+ children: [
152
+ {
153
+ text: 'cell #1',
154
+ data: {}
155
+ }
156
+ ]
157
+ }
158
+ ]
159
+ },
160
+ {
161
+ type: 'table-header-cell',
162
+ data: {},
163
+ children: [
164
+ {
165
+ type: 'paragraph',
166
+ data: {},
167
+ children: [
168
+ {
169
+ text: ''
170
+ }
171
+ ]
172
+ }
173
+ ]
174
+ },
175
+ {
176
+ type: 'table-header-cell',
177
+ data: {},
178
+ children: [
179
+ {
180
+ type: 'paragraph',
181
+ data: {},
182
+ children: [
183
+ {
184
+ text: ''
185
+ }
186
+ ]
187
+ }
188
+ ]
189
+ }
190
+ ]
191
+ },
192
+ {
193
+ type: 'table-row',
194
+ data: {},
195
+ children: [
196
+ {
197
+ type: 'table-cell',
198
+ data: {},
199
+ children: [
200
+ {
201
+ type: 'paragraph',
202
+ data: {},
203
+ children: [
204
+ {
205
+ text: 'cell #1',
206
+ data: {}
207
+ }
208
+ ]
209
+ }
210
+ ]
211
+ },
212
+ {
213
+ type: 'table-cell',
214
+ data: {},
215
+ children: [
216
+ {
217
+ type: 'paragraph',
218
+ data: {},
219
+ children: [
220
+ {
221
+ text: 'cell #2',
222
+ data: {}
223
+ }
224
+ ]
225
+ }
226
+ ]
227
+ },
228
+ {
229
+ type: 'table-cell',
230
+ data: {},
231
+ children: [
232
+ {
233
+ type: 'paragraph',
234
+ data: {},
235
+ children: [
236
+ {
237
+ text: 'cell #3',
238
+ data: {}
239
+ }
240
+ ]
241
+ }
242
+ ]
243
+ }
244
+ ]
245
+ },
246
+ {
247
+ type: 'table-row',
248
+ data: {},
249
+ children: [
250
+ {
251
+ type: 'table-cell',
252
+ data: {},
253
+ children: [
254
+ {
255
+ type: 'paragraph',
256
+ data: {},
257
+ children: [
258
+ {
259
+ text: 'cell #1',
260
+ data: {}
261
+ }
262
+ ]
263
+ }
264
+ ]
265
+ },
266
+ {
267
+ type: 'table-cell',
268
+ data: {},
269
+ children: [
270
+ {
271
+ type: 'paragraph',
272
+ data: {},
273
+ children: [
274
+ {
275
+ text: 'cell #2',
276
+ data: {}
277
+ }
278
+ ]
279
+ }
280
+ ]
281
+ },
282
+ {
283
+ type: 'table-cell',
284
+ data: {},
285
+ children: [
286
+ {
287
+ type: 'paragraph',
288
+ data: {},
289
+ children: [
290
+ {
291
+ text: ''
292
+ }
293
+ ]
294
+ }
295
+ ]
296
+ }
297
+ ]
298
+ }
299
+ ]
300
+ },
301
+ {
302
+ type: 'paragraph',
303
+ data: {},
304
+ children: [
305
+ {
306
+ text: ''
307
+ }
308
+ ]
309
+ }
310
+ ]
311
+ },
312
+ {
313
+ title: 'empty blockquotes',
314
+ input: (0, _nodeFactory.document)((0, _nodeFactory.block)(_richtexttypes.BLOCKS.QUOTE, {})),
315
+ expected: [
316
+ {
317
+ type: 'blockquote',
318
+ data: {},
319
+ children: [
320
+ {
321
+ type: 'paragraph',
322
+ data: {},
323
+ children: [
324
+ {
325
+ text: ''
326
+ }
327
+ ]
328
+ }
329
+ ]
330
+ },
331
+ {
332
+ type: 'paragraph',
333
+ data: {},
334
+ children: [
335
+ {
336
+ text: ''
337
+ }
338
+ ]
339
+ }
340
+ ]
341
+ },
342
+ {
343
+ title: 'empty list items',
344
+ input: (0, _nodeFactory.document)((0, _nodeFactory.block)(_richtexttypes.BLOCKS.LIST_ITEM, {})),
345
+ expected: [
346
+ {
347
+ type: 'list-item',
348
+ data: {},
349
+ children: [
350
+ {
351
+ type: 'paragraph',
352
+ data: {},
353
+ children: [
354
+ {
355
+ text: ''
356
+ }
357
+ ]
358
+ }
359
+ ]
360
+ },
361
+ {
362
+ type: 'paragraph',
363
+ data: {},
364
+ children: [
365
+ {
366
+ text: ''
367
+ }
368
+ ]
369
+ }
370
+ ]
371
+ },
372
+ {
373
+ title: 'empty lists',
374
+ input: (0, _nodeFactory.document)((0, _nodeFactory.block)(_richtexttypes.BLOCKS.UL_LIST, {}), (0, _nodeFactory.block)(_richtexttypes.BLOCKS.OL_LIST, {})),
375
+ expected: [
376
+ {
377
+ type: 'unordered-list',
378
+ data: {},
379
+ children: [
380
+ {
381
+ type: 'list-item',
382
+ data: {},
383
+ children: [
384
+ {
385
+ type: 'paragraph',
386
+ data: {},
387
+ children: [
388
+ {
389
+ text: ''
390
+ }
391
+ ]
392
+ }
393
+ ]
394
+ }
395
+ ]
396
+ },
397
+ {
398
+ type: 'ordered-list',
399
+ data: {},
400
+ children: [
401
+ {
402
+ type: 'list-item',
403
+ data: {},
404
+ children: [
405
+ {
406
+ type: 'paragraph',
407
+ data: {},
408
+ children: [
409
+ {
410
+ text: ''
411
+ }
412
+ ]
413
+ }
414
+ ]
415
+ }
416
+ ]
417
+ },
418
+ {
419
+ type: 'paragraph',
420
+ data: {},
421
+ children: [
422
+ {
423
+ text: ''
424
+ }
425
+ ]
426
+ }
427
+ ]
428
+ }
429
+ ];
430
+ cases.forEach(({ title, input, expected })=>{
431
+ it(`should normalize ${title}`, ()=>{
432
+ const out = (0, _toSlateDoc.toSlateDoc)(input);
433
+ expect(out).toEqual(expected);
434
+ });
435
+ });
436
+ });
@@ -0,0 +1,180 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", {
3
+ value: true
4
+ });
5
+ Object.defineProperty(exports, "toSlateDoc", {
6
+ enumerable: true,
7
+ get: function() {
8
+ return toSlateDoc;
9
+ }
10
+ });
11
+ const _richtexttypes = require("@contentful/rich-text-types");
12
+ const _slate = require("slate");
13
+ const _internal = require("../internal");
14
+ const inlineTypes = new Set(Object.values(_richtexttypes.INLINES));
15
+ function isEmptyHyperlink(node) {
16
+ if (node.nodeType !== _richtexttypes.INLINES.HYPERLINK) {
17
+ return false;
18
+ }
19
+ const link = node;
20
+ if (!link.content?.length) {
21
+ return true;
22
+ }
23
+ return link.content.length === 1 && link.content.at(0)?.value.length === 0;
24
+ }
25
+ function maybeFixUnevenTableRows(el) {
26
+ const rows = el.children;
27
+ const rowSize = Math.max(...rows.map((row)=>row.children?.length ?? 0));
28
+ const fixedRows = [];
29
+ for (const row of rows){
30
+ const missingCells = rowSize - row.children.length;
31
+ if (missingCells === 0) {
32
+ fixedRows.push(row);
33
+ continue;
34
+ }
35
+ const cellType = row.children.at(-1)?.type === _richtexttypes.BLOCKS.TABLE_HEADER_CELL ? _richtexttypes.BLOCKS.TABLE_HEADER_CELL : _richtexttypes.BLOCKS.TABLE_CELL;
36
+ const paddedRow = {
37
+ ...row,
38
+ children: [
39
+ ...row.children
40
+ ]
41
+ };
42
+ for(let i = 0; i < missingCells; i++){
43
+ paddedRow.children.push({
44
+ type: cellType,
45
+ data: {},
46
+ children: [
47
+ {
48
+ type: _richtexttypes.BLOCKS.PARAGRAPH,
49
+ data: {},
50
+ children: [
51
+ {
52
+ text: ''
53
+ }
54
+ ]
55
+ }
56
+ ]
57
+ });
58
+ }
59
+ fixedRows.push(paddedRow);
60
+ }
61
+ return fixedRows;
62
+ }
63
+ function transformText(node) {
64
+ const text = {
65
+ text: node.value,
66
+ data: node.data ?? {}
67
+ };
68
+ for (const mark of node.marks){
69
+ text[mark.type] = true;
70
+ }
71
+ return text;
72
+ }
73
+ function transformNode(node) {
74
+ const el = {
75
+ type: node.nodeType,
76
+ children: [],
77
+ data: node.data ?? {}
78
+ };
79
+ for (const child of node.content){
80
+ const lastChild = el.children.at(-1);
81
+ if (child.nodeType === 'text') {
82
+ const text = transformText(child);
83
+ if ((0, _internal.isText)(lastChild) && _slate.Text.equals(lastChild, text, {
84
+ loose: true
85
+ })) {
86
+ lastChild.text += child.value;
87
+ } else {
88
+ el.children.push(text);
89
+ }
90
+ continue;
91
+ }
92
+ if (isEmptyHyperlink(child)) {
93
+ continue;
94
+ }
95
+ if (inlineTypes.has(child.nodeType) && !(0, _internal.isText)(lastChild)) {
96
+ el.children.push({
97
+ text: ''
98
+ });
99
+ }
100
+ el.children.push(transformNode(child));
101
+ }
102
+ if (el.children.length === 0) {
103
+ switch(el.type){
104
+ case _richtexttypes.BLOCKS.QUOTE:
105
+ case _richtexttypes.BLOCKS.LIST_ITEM:
106
+ el.children.push({
107
+ type: _richtexttypes.BLOCKS.PARAGRAPH,
108
+ data: {},
109
+ children: [
110
+ {
111
+ text: ''
112
+ }
113
+ ]
114
+ });
115
+ break;
116
+ case _richtexttypes.BLOCKS.UL_LIST:
117
+ case _richtexttypes.BLOCKS.OL_LIST:
118
+ el.children.push({
119
+ type: _richtexttypes.BLOCKS.LIST_ITEM,
120
+ data: {},
121
+ children: [
122
+ {
123
+ type: _richtexttypes.BLOCKS.PARAGRAPH,
124
+ data: {},
125
+ children: [
126
+ {
127
+ text: ''
128
+ }
129
+ ]
130
+ }
131
+ ]
132
+ });
133
+ break;
134
+ default:
135
+ el.children.push({
136
+ text: ''
137
+ });
138
+ break;
139
+ }
140
+ }
141
+ const lastChildElement = el.children.at(-1);
142
+ if (_slate.Element.isElement(lastChildElement) && inlineTypes.has(lastChildElement.type)) {
143
+ el.children.push({
144
+ text: ''
145
+ });
146
+ }
147
+ if (el.type === _richtexttypes.BLOCKS.TABLE) {
148
+ el.children = maybeFixUnevenTableRows(el);
149
+ }
150
+ return el;
151
+ }
152
+ function toSlateDoc(doc) {
153
+ if (!doc || !doc?.content?.length) {
154
+ return [
155
+ {
156
+ type: 'paragraph',
157
+ children: [
158
+ {
159
+ text: ''
160
+ }
161
+ ],
162
+ data: {}
163
+ }
164
+ ];
165
+ }
166
+ const elements = doc.content.map(transformNode);
167
+ const lastElement = elements.at(-1);
168
+ if (lastElement?.type !== _richtexttypes.BLOCKS.PARAGRAPH) {
169
+ elements.push({
170
+ type: _richtexttypes.BLOCKS.PARAGRAPH,
171
+ children: [
172
+ {
173
+ text: ''
174
+ }
175
+ ],
176
+ data: {}
177
+ });
178
+ }
179
+ return elements;
180
+ }
@@ -59,7 +59,8 @@ const { getEntryTitle, getEntityStatus } = _fieldeditorshared.entityHelpers;
59
59
  function FetchingWrappedResourceInlineCard(props) {
60
60
  const { link, onEntityFetchComplete, sdk } = props;
61
61
  const { data, status: requestStatus } = (0, _fieldeditorreference.useResource)(link.linkType, link.urn, {
62
- locale: sdk.field.locale
62
+ locale: sdk.field.locale,
63
+ referencingEntryId: sdk.ids.entry
63
64
  });
64
65
  _react.useEffect(()=>{
65
66
  if (requestStatus === 'success') {
@@ -177,7 +177,8 @@ function HyperlinkModal(props) {
177
177
  async function selectResourceEntry() {
178
178
  const options = {
179
179
  allowedResources: (0, _getAllowedResourcesForNodeType.default)(props.sdk.field, _richtexttypes.INLINES.RESOURCE_HYPERLINK),
180
- locale: props.sdk.field.locale
180
+ locale: props.sdk.field.locale,
181
+ referencingEntryId: props.sdk.ids.entry
181
182
  };
182
183
  const entityLink = await props.sdk.dialogs.selectSingleResourceEntity(options);
183
184
  if (entityLink) {
@@ -90,7 +90,8 @@ InternalEntryCard.displayName = 'ReferenceCard';
90
90
  const FetchingWrappedResourceCard = (props)=>{
91
91
  const { link, onEntityFetchComplete, sdk } = props;
92
92
  const { data, status, error } = (0, _fieldeditorreference.useResource)(link.linkType, link.urn, {
93
- locale: sdk.field.locale
93
+ locale: sdk.field.locale,
94
+ referencingEntryId: sdk.ids.entry
94
95
  });
95
96
  _react.useEffect(()=>{
96
97
  if (status === 'success') {