UNPKG

@wordpress/editor

Version:
140 lines (138 loc) 5.12 kB
"use strict"; var __defProp = Object.defineProperty; var __getOwnPropDesc = Object.getOwnPropertyDescriptor; var __getOwnPropNames = Object.getOwnPropertyNames; var __hasOwnProp = Object.prototype.hasOwnProperty; var __export = (target, all) => { for (var name in all) __defProp(target, name, { get: all[name], enumerable: true }); }; var __copyProps = (to, from, except, desc) => { if (from && typeof from === "object" || typeof from === "function") { for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable }); } return to; }; var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod); // packages/editor/src/components/collaborators-overlay/use-render-cursors.ts var use_render_cursors_exports = {}; __export(use_render_cursors_exports, { useRenderCursors: () => useRenderCursors }); module.exports = __toCommonJS(use_render_cursors_exports); var import_core_data = require("@wordpress/core-data"); var import_data = require("@wordpress/data"); var import_element = require("@wordpress/element"); var import_preferences = require("@wordpress/preferences"); var import_lock_unlock = require("../../lock-unlock.cjs"); var import_get_avatar_url = require("./get-avatar-url.cjs"); var import_utils = require("../collab-sidebar/utils.cjs"); var import_compute_selection = require("./compute-selection.cjs"); var import_use_debounced_recompute = require("./use-debounced-recompute.cjs"); var { useActiveCollaborators, useResolvedSelection } = (0, import_lock_unlock.unlock)(import_core_data.privateApis); function useRenderCursors(overlayElement, blockEditorDocument, postId, postType, delayMs) { const sortedUsers = useActiveCollaborators( postId ?? null, postType ?? null ); const resolveSelection = useResolvedSelection( postId ?? null, postType ?? null ); const showOwnCursor = (0, import_data.useSelect)( (select) => select(import_preferences.store).get("core", "showCollaborationCursor"), [] ); const [cursorPositions, setCursorPositions] = (0, import_element.useState)( [] ); const [recomputeToken, rerenderCursorsAfterDelay] = (0, import_use_debounced_recompute.useDebouncedRecompute)(delayMs); (0, import_element.useEffect)(() => { if (!overlayElement || !blockEditorDocument) { setCursorPositions([]); return; } const overlayRect = overlayElement.getBoundingClientRect(); const overlayContext = { editorDocument: blockEditorDocument, overlayRect }; const results = []; const hasOtherCollaborators = sortedUsers.some( (u) => !u.isMe ); sortedUsers.forEach((user) => { if (user.isMe && (!showOwnCursor || !hasOtherCollaborators)) { return; } const selection = user.editorState?.selection ?? { type: import_core_data.SelectionType.None }; let start = { richTextOffset: null, localClientId: null }; let end; if (selection.type === import_core_data.SelectionType.Cursor) { try { start = resolveSelection(selection); } catch { return; } } else if (selection.type === import_core_data.SelectionType.SelectionInOneBlock || selection.type === import_core_data.SelectionType.SelectionInMultipleBlocks) { try { start = resolveSelection({ type: import_core_data.SelectionType.Cursor, cursorPosition: selection.cursorStartPosition }); end = resolveSelection({ type: import_core_data.SelectionType.Cursor, cursorPosition: selection.cursorEndPosition }); } catch { return; } } const userName = user.collaboratorInfo.name; const clientId = user.clientId; const color = user.isMe ? "var(--wp-admin-theme-color)" : (0, import_utils.getAvatarBorderColor)(user.collaboratorInfo.id); const avatarUrl = (0, import_get_avatar_url.getAvatarUrl)(user.collaboratorInfo.avatar_urls); const selectionVisual = (0, import_compute_selection.computeSelectionVisual)( selection, start, end, overlayContext ); if (selectionVisual.coords) { const cursorData = { userName, clientId, color, avatarUrl, isMe: user.isMe, ...selectionVisual.coords }; if (selectionVisual.selectionRects) { cursorData.selectionRects = selectionVisual.selectionRects; } results.push(cursorData); } }); setCursorPositions(results); }, [ blockEditorDocument, resolveSelection, overlayElement, sortedUsers, showOwnCursor, recomputeToken ]); return { cursors: cursorPositions, rerenderCursorsAfterDelay }; } // Annotate the CommonJS export names for ESM import in node: 0 && (module.exports = { useRenderCursors }); //# sourceMappingURL=use-render-cursors.cjs.map