@wordpress/editor 14.33.6 → 14.33.8
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/build/components/collab-sidebar/comment-form.js +14 -5
- package/build/components/collab-sidebar/comment-form.js.map +2 -2
- package/build/components/collab-sidebar/comments.js +46 -18
- package/build/components/collab-sidebar/comments.js.map +2 -2
- package/build/components/post-template/panel.js +9 -6
- package/build/components/post-template/panel.js.map +2 -2
- package/build-module/components/collab-sidebar/comment-form.js +14 -5
- package/build-module/components/collab-sidebar/comment-form.js.map +2 -2
- package/build-module/components/collab-sidebar/comments.js +46 -18
- package/build-module/components/collab-sidebar/comments.js.map +2 -2
- package/build-module/components/post-template/panel.js +9 -6
- package/build-module/components/post-template/panel.js.map +2 -2
- package/build-types/components/collab-sidebar/comment-form.d.ts.map +1 -1
- package/build-types/components/collab-sidebar/comments.d.ts.map +1 -1
- package/build-types/components/post-template/panel.d.ts.map +1 -1
- package/package.json +16 -16
- package/src/components/collab-sidebar/comment-form.js +16 -4
- package/src/components/collab-sidebar/comments.js +79 -21
- package/src/components/post-template/panel.js +11 -8
- package/tsconfig.tsbuildinfo +1 -1
|
@@ -37,6 +37,7 @@ var import_element = require("@wordpress/element");
|
|
|
37
37
|
var import_components = require("@wordpress/components");
|
|
38
38
|
var import_i18n = require("@wordpress/i18n");
|
|
39
39
|
var import_compose = require("@wordpress/compose");
|
|
40
|
+
var import_keycodes = require("@wordpress/keycodes");
|
|
40
41
|
var import_utils = require("./utils");
|
|
41
42
|
function CommentForm({
|
|
42
43
|
onSubmit,
|
|
@@ -60,6 +61,12 @@ function CommentForm({
|
|
|
60
61
|
{
|
|
61
62
|
className: "editor-collab-sidebar-panel__comment-form",
|
|
62
63
|
spacing: "4",
|
|
64
|
+
as: "form",
|
|
65
|
+
onSubmit: (event) => {
|
|
66
|
+
event.preventDefault();
|
|
67
|
+
onSubmit(inputComment);
|
|
68
|
+
setInputComment("");
|
|
69
|
+
},
|
|
63
70
|
children: [
|
|
64
71
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.VisuallyHidden, { as: "label", htmlFor: inputId, children: labelText ?? (0, import_i18n.__)("Note") }),
|
|
65
72
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
@@ -72,7 +79,12 @@ function CommentForm({
|
|
|
72
79
|
debouncedCommentUpdated();
|
|
73
80
|
},
|
|
74
81
|
rows: 1,
|
|
75
|
-
maxRows: 20
|
|
82
|
+
maxRows: 20,
|
|
83
|
+
onKeyDown: (event) => {
|
|
84
|
+
if (import_keycodes.isKeyboardEvent.primary(event, "Enter") && !isDisabled) {
|
|
85
|
+
event.target.parentNode.requestSubmit();
|
|
86
|
+
}
|
|
87
|
+
}
|
|
76
88
|
}
|
|
77
89
|
),
|
|
78
90
|
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_components.__experimentalHStack, { spacing: "2", justify: "flex-end", wrap: true, children: [
|
|
@@ -83,10 +95,7 @@ function CommentForm({
|
|
|
83
95
|
size: "compact",
|
|
84
96
|
accessibleWhenDisabled: true,
|
|
85
97
|
variant: "primary",
|
|
86
|
-
|
|
87
|
-
onSubmit(inputComment);
|
|
88
|
-
setInputComment("");
|
|
89
|
-
},
|
|
98
|
+
type: "submit",
|
|
90
99
|
disabled: isDisabled,
|
|
91
100
|
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.__experimentalTruncate, { children: submitButtonText })
|
|
92
101
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/collab-sidebar/comment-form.js"],
|
|
4
|
-
"sourcesContent": ["/**\n * External dependencies\n */\nimport TextareaAutosize from 'react-autosize-textarea';\n\n/**\n * WordPress dependencies\n */\nimport { useState } from '@wordpress/element';\nimport {\n\t__experimentalVStack as VStack,\n\t__experimentalHStack as HStack,\n\t__experimentalTruncate as Truncate,\n\tButton,\n\tVisuallyHidden,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { useInstanceId, useDebounce } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport { sanitizeCommentString, noop } from './utils';\n\nfunction CommentForm( {\n\tonSubmit,\n\tonCancel,\n\tthread,\n\tsubmitButtonText,\n\tlabelText,\n\treflowComments = noop,\n} ) {\n\tconst [ inputComment, setInputComment ] = useState(\n\t\tthread?.content?.raw ?? ''\n\t);\n\n\t// Regularly trigger a reflow as the user types since the textarea may grow or shrink.\n\tconst debouncedCommentUpdated = useDebounce( reflowComments, 100 );\n\n\tconst updateComment = ( value ) => {\n\t\tsetInputComment( value );\n\t};\n\n\tconst inputId = useInstanceId( CommentForm, 'comment-input' );\n\tconst isDisabled =\n\t\tinputComment === thread?.content?.raw ||\n\t\t! sanitizeCommentString( inputComment ).length;\n\n\treturn (\n\t\t<VStack\n\t\t\tclassName=\"editor-collab-sidebar-panel__comment-form\"\n\t\t\tspacing=\"4\"\n\t\t>\n\t\t\t<VisuallyHidden as=\"label\" htmlFor={ inputId }>\n\t\t\t\t{ labelText ?? __( 'Note' ) }\n\t\t\t</VisuallyHidden>\n\t\t\t<TextareaAutosize\n\t\t\t\tid={ inputId }\n\t\t\t\tvalue={ inputComment ?? '' }\n\t\t\t\tonChange={ ( comment ) => {\n\t\t\t\t\tupdateComment( comment.target.value );\n\t\t\t\t\tdebouncedCommentUpdated();\n\t\t\t\t} }\n\t\t\t\trows={ 1 }\n\t\t\t\tmaxRows={ 20 }\n\t\t\t/>\n\t\t\t<HStack spacing=\"2\" justify=\"flex-end\" wrap>\n\t\t\t\t<Button size=\"compact\" variant=\"tertiary\" onClick={ onCancel }>\n\t\t\t\t\t<Truncate>{ __( 'Cancel' ) }</Truncate>\n\t\t\t\t</Button>\n\t\t\t\t<Button\n\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\taccessibleWhenDisabled\n\t\t\t\t\tvariant=\"primary\"\n\t\t\t\t\
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;
|
|
4
|
+
"sourcesContent": ["/**\n * External dependencies\n */\nimport TextareaAutosize from 'react-autosize-textarea';\n\n/**\n * WordPress dependencies\n */\nimport { useState } from '@wordpress/element';\nimport {\n\t__experimentalVStack as VStack,\n\t__experimentalHStack as HStack,\n\t__experimentalTruncate as Truncate,\n\tButton,\n\tVisuallyHidden,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { useInstanceId, useDebounce } from '@wordpress/compose';\nimport { isKeyboardEvent } from '@wordpress/keycodes';\n\n/**\n * Internal dependencies\n */\nimport { sanitizeCommentString, noop } from './utils';\n\nfunction CommentForm( {\n\tonSubmit,\n\tonCancel,\n\tthread,\n\tsubmitButtonText,\n\tlabelText,\n\treflowComments = noop,\n} ) {\n\tconst [ inputComment, setInputComment ] = useState(\n\t\tthread?.content?.raw ?? ''\n\t);\n\n\t// Regularly trigger a reflow as the user types since the textarea may grow or shrink.\n\tconst debouncedCommentUpdated = useDebounce( reflowComments, 100 );\n\n\tconst updateComment = ( value ) => {\n\t\tsetInputComment( value );\n\t};\n\n\tconst inputId = useInstanceId( CommentForm, 'comment-input' );\n\tconst isDisabled =\n\t\tinputComment === thread?.content?.raw ||\n\t\t! sanitizeCommentString( inputComment ).length;\n\n\treturn (\n\t\t<VStack\n\t\t\tclassName=\"editor-collab-sidebar-panel__comment-form\"\n\t\t\tspacing=\"4\"\n\t\t\tas=\"form\"\n\t\t\tonSubmit={ ( event ) => {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tonSubmit( inputComment );\n\t\t\t\tsetInputComment( '' );\n\t\t\t} }\n\t\t>\n\t\t\t<VisuallyHidden as=\"label\" htmlFor={ inputId }>\n\t\t\t\t{ labelText ?? __( 'Note' ) }\n\t\t\t</VisuallyHidden>\n\t\t\t<TextareaAutosize\n\t\t\t\tid={ inputId }\n\t\t\t\tvalue={ inputComment ?? '' }\n\t\t\t\tonChange={ ( comment ) => {\n\t\t\t\t\tupdateComment( comment.target.value );\n\t\t\t\t\tdebouncedCommentUpdated();\n\t\t\t\t} }\n\t\t\t\trows={ 1 }\n\t\t\t\tmaxRows={ 20 }\n\t\t\t\tonKeyDown={ ( event ) => {\n\t\t\t\t\tif (\n\t\t\t\t\t\tisKeyboardEvent.primary( event, 'Enter' ) &&\n\t\t\t\t\t\t! isDisabled\n\t\t\t\t\t) {\n\t\t\t\t\t\tevent.target.parentNode.requestSubmit();\n\t\t\t\t\t}\n\t\t\t\t} }\n\t\t\t/>\n\t\t\t<HStack spacing=\"2\" justify=\"flex-end\" wrap>\n\t\t\t\t<Button size=\"compact\" variant=\"tertiary\" onClick={ onCancel }>\n\t\t\t\t\t<Truncate>{ __( 'Cancel' ) }</Truncate>\n\t\t\t\t</Button>\n\t\t\t\t<Button\n\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\taccessibleWhenDisabled\n\t\t\t\t\tvariant=\"primary\"\n\t\t\t\t\ttype=\"submit\"\n\t\t\t\t\tdisabled={ isDisabled }\n\t\t\t\t>\n\t\t\t\t\t<Truncate>{ submitButtonText }</Truncate>\n\t\t\t\t</Button>\n\t\t\t</HStack>\n\t\t</VStack>\n\t);\n}\n\nexport default CommentForm;\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AA4DG;AAzDH,qCAA6B;AAK7B,qBAAyB;AACzB,wBAMO;AACP,kBAAmB;AACnB,qBAA2C;AAC3C,sBAAgC;AAKhC,mBAA4C;AAE5C,SAAS,YAAa;AAAA,EACrB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,iBAAiB;AAClB,GAAI;AACH,QAAM,CAAE,cAAc,eAAgB,QAAI;AAAA,IACzC,QAAQ,SAAS,OAAO;AAAA,EACzB;AAGA,QAAM,8BAA0B,4BAAa,gBAAgB,GAAI;AAEjE,QAAM,gBAAgB,CAAE,UAAW;AAClC,oBAAiB,KAAM;AAAA,EACxB;AAEA,QAAM,cAAU,8BAAe,aAAa,eAAgB;AAC5D,QAAM,aACL,iBAAiB,QAAQ,SAAS,OAClC,KAAE,oCAAuB,YAAa,EAAE;AAEzC,SACC;AAAA,IAAC,kBAAAA;AAAA,IAAA;AAAA,MACA,WAAU;AAAA,MACV,SAAQ;AAAA,MACR,IAAG;AAAA,MACH,UAAW,CAAE,UAAW;AACvB,cAAM,eAAe;AACrB,iBAAU,YAAa;AACvB,wBAAiB,EAAG;AAAA,MACrB;AAAA,MAEA;AAAA,oDAAC,oCAAe,IAAG,SAAQ,SAAU,SAClC,2BAAa,gBAAI,MAAO,GAC3B;AAAA,QACA;AAAA,UAAC,+BAAAC;AAAA,UAAA;AAAA,YACA,IAAK;AAAA,YACL,OAAQ,gBAAgB;AAAA,YACxB,UAAW,CAAE,YAAa;AACzB,4BAAe,QAAQ,OAAO,KAAM;AACpC,sCAAwB;AAAA,YACzB;AAAA,YACA,MAAO;AAAA,YACP,SAAU;AAAA,YACV,WAAY,CAAE,UAAW;AACxB,kBACC,gCAAgB,QAAS,OAAO,OAAQ,KACxC,CAAE,YACD;AACD,sBAAM,OAAO,WAAW,cAAc;AAAA,cACvC;AAAA,YACD;AAAA;AAAA,QACD;AAAA,QACA,6CAAC,kBAAAC,sBAAA,EAAO,SAAQ,KAAI,SAAQ,YAAW,MAAI,MAC1C;AAAA,sDAAC,4BAAO,MAAK,WAAU,SAAQ,YAAW,SAAU,UACnD,sDAAC,kBAAAC,wBAAA,EAAW,8BAAI,QAAS,GAAG,GAC7B;AAAA,UACA;AAAA,YAAC;AAAA;AAAA,cACA,MAAK;AAAA,cACL,wBAAsB;AAAA,cACtB,SAAQ;AAAA,cACR,MAAK;AAAA,cACL,UAAW;AAAA,cAEX,sDAAC,kBAAAA,wBAAA,EAAW,4BAAkB;AAAA;AAAA,UAC/B;AAAA,WACD;AAAA;AAAA;AAAA,EACD;AAEF;AAEA,IAAO,uBAAQ;",
|
|
6
6
|
"names": ["VStack", "TextareaAutosize", "HStack", "Truncate"]
|
|
7
7
|
}
|
|
@@ -68,6 +68,9 @@ function Comments({
|
|
|
68
68
|
const [boardOffsets, setBoardOffsets] = (0, import_element.useState)({});
|
|
69
69
|
const [blockRefs, setBlockRefs] = (0, import_element.useState)({});
|
|
70
70
|
const { setCanvasMinHeight } = (0, import_lock_unlock.unlock)((0, import_data.useDispatch)(import_store.store));
|
|
71
|
+
const { selectBlock, toggleBlockSpotlight } = (0, import_lock_unlock.unlock)(
|
|
72
|
+
(0, import_data.useDispatch)(import_block_editor.store)
|
|
73
|
+
);
|
|
71
74
|
const { blockCommentId, selectedBlockClientId, orderedBlockIds } = (0, import_data.useSelect)((select) => {
|
|
72
75
|
const {
|
|
73
76
|
getBlockAttributes,
|
|
@@ -233,6 +236,40 @@ function Comments({
|
|
|
233
236
|
selectedThread,
|
|
234
237
|
setCanvasMinHeight
|
|
235
238
|
]);
|
|
239
|
+
const handleThreadNavigation = (event, thread, isSelected) => {
|
|
240
|
+
if (event.defaultPrevented) {
|
|
241
|
+
return;
|
|
242
|
+
}
|
|
243
|
+
const currentIndex = threads.findIndex((t) => t.id === thread.id);
|
|
244
|
+
if ((event.key === "Enter" || event.key === "ArrowRight") && event.currentTarget === event.target && !isSelected) {
|
|
245
|
+
setNewNoteFormState("closed");
|
|
246
|
+
setSelectedThread(thread.id);
|
|
247
|
+
if (!!thread.blockClientId) {
|
|
248
|
+
selectBlock(thread.blockClientId, null);
|
|
249
|
+
toggleBlockSpotlight(thread.blockClientId, true);
|
|
250
|
+
}
|
|
251
|
+
} else if ((event.key === "Enter" || event.key === "ArrowLeft") && event.currentTarget === event.target && isSelected || event.key === "Escape") {
|
|
252
|
+
setSelectedThread(null);
|
|
253
|
+
setNewNoteFormState("closed");
|
|
254
|
+
if (thread.blockClientId) {
|
|
255
|
+
toggleBlockSpotlight(thread.blockClientId, false);
|
|
256
|
+
}
|
|
257
|
+
(0, import_utils.focusCommentThread)(thread.id, commentSidebarRef.current);
|
|
258
|
+
} else if (event.key === "ArrowDown" && currentIndex < threads.length - 1 && event.currentTarget === event.target) {
|
|
259
|
+
const nextThread = threads[currentIndex + 1];
|
|
260
|
+
(0, import_utils.focusCommentThread)(nextThread.id, commentSidebarRef.current);
|
|
261
|
+
} else if (event.key === "ArrowUp" && currentIndex > 0 && event.currentTarget === event.target) {
|
|
262
|
+
const prevThread = threads[currentIndex - 1];
|
|
263
|
+
(0, import_utils.focusCommentThread)(prevThread.id, commentSidebarRef.current);
|
|
264
|
+
} else if (event.key === "Home" && event.currentTarget === event.target) {
|
|
265
|
+
(0, import_utils.focusCommentThread)(threads[0].id, commentSidebarRef.current);
|
|
266
|
+
} else if (event.key === "End" && event.currentTarget === event.target) {
|
|
267
|
+
(0, import_utils.focusCommentThread)(
|
|
268
|
+
threads[threads.length - 1].id,
|
|
269
|
+
commentSidebarRef.current
|
|
270
|
+
);
|
|
271
|
+
}
|
|
272
|
+
};
|
|
236
273
|
const hasThreads = Array.isArray(threads) && threads.length > 0;
|
|
237
274
|
if (!hasThreads && !isFloating) {
|
|
238
275
|
return null;
|
|
@@ -265,7 +302,12 @@ function Comments({
|
|
|
265
302
|
setBlockRef,
|
|
266
303
|
selectedThread,
|
|
267
304
|
commentLastUpdated,
|
|
268
|
-
newNoteFormState
|
|
305
|
+
newNoteFormState,
|
|
306
|
+
onKeyDown: (event) => handleThreadNavigation(
|
|
307
|
+
event,
|
|
308
|
+
thread,
|
|
309
|
+
selectedThread === thread.id
|
|
310
|
+
)
|
|
269
311
|
},
|
|
270
312
|
thread.id
|
|
271
313
|
))
|
|
@@ -287,7 +329,8 @@ function Thread({
|
|
|
287
329
|
setSelectedThread,
|
|
288
330
|
selectedThread,
|
|
289
331
|
commentLastUpdated,
|
|
290
|
-
newNoteFormState
|
|
332
|
+
newNoteFormState,
|
|
333
|
+
onKeyDown
|
|
291
334
|
}) {
|
|
292
335
|
const { toggleBlockHighlight, selectBlock, toggleBlockSpotlight } = (0, import_lock_unlock.unlock)(
|
|
293
336
|
(0, import_data.useDispatch)(import_block_editor.store)
|
|
@@ -369,22 +412,7 @@ function Thread({
|
|
|
369
412
|
onMouseLeave,
|
|
370
413
|
onFocus: onMouseEnter,
|
|
371
414
|
onBlur: onMouseLeave,
|
|
372
|
-
onKeyDown
|
|
373
|
-
if (event.defaultPrevented) {
|
|
374
|
-
return;
|
|
375
|
-
}
|
|
376
|
-
if (event.key === "Enter" && event.currentTarget === event.target) {
|
|
377
|
-
if (isSelected) {
|
|
378
|
-
unselectThread();
|
|
379
|
-
} else {
|
|
380
|
-
handleCommentSelect();
|
|
381
|
-
}
|
|
382
|
-
}
|
|
383
|
-
if (event.key === "Escape") {
|
|
384
|
-
unselectThread();
|
|
385
|
-
(0, import_utils.focusCommentThread)(thread.id, commentSidebarRef.current);
|
|
386
|
-
}
|
|
387
|
-
},
|
|
415
|
+
onKeyDown,
|
|
388
416
|
tabIndex: 0,
|
|
389
417
|
role: "treeitem",
|
|
390
418
|
"aria-label": ariaLabel,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/collab-sidebar/comments.js"],
|
|
4
|
-
"sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tuseState,\n\tRawHTML,\n\tuseEffect,\n\tuseCallback,\n\tuseMemo,\n\tuseRef,\n} from '@wordpress/element';\nimport {\n\t__experimentalText as Text,\n\t__experimentalHStack as HStack,\n\t__experimentalVStack as VStack,\n\t__experimentalConfirmDialog as ConfirmDialog,\n\tButton,\n\tFlexItem,\n\tprivateApis as componentsPrivateApis,\n} from '@wordpress/components';\nimport { useDebounce } from '@wordpress/compose';\n\nimport { published, moreVertical } from '@wordpress/icons';\nimport { __, _x, sprintf, _n } from '@wordpress/i18n';\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { __unstableStripHTML as stripHTML } from '@wordpress/dom';\nimport {\n\tstore as blockEditorStore,\n\tprivateApis as blockEditorPrivateApis,\n} from '@wordpress/block-editor';\n\n/**\n * Internal dependencies\n */\nimport { unlock } from '../../lock-unlock';\nimport CommentAuthorInfo from './comment-author-info';\nimport CommentForm from './comment-form';\nimport { focusCommentThread, getCommentExcerpt } from './utils';\nimport { useFloatingThread } from './hooks';\nimport { AddComment } from './add-comment';\nimport { store as editorStore } from '../../store';\n\nconst { useBlockElement } = unlock( blockEditorPrivateApis );\nconst { Menu } = unlock( componentsPrivateApis );\n\nexport function Comments( {\n\tthreads: noteThreads,\n\tonEditComment,\n\tonAddReply,\n\tonCommentDelete,\n\tnewNoteFormState,\n\tsetNewNoteFormState,\n\tcommentSidebarRef,\n\treflowComments,\n\tisFloating = false,\n\tcommentLastUpdated,\n} ) {\n\tconst [ heights, setHeights ] = useState( {} );\n\tconst [ selectedThread, setSelectedThread ] = useState( null );\n\tconst [ boardOffsets, setBoardOffsets ] = useState( {} );\n\tconst [ blockRefs, setBlockRefs ] = useState( {} );\n\n\tconst { setCanvasMinHeight } = unlock( useDispatch( editorStore ) );\n\tconst { blockCommentId, selectedBlockClientId, orderedBlockIds } =\n\t\tuseSelect( ( select ) => {\n\t\t\tconst {\n\t\t\t\tgetBlockAttributes,\n\t\t\t\tgetSelectedBlockClientId,\n\t\t\t\tgetClientIdsWithDescendants,\n\t\t\t} = select( blockEditorStore );\n\t\t\tconst clientId = getSelectedBlockClientId();\n\t\t\treturn {\n\t\t\t\tblockCommentId: clientId\n\t\t\t\t\t? getBlockAttributes( clientId )?.metadata?.noteId\n\t\t\t\t\t: null,\n\t\t\t\tselectedBlockClientId: clientId,\n\t\t\t\torderedBlockIds: getClientIdsWithDescendants(),\n\t\t\t};\n\t\t}, [] );\n\n\tconst relatedBlockElement = useBlockElement( selectedBlockClientId );\n\n\tconst threads = useMemo( () => {\n\t\tconst t = [ ...noteThreads ];\n\t\tconst orderedThreads = [];\n\t\t// In floating mode, when the note board is shown, and as long\n\t\t// as the selected block doesn't have an existing note attached -\n\t\t// add a \"new note\" entry to the threads. This special thread type\n\t\t// gets sorted and floated like regular threads, but shows an AddComment\n\t\t// component instead of a regular comment thread.\n\t\tif ( isFloating && newNoteFormState === 'open' ) {\n\t\t\t// Insert the new note entry at the correct location for its blockId.\n\t\t\tconst newNoteThread = {\n\t\t\t\tid: 'new-note-thread',\n\t\t\t\tblockClientId: selectedBlockClientId,\n\t\t\t\tcontent: { rendered: '' },\n\t\t\t};\n\t\t\t// Insert the new comment block at the right order within the threads.\n\t\t\torderedBlockIds.forEach( ( blockId ) => {\n\t\t\t\tif ( blockId === selectedBlockClientId ) {\n\t\t\t\t\torderedThreads.push( newNoteThread );\n\t\t\t\t} else {\n\t\t\t\t\tconst threadForBlock = t.find(\n\t\t\t\t\t\t( thread ) => thread.blockClientId === blockId\n\t\t\t\t\t);\n\t\t\t\t\tif ( threadForBlock ) {\n\t\t\t\t\t\torderedThreads.push( threadForBlock );\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t} );\n\t\t\treturn orderedThreads;\n\t\t}\n\t\treturn t;\n\t}, [\n\t\tnoteThreads,\n\t\tisFloating,\n\t\tnewNoteFormState,\n\t\tselectedBlockClientId,\n\t\torderedBlockIds,\n\t] );\n\n\tconst handleDelete = async ( comment ) => {\n\t\tconst currentIndex = threads.findIndex( ( t ) => t.id === comment.id );\n\t\tconst nextThread = threads[ currentIndex + 1 ];\n\t\tconst prevThread = threads[ currentIndex - 1 ];\n\n\t\tawait onCommentDelete( comment );\n\n\t\tif ( comment.parent !== 0 ) {\n\t\t\t// Move focus to the parent thread when a reply was deleted.\n\t\t\tsetSelectedThread( comment.parent );\n\t\t\tfocusCommentThread( comment.parent, commentSidebarRef.current );\n\t\t\treturn;\n\t\t}\n\n\t\tif ( nextThread ) {\n\t\t\tsetSelectedThread( nextThread.id );\n\t\t\tfocusCommentThread( nextThread.id, commentSidebarRef.current );\n\t\t} else if ( prevThread ) {\n\t\t\tsetSelectedThread( prevThread.id );\n\t\t\tfocusCommentThread( prevThread.id, commentSidebarRef.current );\n\t\t} else {\n\t\t\tsetSelectedThread( null );\n\t\t\tsetNewNoteFormState( 'closed' );\n\t\t\t// Move focus to the related block.\n\t\t\trelatedBlockElement?.focus();\n\t\t}\n\t};\n\n\t// Auto-select the related comment thread when a block is selected.\n\tuseEffect( () => {\n\t\t// Fallback to 'new-note-thread' when showing the comment board for a new note.\n\t\tsetSelectedThread(\n\t\t\tnewNoteFormState === 'open' ? 'new-note-thread' : blockCommentId\n\t\t);\n\t}, [ blockCommentId, newNoteFormState ] );\n\n\tconst setBlockRef = useCallback( ( id, blockRef ) => {\n\t\tsetBlockRefs( ( prev ) => ( { ...prev, [ id ]: blockRef } ) );\n\t}, [] );\n\n\t// Recalculate floating comment thread offsets whenever the heights change.\n\tuseEffect( () => {\n\t\t/**\n\t\t * Calculate the y offsets for all comment threads. Account for potentially\n\t\t * overlapping threads and adjust their positions accordingly.\n\t\t */\n\t\tconst calculateAllOffsets = () => {\n\t\t\tconst offsets = {};\n\n\t\t\tif ( ! isFloating ) {\n\t\t\t\treturn { offsets, minHeight: 0 };\n\t\t\t}\n\n\t\t\t// Find the index of the selected thread.\n\t\t\tconst selectedThreadIndex = threads.findIndex(\n\t\t\t\t( t ) => t.id === selectedThread\n\t\t\t);\n\n\t\t\tconst breakIndex =\n\t\t\t\tselectedThreadIndex === -1 ? 0 : selectedThreadIndex;\n\n\t\t\t// If there is a selected thread, push threads above up and threads below down.\n\t\t\tconst selectedThreadData = threads[ breakIndex ];\n\n\t\t\tif (\n\t\t\t\t! selectedThreadData ||\n\t\t\t\t! blockRefs[ selectedThreadData.id ]\n\t\t\t) {\n\t\t\t\treturn { offsets, minHeight: 0 };\n\t\t\t}\n\n\t\t\tlet blockElement = blockRefs[ selectedThreadData.id ];\n\t\t\tlet blockRect = blockElement?.getBoundingClientRect();\n\t\t\tconst selectedThreadTop = blockRect?.top || 0;\n\t\t\tconst selectedThreadHeight = heights[ selectedThreadData.id ] || 0;\n\n\t\t\toffsets[ selectedThreadData.id ] = -16;\n\n\t\t\tlet previousThreadData = {\n\t\t\t\tthreadTop: selectedThreadTop - 16,\n\t\t\t\tthreadHeight: selectedThreadHeight,\n\t\t\t};\n\n\t\t\t// Process threads after the selected thread, offsetting any overlapping\n\t\t\t// threads downward.\n\t\t\tfor ( let i = breakIndex + 1; i < threads.length; i++ ) {\n\t\t\t\tconst thread = threads[ i ];\n\t\t\t\tif ( ! blockRefs[ thread.id ] ) {\n\t\t\t\t\tcontinue;\n\t\t\t\t}\n\n\t\t\t\tblockElement = blockRefs[ thread.id ];\n\t\t\t\tblockRect = blockElement?.getBoundingClientRect();\n\t\t\t\tconst threadTop = blockRect?.top || 0;\n\t\t\t\tconst threadHeight = heights[ thread.id ] || 0;\n\n\t\t\t\tlet additionalOffset = -16;\n\n\t\t\t\t// Check if the thread overlaps with the previous one.\n\t\t\t\tconst previousBottom =\n\t\t\t\t\tpreviousThreadData.threadTop +\n\t\t\t\t\tpreviousThreadData.threadHeight;\n\t\t\t\tif ( threadTop < previousBottom + 16 ) {\n\t\t\t\t\t// Shift down by the difference plus a margin to avoid overlap.\n\t\t\t\t\tadditionalOffset = previousBottom - threadTop + 20;\n\t\t\t\t}\n\n\t\t\t\toffsets[ thread.id ] = additionalOffset;\n\n\t\t\t\t// Update for next iteration.\n\t\t\t\tpreviousThreadData = {\n\t\t\t\t\tthreadTop: threadTop + additionalOffset,\n\t\t\t\t\tthreadHeight,\n\t\t\t\t};\n\t\t\t}\n\n\t\t\t// Process threads before the selected thread, offsetting any overlapping\n\t\t\t// threads upward.\n\t\t\tlet nextThreadData = {\n\t\t\t\tthreadTop: selectedThreadTop - 16,\n\t\t\t};\n\n\t\t\tfor ( let i = selectedThreadIndex - 1; i >= 0; i-- ) {\n\t\t\t\tconst thread = threads[ i ];\n\t\t\t\tif ( ! blockRefs[ thread.id ] ) {\n\t\t\t\t\tcontinue;\n\t\t\t\t}\n\n\t\t\t\tblockElement = blockRefs[ thread.id ];\n\t\t\t\tblockRect = blockElement?.getBoundingClientRect();\n\t\t\t\tconst threadTop = blockRect?.top || 0;\n\t\t\t\tconst threadHeight = heights[ thread.id ] || 0;\n\n\t\t\t\tlet additionalOffset = -16;\n\n\t\t\t\t// Calculate the bottom position of this thread with default offset.\n\t\t\t\tconst threadBottom = threadTop + threadHeight;\n\n\t\t\t\t// Check if this thread's bottom would overlap with the next thread's top.\n\t\t\t\tif ( threadBottom > nextThreadData.threadTop ) {\n\t\t\t\t\t// Shift up by the difference plus a margin to avoid overlap.\n\t\t\t\t\tadditionalOffset =\n\t\t\t\t\t\tnextThreadData.threadTop -\n\t\t\t\t\t\tthreadTop -\n\t\t\t\t\t\tthreadHeight -\n\t\t\t\t\t\t20;\n\t\t\t\t}\n\n\t\t\t\toffsets[ thread.id ] = additionalOffset;\n\n\t\t\t\t// Update for next iteration (going upward).\n\t\t\t\tnextThreadData = {\n\t\t\t\t\tthreadTop: threadTop + additionalOffset,\n\t\t\t\t};\n\t\t\t}\n\n\t\t\tlet editorMinHeight = 0;\n\t\t\t// Take the calculated top of the final note plus its height as the editor min height.\n\t\t\tconst lastThread = threads[ threads.length - 1 ];\n\t\t\tif ( blockRefs[ lastThread.id ] ) {\n\t\t\t\tconst lastBlockElement = blockRefs[ lastThread.id ];\n\t\t\t\tconst lastBlockRect = lastBlockElement?.getBoundingClientRect();\n\t\t\t\tconst lastThreadTop = lastBlockRect?.top || 0;\n\t\t\t\tconst lastThreadHeight = heights[ lastThread.id ] || 0;\n\t\t\t\tconst lastThreadOffset = offsets[ lastThread.id ] || 0;\n\t\t\t\teditorMinHeight =\n\t\t\t\t\tlastThreadTop + lastThreadHeight + lastThreadOffset + 32;\n\t\t\t}\n\n\t\t\treturn { offsets, minHeight: editorMinHeight };\n\t\t};\n\t\tconst { offsets: newOffsets, minHeight } = calculateAllOffsets();\n\t\tif ( Object.keys( newOffsets ).length > 0 ) {\n\t\t\tsetBoardOffsets( newOffsets );\n\t\t}\n\t\t// Ensure the editor has enough height to scroll to all notes.\n\t\tsetCanvasMinHeight( minHeight );\n\t}, [\n\t\theights,\n\t\tblockRefs,\n\t\tisFloating,\n\t\tthreads,\n\t\tselectedThread,\n\t\tsetCanvasMinHeight,\n\t] );\n\n\tconst hasThreads = Array.isArray( threads ) && threads.length > 0;\n\t// This should no longer happen since https://github.com/WordPress/gutenberg/pull/72872.\n\tif ( ! hasThreads && ! isFloating ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<>\n\t\t\t{ ! isFloating && newNoteFormState === 'open' && (\n\t\t\t\t<AddComment\n\t\t\t\t\tonSubmit={ onAddReply }\n\t\t\t\t\tnewNoteFormState={ newNoteFormState }\n\t\t\t\t\tsetNewNoteFormState={ setNewNoteFormState }\n\t\t\t\t\tcommentSidebarRef={ commentSidebarRef }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t{ threads.map( ( thread ) => (\n\t\t\t\t<Thread\n\t\t\t\t\tkey={ thread.id }\n\t\t\t\t\tthread={ thread }\n\t\t\t\t\tonAddReply={ onAddReply }\n\t\t\t\t\tonCommentDelete={ handleDelete }\n\t\t\t\t\tonEditComment={ onEditComment }\n\t\t\t\t\tisSelected={ selectedThread === thread.id }\n\t\t\t\t\tsetSelectedThread={ setSelectedThread }\n\t\t\t\t\tsetNewNoteFormState={ setNewNoteFormState }\n\t\t\t\t\tcommentSidebarRef={ commentSidebarRef }\n\t\t\t\t\treflowComments={ reflowComments }\n\t\t\t\t\tisFloating={ isFloating }\n\t\t\t\t\tcalculatedOffset={ boardOffsets[ thread.id ] ?? 0 }\n\t\t\t\t\tsetHeights={ setHeights }\n\t\t\t\t\tsetBlockRef={ setBlockRef }\n\t\t\t\t\tselectedThread={ selectedThread }\n\t\t\t\t\tcommentLastUpdated={ commentLastUpdated }\n\t\t\t\t\tnewNoteFormState={ newNoteFormState }\n\t\t\t\t/>\n\t\t\t) ) }\n\t\t</>\n\t);\n}\n\nfunction Thread( {\n\tthread,\n\tonEditComment,\n\tonAddReply,\n\tonCommentDelete,\n\tisSelected,\n\tsetNewNoteFormState,\n\tcommentSidebarRef,\n\treflowComments,\n\tisFloating,\n\tcalculatedOffset,\n\tsetHeights,\n\tsetBlockRef,\n\tsetSelectedThread,\n\tselectedThread,\n\tcommentLastUpdated,\n\tnewNoteFormState,\n} ) {\n\tconst { toggleBlockHighlight, selectBlock, toggleBlockSpotlight } = unlock(\n\t\tuseDispatch( blockEditorStore )\n\t);\n\tconst relatedBlockElement = useBlockElement( thread.blockClientId );\n\tconst debouncedToggleBlockHighlight = useDebounce(\n\t\ttoggleBlockHighlight,\n\t\t50\n\t);\n\tconst { y, refs } = useFloatingThread( {\n\t\tthread,\n\t\tcalculatedOffset,\n\t\tsetHeights,\n\t\tsetBlockRef,\n\t\tselectedThread,\n\t\tcommentLastUpdated,\n\t} );\n\n\tconst onMouseEnter = () => {\n\t\tdebouncedToggleBlockHighlight( thread.blockClientId, true );\n\t};\n\n\tconst onMouseLeave = () => {\n\t\tdebouncedToggleBlockHighlight( thread.blockClientId, false );\n\t};\n\n\tconst handleCommentSelect = () => {\n\t\tsetNewNoteFormState( 'closed' );\n\t\tsetSelectedThread( thread.id );\n\t\tif ( !! thread.blockClientId ) {\n\t\t\t// Pass `null` as the second parameter to prevent focusing the block.\n\t\t\tselectBlock( thread.blockClientId, null );\n\t\t\ttoggleBlockSpotlight( thread.blockClientId, true );\n\t\t}\n\t};\n\n\tconst unselectThread = () => {\n\t\tsetSelectedThread( null );\n\t\tsetNewNoteFormState( 'closed' );\n\t\ttoggleBlockSpotlight( thread.blockClientId, false );\n\t};\n\n\tconst allReplies = thread?.reply || [];\n\n\tconst lastReply =\n\t\tallReplies.length > 0 ? allReplies[ allReplies.length - 1 ] : undefined;\n\tconst restReplies = allReplies.length > 0 ? allReplies.slice( 0, -1 ) : [];\n\n\tconst commentExcerpt = getCommentExcerpt(\n\t\tstripHTML( thread.content?.rendered ),\n\t\t10\n\t);\n\tconst ariaLabel = !! thread.blockClientId\n\t\t? sprintf(\n\t\t\t\t// translators: %s: note excerpt\n\t\t\t\t__( 'Note: %s' ),\n\t\t\t\tcommentExcerpt\n\t\t )\n\t\t: sprintf(\n\t\t\t\t// translators: %s: note excerpt\n\t\t\t\t__( 'Original block deleted. Note: %s' ),\n\t\t\t\tcommentExcerpt\n\t\t );\n\n\tif (\n\t\tthread.id === 'new-note-thread' &&\n\t\tnewNoteFormState === 'open' &&\n\t\tisFloating\n\t) {\n\t\treturn (\n\t\t\t<AddComment\n\t\t\t\tonSubmit={ onAddReply }\n\t\t\t\tnewNoteFormState={ newNoteFormState }\n\t\t\t\tsetNewNoteFormState={ setNewNoteFormState }\n\t\t\t\tcommentSidebarRef={ commentSidebarRef }\n\t\t\t\treflowComments={ reflowComments }\n\t\t\t\tisFloating={ isFloating }\n\t\t\t\ty={ y }\n\t\t\t\trefs={ refs }\n\t\t\t/>\n\t\t);\n\t}\n\n\treturn (\n\t\t<VStack\n\t\t\tclassName={ clsx( 'editor-collab-sidebar-panel__thread', {\n\t\t\t\t'is-selected': isSelected,\n\t\t\t\t'is-floating': isFloating,\n\t\t\t} ) }\n\t\t\tid={ `comment-thread-${ thread.id }` }\n\t\t\tspacing=\"3\"\n\t\t\tonClick={ handleCommentSelect }\n\t\t\tonMouseEnter={ onMouseEnter }\n\t\t\tonMouseLeave={ onMouseLeave }\n\t\t\tonFocus={ onMouseEnter }\n\t\t\tonBlur={ onMouseLeave }\n\t\t\tonKeyDown={ ( event ) => {\n\t\t\t\tif ( event.defaultPrevented ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\t// Expand or Collapse thread.\n\t\t\t\tif (\n\t\t\t\t\tevent.key === 'Enter' &&\n\t\t\t\t\tevent.currentTarget === event.target\n\t\t\t\t) {\n\t\t\t\t\tif ( isSelected ) {\n\t\t\t\t\t\tunselectThread();\n\t\t\t\t\t} else {\n\t\t\t\t\t\thandleCommentSelect();\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\t// Collapse thread and focus the thread.\n\t\t\t\tif ( event.key === 'Escape' ) {\n\t\t\t\t\tunselectThread();\n\t\t\t\t\tfocusCommentThread( thread.id, commentSidebarRef.current );\n\t\t\t\t}\n\t\t\t} }\n\t\t\ttabIndex={ 0 }\n\t\t\trole=\"treeitem\"\n\t\t\taria-label={ ariaLabel }\n\t\t\taria-expanded={ isSelected }\n\t\t\tref={ isFloating ? refs.setFloating : undefined }\n\t\t\tstyle={ isFloating ? { top: y } : undefined }\n\t\t>\n\t\t\t<Button\n\t\t\t\tclassName=\"editor-collab-sidebar-panel__skip-to-comment\"\n\t\t\t\tvariant=\"secondary\"\n\t\t\t\tsize=\"compact\"\n\t\t\t\tonClick={ () => {\n\t\t\t\t\tfocusCommentThread(\n\t\t\t\t\t\tthread.id,\n\t\t\t\t\t\tcommentSidebarRef.current,\n\t\t\t\t\t\t'textarea'\n\t\t\t\t\t);\n\t\t\t\t} }\n\t\t\t>\n\t\t\t\t{ __( 'Add new note' ) }\n\t\t\t</Button>\n\t\t\t{ ! thread.blockClientId && (\n\t\t\t\t<Text as=\"p\" weight={ 500 } variant=\"muted\">\n\t\t\t\t\t{ __( 'Original block deleted.' ) }\n\t\t\t\t</Text>\n\t\t\t) }\n\t\t\t<CommentBoard\n\t\t\t\tthread={ thread }\n\t\t\t\tisExpanded={ isSelected }\n\t\t\t\tonEdit={ ( params = {} ) => {\n\t\t\t\t\tonEditComment( params );\n\t\t\t\t\tif ( params.status === 'approved' ) {\n\t\t\t\t\t\tunselectThread();\n\t\t\t\t\t\tif ( isFloating ) {\n\t\t\t\t\t\t\trelatedBlockElement?.focus();\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tfocusCommentThread(\n\t\t\t\t\t\t\t\tthread.id,\n\t\t\t\t\t\t\t\tcommentSidebarRef.current\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t} }\n\t\t\t\tonDelete={ onCommentDelete }\n\t\t\t\treflowComments={ reflowComments }\n\t\t\t/>\n\t\t\t{ isSelected &&\n\t\t\t\tallReplies.map( ( reply ) => (\n\t\t\t\t\t<CommentBoard\n\t\t\t\t\t\tkey={ reply.id }\n\t\t\t\t\t\tthread={ reply }\n\t\t\t\t\t\tparent={ thread }\n\t\t\t\t\t\tisExpanded={ isSelected }\n\t\t\t\t\t\tonEdit={ onEditComment }\n\t\t\t\t\t\tonDelete={ onCommentDelete }\n\t\t\t\t\t\treflowComments={ reflowComments }\n\t\t\t\t\t/>\n\t\t\t\t) ) }\n\t\t\t{ ! isSelected && restReplies.length > 0 && (\n\t\t\t\t<HStack className=\"editor-collab-sidebar-panel__more-reply-separator\">\n\t\t\t\t\t<Button\n\t\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\tclassName=\"editor-collab-sidebar-panel__more-reply-button\"\n\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\tsetSelectedThread( thread.id );\n\t\t\t\t\t\t\tfocusCommentThread(\n\t\t\t\t\t\t\t\tthread.id,\n\t\t\t\t\t\t\t\tcommentSidebarRef.current\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ sprintf(\n\t\t\t\t\t\t\t// translators: %s: number of replies.\n\t\t\t\t\t\t\t_n(\n\t\t\t\t\t\t\t\t'%s more reply',\n\t\t\t\t\t\t\t\t'%s more replies',\n\t\t\t\t\t\t\t\trestReplies.length\n\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\trestReplies.length\n\t\t\t\t\t\t) }\n\t\t\t\t\t</Button>\n\t\t\t\t</HStack>\n\t\t\t) }\n\t\t\t{ ! isSelected && lastReply && (\n\t\t\t\t<CommentBoard\n\t\t\t\t\tthread={ lastReply }\n\t\t\t\t\tparent={ thread }\n\t\t\t\t\tisExpanded={ isSelected }\n\t\t\t\t\tonEdit={ onEditComment }\n\t\t\t\t\tonDelete={ onCommentDelete }\n\t\t\t\t\treflowComments={ reflowComments }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t{ isSelected && (\n\t\t\t\t<VStack spacing=\"2\" role=\"treeitem\">\n\t\t\t\t\t<HStack alignment=\"left\" spacing=\"3\" justify=\"flex-start\">\n\t\t\t\t\t\t<CommentAuthorInfo />\n\t\t\t\t\t</HStack>\n\t\t\t\t\t<VStack spacing=\"2\">\n\t\t\t\t\t\t<CommentForm\n\t\t\t\t\t\t\tonSubmit={ ( inputComment ) => {\n\t\t\t\t\t\t\t\tif ( 'approved' === thread.status ) {\n\t\t\t\t\t\t\t\t\t// For reopening, include the content in the reopen action.\n\t\t\t\t\t\t\t\t\tonEditComment( {\n\t\t\t\t\t\t\t\t\t\tid: thread.id,\n\t\t\t\t\t\t\t\t\t\tstatus: 'hold',\n\t\t\t\t\t\t\t\t\t\tcontent: inputComment,\n\t\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\t// For regular replies, add as separate comment.\n\t\t\t\t\t\t\t\t\tonAddReply( {\n\t\t\t\t\t\t\t\t\t\tcontent: inputComment,\n\t\t\t\t\t\t\t\t\t\tparent: thread.id,\n\t\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tonCancel={ ( event ) => {\n\t\t\t\t\t\t\t\t// Prevent the parent onClick from being triggered.\n\t\t\t\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\t\t\t\tunselectThread();\n\t\t\t\t\t\t\t\tfocusCommentThread(\n\t\t\t\t\t\t\t\t\tthread.id,\n\t\t\t\t\t\t\t\t\tcommentSidebarRef.current\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tsubmitButtonText={\n\t\t\t\t\t\t\t\t'approved' === thread.status\n\t\t\t\t\t\t\t\t\t? __( 'Reopen & Reply' )\n\t\t\t\t\t\t\t\t\t: __( 'Reply' )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\trows={ 'approved' === thread.status ? 2 : 4 }\n\t\t\t\t\t\t\tlabelText={ sprintf(\n\t\t\t\t\t\t\t\t// translators: %1$s: note identifier, %2$s: author name\n\t\t\t\t\t\t\t\t__( 'Reply to note %1$s by %2$s' ),\n\t\t\t\t\t\t\t\tthread.id,\n\t\t\t\t\t\t\t\tthread.author_name\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\treflowComments={ reflowComments }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</VStack>\n\t\t\t\t</VStack>\n\t\t\t) }\n\t\t\t{ !! thread.blockClientId && (\n\t\t\t\t<Button\n\t\t\t\t\tclassName=\"editor-collab-sidebar-panel__skip-to-block\"\n\t\t\t\t\tvariant=\"secondary\"\n\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\tonClick={ ( event ) => {\n\t\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\t\trelatedBlockElement?.focus();\n\t\t\t\t\t} }\n\t\t\t\t>\n\t\t\t\t\t{ __( 'Back to block' ) }\n\t\t\t\t</Button>\n\t\t\t) }\n\t\t</VStack>\n\t);\n}\n\nconst CommentBoard = ( {\n\tthread,\n\tparent,\n\tisExpanded,\n\tonEdit,\n\tonDelete,\n\treflowComments,\n} ) => {\n\tconst [ actionState, setActionState ] = useState( false );\n\tconst [ showConfirmDialog, setShowConfirmDialog ] = useState( false );\n\tconst actionButtonRef = useRef( null );\n\tconst handleConfirmDelete = () => {\n\t\tonDelete( thread );\n\t\tsetActionState( false );\n\t\tsetShowConfirmDialog( false );\n\t};\n\n\tconst handleCancel = () => {\n\t\tsetActionState( false );\n\t\tsetShowConfirmDialog( false );\n\t\tactionButtonRef.current?.focus();\n\t};\n\n\t// Check if this is a resolution comment by checking metadata.\n\tconst isResolutionComment =\n\t\tthread.type === 'note' &&\n\t\tthread.meta &&\n\t\t( thread.meta._wp_note_status === 'resolved' ||\n\t\t\tthread.meta._wp_note_status === 'reopen' );\n\n\tconst actions = [\n\t\t{\n\t\t\tid: 'edit',\n\t\t\ttitle: __( 'Edit' ),\n\t\t\tisEligible: ( { status } ) => status !== 'approved',\n\t\t\tonClick: () => {\n\t\t\t\tsetActionState( 'edit' );\n\t\t\t},\n\t\t},\n\t\t{\n\t\t\tid: 'reopen',\n\t\t\ttitle: _x( 'Reopen', 'Reopen note' ),\n\t\t\tisEligible: ( { status } ) => status === 'approved',\n\t\t\tonClick: () => {\n\t\t\t\tonEdit( { id: thread.id, status: 'hold' } );\n\t\t\t},\n\t\t},\n\t\t{\n\t\t\tid: 'delete',\n\t\t\ttitle: __( 'Delete' ),\n\t\t\tisEligible: () => true,\n\t\t\tonClick: () => {\n\t\t\t\tsetActionState( 'delete' );\n\t\t\t\tsetShowConfirmDialog( true );\n\t\t\t},\n\t\t},\n\t];\n\n\tconst canResolve = thread.parent === 0;\n\tconst moreActions =\n\t\tparent?.status !== 'approved'\n\t\t\t? actions.filter( ( item ) => item.isEligible( thread ) )\n\t\t\t: [];\n\n\treturn (\n\t\t<VStack\n\t\t\tspacing=\"2\"\n\t\t\trole={ thread.parent !== 0 ? 'treeitem' : undefined }\n\t\t>\n\t\t\t<HStack alignment=\"left\" spacing=\"3\" justify=\"flex-start\">\n\t\t\t\t<CommentAuthorInfo\n\t\t\t\t\tavatar={ thread?.author_avatar_urls?.[ 48 ] }\n\t\t\t\t\tname={ thread?.author_name }\n\t\t\t\t\tdate={ thread?.date }\n\t\t\t\t\tuserId={ thread?.author }\n\t\t\t\t/>\n\t\t\t\t{ isExpanded && (\n\t\t\t\t\t<FlexItem\n\t\t\t\t\t\tclassName=\"editor-collab-sidebar-panel__comment-status\"\n\t\t\t\t\t\tonClick={ ( event ) => {\n\t\t\t\t\t\t\t// Prevent the thread from being selected.\n\t\t\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t<HStack spacing=\"0\">\n\t\t\t\t\t\t\t{ canResolve && (\n\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\tlabel={ _x(\n\t\t\t\t\t\t\t\t\t\t'Resolve',\n\t\t\t\t\t\t\t\t\t\t'Mark note as resolved'\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\t\t\ticon={ published }\n\t\t\t\t\t\t\t\t\tdisabled={ thread.status === 'approved' }\n\t\t\t\t\t\t\t\t\taccessibleWhenDisabled={\n\t\t\t\t\t\t\t\t\t\tthread.status === 'approved'\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\t\t\tonEdit( {\n\t\t\t\t\t\t\t\t\t\t\tid: thread.id,\n\t\t\t\t\t\t\t\t\t\t\tstatus: 'approved',\n\t\t\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t<Menu placement=\"bottom-end\">\n\t\t\t\t\t\t\t\t<Menu.TriggerButton\n\t\t\t\t\t\t\t\t\trender={\n\t\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\t\tref={ actionButtonRef }\n\t\t\t\t\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\t\t\t\t\ticon={ moreVertical }\n\t\t\t\t\t\t\t\t\t\t\tlabel={ __( 'Actions' ) }\n\t\t\t\t\t\t\t\t\t\t\tdisabled={ ! moreActions.length }\n\t\t\t\t\t\t\t\t\t\t\taccessibleWhenDisabled\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t<Menu.Popover>\n\t\t\t\t\t\t\t\t\t{ moreActions.map( ( action ) => (\n\t\t\t\t\t\t\t\t\t\t<Menu.Item\n\t\t\t\t\t\t\t\t\t\t\tkey={ action.id }\n\t\t\t\t\t\t\t\t\t\t\tonClick={ () => action.onClick() }\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t<Menu.ItemLabel>\n\t\t\t\t\t\t\t\t\t\t\t\t{ action.title }\n\t\t\t\t\t\t\t\t\t\t\t</Menu.ItemLabel>\n\t\t\t\t\t\t\t\t\t\t</Menu.Item>\n\t\t\t\t\t\t\t\t\t) ) }\n\t\t\t\t\t\t\t\t</Menu.Popover>\n\t\t\t\t\t\t\t</Menu>\n\t\t\t\t\t\t</HStack>\n\t\t\t\t\t</FlexItem>\n\t\t\t\t) }\n\t\t\t</HStack>\n\t\t\t{ 'edit' === actionState ? (\n\t\t\t\t<CommentForm\n\t\t\t\t\tonSubmit={ ( value ) => {\n\t\t\t\t\t\tonEdit( {\n\t\t\t\t\t\t\tid: thread.id,\n\t\t\t\t\t\t\tcontent: value,\n\t\t\t\t\t\t} );\n\t\t\t\t\t\tsetActionState( false );\n\t\t\t\t\t\tactionButtonRef.current?.focus();\n\t\t\t\t\t} }\n\t\t\t\t\tonCancel={ () => handleCancel() }\n\t\t\t\t\tthread={ thread }\n\t\t\t\t\tsubmitButtonText={ _x( 'Update', 'verb' ) }\n\t\t\t\t\tlabelText={ sprintf(\n\t\t\t\t\t\t// translators: %1$s: note identifier, %2$s: author name.\n\t\t\t\t\t\t__( 'Edit note %1$s by %2$s' ),\n\t\t\t\t\t\tthread.id,\n\t\t\t\t\t\tthread.author_name\n\t\t\t\t\t) }\n\t\t\t\t\treflowComments={ reflowComments }\n\t\t\t\t/>\n\t\t\t) : (\n\t\t\t\t<RawHTML\n\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t'editor-collab-sidebar-panel__user-comment',\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\t'editor-collab-sidebar-panel__resolution-text':\n\t\t\t\t\t\t\t\tisResolutionComment,\n\t\t\t\t\t\t}\n\t\t\t\t\t) }\n\t\t\t\t>\n\t\t\t\t\t{ isResolutionComment\n\t\t\t\t\t\t? ( () => {\n\t\t\t\t\t\t\t\tconst actionText =\n\t\t\t\t\t\t\t\t\tthread.meta._wp_note_status === 'resolved'\n\t\t\t\t\t\t\t\t\t\t? __( 'Marked as resolved' )\n\t\t\t\t\t\t\t\t\t\t: __( 'Reopened' );\n\t\t\t\t\t\t\t\tconst content = thread?.content?.raw;\n\n\t\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\t\tcontent &&\n\t\t\t\t\t\t\t\t\ttypeof content === 'string' &&\n\t\t\t\t\t\t\t\t\tcontent.trim() !== ''\n\t\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\t\treturn sprintf(\n\t\t\t\t\t\t\t\t\t\t// translators: %1$s: action label (\"Marked as resolved\" or \"Reopened\"); %2$s: note text.\n\t\t\t\t\t\t\t\t\t\t__( '%1$s: %2$s' ),\n\t\t\t\t\t\t\t\t\t\tactionText,\n\t\t\t\t\t\t\t\t\t\tcontent\n\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t// If no content, just show the action.\n\t\t\t\t\t\t\t\treturn actionText;\n\t\t\t\t\t\t } )()\n\t\t\t\t\t\t: thread?.content?.rendered }\n\t\t\t\t</RawHTML>\n\t\t\t) }\n\t\t\t{ 'delete' === actionState && (\n\t\t\t\t<ConfirmDialog\n\t\t\t\t\tisOpen={ showConfirmDialog }\n\t\t\t\t\tonConfirm={ handleConfirmDelete }\n\t\t\t\t\tonCancel={ handleCancel }\n\t\t\t\t\tconfirmButtonText={ __( 'Delete' ) }\n\t\t\t\t>\n\t\t\t\t\t{ __(\n\t\t\t\t\t\t\"Are you sure you want to delete this note? This will also delete all of this note's replies.\"\n\t\t\t\t\t) }\n\t\t\t\t</ConfirmDialog>\n\t\t\t) }\n\t\t</VStack>\n\t);\n};\n\nexport default Comments;\n"],
|
|
5
|
-
"mappings": "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",
|
|
4
|
+
"sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tuseState,\n\tRawHTML,\n\tuseEffect,\n\tuseCallback,\n\tuseMemo,\n\tuseRef,\n} from '@wordpress/element';\nimport {\n\t__experimentalText as Text,\n\t__experimentalHStack as HStack,\n\t__experimentalVStack as VStack,\n\t__experimentalConfirmDialog as ConfirmDialog,\n\tButton,\n\tFlexItem,\n\tprivateApis as componentsPrivateApis,\n} from '@wordpress/components';\nimport { useDebounce } from '@wordpress/compose';\n\nimport { published, moreVertical } from '@wordpress/icons';\nimport { __, _x, sprintf, _n } from '@wordpress/i18n';\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { __unstableStripHTML as stripHTML } from '@wordpress/dom';\nimport {\n\tstore as blockEditorStore,\n\tprivateApis as blockEditorPrivateApis,\n} from '@wordpress/block-editor';\n\n/**\n * Internal dependencies\n */\nimport { unlock } from '../../lock-unlock';\nimport CommentAuthorInfo from './comment-author-info';\nimport CommentForm from './comment-form';\nimport { focusCommentThread, getCommentExcerpt } from './utils';\nimport { useFloatingThread } from './hooks';\nimport { AddComment } from './add-comment';\nimport { store as editorStore } from '../../store';\n\nconst { useBlockElement } = unlock( blockEditorPrivateApis );\nconst { Menu } = unlock( componentsPrivateApis );\n\nexport function Comments( {\n\tthreads: noteThreads,\n\tonEditComment,\n\tonAddReply,\n\tonCommentDelete,\n\tnewNoteFormState,\n\tsetNewNoteFormState,\n\tcommentSidebarRef,\n\treflowComments,\n\tisFloating = false,\n\tcommentLastUpdated,\n} ) {\n\tconst [ heights, setHeights ] = useState( {} );\n\tconst [ selectedThread, setSelectedThread ] = useState( null );\n\tconst [ boardOffsets, setBoardOffsets ] = useState( {} );\n\tconst [ blockRefs, setBlockRefs ] = useState( {} );\n\n\tconst { setCanvasMinHeight } = unlock( useDispatch( editorStore ) );\n\tconst { selectBlock, toggleBlockSpotlight } = unlock(\n\t\tuseDispatch( blockEditorStore )\n\t);\n\tconst { blockCommentId, selectedBlockClientId, orderedBlockIds } =\n\t\tuseSelect( ( select ) => {\n\t\t\tconst {\n\t\t\t\tgetBlockAttributes,\n\t\t\t\tgetSelectedBlockClientId,\n\t\t\t\tgetClientIdsWithDescendants,\n\t\t\t} = select( blockEditorStore );\n\t\t\tconst clientId = getSelectedBlockClientId();\n\t\t\treturn {\n\t\t\t\tblockCommentId: clientId\n\t\t\t\t\t? getBlockAttributes( clientId )?.metadata?.noteId\n\t\t\t\t\t: null,\n\t\t\t\tselectedBlockClientId: clientId,\n\t\t\t\torderedBlockIds: getClientIdsWithDescendants(),\n\t\t\t};\n\t\t}, [] );\n\n\tconst relatedBlockElement = useBlockElement( selectedBlockClientId );\n\n\tconst threads = useMemo( () => {\n\t\tconst t = [ ...noteThreads ];\n\t\tconst orderedThreads = [];\n\t\t// In floating mode, when the note board is shown, and as long\n\t\t// as the selected block doesn't have an existing note attached -\n\t\t// add a \"new note\" entry to the threads. This special thread type\n\t\t// gets sorted and floated like regular threads, but shows an AddComment\n\t\t// component instead of a regular comment thread.\n\t\tif ( isFloating && newNoteFormState === 'open' ) {\n\t\t\t// Insert the new note entry at the correct location for its blockId.\n\t\t\tconst newNoteThread = {\n\t\t\t\tid: 'new-note-thread',\n\t\t\t\tblockClientId: selectedBlockClientId,\n\t\t\t\tcontent: { rendered: '' },\n\t\t\t};\n\t\t\t// Insert the new comment block at the right order within the threads.\n\t\t\torderedBlockIds.forEach( ( blockId ) => {\n\t\t\t\tif ( blockId === selectedBlockClientId ) {\n\t\t\t\t\torderedThreads.push( newNoteThread );\n\t\t\t\t} else {\n\t\t\t\t\tconst threadForBlock = t.find(\n\t\t\t\t\t\t( thread ) => thread.blockClientId === blockId\n\t\t\t\t\t);\n\t\t\t\t\tif ( threadForBlock ) {\n\t\t\t\t\t\torderedThreads.push( threadForBlock );\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t} );\n\t\t\treturn orderedThreads;\n\t\t}\n\t\treturn t;\n\t}, [\n\t\tnoteThreads,\n\t\tisFloating,\n\t\tnewNoteFormState,\n\t\tselectedBlockClientId,\n\t\torderedBlockIds,\n\t] );\n\n\tconst handleDelete = async ( comment ) => {\n\t\tconst currentIndex = threads.findIndex( ( t ) => t.id === comment.id );\n\t\tconst nextThread = threads[ currentIndex + 1 ];\n\t\tconst prevThread = threads[ currentIndex - 1 ];\n\n\t\tawait onCommentDelete( comment );\n\n\t\tif ( comment.parent !== 0 ) {\n\t\t\t// Move focus to the parent thread when a reply was deleted.\n\t\t\tsetSelectedThread( comment.parent );\n\t\t\tfocusCommentThread( comment.parent, commentSidebarRef.current );\n\t\t\treturn;\n\t\t}\n\n\t\tif ( nextThread ) {\n\t\t\tsetSelectedThread( nextThread.id );\n\t\t\tfocusCommentThread( nextThread.id, commentSidebarRef.current );\n\t\t} else if ( prevThread ) {\n\t\t\tsetSelectedThread( prevThread.id );\n\t\t\tfocusCommentThread( prevThread.id, commentSidebarRef.current );\n\t\t} else {\n\t\t\tsetSelectedThread( null );\n\t\t\tsetNewNoteFormState( 'closed' );\n\t\t\t// Move focus to the related block.\n\t\t\trelatedBlockElement?.focus();\n\t\t}\n\t};\n\n\t// Auto-select the related comment thread when a block is selected.\n\tuseEffect( () => {\n\t\t// Fallback to 'new-note-thread' when showing the comment board for a new note.\n\t\tsetSelectedThread(\n\t\t\tnewNoteFormState === 'open' ? 'new-note-thread' : blockCommentId\n\t\t);\n\t}, [ blockCommentId, newNoteFormState ] );\n\n\tconst setBlockRef = useCallback( ( id, blockRef ) => {\n\t\tsetBlockRefs( ( prev ) => ( { ...prev, [ id ]: blockRef } ) );\n\t}, [] );\n\n\t// Recalculate floating comment thread offsets whenever the heights change.\n\tuseEffect( () => {\n\t\t/**\n\t\t * Calculate the y offsets for all comment threads. Account for potentially\n\t\t * overlapping threads and adjust their positions accordingly.\n\t\t */\n\t\tconst calculateAllOffsets = () => {\n\t\t\tconst offsets = {};\n\n\t\t\tif ( ! isFloating ) {\n\t\t\t\treturn { offsets, minHeight: 0 };\n\t\t\t}\n\n\t\t\t// Find the index of the selected thread.\n\t\t\tconst selectedThreadIndex = threads.findIndex(\n\t\t\t\t( t ) => t.id === selectedThread\n\t\t\t);\n\n\t\t\tconst breakIndex =\n\t\t\t\tselectedThreadIndex === -1 ? 0 : selectedThreadIndex;\n\n\t\t\t// If there is a selected thread, push threads above up and threads below down.\n\t\t\tconst selectedThreadData = threads[ breakIndex ];\n\n\t\t\tif (\n\t\t\t\t! selectedThreadData ||\n\t\t\t\t! blockRefs[ selectedThreadData.id ]\n\t\t\t) {\n\t\t\t\treturn { offsets, minHeight: 0 };\n\t\t\t}\n\n\t\t\tlet blockElement = blockRefs[ selectedThreadData.id ];\n\t\t\tlet blockRect = blockElement?.getBoundingClientRect();\n\t\t\tconst selectedThreadTop = blockRect?.top || 0;\n\t\t\tconst selectedThreadHeight = heights[ selectedThreadData.id ] || 0;\n\n\t\t\toffsets[ selectedThreadData.id ] = -16;\n\n\t\t\tlet previousThreadData = {\n\t\t\t\tthreadTop: selectedThreadTop - 16,\n\t\t\t\tthreadHeight: selectedThreadHeight,\n\t\t\t};\n\n\t\t\t// Process threads after the selected thread, offsetting any overlapping\n\t\t\t// threads downward.\n\t\t\tfor ( let i = breakIndex + 1; i < threads.length; i++ ) {\n\t\t\t\tconst thread = threads[ i ];\n\t\t\t\tif ( ! blockRefs[ thread.id ] ) {\n\t\t\t\t\tcontinue;\n\t\t\t\t}\n\n\t\t\t\tblockElement = blockRefs[ thread.id ];\n\t\t\t\tblockRect = blockElement?.getBoundingClientRect();\n\t\t\t\tconst threadTop = blockRect?.top || 0;\n\t\t\t\tconst threadHeight = heights[ thread.id ] || 0;\n\n\t\t\t\tlet additionalOffset = -16;\n\n\t\t\t\t// Check if the thread overlaps with the previous one.\n\t\t\t\tconst previousBottom =\n\t\t\t\t\tpreviousThreadData.threadTop +\n\t\t\t\t\tpreviousThreadData.threadHeight;\n\t\t\t\tif ( threadTop < previousBottom + 16 ) {\n\t\t\t\t\t// Shift down by the difference plus a margin to avoid overlap.\n\t\t\t\t\tadditionalOffset = previousBottom - threadTop + 20;\n\t\t\t\t}\n\n\t\t\t\toffsets[ thread.id ] = additionalOffset;\n\n\t\t\t\t// Update for next iteration.\n\t\t\t\tpreviousThreadData = {\n\t\t\t\t\tthreadTop: threadTop + additionalOffset,\n\t\t\t\t\tthreadHeight,\n\t\t\t\t};\n\t\t\t}\n\n\t\t\t// Process threads before the selected thread, offsetting any overlapping\n\t\t\t// threads upward.\n\t\t\tlet nextThreadData = {\n\t\t\t\tthreadTop: selectedThreadTop - 16,\n\t\t\t};\n\n\t\t\tfor ( let i = selectedThreadIndex - 1; i >= 0; i-- ) {\n\t\t\t\tconst thread = threads[ i ];\n\t\t\t\tif ( ! blockRefs[ thread.id ] ) {\n\t\t\t\t\tcontinue;\n\t\t\t\t}\n\n\t\t\t\tblockElement = blockRefs[ thread.id ];\n\t\t\t\tblockRect = blockElement?.getBoundingClientRect();\n\t\t\t\tconst threadTop = blockRect?.top || 0;\n\t\t\t\tconst threadHeight = heights[ thread.id ] || 0;\n\n\t\t\t\tlet additionalOffset = -16;\n\n\t\t\t\t// Calculate the bottom position of this thread with default offset.\n\t\t\t\tconst threadBottom = threadTop + threadHeight;\n\n\t\t\t\t// Check if this thread's bottom would overlap with the next thread's top.\n\t\t\t\tif ( threadBottom > nextThreadData.threadTop ) {\n\t\t\t\t\t// Shift up by the difference plus a margin to avoid overlap.\n\t\t\t\t\tadditionalOffset =\n\t\t\t\t\t\tnextThreadData.threadTop -\n\t\t\t\t\t\tthreadTop -\n\t\t\t\t\t\tthreadHeight -\n\t\t\t\t\t\t20;\n\t\t\t\t}\n\n\t\t\t\toffsets[ thread.id ] = additionalOffset;\n\n\t\t\t\t// Update for next iteration (going upward).\n\t\t\t\tnextThreadData = {\n\t\t\t\t\tthreadTop: threadTop + additionalOffset,\n\t\t\t\t};\n\t\t\t}\n\n\t\t\tlet editorMinHeight = 0;\n\t\t\t// Take the calculated top of the final note plus its height as the editor min height.\n\t\t\tconst lastThread = threads[ threads.length - 1 ];\n\t\t\tif ( blockRefs[ lastThread.id ] ) {\n\t\t\t\tconst lastBlockElement = blockRefs[ lastThread.id ];\n\t\t\t\tconst lastBlockRect = lastBlockElement?.getBoundingClientRect();\n\t\t\t\tconst lastThreadTop = lastBlockRect?.top || 0;\n\t\t\t\tconst lastThreadHeight = heights[ lastThread.id ] || 0;\n\t\t\t\tconst lastThreadOffset = offsets[ lastThread.id ] || 0;\n\t\t\t\teditorMinHeight =\n\t\t\t\t\tlastThreadTop + lastThreadHeight + lastThreadOffset + 32;\n\t\t\t}\n\n\t\t\treturn { offsets, minHeight: editorMinHeight };\n\t\t};\n\t\tconst { offsets: newOffsets, minHeight } = calculateAllOffsets();\n\t\tif ( Object.keys( newOffsets ).length > 0 ) {\n\t\t\tsetBoardOffsets( newOffsets );\n\t\t}\n\t\t// Ensure the editor has enough height to scroll to all notes.\n\t\tsetCanvasMinHeight( minHeight );\n\t}, [\n\t\theights,\n\t\tblockRefs,\n\t\tisFloating,\n\t\tthreads,\n\t\tselectedThread,\n\t\tsetCanvasMinHeight,\n\t] );\n\n\tconst handleThreadNavigation = ( event, thread, isSelected ) => {\n\t\tif ( event.defaultPrevented ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst currentIndex = threads.findIndex( ( t ) => t.id === thread.id );\n\n\t\tif (\n\t\t\t( event.key === 'Enter' || event.key === 'ArrowRight' ) &&\n\t\t\tevent.currentTarget === event.target &&\n\t\t\t! isSelected\n\t\t) {\n\t\t\t// Expand thread.\n\t\t\tsetNewNoteFormState( 'closed' );\n\t\t\tsetSelectedThread( thread.id );\n\t\t\tif ( !! thread.blockClientId ) {\n\t\t\t\t// Pass `null` as the second parameter to prevent focusing the block.\n\t\t\t\tselectBlock( thread.blockClientId, null );\n\t\t\t\ttoggleBlockSpotlight( thread.blockClientId, true );\n\t\t\t}\n\t\t} else if (\n\t\t\t( ( event.key === 'Enter' || event.key === 'ArrowLeft' ) &&\n\t\t\t\tevent.currentTarget === event.target &&\n\t\t\t\tisSelected ) ||\n\t\t\tevent.key === 'Escape'\n\t\t) {\n\t\t\t// Collapse thread.\n\t\t\tsetSelectedThread( null );\n\t\t\tsetNewNoteFormState( 'closed' );\n\t\t\tif ( thread.blockClientId ) {\n\t\t\t\ttoggleBlockSpotlight( thread.blockClientId, false );\n\t\t\t}\n\t\t\tfocusCommentThread( thread.id, commentSidebarRef.current );\n\t\t} else if (\n\t\t\tevent.key === 'ArrowDown' &&\n\t\t\tcurrentIndex < threads.length - 1 &&\n\t\t\tevent.currentTarget === event.target\n\t\t) {\n\t\t\t// Move to the next thread.\n\t\t\tconst nextThread = threads[ currentIndex + 1 ];\n\t\t\tfocusCommentThread( nextThread.id, commentSidebarRef.current );\n\t\t} else if (\n\t\t\tevent.key === 'ArrowUp' &&\n\t\t\tcurrentIndex > 0 &&\n\t\t\tevent.currentTarget === event.target\n\t\t) {\n\t\t\t// Move to the previous thread.\n\t\t\tconst prevThread = threads[ currentIndex - 1 ];\n\t\t\tfocusCommentThread( prevThread.id, commentSidebarRef.current );\n\t\t} else if (\n\t\t\tevent.key === 'Home' &&\n\t\t\tevent.currentTarget === event.target\n\t\t) {\n\t\t\t// Move to the first thread.\n\t\t\tfocusCommentThread( threads[ 0 ].id, commentSidebarRef.current );\n\t\t} else if (\n\t\t\tevent.key === 'End' &&\n\t\t\tevent.currentTarget === event.target\n\t\t) {\n\t\t\t// Move to the last thread.\n\t\t\tfocusCommentThread(\n\t\t\t\tthreads[ threads.length - 1 ].id,\n\t\t\t\tcommentSidebarRef.current\n\t\t\t);\n\t\t}\n\t};\n\n\tconst hasThreads = Array.isArray( threads ) && threads.length > 0;\n\t// This should no longer happen since https://github.com/WordPress/gutenberg/pull/72872.\n\tif ( ! hasThreads && ! isFloating ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<>\n\t\t\t{ ! isFloating && newNoteFormState === 'open' && (\n\t\t\t\t<AddComment\n\t\t\t\t\tonSubmit={ onAddReply }\n\t\t\t\t\tnewNoteFormState={ newNoteFormState }\n\t\t\t\t\tsetNewNoteFormState={ setNewNoteFormState }\n\t\t\t\t\tcommentSidebarRef={ commentSidebarRef }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t{ threads.map( ( thread ) => (\n\t\t\t\t<Thread\n\t\t\t\t\tkey={ thread.id }\n\t\t\t\t\tthread={ thread }\n\t\t\t\t\tonAddReply={ onAddReply }\n\t\t\t\t\tonCommentDelete={ handleDelete }\n\t\t\t\t\tonEditComment={ onEditComment }\n\t\t\t\t\tisSelected={ selectedThread === thread.id }\n\t\t\t\t\tsetSelectedThread={ setSelectedThread }\n\t\t\t\t\tsetNewNoteFormState={ setNewNoteFormState }\n\t\t\t\t\tcommentSidebarRef={ commentSidebarRef }\n\t\t\t\t\treflowComments={ reflowComments }\n\t\t\t\t\tisFloating={ isFloating }\n\t\t\t\t\tcalculatedOffset={ boardOffsets[ thread.id ] ?? 0 }\n\t\t\t\t\tsetHeights={ setHeights }\n\t\t\t\t\tsetBlockRef={ setBlockRef }\n\t\t\t\t\tselectedThread={ selectedThread }\n\t\t\t\t\tcommentLastUpdated={ commentLastUpdated }\n\t\t\t\t\tnewNoteFormState={ newNoteFormState }\n\t\t\t\t\tonKeyDown={ ( event ) =>\n\t\t\t\t\t\thandleThreadNavigation(\n\t\t\t\t\t\t\tevent,\n\t\t\t\t\t\t\tthread,\n\t\t\t\t\t\t\tselectedThread === thread.id\n\t\t\t\t\t\t)\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t) ) }\n\t\t</>\n\t);\n}\n\nfunction Thread( {\n\tthread,\n\tonEditComment,\n\tonAddReply,\n\tonCommentDelete,\n\tisSelected,\n\tsetNewNoteFormState,\n\tcommentSidebarRef,\n\treflowComments,\n\tisFloating,\n\tcalculatedOffset,\n\tsetHeights,\n\tsetBlockRef,\n\tsetSelectedThread,\n\tselectedThread,\n\tcommentLastUpdated,\n\tnewNoteFormState,\n\tonKeyDown,\n} ) {\n\tconst { toggleBlockHighlight, selectBlock, toggleBlockSpotlight } = unlock(\n\t\tuseDispatch( blockEditorStore )\n\t);\n\tconst relatedBlockElement = useBlockElement( thread.blockClientId );\n\tconst debouncedToggleBlockHighlight = useDebounce(\n\t\ttoggleBlockHighlight,\n\t\t50\n\t);\n\tconst { y, refs } = useFloatingThread( {\n\t\tthread,\n\t\tcalculatedOffset,\n\t\tsetHeights,\n\t\tsetBlockRef,\n\t\tselectedThread,\n\t\tcommentLastUpdated,\n\t} );\n\n\tconst onMouseEnter = () => {\n\t\tdebouncedToggleBlockHighlight( thread.blockClientId, true );\n\t};\n\n\tconst onMouseLeave = () => {\n\t\tdebouncedToggleBlockHighlight( thread.blockClientId, false );\n\t};\n\n\tconst handleCommentSelect = () => {\n\t\tsetNewNoteFormState( 'closed' );\n\t\tsetSelectedThread( thread.id );\n\t\tif ( !! thread.blockClientId ) {\n\t\t\t// Pass `null` as the second parameter to prevent focusing the block.\n\t\t\tselectBlock( thread.blockClientId, null );\n\t\t\ttoggleBlockSpotlight( thread.blockClientId, true );\n\t\t}\n\t};\n\n\tconst unselectThread = () => {\n\t\tsetSelectedThread( null );\n\t\tsetNewNoteFormState( 'closed' );\n\t\ttoggleBlockSpotlight( thread.blockClientId, false );\n\t};\n\n\tconst allReplies = thread?.reply || [];\n\n\tconst lastReply =\n\t\tallReplies.length > 0 ? allReplies[ allReplies.length - 1 ] : undefined;\n\tconst restReplies = allReplies.length > 0 ? allReplies.slice( 0, -1 ) : [];\n\n\tconst commentExcerpt = getCommentExcerpt(\n\t\tstripHTML( thread.content?.rendered ),\n\t\t10\n\t);\n\tconst ariaLabel = !! thread.blockClientId\n\t\t? sprintf(\n\t\t\t\t// translators: %s: note excerpt\n\t\t\t\t__( 'Note: %s' ),\n\t\t\t\tcommentExcerpt\n\t\t )\n\t\t: sprintf(\n\t\t\t\t// translators: %s: note excerpt\n\t\t\t\t__( 'Original block deleted. Note: %s' ),\n\t\t\t\tcommentExcerpt\n\t\t );\n\n\tif (\n\t\tthread.id === 'new-note-thread' &&\n\t\tnewNoteFormState === 'open' &&\n\t\tisFloating\n\t) {\n\t\treturn (\n\t\t\t<AddComment\n\t\t\t\tonSubmit={ onAddReply }\n\t\t\t\tnewNoteFormState={ newNoteFormState }\n\t\t\t\tsetNewNoteFormState={ setNewNoteFormState }\n\t\t\t\tcommentSidebarRef={ commentSidebarRef }\n\t\t\t\treflowComments={ reflowComments }\n\t\t\t\tisFloating={ isFloating }\n\t\t\t\ty={ y }\n\t\t\t\trefs={ refs }\n\t\t\t/>\n\t\t);\n\t}\n\n\treturn (\n\t\t<VStack\n\t\t\tclassName={ clsx( 'editor-collab-sidebar-panel__thread', {\n\t\t\t\t'is-selected': isSelected,\n\t\t\t\t'is-floating': isFloating,\n\t\t\t} ) }\n\t\t\tid={ `comment-thread-${ thread.id }` }\n\t\t\tspacing=\"3\"\n\t\t\tonClick={ handleCommentSelect }\n\t\t\tonMouseEnter={ onMouseEnter }\n\t\t\tonMouseLeave={ onMouseLeave }\n\t\t\tonFocus={ onMouseEnter }\n\t\t\tonBlur={ onMouseLeave }\n\t\t\tonKeyDown={ onKeyDown }\n\t\t\ttabIndex={ 0 }\n\t\t\trole=\"treeitem\"\n\t\t\taria-label={ ariaLabel }\n\t\t\taria-expanded={ isSelected }\n\t\t\tref={ isFloating ? refs.setFloating : undefined }\n\t\t\tstyle={ isFloating ? { top: y } : undefined }\n\t\t>\n\t\t\t<Button\n\t\t\t\tclassName=\"editor-collab-sidebar-panel__skip-to-comment\"\n\t\t\t\tvariant=\"secondary\"\n\t\t\t\tsize=\"compact\"\n\t\t\t\tonClick={ () => {\n\t\t\t\t\tfocusCommentThread(\n\t\t\t\t\t\tthread.id,\n\t\t\t\t\t\tcommentSidebarRef.current,\n\t\t\t\t\t\t'textarea'\n\t\t\t\t\t);\n\t\t\t\t} }\n\t\t\t>\n\t\t\t\t{ __( 'Add new note' ) }\n\t\t\t</Button>\n\t\t\t{ ! thread.blockClientId && (\n\t\t\t\t<Text as=\"p\" weight={ 500 } variant=\"muted\">\n\t\t\t\t\t{ __( 'Original block deleted.' ) }\n\t\t\t\t</Text>\n\t\t\t) }\n\t\t\t<CommentBoard\n\t\t\t\tthread={ thread }\n\t\t\t\tisExpanded={ isSelected }\n\t\t\t\tonEdit={ ( params = {} ) => {\n\t\t\t\t\tonEditComment( params );\n\t\t\t\t\tif ( params.status === 'approved' ) {\n\t\t\t\t\t\tunselectThread();\n\t\t\t\t\t\tif ( isFloating ) {\n\t\t\t\t\t\t\trelatedBlockElement?.focus();\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tfocusCommentThread(\n\t\t\t\t\t\t\t\tthread.id,\n\t\t\t\t\t\t\t\tcommentSidebarRef.current\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t} }\n\t\t\t\tonDelete={ onCommentDelete }\n\t\t\t\treflowComments={ reflowComments }\n\t\t\t/>\n\t\t\t{ isSelected &&\n\t\t\t\tallReplies.map( ( reply ) => (\n\t\t\t\t\t<CommentBoard\n\t\t\t\t\t\tkey={ reply.id }\n\t\t\t\t\t\tthread={ reply }\n\t\t\t\t\t\tparent={ thread }\n\t\t\t\t\t\tisExpanded={ isSelected }\n\t\t\t\t\t\tonEdit={ onEditComment }\n\t\t\t\t\t\tonDelete={ onCommentDelete }\n\t\t\t\t\t\treflowComments={ reflowComments }\n\t\t\t\t\t/>\n\t\t\t\t) ) }\n\t\t\t{ ! isSelected && restReplies.length > 0 && (\n\t\t\t\t<HStack className=\"editor-collab-sidebar-panel__more-reply-separator\">\n\t\t\t\t\t<Button\n\t\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\tclassName=\"editor-collab-sidebar-panel__more-reply-button\"\n\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\tsetSelectedThread( thread.id );\n\t\t\t\t\t\t\tfocusCommentThread(\n\t\t\t\t\t\t\t\tthread.id,\n\t\t\t\t\t\t\t\tcommentSidebarRef.current\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ sprintf(\n\t\t\t\t\t\t\t// translators: %s: number of replies.\n\t\t\t\t\t\t\t_n(\n\t\t\t\t\t\t\t\t'%s more reply',\n\t\t\t\t\t\t\t\t'%s more replies',\n\t\t\t\t\t\t\t\trestReplies.length\n\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\trestReplies.length\n\t\t\t\t\t\t) }\n\t\t\t\t\t</Button>\n\t\t\t\t</HStack>\n\t\t\t) }\n\t\t\t{ ! isSelected && lastReply && (\n\t\t\t\t<CommentBoard\n\t\t\t\t\tthread={ lastReply }\n\t\t\t\t\tparent={ thread }\n\t\t\t\t\tisExpanded={ isSelected }\n\t\t\t\t\tonEdit={ onEditComment }\n\t\t\t\t\tonDelete={ onCommentDelete }\n\t\t\t\t\treflowComments={ reflowComments }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t{ isSelected && (\n\t\t\t\t<VStack spacing=\"2\" role=\"treeitem\">\n\t\t\t\t\t<HStack alignment=\"left\" spacing=\"3\" justify=\"flex-start\">\n\t\t\t\t\t\t<CommentAuthorInfo />\n\t\t\t\t\t</HStack>\n\t\t\t\t\t<VStack spacing=\"2\">\n\t\t\t\t\t\t<CommentForm\n\t\t\t\t\t\t\tonSubmit={ ( inputComment ) => {\n\t\t\t\t\t\t\t\tif ( 'approved' === thread.status ) {\n\t\t\t\t\t\t\t\t\t// For reopening, include the content in the reopen action.\n\t\t\t\t\t\t\t\t\tonEditComment( {\n\t\t\t\t\t\t\t\t\t\tid: thread.id,\n\t\t\t\t\t\t\t\t\t\tstatus: 'hold',\n\t\t\t\t\t\t\t\t\t\tcontent: inputComment,\n\t\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\t// For regular replies, add as separate comment.\n\t\t\t\t\t\t\t\t\tonAddReply( {\n\t\t\t\t\t\t\t\t\t\tcontent: inputComment,\n\t\t\t\t\t\t\t\t\t\tparent: thread.id,\n\t\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tonCancel={ ( event ) => {\n\t\t\t\t\t\t\t\t// Prevent the parent onClick from being triggered.\n\t\t\t\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\t\t\t\tunselectThread();\n\t\t\t\t\t\t\t\tfocusCommentThread(\n\t\t\t\t\t\t\t\t\tthread.id,\n\t\t\t\t\t\t\t\t\tcommentSidebarRef.current\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tsubmitButtonText={\n\t\t\t\t\t\t\t\t'approved' === thread.status\n\t\t\t\t\t\t\t\t\t? __( 'Reopen & Reply' )\n\t\t\t\t\t\t\t\t\t: __( 'Reply' )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\trows={ 'approved' === thread.status ? 2 : 4 }\n\t\t\t\t\t\t\tlabelText={ sprintf(\n\t\t\t\t\t\t\t\t// translators: %1$s: note identifier, %2$s: author name\n\t\t\t\t\t\t\t\t__( 'Reply to note %1$s by %2$s' ),\n\t\t\t\t\t\t\t\tthread.id,\n\t\t\t\t\t\t\t\tthread.author_name\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\treflowComments={ reflowComments }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</VStack>\n\t\t\t\t</VStack>\n\t\t\t) }\n\t\t\t{ !! thread.blockClientId && (\n\t\t\t\t<Button\n\t\t\t\t\tclassName=\"editor-collab-sidebar-panel__skip-to-block\"\n\t\t\t\t\tvariant=\"secondary\"\n\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\tonClick={ ( event ) => {\n\t\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\t\trelatedBlockElement?.focus();\n\t\t\t\t\t} }\n\t\t\t\t>\n\t\t\t\t\t{ __( 'Back to block' ) }\n\t\t\t\t</Button>\n\t\t\t) }\n\t\t</VStack>\n\t);\n}\n\nconst CommentBoard = ( {\n\tthread,\n\tparent,\n\tisExpanded,\n\tonEdit,\n\tonDelete,\n\treflowComments,\n} ) => {\n\tconst [ actionState, setActionState ] = useState( false );\n\tconst [ showConfirmDialog, setShowConfirmDialog ] = useState( false );\n\tconst actionButtonRef = useRef( null );\n\tconst handleConfirmDelete = () => {\n\t\tonDelete( thread );\n\t\tsetActionState( false );\n\t\tsetShowConfirmDialog( false );\n\t};\n\n\tconst handleCancel = () => {\n\t\tsetActionState( false );\n\t\tsetShowConfirmDialog( false );\n\t\tactionButtonRef.current?.focus();\n\t};\n\n\t// Check if this is a resolution comment by checking metadata.\n\tconst isResolutionComment =\n\t\tthread.type === 'note' &&\n\t\tthread.meta &&\n\t\t( thread.meta._wp_note_status === 'resolved' ||\n\t\t\tthread.meta._wp_note_status === 'reopen' );\n\n\tconst actions = [\n\t\t{\n\t\t\tid: 'edit',\n\t\t\ttitle: __( 'Edit' ),\n\t\t\tisEligible: ( { status } ) => status !== 'approved',\n\t\t\tonClick: () => {\n\t\t\t\tsetActionState( 'edit' );\n\t\t\t},\n\t\t},\n\t\t{\n\t\t\tid: 'reopen',\n\t\t\ttitle: _x( 'Reopen', 'Reopen note' ),\n\t\t\tisEligible: ( { status } ) => status === 'approved',\n\t\t\tonClick: () => {\n\t\t\t\tonEdit( { id: thread.id, status: 'hold' } );\n\t\t\t},\n\t\t},\n\t\t{\n\t\t\tid: 'delete',\n\t\t\ttitle: __( 'Delete' ),\n\t\t\tisEligible: () => true,\n\t\t\tonClick: () => {\n\t\t\t\tsetActionState( 'delete' );\n\t\t\t\tsetShowConfirmDialog( true );\n\t\t\t},\n\t\t},\n\t];\n\n\tconst canResolve = thread.parent === 0;\n\tconst moreActions =\n\t\tparent?.status !== 'approved'\n\t\t\t? actions.filter( ( item ) => item.isEligible( thread ) )\n\t\t\t: [];\n\n\treturn (\n\t\t<VStack\n\t\t\tspacing=\"2\"\n\t\t\trole={ thread.parent !== 0 ? 'treeitem' : undefined }\n\t\t>\n\t\t\t<HStack alignment=\"left\" spacing=\"3\" justify=\"flex-start\">\n\t\t\t\t<CommentAuthorInfo\n\t\t\t\t\tavatar={ thread?.author_avatar_urls?.[ 48 ] }\n\t\t\t\t\tname={ thread?.author_name }\n\t\t\t\t\tdate={ thread?.date }\n\t\t\t\t\tuserId={ thread?.author }\n\t\t\t\t/>\n\t\t\t\t{ isExpanded && (\n\t\t\t\t\t<FlexItem\n\t\t\t\t\t\tclassName=\"editor-collab-sidebar-panel__comment-status\"\n\t\t\t\t\t\tonClick={ ( event ) => {\n\t\t\t\t\t\t\t// Prevent the thread from being selected.\n\t\t\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t<HStack spacing=\"0\">\n\t\t\t\t\t\t\t{ canResolve && (\n\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\tlabel={ _x(\n\t\t\t\t\t\t\t\t\t\t'Resolve',\n\t\t\t\t\t\t\t\t\t\t'Mark note as resolved'\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\t\t\ticon={ published }\n\t\t\t\t\t\t\t\t\tdisabled={ thread.status === 'approved' }\n\t\t\t\t\t\t\t\t\taccessibleWhenDisabled={\n\t\t\t\t\t\t\t\t\t\tthread.status === 'approved'\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\t\t\tonEdit( {\n\t\t\t\t\t\t\t\t\t\t\tid: thread.id,\n\t\t\t\t\t\t\t\t\t\t\tstatus: 'approved',\n\t\t\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t<Menu placement=\"bottom-end\">\n\t\t\t\t\t\t\t\t<Menu.TriggerButton\n\t\t\t\t\t\t\t\t\trender={\n\t\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\t\tref={ actionButtonRef }\n\t\t\t\t\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\t\t\t\t\ticon={ moreVertical }\n\t\t\t\t\t\t\t\t\t\t\tlabel={ __( 'Actions' ) }\n\t\t\t\t\t\t\t\t\t\t\tdisabled={ ! moreActions.length }\n\t\t\t\t\t\t\t\t\t\t\taccessibleWhenDisabled\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t<Menu.Popover>\n\t\t\t\t\t\t\t\t\t{ moreActions.map( ( action ) => (\n\t\t\t\t\t\t\t\t\t\t<Menu.Item\n\t\t\t\t\t\t\t\t\t\t\tkey={ action.id }\n\t\t\t\t\t\t\t\t\t\t\tonClick={ () => action.onClick() }\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t<Menu.ItemLabel>\n\t\t\t\t\t\t\t\t\t\t\t\t{ action.title }\n\t\t\t\t\t\t\t\t\t\t\t</Menu.ItemLabel>\n\t\t\t\t\t\t\t\t\t\t</Menu.Item>\n\t\t\t\t\t\t\t\t\t) ) }\n\t\t\t\t\t\t\t\t</Menu.Popover>\n\t\t\t\t\t\t\t</Menu>\n\t\t\t\t\t\t</HStack>\n\t\t\t\t\t</FlexItem>\n\t\t\t\t) }\n\t\t\t</HStack>\n\t\t\t{ 'edit' === actionState ? (\n\t\t\t\t<CommentForm\n\t\t\t\t\tonSubmit={ ( value ) => {\n\t\t\t\t\t\tonEdit( {\n\t\t\t\t\t\t\tid: thread.id,\n\t\t\t\t\t\t\tcontent: value,\n\t\t\t\t\t\t} );\n\t\t\t\t\t\tsetActionState( false );\n\t\t\t\t\t\tactionButtonRef.current?.focus();\n\t\t\t\t\t} }\n\t\t\t\t\tonCancel={ () => handleCancel() }\n\t\t\t\t\tthread={ thread }\n\t\t\t\t\tsubmitButtonText={ _x( 'Update', 'verb' ) }\n\t\t\t\t\tlabelText={ sprintf(\n\t\t\t\t\t\t// translators: %1$s: note identifier, %2$s: author name.\n\t\t\t\t\t\t__( 'Edit note %1$s by %2$s' ),\n\t\t\t\t\t\tthread.id,\n\t\t\t\t\t\tthread.author_name\n\t\t\t\t\t) }\n\t\t\t\t\treflowComments={ reflowComments }\n\t\t\t\t/>\n\t\t\t) : (\n\t\t\t\t<RawHTML\n\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t'editor-collab-sidebar-panel__user-comment',\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\t'editor-collab-sidebar-panel__resolution-text':\n\t\t\t\t\t\t\t\tisResolutionComment,\n\t\t\t\t\t\t}\n\t\t\t\t\t) }\n\t\t\t\t>\n\t\t\t\t\t{ isResolutionComment\n\t\t\t\t\t\t? ( () => {\n\t\t\t\t\t\t\t\tconst actionText =\n\t\t\t\t\t\t\t\t\tthread.meta._wp_note_status === 'resolved'\n\t\t\t\t\t\t\t\t\t\t? __( 'Marked as resolved' )\n\t\t\t\t\t\t\t\t\t\t: __( 'Reopened' );\n\t\t\t\t\t\t\t\tconst content = thread?.content?.raw;\n\n\t\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\t\tcontent &&\n\t\t\t\t\t\t\t\t\ttypeof content === 'string' &&\n\t\t\t\t\t\t\t\t\tcontent.trim() !== ''\n\t\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\t\treturn sprintf(\n\t\t\t\t\t\t\t\t\t\t// translators: %1$s: action label (\"Marked as resolved\" or \"Reopened\"); %2$s: note text.\n\t\t\t\t\t\t\t\t\t\t__( '%1$s: %2$s' ),\n\t\t\t\t\t\t\t\t\t\tactionText,\n\t\t\t\t\t\t\t\t\t\tcontent\n\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t// If no content, just show the action.\n\t\t\t\t\t\t\t\treturn actionText;\n\t\t\t\t\t\t } )()\n\t\t\t\t\t\t: thread?.content?.rendered }\n\t\t\t\t</RawHTML>\n\t\t\t) }\n\t\t\t{ 'delete' === actionState && (\n\t\t\t\t<ConfirmDialog\n\t\t\t\t\tisOpen={ showConfirmDialog }\n\t\t\t\t\tonConfirm={ handleConfirmDelete }\n\t\t\t\t\tonCancel={ handleCancel }\n\t\t\t\t\tconfirmButtonText={ __( 'Delete' ) }\n\t\t\t\t>\n\t\t\t\t\t{ __(\n\t\t\t\t\t\t\"Are you sure you want to delete this note? This will also delete all of this note's replies.\"\n\t\t\t\t\t) }\n\t\t\t\t</ConfirmDialog>\n\t\t\t) }\n\t\t</VStack>\n\t);\n};\n\nexport default Comments;\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAqYE;AAlYF,kBAAiB;AAKjB,qBAOO;AACP,wBAQO;AACP,qBAA4B;AAE5B,mBAAwC;AACxC,kBAAoC;AACpC,kBAAuC;AACvC,iBAAiD;AACjD,0BAGO;AAKP,yBAAuB;AACvB,iCAA8B;AAC9B,0BAAwB;AACxB,mBAAsD;AACtD,mBAAkC;AAClC,yBAA2B;AAC3B,mBAAqC;AAErC,MAAM,EAAE,gBAAgB,QAAI,2BAAQ,oBAAAA,WAAuB;AAC3D,MAAM,EAAE,KAAK,QAAI,2BAAQ,kBAAAC,WAAsB;AAExC,SAAS,SAAU;AAAA,EACzB,SAAS;AAAA,EACT;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,aAAa;AAAA,EACb;AACD,GAAI;AACH,QAAM,CAAE,SAAS,UAAW,QAAI,yBAAU,CAAC,CAAE;AAC7C,QAAM,CAAE,gBAAgB,iBAAkB,QAAI,yBAAU,IAAK;AAC7D,QAAM,CAAE,cAAc,eAAgB,QAAI,yBAAU,CAAC,CAAE;AACvD,QAAM,CAAE,WAAW,YAAa,QAAI,yBAAU,CAAC,CAAE;AAEjD,QAAM,EAAE,mBAAmB,QAAI,+BAAQ,yBAAa,aAAAC,KAAY,CAAE;AAClE,QAAM,EAAE,aAAa,qBAAqB,QAAI;AAAA,QAC7C,yBAAa,oBAAAC,KAAiB;AAAA,EAC/B;AACA,QAAM,EAAE,gBAAgB,uBAAuB,gBAAgB,QAC9D,uBAAW,CAAE,WAAY;AACxB,UAAM;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,IACD,IAAI,OAAQ,oBAAAA,KAAiB;AAC7B,UAAM,WAAW,yBAAyB;AAC1C,WAAO;AAAA,MACN,gBAAgB,WACb,mBAAoB,QAAS,GAAG,UAAU,SAC1C;AAAA,MACH,uBAAuB;AAAA,MACvB,iBAAiB,4BAA4B;AAAA,IAC9C;AAAA,EACD,GAAG,CAAC,CAAE;AAEP,QAAM,sBAAsB,gBAAiB,qBAAsB;AAEnE,QAAM,cAAU,wBAAS,MAAM;AAC9B,UAAM,IAAI,CAAE,GAAG,WAAY;AAC3B,UAAM,iBAAiB,CAAC;AAMxB,QAAK,cAAc,qBAAqB,QAAS;AAEhD,YAAM,gBAAgB;AAAA,QACrB,IAAI;AAAA,QACJ,eAAe;AAAA,QACf,SAAS,EAAE,UAAU,GAAG;AAAA,MACzB;AAEA,sBAAgB,QAAS,CAAE,YAAa;AACvC,YAAK,YAAY,uBAAwB;AACxC,yBAAe,KAAM,aAAc;AAAA,QACpC,OAAO;AACN,gBAAM,iBAAiB,EAAE;AAAA,YACxB,CAAE,WAAY,OAAO,kBAAkB;AAAA,UACxC;AACA,cAAK,gBAAiB;AACrB,2BAAe,KAAM,cAAe;AAAA,UACrC;AAAA,QACD;AAAA,MACD,CAAE;AACF,aAAO;AAAA,IACR;AACA,WAAO;AAAA,EACR,GAAG;AAAA,IACF;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACD,CAAE;AAEF,QAAM,eAAe,OAAQ,YAAa;AACzC,UAAM,eAAe,QAAQ,UAAW,CAAE,MAAO,EAAE,OAAO,QAAQ,EAAG;AACrE,UAAM,aAAa,QAAS,eAAe,CAAE;AAC7C,UAAM,aAAa,QAAS,eAAe,CAAE;AAE7C,UAAM,gBAAiB,OAAQ;AAE/B,QAAK,QAAQ,WAAW,GAAI;AAE3B,wBAAmB,QAAQ,MAAO;AAClC,2CAAoB,QAAQ,QAAQ,kBAAkB,OAAQ;AAC9D;AAAA,IACD;AAEA,QAAK,YAAa;AACjB,wBAAmB,WAAW,EAAG;AACjC,2CAAoB,WAAW,IAAI,kBAAkB,OAAQ;AAAA,IAC9D,WAAY,YAAa;AACxB,wBAAmB,WAAW,EAAG;AACjC,2CAAoB,WAAW,IAAI,kBAAkB,OAAQ;AAAA,IAC9D,OAAO;AACN,wBAAmB,IAAK;AACxB,0BAAqB,QAAS;AAE9B,2BAAqB,MAAM;AAAA,IAC5B;AAAA,EACD;AAGA,gCAAW,MAAM;AAEhB;AAAA,MACC,qBAAqB,SAAS,oBAAoB;AAAA,IACnD;AAAA,EACD,GAAG,CAAE,gBAAgB,gBAAiB,CAAE;AAExC,QAAM,kBAAc,4BAAa,CAAE,IAAI,aAAc;AACpD,iBAAc,CAAE,UAAY,EAAE,GAAG,MAAM,CAAE,EAAG,GAAG,SAAS,EAAI;AAAA,EAC7D,GAAG,CAAC,CAAE;AAGN,gCAAW,MAAM;AAKhB,UAAM,sBAAsB,MAAM;AACjC,YAAM,UAAU,CAAC;AAEjB,UAAK,CAAE,YAAa;AACnB,eAAO,EAAE,SAAS,WAAW,EAAE;AAAA,MAChC;AAGA,YAAM,sBAAsB,QAAQ;AAAA,QACnC,CAAE,MAAO,EAAE,OAAO;AAAA,MACnB;AAEA,YAAM,aACL,wBAAwB,KAAK,IAAI;AAGlC,YAAM,qBAAqB,QAAS,UAAW;AAE/C,UACC,CAAE,sBACF,CAAE,UAAW,mBAAmB,EAAG,GAClC;AACD,eAAO,EAAE,SAAS,WAAW,EAAE;AAAA,MAChC;AAEA,UAAI,eAAe,UAAW,mBAAmB,EAAG;AACpD,UAAI,YAAY,cAAc,sBAAsB;AACpD,YAAM,oBAAoB,WAAW,OAAO;AAC5C,YAAM,uBAAuB,QAAS,mBAAmB,EAAG,KAAK;AAEjE,cAAS,mBAAmB,EAAG,IAAI;AAEnC,UAAI,qBAAqB;AAAA,QACxB,WAAW,oBAAoB;AAAA,QAC/B,cAAc;AAAA,MACf;AAIA,eAAU,IAAI,aAAa,GAAG,IAAI,QAAQ,QAAQ,KAAM;AACvD,cAAM,SAAS,QAAS,CAAE;AAC1B,YAAK,CAAE,UAAW,OAAO,EAAG,GAAI;AAC/B;AAAA,QACD;AAEA,uBAAe,UAAW,OAAO,EAAG;AACpC,oBAAY,cAAc,sBAAsB;AAChD,cAAM,YAAY,WAAW,OAAO;AACpC,cAAM,eAAe,QAAS,OAAO,EAAG,KAAK;AAE7C,YAAI,mBAAmB;AAGvB,cAAM,iBACL,mBAAmB,YACnB,mBAAmB;AACpB,YAAK,YAAY,iBAAiB,IAAK;AAEtC,6BAAmB,iBAAiB,YAAY;AAAA,QACjD;AAEA,gBAAS,OAAO,EAAG,IAAI;AAGvB,6BAAqB;AAAA,UACpB,WAAW,YAAY;AAAA,UACvB;AAAA,QACD;AAAA,MACD;AAIA,UAAI,iBAAiB;AAAA,QACpB,WAAW,oBAAoB;AAAA,MAChC;AAEA,eAAU,IAAI,sBAAsB,GAAG,KAAK,GAAG,KAAM;AACpD,cAAM,SAAS,QAAS,CAAE;AAC1B,YAAK,CAAE,UAAW,OAAO,EAAG,GAAI;AAC/B;AAAA,QACD;AAEA,uBAAe,UAAW,OAAO,EAAG;AACpC,oBAAY,cAAc,sBAAsB;AAChD,cAAM,YAAY,WAAW,OAAO;AACpC,cAAM,eAAe,QAAS,OAAO,EAAG,KAAK;AAE7C,YAAI,mBAAmB;AAGvB,cAAM,eAAe,YAAY;AAGjC,YAAK,eAAe,eAAe,WAAY;AAE9C,6BACC,eAAe,YACf,YACA,eACA;AAAA,QACF;AAEA,gBAAS,OAAO,EAAG,IAAI;AAGvB,yBAAiB;AAAA,UAChB,WAAW,YAAY;AAAA,QACxB;AAAA,MACD;AAEA,UAAI,kBAAkB;AAEtB,YAAM,aAAa,QAAS,QAAQ,SAAS,CAAE;AAC/C,UAAK,UAAW,WAAW,EAAG,GAAI;AACjC,cAAM,mBAAmB,UAAW,WAAW,EAAG;AAClD,cAAM,gBAAgB,kBAAkB,sBAAsB;AAC9D,cAAM,gBAAgB,eAAe,OAAO;AAC5C,cAAM,mBAAmB,QAAS,WAAW,EAAG,KAAK;AACrD,cAAM,mBAAmB,QAAS,WAAW,EAAG,KAAK;AACrD,0BACC,gBAAgB,mBAAmB,mBAAmB;AAAA,MACxD;AAEA,aAAO,EAAE,SAAS,WAAW,gBAAgB;AAAA,IAC9C;AACA,UAAM,EAAE,SAAS,YAAY,UAAU,IAAI,oBAAoB;AAC/D,QAAK,OAAO,KAAM,UAAW,EAAE,SAAS,GAAI;AAC3C,sBAAiB,UAAW;AAAA,IAC7B;AAEA,uBAAoB,SAAU;AAAA,EAC/B,GAAG;AAAA,IACF;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACD,CAAE;AAEF,QAAM,yBAAyB,CAAE,OAAO,QAAQ,eAAgB;AAC/D,QAAK,MAAM,kBAAmB;AAC7B;AAAA,IACD;AAEA,UAAM,eAAe,QAAQ,UAAW,CAAE,MAAO,EAAE,OAAO,OAAO,EAAG;AAEpE,SACG,MAAM,QAAQ,WAAW,MAAM,QAAQ,iBACzC,MAAM,kBAAkB,MAAM,UAC9B,CAAE,YACD;AAED,0BAAqB,QAAS;AAC9B,wBAAmB,OAAO,EAAG;AAC7B,UAAK,CAAC,CAAE,OAAO,eAAgB;AAE9B,oBAAa,OAAO,eAAe,IAAK;AACxC,6BAAsB,OAAO,eAAe,IAAK;AAAA,MAClD;AAAA,IACD,YACK,MAAM,QAAQ,WAAW,MAAM,QAAQ,gBAC1C,MAAM,kBAAkB,MAAM,UAC9B,cACD,MAAM,QAAQ,UACb;AAED,wBAAmB,IAAK;AACxB,0BAAqB,QAAS;AAC9B,UAAK,OAAO,eAAgB;AAC3B,6BAAsB,OAAO,eAAe,KAAM;AAAA,MACnD;AACA,2CAAoB,OAAO,IAAI,kBAAkB,OAAQ;AAAA,IAC1D,WACC,MAAM,QAAQ,eACd,eAAe,QAAQ,SAAS,KAChC,MAAM,kBAAkB,MAAM,QAC7B;AAED,YAAM,aAAa,QAAS,eAAe,CAAE;AAC7C,2CAAoB,WAAW,IAAI,kBAAkB,OAAQ;AAAA,IAC9D,WACC,MAAM,QAAQ,aACd,eAAe,KACf,MAAM,kBAAkB,MAAM,QAC7B;AAED,YAAM,aAAa,QAAS,eAAe,CAAE;AAC7C,2CAAoB,WAAW,IAAI,kBAAkB,OAAQ;AAAA,IAC9D,WACC,MAAM,QAAQ,UACd,MAAM,kBAAkB,MAAM,QAC7B;AAED,2CAAoB,QAAS,CAAE,EAAE,IAAI,kBAAkB,OAAQ;AAAA,IAChE,WACC,MAAM,QAAQ,SACd,MAAM,kBAAkB,MAAM,QAC7B;AAED;AAAA,QACC,QAAS,QAAQ,SAAS,CAAE,EAAE;AAAA,QAC9B,kBAAkB;AAAA,MACnB;AAAA,IACD;AAAA,EACD;AAEA,QAAM,aAAa,MAAM,QAAS,OAAQ,KAAK,QAAQ,SAAS;AAEhE,MAAK,CAAE,cAAc,CAAE,YAAa;AACnC,WAAO;AAAA,EACR;AAEA,SACC,4EACG;AAAA,KAAE,cAAc,qBAAqB,UACtC;AAAA,MAAC;AAAA;AAAA,QACA,UAAW;AAAA,QACX;AAAA,QACA;AAAA,QACA;AAAA;AAAA,IACD;AAAA,IAEC,QAAQ,IAAK,CAAE,WAChB;AAAA,MAAC;AAAA;AAAA,QAEA;AAAA,QACA;AAAA,QACA,iBAAkB;AAAA,QAClB;AAAA,QACA,YAAa,mBAAmB,OAAO;AAAA,QACvC;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA,kBAAmB,aAAc,OAAO,EAAG,KAAK;AAAA,QAChD;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA,WAAY,CAAE,UACb;AAAA,UACC;AAAA,UACA;AAAA,UACA,mBAAmB,OAAO;AAAA,QAC3B;AAAA;AAAA,MAtBK,OAAO;AAAA,IAwBd,CACC;AAAA,KACH;AAEF;AAEA,SAAS,OAAQ;AAAA,EAChB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAAI;AACH,QAAM,EAAE,sBAAsB,aAAa,qBAAqB,QAAI;AAAA,QACnE,yBAAa,oBAAAA,KAAiB;AAAA,EAC/B;AACA,QAAM,sBAAsB,gBAAiB,OAAO,aAAc;AAClE,QAAM,oCAAgC;AAAA,IACrC;AAAA,IACA;AAAA,EACD;AACA,QAAM,EAAE,GAAG,KAAK,QAAI,gCAAmB;AAAA,IACtC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACD,CAAE;AAEF,QAAM,eAAe,MAAM;AAC1B,kCAA+B,OAAO,eAAe,IAAK;AAAA,EAC3D;AAEA,QAAM,eAAe,MAAM;AAC1B,kCAA+B,OAAO,eAAe,KAAM;AAAA,EAC5D;AAEA,QAAM,sBAAsB,MAAM;AACjC,wBAAqB,QAAS;AAC9B,sBAAmB,OAAO,EAAG;AAC7B,QAAK,CAAC,CAAE,OAAO,eAAgB;AAE9B,kBAAa,OAAO,eAAe,IAAK;AACxC,2BAAsB,OAAO,eAAe,IAAK;AAAA,IAClD;AAAA,EACD;AAEA,QAAM,iBAAiB,MAAM;AAC5B,sBAAmB,IAAK;AACxB,wBAAqB,QAAS;AAC9B,yBAAsB,OAAO,eAAe,KAAM;AAAA,EACnD;AAEA,QAAM,aAAa,QAAQ,SAAS,CAAC;AAErC,QAAM,YACL,WAAW,SAAS,IAAI,WAAY,WAAW,SAAS,CAAE,IAAI;AAC/D,QAAM,cAAc,WAAW,SAAS,IAAI,WAAW,MAAO,GAAG,EAAG,IAAI,CAAC;AAEzE,QAAM,qBAAiB;AAAA,QACtB,WAAAC,qBAAW,OAAO,SAAS,QAAS;AAAA,IACpC;AAAA,EACD;AACA,QAAM,YAAY,CAAC,CAAE,OAAO,oBACzB;AAAA;AAAA,QAEA,gBAAI,UAAW;AAAA,IACf;AAAA,EACA,QACA;AAAA;AAAA,QAEA,gBAAI,kCAAmC;AAAA,IACvC;AAAA,EACA;AAEH,MACC,OAAO,OAAO,qBACd,qBAAqB,UACrB,YACC;AACD,WACC;AAAA,MAAC;AAAA;AAAA,QACA,UAAW;AAAA,QACX;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA;AAAA,IACD;AAAA,EAEF;AAEA,SACC;AAAA,IAAC,kBAAAC;AAAA,IAAA;AAAA,MACA,eAAY,YAAAC,SAAM,uCAAuC;AAAA,QACxD,eAAe;AAAA,QACf,eAAe;AAAA,MAChB,CAAE;AAAA,MACF,IAAK,kBAAmB,OAAO,EAAG;AAAA,MAClC,SAAQ;AAAA,MACR,SAAU;AAAA,MACV;AAAA,MACA;AAAA,MACA,SAAU;AAAA,MACV,QAAS;AAAA,MACT;AAAA,MACA,UAAW;AAAA,MACX,MAAK;AAAA,MACL,cAAa;AAAA,MACb,iBAAgB;AAAA,MAChB,KAAM,aAAa,KAAK,cAAc;AAAA,MACtC,OAAQ,aAAa,EAAE,KAAK,EAAE,IAAI;AAAA,MAElC;AAAA;AAAA,UAAC;AAAA;AAAA,YACA,WAAU;AAAA,YACV,SAAQ;AAAA,YACR,MAAK;AAAA,YACL,SAAU,MAAM;AACf;AAAA,gBACC,OAAO;AAAA,gBACP,kBAAkB;AAAA,gBAClB;AAAA,cACD;AAAA,YACD;AAAA,YAEE,8BAAI,cAAe;AAAA;AAAA,QACtB;AAAA,QACE,CAAE,OAAO,iBACV,4CAAC,kBAAAC,oBAAA,EAAK,IAAG,KAAI,QAAS,KAAM,SAAQ,SACjC,8BAAI,yBAA0B,GACjC;AAAA,QAED;AAAA,UAAC;AAAA;AAAA,YACA;AAAA,YACA,YAAa;AAAA,YACb,QAAS,CAAE,SAAS,CAAC,MAAO;AAC3B,4BAAe,MAAO;AACtB,kBAAK,OAAO,WAAW,YAAa;AACnC,+BAAe;AACf,oBAAK,YAAa;AACjB,uCAAqB,MAAM;AAAA,gBAC5B,OAAO;AACN;AAAA,oBACC,OAAO;AAAA,oBACP,kBAAkB;AAAA,kBACnB;AAAA,gBACD;AAAA,cACD;AAAA,YACD;AAAA,YACA,UAAW;AAAA,YACX;AAAA;AAAA,QACD;AAAA,QACE,cACD,WAAW,IAAK,CAAE,UACjB;AAAA,UAAC;AAAA;AAAA,YAEA,QAAS;AAAA,YACT,QAAS;AAAA,YACT,YAAa;AAAA,YACb,QAAS;AAAA,YACT,UAAW;AAAA,YACX;AAAA;AAAA,UANM,MAAM;AAAA,QAOb,CACC;AAAA,QACD,CAAE,cAAc,YAAY,SAAS,KACtC,4CAAC,kBAAAC,sBAAA,EAAO,WAAU,qDACjB;AAAA,UAAC;AAAA;AAAA,YACA,MAAK;AAAA,YACL,SAAQ;AAAA,YACR,WAAU;AAAA,YACV,SAAU,MAAM;AACf,gCAAmB,OAAO,EAAG;AAC7B;AAAA,gBACC,OAAO;AAAA,gBACP,kBAAkB;AAAA,cACnB;AAAA,YACD;AAAA,YAEE;AAAA;AAAA,kBAED;AAAA,gBACC;AAAA,gBACA;AAAA,gBACA,YAAY;AAAA,cACb;AAAA,cACA,YAAY;AAAA,YACb;AAAA;AAAA,QACD,GACD;AAAA,QAEC,CAAE,cAAc,aACjB;AAAA,UAAC;AAAA;AAAA,YACA,QAAS;AAAA,YACT,QAAS;AAAA,YACT,YAAa;AAAA,YACb,QAAS;AAAA,YACT,UAAW;AAAA,YACX;AAAA;AAAA,QACD;AAAA,QAEC,cACD,6CAAC,kBAAAH,sBAAA,EAAO,SAAQ,KAAI,MAAK,YACxB;AAAA,sDAAC,kBAAAG,sBAAA,EAAO,WAAU,QAAO,SAAQ,KAAI,SAAQ,cAC5C,sDAAC,2BAAAC,SAAA,EAAkB,GACpB;AAAA,UACA,4CAAC,kBAAAJ,sBAAA,EAAO,SAAQ,KACf;AAAA,YAAC,oBAAAK;AAAA,YAAA;AAAA,cACA,UAAW,CAAE,iBAAkB;AAC9B,oBAAK,eAAe,OAAO,QAAS;AAEnC,gCAAe;AAAA,oBACd,IAAI,OAAO;AAAA,oBACX,QAAQ;AAAA,oBACR,SAAS;AAAA,kBACV,CAAE;AAAA,gBACH,OAAO;AAEN,6BAAY;AAAA,oBACX,SAAS;AAAA,oBACT,QAAQ,OAAO;AAAA,kBAChB,CAAE;AAAA,gBACH;AAAA,cACD;AAAA,cACA,UAAW,CAAE,UAAW;AAEvB,sBAAM,gBAAgB;AACtB,+BAAe;AACf;AAAA,kBACC,OAAO;AAAA,kBACP,kBAAkB;AAAA,gBACnB;AAAA,cACD;AAAA,cACA,kBACC,eAAe,OAAO,aACnB,gBAAI,gBAAiB,QACrB,gBAAI,OAAQ;AAAA,cAEhB,MAAO,eAAe,OAAO,SAAS,IAAI;AAAA,cAC1C,eAAY;AAAA;AAAA,oBAEX,gBAAI,4BAA6B;AAAA,gBACjC,OAAO;AAAA,gBACP,OAAO;AAAA,cACR;AAAA,cACA;AAAA;AAAA,UACD,GACD;AAAA,WACD;AAAA,QAEC,CAAC,CAAE,OAAO,iBACX;AAAA,UAAC;AAAA;AAAA,YACA,WAAU;AAAA,YACV,SAAQ;AAAA,YACR,MAAK;AAAA,YACL,SAAU,CAAE,UAAW;AACtB,oBAAM,gBAAgB;AACtB,mCAAqB,MAAM;AAAA,YAC5B;AAAA,YAEE,8BAAI,eAAgB;AAAA;AAAA,QACvB;AAAA;AAAA;AAAA,EAEF;AAEF;AAEA,MAAM,eAAe,CAAE;AAAA,EACtB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,MAAO;AACN,QAAM,CAAE,aAAa,cAAe,QAAI,yBAAU,KAAM;AACxD,QAAM,CAAE,mBAAmB,oBAAqB,QAAI,yBAAU,KAAM;AACpE,QAAM,sBAAkB,uBAAQ,IAAK;AACrC,QAAM,sBAAsB,MAAM;AACjC,aAAU,MAAO;AACjB,mBAAgB,KAAM;AACtB,yBAAsB,KAAM;AAAA,EAC7B;AAEA,QAAM,eAAe,MAAM;AAC1B,mBAAgB,KAAM;AACtB,yBAAsB,KAAM;AAC5B,oBAAgB,SAAS,MAAM;AAAA,EAChC;AAGA,QAAM,sBACL,OAAO,SAAS,UAChB,OAAO,SACL,OAAO,KAAK,oBAAoB,cACjC,OAAO,KAAK,oBAAoB;AAElC,QAAM,UAAU;AAAA,IACf;AAAA,MACC,IAAI;AAAA,MACJ,WAAO,gBAAI,MAAO;AAAA,MAClB,YAAY,CAAE,EAAE,OAAO,MAAO,WAAW;AAAA,MACzC,SAAS,MAAM;AACd,uBAAgB,MAAO;AAAA,MACxB;AAAA,IACD;AAAA,IACA;AAAA,MACC,IAAI;AAAA,MACJ,WAAO,gBAAI,UAAU,aAAc;AAAA,MACnC,YAAY,CAAE,EAAE,OAAO,MAAO,WAAW;AAAA,MACzC,SAAS,MAAM;AACd,eAAQ,EAAE,IAAI,OAAO,IAAI,QAAQ,OAAO,CAAE;AAAA,MAC3C;AAAA,IACD;AAAA,IACA;AAAA,MACC,IAAI;AAAA,MACJ,WAAO,gBAAI,QAAS;AAAA,MACpB,YAAY,MAAM;AAAA,MAClB,SAAS,MAAM;AACd,uBAAgB,QAAS;AACzB,6BAAsB,IAAK;AAAA,MAC5B;AAAA,IACD;AAAA,EACD;AAEA,QAAM,aAAa,OAAO,WAAW;AACrC,QAAM,cACL,QAAQ,WAAW,aAChB,QAAQ,OAAQ,CAAE,SAAU,KAAK,WAAY,MAAO,CAAE,IACtD,CAAC;AAEL,SACC;AAAA,IAAC,kBAAAL;AAAA,IAAA;AAAA,MACA,SAAQ;AAAA,MACR,MAAO,OAAO,WAAW,IAAI,aAAa;AAAA,MAE1C;AAAA,qDAAC,kBAAAG,sBAAA,EAAO,WAAU,QAAO,SAAQ,KAAI,SAAQ,cAC5C;AAAA;AAAA,YAAC,2BAAAC;AAAA,YAAA;AAAA,cACA,QAAS,QAAQ,qBAAsB,EAAG;AAAA,cAC1C,MAAO,QAAQ;AAAA,cACf,MAAO,QAAQ;AAAA,cACf,QAAS,QAAQ;AAAA;AAAA,UAClB;AAAA,UACE,cACD;AAAA,YAAC;AAAA;AAAA,cACA,WAAU;AAAA,cACV,SAAU,CAAE,UAAW;AAEtB,sBAAM,gBAAgB;AAAA,cACvB;AAAA,cAEA,uDAAC,kBAAAD,sBAAA,EAAO,SAAQ,KACb;AAAA,8BACD;AAAA,kBAAC;AAAA;AAAA,oBACA,WAAQ;AAAA,sBACP;AAAA,sBACA;AAAA,oBACD;AAAA,oBACA,MAAK;AAAA,oBACL,MAAO;AAAA,oBACP,UAAW,OAAO,WAAW;AAAA,oBAC7B,wBACC,OAAO,WAAW;AAAA,oBAEnB,SAAU,MAAM;AACf,6BAAQ;AAAA,wBACP,IAAI,OAAO;AAAA,wBACX,QAAQ;AAAA,sBACT,CAAE;AAAA,oBACH;AAAA;AAAA,gBACD;AAAA,gBAED,6CAAC,QAAK,WAAU,cACf;AAAA;AAAA,oBAAC,KAAK;AAAA,oBAAL;AAAA,sBACA,QACC;AAAA,wBAAC;AAAA;AAAA,0BACA,KAAM;AAAA,0BACN,MAAK;AAAA,0BACL,MAAO;AAAA,0BACP,WAAQ,gBAAI,SAAU;AAAA,0BACtB,UAAW,CAAE,YAAY;AAAA,0BACzB,wBAAsB;AAAA;AAAA,sBACvB;AAAA;AAAA,kBAEF;AAAA,kBACA,4CAAC,KAAK,SAAL,EACE,sBAAY,IAAK,CAAE,WACpB;AAAA,oBAAC,KAAK;AAAA,oBAAL;AAAA,sBAEA,SAAU,MAAM,OAAO,QAAQ;AAAA,sBAE/B,sDAAC,KAAK,WAAL,EACE,iBAAO,OACV;AAAA;AAAA,oBALM,OAAO;AAAA,kBAMd,CACC,GACH;AAAA,mBACD;AAAA,iBACD;AAAA;AAAA,UACD;AAAA,WAEF;AAAA,QACE,WAAW,cACZ;AAAA,UAAC,oBAAAE;AAAA,UAAA;AAAA,YACA,UAAW,CAAE,UAAW;AACvB,qBAAQ;AAAA,gBACP,IAAI,OAAO;AAAA,gBACX,SAAS;AAAA,cACV,CAAE;AACF,6BAAgB,KAAM;AACtB,8BAAgB,SAAS,MAAM;AAAA,YAChC;AAAA,YACA,UAAW,MAAM,aAAa;AAAA,YAC9B;AAAA,YACA,sBAAmB,gBAAI,UAAU,MAAO;AAAA,YACxC,eAAY;AAAA;AAAA,kBAEX,gBAAI,wBAAyB;AAAA,cAC7B,OAAO;AAAA,cACP,OAAO;AAAA,YACR;AAAA,YACA;AAAA;AAAA,QACD,IAEA;AAAA,UAAC;AAAA;AAAA,YACA,eAAY,YAAAJ;AAAA,cACX;AAAA,cACA;AAAA,gBACC,gDACC;AAAA,cACF;AAAA,YACD;AAAA,YAEE,iCACG,MAAM;AACR,oBAAM,aACL,OAAO,KAAK,oBAAoB,iBAC7B,gBAAI,oBAAqB,QACzB,gBAAI,UAAW;AACnB,oBAAM,UAAU,QAAQ,SAAS;AAEjC,kBACC,WACA,OAAO,YAAY,YACnB,QAAQ,KAAK,MAAM,IAClB;AACD,2BAAO;AAAA;AAAA,sBAEN,gBAAI,YAAa;AAAA,kBACjB;AAAA,kBACA;AAAA,gBACD;AAAA,cACD;AAEA,qBAAO;AAAA,YACP,GAAI,IACJ,QAAQ,SAAS;AAAA;AAAA,QACrB;AAAA,QAEC,aAAa,eACd;AAAA,UAAC,kBAAAK;AAAA,UAAA;AAAA,YACA,QAAS;AAAA,YACT,WAAY;AAAA,YACZ,UAAW;AAAA,YACX,uBAAoB,gBAAI,QAAS;AAAA,YAE/B;AAAA,cACD;AAAA,YACD;AAAA;AAAA,QACD;AAAA;AAAA;AAAA,EAEF;AAEF;AAEA,IAAO,mBAAQ;",
|
|
6
6
|
"names": ["blockEditorPrivateApis", "componentsPrivateApis", "editorStore", "blockEditorStore", "stripHTML", "VStack", "clsx", "Text", "HStack", "CommentAuthorInfo", "CommentForm", "ConfirmDialog"]
|
|
7
7
|
}
|
|
@@ -65,12 +65,15 @@ function PostTemplatePanel() {
|
|
|
65
65
|
}) ?? false;
|
|
66
66
|
return canCreateTemplates;
|
|
67
67
|
}, []);
|
|
68
|
-
const canViewTemplates = (0, import_data.useSelect)(
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
68
|
+
const canViewTemplates = (0, import_data.useSelect)(
|
|
69
|
+
(select) => {
|
|
70
|
+
return isVisible ? select(import_core_data.store).canUser("read", {
|
|
71
|
+
kind: "postType",
|
|
72
|
+
name: "wp_template"
|
|
73
|
+
}) : false;
|
|
74
|
+
},
|
|
75
|
+
[isVisible]
|
|
76
|
+
);
|
|
74
77
|
if ((!isBlockTheme || !canViewTemplates) && isVisible) {
|
|
75
78
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_classic_theme.default, {});
|
|
76
79
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/post-template/panel.js"],
|
|
4
|
-
"sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { useSelect } from '@wordpress/data';\nimport { store as coreStore } from '@wordpress/core-data';\n\n/**\n * Internal dependencies\n */\nimport { store as editorStore } from '../../store';\nimport ClassicThemeControl from './classic-theme';\nimport BlockThemeControl from './block-theme';\n\n/**\n * Displays the template controls based on the current editor settings and user permissions.\n *\n * @return {React.ReactNode} The rendered PostTemplatePanel component.\n */\nexport default function PostTemplatePanel() {\n\tconst { templateId, isBlockTheme } = useSelect( ( select ) => {\n\t\tconst { getCurrentTemplateId, getEditorSettings } =\n\t\t\tselect( editorStore );\n\t\treturn {\n\t\t\ttemplateId: getCurrentTemplateId(),\n\t\t\tisBlockTheme: getEditorSettings().__unstableIsBlockBasedTheme,\n\t\t};\n\t}, [] );\n\n\tconst isVisible = useSelect( ( select ) => {\n\t\tconst postTypeSlug = select( editorStore ).getCurrentPostType();\n\t\tconst postType = select( coreStore ).getPostType( postTypeSlug );\n\t\tif ( ! postType?.viewable ) {\n\t\t\treturn false;\n\t\t}\n\n\t\tconst settings = select( editorStore ).getEditorSettings();\n\t\tconst hasTemplates =\n\t\t\t!! settings.availableTemplates &&\n\t\t\tObject.keys( settings.availableTemplates ).length > 0;\n\t\tif ( hasTemplates ) {\n\t\t\treturn true;\n\t\t}\n\n\t\tif ( ! settings.supportsTemplateMode ) {\n\t\t\treturn false;\n\t\t}\n\n\t\tconst canCreateTemplates =\n\t\t\tselect( coreStore ).canUser( 'create', {\n\t\t\t\tkind: 'postType',\n\t\t\t\tname: 'wp_template',\n\t\t\t} ) ?? false;\n\t\treturn canCreateTemplates;\n\t}, [] );\n\n\tconst canViewTemplates = useSelect(
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;
|
|
4
|
+
"sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { useSelect } from '@wordpress/data';\nimport { store as coreStore } from '@wordpress/core-data';\n\n/**\n * Internal dependencies\n */\nimport { store as editorStore } from '../../store';\nimport ClassicThemeControl from './classic-theme';\nimport BlockThemeControl from './block-theme';\n\n/**\n * Displays the template controls based on the current editor settings and user permissions.\n *\n * @return {React.ReactNode} The rendered PostTemplatePanel component.\n */\nexport default function PostTemplatePanel() {\n\tconst { templateId, isBlockTheme } = useSelect( ( select ) => {\n\t\tconst { getCurrentTemplateId, getEditorSettings } =\n\t\t\tselect( editorStore );\n\t\treturn {\n\t\t\ttemplateId: getCurrentTemplateId(),\n\t\t\tisBlockTheme: getEditorSettings().__unstableIsBlockBasedTheme,\n\t\t};\n\t}, [] );\n\n\tconst isVisible = useSelect( ( select ) => {\n\t\tconst postTypeSlug = select( editorStore ).getCurrentPostType();\n\t\tconst postType = select( coreStore ).getPostType( postTypeSlug );\n\t\tif ( ! postType?.viewable ) {\n\t\t\treturn false;\n\t\t}\n\n\t\tconst settings = select( editorStore ).getEditorSettings();\n\t\tconst hasTemplates =\n\t\t\t!! settings.availableTemplates &&\n\t\t\tObject.keys( settings.availableTemplates ).length > 0;\n\t\tif ( hasTemplates ) {\n\t\t\treturn true;\n\t\t}\n\n\t\tif ( ! settings.supportsTemplateMode ) {\n\t\t\treturn false;\n\t\t}\n\n\t\tconst canCreateTemplates =\n\t\t\tselect( coreStore ).canUser( 'create', {\n\t\t\t\tkind: 'postType',\n\t\t\t\tname: 'wp_template',\n\t\t\t} ) ?? false;\n\t\treturn canCreateTemplates;\n\t}, [] );\n\n\tconst canViewTemplates = useSelect(\n\t\t( select ) => {\n\t\t\treturn isVisible\n\t\t\t\t? select( coreStore ).canUser( 'read', {\n\t\t\t\t\t\tkind: 'postType',\n\t\t\t\t\t\tname: 'wp_template',\n\t\t\t\t } )\n\t\t\t\t: false;\n\t\t},\n\t\t[ isVisible ]\n\t);\n\n\tif ( ( ! isBlockTheme || ! canViewTemplates ) && isVisible ) {\n\t\treturn <ClassicThemeControl />;\n\t}\n\n\tif ( isBlockTheme && !! templateId ) {\n\t\treturn <BlockThemeControl id={ templateId } />;\n\t}\n\treturn null;\n}\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAoES;AAjET,kBAA0B;AAC1B,uBAAmC;AAKnC,mBAAqC;AACrC,2BAAgC;AAChC,yBAA8B;AAOf,SAAR,oBAAqC;AAC3C,QAAM,EAAE,YAAY,aAAa,QAAI,uBAAW,CAAE,WAAY;AAC7D,UAAM,EAAE,sBAAsB,kBAAkB,IAC/C,OAAQ,aAAAA,KAAY;AACrB,WAAO;AAAA,MACN,YAAY,qBAAqB;AAAA,MACjC,cAAc,kBAAkB,EAAE;AAAA,IACnC;AAAA,EACD,GAAG,CAAC,CAAE;AAEN,QAAM,gBAAY,uBAAW,CAAE,WAAY;AAC1C,UAAM,eAAe,OAAQ,aAAAA,KAAY,EAAE,mBAAmB;AAC9D,UAAM,WAAW,OAAQ,iBAAAC,KAAU,EAAE,YAAa,YAAa;AAC/D,QAAK,CAAE,UAAU,UAAW;AAC3B,aAAO;AAAA,IACR;AAEA,UAAM,WAAW,OAAQ,aAAAD,KAAY,EAAE,kBAAkB;AACzD,UAAM,eACL,CAAC,CAAE,SAAS,sBACZ,OAAO,KAAM,SAAS,kBAAmB,EAAE,SAAS;AACrD,QAAK,cAAe;AACnB,aAAO;AAAA,IACR;AAEA,QAAK,CAAE,SAAS,sBAAuB;AACtC,aAAO;AAAA,IACR;AAEA,UAAM,qBACL,OAAQ,iBAAAC,KAAU,EAAE,QAAS,UAAU;AAAA,MACtC,MAAM;AAAA,MACN,MAAM;AAAA,IACP,CAAE,KAAK;AACR,WAAO;AAAA,EACR,GAAG,CAAC,CAAE;AAEN,QAAM,uBAAmB;AAAA,IACxB,CAAE,WAAY;AACb,aAAO,YACJ,OAAQ,iBAAAA,KAAU,EAAE,QAAS,QAAQ;AAAA,QACrC,MAAM;AAAA,QACN,MAAM;AAAA,MACN,CAAE,IACF;AAAA,IACJ;AAAA,IACA,CAAE,SAAU;AAAA,EACb;AAEA,OAAO,CAAE,gBAAgB,CAAE,qBAAsB,WAAY;AAC5D,WAAO,4CAAC,qBAAAC,SAAA,EAAoB;AAAA,EAC7B;AAEA,MAAK,gBAAgB,CAAC,CAAE,YAAa;AACpC,WAAO,4CAAC,mBAAAC,SAAA,EAAkB,IAAK,YAAa;AAAA,EAC7C;AACA,SAAO;AACR;",
|
|
6
6
|
"names": ["editorStore", "coreStore", "ClassicThemeControl", "BlockThemeControl"]
|
|
7
7
|
}
|
|
@@ -10,6 +10,7 @@ import {
|
|
|
10
10
|
} from "@wordpress/components";
|
|
11
11
|
import { __ } from "@wordpress/i18n";
|
|
12
12
|
import { useInstanceId, useDebounce } from "@wordpress/compose";
|
|
13
|
+
import { isKeyboardEvent } from "@wordpress/keycodes";
|
|
13
14
|
import { sanitizeCommentString, noop } from "./utils";
|
|
14
15
|
function CommentForm({
|
|
15
16
|
onSubmit,
|
|
@@ -33,6 +34,12 @@ function CommentForm({
|
|
|
33
34
|
{
|
|
34
35
|
className: "editor-collab-sidebar-panel__comment-form",
|
|
35
36
|
spacing: "4",
|
|
37
|
+
as: "form",
|
|
38
|
+
onSubmit: (event) => {
|
|
39
|
+
event.preventDefault();
|
|
40
|
+
onSubmit(inputComment);
|
|
41
|
+
setInputComment("");
|
|
42
|
+
},
|
|
36
43
|
children: [
|
|
37
44
|
/* @__PURE__ */ jsx(VisuallyHidden, { as: "label", htmlFor: inputId, children: labelText ?? __("Note") }),
|
|
38
45
|
/* @__PURE__ */ jsx(
|
|
@@ -45,7 +52,12 @@ function CommentForm({
|
|
|
45
52
|
debouncedCommentUpdated();
|
|
46
53
|
},
|
|
47
54
|
rows: 1,
|
|
48
|
-
maxRows: 20
|
|
55
|
+
maxRows: 20,
|
|
56
|
+
onKeyDown: (event) => {
|
|
57
|
+
if (isKeyboardEvent.primary(event, "Enter") && !isDisabled) {
|
|
58
|
+
event.target.parentNode.requestSubmit();
|
|
59
|
+
}
|
|
60
|
+
}
|
|
49
61
|
}
|
|
50
62
|
),
|
|
51
63
|
/* @__PURE__ */ jsxs(HStack, { spacing: "2", justify: "flex-end", wrap: true, children: [
|
|
@@ -56,10 +68,7 @@ function CommentForm({
|
|
|
56
68
|
size: "compact",
|
|
57
69
|
accessibleWhenDisabled: true,
|
|
58
70
|
variant: "primary",
|
|
59
|
-
|
|
60
|
-
onSubmit(inputComment);
|
|
61
|
-
setInputComment("");
|
|
62
|
-
},
|
|
71
|
+
type: "submit",
|
|
63
72
|
disabled: isDisabled,
|
|
64
73
|
children: /* @__PURE__ */ jsx(Truncate, { children: submitButtonText })
|
|
65
74
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/collab-sidebar/comment-form.js"],
|
|
4
|
-
"sourcesContent": ["/**\n * External dependencies\n */\nimport TextareaAutosize from 'react-autosize-textarea';\n\n/**\n * WordPress dependencies\n */\nimport { useState } from '@wordpress/element';\nimport {\n\t__experimentalVStack as VStack,\n\t__experimentalHStack as HStack,\n\t__experimentalTruncate as Truncate,\n\tButton,\n\tVisuallyHidden,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { useInstanceId, useDebounce } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport { sanitizeCommentString, noop } from './utils';\n\nfunction CommentForm( {\n\tonSubmit,\n\tonCancel,\n\tthread,\n\tsubmitButtonText,\n\tlabelText,\n\treflowComments = noop,\n} ) {\n\tconst [ inputComment, setInputComment ] = useState(\n\t\tthread?.content?.raw ?? ''\n\t);\n\n\t// Regularly trigger a reflow as the user types since the textarea may grow or shrink.\n\tconst debouncedCommentUpdated = useDebounce( reflowComments, 100 );\n\n\tconst updateComment = ( value ) => {\n\t\tsetInputComment( value );\n\t};\n\n\tconst inputId = useInstanceId( CommentForm, 'comment-input' );\n\tconst isDisabled =\n\t\tinputComment === thread?.content?.raw ||\n\t\t! sanitizeCommentString( inputComment ).length;\n\n\treturn (\n\t\t<VStack\n\t\t\tclassName=\"editor-collab-sidebar-panel__comment-form\"\n\t\t\tspacing=\"4\"\n\t\t>\n\t\t\t<VisuallyHidden as=\"label\" htmlFor={ inputId }>\n\t\t\t\t{ labelText ?? __( 'Note' ) }\n\t\t\t</VisuallyHidden>\n\t\t\t<TextareaAutosize\n\t\t\t\tid={ inputId }\n\t\t\t\tvalue={ inputComment ?? '' }\n\t\t\t\tonChange={ ( comment ) => {\n\t\t\t\t\tupdateComment( comment.target.value );\n\t\t\t\t\tdebouncedCommentUpdated();\n\t\t\t\t} }\n\t\t\t\trows={ 1 }\n\t\t\t\tmaxRows={ 20 }\n\t\t\t/>\n\t\t\t<HStack spacing=\"2\" justify=\"flex-end\" wrap>\n\t\t\t\t<Button size=\"compact\" variant=\"tertiary\" onClick={ onCancel }>\n\t\t\t\t\t<Truncate>{ __( 'Cancel' ) }</Truncate>\n\t\t\t\t</Button>\n\t\t\t\t<Button\n\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\taccessibleWhenDisabled\n\t\t\t\t\tvariant=\"primary\"\n\t\t\t\t\
|
|
5
|
-
"mappings": "
|
|
4
|
+
"sourcesContent": ["/**\n * External dependencies\n */\nimport TextareaAutosize from 'react-autosize-textarea';\n\n/**\n * WordPress dependencies\n */\nimport { useState } from '@wordpress/element';\nimport {\n\t__experimentalVStack as VStack,\n\t__experimentalHStack as HStack,\n\t__experimentalTruncate as Truncate,\n\tButton,\n\tVisuallyHidden,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { useInstanceId, useDebounce } from '@wordpress/compose';\nimport { isKeyboardEvent } from '@wordpress/keycodes';\n\n/**\n * Internal dependencies\n */\nimport { sanitizeCommentString, noop } from './utils';\n\nfunction CommentForm( {\n\tonSubmit,\n\tonCancel,\n\tthread,\n\tsubmitButtonText,\n\tlabelText,\n\treflowComments = noop,\n} ) {\n\tconst [ inputComment, setInputComment ] = useState(\n\t\tthread?.content?.raw ?? ''\n\t);\n\n\t// Regularly trigger a reflow as the user types since the textarea may grow or shrink.\n\tconst debouncedCommentUpdated = useDebounce( reflowComments, 100 );\n\n\tconst updateComment = ( value ) => {\n\t\tsetInputComment( value );\n\t};\n\n\tconst inputId = useInstanceId( CommentForm, 'comment-input' );\n\tconst isDisabled =\n\t\tinputComment === thread?.content?.raw ||\n\t\t! sanitizeCommentString( inputComment ).length;\n\n\treturn (\n\t\t<VStack\n\t\t\tclassName=\"editor-collab-sidebar-panel__comment-form\"\n\t\t\tspacing=\"4\"\n\t\t\tas=\"form\"\n\t\t\tonSubmit={ ( event ) => {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tonSubmit( inputComment );\n\t\t\t\tsetInputComment( '' );\n\t\t\t} }\n\t\t>\n\t\t\t<VisuallyHidden as=\"label\" htmlFor={ inputId }>\n\t\t\t\t{ labelText ?? __( 'Note' ) }\n\t\t\t</VisuallyHidden>\n\t\t\t<TextareaAutosize\n\t\t\t\tid={ inputId }\n\t\t\t\tvalue={ inputComment ?? '' }\n\t\t\t\tonChange={ ( comment ) => {\n\t\t\t\t\tupdateComment( comment.target.value );\n\t\t\t\t\tdebouncedCommentUpdated();\n\t\t\t\t} }\n\t\t\t\trows={ 1 }\n\t\t\t\tmaxRows={ 20 }\n\t\t\t\tonKeyDown={ ( event ) => {\n\t\t\t\t\tif (\n\t\t\t\t\t\tisKeyboardEvent.primary( event, 'Enter' ) &&\n\t\t\t\t\t\t! isDisabled\n\t\t\t\t\t) {\n\t\t\t\t\t\tevent.target.parentNode.requestSubmit();\n\t\t\t\t\t}\n\t\t\t\t} }\n\t\t\t/>\n\t\t\t<HStack spacing=\"2\" justify=\"flex-end\" wrap>\n\t\t\t\t<Button size=\"compact\" variant=\"tertiary\" onClick={ onCancel }>\n\t\t\t\t\t<Truncate>{ __( 'Cancel' ) }</Truncate>\n\t\t\t\t</Button>\n\t\t\t\t<Button\n\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\taccessibleWhenDisabled\n\t\t\t\t\tvariant=\"primary\"\n\t\t\t\t\ttype=\"submit\"\n\t\t\t\t\tdisabled={ isDisabled }\n\t\t\t\t>\n\t\t\t\t\t<Truncate>{ submitButtonText }</Truncate>\n\t\t\t\t</Button>\n\t\t\t</HStack>\n\t\t</VStack>\n\t);\n}\n\nexport default CommentForm;\n"],
|
|
5
|
+
"mappings": "AA4DG,cAqBA,YArBA;AAzDH,OAAO,sBAAsB;AAK7B,SAAS,gBAAgB;AACzB;AAAA,EACC,wBAAwB;AAAA,EACxB,wBAAwB;AAAA,EACxB,0BAA0B;AAAA,EAC1B;AAAA,EACA;AAAA,OACM;AACP,SAAS,UAAU;AACnB,SAAS,eAAe,mBAAmB;AAC3C,SAAS,uBAAuB;AAKhC,SAAS,uBAAuB,YAAY;AAE5C,SAAS,YAAa;AAAA,EACrB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,iBAAiB;AAClB,GAAI;AACH,QAAM,CAAE,cAAc,eAAgB,IAAI;AAAA,IACzC,QAAQ,SAAS,OAAO;AAAA,EACzB;AAGA,QAAM,0BAA0B,YAAa,gBAAgB,GAAI;AAEjE,QAAM,gBAAgB,CAAE,UAAW;AAClC,oBAAiB,KAAM;AAAA,EACxB;AAEA,QAAM,UAAU,cAAe,aAAa,eAAgB;AAC5D,QAAM,aACL,iBAAiB,QAAQ,SAAS,OAClC,CAAE,sBAAuB,YAAa,EAAE;AAEzC,SACC;AAAA,IAAC;AAAA;AAAA,MACA,WAAU;AAAA,MACV,SAAQ;AAAA,MACR,IAAG;AAAA,MACH,UAAW,CAAE,UAAW;AACvB,cAAM,eAAe;AACrB,iBAAU,YAAa;AACvB,wBAAiB,EAAG;AAAA,MACrB;AAAA,MAEA;AAAA,4BAAC,kBAAe,IAAG,SAAQ,SAAU,SAClC,uBAAa,GAAI,MAAO,GAC3B;AAAA,QACA;AAAA,UAAC;AAAA;AAAA,YACA,IAAK;AAAA,YACL,OAAQ,gBAAgB;AAAA,YACxB,UAAW,CAAE,YAAa;AACzB,4BAAe,QAAQ,OAAO,KAAM;AACpC,sCAAwB;AAAA,YACzB;AAAA,YACA,MAAO;AAAA,YACP,SAAU;AAAA,YACV,WAAY,CAAE,UAAW;AACxB,kBACC,gBAAgB,QAAS,OAAO,OAAQ,KACxC,CAAE,YACD;AACD,sBAAM,OAAO,WAAW,cAAc;AAAA,cACvC;AAAA,YACD;AAAA;AAAA,QACD;AAAA,QACA,qBAAC,UAAO,SAAQ,KAAI,SAAQ,YAAW,MAAI,MAC1C;AAAA,8BAAC,UAAO,MAAK,WAAU,SAAQ,YAAW,SAAU,UACnD,8BAAC,YAAW,aAAI,QAAS,GAAG,GAC7B;AAAA,UACA;AAAA,YAAC;AAAA;AAAA,cACA,MAAK;AAAA,cACL,wBAAsB;AAAA,cACtB,SAAQ;AAAA,cACR,MAAK;AAAA,cACL,UAAW;AAAA,cAEX,8BAAC,YAAW,4BAAkB;AAAA;AAAA,UAC/B;AAAA,WACD;AAAA;AAAA;AAAA,EACD;AAEF;AAEA,IAAO,uBAAQ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -52,6 +52,9 @@ function Comments({
|
|
|
52
52
|
const [boardOffsets, setBoardOffsets] = useState({});
|
|
53
53
|
const [blockRefs, setBlockRefs] = useState({});
|
|
54
54
|
const { setCanvasMinHeight } = unlock(useDispatch(editorStore));
|
|
55
|
+
const { selectBlock, toggleBlockSpotlight } = unlock(
|
|
56
|
+
useDispatch(blockEditorStore)
|
|
57
|
+
);
|
|
55
58
|
const { blockCommentId, selectedBlockClientId, orderedBlockIds } = useSelect((select) => {
|
|
56
59
|
const {
|
|
57
60
|
getBlockAttributes,
|
|
@@ -217,6 +220,40 @@ function Comments({
|
|
|
217
220
|
selectedThread,
|
|
218
221
|
setCanvasMinHeight
|
|
219
222
|
]);
|
|
223
|
+
const handleThreadNavigation = (event, thread, isSelected) => {
|
|
224
|
+
if (event.defaultPrevented) {
|
|
225
|
+
return;
|
|
226
|
+
}
|
|
227
|
+
const currentIndex = threads.findIndex((t) => t.id === thread.id);
|
|
228
|
+
if ((event.key === "Enter" || event.key === "ArrowRight") && event.currentTarget === event.target && !isSelected) {
|
|
229
|
+
setNewNoteFormState("closed");
|
|
230
|
+
setSelectedThread(thread.id);
|
|
231
|
+
if (!!thread.blockClientId) {
|
|
232
|
+
selectBlock(thread.blockClientId, null);
|
|
233
|
+
toggleBlockSpotlight(thread.blockClientId, true);
|
|
234
|
+
}
|
|
235
|
+
} else if ((event.key === "Enter" || event.key === "ArrowLeft") && event.currentTarget === event.target && isSelected || event.key === "Escape") {
|
|
236
|
+
setSelectedThread(null);
|
|
237
|
+
setNewNoteFormState("closed");
|
|
238
|
+
if (thread.blockClientId) {
|
|
239
|
+
toggleBlockSpotlight(thread.blockClientId, false);
|
|
240
|
+
}
|
|
241
|
+
focusCommentThread(thread.id, commentSidebarRef.current);
|
|
242
|
+
} else if (event.key === "ArrowDown" && currentIndex < threads.length - 1 && event.currentTarget === event.target) {
|
|
243
|
+
const nextThread = threads[currentIndex + 1];
|
|
244
|
+
focusCommentThread(nextThread.id, commentSidebarRef.current);
|
|
245
|
+
} else if (event.key === "ArrowUp" && currentIndex > 0 && event.currentTarget === event.target) {
|
|
246
|
+
const prevThread = threads[currentIndex - 1];
|
|
247
|
+
focusCommentThread(prevThread.id, commentSidebarRef.current);
|
|
248
|
+
} else if (event.key === "Home" && event.currentTarget === event.target) {
|
|
249
|
+
focusCommentThread(threads[0].id, commentSidebarRef.current);
|
|
250
|
+
} else if (event.key === "End" && event.currentTarget === event.target) {
|
|
251
|
+
focusCommentThread(
|
|
252
|
+
threads[threads.length - 1].id,
|
|
253
|
+
commentSidebarRef.current
|
|
254
|
+
);
|
|
255
|
+
}
|
|
256
|
+
};
|
|
220
257
|
const hasThreads = Array.isArray(threads) && threads.length > 0;
|
|
221
258
|
if (!hasThreads && !isFloating) {
|
|
222
259
|
return null;
|
|
@@ -249,7 +286,12 @@ function Comments({
|
|
|
249
286
|
setBlockRef,
|
|
250
287
|
selectedThread,
|
|
251
288
|
commentLastUpdated,
|
|
252
|
-
newNoteFormState
|
|
289
|
+
newNoteFormState,
|
|
290
|
+
onKeyDown: (event) => handleThreadNavigation(
|
|
291
|
+
event,
|
|
292
|
+
thread,
|
|
293
|
+
selectedThread === thread.id
|
|
294
|
+
)
|
|
253
295
|
},
|
|
254
296
|
thread.id
|
|
255
297
|
))
|
|
@@ -271,7 +313,8 @@ function Thread({
|
|
|
271
313
|
setSelectedThread,
|
|
272
314
|
selectedThread,
|
|
273
315
|
commentLastUpdated,
|
|
274
|
-
newNoteFormState
|
|
316
|
+
newNoteFormState,
|
|
317
|
+
onKeyDown
|
|
275
318
|
}) {
|
|
276
319
|
const { toggleBlockHighlight, selectBlock, toggleBlockSpotlight } = unlock(
|
|
277
320
|
useDispatch(blockEditorStore)
|
|
@@ -353,22 +396,7 @@ function Thread({
|
|
|
353
396
|
onMouseLeave,
|
|
354
397
|
onFocus: onMouseEnter,
|
|
355
398
|
onBlur: onMouseLeave,
|
|
356
|
-
onKeyDown
|
|
357
|
-
if (event.defaultPrevented) {
|
|
358
|
-
return;
|
|
359
|
-
}
|
|
360
|
-
if (event.key === "Enter" && event.currentTarget === event.target) {
|
|
361
|
-
if (isSelected) {
|
|
362
|
-
unselectThread();
|
|
363
|
-
} else {
|
|
364
|
-
handleCommentSelect();
|
|
365
|
-
}
|
|
366
|
-
}
|
|
367
|
-
if (event.key === "Escape") {
|
|
368
|
-
unselectThread();
|
|
369
|
-
focusCommentThread(thread.id, commentSidebarRef.current);
|
|
370
|
-
}
|
|
371
|
-
},
|
|
399
|
+
onKeyDown,
|
|
372
400
|
tabIndex: 0,
|
|
373
401
|
role: "treeitem",
|
|
374
402
|
"aria-label": ariaLabel,
|