@wordpress/editor 14.33.4 → 14.33.6

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 (97) hide show
  1. package/build/components/collab-sidebar/add-comment.js +10 -12
  2. package/build/components/collab-sidebar/add-comment.js.map +2 -2
  3. package/build/components/collab-sidebar/comment-menu-item.js +36 -6
  4. package/build/components/collab-sidebar/comment-menu-item.js.map +3 -3
  5. package/build/components/collab-sidebar/comments.js +316 -318
  6. package/build/components/collab-sidebar/comments.js.map +3 -3
  7. package/build/components/collab-sidebar/index.js +38 -25
  8. package/build/components/collab-sidebar/index.js.map +3 -3
  9. package/build/components/collab-sidebar/utils.js +1 -1
  10. package/build/components/collab-sidebar/utils.js.map +2 -2
  11. package/build/components/editor/index.js +2 -2
  12. package/build/components/editor/index.js.map +3 -3
  13. package/build/components/post-excerpt/panel.js +1 -6
  14. package/build/components/post-excerpt/panel.js.map +2 -2
  15. package/build/components/post-template/block-theme.js +4 -32
  16. package/build/components/post-template/block-theme.js.map +3 -3
  17. package/build/components/post-template/create-new-template-modal.js +1 -2
  18. package/build/components/post-template/create-new-template-modal.js.map +2 -2
  19. package/build/components/post-template/hooks.js +1 -3
  20. package/build/components/post-template/hooks.js.map +2 -2
  21. package/build/components/preferences-modal/index.js +1 -1
  22. package/build/components/preferences-modal/index.js.map +1 -1
  23. package/build/components/provider/index.js +2 -3
  24. package/build/components/provider/index.js.map +2 -2
  25. package/build/components/start-page-options/index.js +4 -5
  26. package/build/components/start-page-options/index.js.map +2 -2
  27. package/build/dataviews/store/private-actions.js +3 -9
  28. package/build/dataviews/store/private-actions.js.map +2 -2
  29. package/build/store/actions.js +2 -67
  30. package/build/store/actions.js.map +2 -2
  31. package/build-module/components/collab-sidebar/add-comment.js +10 -12
  32. package/build-module/components/collab-sidebar/add-comment.js.map +2 -2
  33. package/build-module/components/collab-sidebar/comment-menu-item.js +40 -7
  34. package/build-module/components/collab-sidebar/comment-menu-item.js.map +2 -2
  35. package/build-module/components/collab-sidebar/comments.js +316 -318
  36. package/build-module/components/collab-sidebar/comments.js.map +2 -2
  37. package/build-module/components/collab-sidebar/index.js +38 -25
  38. package/build-module/components/collab-sidebar/index.js.map +2 -2
  39. package/build-module/components/collab-sidebar/utils.js +1 -1
  40. package/build-module/components/collab-sidebar/utils.js.map +2 -2
  41. package/build-module/components/editor/index.js +2 -2
  42. package/build-module/components/editor/index.js.map +2 -2
  43. package/build-module/components/post-excerpt/panel.js +1 -6
  44. package/build-module/components/post-excerpt/panel.js.map +2 -2
  45. package/build-module/components/post-template/block-theme.js +4 -32
  46. package/build-module/components/post-template/block-theme.js.map +2 -2
  47. package/build-module/components/post-template/create-new-template-modal.js +1 -2
  48. package/build-module/components/post-template/create-new-template-modal.js.map +2 -2
  49. package/build-module/components/post-template/hooks.js +1 -3
  50. package/build-module/components/post-template/hooks.js.map +2 -2
  51. package/build-module/components/preferences-modal/index.js +1 -1
  52. package/build-module/components/preferences-modal/index.js.map +1 -1
  53. package/build-module/components/provider/index.js +2 -3
  54. package/build-module/components/provider/index.js.map +2 -2
  55. package/build-module/components/start-page-options/index.js +5 -6
  56. package/build-module/components/start-page-options/index.js.map +2 -2
  57. package/build-module/dataviews/store/private-actions.js +3 -9
  58. package/build-module/dataviews/store/private-actions.js.map +2 -2
  59. package/build-module/store/actions.js +3 -68
  60. package/build-module/store/actions.js.map +2 -2
  61. package/build-style/style-rtl.css +14 -2
  62. package/build-style/style.css +14 -2
  63. package/build-types/components/collab-sidebar/add-comment.d.ts +3 -3
  64. package/build-types/components/collab-sidebar/add-comment.d.ts.map +1 -1
  65. package/build-types/components/collab-sidebar/comment-menu-item.d.ts +3 -2
  66. package/build-types/components/collab-sidebar/comment-menu-item.d.ts.map +1 -1
  67. package/build-types/components/collab-sidebar/comments.d.ts +4 -4
  68. package/build-types/components/collab-sidebar/comments.d.ts.map +1 -1
  69. package/build-types/components/collab-sidebar/index.d.ts.map +1 -1
  70. package/build-types/components/collab-sidebar/utils.d.ts.map +1 -1
  71. package/build-types/components/post-excerpt/panel.d.ts.map +1 -1
  72. package/build-types/components/post-template/block-theme.d.ts.map +1 -1
  73. package/build-types/components/post-template/create-new-template-modal.d.ts.map +1 -1
  74. package/build-types/components/post-template/hooks.d.ts.map +1 -1
  75. package/build-types/components/provider/index.d.ts.map +1 -1
  76. package/build-types/components/start-page-options/index.d.ts.map +1 -1
  77. package/build-types/dataviews/store/private-actions.d.ts.map +1 -1
  78. package/build-types/store/actions.d.ts.map +1 -1
  79. package/package.json +14 -14
  80. package/src/components/collab-sidebar/add-comment.js +10 -12
  81. package/src/components/collab-sidebar/comment-menu-item.js +51 -11
  82. package/src/components/collab-sidebar/comments.js +53 -56
  83. package/src/components/collab-sidebar/index.js +66 -46
  84. package/src/components/collab-sidebar/style.scss +16 -0
  85. package/src/components/collab-sidebar/utils.js +3 -2
  86. package/src/components/editor/index.js +1 -1
  87. package/src/components/post-excerpt/panel.js +1 -11
  88. package/src/components/post-template/block-theme.js +3 -45
  89. package/src/components/post-template/create-new-template-modal.js +0 -1
  90. package/src/components/post-template/hooks.js +1 -3
  91. package/src/components/preferences-modal/index.js +1 -1
  92. package/src/components/provider/index.js +2 -5
  93. package/src/components/start-page-options/index.js +5 -6
  94. package/src/components/start-page-options/style.scss +1 -1
  95. package/src/dataviews/store/private-actions.ts +7 -16
  96. package/src/store/actions.js +3 -100
  97. package/tsconfig.tsbuildinfo +1 -1
