@wordpress/editor 14.44.0 → 14.44.1-next.v.202604201441.0

package/build-module/components/collab-sidebar/hooks.mjs

@@ -6,10 +6,10 @@ import {
 } from "@floating-ui/react-dom";
 import { __ } from "@wordpress/i18n";
 import {
+  useState,
   useEffect,
   useMemo,
-  useCallback,
-  useReducer
+  useSyncExternalStore
 } from "@wordpress/element";
 import { useEntityRecords, store as coreStore } from "@wordpress/core-data";
 import { useDispatch, useRegistry, useSelect } from "@wordpress/data";
@@ -23,13 +23,10 @@ import { store as interfaceStore } from "@wordpress/interface";
 import { store as editorStore } from "../../store/index.mjs";
 import { FLOATING_NOTES_SIDEBAR } from "./constants.mjs";
 import { unlock } from "../../lock-unlock.mjs";
-import { noop } from "./utils.mjs";
+import { createBoardStore } from "./board-store.mjs";
+import { calculateAllOffsets } from "./utils.mjs";
 var { useBlockElement, cleanEmptyObject } = unlock(blockEditorPrivateApis);
 function useBlockComments(postId) {
-  const [commentLastUpdated, reflowComments] = useReducer(
-    () => Date.now(),
-    0
-  );
   const queryArgs = {
     post: postId,
     type: "note",
@@ -117,12 +114,10 @@ function useBlockComments(postId) {
   }, [clientIds, threads, getBlockAttributes]);
   return {
     resultComments,
-    unresolvedSortedThreads,
-    reflowComments,
-    commentLastUpdated
+    unresolvedSortedThreads
   };
 }
-function useBlockCommentsActions(reflowComments = noop) {
+function useBlockCommentsActions() {
   const { createNotice } = useDispatch(noticesStore);
   const { saveEntityRecord, deleteEntityRecord } = useDispatch(coreStore);
   const { getCurrentPostId } = useSelect(editorStore);
@@ -167,10 +162,8 @@ function useBlockCommentsActions(reflowComments = noop) {
           isDismissible: true
         }
       );
-      setTimeout(reflowComments, 300);
       return savedRecord;
     } catch (error) {
-      reflowComments();
       onError(error);
     }
   };
@@ -226,9 +219,7 @@ function useBlockCommentsActions(reflowComments = noop) {
           isDismissible: true
         }
       );
-      reflowComments();
     } catch (error) {
-      reflowComments();
       onError(error);
     }
   };
@@ -257,9 +248,7 @@ function useBlockCommentsActions(reflowComments = noop) {
         type: "snackbar",
         isDismissible: true
       });
-      reflowComments();
     } catch (error) {
-      reflowComments();
       onError(error);
     }
   };
@@ -286,26 +275,47 @@ function useEnableFloatingSidebar(enabled = false) {
     };
   }, [enabled, registry]);
 }
