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

package/CHANGELOG.md

@@ -2,6 +2,8 @@
 
 ## Unreleased
 
+## 14.45.0 (2026-04-29)
+
 ## 14.44.0 (2026-04-15)
 
 ## 14.43.0 (2026-04-01)

package/build/components/collab-sidebar/{comment-menu-item.cjs → add-note-menu-item.cjs}

@@ -17,12 +17,12 @@ var __copyProps = (to, from, except, desc) => {
 };
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 
-// packages/editor/src/components/collab-sidebar/comment-menu-item.js
-var comment_menu_item_exports = {};
-__export(comment_menu_item_exports, {
-  default: () => comment_menu_item_default
+// packages/editor/src/components/collab-sidebar/add-note-menu-item.js
+var add_note_menu_item_exports = {};
+__export(add_note_menu_item_exports, {
+  AddNoteMenuItem: () => AddNoteMenuItem
 });
-module.exports = __toCommonJS(comment_menu_item_exports);
+module.exports = __toCommonJS(add_note_menu_item_exports);
 var import_components = require("@wordpress/components");
 var import_i18n = require("@wordpress/i18n");
 var import_block_editor = require("@wordpress/block-editor");
@@ -31,8 +31,8 @@ var import_blocks = require("@wordpress/blocks");
 var import_keyboard_shortcuts = require("@wordpress/keyboard-shortcuts");
 var import_lock_unlock = require("../../lock-unlock.cjs");
 var import_jsx_runtime = require("react/jsx-runtime");
-var { CommentIconSlotFill } = (0, import_lock_unlock.unlock)(import_block_editor.privateApis);
-var AddCommentMenuItem = ({ clientId, onClick, isDistractionFree }) => {
+var { NoteIconSlotFill } = (0, import_lock_unlock.unlock)(import_block_editor.privateApis);
+function NoteMenuItem({ clientId, onClick, isDistractionFree }) {
   const block = (0, import_data.useSelect)(
     (select) => {
       return select(import_block_editor.store).getBlock(clientId);
@@ -66,10 +66,10 @@ var AddCommentMenuItem = ({ clientId, onClick, isDistractionFree }) => {
       children: (0, import_i18n.__)("Add note")
     }
   );
-};
-var AddCommentMenuItemFill = ({ onClick, isDistractionFree }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CommentIconSlotFill.Fill, { children: ({ clientId, onClose }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-    AddCommentMenuItem,
+}
+function AddNoteMenuItem({ onClick, isDistractionFree }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(NoteIconSlotFill.Fill, { children: ({ clientId, onClose }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    NoteMenuItem,
     {
       clientId,
       isDistractionFree,
@@ -79,6 +79,9 @@ var AddCommentMenuItemFill = ({ onClick, isDistractionFree }) => {
       }
     }
   ) });
-};
-var comment_menu_item_default = AddCommentMenuItemFill;
-//# sourceMappingURL=comment-menu-item.cjs.map
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  AddNoteMenuItem
+});
+//# sourceMappingURL=add-note-menu-item.cjs.map

package/build/components/collab-sidebar/add-note-menu-item.cjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/components/collab-sidebar/add-note-menu-item.js"],
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { MenuItem } from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport {\n\tprivateApis as blockEditorPrivateApis,\n\tstore as blockEditorStore,\n} from '@wordpress/block-editor';\nimport { useSelect } from '@wordpress/data';\nimport { getUnregisteredTypeHandlerName } from '@wordpress/blocks';\nimport { store as keyboardShortcutsStore } from '@wordpress/keyboard-shortcuts';\n\n/**\n * Internal dependencies\n */\nimport { unlock } from '../../lock-unlock';\n\nconst { NoteIconSlotFill } = unlock( blockEditorPrivateApis );\n\nfunction NoteMenuItem( { clientId, onClick, isDistractionFree } ) {\n\tconst block = useSelect(\n\t\t( select ) => {\n\t\t\treturn select( blockEditorStore ).getBlock( clientId );\n\t\t},\n\t\t[ clientId ]\n\t);\n\tconst shortcut = useSelect(\n\t\t( select ) =>\n\t\t\tselect( keyboardShortcutsStore ).getShortcutRepresentation(\n\t\t\t\t'core/editor/new-note'\n\t\t\t),\n\t\t[]\n\t);\n\n\tif (\n\t\t! block?.isValid ||\n\t\tblock?.name === getUnregisteredTypeHandlerName()\n\t) {\n\t\treturn null;\n\t}\n\n\tconst isDisabled = isDistractionFree || block?.name === 'core/freeform';\n\n\tlet infoText;\n\n\tif ( isDistractionFree ) {\n\t\tinfoText = __( 'Notes are disabled in distraction free mode.' );\n\t} else if ( block?.name === 'core/freeform' ) {\n\t\tinfoText = __( 'Convert to blocks to add notes.' );\n\t}\n\n\treturn (\n\t\t<MenuItem\n\t\t\tonClick={ onClick }\n\t\t\taria-haspopup=\"dialog\"\n\t\t\tdisabled={ isDisabled }\n\t\t\tinfo={ infoText }\n\t\t\tshortcut={ shortcut }\n\t\t>\n\t\t\t{ __( 'Add note' ) }\n\t\t</MenuItem>\n\t);\n}\n\nexport function AddNoteMenuItem( { onClick, isDistractionFree } ) {\n\treturn (\n\t\t<NoteIconSlotFill.Fill>\n\t\t\t{ ( { clientId, onClose } ) => (\n\t\t\t\t<NoteMenuItem\n\t\t\t\t\tclientId={ clientId }\n\t\t\t\t\tisDistractionFree={ isDistractionFree }\n\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\tonClick( clientId );\n\t\t\t\t\t\tonClose();\n\t\t\t\t\t} }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</NoteIconSlotFill.Fill>\n\t);\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,wBAAyB;AACzB,kBAAmB;AACnB,0BAGO;AACP,kBAA0B;AAC1B,oBAA+C;AAC/C,gCAAgD;AAKhD,yBAAuB;AAqCrB;AAnCF,IAAM,EAAE,iBAAiB,QAAI,2BAAQ,oBAAAA,WAAuB;AAE5D,SAAS,aAAc,EAAE,UAAU,SAAS,kBAAkB,GAAI;AACjE,QAAM,YAAQ;AAAA,IACb,CAAE,WAAY;AACb,aAAO,OAAQ,oBAAAC,KAAiB,EAAE,SAAU,QAAS;AAAA,IACtD;AAAA,IACA,CAAE,QAAS;AAAA,EACZ;AACA,QAAM,eAAW;AAAA,IAChB,CAAE,WACD,OAAQ,0BAAAC,KAAuB,EAAE;AAAA,MAChC;AAAA,IACD;AAAA,IACD,CAAC;AAAA,EACF;AAEA,MACC,CAAE,OAAO,WACT,OAAO,aAAS,8CAA+B,GAC9C;AACD,WAAO;AAAA,EACR;AAEA,QAAM,aAAa,qBAAqB,OAAO,SAAS;AAExD,MAAI;AAEJ,MAAK,mBAAoB;AACxB,mBAAW,gBAAI,8CAA+C;AAAA,EAC/D,WAAY,OAAO,SAAS,iBAAkB;AAC7C,mBAAW,gBAAI,iCAAkC;AAAA,EAClD;AAEA,SACC;AAAA,IAAC;AAAA;AAAA,MACA;AAAA,MACA,iBAAc;AAAA,MACd,UAAW;AAAA,MACX,MAAO;AAAA,MACP;AAAA,MAEE,8BAAI,UAAW;AAAA;AAAA,EAClB;AAEF;AAEO,SAAS,gBAAiB,EAAE,SAAS,kBAAkB,GAAI;AACjE,SACC,4CAAC,iBAAiB,MAAjB,EACE,WAAE,EAAE,UAAU,QAAQ,MACvB;AAAA,IAAC;AAAA;AAAA,MACA;AAAA,MACA;AAAA,MACA,SAAU,MAAM;AACf,gBAAS,QAAS;AAClB,gBAAQ;AAAA,MACT;AAAA;AAAA,EACD,GAEF;AAEF;",
+  "names": ["blockEditorPrivateApis", "blockEditorStore", "keyboardShortcutsStore"]
+}

package/build/components/collab-sidebar/{add-comment.cjs → add-note.cjs}

@@ -1,9 +1,7 @@
 "use strict";
-var __create = Object.create;
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
 var __export = (target, all) => {
   for (var name in all)
@@ -17,35 +15,26 @@ var __copyProps = (to, from, except, desc) => {
   }
   return to;
 };
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-  mod
-));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 
-// packages/editor/src/components/collab-sidebar/add-comment.js
-var add_comment_exports = {};
-__export(add_comment_exports, {
-  AddComment: () => AddComment
+// packages/editor/src/components/collab-sidebar/add-note.js
+var add_note_exports = {};
+__export(add_note_exports, {
+  AddNote: () => AddNote
 });
-module.exports = __toCommonJS(add_comment_exports);
+module.exports = __toCommonJS(add_note_exports);
 var import_i18n = require("@wordpress/i18n");
 var import_data = require("@wordpress/data");
-var import_components = require("@wordpress/components");
 var import_block_editor = require("@wordpress/block-editor");
-var import_lock_unlock = require("../../lock-unlock.cjs");
-var import_comment_author_info = __toESM(require("./comment-author-info.cjs"));
-var import_comment_form = __toESM(require("./comment-form.cjs"));
+var import_note_card = require("./note-card.cjs");
+var import_note_form = require("./note-form.cjs");
 var import_floating_container = require("./floating-container.cjs");
 var import_utils = require("./utils.cjs");
 var import_store = require("../../store/index.cjs");
+var import_lock_unlock = require("../../lock-unlock.cjs");
 var import_jsx_runtime = require("react/jsx-runtime");
 var { useBlockElement } = (0, import_lock_unlock.unlock)(import_block_editor.privateApis);
-function AddComment({ onSubmit, commentSidebarRef, floating }) {
+function AddNote({ onSubmit, sidebarRef, floating }) {
   const { clientId } = (0, import_data.useSelect)((select) => {
     const { getSelectedBlockClientId } = select(import_block_editor.store);
     return {
@@ -59,7 +48,7 @@ function AddComment({ onSubmit, commentSidebarRef, floating }) {
   const blockElement = useBlockElement(clientId);
   const { toggleBlockSpotlight } = (0, import_lock_unlock.unlock)((0, import_data.useDispatch)(import_block_editor.store));
   const { selectNote } = (0, import_lock_unlock.unlock)((0, import_data.useDispatch)(import_store.store));
-  const unselectThread = () => {
+  const unselectNote = () => {
     selectNote(void 0);
     blockElement?.focus();
     toggleBlockSpotlight(clientId, false);
@@ -67,12 +56,12 @@ function AddComment({ onSubmit, commentSidebarRef, floating }) {
   if (selectedNote !== "new" || !clientId) {
     return null;
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
     import_floating_container.FloatingContainer,
     {
       floating,
       className: "editor-collab-sidebar-panel__thread is-selected",
-      spacing: "3",
+      gap: "md",
       tabIndex: 0,
       "aria-label": (0, import_i18n.__)("New note"),
       role: "treeitem",
@@ -87,27 +76,25 @@ function AddComment({ onSubmit, commentSidebarRef, floating }) {
         toggleBlockSpotlight(clientId, false);
         selectNote(void 0);
       },
-      children: [
-        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.__experimentalHStack, { alignment: "left", spacing: "3", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_comment_author_info.default, {}) }),
-        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-          import_comment_form.default,
-          {
-            onSubmit: async (inputComment) => {
-              const { id } = await onSubmit({ content: inputComment });
-              selectNote(id);
-              (0, import_utils.focusCommentThread)(id, commentSidebarRef.current);
-            },
-            onCancel: unselectThread,
-            submitButtonText: (0, import_i18n.__)("Add note"),
-            labelText: (0, import_i18n.__)("New note")
-          }
-        )
-      ]
+      children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_note_card.NoteCard, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        import_note_form.NoteForm,
+        {
+          onSubmit: async (inputComment) => {
+            const { id } = await onSubmit({
+              content: inputComment
+            });
+            selectNote(id);
+            (0, import_utils.focusNoteThread)(id, sidebarRef.current);
+          },
+          onCancel: unselectNote,
+          labels: { input: (0, import_i18n.__)("New note") }
+        }
+      ) })
     }
   );
 }
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
-  AddComment
+  AddNote
 });
-//# sourceMappingURL=add-comment.cjs.map
+//# sourceMappingURL=add-note.cjs.map

package/build/components/collab-sidebar/add-note.cjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/components/collab-sidebar/add-note.js"],
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport {\n\tstore as blockEditorStore,\n\tprivateApis as blockEditorPrivateApis,\n} from '@wordpress/block-editor';\n\n/**\n * Internal dependencies\n */\nimport { NoteCard } from './note-card';\nimport { NoteForm } from './note-form';\nimport { FloatingContainer } from './floating-container';\nimport { focusNoteThread } from './utils';\nimport { store as editorStore } from '../../store';\nimport { unlock } from '../../lock-unlock';\n\nconst { useBlockElement } = unlock( blockEditorPrivateApis );\n\nexport function AddNote( { onSubmit, sidebarRef, floating } ) {\n\tconst { clientId } = useSelect( ( select ) => {\n\t\tconst { getSelectedBlockClientId } = select( blockEditorStore );\n\t\treturn {\n\t\t\tclientId: getSelectedBlockClientId(),\n\t\t};\n\t}, [] );\n\tconst selectedNote = useSelect(\n\t\t( select ) => unlock( select( editorStore ) ).getSelectedNote(),\n\t\t[]\n\t);\n\tconst blockElement = useBlockElement( clientId );\n\tconst { toggleBlockSpotlight } = unlock( useDispatch( blockEditorStore ) );\n\tconst { selectNote } = unlock( useDispatch( editorStore ) );\n\n\tconst unselectNote = () => {\n\t\tselectNote( undefined );\n\t\tblockElement?.focus();\n\t\ttoggleBlockSpotlight( clientId, false );\n\t};\n\n\tif ( selectedNote !== 'new' || ! clientId ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<FloatingContainer\n\t\t\tfloating={ floating }\n\t\t\tclassName=\"editor-collab-sidebar-panel__thread is-selected\"\n\t\t\tgap=\"md\"\n\t\t\ttabIndex={ 0 }\n\t\t\taria-label={ __( 'New note' ) }\n\t\t\trole=\"treeitem\"\n\t\t\tstyle={\n\t\t\t\tfloating ? { opacity: ! floating.y ? 0 : undefined } : undefined\n\t\t\t}\n\t\t\tonBlur={ ( event ) => {\n\t\t\t\t// Don't deselect notes when the browser window/tab loses focus.\n\t\t\t\tif ( ! document.hasFocus() ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\tif ( event.currentTarget.contains( event.relatedTarget ) ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\ttoggleBlockSpotlight( clientId, false );\n\t\t\t\tselectNote( undefined );\n\t\t\t} }\n\t\t>\n\t\t\t<NoteCard>\n\t\t\t\t<NoteForm\n\t\t\t\t\tonSubmit={ async ( inputComment ) => {\n\t\t\t\t\t\tconst { id } = await onSubmit( {\n\t\t\t\t\t\t\tcontent: inputComment,\n\t\t\t\t\t\t} );\n\t\t\t\t\t\tselectNote( id );\n\t\t\t\t\t\tfocusNoteThread( id, sidebarRef.current );\n\t\t\t\t\t} }\n\t\t\t\t\tonCancel={ unselectNote }\n\t\t\t\t\tlabels={ { input: __( 'New note' ) } }\n\t\t\t\t/>\n\t\t\t</NoteCard>\n\t\t</FloatingContainer>\n\t);\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,kBAAmB;AACnB,kBAAuC;AACvC,0BAGO;AAKP,uBAAyB;AACzB,uBAAyB;AACzB,gCAAkC;AAClC,mBAAgC;AAChC,mBAAqC;AACrC,yBAAuB;AAqDnB;AAnDJ,IAAM,EAAE,gBAAgB,QAAI,2BAAQ,oBAAAA,WAAuB;AAEpD,SAAS,QAAS,EAAE,UAAU,YAAY,SAAS,GAAI;AAC7D,QAAM,EAAE,SAAS,QAAI,uBAAW,CAAE,WAAY;AAC7C,UAAM,EAAE,yBAAyB,IAAI,OAAQ,oBAAAC,KAAiB;AAC9D,WAAO;AAAA,MACN,UAAU,yBAAyB;AAAA,IACpC;AAAA,EACD,GAAG,CAAC,CAAE;AACN,QAAM,mBAAe;AAAA,IACpB,CAAE,eAAY,2BAAQ,OAAQ,aAAAC,KAAY,CAAE,EAAE,gBAAgB;AAAA,IAC9D,CAAC;AAAA,EACF;AACA,QAAM,eAAe,gBAAiB,QAAS;AAC/C,QAAM,EAAE,qBAAqB,QAAI,+BAAQ,yBAAa,oBAAAD,KAAiB,CAAE;AACzE,QAAM,EAAE,WAAW,QAAI,+BAAQ,yBAAa,aAAAC,KAAY,CAAE;AAE1D,QAAM,eAAe,MAAM;AAC1B,eAAY,MAAU;AACtB,kBAAc,MAAM;AACpB,yBAAsB,UAAU,KAAM;AAAA,EACvC;AAEA,MAAK,iBAAiB,SAAS,CAAE,UAAW;AAC3C,WAAO;AAAA,EACR;AAEA,SACC;AAAA,IAAC;AAAA;AAAA,MACA;AAAA,MACA,WAAU;AAAA,MACV,KAAI;AAAA,MACJ,UAAW;AAAA,MACX,kBAAa,gBAAI,UAAW;AAAA,MAC5B,MAAK;AAAA,MACL,OACC,WAAW,EAAE,SAAS,CAAE,SAAS,IAAI,IAAI,OAAU,IAAI;AAAA,MAExD,QAAS,CAAE,UAAW;AAErB,YAAK,CAAE,SAAS,SAAS,GAAI;AAC5B;AAAA,QACD;AACA,YAAK,MAAM,cAAc,SAAU,MAAM,aAAc,GAAI;AAC1D;AAAA,QACD;AACA,6BAAsB,UAAU,KAAM;AACtC,mBAAY,MAAU;AAAA,MACvB;AAAA,MAEA,sDAAC,6BACA;AAAA,QAAC;AAAA;AAAA,UACA,UAAW,OAAQ,iBAAkB;AACpC,kBAAM,EAAE,GAAG,IAAI,MAAM,SAAU;AAAA,cAC9B,SAAS;AAAA,YACV,CAAE;AACF,uBAAY,EAAG;AACf,8CAAiB,IAAI,WAAW,OAAQ;AAAA,UACzC;AAAA,UACA,UAAW;AAAA,UACX,QAAS,EAAE,WAAO,gBAAI,UAAW,EAAE;AAAA;AAAA,MACpC,GACD;AAAA;AAAA,EACD;AAEF;",
+  "names": ["blockEditorPrivateApis", "blockEditorStore", "editorStore"]
+}

package/build/components/collab-sidebar/board-store.cjs

@@ -93,6 +93,9 @@ function createBoardStore() {
           ([id, el]) => el ? [[id, el.getBoundingClientRect()]] : []
         )
       );
+    },
+    getFirstBlockElement() {
+      return blockRefs.values().next().value ?? null;
     }
   };
 }

package/build/components/collab-sidebar/board-store.cjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/collab-sidebar/board-store.js"],
-  "sourcesContent": ["export function createBoardStore() {\n\tconst listeners = new Set();\n\tconst blockRefs = new Map();\n\tconst floatingRefs = new Map();\n\tconst idByElement = new WeakMap();\n\tconst heights = {};\n\tlet snapshot = {};\n\n\tfunction emit() {\n\t\tsnapshot = { ...heights };\n\t\tfor ( const listener of listeners ) {\n\t\t\tlistener();\n\t\t}\n\t}\n\n\tconst observer = new window.ResizeObserver( ( entries ) => {\n\t\tlet changed = false;\n\t\tfor ( const entry of entries ) {\n\t\t\tconst id = idByElement.get( entry.target );\n\t\t\tconst newHeight = entry.borderBoxSize[ 0 ].blockSize;\n\t\t\tif ( heights[ id ] !== newHeight ) {\n\t\t\t\theights[ id ] = newHeight;\n\t\t\t\tchanged = true;\n\t\t\t}\n\t\t}\n\t\tif ( changed ) {\n\t\t\temit();\n\t\t}\n\t} );\n\n\treturn {\n\t\tsubscribe( listener ) {\n\t\t\tlisteners.add( listener );\n\t\t\treturn () => {\n\t\t\t\tlisteners.delete( listener );\n\t\t\t\tif ( listeners.size === 0 ) {\n\t\t\t\t\tobserver.disconnect();\n\t\t\t\t}\n\t\t\t};\n\t\t},\n\n\t\tgetSnapshot() {\n\t\t\treturn snapshot;\n\t\t},\n\n\t\tregisterThread( id, blockEl, floatingEl ) {\n\t\t\tblockRefs.set( id, blockEl );\n\n\t\t\tconst prev = floatingRefs.get( id );\n\t\t\tif ( prev && prev !== floatingEl ) {\n\t\t\t\tobserver.unobserve( prev );\n\t\t\t\tidByElement.delete( prev );\n\t\t\t}\n\t\t\tif ( floatingEl ) {\n\t\t\t\tfloatingRefs.set( id, floatingEl );\n\t\t\t\tidByElement.set( floatingEl, id );\n\t\t\t\tobserver.observe( floatingEl );\n\t\t\t}\n\n\t\t\temit();\n\t\t},\n\n\t\tunregisterThread( id ) {\n\t\t\tblockRefs.delete( id );\n\t\t\tconst prev = floatingRefs.get( id );\n\t\t\tif ( prev ) {\n\t\t\t\tobserver.unobserve( prev );\n\t\t\t\tidByElement.delete( prev );\n\t\t\t\tfloatingRefs.delete( id );\n\t\t\t}\n\t\t\tdelete heights[ id ];\n\t\t},\n\n\t\tgetBlockRects() {\n\t\t\t// Batch all rect reads before any writes to avoid layout thrashing.\n\t\t\treturn Object.fromEntries(\n\t\t\t\tArray.from( blockRefs ).flatMap( ( [ id, el ] ) =>\n\t\t\t\t\tel ? [ [ id, el.getBoundingClientRect() ] ] : []\n\t\t\t\t)\n\t\t\t);\n\t\t},\n\t};\n}\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAO,SAAS,mBAAmB;AAClC,QAAM,YAAY,oBAAI,IAAI;AAC1B,QAAM,YAAY,oBAAI,IAAI;AAC1B,QAAM,eAAe,oBAAI,IAAI;AAC7B,QAAM,cAAc,oBAAI,QAAQ;AAChC,QAAM,UAAU,CAAC;AACjB,MAAI,WAAW,CAAC;AAEhB,WAAS,OAAO;AACf,eAAW,EAAE,GAAG,QAAQ;AACxB,eAAY,YAAY,WAAY;AACnC,eAAS;AAAA,IACV;AAAA,EACD;AAEA,QAAM,WAAW,IAAI,OAAO,eAAgB,CAAE,YAAa;AAC1D,QAAI,UAAU;AACd,eAAY,SAAS,SAAU;AAC9B,YAAM,KAAK,YAAY,IAAK,MAAM,MAAO;AACzC,YAAM,YAAY,MAAM,cAAe,CAAE,EAAE;AAC3C,UAAK,QAAS,EAAG,MAAM,WAAY;AAClC,gBAAS,EAAG,IAAI;AAChB,kBAAU;AAAA,MACX;AAAA,IACD;AACA,QAAK,SAAU;AACd,WAAK;AAAA,IACN;AAAA,EACD,CAAE;AAEF,SAAO;AAAA,IACN,UAAW,UAAW;AACrB,gBAAU,IAAK,QAAS;AACxB,aAAO,MAAM;AACZ,kBAAU,OAAQ,QAAS;AAC3B,YAAK,UAAU,SAAS,GAAI;AAC3B,mBAAS,WAAW;AAAA,QACrB;AAAA,MACD;AAAA,IACD;AAAA,IAEA,cAAc;AACb,aAAO;AAAA,IACR;AAAA,IAEA,eAAgB,IAAI,SAAS,YAAa;AACzC,gBAAU,IAAK,IAAI,OAAQ;AAE3B,YAAM,OAAO,aAAa,IAAK,EAAG;AAClC,UAAK,QAAQ,SAAS,YAAa;AAClC,iBAAS,UAAW,IAAK;AACzB,oBAAY,OAAQ,IAAK;AAAA,MAC1B;AACA,UAAK,YAAa;AACjB,qBAAa,IAAK,IAAI,UAAW;AACjC,oBAAY,IAAK,YAAY,EAAG;AAChC,iBAAS,QAAS,UAAW;AAAA,MAC9B;AAEA,WAAK;AAAA,IACN;AAAA,IAEA,iBAAkB,IAAK;AACtB,gBAAU,OAAQ,EAAG;AACrB,YAAM,OAAO,aAAa,IAAK,EAAG;AAClC,UAAK,MAAO;AACX,iBAAS,UAAW,IAAK;AACzB,oBAAY,OAAQ,IAAK;AACzB,qBAAa,OAAQ,EAAG;AAAA,MACzB;AACA,aAAO,QAAS,EAAG;AAAA,IACpB;AAAA,IAEA,gBAAgB;AAEf,aAAO,OAAO;AAAA,QACb,MAAM,KAAM,SAAU,EAAE;AAAA,UAAS,CAAE,CAAE,IAAI,EAAG,MAC3C,KAAK,CAAE,CAAE,IAAI,GAAG,sBAAsB,CAAE,CAAE,IAAI,CAAC;AAAA,QAChD;AAAA,MACD;AAAA,IACD;AAAA,EACD;AACD;",
+  "sourcesContent": ["export function createBoardStore() {\n\tconst listeners = new Set();\n\tconst blockRefs = new Map();\n\tconst floatingRefs = new Map();\n\tconst idByElement = new WeakMap();\n\tconst heights = {};\n\tlet snapshot = {};\n\n\tfunction emit() {\n\t\tsnapshot = { ...heights };\n\t\tfor ( const listener of listeners ) {\n\t\t\tlistener();\n\t\t}\n\t}\n\n\tconst observer = new window.ResizeObserver( ( entries ) => {\n\t\tlet changed = false;\n\t\tfor ( const entry of entries ) {\n\t\t\tconst id = idByElement.get( entry.target );\n\t\t\tconst newHeight = entry.borderBoxSize[ 0 ].blockSize;\n\t\t\tif ( heights[ id ] !== newHeight ) {\n\t\t\t\theights[ id ] = newHeight;\n\t\t\t\tchanged = true;\n\t\t\t}\n\t\t}\n\t\tif ( changed ) {\n\t\t\temit();\n\t\t}\n\t} );\n\n\treturn {\n\t\tsubscribe( listener ) {\n\t\t\tlisteners.add( listener );\n\t\t\treturn () => {\n\t\t\t\tlisteners.delete( listener );\n\t\t\t\tif ( listeners.size === 0 ) {\n\t\t\t\t\tobserver.disconnect();\n\t\t\t\t}\n\t\t\t};\n\t\t},\n\n\t\tgetSnapshot() {\n\t\t\treturn snapshot;\n\t\t},\n\n\t\tregisterThread( id, blockEl, floatingEl ) {\n\t\t\tblockRefs.set( id, blockEl );\n\t\t\tconst prev = floatingRefs.get( id );\n\t\t\tif ( prev && prev !== floatingEl ) {\n\t\t\t\tobserver.unobserve( prev );\n\t\t\t\tidByElement.delete( prev );\n\t\t\t}\n\t\t\tif ( floatingEl ) {\n\t\t\t\tfloatingRefs.set( id, floatingEl );\n\t\t\t\tidByElement.set( floatingEl, id );\n\t\t\t\tobserver.observe( floatingEl );\n\t\t\t}\n\t\t\temit();\n\t\t},\n\n\t\tunregisterThread( id ) {\n\t\t\tblockRefs.delete( id );\n\t\t\tconst prev = floatingRefs.get( id );\n\t\t\tif ( prev ) {\n\t\t\t\tobserver.unobserve( prev );\n\t\t\t\tidByElement.delete( prev );\n\t\t\t\tfloatingRefs.delete( id );\n\t\t\t}\n\t\t\tdelete heights[ id ];\n\t\t},\n\n\t\tgetBlockRects() {\n\t\t\t// Batch all rect reads before any writes to avoid layout thrashing.\n\t\t\treturn Object.fromEntries(\n\t\t\t\tArray.from( blockRefs ).flatMap( ( [ id, el ] ) =>\n\t\t\t\t\tel ? [ [ id, el.getBoundingClientRect() ] ] : []\n\t\t\t\t)\n\t\t\t);\n\t\t},\n\n\t\tgetFirstBlockElement() {\n\t\t\treturn blockRefs.values().next().value ?? null;\n\t\t},\n\t};\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAO,SAAS,mBAAmB;AAClC,QAAM,YAAY,oBAAI,IAAI;AAC1B,QAAM,YAAY,oBAAI,IAAI;AAC1B,QAAM,eAAe,oBAAI,IAAI;AAC7B,QAAM,cAAc,oBAAI,QAAQ;AAChC,QAAM,UAAU,CAAC;AACjB,MAAI,WAAW,CAAC;AAEhB,WAAS,OAAO;AACf,eAAW,EAAE,GAAG,QAAQ;AACxB,eAAY,YAAY,WAAY;AACnC,eAAS;AAAA,IACV;AAAA,EACD;AAEA,QAAM,WAAW,IAAI,OAAO,eAAgB,CAAE,YAAa;AAC1D,QAAI,UAAU;AACd,eAAY,SAAS,SAAU;AAC9B,YAAM,KAAK,YAAY,IAAK,MAAM,MAAO;AACzC,YAAM,YAAY,MAAM,cAAe,CAAE,EAAE;AAC3C,UAAK,QAAS,EAAG,MAAM,WAAY;AAClC,gBAAS,EAAG,IAAI;AAChB,kBAAU;AAAA,MACX;AAAA,IACD;AACA,QAAK,SAAU;AACd,WAAK;AAAA,IACN;AAAA,EACD,CAAE;AAEF,SAAO;AAAA,IACN,UAAW,UAAW;AACrB,gBAAU,IAAK,QAAS;AACxB,aAAO,MAAM;AACZ,kBAAU,OAAQ,QAAS;AAC3B,YAAK,UAAU,SAAS,GAAI;AAC3B,mBAAS,WAAW;AAAA,QACrB;AAAA,MACD;AAAA,IACD;AAAA,IAEA,cAAc;AACb,aAAO;AAAA,IACR;AAAA,IAEA,eAAgB,IAAI,SAAS,YAAa;AACzC,gBAAU,IAAK,IAAI,OAAQ;AAC3B,YAAM,OAAO,aAAa,IAAK,EAAG;AAClC,UAAK,QAAQ,SAAS,YAAa;AAClC,iBAAS,UAAW,IAAK;AACzB,oBAAY,OAAQ,IAAK;AAAA,MAC1B;AACA,UAAK,YAAa;AACjB,qBAAa,IAAK,IAAI,UAAW;AACjC,oBAAY,IAAK,YAAY,EAAG;AAChC,iBAAS,QAAS,UAAW;AAAA,MAC9B;AACA,WAAK;AAAA,IACN;AAAA,IAEA,iBAAkB,IAAK;AACtB,gBAAU,OAAQ,EAAG;AACrB,YAAM,OAAO,aAAa,IAAK,EAAG;AAClC,UAAK,MAAO;AACX,iBAAS,UAAW,IAAK;AACzB,oBAAY,OAAQ,IAAK;AACzB,qBAAa,OAAQ,EAAG;AAAA,MACzB;AACA,aAAO,QAAS,EAAG;AAAA,IACpB;AAAA,IAEA,gBAAgB;AAEf,aAAO,OAAO;AAAA,QACb,MAAM,KAAM,SAAU,EAAE;AAAA,UAAS,CAAE,CAAE,IAAI,EAAG,MAC3C,KAAK,CAAE,CAAE,IAAI,GAAG,sBAAsB,CAAE,CAAE,IAAI,CAAC;AAAA,QAChD;AAAA,MACD;AAAA,IACD;AAAA,IAEA,uBAAuB;AACtB,aAAO,UAAU,OAAO,EAAE,KAAK,EAAE,SAAS;AAAA,IAC3C;AAAA,EACD;AACD;",
   "names": []
 }

package/build/components/collab-sidebar/floating-container.cjs

@@ -34,7 +34,7 @@ __export(floating_container_exports, {
 });
 module.exports = __toCommonJS(floating_container_exports);
 var import_clsx = __toESM(require("clsx"));
-var import_components = require("@wordpress/components");
+var import_ui = require("@wordpress/ui");
 var import_jsx_runtime = require("react/jsx-runtime");
 function FloatingContainer({
   floating,
@@ -45,10 +45,11 @@ function FloatingContainer({
 }) {
   const isFloating = !!floating;
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-    import_components.__experimentalVStack,
+    import_ui.Stack,
     {
+      direction: "column",
       className: (0, import_clsx.default)(className, { "is-floating": isFloating }),
-      ref: isFloating ? floating.refs.setFloating : void 0,
+      ref: isFloating ? floating.ref : void 0,
       style: isFloating ? { top: floating.y, ...style } : style,
       ...props,
       children

package/build/components/collab-sidebar/floating-container.cjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/collab-sidebar/floating-container.js"],
-  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { __experimentalVStack as VStack } from '@wordpress/components';\n\nexport function FloatingContainer( {\n\tfloating,\n\tclassName,\n\tstyle,\n\tchildren,\n\t...props\n} ) {\n\tconst isFloating = !! floating;\n\treturn (\n\t\t<VStack\n\t\t\tclassName={ clsx( className, { 'is-floating': isFloating } ) }\n\t\t\tref={ isFloating ? floating.refs.setFloating : undefined }\n\t\t\tstyle={ isFloating ? { top: floating.y, ...style } : style }\n\t\t\t{ ...props }\n\t\t>\n\t\t\t{ children }\n\t\t</VStack>\n\t);\n}\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,kBAAiB;AAKjB,wBAA+C;AAW7C;AATK,SAAS,kBAAmB;AAAA,EAClC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACJ,GAAI;AACH,QAAM,aAAa,CAAC,CAAE;AACtB,SACC;AAAA,IAAC,kBAAAA;AAAA,IAAA;AAAA,MACA,eAAY,YAAAC,SAAM,WAAW,EAAE,eAAe,WAAW,CAAE;AAAA,MAC3D,KAAM,aAAa,SAAS,KAAK,cAAc;AAAA,MAC/C,OAAQ,aAAa,EAAE,KAAK,SAAS,GAAG,GAAG,MAAM,IAAI;AAAA,MACnD,GAAG;AAAA,MAEH;AAAA;AAAA,EACH;AAEF;",
-  "names": ["VStack", "clsx"]
+  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { Stack } from '@wordpress/ui';\n\nexport function FloatingContainer( {\n\tfloating,\n\tclassName,\n\tstyle,\n\tchildren,\n\t...props\n} ) {\n\tconst isFloating = !! floating;\n\treturn (\n\t\t<Stack\n\t\t\tdirection=\"column\"\n\t\t\tclassName={ clsx( className, { 'is-floating': isFloating } ) }\n\t\t\tref={ isFloating ? floating.ref : undefined }\n\t\t\tstyle={ isFloating ? { top: floating.y, ...style } : style }\n\t\t\t{ ...props }\n\t\t>\n\t\t\t{ children }\n\t\t</Stack>\n\t);\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,kBAAiB;AAKjB,gBAAsB;AAWpB;AATK,SAAS,kBAAmB;AAAA,EAClC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACJ,GAAI;AACH,QAAM,aAAa,CAAC,CAAE;AACtB,SACC;AAAA,IAAC;AAAA;AAAA,MACA,WAAU;AAAA,MACV,eAAY,YAAAA,SAAM,WAAW,EAAE,eAAe,WAAW,CAAE;AAAA,MAC3D,KAAM,aAAa,SAAS,MAAM;AAAA,MAClC,OAAQ,aAAa,EAAE,KAAK,SAAS,GAAG,GAAG,MAAM,IAAI;AAAA,MACnD,GAAG;AAAA,MAEH;AAAA;AAAA,EACH;AAEF;",
+  "names": ["clsx"]
 }

package/build/components/collab-sidebar/hooks.cjs

@@ -20,20 +20,19 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // packages/editor/src/components/collab-sidebar/hooks.js
 var hooks_exports = {};
 __export(hooks_exports, {
-  useBlockComments: () => useBlockComments,
-  useBlockCommentsActions: () => useBlockCommentsActions,
   useEnableFloatingSidebar: () => useEnableFloatingSidebar,
   useFloatingBoard: () => useFloatingBoard,
-  useFloatingThread: () => useFloatingThread
+  useNoteActions: () => useNoteActions,
+  useNoteThreads: () => useNoteThreads
 });
 module.exports = __toCommonJS(hooks_exports);
-var import_react_dom = require("@floating-ui/react-dom");
 var import_i18n = require("@wordpress/i18n");
 var import_element = require("@wordpress/element");
 var import_core_data = require("@wordpress/core-data");
 var import_data = require("@wordpress/data");
 var import_block_editor = require("@wordpress/block-editor");
 var import_notices = require("@wordpress/notices");
+var import_dom = require("@wordpress/dom");
 var import_html_entities = require("@wordpress/html-entities");
 var import_interface = require("@wordpress/interface");
 var import_store = require("../../store/index.cjs");
@@ -41,8 +40,8 @@ var import_constants = require("./constants.cjs");
 var import_lock_unlock = require("../../lock-unlock.cjs");
 var import_board_store = require("./board-store.cjs");
 var import_utils = require("./utils.cjs");
-var { useBlockElement, cleanEmptyObject } = (0, import_lock_unlock.unlock)(import_block_editor.privateApis);
-function useBlockComments(postId) {
+var { cleanEmptyObject } = (0, import_lock_unlock.unlock)(import_block_editor.privateApis);
+function useNoteThreads(postId) {
   const queryArgs = {
     post: postId,
     type: "note",
@@ -62,78 +61,68 @@ function useBlockComments(postId) {
       clientIds: getClientIdsWithDescendants()
     };
   }, []);
-  const { resultComments, unresolvedSortedThreads } = (0, import_element.useMemo)(() => {
+  const { notes, unresolvedNotes } = (0, import_element.useMemo)(() => {
     if (!threads || threads.length === 0) {
-      return { resultComments: [], unresolvedSortedThreads: [] };
+      return { notes: [], unresolvedNotes: [] };
     }
-    const blocksWithComments = clientIds.reduce((results, clientId) => {
-      const commentId = getBlockAttributes(clientId)?.metadata?.noteId;
-      if (commentId) {
-        results[clientId] = commentId;
+    const blocksWithNotes = {};
+    const clientIdByNoteId = /* @__PURE__ */ new Map();
+    for (const clientId of clientIds) {
+      const noteId = getBlockAttributes(clientId)?.metadata?.noteId;
+      if (noteId) {
+        const key = String(noteId);
+        blocksWithNotes[clientId] = key;
+        clientIdByNoteId.set(key, clientId);
       }
-      return results;
-    }, {});
-    const compare = {};
-    const result = [];
-    const commentIdToBlockClientId = Object.keys(
-      blocksWithComments
-    ).reduce((mapping, clientId) => {
-      mapping[blocksWithComments[clientId]] = clientId;
-      return mapping;
-    }, {});
-    threads.forEach((item) => {
-      const itemBlock = commentIdToBlockClientId[item.id];
-      compare[item.id] = {
+    }
+    const threadsById = /* @__PURE__ */ new Map();
+    const rootThreads = [];
+    for (const item of threads) {
+      const thread = {
         ...item,
         reply: [],
-        blockClientId: item.parent === 0 ? itemBlock : null
+        blockClientId: item.parent === 0 ? clientIdByNoteId.get(String(item.id)) ?? null : null
       };
-    });
-    threads.forEach((item) => {
+      threadsById.set(item.id, thread);
       if (item.parent === 0) {
-        result.push(compare[item.id]);
-      } else if (compare[item.parent]) {
-        compare[item.parent].reply.push(compare[item.id]);
+        rootThreads.push(thread);
       }
-    });
-    if (0 === result?.length) {
-      return { resultComments: [], unresolvedSortedThreads: [] };
     }
-    const updatedResult = result.map((item) => ({
-      ...item,
-      reply: [...item.reply].reverse()
-    }));
-    const threadIdMap = new Map(
-      updatedResult.map((thread) => [String(thread.id), thread])
-    );
-    const mappedIds = new Set(
-      Object.values(blocksWithComments).map((id) => String(id))
-    );
-    const unresolvedSortedComments = Object.values(blocksWithComments).map((commentId) => threadIdMap.get(String(commentId))).filter(
-      (thread) => thread !== void 0 && thread.status === "hold"
-    );
-    const resolvedSortedComments = Object.values(blocksWithComments).map((commentId) => threadIdMap.get(String(commentId))).filter(
-      (thread) => thread !== void 0 && thread.status === "approved"
-    );
-    const orphanedComments = updatedResult.filter(
-      (thread) => !mappedIds.has(String(thread.id))
+    for (const item of threads) {
+      if (item.parent !== 0) {
+        threadsById.get(item.parent)?.reply.unshift(threadsById.get(item.id));
+      }
+    }
+    if (rootThreads.length === 0) {
+      return { notes: [], unresolvedNotes: [] };
+    }
+    const unresolved = [];
+    const resolved = [];
+    for (const noteId of Object.values(blocksWithNotes)) {
+      const thread = threadsById.get(Number(noteId)) ?? threadsById.get(noteId);
+      if (!thread) {
+        continue;
+      }
+      if (thread.status === "hold") {
+        unresolved.push(thread);
+      } else if (thread.status === "approved") {
+        resolved.push(thread);
+      }
+    }
+    const orphans = rootThreads.filter(
+      (thread) => !thread.blockClientId
     );
-    const allSortedComments = [
-      ...unresolvedSortedComments,
-      ...resolvedSortedComments,
-      ...orphanedComments
-    ];
     return {
-      resultComments: allSortedComments,
-      unresolvedSortedThreads: unresolvedSortedComments
+      notes: [...unresolved, ...resolved, ...orphans],
+      unresolvedNotes: unresolved
     };
   }, [clientIds, threads, getBlockAttributes]);
   return {
-    resultComments,
-    unresolvedSortedThreads
+    notes,
+    unresolvedNotes
   };
 }
-function useBlockCommentsActions() {
+function useNoteActions() {
   const { createNotice } = (0, import_data.useDispatch)(import_notices.store);
   const { saveEntityRecord, deleteEntityRecord } = (0, import_data.useDispatch)(import_core_data.store);
   const { getCurrentPostId } = (0, import_data.useSelect)(import_store.store);
@@ -203,7 +192,7 @@ function useBlockCommentsActions() {
             throwOnError: true
           }
         );
-        const newCommentData = {
+        const newNoteData = {
           post: getCurrentPostId(),
           content: content || "",
           // Empty content for resolve, content for reopen.
@@ -214,7 +203,7 @@ function useBlockCommentsActions() {
             _wp_note_status: status === "approved" ? "resolved" : "reopen"
           }
         };
-        await saveEntityRecord("root", "comment", newCommentData, {
+        await saveEntityRecord("root", "comment", newNoteData, {
           throwOnError: true
         });
       } else {
@@ -239,18 +228,12 @@ function useBlockCommentsActions() {
       onError(error);
     }
   };
-  const onDelete = async (comment) => {
+  const onDelete = async (note) => {
     try {
-      await deleteEntityRecord(
-        "root",
-        "comment",
-        comment.id,
-        void 0,
-        {
-          throwOnError: true
-        }
-      );
-      if (!comment.parent) {
+      await deleteEntityRecord("root", "comment", note.id, void 0, {
+        throwOnError: true
+      });
+      if (!note.parent) {
         const clientId = getSelectedBlockClientId();
         const metadata = getBlockAttributes(clientId)?.metadata;
         updateBlockAttributes(clientId, {
@@ -291,85 +274,59 @@ function useEnableFloatingSidebar(enabled = false) {
     };
   }, [enabled, registry]);
 }
-function useFloatingBoard({ threads, selectedNoteId, isFloating }) {
-  const [boardOffsets, setBoardOffsets] = (0, import_element.useState)({});
+function useFloatingBoard({
+  threads,
+  selectedNoteId,
+  isFloating,
+  sidebarRef
+}) {
+  const [notePositions, setNotePositions] = (0, import_element.useState)({});
   const [store] = (0, import_element.useState)(import_board_store.createBoardStore);
-  const { setCanvasMinHeight } = (0, import_lock_unlock.unlock)((0, import_data.useDispatch)(import_store.store));
   const heights = (0, import_element.useSyncExternalStore)(store.subscribe, store.getSnapshot);
   (0, import_element.useEffect)(() => {
-    if (!isFloating) {
+    if (!isFloating || !sidebarRef?.current) {
       return;
     }
+    const panel = sidebarRef.current;
+    const blockEl = store.getFirstBlockElement();
+    const rootEl = blockEl?.closest(".is-root-container") ?? blockEl;
+    const canvas = rootEl ? (0, import_dom.getScrollContainer)(rootEl) : null;
+    const applyScroll = () => {
+      panel.style.setProperty(
+        "--canvas-scroll",
+        `${-(canvas?.scrollTop ?? 0)}px`
+      );
+    };
     const rafId = window.requestAnimationFrame(() => {
-      const { offsets, minHeight } = (0, import_utils.calculateAllOffsets)({
+      const result = (0, import_utils.calculateNotePositions)({
         threads,
         selectedNoteId,
         blockRects: store.getBlockRects(),
-        heights
+        heights,
+        scrollTop: canvas?.scrollTop ?? 0
       });
-      setBoardOffsets(offsets);
-      setCanvasMinHeight(minHeight);
+      setNotePositions(result.positions);
+      applyScroll();
     });
-    return () => window.cancelAnimationFrame(rafId);
-  }, [
-    heights,
-    isFloating,
-    selectedNoteId,
-    setCanvasMinHeight,
-    store,
-    threads
-  ]);
+    const view = canvas?.ownerDocument?.defaultView;
+    const listenerOptions = { passive: true, capture: true };
+    view?.addEventListener("scroll", applyScroll, listenerOptions);
+    return () => {
+      window.cancelAnimationFrame(rafId);
+      view?.removeEventListener("scroll", applyScroll, listenerOptions);
+    };
+  }, [sidebarRef, heights, isFloating, selectedNoteId, store, threads]);
   return {
-    boardOffsets,
+    notePositions,
     registerThread: store.registerThread,
     unregisterThread: store.unregisterThread
   };
 }
-function useFloatingThread({
-  thread,
-  calculatedOffset,
-  registerThread,
-  unregisterThread
-}) {
-  const blockElement = useBlockElement(thread.blockClientId);
-  const { y, refs } = (0, import_react_dom.useFloating)({
-    placement: "right-start",
-    middleware: [
-      (0, import_react_dom.offset)({
-        crossAxis: calculatedOffset || -16
-      })
-    ],
-    whileElementsMounted: import_react_dom.autoUpdate
-  });
-  (0, import_element.useEffect)(() => {
-    if (blockElement) {
-      refs.setReference(blockElement);
-    }
-  }, [blockElement, refs]);
-  (0, import_element.useEffect)(() => {
-    const floatingEl = refs.floating?.current;
-    if (floatingEl && registerThread) {
-      registerThread(thread.id, blockElement, floatingEl);
-    }
-    return () => unregisterThread?.(thread.id);
-  }, [
-    blockElement,
-    thread.id,
-    refs.floating,
-    registerThread,
-    unregisterThread
-  ]);
-  return {
-    y,
-    refs
-  };
-}
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
-  useBlockComments,
-  useBlockCommentsActions,
   useEnableFloatingSidebar,
   useFloatingBoard,
-  useFloatingThread
+  useNoteActions,
+  useNoteThreads
 });
 //# sourceMappingURL=hooks.cjs.map