@@ -40,8 +40,8 @@ function Comments({
40
40
  onEditComment,
41
41
  onAddReply,
42
42
  onCommentDelete,
43
- showCommentBoard,
44
- setShowCommentBoard,
43
+ newNoteFormState,
44
+ setNewNoteFormState,
45
45
  commentSidebarRef,
46
46
  reflowComments,
47
47
  isFloating = false,
@@ -53,19 +53,23 @@ function Comments({
53
53
  const [blockRefs, setBlockRefs] = useState({});
54
54
  const { setCanvasMinHeight } = unlock(useDispatch(editorStore));
55
55
  const { blockCommentId, selectedBlockClientId, orderedBlockIds } = useSelect((select) => {
56
- const { getBlockAttributes, getSelectedBlockClientId } = select(blockEditorStore);
56
+ const {
57
+ getBlockAttributes,
58
+ getSelectedBlockClientId,
59
+ getClientIdsWithDescendants
60
+ } = select(blockEditorStore);
57
61
  const clientId = getSelectedBlockClientId();
58
62
  return {
59
63
  blockCommentId: clientId ? getBlockAttributes(clientId)?.metadata?.noteId : null,
60
64
  selectedBlockClientId: clientId,
61
- orderedBlockIds: select(blockEditorStore).getBlockOrder()
65
+ orderedBlockIds: getClientIdsWithDescendants()
62
66
  };
63
67
  }, []);
64
68
  const relatedBlockElement = useBlockElement(selectedBlockClientId);
65
69
  const threads = useMemo(() => {
66
70
  const t = [...noteThreads];
67
71
  const orderedThreads = [];
68
- if (isFloating && showCommentBoard && void 0 === blockCommentId) {
72
+ if (isFloating && newNoteFormState === "open") {
69
73
  const newNoteThread = {
70
74
  id: "new-note-thread",
71
75
  blockClientId: selectedBlockClientId,
@@ -89,8 +93,7 @@ function Comments({
89
93
  }, [
90
94
  noteThreads,
91
95
  isFloating,
92
- showCommentBoard,
93
- blockCommentId,
96
+ newNoteFormState,
94
97
  selectedBlockClientId,
95
98
  orderedBlockIds
96
99
  ]);
@@ -112,14 +115,15 @@ function Comments({
112
115
  focusCommentThread(prevThread.id, commentSidebarRef.current);
113
116
  } else {
114
117
  setSelectedThread(null);
115
- setShowCommentBoard(false);
118
+ setNewNoteFormState("closed");
116
119
  relatedBlockElement?.focus();
117
120
  }
118
121
  };
119
122
  useEffect(() => {
120
- const fallback = showCommentBoard ? "new-note-thread" : null;
121
- setSelectedThread(blockCommentId ?? fallback);
122
- }, [blockCommentId, showCommentBoard]);
123
+ setSelectedThread(
124
+ newNoteFormState === "open" ? "new-note-thread" : blockCommentId
125
+ );
126
+ }, [blockCommentId, newNoteFormState]);
123
127
  const setBlockRef = useCallback((id, blockRef) => {
124
128
  setBlockRefs((prev) => ({ ...prev, [id]: blockRef }));
125
129
  }, []);
@@ -215,27 +219,15 @@ function Comments({
215
219
  ]);
216
220
  const hasThreads = Array.isArray(threads) && threads.length > 0;
217
221
  if (!hasThreads && !isFloating) {
218
- return /* @__PURE__ */ jsxs(Fragment, { children: [
219
- /* @__PURE__ */ jsx(
220
- AddComment,
221
- {
222
- onSubmit: onAddReply,
223
- showCommentBoard,
224
- setShowCommentBoard,
225
- commentSidebarRef
226
- }
227
- ),
228
- /* @__PURE__ */ jsx(Text, { as: "p", children: __("No notes available.") }),
229
- /* @__PURE__ */ jsx(Text, { as: "p", variant: "muted", children: __("Only logged in users can see Notes.") })
230
- ] });
222
+ return null;
231
223
  }
232
224
  return /* @__PURE__ */ jsxs(Fragment, { children: [
233
- !isFloating && showCommentBoard && void 0 === blockCommentId && /* @__PURE__ */ jsx(
225
+ !isFloating && newNoteFormState === "open" && /* @__PURE__ */ jsx(
234
226
  AddComment,
235
227
  {
236
228
  onSubmit: onAddReply,
237
- showCommentBoard,
238
- setShowCommentBoard,
229
+ newNoteFormState,
230
+ setNewNoteFormState,
239
231
  commentSidebarRef
240
232
  }
241
233
  ),
@@ -248,7 +240,7 @@ function Comments({
248
240
  onEditComment,
249
241
  isSelected: selectedThread === thread.id,
250
242
  setSelectedThread,
251
- setShowCommentBoard,
243
+ setNewNoteFormState,
252
244
  commentSidebarRef,
253
245
  reflowComments,
254
246
  isFloating,
@@ -257,7 +249,7 @@ function Comments({
257
249
  setBlockRef,
258
250
  selectedThread,
259
251
  commentLastUpdated,
260
- showCommentBoard
252
+ newNoteFormState
261
253
  },
262
254
  thread.id
263
255
  ))
@@ -269,7 +261,7 @@ function Thread({
269
261
  onAddReply,
270
262
  onCommentDelete,
271
263
  isSelected,
272
- setShowCommentBoard,
264
+ setNewNoteFormState,
273
265
  commentSidebarRef,
274
266
  reflowComments,
275
267
  isFloating,
@@ -279,7 +271,7 @@ function Thread({
279
271
  setSelectedThread,
280
272
  selectedThread,
281
273
  commentLastUpdated,
282
- showCommentBoard
274
+ newNoteFormState
283
275
  }) {
284
276
  const { toggleBlockHighlight, selectBlock, toggleBlockSpotlight } = unlock(
285
277
  useDispatch(blockEditorStore)
@@ -304,7 +296,7 @@ function Thread({
304
296
  debouncedToggleBlockHighlight(thread.blockClientId, false);
305
297
  };
306
298
  const handleCommentSelect = () => {
307
- setShowCommentBoard(false);
299
+ setNewNoteFormState("closed");
308
300
  setSelectedThread(thread.id);
309
301
  if (!!thread.blockClientId) {
310
302
  selectBlock(thread.blockClientId, null);
@@ -313,7 +305,7 @@ function Thread({
313
305
  };
314
306
  const unselectThread = () => {
315
307
  setSelectedThread(null);
316
- setShowCommentBoard(false);
308
+ setNewNoteFormState("closed");
317
309
  toggleBlockSpotlight(thread.blockClientId, false);
318
310
  };
319
311
  const allReplies = thread?.reply || [];
@@ -332,13 +324,13 @@ function Thread({
332
324
  __("Original block deleted. Note: %s"),
333
325
  commentExcerpt
334
326
  );
335
- if ("new-note-thread" === thread.id && showCommentBoard && isFloating) {
327
+ if (thread.id === "new-note-thread" && newNoteFormState === "open" && isFloating) {
336
328
  return /* @__PURE__ */ jsx(
337
329
  AddComment,
338
330
  {
339
331
  onSubmit: onAddReply,
340
- showCommentBoard,
341
- setShowCommentBoard,
332
+ newNoteFormState,
333
+ setNewNoteFormState,
342
334
  commentSidebarRef,
343
335
  reflowComments,
344
336
  isFloating,
@@ -347,185 +339,184 @@ function Thread({
347
339
  }
348
340
  );
349
341
  }
350
- return (
351
- // Disable reason: role="listitem" does in fact support aria-expanded.
352
- // eslint-disable-next-line jsx-a11y/role-supports-aria-props
353
- /* @__PURE__ */ jsxs(
354
- VStack,
355
- {
356
- className: clsx("editor-collab-sidebar-panel__thread", {
357
- "is-selected": isSelected,
358
- "is-floating": isFloating
359
- }),
360
- id: `comment-thread-${thread.id}`,
361
- spacing: "3",
362
- onClick: handleCommentSelect,
363
- onMouseEnter,
364
- onMouseLeave,
365
- onFocus: onMouseEnter,
366
- onBlur: onMouseLeave,
367
- onKeyDown: (event) => {
368
- if (event.defaultPrevented) {
369
- return;
370
- }
371
- if (event.key === "Enter" && event.currentTarget === event.target) {
372
- if (isSelected) {
373
- unselectThread();
374
- } else {
375
- handleCommentSelect();
376
- }
377
- }
378
- if (event.key === "Escape") {
342
+ return /* @__PURE__ */ jsxs(
343
+ VStack,
344
+ {
345
+ className: clsx("editor-collab-sidebar-panel__thread", {
346
+ "is-selected": isSelected,
347
+ "is-floating": isFloating
348
+ }),
349
+ id: `comment-thread-${thread.id}`,
350
+ spacing: "3",
351
+ onClick: handleCommentSelect,
352
+ onMouseEnter,
353
+ onMouseLeave,
354
+ onFocus: onMouseEnter,
355
+ onBlur: onMouseLeave,
356
+ onKeyDown: (event) => {
357
+ if (event.defaultPrevented) {
358
+ return;
359
+ }
360
+ if (event.key === "Enter" && event.currentTarget === event.target) {
361
+ if (isSelected) {
379
362
  unselectThread();
380
- focusCommentThread(thread.id, commentSidebarRef.current);
363
+ } else {
364
+ handleCommentSelect();
381
365
  }
382
- },
383
- tabIndex: 0,
384
- role: "listitem",
385
- "aria-label": ariaLabel,
386
- "aria-expanded": isSelected,
387
- ref: isFloating ? refs.setFloating : void 0,
388
- style: isFloating ? { top: y } : void 0,
389
- children: [
390
- /* @__PURE__ */ jsx(
391
- Button,
392
- {
393
- className: "editor-collab-sidebar-panel__skip-to-comment",
394
- variant: "secondary",
395
- size: "compact",
396
- onClick: () => {
397
- focusCommentThread(
398
- thread.id,
399
- commentSidebarRef.current,
400
- "textarea"
401
- );
402
- },
403
- children: __("Add new note")
404
- }
405
- ),
406
- !thread.blockClientId && /* @__PURE__ */ jsx(Text, { as: "p", weight: 500, variant: "muted", children: __("Original block deleted.") }),
407
- /* @__PURE__ */ jsx(
408
- CommentBoard,
409
- {
410
- thread,
411
- isExpanded: isSelected,
412
- onEdit: (params = {}) => {
413
- const { status } = params;
414
- onEditComment(params);
415
- if (status === "approved") {
416
- unselectThread();
366
+ }
367
+ if (event.key === "Escape") {
368
+ unselectThread();
369
+ focusCommentThread(thread.id, commentSidebarRef.current);
370
+ }
371
+ },
372
+ tabIndex: 0,
373
+ role: "treeitem",
374
+ "aria-label": ariaLabel,
375
+ "aria-expanded": isSelected,
376
+ ref: isFloating ? refs.setFloating : void 0,
377
+ style: isFloating ? { top: y } : void 0,
378
+ children: [
379
+ /* @__PURE__ */ jsx(
380
+ Button,
381
+ {
382
+ className: "editor-collab-sidebar-panel__skip-to-comment",
383
+ variant: "secondary",
384
+ size: "compact",
385
+ onClick: () => {
386
+ focusCommentThread(
387
+ thread.id,
388
+ commentSidebarRef.current,
389
+ "textarea"
390
+ );
391
+ },
392
+ children: __("Add new note")
393
+ }
394
+ ),
395
+ !thread.blockClientId && /* @__PURE__ */ jsx(Text, { as: "p", weight: 500, variant: "muted", children: __("Original block deleted.") }),
396
+ /* @__PURE__ */ jsx(
397
+ CommentBoard,
398
+ {
399
+ thread,
400
+ isExpanded: isSelected,
401
+ onEdit: (params = {}) => {
402
+ onEditComment(params);
403
+ if (params.status === "approved") {
404
+ unselectThread();
405
+ if (isFloating) {
406
+ relatedBlockElement?.focus();
407
+ } else {
417
408
  focusCommentThread(
418
409
  thread.id,
419
410
  commentSidebarRef.current
420
411
  );
421
412
  }
422
- },
423
- onDelete: onCommentDelete,
424
- reflowComments
425
- }
426
- ),
427
- isSelected && allReplies.map((reply) => /* @__PURE__ */ jsx(
428
- CommentBoard,
429
- {
430
- thread: reply,
431
- parent: thread,
432
- isExpanded: isSelected,
433
- onEdit: onEditComment,
434
- onDelete: onCommentDelete,
435
- reflowComments
413
+ }
414
+ },
415
+ onDelete: onCommentDelete,
416
+ reflowComments
417
+ }
418
+ ),
419
+ isSelected && allReplies.map((reply) => /* @__PURE__ */ jsx(
420
+ CommentBoard,
421
+ {
422
+ thread: reply,
423
+ parent: thread,
424
+ isExpanded: isSelected,
425
+ onEdit: onEditComment,
426
+ onDelete: onCommentDelete,
427
+ reflowComments
428
+ },
429
+ reply.id
430
+ )),
431
+ !isSelected && restReplies.length > 0 && /* @__PURE__ */ jsx(HStack, { className: "editor-collab-sidebar-panel__more-reply-separator", children: /* @__PURE__ */ jsx(
432
+ Button,
433
+ {
434
+ size: "compact",
435
+ variant: "tertiary",
436
+ className: "editor-collab-sidebar-panel__more-reply-button",
437
+ onClick: () => {
438
+ setSelectedThread(thread.id);
439
+ focusCommentThread(
440
+ thread.id,
441
+ commentSidebarRef.current
442
+ );
436
443
  },
437
- reply.id
438
- )),
439
- !isSelected && restReplies.length > 0 && /* @__PURE__ */ jsx(HStack, { className: "editor-collab-sidebar-panel__more-reply-separator", children: /* @__PURE__ */ jsx(
440
- Button,
444
+ children: sprintf(
445
+ // translators: %s: number of replies.
446
+ _n(
447
+ "%s more reply",
448
+ "%s more replies",
449
+ restReplies.length
450
+ ),
451
+ restReplies.length
452
+ )
453
+ }
454
+ ) }),
455
+ !isSelected && lastReply && /* @__PURE__ */ jsx(
456
+ CommentBoard,
457
+ {
458
+ thread: lastReply,
459
+ parent: thread,
460
+ isExpanded: isSelected,
461
+ onEdit: onEditComment,
462
+ onDelete: onCommentDelete,
463
+ reflowComments
464
+ }
465
+ ),
466
+ isSelected && /* @__PURE__ */ jsxs(VStack, { spacing: "2", role: "treeitem", children: [
467
+ /* @__PURE__ */ jsx(HStack, { alignment: "left", spacing: "3", justify: "flex-start", children: /* @__PURE__ */ jsx(CommentAuthorInfo, {}) }),
468
+ /* @__PURE__ */ jsx(VStack, { spacing: "2", children: /* @__PURE__ */ jsx(
469
+ CommentForm,
441
470
  {
442
- size: "compact",
443
- variant: "tertiary",
444
- className: "editor-collab-sidebar-panel__more-reply-button",
445
- onClick: () => {
446
- setSelectedThread(thread.id);
471
+ onSubmit: (inputComment) => {
472
+ if ("approved" === thread.status) {
473
+ onEditComment({
474
+ id: thread.id,
475
+ status: "hold",
476
+ content: inputComment
477
+ });
478
+ } else {
479
+ onAddReply({
480
+ content: inputComment,
481
+ parent: thread.id
482
+ });
483
+ }
484
+ },
485
+ onCancel: (event) => {
486
+ event.stopPropagation();
487
+ unselectThread();
447
488
  focusCommentThread(
448
489
  thread.id,
449
490
  commentSidebarRef.current
450
491
  );
451
492
  },
452
- children: sprintf(
453
- // translators: %s: number of replies.
454
- _n(
455
- "%s more reply",
456
- "%s more replies",
457
- restReplies.length
458
- ),
459
- restReplies.length
460
- )
461
- }
462
- ) }),
463
- !isSelected && lastReply && /* @__PURE__ */ jsx(
464
- CommentBoard,
465
- {
466
- thread: lastReply,
467
- parent: thread,
468
- isExpanded: isSelected,
469
- onEdit: onEditComment,
470
- onDelete: onCommentDelete,
493
+ submitButtonText: "approved" === thread.status ? __("Reopen & Reply") : __("Reply"),
494
+ rows: "approved" === thread.status ? 2 : 4,
495
+ labelText: sprintf(
496
+ // translators: %1$s: note identifier, %2$s: author name
497
+ __("Reply to note %1$s by %2$s"),
498
+ thread.id,
499
+ thread.author_name
500
+ ),
471
501
  reflowComments
472
502
  }
473
- ),
474
- isSelected && /* @__PURE__ */ jsxs(VStack, { spacing: "2", children: [
475
- /* @__PURE__ */ jsx(HStack, { alignment: "left", spacing: "3", justify: "flex-start", children: /* @__PURE__ */ jsx(CommentAuthorInfo, {}) }),
476
- /* @__PURE__ */ jsx(VStack, { spacing: "2", children: /* @__PURE__ */ jsx(
477
- CommentForm,
478
- {
479
- onSubmit: (inputComment) => {
480
- if ("approved" === thread.status) {
481
- onEditComment({
482
- id: thread.id,
483
- status: "hold",
484
- content: inputComment
485
- });
486
- } else {
487
- onAddReply({
488
- content: inputComment,
489
- parent: thread.id
490
- });
491
- }
492
- },
493
- onCancel: (event) => {
494
- event.stopPropagation();
495
- unselectThread();
496
- focusCommentThread(
497
- thread.id,
498
- commentSidebarRef.current
499
- );
500
- },
501
- submitButtonText: "approved" === thread.status ? __("Reopen & Reply") : __("Reply"),
502
- rows: "approved" === thread.status ? 2 : 4,
503
- labelText: sprintf(
504
- // translators: %1$s: note identifier, %2$s: author name
505
- __("Reply to note %1$s by %2$s"),
506
- thread.id,
507
- thread.author_name
508
- ),
509
- reflowComments
510
- }
511
- ) })
512
- ] }),
513
- !!thread.blockClientId && /* @__PURE__ */ jsx(
514
- Button,
515
- {
516
- className: "editor-collab-sidebar-panel__skip-to-block",
517
- variant: "secondary",
518
- size: "compact",
519
- onClick: (event) => {
520
- event.stopPropagation();
521
- relatedBlockElement?.focus();
522
- },
523
- children: __("Back to block")
524
- }
525
- )
526
- ]
527
- }
528
- )
503
+ ) })
504
+ ] }),
505
+ !!thread.blockClientId && /* @__PURE__ */ jsx(
506
+ Button,
507
+ {
508
+ className: "editor-collab-sidebar-panel__skip-to-block",
509
+ variant: "secondary",
510
+ size: "compact",
511
+ onClick: (event) => {
512
+ event.stopPropagation();
513
+ relatedBlockElement?.focus();
514
+ },
515
+ children: __("Back to block")
516
+ }
517
+ )
518
+ ]
519
+ }
529
520
  );
530
521
  }
531
522
  const CommentBoard = ({
@@ -579,133 +570,140 @@ const CommentBoard = ({
579
570
  ];
580
571
  const canResolve = thread.parent === 0;
581
572
  const moreActions = parent?.status !== "approved" ? actions.filter((item) => item.isEligible(thread)) : [];
582
- return /* @__PURE__ */ jsxs(VStack, { spacing: "2", children: [
583
- /* @__PURE__ */ jsxs(HStack, { alignment: "left", spacing: "3", justify: "flex-start", children: [
584
- /* @__PURE__ */ jsx(
585
- CommentAuthorInfo,
586
- {
587
- avatar: thread?.author_avatar_urls?.[48],
588
- name: thread?.author_name,
589
- date: thread?.date,
590
- userId: thread?.author
591
- }
592
- ),
593
- isExpanded && /* @__PURE__ */ jsx(
594
- FlexItem,
595
- {
596
- className: "editor-collab-sidebar-panel__comment-status",
597
- onClick: (event) => {
598
- event.stopPropagation();
599
- },
600
- children: /* @__PURE__ */ jsxs(HStack, { spacing: "0", children: [
601
- canResolve && /* @__PURE__ */ jsx(
602
- Button,
603
- {
604
- label: _x(
605
- "Resolve",
606
- "Mark note as resolved"
573
+ return /* @__PURE__ */ jsxs(
574
+ VStack,
575
+ {
576
+ spacing: "2",
577
+ role: thread.parent !== 0 ? "treeitem" : void 0,
578
+ children: [
579
+ /* @__PURE__ */ jsxs(HStack, { alignment: "left", spacing: "3", justify: "flex-start", children: [
580
+ /* @__PURE__ */ jsx(
581
+ CommentAuthorInfo,
582
+ {
583
+ avatar: thread?.author_avatar_urls?.[48],
584
+ name: thread?.author_name,
585
+ date: thread?.date,
586
+ userId: thread?.author
587
+ }
588
+ ),
589
+ isExpanded && /* @__PURE__ */ jsx(
590
+ FlexItem,
591
+ {
592
+ className: "editor-collab-sidebar-panel__comment-status",
593
+ onClick: (event) => {
594
+ event.stopPropagation();
595
+ },
596
+ children: /* @__PURE__ */ jsxs(HStack, { spacing: "0", children: [
597
+ canResolve && /* @__PURE__ */ jsx(
598
+ Button,
599
+ {
600
+ label: _x(
601
+ "Resolve",
602
+ "Mark note as resolved"
603
+ ),
604
+ size: "small",
605
+ icon: published,
606
+ disabled: thread.status === "approved",
607
+ accessibleWhenDisabled: thread.status === "approved",
608
+ onClick: () => {
609
+ onEdit({
610
+ id: thread.id,
611
+ status: "approved"
612
+ });
613
+ }
614
+ }
607
615
  ),
608
- size: "small",
609
- icon: published,
610
- disabled: thread.status === "approved",
611
- accessibleWhenDisabled: thread.status === "approved",
612
- onClick: () => {
613
- onEdit({
614
- id: thread.id,
615
- status: "approved"
616
- });
617
- }
618
- }
619
- ),
620
- /* @__PURE__ */ jsxs(Menu, { placement: "bottom-end", children: [
621
- /* @__PURE__ */ jsx(
622
- Menu.TriggerButton,
623
- {
624
- render: /* @__PURE__ */ jsx(
625
- Button,
616
+ /* @__PURE__ */ jsxs(Menu, { placement: "bottom-end", children: [
617
+ /* @__PURE__ */ jsx(
618
+ Menu.TriggerButton,
626
619
  {
627
- ref: actionButtonRef,
628
- size: "small",
629
- icon: moreVertical,
630
- label: __("Actions"),
631
- disabled: !moreActions.length,
632
- accessibleWhenDisabled: true
620
+ render: /* @__PURE__ */ jsx(
621
+ Button,
622
+ {
623
+ ref: actionButtonRef,
624
+ size: "small",
625
+ icon: moreVertical,
626
+ label: __("Actions"),
627
+ disabled: !moreActions.length,
628
+ accessibleWhenDisabled: true
629
+ }
630
+ )
633
631
  }
634
- )
635
- }
636
- ),
637
- /* @__PURE__ */ jsx(Menu.Popover, { children: moreActions.map((action) => /* @__PURE__ */ jsx(
638
- Menu.Item,
639
- {
640
- onClick: () => action.onClick(),
641
- children: /* @__PURE__ */ jsx(Menu.ItemLabel, { children: action.title })
642
- },
643
- action.id
644
- )) })
645
- ] })
646
- ] })
647
- }
648
- )
649
- ] }),
650
- "edit" === actionState ? /* @__PURE__ */ jsx(
651
- CommentForm,
652
- {
653
- onSubmit: (value) => {
654
- onEdit({
655
- id: thread.id,
656
- content: value
657
- });
658
- setActionState(false);
659
- actionButtonRef.current?.focus();
660
- },
661
- onCancel: () => handleCancel(),
662
- thread,
663
- submitButtonText: _x("Update", "verb"),
664
- labelText: sprintf(
665
- // translators: %1$s: note identifier, %2$s: author name.
666
- __("Edit note %1$s by %2$s"),
667
- thread.id,
668
- thread.author_name
669
- ),
670
- reflowComments
671
- }
672
- ) : /* @__PURE__ */ jsx(
673
- RawHTML,
674
- {
675
- className: clsx(
676
- "editor-collab-sidebar-panel__user-comment",
632
+ ),
633
+ /* @__PURE__ */ jsx(Menu.Popover, { children: moreActions.map((action) => /* @__PURE__ */ jsx(
634
+ Menu.Item,
635
+ {
636
+ onClick: () => action.onClick(),
637
+ children: /* @__PURE__ */ jsx(Menu.ItemLabel, { children: action.title })
638
+ },
639
+ action.id
640
+ )) })
641
+ ] })
642
+ ] })
643
+ }
644
+ )
645
+ ] }),
646
+ "edit" === actionState ? /* @__PURE__ */ jsx(
647
+ CommentForm,
677
648
  {
678
- "editor-collab-sidebar-panel__resolution-text": isResolutionComment
649
+ onSubmit: (value) => {
650
+ onEdit({
651
+ id: thread.id,
652
+ content: value
653
+ });
654
+ setActionState(false);
655
+ actionButtonRef.current?.focus();
656
+ },
657
+ onCancel: () => handleCancel(),
658
+ thread,
659
+ submitButtonText: _x("Update", "verb"),
660
+ labelText: sprintf(
661
+ // translators: %1$s: note identifier, %2$s: author name.
662
+ __("Edit note %1$s by %2$s"),
663
+ thread.id,
664
+ thread.author_name
665
+ ),
666
+ reflowComments
667
+ }
668
+ ) : /* @__PURE__ */ jsx(
669
+ RawHTML,
670
+ {
671
+ className: clsx(
672
+ "editor-collab-sidebar-panel__user-comment",
673
+ {
674
+ "editor-collab-sidebar-panel__resolution-text": isResolutionComment
675
+ }
676
+ ),
677
+ children: isResolutionComment ? (() => {
678
+ const actionText = thread.meta._wp_note_status === "resolved" ? __("Marked as resolved") : __("Reopened");
679
+ const content = thread?.content?.raw;
680
+ if (content && typeof content === "string" && content.trim() !== "") {
681
+ return sprintf(
682
+ // translators: %1$s: action label ("Marked as resolved" or "Reopened"); %2$s: note text.
683
+ __("%1$s: %2$s"),
684
+ actionText,
685
+ content
686
+ );
687
+ }
688
+ return actionText;
689
+ })() : thread?.content?.rendered
679
690
  }
680
691
  ),
681
- children: isResolutionComment ? (() => {
682
- const actionText = thread.meta._wp_note_status === "resolved" ? __("Marked as resolved") : __("Reopened");
683
- const content = thread?.content?.raw;
684
- if (content && typeof content === "string" && content.trim() !== "") {
685
- return sprintf(
686
- // translators: %1$s: action label ("Marked as resolved" or "Reopened"); %2$s: note text.
687
- __("%1$s: %2$s"),
688
- actionText,
689
- content
690
- );
692
+ "delete" === actionState && /* @__PURE__ */ jsx(
693
+ ConfirmDialog,
694
+ {
695
+ isOpen: showConfirmDialog,
696
+ onConfirm: handleConfirmDelete,
697
+ onCancel: handleCancel,
698
+ confirmButtonText: __("Delete"),
699
+ children: __(
700
+ "Are you sure you want to delete this note? This will also delete all of this note's replies."
701
+ )
691
702
  }
692
- return actionText;
693
- })() : thread?.content?.rendered
694
- }
695
- ),
696
- "delete" === actionState && /* @__PURE__ */ jsx(
697
- ConfirmDialog,
698
- {
699
- isOpen: showConfirmDialog,
700
- onConfirm: handleConfirmDelete,
701
- onCancel: handleCancel,
702
- confirmButtonText: __("Delete"),
703
- children: __(
704
- "Are you sure you want to delete this note? This will also delete all of this note's replies."
705
703
  )
706
- }
707
- )
708
- ] });
704
+ ]
705
+ }
706
+ );
709
707
  };
710
708
  var comments_default = Comments;
711
709
  export {