+function useFloatingBoard({ threads, selectedNoteId, isFloating }) {
+  const [boardOffsets, setBoardOffsets] = useState({});
+  const [store] = useState(createBoardStore);
+  const { setCanvasMinHeight } = unlock(useDispatch(editorStore));
+  const heights = useSyncExternalStore(store.subscribe, store.getSnapshot);
+  useEffect(() => {
+    if (!isFloating) {
+      return;
+    }
+    const rafId = window.requestAnimationFrame(() => {
+      const { offsets, minHeight } = calculateAllOffsets({
+        threads,
+        selectedNoteId,
+        blockRects: store.getBlockRects(),
+        heights
+      });
+      setBoardOffsets(offsets);
+      setCanvasMinHeight(minHeight);
+    });
+    return () => window.cancelAnimationFrame(rafId);
+  }, [
+    heights,
+    isFloating,
+    selectedNoteId,
+    setCanvasMinHeight,
+    store,
+    threads
+  ]);
+  return {
+    boardOffsets,
+    registerThread: store.registerThread,
+    unregisterThread: store.unregisterThread
+  };
+}
 function useFloatingThread({
   thread,
   calculatedOffset,
-  setHeights,
-  selectedThread,
-  setBlockRef,
-  commentLastUpdated
+  registerThread,
+  unregisterThread
 }) {
   const blockElement = useBlockElement(thread.blockClientId);
-  const updateHeight = useCallback(
-    (id, newHeight) => {
-      setHeights((prev) => {
-        if (prev[id] !== newHeight) {
-          return { ...prev, [id]: newHeight };
-        }
-        return prev;
-      });
-    },
-    [setHeights]
-  );
   const { y, refs } = useFloating({
     placement: "right-start",
     middleware: [
@@ -319,23 +329,19 @@ function useFloatingThread({
     if (blockElement) {
       refs.setReference(blockElement);
     }
-  }, [blockElement, refs, commentLastUpdated]);
-  useEffect(() => {
-    if (refs.floating?.current) {
-      setBlockRef(thread.id, blockElement);
-    }
-  }, [blockElement, thread.id, refs.floating, setBlockRef]);
+  }, [blockElement, refs]);
   useEffect(() => {
-    if (refs.floating?.current) {
-      const newHeight = refs.floating.current.scrollHeight;
-      updateHeight(thread.id, newHeight);
+    const floatingEl = refs.floating?.current;
+    if (floatingEl && registerThread) {
+      registerThread(thread.id, blockElement, floatingEl);
     }
+    return () => unregisterThread?.(thread.id);
   }, [
+    blockElement,
     thread.id,
-    updateHeight,
     refs.floating,
-    selectedThread,
-    commentLastUpdated
+    registerThread,
+    unregisterThread
   ]);
   return {
     y,
@@ -346,6 +352,7 @@ export {
   useBlockComments,
   useBlockCommentsActions,
   useEnableFloatingSidebar,
+  useFloatingBoard,
   useFloatingThread
 };
 //# sourceMappingURL=hooks.mjs.map

package/build-module/components/collab-sidebar/hooks.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/collab-sidebar/hooks.js"],
-  "sourcesContent": ["/**\n * External dependencies\n */\nimport {\n\tuseFloating,\n\toffset as offsetMiddleware,\n\tautoUpdate,\n} from '@floating-ui/react-dom';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport {\n\tuseEffect,\n\tuseMemo,\n\tuseCallback,\n\tuseReducer,\n} from '@wordpress/element';\nimport { useEntityRecords, store as coreStore } from '@wordpress/core-data';\nimport { useDispatch, useRegistry, useSelect } from '@wordpress/data';\nimport {\n\tstore as blockEditorStore,\n\tprivateApis as blockEditorPrivateApis,\n} from '@wordpress/block-editor';\nimport { store as noticesStore } from '@wordpress/notices';\nimport { decodeEntities } from '@wordpress/html-entities';\nimport { store as interfaceStore } from '@wordpress/interface';\n\n/**\n * Internal dependencies\n */\nimport { store as editorStore } from '../../store';\nimport { FLOATING_NOTES_SIDEBAR } from './constants';\nimport { unlock } from '../../lock-unlock';\nimport { noop } from './utils';\n\nconst { useBlockElement, cleanEmptyObject } = unlock( blockEditorPrivateApis );\n\nexport function useBlockComments( postId ) {\n\tconst [ commentLastUpdated, reflowComments ] = useReducer(\n\t\t() => Date.now(),\n\t\t0\n\t);\n\n\tconst queryArgs = {\n\t\tpost: postId,\n\t\ttype: 'note',\n\t\tstatus: 'all',\n\t\tper_page: -1,\n\t};\n\n\tconst { records: threads } = useEntityRecords(\n\t\t'root',\n\t\t'comment',\n\t\tqueryArgs,\n\t\t{ enabled: !! postId && typeof postId === 'number' }\n\t);\n\n\tconst { getBlockAttributes } = useSelect( blockEditorStore );\n\tconst { clientIds } = useSelect( ( select ) => {\n\t\tconst { getClientIdsWithDescendants } = select( blockEditorStore );\n\t\treturn {\n\t\t\tclientIds: getClientIdsWithDescendants(),\n\t\t};\n\t}, [] );\n\n\t// Process comments to build the tree structure.\n\tconst { resultComments, unresolvedSortedThreads } = useMemo( () => {\n\t\tif ( ! threads || threads.length === 0 ) {\n\t\t\treturn { resultComments: [], unresolvedSortedThreads: [] };\n\t\t}\n\n\t\tconst blocksWithComments = clientIds.reduce( ( results, clientId ) => {\n\t\t\tconst commentId = getBlockAttributes( clientId )?.metadata?.noteId;\n\t\t\tif ( commentId ) {\n\t\t\t\tresults[ clientId ] = commentId;\n\t\t\t}\n\t\t\treturn results;\n\t\t}, {} );\n\n\t\t// Create a compare to store the references to all objects by id.\n\t\tconst compare = {};\n\t\tconst result = [];\n\n\t\t// Create a reverse map for faster lookup.\n\t\tconst commentIdToBlockClientId = Object.keys(\n\t\t\tblocksWithComments\n\t\t).reduce( ( mapping, clientId ) => {\n\t\t\tmapping[ blocksWithComments[ clientId ] ] = clientId;\n\t\t\treturn mapping;\n\t\t}, {} );\n\n\t\t// Initialize each object with an empty `reply` array and map blockClientId.\n\t\tthreads.forEach( ( item ) => {\n\t\t\tconst itemBlock = commentIdToBlockClientId[ item.id ];\n\n\t\t\tcompare[ item.id ] = {\n\t\t\t\t...item,\n\t\t\t\treply: [],\n\t\t\t\tblockClientId: item.parent === 0 ? itemBlock : null,\n\t\t\t};\n\t\t} );\n\n\t\t// Iterate over the data to build the tree structure.\n\t\tthreads.forEach( ( item ) => {\n\t\t\tif ( item.parent === 0 ) {\n\t\t\t\t// If parent is 0, it's a root item, push it to the result array.\n\t\t\t\tresult.push( compare[ item.id ] );\n\t\t\t} else if ( compare[ item.parent ] ) {\n\t\t\t\t// Otherwise, find its parent and push it to the parent's `reply` array.\n\t\t\t\tcompare[ item.parent ].reply.push( compare[ item.id ] );\n\t\t\t}\n\t\t} );\n\n\t\tif ( 0 === result?.length ) {\n\t\t\treturn { resultComments: [], unresolvedSortedThreads: [] };\n\t\t}\n\n\t\tconst updatedResult = result.map( ( item ) => ( {\n\t\t\t...item,\n\t\t\treply: [ ...item.reply ].reverse(),\n\t\t} ) );\n\n\t\tconst threadIdMap = new Map(\n\t\t\tupdatedResult.map( ( thread ) => [ String( thread.id ), thread ] )\n\t\t);\n\n\t\t// Prepare sets to determine which threads are linked to existing blocks.\n\t\tconst mappedIds = new Set(\n\t\t\tObject.values( blocksWithComments ).map( ( id ) => String( id ) )\n\t\t);\n\n\t\t// Get comments by block order, first unresolved, then resolved.\n\t\tconst unresolvedSortedComments = Object.values( blocksWithComments )\n\t\t\t.map( ( commentId ) => threadIdMap.get( String( commentId ) ) )\n\t\t\t.filter(\n\t\t\t\t( thread ) => thread !== undefined && thread.status === 'hold'\n\t\t\t);\n\n\t\tconst resolvedSortedComments = Object.values( blocksWithComments )\n\t\t\t.map( ( commentId ) => threadIdMap.get( String( commentId ) ) )\n\t\t\t.filter(\n\t\t\t\t( thread ) =>\n\t\t\t\t\tthread !== undefined && thread.status === 'approved'\n\t\t\t);\n\n\t\t// Append orphaned notes (whose related block was deleted or missing).\n\t\tconst orphanedComments = updatedResult.filter(\n\t\t\t( thread ) => ! mappedIds.has( String( thread.id ) )\n\t\t);\n\n\t\tconst allSortedComments = [\n\t\t\t...unresolvedSortedComments,\n\t\t\t...resolvedSortedComments,\n\t\t\t...orphanedComments,\n\t\t];\n\n\t\treturn {\n\t\t\tresultComments: allSortedComments,\n\t\t\tunresolvedSortedThreads: unresolvedSortedComments,\n\t\t};\n\t}, [ clientIds, threads, getBlockAttributes ] );\n\n\treturn {\n\t\tresultComments,\n\t\tunresolvedSortedThreads,\n\t\treflowComments,\n\t\tcommentLastUpdated,\n\t};\n}\n\nexport function useBlockCommentsActions( reflowComments = noop ) {\n\tconst { createNotice } = useDispatch( noticesStore );\n\tconst { saveEntityRecord, deleteEntityRecord } = useDispatch( coreStore );\n\tconst { getCurrentPostId } = useSelect( editorStore );\n\tconst { getBlockAttributes, getSelectedBlockClientId } =\n\t\tuseSelect( blockEditorStore );\n\tconst { updateBlockAttributes } = useDispatch( blockEditorStore );\n\n\tconst onError = ( error ) => {\n\t\tconst errorMessage =\n\t\t\terror.message && error.code !== 'unknown_error'\n\t\t\t\t? decodeEntities( error.message )\n\t\t\t\t: __( 'An error occurred while performing an update.' );\n\t\tcreateNotice( 'error', errorMessage, {\n\t\t\ttype: 'snackbar',\n\t\t\tisDismissible: true,\n\t\t} );\n\t};\n\n\tconst onCreate = async ( { content, parent } ) => {\n\t\ttry {\n\t\t\tconst savedRecord = await saveEntityRecord(\n\t\t\t\t'root',\n\t\t\t\t'comment',\n\t\t\t\t{\n\t\t\t\t\tpost: getCurrentPostId(),\n\t\t\t\t\tcontent,\n\t\t\t\t\tstatus: 'hold',\n\t\t\t\t\ttype: 'note',\n\t\t\t\t\tparent: parent || 0,\n\t\t\t\t},\n\t\t\t\t{ throwOnError: true }\n\t\t\t);\n\n\t\t\t// If it's a main comment, update the block attributes with the comment id.\n\t\t\tif ( ! parent && savedRecord?.id ) {\n\t\t\t\tconst clientId = getSelectedBlockClientId();\n\t\t\t\tconst metadata = getBlockAttributes( clientId )?.metadata;\n\t\t\t\tupdateBlockAttributes( clientId, {\n\t\t\t\t\tmetadata: {\n\t\t\t\t\t\t...metadata,\n\t\t\t\t\t\tnoteId: savedRecord.id,\n\t\t\t\t\t},\n\t\t\t\t} );\n\t\t\t}\n\n\t\t\tcreateNotice(\n\t\t\t\t'snackbar',\n\t\t\t\tparent ? __( 'Reply added.' ) : __( 'Note added.' ),\n\t\t\t\t{\n\t\t\t\t\ttype: 'snackbar',\n\t\t\t\t\tisDismissible: true,\n\t\t\t\t}\n\t\t\t);\n\t\t\tsetTimeout( reflowComments, 300 );\n\t\t\treturn savedRecord;\n\t\t} catch ( error ) {\n\t\t\treflowComments();\n\t\t\tonError( error );\n\t\t}\n\t};\n\n\tconst onEdit = async ( { id, content, status } ) => {\n\t\tconst messageType = status ? status : 'updated';\n\t\tconst messages = {\n\t\t\tapproved: __( 'Note marked as resolved.' ),\n\t\t\thold: __( 'Note reopened.' ),\n\t\t\tupdated: __( 'Note updated.' ),\n\t\t};\n\n\t\ttry {\n\t\t\t// For resolution or reopen actions, create a new note with metadata.\n\t\t\tif ( status === 'approved' || status === 'hold' ) {\n\t\t\t\t// First, update the thread status.\n\t\t\t\tawait saveEntityRecord(\n\t\t\t\t\t'root',\n\t\t\t\t\t'comment',\n\t\t\t\t\t{\n\t\t\t\t\t\tid,\n\t\t\t\t\t\tstatus,\n\t\t\t\t\t},\n\t\t\t\t\t{\n\t\t\t\t\t\tthrowOnError: true,\n\t\t\t\t\t}\n\t\t\t\t);\n\n\t\t\t\t// Then create a new comment with the metadata.\n\t\t\t\tconst newCommentData = {\n\t\t\t\t\tpost: getCurrentPostId(),\n\t\t\t\t\tcontent: content || '', // Empty content for resolve, content for reopen.\n\t\t\t\t\ttype: 'note',\n\t\t\t\t\tstatus,\n\t\t\t\t\tparent: id,\n\t\t\t\t\tmeta: {\n\t\t\t\t\t\t_wp_note_status:\n\t\t\t\t\t\t\tstatus === 'approved' ? 'resolved' : 'reopen',\n\t\t\t\t\t},\n\t\t\t\t};\n\n\t\t\t\tawait saveEntityRecord( 'root', 'comment', newCommentData, {\n\t\t\t\t\tthrowOnError: true,\n\t\t\t\t} );\n\t\t\t} else {\n\t\t\t\tconst updateData = {\n\t\t\t\t\tid,\n\t\t\t\t\tcontent,\n\t\t\t\t\tstatus,\n\t\t\t\t};\n\n\t\t\t\tawait saveEntityRecord( 'root', 'comment', updateData, {\n\t\t\t\t\tthrowOnError: true,\n\t\t\t\t} );\n\t\t\t}\n\n\t\t\tcreateNotice(\n\t\t\t\t'snackbar',\n\t\t\t\tmessages[ messageType ] ?? __( 'Note updated.' ),\n\t\t\t\t{\n\t\t\t\t\ttype: 'snackbar',\n\t\t\t\t\tisDismissible: true,\n\t\t\t\t}\n\t\t\t);\n\t\t\treflowComments();\n\t\t} catch ( error ) {\n\t\t\treflowComments();\n\t\t\tonError( error );\n\t\t}\n\t};\n\n\tconst onDelete = async ( comment ) => {\n\t\ttry {\n\t\t\tawait deleteEntityRecord(\n\t\t\t\t'root',\n\t\t\t\t'comment',\n\t\t\t\tcomment.id,\n\t\t\t\tundefined,\n\t\t\t\t{\n\t\t\t\t\tthrowOnError: true,\n\t\t\t\t}\n\t\t\t);\n\n\t\t\tif ( ! comment.parent ) {\n\t\t\t\tconst clientId = getSelectedBlockClientId();\n\t\t\t\tconst metadata = getBlockAttributes( clientId )?.metadata;\n\t\t\t\tupdateBlockAttributes( clientId, {\n\t\t\t\t\tmetadata: cleanEmptyObject( {\n\t\t\t\t\t\t...metadata,\n\t\t\t\t\t\tnoteId: undefined,\n\t\t\t\t\t} ),\n\t\t\t\t} );\n\t\t\t}\n\n\t\t\tcreateNotice( 'snackbar', __( 'Note deleted.' ), {\n\t\t\t\ttype: 'snackbar',\n\t\t\t\tisDismissible: true,\n\t\t\t} );\n\t\t\treflowComments();\n\t\t} catch ( error ) {\n\t\t\treflowComments();\n\t\t\tonError( error );\n\t\t}\n\t};\n\n\treturn { onCreate, onEdit, onDelete };\n}\n\nexport function useEnableFloatingSidebar( enabled = false ) {\n\tconst registry = useRegistry();\n\tuseEffect( () => {\n\t\tif ( ! enabled ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst { getActiveComplementaryArea } =\n\t\t\tregistry.select( interfaceStore );\n\t\tconst { disableComplementaryArea, enableComplementaryArea } =\n\t\t\tregistry.dispatch( interfaceStore );\n\n\t\tconst unsubscribe = registry.subscribe( () => {\n\t\t\t// Return `null` to indicate the user hid the complementary area.\n\t\t\tif ( getActiveComplementaryArea( 'core' ) === null ) {\n\t\t\t\tenableComplementaryArea( 'core', FLOATING_NOTES_SIDEBAR );\n\t\t\t}\n\t\t} );\n\n\t\treturn () => {\n\t\t\tunsubscribe();\n\t\t\tif (\n\t\t\t\tgetActiveComplementaryArea( 'core' ) === FLOATING_NOTES_SIDEBAR\n\t\t\t) {\n\t\t\t\tdisableComplementaryArea( 'core', FLOATING_NOTES_SIDEBAR );\n\t\t\t}\n\t\t};\n\t}, [ enabled, registry ] );\n}\n\nexport function useFloatingThread( {\n\tthread,\n\tcalculatedOffset,\n\tsetHeights,\n\tselectedThread,\n\tsetBlockRef,\n\tcommentLastUpdated,\n} ) {\n\tconst blockElement = useBlockElement( thread.blockClientId );\n\tconst updateHeight = useCallback(\n\t\t( id, newHeight ) => {\n\t\t\tsetHeights( ( prev ) => {\n\t\t\t\tif ( prev[ id ] !== newHeight ) {\n\t\t\t\t\treturn { ...prev, [ id ]: newHeight };\n\t\t\t\t}\n\t\t\t\treturn prev;\n\t\t\t} );\n\t\t},\n\t\t[ setHeights ]\n\t);\n\n\t// Use floating-ui to track the block element's position with the calculated offset.\n\tconst { y, refs } = useFloating( {\n\t\tplacement: 'right-start',\n\t\tmiddleware: [\n\t\t\toffsetMiddleware( {\n\t\t\t\tcrossAxis: calculatedOffset || -16,\n\t\t\t} ),\n\t\t],\n\t\twhileElementsMounted: autoUpdate,\n\t} );\n\n\t// Store the block reference for each thread.\n\tuseEffect( () => {\n\t\tif ( blockElement ) {\n\t\t\trefs.setReference( blockElement );\n\t\t}\n\t}, [ blockElement, refs, commentLastUpdated ] );\n\n\t// Track thread heights.\n\tuseEffect( () => {\n\t\tif ( refs.floating?.current ) {\n\t\t\tsetBlockRef( thread.id, blockElement );\n\t\t}\n\t}, [ blockElement, thread.id, refs.floating, setBlockRef ] );\n\n\t// When the selected thread changes, update heights, triggering offset recalculation.\n\tuseEffect( () => {\n\t\tif ( refs.floating?.current ) {\n\t\t\tconst newHeight = refs.floating.current.scrollHeight;\n\t\t\tupdateHeight( thread.id, newHeight );\n\t\t}\n\t}, [\n\t\tthread.id,\n\t\tupdateHeight,\n\t\trefs.floating,\n\t\tselectedThread,\n\t\tcommentLastUpdated,\n\t] );\n\n\treturn {\n\t\ty,\n\t\trefs,\n\t};\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["/**\n * External dependencies\n */\nimport {\n\tuseFloating,\n\toffset as offsetMiddleware,\n\tautoUpdate,\n} from '@floating-ui/react-dom';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport {\n\tuseState,\n\tuseEffect,\n\tuseMemo,\n\tuseSyncExternalStore,\n} from '@wordpress/element';\nimport { useEntityRecords, store as coreStore } from '@wordpress/core-data';\nimport { useDispatch, useRegistry, useSelect } from '@wordpress/data';\nimport {\n\tstore as blockEditorStore,\n\tprivateApis as blockEditorPrivateApis,\n} from '@wordpress/block-editor';\nimport { store as noticesStore } from '@wordpress/notices';\nimport { decodeEntities } from '@wordpress/html-entities';\nimport { store as interfaceStore } from '@wordpress/interface';\n\n/**\n * Internal dependencies\n */\nimport { store as editorStore } from '../../store';\nimport { FLOATING_NOTES_SIDEBAR } from './constants';\nimport { unlock } from '../../lock-unlock';\nimport { createBoardStore } from './board-store';\nimport { calculateAllOffsets } from './utils';\n\nconst { useBlockElement, cleanEmptyObject } = unlock( blockEditorPrivateApis );\n\nexport function useBlockComments( postId ) {\n\tconst queryArgs = {\n\t\tpost: postId,\n\t\ttype: 'note',\n\t\tstatus: 'all',\n\t\tper_page: -1,\n\t};\n\n\tconst { records: threads } = useEntityRecords(\n\t\t'root',\n\t\t'comment',\n\t\tqueryArgs,\n\t\t{ enabled: !! postId && typeof postId === 'number' }\n\t);\n\n\tconst { getBlockAttributes } = useSelect( blockEditorStore );\n\tconst { clientIds } = useSelect( ( select ) => {\n\t\tconst { getClientIdsWithDescendants } = select( blockEditorStore );\n\t\treturn {\n\t\t\tclientIds: getClientIdsWithDescendants(),\n\t\t};\n\t}, [] );\n\n\t// Process comments to build the tree structure.\n\tconst { resultComments, unresolvedSortedThreads } = useMemo( () => {\n\t\tif ( ! threads || threads.length === 0 ) {\n\t\t\treturn { resultComments: [], unresolvedSortedThreads: [] };\n\t\t}\n\n\t\tconst blocksWithComments = clientIds.reduce( ( results, clientId ) => {\n\t\t\tconst commentId = getBlockAttributes( clientId )?.metadata?.noteId;\n\t\t\tif ( commentId ) {\n\t\t\t\tresults[ clientId ] = commentId;\n\t\t\t}\n\t\t\treturn results;\n\t\t}, {} );\n\n\t\t// Create a compare to store the references to all objects by id.\n\t\tconst compare = {};\n\t\tconst result = [];\n\n\t\t// Create a reverse map for faster lookup.\n\t\tconst commentIdToBlockClientId = Object.keys(\n\t\t\tblocksWithComments\n\t\t).reduce( ( mapping, clientId ) => {\n\t\t\tmapping[ blocksWithComments[ clientId ] ] = clientId;\n\t\t\treturn mapping;\n\t\t}, {} );\n\n\t\t// Initialize each object with an empty `reply` array and map blockClientId.\n\t\tthreads.forEach( ( item ) => {\n\t\t\tconst itemBlock = commentIdToBlockClientId[ item.id ];\n\n\t\t\tcompare[ item.id ] = {\n\t\t\t\t...item,\n\t\t\t\treply: [],\n\t\t\t\tblockClientId: item.parent === 0 ? itemBlock : null,\n\t\t\t};\n\t\t} );\n\n\t\t// Iterate over the data to build the tree structure.\n\t\tthreads.forEach( ( item ) => {\n\t\t\tif ( item.parent === 0 ) {\n\t\t\t\t// If parent is 0, it's a root item, push it to the result array.\n\t\t\t\tresult.push( compare[ item.id ] );\n\t\t\t} else if ( compare[ item.parent ] ) {\n\t\t\t\t// Otherwise, find its parent and push it to the parent's `reply` array.\n\t\t\t\tcompare[ item.parent ].reply.push( compare[ item.id ] );\n\t\t\t}\n\t\t} );\n\n\t\tif ( 0 === result?.length ) {\n\t\t\treturn { resultComments: [], unresolvedSortedThreads: [] };\n\t\t}\n\n\t\tconst updatedResult = result.map( ( item ) => ( {\n\t\t\t...item,\n\t\t\treply: [ ...item.reply ].reverse(),\n\t\t} ) );\n\n\t\tconst threadIdMap = new Map(\n\t\t\tupdatedResult.map( ( thread ) => [ String( thread.id ), thread ] )\n\t\t);\n\n\t\t// Prepare sets to determine which threads are linked to existing blocks.\n\t\tconst mappedIds = new Set(\n\t\t\tObject.values( blocksWithComments ).map( ( id ) => String( id ) )\n\t\t);\n\n\t\t// Get comments by block order, first unresolved, then resolved.\n\t\tconst unresolvedSortedComments = Object.values( blocksWithComments )\n\t\t\t.map( ( commentId ) => threadIdMap.get( String( commentId ) ) )\n\t\t\t.filter(\n\t\t\t\t( thread ) => thread !== undefined && thread.status === 'hold'\n\t\t\t);\n\n\t\tconst resolvedSortedComments = Object.values( blocksWithComments )\n\t\t\t.map( ( commentId ) => threadIdMap.get( String( commentId ) ) )\n\t\t\t.filter(\n\t\t\t\t( thread ) =>\n\t\t\t\t\tthread !== undefined && thread.status === 'approved'\n\t\t\t);\n\n\t\t// Append orphaned notes (whose related block was deleted or missing).\n\t\tconst orphanedComments = updatedResult.filter(\n\t\t\t( thread ) => ! mappedIds.has( String( thread.id ) )\n\t\t);\n\n\t\tconst allSortedComments = [\n\t\t\t...unresolvedSortedComments,\n\t\t\t...resolvedSortedComments,\n\t\t\t...orphanedComments,\n\t\t];\n\n\t\treturn {\n\t\t\tresultComments: allSortedComments,\n\t\t\tunresolvedSortedThreads: unresolvedSortedComments,\n\t\t};\n\t}, [ clientIds, threads, getBlockAttributes ] );\n\n\treturn {\n\t\tresultComments,\n\t\tunresolvedSortedThreads,\n\t};\n}\n\nexport function useBlockCommentsActions() {\n\tconst { createNotice } = useDispatch( noticesStore );\n\tconst { saveEntityRecord, deleteEntityRecord } = useDispatch( coreStore );\n\tconst { getCurrentPostId } = useSelect( editorStore );\n\tconst { getBlockAttributes, getSelectedBlockClientId } =\n\t\tuseSelect( blockEditorStore );\n\tconst { updateBlockAttributes } = useDispatch( blockEditorStore );\n\n\tconst onError = ( error ) => {\n\t\tconst errorMessage =\n\t\t\terror.message && error.code !== 'unknown_error'\n\t\t\t\t? decodeEntities( error.message )\n\t\t\t\t: __( 'An error occurred while performing an update.' );\n\t\tcreateNotice( 'error', errorMessage, {\n\t\t\ttype: 'snackbar',\n\t\t\tisDismissible: true,\n\t\t} );\n\t};\n\n\tconst onCreate = async ( { content, parent } ) => {\n\t\ttry {\n\t\t\tconst savedRecord = await saveEntityRecord(\n\t\t\t\t'root',\n\t\t\t\t'comment',\n\t\t\t\t{\n\t\t\t\t\tpost: getCurrentPostId(),\n\t\t\t\t\tcontent,\n\t\t\t\t\tstatus: 'hold',\n\t\t\t\t\ttype: 'note',\n\t\t\t\t\tparent: parent || 0,\n\t\t\t\t},\n\t\t\t\t{ throwOnError: true }\n\t\t\t);\n\n\t\t\t// If it's a main comment, update the block attributes with the comment id.\n\t\t\tif ( ! parent && savedRecord?.id ) {\n\t\t\t\tconst clientId = getSelectedBlockClientId();\n\t\t\t\tconst metadata = getBlockAttributes( clientId )?.metadata;\n\t\t\t\tupdateBlockAttributes( clientId, {\n\t\t\t\t\tmetadata: {\n\t\t\t\t\t\t...metadata,\n\t\t\t\t\t\tnoteId: savedRecord.id,\n\t\t\t\t\t},\n\t\t\t\t} );\n\t\t\t}\n\n\t\t\tcreateNotice(\n\t\t\t\t'snackbar',\n\t\t\t\tparent ? __( 'Reply added.' ) : __( 'Note added.' ),\n\t\t\t\t{\n\t\t\t\t\ttype: 'snackbar',\n\t\t\t\t\tisDismissible: true,\n\t\t\t\t}\n\t\t\t);\n\t\t\treturn savedRecord;\n\t\t} catch ( error ) {\n\t\t\tonError( error );\n\t\t}\n\t};\n\n\tconst onEdit = async ( { id, content, status } ) => {\n\t\tconst messageType = status ? status : 'updated';\n\t\tconst messages = {\n\t\t\tapproved: __( 'Note marked as resolved.' ),\n\t\t\thold: __( 'Note reopened.' ),\n\t\t\tupdated: __( 'Note updated.' ),\n\t\t};\n\n\t\ttry {\n\t\t\t// For resolution or reopen actions, create a new note with metadata.\n\t\t\tif ( status === 'approved' || status === 'hold' ) {\n\t\t\t\t// First, update the thread status.\n\t\t\t\tawait saveEntityRecord(\n\t\t\t\t\t'root',\n\t\t\t\t\t'comment',\n\t\t\t\t\t{\n\t\t\t\t\t\tid,\n\t\t\t\t\t\tstatus,\n\t\t\t\t\t},\n\t\t\t\t\t{\n\t\t\t\t\t\tthrowOnError: true,\n\t\t\t\t\t}\n\t\t\t\t);\n\n\t\t\t\t// Then create a new comment with the metadata.\n\t\t\t\tconst newCommentData = {\n\t\t\t\t\tpost: getCurrentPostId(),\n\t\t\t\t\tcontent: content || '', // Empty content for resolve, content for reopen.\n\t\t\t\t\ttype: 'note',\n\t\t\t\t\tstatus,\n\t\t\t\t\tparent: id,\n\t\t\t\t\tmeta: {\n\t\t\t\t\t\t_wp_note_status:\n\t\t\t\t\t\t\tstatus === 'approved' ? 'resolved' : 'reopen',\n\t\t\t\t\t},\n\t\t\t\t};\n\n\t\t\t\tawait saveEntityRecord( 'root', 'comment', newCommentData, {\n\t\t\t\t\tthrowOnError: true,\n\t\t\t\t} );\n\t\t\t} else {\n\t\t\t\tconst updateData = {\n\t\t\t\t\tid,\n\t\t\t\t\tcontent,\n\t\t\t\t\tstatus,\n\t\t\t\t};\n\n\t\t\t\tawait saveEntityRecord( 'root', 'comment', updateData, {\n\t\t\t\t\tthrowOnError: true,\n\t\t\t\t} );\n\t\t\t}\n\n\t\t\tcreateNotice(\n\t\t\t\t'snackbar',\n\t\t\t\tmessages[ messageType ] ?? __( 'Note updated.' ),\n\t\t\t\t{\n\t\t\t\t\ttype: 'snackbar',\n\t\t\t\t\tisDismissible: true,\n\t\t\t\t}\n\t\t\t);\n\t\t} catch ( error ) {\n\t\t\tonError( error );\n\t\t}\n\t};\n\n\tconst onDelete = async ( comment ) => {\n\t\ttry {\n\t\t\tawait deleteEntityRecord(\n\t\t\t\t'root',\n\t\t\t\t'comment',\n\t\t\t\tcomment.id,\n\t\t\t\tundefined,\n\t\t\t\t{\n\t\t\t\t\tthrowOnError: true,\n\t\t\t\t}\n\t\t\t);\n\n\t\t\tif ( ! comment.parent ) {\n\t\t\t\tconst clientId = getSelectedBlockClientId();\n\t\t\t\tconst metadata = getBlockAttributes( clientId )?.metadata;\n\t\t\t\tupdateBlockAttributes( clientId, {\n\t\t\t\t\tmetadata: cleanEmptyObject( {\n\t\t\t\t\t\t...metadata,\n\t\t\t\t\t\tnoteId: undefined,\n\t\t\t\t\t} ),\n\t\t\t\t} );\n\t\t\t}\n\n\t\t\tcreateNotice( 'snackbar', __( 'Note deleted.' ), {\n\t\t\t\ttype: 'snackbar',\n\t\t\t\tisDismissible: true,\n\t\t\t} );\n\t\t} catch ( error ) {\n\t\t\tonError( error );\n\t\t}\n\t};\n\n\treturn { onCreate, onEdit, onDelete };\n}\n\nexport function useEnableFloatingSidebar( enabled = false ) {\n\tconst registry = useRegistry();\n\tuseEffect( () => {\n\t\tif ( ! enabled ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst { getActiveComplementaryArea } =\n\t\t\tregistry.select( interfaceStore );\n\t\tconst { disableComplementaryArea, enableComplementaryArea } =\n\t\t\tregistry.dispatch( interfaceStore );\n\n\t\tconst unsubscribe = registry.subscribe( () => {\n\t\t\t// Return `null` to indicate the user hid the complementary area.\n\t\t\tif ( getActiveComplementaryArea( 'core' ) === null ) {\n\t\t\t\tenableComplementaryArea( 'core', FLOATING_NOTES_SIDEBAR );\n\t\t\t}\n\t\t} );\n\n\t\treturn () => {\n\t\t\tunsubscribe();\n\t\t\tif (\n\t\t\t\tgetActiveComplementaryArea( 'core' ) === FLOATING_NOTES_SIDEBAR\n\t\t\t) {\n\t\t\t\tdisableComplementaryArea( 'core', FLOATING_NOTES_SIDEBAR );\n\t\t\t}\n\t\t};\n\t}, [ enabled, registry ] );\n}\n\nexport function useFloatingBoard( { threads, selectedNoteId, isFloating } ) {\n\tconst [ boardOffsets, setBoardOffsets ] = useState( {} );\n\tconst [ store ] = useState( createBoardStore );\n\tconst { setCanvasMinHeight } = unlock( useDispatch( editorStore ) );\n\n\tconst heights = useSyncExternalStore( store.subscribe, store.getSnapshot );\n\n\t// Recalc is deferred to a rAF; the cleanup cancels the pending frame\n\t// when deps change, so back-to-back updates collapse into one paint.\n\tuseEffect( () => {\n\t\tif ( ! isFloating ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst rafId = window.requestAnimationFrame( () => {\n\t\t\tconst { offsets, minHeight } = calculateAllOffsets( {\n\t\t\t\tthreads,\n\t\t\t\tselectedNoteId,\n\t\t\t\tblockRects: store.getBlockRects(),\n\t\t\t\theights,\n\t\t\t} );\n\t\t\tsetBoardOffsets( offsets );\n\t\t\tsetCanvasMinHeight( minHeight );\n\t\t} );\n\n\t\treturn () => window.cancelAnimationFrame( rafId );\n\t}, [\n\t\theights,\n\t\tisFloating,\n\t\tselectedNoteId,\n\t\tsetCanvasMinHeight,\n\t\tstore,\n\t\tthreads,\n\t] );\n\n\treturn {\n\t\tboardOffsets,\n\t\tregisterThread: store.registerThread,\n\t\tunregisterThread: store.unregisterThread,\n\t};\n}\n\nexport function useFloatingThread( {\n\tthread,\n\tcalculatedOffset,\n\tregisterThread,\n\tunregisterThread,\n} ) {\n\tconst blockElement = useBlockElement( thread.blockClientId );\n\n\t// Use floating-ui to track the block element's position with the calculated offset.\n\tconst { y, refs } = useFloating( {\n\t\tplacement: 'right-start',\n\t\tmiddleware: [\n\t\t\toffsetMiddleware( {\n\t\t\t\tcrossAxis: calculatedOffset || -16,\n\t\t\t} ),\n\t\t],\n\t\twhileElementsMounted: autoUpdate,\n\t} );\n\n\t// Set the floating-ui reference element.\n\tuseEffect( () => {\n\t\tif ( blockElement ) {\n\t\t\trefs.setReference( blockElement );\n\t\t}\n\t}, [ blockElement, refs ] );\n\n\t// Register block + floating elements with the board.\n\t// The board's ResizeObserver tracks height changes automatically.\n\tuseEffect( () => {\n\t\tconst floatingEl = refs.floating?.current;\n\t\tif ( floatingEl && registerThread ) {\n\t\t\tregisterThread( thread.id, blockElement, floatingEl );\n\t\t}\n\t\treturn () => unregisterThread?.( thread.id );\n\t}, [\n\t\tblockElement,\n\t\tthread.id,\n\t\trefs.floating,\n\t\tregisterThread,\n\t\tunregisterThread,\n\t] );\n\n\treturn {\n\t\ty,\n\t\trefs,\n\t};\n}\n"],
+  "mappings": "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",
   "names": []
 }

package/build-module/components/collab-sidebar/index.mjs

@@ -32,11 +32,9 @@ function NotesSidebarContent({
   styles,
   comments,
   commentSidebarRef,
-  reflowComments,
-  commentLastUpdated,
   isFloating = false
 }) {
-  const { onCreate, onEdit, onDelete } = useBlockCommentsActions(reflowComments);
+  const { onCreate, onEdit, onDelete } = useBlockCommentsActions();
   return /* @__PURE__ */ jsx(
     VStack,
     {
@@ -59,8 +57,6 @@ function NotesSidebarContent({
           onAddReply: onCreate,
           onCommentDelete: onDelete,
           commentSidebarRef,
-          reflowComments,
-          commentLastUpdated,
           isFloating
         }
       )
@@ -102,12 +98,7 @@ function NotesSidebar({ postId }) {
     (select) => unlock(select(editorStore)).getSelectedNote(),
     []
   );
-  const {
-    resultComments,
-    unresolvedSortedThreads,
-    reflowComments,
-    commentLastUpdated
-  } = useBlockComments(postId);
+  const { resultComments, unresolvedSortedThreads } = useBlockComments(postId);
   const showFloatingSidebar = isLargeViewport;
   const showAllNotesSidebar = resultComments.length > 0 || !showFloatingSidebar;
   useEnableFloatingSidebar(
@@ -195,8 +186,6 @@ function NotesSidebar({ postId }) {
           {
             comments: unresolvedSortedThreads,
             commentSidebarRef,
-            reflowComments,
-            commentLastUpdated,
             styles: {
               backgroundColor
             },

package/build-module/components/collab-sidebar/index.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/collab-sidebar/index.js"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { __experimentalVStack as VStack } from '@wordpress/components';\nimport { useRef } from '@wordpress/element';\nimport { useViewportMatch } from '@wordpress/compose';\nimport { useShortcut } from '@wordpress/keyboard-shortcuts';\nimport { comment as commentIcon } from '@wordpress/icons';\nimport { store as blockEditorStore } from '@wordpress/block-editor';\nimport { store as interfaceStore } from '@wordpress/interface';\nimport { store as preferencesStore } from '@wordpress/preferences';\n\n/**\n * Internal dependencies\n */\nimport PluginSidebar from '../plugin-sidebar';\nimport {\n\tALL_NOTES_SIDEBAR,\n\tFLOATING_NOTES_SIDEBAR,\n\tSIDEBARS,\n} from './constants';\nimport { Comments } from './comments';\nimport { store as editorStore } from '../../store';\nimport AddCommentMenuItem from './comment-menu-item';\nimport CommentAvatarIndicator from './comment-indicator-toolbar';\nimport { useGlobalStylesContext } from '../global-styles-provider';\nimport {\n\tuseBlockComments,\n\tuseBlockCommentsActions,\n\tuseEnableFloatingSidebar,\n} from './hooks';\nimport PostTypeSupportCheck from '../post-type-support-check';\nimport { unlock } from '../../lock-unlock';\n\nfunction NotesSidebarContent( {\n\tstyles,\n\tcomments,\n\tcommentSidebarRef,\n\treflowComments,\n\tcommentLastUpdated,\n\tisFloating = false,\n} ) {\n\tconst { onCreate, onEdit, onDelete } =\n\t\tuseBlockCommentsActions( reflowComments );\n\n\treturn (\n\t\t<VStack\n\t\t\tclassName=\"editor-collab-sidebar-panel\"\n\t\t\tstyle={ styles }\n\t\t\trole=\"tree\"\n\t\t\tspacing=\"3\"\n\t\t\tjustify=\"flex-start\"\n\t\t\tref={ ( node ) => {\n\t\t\t\t// Sometimes previous sidebar unmounts after the new one mounts.\n\t\t\t\t// This ensures we always have the latest reference.\n\t\t\t\tif ( node ) {\n\t\t\t\t\t// eslint-disable-next-line react-compiler/react-compiler\n\t\t\t\t\tcommentSidebarRef.current = node;\n\t\t\t\t}\n\t\t\t} }\n\t\t\taria-label={\n\t\t\t\tisFloating ? __( 'Unresolved notes' ) : __( 'All notes' )\n\t\t\t}\n\t\t>\n\t\t\t<Comments\n\t\t\t\tthreads={ comments }\n\t\t\t\tonEditComment={ onEdit }\n\t\t\t\tonAddReply={ onCreate }\n\t\t\t\tonCommentDelete={ onDelete }\n\t\t\t\tcommentSidebarRef={ commentSidebarRef }\n\t\t\t\treflowComments={ reflowComments }\n\t\t\t\tcommentLastUpdated={ commentLastUpdated }\n\t\t\t\tisFloating={ isFloating }\n\t\t\t/>\n\t\t</VStack>\n\t);\n}\n\nfunction NotesSidebar( { postId } ) {\n\tconst { getActiveComplementaryArea } = useSelect( interfaceStore );\n\tconst { enableComplementaryArea } = useDispatch( interfaceStore );\n\tconst { toggleBlockSpotlight, selectBlock } = unlock(\n\t\tuseDispatch( blockEditorStore )\n\t);\n\tconst { selectNote } = unlock( useDispatch( editorStore ) );\n\tconst isLargeViewport = useViewportMatch( 'medium' );\n\tconst commentSidebarRef = useRef( null );\n\n\tconst { clientId, blockCommentId, isClassicBlock } = useSelect(\n\t\t( select ) => {\n\t\t\tconst {\n\t\t\t\tgetBlockAttributes,\n\t\t\t\tgetSelectedBlockClientId,\n\t\t\t\tgetBlockName,\n\t\t\t} = select( blockEditorStore );\n\t\t\tconst _clientId = getSelectedBlockClientId();\n\t\t\treturn {\n\t\t\t\tclientId: _clientId,\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\tisClassicBlock: _clientId\n\t\t\t\t\t? getBlockName( _clientId ) === 'core/freeform'\n\t\t\t\t\t: false,\n\t\t\t};\n\t\t},\n\t\t[]\n\t);\n\tconst { isDistractionFree } = useSelect( ( select ) => {\n\t\tconst { get } = select( preferencesStore );\n\t\treturn {\n\t\t\tisDistractionFree: get( 'core', 'distractionFree' ),\n\t\t};\n\t}, [] );\n\tconst selectedNote = useSelect(\n\t\t( select ) => unlock( select( editorStore ) ).getSelectedNote(),\n\t\t[]\n\t);\n\n\tconst {\n\t\tresultComments,\n\t\tunresolvedSortedThreads,\n\t\treflowComments,\n\t\tcommentLastUpdated,\n\t} = useBlockComments( postId );\n\n\t// Only enable the floating sidebar for large viewports.\n\tconst showFloatingSidebar = isLargeViewport;\n\t// Fallback to \"All notes\" sidebar on smaller viewports.\n\tconst showAllNotesSidebar =\n\t\tresultComments.length > 0 || ! showFloatingSidebar;\n\tuseEnableFloatingSidebar(\n\t\tshowFloatingSidebar &&\n\t\t\t( unresolvedSortedThreads.length > 0 || selectedNote !== undefined )\n\t);\n\n\tuseShortcut(\n\t\t'core/editor/new-note',\n\t\t( event ) => {\n\t\t\tevent.preventDefault();\n\t\t\topenTheSidebar();\n\t\t},\n\t\t{\n\t\t\t// When multiple notes per block are supported. Remove note ID check.\n\t\t\t// See: https://github.com/WordPress/gutenberg/pull/75147.\n\t\t\tisDisabled:\n\t\t\t\tisDistractionFree ||\n\t\t\t\tisClassicBlock ||\n\t\t\t\t! clientId ||\n\t\t\t\t!! blockCommentId,\n\t\t}\n\t);\n\n\t// Get the global styles to set the background color of the sidebar.\n\tconst { merged: GlobalStyles } = useGlobalStylesContext();\n\tconst backgroundColor = GlobalStyles?.styles?.color?.background;\n\n\t// Find the current thread for the selected block.\n\tconst currentThread = blockCommentId\n\t\t? resultComments.find( ( thread ) => thread.id === blockCommentId )\n\t\t: null;\n\n\tasync function openTheSidebar( selectedClientId ) {\n\t\tconst prevArea = await getActiveComplementaryArea( 'core' );\n\t\tconst activeNotesArea = SIDEBARS.find( ( name ) => name === prevArea );\n\t\tconst targetClientId =\n\t\t\tselectedClientId && selectedClientId !== clientId\n\t\t\t\t? selectedClientId\n\t\t\t\t: clientId;\n\t\tconst targetNote = resultComments.find(\n\t\t\t( note ) => note.blockClientId === targetClientId\n\t\t);\n\n\t\tif ( targetNote?.status === 'approved' ) {\n\t\t\tenableComplementaryArea( 'core', ALL_NOTES_SIDEBAR );\n\t\t} else if ( ! activeNotesArea || ! showAllNotesSidebar ) {\n\t\t\tenableComplementaryArea(\n\t\t\t\t'core',\n\t\t\t\tshowFloatingSidebar ? FLOATING_NOTES_SIDEBAR : ALL_NOTES_SIDEBAR\n\t\t\t);\n\t\t}\n\n\t\tconst currentArea = await getActiveComplementaryArea( 'core' );\n\t\t// Bail out if the current active area is not one of note sidebars.\n\t\tif ( ! SIDEBARS.includes( currentArea ) ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// A special case for the List View, where block selection isn't required to trigger an action.\n\t\t// The action won't do anything if the block is already selected.\n\t\tselectBlock( targetClientId, null );\n\t\ttoggleBlockSpotlight( targetClientId, true );\n\t\tselectNote( targetNote ? targetNote.id : 'new', { focus: true } );\n\t}\n\n\tif ( isDistractionFree ) {\n\t\treturn <AddCommentMenuItem isDistractionFree />;\n\t}\n\n\treturn (\n\t\t<>\n\t\t\t{ !! currentThread && (\n\t\t\t\t<CommentAvatarIndicator\n\t\t\t\t\tthread={ currentThread }\n\t\t\t\t\tonClick={ openTheSidebar }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t<AddCommentMenuItem onClick={ openTheSidebar } />\n\t\t\t{ showAllNotesSidebar && (\n\t\t\t\t<PluginSidebar\n\t\t\t\t\tidentifier={ ALL_NOTES_SIDEBAR }\n\t\t\t\t\tname={ ALL_NOTES_SIDEBAR }\n\t\t\t\t\ttitle={ __( 'All notes' ) }\n\t\t\t\t\theader={\n\t\t\t\t\t\t<h2 className=\"interface-complementary-area-header__title\">\n\t\t\t\t\t\t\t{ __( 'All notes' ) }\n\t\t\t\t\t\t</h2>\n\t\t\t\t\t}\n\t\t\t\t\ticon={ commentIcon }\n\t\t\t\t\tcloseLabel={ __( 'Close Notes' ) }\n\t\t\t\t>\n\t\t\t\t\t<NotesSidebarContent\n\t\t\t\t\t\tcomments={ resultComments }\n\t\t\t\t\t\tcommentSidebarRef={ commentSidebarRef }\n\t\t\t\t\t/>\n\t\t\t\t</PluginSidebar>\n\t\t\t) }\n\t\t\t{ isLargeViewport && (\n\t\t\t\t<PluginSidebar\n\t\t\t\t\tisPinnable={ false }\n\t\t\t\t\theader={ false }\n\t\t\t\t\tidentifier={ FLOATING_NOTES_SIDEBAR }\n\t\t\t\t\tclassName=\"editor-collab-sidebar\"\n\t\t\t\t\theaderClassName=\"editor-collab-sidebar__header\"\n\t\t\t\t\tbackgroundColor={ backgroundColor }\n\t\t\t\t>\n\t\t\t\t\t<NotesSidebarContent\n\t\t\t\t\t\tcomments={ unresolvedSortedThreads }\n\t\t\t\t\t\tcommentSidebarRef={ commentSidebarRef }\n\t\t\t\t\t\treflowComments={ reflowComments }\n\t\t\t\t\t\tcommentLastUpdated={ commentLastUpdated }\n\t\t\t\t\t\tstyles={ {\n\t\t\t\t\t\t\tbackgroundColor,\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tisFloating\n\t\t\t\t\t/>\n\t\t\t\t</PluginSidebar>\n\t\t\t) }\n\t\t</>\n\t);\n}\n\nexport default function NotesSidebarContainer() {\n\tconst { postId, editorMode, revisionsMode } = useSelect( ( select ) => {\n\t\tconst { getCurrentPostId, getEditorMode, isRevisionsMode } = unlock(\n\t\t\tselect( editorStore )\n\t\t);\n\t\treturn {\n\t\t\tpostId: getCurrentPostId(),\n\t\t\teditorMode: getEditorMode(),\n\t\t\trevisionsMode: isRevisionsMode(),\n\t\t};\n\t}, [] );\n\n\tif ( ! postId || typeof postId !== 'number' ) {\n\t\treturn null;\n\t}\n\n\t// Hide Notes sidebar for Code Editor and in-editor revision mode.\n\tif ( editorMode === 'text' || revisionsMode ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<PostTypeSupportCheck supportKeys=\"editor.notes\">\n\t\t\t<NotesSidebar postId={ postId } />\n\t\t</PostTypeSupportCheck>\n\t);\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { __experimentalVStack as VStack } from '@wordpress/components';\nimport { useRef } from '@wordpress/element';\nimport { useViewportMatch } from '@wordpress/compose';\nimport { useShortcut } from '@wordpress/keyboard-shortcuts';\nimport { comment as commentIcon } from '@wordpress/icons';\nimport { store as blockEditorStore } from '@wordpress/block-editor';\nimport { store as interfaceStore } from '@wordpress/interface';\nimport { store as preferencesStore } from '@wordpress/preferences';\n\n/**\n * Internal dependencies\n */\nimport PluginSidebar from '../plugin-sidebar';\nimport {\n\tALL_NOTES_SIDEBAR,\n\tFLOATING_NOTES_SIDEBAR,\n\tSIDEBARS,\n} from './constants';\nimport { Comments } from './comments';\nimport { store as editorStore } from '../../store';\nimport AddCommentMenuItem from './comment-menu-item';\nimport CommentAvatarIndicator from './comment-indicator-toolbar';\nimport { useGlobalStylesContext } from '../global-styles-provider';\nimport {\n\tuseBlockComments,\n\tuseBlockCommentsActions,\n\tuseEnableFloatingSidebar,\n} from './hooks';\nimport PostTypeSupportCheck from '../post-type-support-check';\nimport { unlock } from '../../lock-unlock';\n\nfunction NotesSidebarContent( {\n\tstyles,\n\tcomments,\n\tcommentSidebarRef,\n\tisFloating = false,\n} ) {\n\tconst { onCreate, onEdit, onDelete } = useBlockCommentsActions();\n\n\treturn (\n\t\t<VStack\n\t\t\tclassName=\"editor-collab-sidebar-panel\"\n\t\t\tstyle={ styles }\n\t\t\trole=\"tree\"\n\t\t\tspacing=\"3\"\n\t\t\tjustify=\"flex-start\"\n\t\t\tref={ ( node ) => {\n\t\t\t\t// Sometimes previous sidebar unmounts after the new one mounts.\n\t\t\t\t// This ensures we always have the latest reference.\n\t\t\t\tif ( node ) {\n\t\t\t\t\t// eslint-disable-next-line react-compiler/react-compiler\n\t\t\t\t\tcommentSidebarRef.current = node;\n\t\t\t\t}\n\t\t\t} }\n\t\t\taria-label={\n\t\t\t\tisFloating ? __( 'Unresolved notes' ) : __( 'All notes' )\n\t\t\t}\n\t\t>\n\t\t\t<Comments\n\t\t\t\tthreads={ comments }\n\t\t\t\tonEditComment={ onEdit }\n\t\t\t\tonAddReply={ onCreate }\n\t\t\t\tonCommentDelete={ onDelete }\n\t\t\t\tcommentSidebarRef={ commentSidebarRef }\n\t\t\t\tisFloating={ isFloating }\n\t\t\t/>\n\t\t</VStack>\n\t);\n}\n\nfunction NotesSidebar( { postId } ) {\n\tconst { getActiveComplementaryArea } = useSelect( interfaceStore );\n\tconst { enableComplementaryArea } = useDispatch( interfaceStore );\n\tconst { toggleBlockSpotlight, selectBlock } = unlock(\n\t\tuseDispatch( blockEditorStore )\n\t);\n\tconst { selectNote } = unlock( useDispatch( editorStore ) );\n\tconst isLargeViewport = useViewportMatch( 'medium' );\n\tconst commentSidebarRef = useRef( null );\n\n\tconst { clientId, blockCommentId, isClassicBlock } = useSelect(\n\t\t( select ) => {\n\t\t\tconst {\n\t\t\t\tgetBlockAttributes,\n\t\t\t\tgetSelectedBlockClientId,\n\t\t\t\tgetBlockName,\n\t\t\t} = select( blockEditorStore );\n\t\t\tconst _clientId = getSelectedBlockClientId();\n\t\t\treturn {\n\t\t\t\tclientId: _clientId,\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\tisClassicBlock: _clientId\n\t\t\t\t\t? getBlockName( _clientId ) === 'core/freeform'\n\t\t\t\t\t: false,\n\t\t\t};\n\t\t},\n\t\t[]\n\t);\n\tconst { isDistractionFree } = useSelect( ( select ) => {\n\t\tconst { get } = select( preferencesStore );\n\t\treturn {\n\t\t\tisDistractionFree: get( 'core', 'distractionFree' ),\n\t\t};\n\t}, [] );\n\tconst selectedNote = useSelect(\n\t\t( select ) => unlock( select( editorStore ) ).getSelectedNote(),\n\t\t[]\n\t);\n\n\tconst { resultComments, unresolvedSortedThreads } =\n\t\tuseBlockComments( postId );\n\n\t// Only enable the floating sidebar for large viewports.\n\tconst showFloatingSidebar = isLargeViewport;\n\t// Fallback to \"All notes\" sidebar on smaller viewports.\n\tconst showAllNotesSidebar =\n\t\tresultComments.length > 0 || ! showFloatingSidebar;\n\tuseEnableFloatingSidebar(\n\t\tshowFloatingSidebar &&\n\t\t\t( unresolvedSortedThreads.length > 0 || selectedNote !== undefined )\n\t);\n\n\tuseShortcut(\n\t\t'core/editor/new-note',\n\t\t( event ) => {\n\t\t\tevent.preventDefault();\n\t\t\topenTheSidebar();\n\t\t},\n\t\t{\n\t\t\t// When multiple notes per block are supported. Remove note ID check.\n\t\t\t// See: https://github.com/WordPress/gutenberg/pull/75147.\n\t\t\tisDisabled:\n\t\t\t\tisDistractionFree ||\n\t\t\t\tisClassicBlock ||\n\t\t\t\t! clientId ||\n\t\t\t\t!! blockCommentId,\n\t\t}\n\t);\n\n\t// Get the global styles to set the background color of the sidebar.\n\tconst { merged: GlobalStyles } = useGlobalStylesContext();\n\tconst backgroundColor = GlobalStyles?.styles?.color?.background;\n\n\t// Find the current thread for the selected block.\n\tconst currentThread = blockCommentId\n\t\t? resultComments.find( ( thread ) => thread.id === blockCommentId )\n\t\t: null;\n\n\tasync function openTheSidebar( selectedClientId ) {\n\t\tconst prevArea = await getActiveComplementaryArea( 'core' );\n\t\tconst activeNotesArea = SIDEBARS.find( ( name ) => name === prevArea );\n\t\tconst targetClientId =\n\t\t\tselectedClientId && selectedClientId !== clientId\n\t\t\t\t? selectedClientId\n\t\t\t\t: clientId;\n\t\tconst targetNote = resultComments.find(\n\t\t\t( note ) => note.blockClientId === targetClientId\n\t\t);\n\n\t\tif ( targetNote?.status === 'approved' ) {\n\t\t\tenableComplementaryArea( 'core', ALL_NOTES_SIDEBAR );\n\t\t} else if ( ! activeNotesArea || ! showAllNotesSidebar ) {\n\t\t\tenableComplementaryArea(\n\t\t\t\t'core',\n\t\t\t\tshowFloatingSidebar ? FLOATING_NOTES_SIDEBAR : ALL_NOTES_SIDEBAR\n\t\t\t);\n\t\t}\n\n\t\tconst currentArea = await getActiveComplementaryArea( 'core' );\n\t\t// Bail out if the current active area is not one of note sidebars.\n\t\tif ( ! SIDEBARS.includes( currentArea ) ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// A special case for the List View, where block selection isn't required to trigger an action.\n\t\t// The action won't do anything if the block is already selected.\n\t\tselectBlock( targetClientId, null );\n\t\ttoggleBlockSpotlight( targetClientId, true );\n\t\tselectNote( targetNote ? targetNote.id : 'new', { focus: true } );\n\t}\n\n\tif ( isDistractionFree ) {\n\t\treturn <AddCommentMenuItem isDistractionFree />;\n\t}\n\n\treturn (\n\t\t<>\n\t\t\t{ !! currentThread && (\n\t\t\t\t<CommentAvatarIndicator\n\t\t\t\t\tthread={ currentThread }\n\t\t\t\t\tonClick={ openTheSidebar }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t<AddCommentMenuItem onClick={ openTheSidebar } />\n\t\t\t{ showAllNotesSidebar && (\n\t\t\t\t<PluginSidebar\n\t\t\t\t\tidentifier={ ALL_NOTES_SIDEBAR }\n\t\t\t\t\tname={ ALL_NOTES_SIDEBAR }\n\t\t\t\t\ttitle={ __( 'All notes' ) }\n\t\t\t\t\theader={\n\t\t\t\t\t\t<h2 className=\"interface-complementary-area-header__title\">\n\t\t\t\t\t\t\t{ __( 'All notes' ) }\n\t\t\t\t\t\t</h2>\n\t\t\t\t\t}\n\t\t\t\t\ticon={ commentIcon }\n\t\t\t\t\tcloseLabel={ __( 'Close Notes' ) }\n\t\t\t\t>\n\t\t\t\t\t<NotesSidebarContent\n\t\t\t\t\t\tcomments={ resultComments }\n\t\t\t\t\t\tcommentSidebarRef={ commentSidebarRef }\n\t\t\t\t\t/>\n\t\t\t\t</PluginSidebar>\n\t\t\t) }\n\t\t\t{ isLargeViewport && (\n\t\t\t\t<PluginSidebar\n\t\t\t\t\tisPinnable={ false }\n\t\t\t\t\theader={ false }\n\t\t\t\t\tidentifier={ FLOATING_NOTES_SIDEBAR }\n\t\t\t\t\tclassName=\"editor-collab-sidebar\"\n\t\t\t\t\theaderClassName=\"editor-collab-sidebar__header\"\n\t\t\t\t\tbackgroundColor={ backgroundColor }\n\t\t\t\t>\n\t\t\t\t\t<NotesSidebarContent\n\t\t\t\t\t\tcomments={ unresolvedSortedThreads }\n\t\t\t\t\t\tcommentSidebarRef={ commentSidebarRef }\n\t\t\t\t\t\tstyles={ {\n\t\t\t\t\t\t\tbackgroundColor,\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tisFloating\n\t\t\t\t\t/>\n\t\t\t\t</PluginSidebar>\n\t\t\t) }\n\t\t</>\n\t);\n}\n\nexport default function NotesSidebarContainer() {\n\tconst { postId, editorMode, revisionsMode } = useSelect( ( select ) => {\n\t\tconst { getCurrentPostId, getEditorMode, isRevisionsMode } = unlock(\n\t\t\tselect( editorStore )\n\t\t);\n\t\treturn {\n\t\t\tpostId: getCurrentPostId(),\n\t\t\teditorMode: getEditorMode(),\n\t\t\trevisionsMode: isRevisionsMode(),\n\t\t};\n\t}, [] );\n\n\tif ( ! postId || typeof postId !== 'number' ) {\n\t\treturn null;\n\t}\n\n\t// Hide Notes sidebar for Code Editor and in-editor revision mode.\n\tif ( editorMode === 'text' || revisionsMode ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<PostTypeSupportCheck supportKeys=\"editor.notes\">\n\t\t\t<NotesSidebar postId={ postId } />\n\t\t</PostTypeSupportCheck>\n\t);\n}\n"],
+  "mappings": "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",
   "names": []
 }

package/build-module/components/collab-sidebar/utils.mjs

@@ -3,8 +3,10 @@ import { _x } from "@wordpress/i18n";
 function sanitizeCommentString(str) {
   return str.trim();
 }
-function noop() {
-}
+var THREAD_ALIGN_OFFSET = -16;
+var THREAD_GAP = 16;
+var OVERLAP_MARGIN = 20;
+var BOARD_BOTTOM_PADDING = 32;
 var AVATAR_BORDER_COLORS = [
   "#C36EFF",
   // Purple
@@ -43,6 +45,72 @@ function getCommentExcerpt(text, excerptLength = 10) {
   const isTrimmed = trimmedExcerpt !== rawText;
   return isTrimmed ? trimmedExcerpt + "\u2026" : trimmedExcerpt;
 }
+function calculateAllOffsets({
+  threads,
+  selectedNoteId,
+  blockRects,
+  heights
+}) {
+  const offsets = {};
+  const anchorIndex = Math.max(
+    0,
+    threads.findIndex((thread) => thread.id === selectedNoteId)
+  );
+  const anchorThread = threads[anchorIndex];
+  if (!anchorThread || !blockRects[anchorThread.id]) {
+    return { offsets, minHeight: 0 };
+  }
+  const anchorRect = blockRects[anchorThread.id];
+  const anchorTop = anchorRect.top || 0;
+  const anchorHeight = heights[anchorThread.id] || 0;
+  offsets[anchorThread.id] = THREAD_ALIGN_OFFSET;
+  let prevAdjustedTop = anchorTop + THREAD_ALIGN_OFFSET;
+  let prevHeight = anchorHeight;
+  for (let i = anchorIndex + 1; i < threads.length; i++) {
+    const thread = threads[i];
+    const threadRect = blockRects[thread.id];
+    if (!threadRect) {
+      continue;
+    }
+    const threadTop = threadRect.top || 0;
+    const threadHeight = heights[thread.id] || 0;
+    let offset = THREAD_ALIGN_OFFSET;
+    const prevBottom = prevAdjustedTop + prevHeight;
+    if (threadTop < prevBottom + THREAD_GAP) {
+      offset = prevBottom - threadTop + OVERLAP_MARGIN;
+    }
+    offsets[thread.id] = offset;
+    prevAdjustedTop = threadTop + offset;
+    prevHeight = threadHeight;
+  }
+  let belowAdjustedTop = anchorTop + THREAD_ALIGN_OFFSET;
+  for (let i = anchorIndex - 1; i >= 0; i--) {
+    const thread = threads[i];
+    const threadRect = blockRects[thread.id];
+    if (!threadRect) {
+      continue;
+    }
+    const threadTop = threadRect.top || 0;
+    const threadHeight = heights[thread.id] || 0;
+    let offset = THREAD_ALIGN_OFFSET;
+    const threadBottom = threadTop + threadHeight;
+    if (threadBottom > belowAdjustedTop) {
+      offset = belowAdjustedTop - threadTop - threadHeight - OVERLAP_MARGIN;
+    }
+    offsets[thread.id] = offset;
+    belowAdjustedTop = threadTop + offset;
+  }
+  let editorMinHeight = 0;
+  const lastThread = threads[threads.length - 1];
+  const lastBlockRect = blockRects[lastThread.id];
+  if (lastBlockRect) {
+    const lastThreadTop = lastBlockRect.top || 0;
+    const lastThreadHeight = heights[lastThread.id] || 0;
+    const lastThreadOffset = offsets[lastThread.id] || 0;
+    editorMinHeight = lastThreadTop + lastThreadHeight + lastThreadOffset + BOARD_BOTTOM_PADDING;
+  }
+  return { offsets, minHeight: editorMinHeight };
+}
 function focusCommentThread(commentId, container, additionalSelector) {
   if (!container) {
     return;
@@ -72,10 +140,10 @@ function focusCommentThread(commentId, container, additionalSelector) {
   }).then((element) => element?.focus());
 }
 export {
+  calculateAllOffsets,
   focusCommentThread,
   getAvatarBorderColor,
   getCommentExcerpt,
-  noop,
   sanitizeCommentString
 };
 //# sourceMappingURL=utils.mjs.map

package/build-module/components/collab-sidebar/utils.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/collab-sidebar/utils.js"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { _x } from '@wordpress/i18n';\n\n/**\n * Sanitizes a comment string by removing non-printable ASCII characters.\n *\n * @param {string} str - The comment string to sanitize.\n * @return {string} - The sanitized comment string.\n */\nexport function sanitizeCommentString( str ) {\n\treturn str.trim();\n}\n\n/**\n * A no-operation function that does nothing.\n */\nexport function noop() {}\n\n/**\n * Avatar border colors chosen to be visually distinct from each other and from\n * the editor's semantic UI colors (Delta E > 10 between all pairs).\n */\nconst AVATAR_BORDER_COLORS = [\n\t'#C36EFF', // Purple\n\t'#FF51A8', // Pink\n\t'#E4780A', // Orange\n\t'#FF35EE', // Magenta\n\t'#879F11', // Olive\n\t'#46A494', // Teal\n\t'#00A2C3', // Cyan\n];\n\n/**\n * Gets the border color for an avatar based on the user ID.\n *\n * @param {number} userId - The user ID.\n * @return {string} - The border color.\n */\nexport function getAvatarBorderColor( userId ) {\n\treturn AVATAR_BORDER_COLORS[ userId % AVATAR_BORDER_COLORS.length ];\n}\n\n/**\n * Generates a comment excerpt from text based on word count type and length.\n *\n * @param {string} text          - The comment text to generate excerpt from.\n * @param {number} excerptLength - The maximum length for the commentexcerpt.\n * @return {string} - The generated comment excerpt.\n */\nexport function getCommentExcerpt( text, excerptLength = 10 ) {\n\tif ( ! text ) {\n\t\treturn '';\n\t}\n\n\t/*\n\t * translators: If your word count is based on single characters (e.g. East Asian characters),\n\t * enter 'characters_excluding_spaces' or 'characters_including_spaces'. Otherwise, enter 'words'.\n\t * Do not translate into your own language.\n\t */\n\tconst wordCountType = _x( 'words', 'Word count type. Do not translate!' );\n\n\tconst rawText = text.trim();\n\tlet trimmedExcerpt = '';\n\n\tif ( wordCountType === 'words' ) {\n\t\ttrimmedExcerpt = rawText.split( ' ', excerptLength ).join( ' ' );\n\t} else if ( wordCountType === 'characters_excluding_spaces' ) {\n\t\t/*\n\t\t * 1. Split the text at the character limit,\n\t\t * then join the substrings back into one string.\n\t\t * 2. Count the number of spaces in the text\n\t\t * by comparing the lengths of the string with and without spaces.\n\t\t * 3. Add the number to the length of the visible excerpt,\n\t\t * so that the spaces are excluded from the word count.\n\t\t */\n\t\tconst textWithSpaces = rawText.split( '', excerptLength ).join( '' );\n\n\t\tconst numberOfSpaces =\n\t\t\ttextWithSpaces.length - textWithSpaces.replaceAll( ' ', '' ).length;\n\n\t\ttrimmedExcerpt = rawText\n\t\t\t.split( '', excerptLength + numberOfSpaces )\n\t\t\t.join( '' );\n\t} else if ( wordCountType === 'characters_including_spaces' ) {\n\t\ttrimmedExcerpt = rawText.split( '', excerptLength ).join( '' );\n\t}\n\n\tconst isTrimmed = trimmedExcerpt !== rawText;\n\treturn isTrimmed ? trimmedExcerpt + '\u2026' : trimmedExcerpt;\n}\n\n/**\n * Shift focus to the comment thread associated with a particular comment ID.\n * If an additional selector is provided, the focus will be shifted to the element matching the selector.\n *\n * @typedef {import('@wordpress/element').RefObject} RefObject\n *\n * @param {string}       commentId          The ID of the comment thread to focus.\n * @param {?HTMLElement} container          The container element to search within.\n * @param {string}       additionalSelector The additional selector to focus on.\n */\nexport function focusCommentThread( commentId, container, additionalSelector ) {\n\tif ( ! container ) {\n\t\treturn;\n\t}\n\n\t// A thread without a commentId is a new comment thread.\n\tconst threadSelector =\n\t\tcommentId && commentId !== 'new'\n\t\t\t? `[role=treeitem][id=\"comment-thread-${ commentId }\"]`\n\t\t\t: '[role=treeitem]:not([id])';\n\tconst selector = additionalSelector\n\t\t? `${ threadSelector } ${ additionalSelector }`\n\t\t: threadSelector;\n\n\treturn new Promise( ( resolve ) => {\n\t\tif ( container.querySelector( selector ) ) {\n\t\t\treturn resolve( container.querySelector( selector ) );\n\t\t}\n\n\t\tlet timer = null;\n\t\t// Wait for the element to be added to the DOM.\n\t\tconst observer = new window.MutationObserver( () => {\n\t\t\tif ( container.querySelector( selector ) ) {\n\t\t\t\tclearTimeout( timer );\n\t\t\t\tobserver.disconnect();\n\t\t\t\tresolve( container.querySelector( selector ) );\n\t\t\t}\n\t\t} );\n\n\t\tobserver.observe( container, {\n\t\t\tchildList: true,\n\t\t\tsubtree: true,\n\t\t} );\n\n\t\t// Stop trying after 3 seconds.\n\t\ttimer = setTimeout( () => {\n\t\t\tobserver.disconnect();\n\t\t\tresolve( null );\n\t\t}, 3000 );\n\t} ).then( ( element ) => element?.focus() );\n}\n"],
-  "mappings": ";AAGA,SAAS,UAAU;AAQZ,SAAS,sBAAuB,KAAM;AAC5C,SAAO,IAAI,KAAK;AACjB;AAKO,SAAS,OAAO;AAAC;AAMxB,IAAM,uBAAuB;AAAA,EAC5B;AAAA;AAAA,EACA;AAAA;AAAA,EACA;AAAA;AAAA,EACA;AAAA;AAAA,EACA;AAAA;AAAA,EACA;AAAA;AAAA,EACA;AAAA;AACD;AAQO,SAAS,qBAAsB,QAAS;AAC9C,SAAO,qBAAsB,SAAS,qBAAqB,MAAO;AACnE;AASO,SAAS,kBAAmB,MAAM,gBAAgB,IAAK;AAC7D,MAAK,CAAE,MAAO;AACb,WAAO;AAAA,EACR;AAOA,QAAM,gBAAgB,GAAI,SAAS,oCAAqC;AAExE,QAAM,UAAU,KAAK,KAAK;AAC1B,MAAI,iBAAiB;AAErB,MAAK,kBAAkB,SAAU;AAChC,qBAAiB,QAAQ,MAAO,KAAK,aAAc,EAAE,KAAM,GAAI;AAAA,EAChE,WAAY,kBAAkB,+BAAgC;AAS7D,UAAM,iBAAiB,QAAQ,MAAO,IAAI,aAAc,EAAE,KAAM,EAAG;AAEnE,UAAM,iBACL,eAAe,SAAS,eAAe,WAAY,KAAK,EAAG,EAAE;AAE9D,qBAAiB,QACf,MAAO,IAAI,gBAAgB,cAAe,EAC1C,KAAM,EAAG;AAAA,EACZ,WAAY,kBAAkB,+BAAgC;AAC7D,qBAAiB,QAAQ,MAAO,IAAI,aAAc,EAAE,KAAM,EAAG;AAAA,EAC9D;AAEA,QAAM,YAAY,mBAAmB;AACrC,SAAO,YAAY,iBAAiB,WAAM;AAC3C;AAYO,SAAS,mBAAoB,WAAW,WAAW,oBAAqB;AAC9E,MAAK,CAAE,WAAY;AAClB;AAAA,EACD;AAGA,QAAM,iBACL,aAAa,cAAc,QACxB,sCAAuC,SAAU,OACjD;AACJ,QAAM,WAAW,qBACd,GAAI,cAAe,IAAK,kBAAmB,KAC3C;AAEH,SAAO,IAAI,QAAS,CAAE,YAAa;AAClC,QAAK,UAAU,cAAe,QAAS,GAAI;AAC1C,aAAO,QAAS,UAAU,cAAe,QAAS,CAAE;AAAA,IACrD;AAEA,QAAI,QAAQ;AAEZ,UAAM,WAAW,IAAI,OAAO,iBAAkB,MAAM;AACnD,UAAK,UAAU,cAAe,QAAS,GAAI;AAC1C,qBAAc,KAAM;AACpB,iBAAS,WAAW;AACpB,gBAAS,UAAU,cAAe,QAAS,CAAE;AAAA,MAC9C;AAAA,IACD,CAAE;AAEF,aAAS,QAAS,WAAW;AAAA,MAC5B,WAAW;AAAA,MACX,SAAS;AAAA,IACV,CAAE;AAGF,YAAQ,WAAY,MAAM;AACzB,eAAS,WAAW;AACpB,cAAS,IAAK;AAAA,IACf,GAAG,GAAK;AAAA,EACT,CAAE,EAAE,KAAM,CAAE,YAAa,SAAS,MAAM,CAAE;AAC3C;",
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { _x } from '@wordpress/i18n';\n\n/**\n * Sanitizes a comment string by removing non-printable ASCII characters.\n *\n * @param {string} str - The comment string to sanitize.\n * @return {string} - The sanitized comment string.\n */\nexport function sanitizeCommentString( str ) {\n\treturn str.trim();\n}\n\nconst THREAD_ALIGN_OFFSET = -16;\nconst THREAD_GAP = 16;\nconst OVERLAP_MARGIN = 20;\nconst BOARD_BOTTOM_PADDING = 32;\n\n/**\n * Avatar border colors chosen to be visually distinct from each other and from\n * the editor's semantic UI colors (Delta E > 10 between all pairs).\n */\nconst AVATAR_BORDER_COLORS = [\n\t'#C36EFF', // Purple\n\t'#FF51A8', // Pink\n\t'#E4780A', // Orange\n\t'#FF35EE', // Magenta\n\t'#879F11', // Olive\n\t'#46A494', // Teal\n\t'#00A2C3', // Cyan\n];\n\n/**\n * Gets the border color for an avatar based on the user ID.\n *\n * @param {number} userId - The user ID.\n * @return {string} - The border color.\n */\nexport function getAvatarBorderColor( userId ) {\n\treturn AVATAR_BORDER_COLORS[ userId % AVATAR_BORDER_COLORS.length ];\n}\n\n/**\n * Generates a comment excerpt from text based on word count type and length.\n *\n * @param {string} text          - The comment text to generate excerpt from.\n * @param {number} excerptLength - The maximum length for the commentexcerpt.\n * @return {string} - The generated comment excerpt.\n */\nexport function getCommentExcerpt( text, excerptLength = 10 ) {\n\tif ( ! text ) {\n\t\treturn '';\n\t}\n\n\t/*\n\t * translators: If your word count is based on single characters (e.g. East Asian characters),\n\t * enter 'characters_excluding_spaces' or 'characters_including_spaces'. Otherwise, enter 'words'.\n\t * Do not translate into your own language.\n\t */\n\tconst wordCountType = _x( 'words', 'Word count type. Do not translate!' );\n\n\tconst rawText = text.trim();\n\tlet trimmedExcerpt = '';\n\n\tif ( wordCountType === 'words' ) {\n\t\ttrimmedExcerpt = rawText.split( ' ', excerptLength ).join( ' ' );\n\t} else if ( wordCountType === 'characters_excluding_spaces' ) {\n\t\t/*\n\t\t * 1. Split the text at the character limit,\n\t\t * then join the substrings back into one string.\n\t\t * 2. Count the number of spaces in the text\n\t\t * by comparing the lengths of the string with and without spaces.\n\t\t * 3. Add the number to the length of the visible excerpt,\n\t\t * so that the spaces are excluded from the word count.\n\t\t */\n\t\tconst textWithSpaces = rawText.split( '', excerptLength ).join( '' );\n\n\t\tconst numberOfSpaces =\n\t\t\ttextWithSpaces.length - textWithSpaces.replaceAll( ' ', '' ).length;\n\n\t\ttrimmedExcerpt = rawText\n\t\t\t.split( '', excerptLength + numberOfSpaces )\n\t\t\t.join( '' );\n\t} else if ( wordCountType === 'characters_including_spaces' ) {\n\t\ttrimmedExcerpt = rawText.split( '', excerptLength ).join( '' );\n\t}\n\n\tconst isTrimmed = trimmedExcerpt !== rawText;\n\treturn isTrimmed ? trimmedExcerpt + '\u2026' : trimmedExcerpt;\n}\n\n/**\n * Calculate y offsets for all floating comment threads. Adjusts positions\n * to prevent overlapping by pushing threads above the selected one upward\n * and threads below it downward.\n *\n * @param {Object}                  params\n * @param {Array}                   params.threads        Ordered list of thread objects.\n * @param {string|number|undefined} params.selectedNoteId ID of the currently selected thread.\n * @param {Object<string,DOMRect>}  params.blockRects     Pre-read bounding rects keyed by thread ID.\n * @param {Object<string,number>}   params.heights        Rendered heights keyed by thread ID.\n * @return {{ offsets: Object<string,number>, minHeight: number }} Computed offsets and minimum editor height.\n */\nexport function calculateAllOffsets( {\n\tthreads,\n\tselectedNoteId,\n\tblockRects,\n\theights,\n} ) {\n\tconst offsets = {};\n\n\tconst anchorIndex = Math.max(\n\t\t0,\n\t\tthreads.findIndex( ( thread ) => thread.id === selectedNoteId )\n\t);\n\n\tconst anchorThread = threads[ anchorIndex ];\n\n\tif ( ! anchorThread || ! blockRects[ anchorThread.id ] ) {\n\t\treturn { offsets, minHeight: 0 };\n\t}\n\n\tconst anchorRect = blockRects[ anchorThread.id ];\n\tconst anchorTop = anchorRect.top || 0;\n\tconst anchorHeight = heights[ anchorThread.id ] || 0;\n\n\toffsets[ anchorThread.id ] = THREAD_ALIGN_OFFSET;\n\n\t// Process threads after the anchor, offsetting overlapping threads downward.\n\tlet prevAdjustedTop = anchorTop + THREAD_ALIGN_OFFSET;\n\tlet prevHeight = anchorHeight;\n\n\tfor ( let i = anchorIndex + 1; i < threads.length; i++ ) {\n\t\tconst thread = threads[ i ];\n\t\tconst threadRect = blockRects[ thread.id ];\n\t\tif ( ! threadRect ) {\n\t\t\tcontinue;\n\t\t}\n\n\t\tconst threadTop = threadRect.top || 0;\n\t\tconst threadHeight = heights[ thread.id ] || 0;\n\n\t\tlet offset = THREAD_ALIGN_OFFSET;\n\n\t\tconst prevBottom = prevAdjustedTop + prevHeight;\n\t\tif ( threadTop < prevBottom + THREAD_GAP ) {\n\t\t\toffset = prevBottom - threadTop + OVERLAP_MARGIN;\n\t\t}\n\n\t\toffsets[ thread.id ] = offset;\n\n\t\tprevAdjustedTop = threadTop + offset;\n\t\tprevHeight = threadHeight;\n\t}\n\n\t// Process threads before the anchor, offsetting overlapping threads upward.\n\tlet belowAdjustedTop = anchorTop + THREAD_ALIGN_OFFSET;\n\n\tfor ( let i = anchorIndex - 1; i >= 0; i-- ) {\n\t\tconst thread = threads[ i ];\n\t\tconst threadRect = blockRects[ thread.id ];\n\t\tif ( ! threadRect ) {\n\t\t\tcontinue;\n\t\t}\n\n\t\tconst threadTop = threadRect.top || 0;\n\t\tconst threadHeight = heights[ thread.id ] || 0;\n\n\t\tlet offset = THREAD_ALIGN_OFFSET;\n\n\t\tconst threadBottom = threadTop + threadHeight;\n\n\t\tif ( threadBottom > belowAdjustedTop ) {\n\t\t\toffset =\n\t\t\t\tbelowAdjustedTop - threadTop - threadHeight - OVERLAP_MARGIN;\n\t\t}\n\n\t\toffsets[ thread.id ] = offset;\n\n\t\tbelowAdjustedTop = threadTop + offset;\n\t}\n\n\tlet editorMinHeight = 0;\n\tconst lastThread = threads[ threads.length - 1 ];\n\tconst lastBlockRect = blockRects[ lastThread.id ];\n\tif ( lastBlockRect ) {\n\t\tconst lastThreadTop = lastBlockRect.top || 0;\n\t\tconst lastThreadHeight = heights[ lastThread.id ] || 0;\n\t\tconst lastThreadOffset = offsets[ lastThread.id ] || 0;\n\t\teditorMinHeight =\n\t\t\tlastThreadTop +\n\t\t\tlastThreadHeight +\n\t\t\tlastThreadOffset +\n\t\t\tBOARD_BOTTOM_PADDING;\n\t}\n\n\treturn { offsets, minHeight: editorMinHeight };\n}\n\n/**\n * Shift focus to the comment thread associated with a particular comment ID.\n * If an additional selector is provided, the focus will be shifted to the element matching the selector.\n *\n * @typedef {import('@wordpress/element').RefObject} RefObject\n *\n * @param {string}       commentId          The ID of the comment thread to focus.\n * @param {?HTMLElement} container          The container element to search within.\n * @param {string}       additionalSelector The additional selector to focus on.\n */\nexport function focusCommentThread( commentId, container, additionalSelector ) {\n\tif ( ! container ) {\n\t\treturn;\n\t}\n\n\t// A thread without a commentId is a new comment thread.\n\tconst threadSelector =\n\t\tcommentId && commentId !== 'new'\n\t\t\t? `[role=treeitem][id=\"comment-thread-${ commentId }\"]`\n\t\t\t: '[role=treeitem]:not([id])';\n\tconst selector = additionalSelector\n\t\t? `${ threadSelector } ${ additionalSelector }`\n\t\t: threadSelector;\n\n\treturn new Promise( ( resolve ) => {\n\t\tif ( container.querySelector( selector ) ) {\n\t\t\treturn resolve( container.querySelector( selector ) );\n\t\t}\n\n\t\tlet timer = null;\n\t\t// Wait for the element to be added to the DOM.\n\t\tconst observer = new window.MutationObserver( () => {\n\t\t\tif ( container.querySelector( selector ) ) {\n\t\t\t\tclearTimeout( timer );\n\t\t\t\tobserver.disconnect();\n\t\t\t\tresolve( container.querySelector( selector ) );\n\t\t\t}\n\t\t} );\n\n\t\tobserver.observe( container, {\n\t\t\tchildList: true,\n\t\t\tsubtree: true,\n\t\t} );\n\n\t\t// Stop trying after 3 seconds.\n\t\ttimer = setTimeout( () => {\n\t\t\tobserver.disconnect();\n\t\t\tresolve( null );\n\t\t}, 3000 );\n\t} ).then( ( element ) => element?.focus() );\n}\n"],
+  "mappings": "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",
   "names": []
 }

package/build-module/components/collaborators-presence/avatar/component.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/components/collaborators-presence/avatar/component.tsx"],
-  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\nimport { colord, extend } from 'colord';\nimport a11yPlugin from 'colord/plugins/a11y';\n\nextend( [ a11yPlugin ] );\n\n/**\n * WordPress dependencies\n */\nimport { Icon, Tooltip } from '@wordpress/components';\nimport { useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { AvatarProps } from './types';\nimport { useImageLoadingStatus } from './use-image-loading-status';\n\n// Runtime equivalents of @wordpress/base-styles tokens ($gray-900, $white).\nconst GRAY_900 = '#1e1e1e';\nconst WHITE = '#fff';\n\nfunction Avatar( {\n\tclassName,\n\tsrc,\n\tname,\n\tlabel,\n\tvariant,\n\tsize = 'default',\n\tborderColor,\n\tdimmed = false,\n\tstatusIndicator,\n\tstyle,\n\t...props\n}: AvatarProps &\n\tOmit< React.HTMLAttributes< HTMLDivElement >, keyof AvatarProps > ) {\n\tconst {\n\t\tstatus: imageStatus,\n\t\thandleLoad,\n\t\thandleError,\n\t} = useImageLoadingStatus( src );\n\tconst imageLoaded = imageStatus === 'loaded';\n\n\tconst showBadge = variant === 'badge' && !! name;\n\tconst initials = name\n\t\t? name\n\t\t\t\t.split( /\\s+/ )\n\t\t\t\t.slice( 0, 2 )\n\t\t\t\t.map( ( word ) => word[ 0 ] )\n\t\t\t\t.join( '' )\n\t\t\t\t.toUpperCase()\n\t\t: undefined;\n\tconst nameColor = useMemo(\n\t\t() =>\n\t\t\tborderColor &&\n\t\t\tcolord( borderColor ).isReadable( GRAY_900, {\n\t\t\t\tlevel: 'AA',\n\t\t\t\tsize: 'normal',\n\t\t\t} )\n\t\t\t\t? GRAY_900\n\t\t\t\t: WHITE,\n\t\t[ borderColor ]\n\t);\n\n\tconst customProperties = {\n\t\t...style,\n\t\t...( borderColor\n\t\t\t? {\n\t\t\t\t\t'--editor-avatar-outline-color': borderColor,\n\t\t\t\t\t'--editor-avatar-name-color': nameColor,\n\t\t\t  }\n\t\t\t: {} ),\n\t} as React.CSSProperties;\n\n\tconst avatar = (\n\t\t<div\n\t\t\tclassName={ clsx( 'editor-avatar', className, {\n\t\t\t\t'has-avatar-border-color': !! borderColor,\n\t\t\t\t'has-src': imageLoaded,\n\t\t\t\t'is-badge': showBadge,\n\t\t\t\t'is-small': size === 'small',\n\t\t\t\t'is-dimmed': dimmed,\n\t\t\t} ) }\n\t\t\tstyle={ customProperties }\n\t\t\trole={ name ? 'img' : undefined }\n\t\t\taria-label={ name || undefined }\n\t\t\t{ ...props }\n\t\t>\n\t\t\t<span className=\"editor-avatar__image\">\n\t\t\t\t{ src && (\n\t\t\t\t\t<img\n\t\t\t\t\t\tsrc={ src }\n\t\t\t\t\t\talt=\"\"\n\t\t\t\t\t\tcrossOrigin=\"anonymous\"\n\t\t\t\t\t\tclassName=\"editor-avatar__img\"\n\t\t\t\t\t\tonLoad={ handleLoad }\n\t\t\t\t\t\tonError={ handleError }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t\t{ ! imageLoaded && initials }\n\t\t\t</span>\n\t\t\t{ dimmed && !! statusIndicator && (\n\t\t\t\t<span className=\"editor-avatar__status-indicator\">\n\t\t\t\t\t<Icon icon={ statusIndicator } />\n\t\t\t\t</span>\n\t\t\t) }\n\t\t\t{ showBadge && (\n\t\t\t\t<span className=\"editor-avatar__name\">{ label || name }</span>\n\t\t\t) }\n\t\t</div>\n\t);\n\n\tif ( name && ( ! showBadge || label ) ) {\n\t\treturn <Tooltip text={ name }>{ avatar }</Tooltip>;\n\t}\n\n\treturn avatar;\n}\n\nexport default Avatar;\n"],
+  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\nimport { colord, extend } from 'colord';\nimport a11yPlugin from 'colord/plugins/a11y';\n\nextend( [ a11yPlugin ] );\n\n/**\n * WordPress dependencies\n */\nimport { Icon, Tooltip } from '@wordpress/components';\nimport { useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { AvatarProps } from './types';\nimport { useImageLoadingStatus } from './use-image-loading-status';\n\n// Runtime equivalents of @wordpress/base-styles tokens ($gray-900, $white).\nconst GRAY_900 = '#1e1e1e';\nconst WHITE = '#fff';\n\nfunction Avatar( {\n\tclassName,\n\tsrc,\n\tname,\n\tlabel,\n\tvariant,\n\tsize = 'default',\n\tborderColor,\n\tdimmed = false,\n\tstatusIndicator,\n\tstyle,\n\t...props\n}: AvatarProps &\n\tOmit< React.HTMLAttributes< HTMLDivElement >, keyof AvatarProps > ) {\n\tconst {\n\t\tstatus: imageStatus,\n\t\thandleLoad,\n\t\thandleError,\n\t} = useImageLoadingStatus( src );\n\tconst imageLoaded = imageStatus === 'loaded';\n\n\tconst showBadge = variant === 'badge' && !! name;\n\tconst initials = name\n\t\t? name\n\t\t\t\t.split( /\\s+/ )\n\t\t\t\t.slice( 0, 2 )\n\t\t\t\t.map( ( word ) => word[ 0 ] )\n\t\t\t\t.join( '' )\n\t\t\t\t.toUpperCase()\n\t\t: undefined;\n\tconst nameColor = useMemo(\n\t\t() =>\n\t\t\tborderColor &&\n\t\t\tcolord( borderColor ).isReadable( GRAY_900, {\n\t\t\t\tlevel: 'AA',\n\t\t\t\tsize: 'normal',\n\t\t\t} )\n\t\t\t\t? GRAY_900\n\t\t\t\t: WHITE,\n\t\t[ borderColor ]\n\t);\n\n\tconst customProperties = {\n\t\t...style,\n\t\t...( borderColor\n\t\t\t? {\n\t\t\t\t\t'--editor-avatar-outline-color': borderColor,\n\t\t\t\t\t'--editor-avatar-name-color': nameColor,\n\t\t\t  }\n\t\t\t: {} ),\n\t};\n\n\tconst avatar = (\n\t\t<div\n\t\t\tclassName={ clsx( 'editor-avatar', className, {\n\t\t\t\t'has-avatar-border-color': !! borderColor,\n\t\t\t\t'has-src': imageLoaded,\n\t\t\t\t'is-badge': showBadge,\n\t\t\t\t'is-small': size === 'small',\n\t\t\t\t'is-dimmed': dimmed,\n\t\t\t} ) }\n\t\t\tstyle={ customProperties }\n\t\t\trole={ name ? 'img' : undefined }\n\t\t\taria-label={ name || undefined }\n\t\t\t{ ...props }\n\t\t>\n\t\t\t<span className=\"editor-avatar__image\">\n\t\t\t\t{ src && (\n\t\t\t\t\t<img\n\t\t\t\t\t\tsrc={ src }\n\t\t\t\t\t\talt=\"\"\n\t\t\t\t\t\tcrossOrigin=\"anonymous\"\n\t\t\t\t\t\tclassName=\"editor-avatar__img\"\n\t\t\t\t\t\tonLoad={ handleLoad }\n\t\t\t\t\t\tonError={ handleError }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t\t{ ! imageLoaded && initials }\n\t\t\t</span>\n\t\t\t{ dimmed && !! statusIndicator && (\n\t\t\t\t<span className=\"editor-avatar__status-indicator\">\n\t\t\t\t\t<Icon icon={ statusIndicator } />\n\t\t\t\t</span>\n\t\t\t) }\n\t\t\t{ showBadge && (\n\t\t\t\t<span className=\"editor-avatar__name\">{ label || name }</span>\n\t\t\t) }\n\t\t</div>\n\t);\n\n\tif ( name && ( ! showBadge || label ) ) {\n\t\treturn <Tooltip text={ name }>{ avatar }</Tooltip>;\n\t}\n\n\treturn avatar;\n}\n\nexport default Avatar;\n"],
   "mappings": ";AAGA,OAAO,UAAU;AACjB,SAAS,QAAQ,cAAc;AAC/B,OAAO,gBAAgB;AAOvB,SAAS,MAAM,eAAe;AAC9B,SAAS,eAAe;AAMxB,SAAS,6BAA6B;AAwEnC,SAEE,KAFF;AApFH,OAAQ,CAAE,UAAW,CAAE;AAevB,IAAM,WAAW;AACjB,IAAM,QAAQ;AAEd,SAAS,OAAQ;AAAA,EAChB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,OAAO;AAAA,EACP;AAAA,EACA,SAAS;AAAA,EACT;AAAA,EACA;AAAA,EACA,GAAG;AACJ,GACqE;AACpE,QAAM;AAAA,IACL,QAAQ;AAAA,IACR;AAAA,IACA;AAAA,EACD,IAAI,sBAAuB,GAAI;AAC/B,QAAM,cAAc,gBAAgB;AAEpC,QAAM,YAAY,YAAY,WAAW,CAAC,CAAE;AAC5C,QAAM,WAAW,OACd,KACC,MAAO,KAAM,EACb,MAAO,GAAG,CAAE,EACZ,IAAK,CAAE,SAAU,KAAM,CAAE,CAAE,EAC3B,KAAM,EAAG,EACT,YAAY,IACb;AACH,QAAM,YAAY;AAAA,IACjB,MACC,eACA,OAAQ,WAAY,EAAE,WAAY,UAAU;AAAA,MAC3C,OAAO;AAAA,MACP,MAAM;AAAA,IACP,CAAE,IACC,WACA;AAAA,IACJ,CAAE,WAAY;AAAA,EACf;AAEA,QAAM,mBAAmB;AAAA,IACxB,GAAG;AAAA,IACH,GAAK,cACF;AAAA,MACA,iCAAiC;AAAA,MACjC,8BAA8B;AAAA,IAC9B,IACA,CAAC;AAAA,EACL;AAEA,QAAM,SACL;AAAA,IAAC;AAAA;AAAA,MACA,WAAY,KAAM,iBAAiB,WAAW;AAAA,QAC7C,2BAA2B,CAAC,CAAE;AAAA,QAC9B,WAAW;AAAA,QACX,YAAY;AAAA,QACZ,YAAY,SAAS;AAAA,QACrB,aAAa;AAAA,MACd,CAAE;AAAA,MACF,OAAQ;AAAA,MACR,MAAO,OAAO,QAAQ;AAAA,MACtB,cAAa,QAAQ;AAAA,MACnB,GAAG;AAAA,MAEL;AAAA,6BAAC,UAAK,WAAU,wBACb;AAAA,iBACD;AAAA,YAAC;AAAA;AAAA,cACA;AAAA,cACA,KAAI;AAAA,cACJ,aAAY;AAAA,cACZ,WAAU;AAAA,cACV,QAAS;AAAA,cACT,SAAU;AAAA;AAAA,UACX;AAAA,UAEC,CAAE,eAAe;AAAA,WACpB;AAAA,QACE,UAAU,CAAC,CAAE,mBACd,oBAAC,UAAK,WAAU,mCACf,8BAAC,QAAK,MAAO,iBAAkB,GAChC;AAAA,QAEC,aACD,oBAAC,UAAK,WAAU,uBAAwB,mBAAS,MAAM;AAAA;AAAA;AAAA,EAEzD;AAGD,MAAK,SAAU,CAAE,aAAa,QAAU;AACvC,WAAO,oBAAC,WAAQ,MAAO,MAAS,kBAAQ;AAAA,EACzC;AAEA,SAAO;AACR;AAEA,IAAO,oBAAQ;",
   "names": []
 }

package/build-module/components/collaborators-presence/index.mjs

@@ -14,10 +14,10 @@ import { getAvatarBorderColor } from "../collab-sidebar/utils.mjs";
 import { createCursorRegistry } from "../collaborators-overlay/cursor-registry.mjs";
 
 // packages/editor/src/components/collaborators-presence/styles/collaborators-presence.scss
-if (typeof document !== "undefined" && process.env.NODE_ENV !== "test" && !document.head.querySelector("style[data-wp-hash='5ffe927286']")) {
+if (typeof document !== "undefined" && process.env.NODE_ENV !== "test" && !document.head.querySelector("style[data-wp-hash='9907eeab15']")) {
   const style = document.createElement("style");
-  style.setAttribute("data-wp-hash", "5ffe927286");
-  style.appendChild(document.createTextNode(".editor-collaborators-presence{align-items:center;background:#f0f0f0;border-radius:4px;display:flex;flex-shrink:0;height:32px;margin-right:8px}.editor-collaborators-presence:has(.is-pressed),.editor-collaborators-presence:hover{background-color:#e0e0e0}.editor-collaborators-presence__button.editor-collaborators-presence__button.components-button{align-items:center;background:#0000;border-radius:4px;box-sizing:border-box;color:#2f2f2f;cursor:pointer;display:flex;height:100%;padding:4px;position:relative}.editor-collaborators-presence__button.editor-collaborators-presence__button.components-button.is-pressed,.editor-collaborators-presence__button.editor-collaborators-presence__button.components-button.is-pressed:hover,.editor-collaborators-presence__button.editor-collaborators-presence__button.components-button:hover{background:#0000;color:#2f2f2f}.editor-collaborators-presence__button.editor-collaborators-presence__button.components-button:focus:not(:active){box-shadow:inset 0 0 0 var(--wp-admin-border-width-focus,2px) var(--wp-admin-theme-color,#007cba);outline:none}"));
+  style.setAttribute("data-wp-hash", "9907eeab15");
+  style.appendChild(document.createTextNode(".editor-collaborators-presence{align-items:center;background:#f0f0f0;border-radius:4px;display:flex;flex-shrink:0;height:32px;margin-right:8px}.editor-collaborators-presence:has(.is-pressed),.editor-collaborators-presence:hover{background-color:#e0e0e0}.editor-collaborators-presence__button.editor-collaborators-presence__button.components-button{align-items:center;background:#0000;border-radius:4px;box-sizing:border-box;color:#2f2f2f;cursor:var(--wpds-cursor-control,pointer);display:flex;height:100%;padding:4px;position:relative}.editor-collaborators-presence__button.editor-collaborators-presence__button.components-button.is-pressed,.editor-collaborators-presence__button.editor-collaborators-presence__button.components-button.is-pressed:hover,.editor-collaborators-presence__button.editor-collaborators-presence__button.components-button:hover{background:#0000;color:#2f2f2f}.editor-collaborators-presence__button.editor-collaborators-presence__button.components-button:focus:not(:active){box-shadow:inset 0 0 0 var(--wp-admin-border-width-focus,2px) var(--wp-admin-theme-color,#007cba);outline:none}"));
   document.head.appendChild(style);
 }