@atlaskit/editor-common 111.11.7 → 111.11.9

package/dist/es2019/block-menu/scroll-to-block-utils.js

@@ -0,0 +1,306 @@
+/**
+ * Shared utilities for scrolling to block elements with expand node support.
+ * Used by both Confluence's useScrollOnUrlChange and platform renderer's useScrollToBlock.
+ */
+
+/**
+ * Timing constants for expand animation and DOM update delays.
+ * These values are tuned for the expand component's behavior and React's update cycle.
+ */
+export const SCROLL_TO_BLOCK_TIMING = {
+  /** Minimal delay for DOM/React updates after expanding (no animation in expand component). */
+  DOM_UPDATE_DELAY: 50,
+  /** Delay when expand operation fails and needs retry. */
+  RETRY_DELAY: 100,
+  /** Maximum number of retry attempts before giving up and scrolling anyway. */
+  MAX_ATTEMPTS: 5,
+  /** Maximum depth of nested expands to search (prevents infinite loops). */
+  MAX_EXPAND_DEPTH: 2
+};
+/**
+ * Find a node by its localId in an ADF document and determine if it has expand or nestedExpand parents.
+ * This is used to identify nodes that may be hidden inside collapsed expands.
+ *
+ * @param adfDoc - The ADF document to search
+ * @param targetLocalId - The localId to search for
+ * @returns NodeWithExpandParents if found, undefined otherwise
+ */
+export function findNodeWithExpandParents(adfDoc, targetLocalId) {
+  let result;
+
+  /**
+   * Recursive helper to traverse the ADF document and track expand ancestors.
+   * We use recursion to properly maintain the expand ancestor stack.
+   */
+  const traverse = (node, expandAncestors) => {
+    var _node$attrs, _node$attrs2;
+    // If we already found the target, stop traversing
+    if (result) {
+      return false;
+    }
+
+    // Check if this is the target node by localId
+    if ((node === null || node === void 0 ? void 0 : (_node$attrs = node.attrs) === null || _node$attrs === void 0 ? void 0 : _node$attrs.localId) === targetLocalId) {
+      result = {
+        expandParentLocalIds: [...expandAncestors] // Copy the array
+      };
+      return false; // Stop traversing
+    }
+
+    // Check if this node is an expand or nestedExpand
+    const isExpand = (node === null || node === void 0 ? void 0 : node.type) === 'expand' || (node === null || node === void 0 ? void 0 : node.type) === 'nestedExpand';
+    const newExpandAncestors = isExpand && node !== null && node !== void 0 && (_node$attrs2 = node.attrs) !== null && _node$attrs2 !== void 0 && _node$attrs2.localId ? [...expandAncestors, node.attrs.localId] : expandAncestors;
+
+    // Traverse children if they exist
+    if (node !== null && node !== void 0 && node.content && Array.isArray(node.content)) {
+      for (const child of node.content) {
+        if (result || !child) {
+          break;
+        }
+        traverse(child, newExpandAncestors);
+      }
+    }
+    return !result; // Continue if we haven't found it yet
+  };
+
+  // Start traversal from the root
+  traverse(adfDoc, []);
+  return result;
+}
+
+/**
+ * Find all parent expand elements that contain the target element.
+ * Searches up the DOM tree to find expand or nestedExpand containers.
+ *
+ * This function limits the search depth to prevent infinite loops and performance issues.
+ * The default maxDepth of 2 is chosen because:
+ * - Most use cases have 0-2 levels of nesting
+ * - Searching deeper can impact performance
+ * - Users rarely nest expands more than 2 levels deep
+ *
+ * @param element - The target element to find parents for.
+ * @param maxDepth - Maximum depth to search (default: 2). This is the maximum number of
+ *                   expand ancestors to find, starting from the target element.
+ * @returns Array of expand containers ordered from outermost to innermost.
+ *          For example, if element is inside expand B which is inside expand A,
+ *          this returns [expandA, expandB].
+ */
+export const findParentExpands = (element, maxDepth = SCROLL_TO_BLOCK_TIMING.MAX_EXPAND_DEPTH) => {
+  const expands = [];
+  let currentElement = element;
+  let depth = 0;
+  while (currentElement && depth < maxDepth) {
+    // Look for expand container - handles both "expand" and "nestedExpand" types
+    const expandContainer = currentElement.closest('[data-node-type="expand"], [data-node-type="nestedExpand"]');
+    if (!expandContainer || expands.includes(expandContainer)) {
+      break;
+    }
+    expands.push(expandContainer);
+    currentElement = expandContainer.parentElement;
+    depth++;
+  }
+
+  // Return in reverse order so we expand from outermost to innermost
+  return expands.reverse();
+};
+
+/**
+ * Check if an expand node is currently collapsed.
+ *
+ * Uses two methods to determine collapse state:
+ * 1. First checks aria-expanded attribute on the toggle button (most reliable).
+ * 2. Falls back to checking content div visibility via computed styles.
+ *
+ * @param expandContainer - The expand container element.
+ * @returns True if the expand is collapsed, false if expanded or state cannot be determined.
+ */
+export const isExpandCollapsed = expandContainer => {
+  // Check for aria-expanded attribute on the toggle button
+  const toggleButton = expandContainer.querySelector('[aria-expanded]');
+  if (toggleButton && toggleButton instanceof HTMLElement) {
+    return toggleButton.getAttribute('aria-expanded') === 'false';
+  }
+
+  // Fallback: check if content div is hidden using the actual class name
+  const contentDiv = expandContainer.querySelector('.ak-editor-expand__content');
+  if (contentDiv && contentDiv instanceof HTMLElement) {
+    const computedStyle = window.getComputedStyle(contentDiv);
+    return computedStyle.display === 'none' || computedStyle.visibility === 'hidden' || contentDiv.hidden;
+  }
+  return false;
+};
+
+/**
+ * Expand a collapsed expand node by clicking its toggle button.
+ *
+ * This function finds the toggle button with aria-expanded="false" and programmatically
+ * clicks it to expand the node. It does not wait for the expansion to complete.
+ *
+ * @param expandContainer - The expand container element.
+ * @returns True if the toggle button was found and clicked, false otherwise.
+ */
+export const expandElement = expandContainer => {
+  // Find and click the toggle button
+  const toggleButton = expandContainer.querySelector('[aria-expanded="false"]');
+  if (toggleButton && toggleButton instanceof HTMLElement) {
+    toggleButton.click();
+    return true;
+  }
+  return false;
+};
+
+/**
+ * Expand all parent expands then scroll to the element.
+ *
+ * This is the main entry point for scrolling to elements that may be hidden inside collapsed expands.
+ * It handles nested expands by expanding them one at a time from outermost to innermost,
+ * waiting for DOM updates between each expansion.
+ *
+ * The function uses a recursive approach with retry logic to handle:
+ * - Nested expands that need sequential expansion
+ * - DOM updates that may take time to reflect
+ * - Failed expand operations (e.g., if toggle button is temporarily unavailable)
+ * - Disconnected elements (removed from DOM)
+ *
+ * After all parent expands are open (or max attempts reached), scrolls the element into view
+ * with smooth behavior and centered in the viewport.
+ *
+ * @param element - The target element to scroll to.
+ * @param attempt - Current attempt number (used internally for retry logic, starts at 0).
+ * @returns A cleanup function that cancels any pending timeouts. Call this when the operation
+ *          should be aborted (e.g., component unmount, navigation, or new scroll request).
+ */
+export const expandAllParentsThenScroll = (element, attempt = 0) => {
+  const {
+    MAX_EXPAND_DEPTH,
+    MAX_ATTEMPTS,
+    DOM_UPDATE_DELAY,
+    RETRY_DELAY
+  } = SCROLL_TO_BLOCK_TIMING;
+
+  // Store timeout ID and nested cleanup function so they can be cancelled.
+  let timeoutId = null;
+  let nestedCleanup = null;
+
+  // Cleanup function that cancels pending timeout and any nested operations.
+  const cleanup = () => {
+    if (timeoutId !== null) {
+      clearTimeout(timeoutId);
+      timeoutId = null;
+    }
+    if (nestedCleanup) {
+      nestedCleanup();
+      nestedCleanup = null;
+    }
+  };
+
+  // Guard against element being disconnected from DOM or exceeding max attempts.
+  if (attempt >= MAX_ATTEMPTS || !element.isConnected) {
+    // Max attempts reached or element disconnected, scroll anyway.
+    if (element.isConnected) {
+      element.scrollIntoView({
+        behavior: 'smooth',
+        block: 'center'
+      });
+    }
+    return cleanup;
+  }
+  try {
+    // Step 1: Find all parent expands (outermost to innermost).
+    const parentExpands = findParentExpands(element, MAX_EXPAND_DEPTH);
+
+    // Step 2: Find any collapsed expands (filter out disconnected elements).
+    const collapsedExpands = parentExpands.filter(expandContainer => expandContainer.isConnected && isExpandCollapsed(expandContainer));
+    if (collapsedExpands.length === 0) {
+      // All expands are open (or there are no expands), scroll to element.
+      element.scrollIntoView({
+        behavior: 'smooth',
+        block: 'center'
+      });
+      return cleanup;
+    }
+
+    // Step 3: Expand ONLY the outermost collapsed expand first.
+    // This is critical for nested expands - we must expand parent before child.
+    const outermostCollapsed = collapsedExpands[0];
+    try {
+      const expanded = expandElement(outermostCollapsed);
+      if (expanded) {
+        // Successfully expanded, wait briefly for DOM update then recurse to handle any nested expands.
+        // Note: There's no animation, but we need a minimal delay for DOM/React updates.
+        timeoutId = setTimeout(() => {
+          try {
+            // Verify element is still connected before proceeding.
+            if (!element.isConnected) {
+              return;
+            }
+
+            // Recurse to handle any nested collapsed expands or retry if still collapsed.
+            nestedCleanup = expandAllParentsThenScroll(element, attempt + 1);
+          } catch {
+            // Fallback to simple scroll on error.
+            if (element.isConnected) {
+              element.scrollIntoView({
+                behavior: 'smooth',
+                block: 'center'
+              });
+            }
+          }
+        }, DOM_UPDATE_DELAY);
+      } else {
+        // Failed to expand, retry with longer delay.
+        timeoutId = setTimeout(() => {
+          if (element.isConnected) {
+            nestedCleanup = expandAllParentsThenScroll(element, attempt + 1);
+          }
+        }, RETRY_DELAY);
+      }
+    } catch {
+      // Retry on error.
+      timeoutId = setTimeout(() => {
+        if (element.isConnected) {
+          nestedCleanup = expandAllParentsThenScroll(element, attempt + 1);
+        }
+      }, RETRY_DELAY);
+    }
+  } catch {
+    // Fallback to simple scroll on error.
+    if (element.isConnected) {
+      element.scrollIntoView({
+        behavior: 'smooth',
+        block: 'center'
+      });
+    }
+  }
+  return cleanup;
+};
+export const getLocalIdSelector = (localId, container) => {
+  // Check if the element with data-local-id exists
+  let element = container.querySelector(`[data-local-id="${localId}"]`);
+  if (element) {
+    return element;
+  }
+
+  // Special case for decision lists and task lists which already have localId
+  element = container.querySelector(`[data-decision-list-local-id="${localId}"]`);
+  if (element) {
+    return element;
+  }
+  element = container.querySelector(`[data-task-list-local-id="${localId}"]`);
+  if (element) {
+    return element;
+  }
+
+  // Special case for tables which use data-table-local-id
+  element = container.querySelector(`[data-table-local-id="${localId}"]`);
+  if (element) {
+    return element;
+  }
+
+  // Special case for extension, smart cards and media which use lowercase localid
+  element = container.querySelector(`[localid="${localId}"]`);
+  if (element) {
+    return element;
+  }
+  return null;
+};

package/dist/esm/analytics/types/enums.js

@@ -105,6 +105,8 @@ export var ACTION = /*#__PURE__*/function (ACTION) {
   ACTION["REACT_NODEVIEW_RENDERED"] = "reactNodeViewRendered";
   ACTION["REFERENCE_SYNCED_BLOCK_DELETE"] = "referenceSyncedBlockDelete";
   ACTION["REFERENCE_SYNCED_BLOCK_UPDATE"] = "referenceSyncedBlockUpdate";
+  ACTION["REFERENCE_SYNCED_BLOCK_UNSYNC"] = "referenceSyncedBlockUnsync";
+  ACTION["REFERENCE_SYNCED_BLOCK_COPY"] = "referenceSyncedBlockCopy";
   ACTION["REPLACED_ALL"] = "replacedAll";
   ACTION["REPLACED_ONE"] = "replacedOne";
   ACTION["RESOLVED"] = "resolved";
@@ -122,6 +124,9 @@ export var ACTION = /*#__PURE__*/function (ACTION) {
   ACTION["SYNCED_BLOCK_FETCH_REFERENCES"] = "syncedBlockFetchReferences";
   ACTION["SYNCED_BLOCK_DELETE"] = "syncedBlockDelete";
   ACTION["SYNCED_BLOCK_GET_SOURCE_INFO"] = "syncedBlockGetSourceInfo";
+  ACTION["SYNCED_BLOCK_UNSYNC"] = "syncedBlockUnsync";
+  ACTION["SYNCED_BLOCK_EDIT_SOURCE"] = "syncedBlockEditSource";
+  ACTION["SYNCED_BLOCK_VIEW_SYNCED_LOCATIONS"] = "syncedBlockViewSyncedLocations";
   ACTION["SYNCHRONY_DISCONNECTED"] = "synchronyDisconnected";
   ACTION["SYNCHRONY_ENTITY_ERROR"] = "synchronyEntityError";
   ACTION["SYNCHRONY_ERROR"] = "synchronyError";
@@ -249,6 +254,7 @@ export var INPUT_METHOD = /*#__PURE__*/function (INPUT_METHOD) {
   INPUT_METHOD["DOUBLE_CLICK"] = "doubleClick";
   INPUT_METHOD["META_CLICK"] = "metaClick";
   INPUT_METHOD["INLINE_SUGGESTION_FLOATING_TB"] = "inlineSuggestionFloatingToolbar";
+  INPUT_METHOD["SYNCED_BLOCK_TB"] = "syncedBlockToolbar";
   INPUT_METHOD["BLOCK_MENU"] = "blockMenu";
   INPUT_METHOD["SMART_LINK"] = "smartLink";
   return INPUT_METHOD;
@@ -535,6 +541,7 @@ export var ACTION_SUBJECT_ID = /*#__PURE__*/function (ACTION_SUBJECT_ID) {
   ACTION_SUBJECT_ID["EDITOR_PLUGIN_SELECTION_EXTENSION_COMPONENT"] = "editorPluginSelectionExtensionComponent";
   ACTION_SUBJECT_ID["TRANSFORM"] = "transform";
   ACTION_SUBJECT_ID["SYNCED_BLOCK_TOOLBAR"] = "syncedBlockToolbar";
+  ACTION_SUBJECT_ID["SYNCED_BLOCK_COPY"] = "syncedBlockCopy";
   ACTION_SUBJECT_ID["SYNCED_BLOCK_SOURCE_URL"] = "syncedBlockSourceUrl";
   ACTION_SUBJECT_ID["SYNCED_BLOCK_UPDATE_CACHE"] = "syncedBlockUpdateCache";
   ACTION_SUBJECT_ID["SYNCED_BLOCK_UPDATE"] = "syncedBlockUpdate";
@@ -546,6 +553,7 @@ export var ACTION_SUBJECT_ID = /*#__PURE__*/function (ACTION_SUBJECT_ID) {
   ACTION_SUBJECT_ID["SYNCED_BLOCK_GET_SOURCE_INFO"] = "syncedBlockGetSourceInfo";
   ACTION_SUBJECT_ID["SYNCED_BLOCK_FETCH"] = "syncedBlockFetch";
   ACTION_SUBJECT_ID["SYNCED_BLOCK_FETCH_REFERENCES"] = "syncedBlockFetchReferences";
+  ACTION_SUBJECT_ID["SYNCED_BLOCK_CLICK_SYNCED_LOCATION"] = "syncedBlockClickSyncedLocation";
   ACTION_SUBJECT_ID["TABLE_STICKY_HEADER"] = "tableStickyHeader";
   return ACTION_SUBJECT_ID;
 }({});

package/dist/esm/block-menu/block-link.js

@@ -1,34 +1,48 @@
 export var DEFAULT_BLOCK_LINK_HASH_PREFIX = 'block-';
 
 /**
- * Matches hashes that start with the block link prefix followed by a UUID
+ * Matches hashes that start with the block link prefix followed by either:
+ * - A UUID (e.g., '123e4567-e89b-12d3-a456-426614174000')
+ * - A short hex ID (e.g., 'ab2366c43b52')
  *
- * @param hash The hash string to check (e.g., '#block-123e4567-e89b-12d3-a456-426614174000' or 'block-123e4567-e89b-12d3-a456-426614174000')
- * @param prefix The prefix to look for (default is 'block-')
- * @returns True if the hash matches the block link pattern, false otherwise
+ * Short hex IDs are 12-character hexadecimal strings without dashes, used in some contexts
+ * as a compact alternative to full UUIDs. Both formats are valid block identifiers.
+ *
+ * Note: The short ID pattern matches exactly 12 hex characters. While this could theoretically
+ * match heading IDs or other anchors, block links are typically generated programmatically
+ * with known ID formats, minimizing collision risk.
+ *
+ * @param hash - The hash string to check (e.g., '#block-123e4567-e89b-12d3-a456-426614174000', '#block-ab2366c43b52', or without '#').
+ * @param prefix - The prefix to look for (default is 'block-').
+ * @returns True if the hash matches the block link pattern, false otherwise.
  */
 export var isBlockLinkHash = function isBlockLinkHash(hash) {
   var prefix = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : DEFAULT_BLOCK_LINK_HASH_PREFIX;
   if (!hash || !prefix) {
     return false;
   }
-  var regex = new RegExp("^#?".concat(prefix, "[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}$"), 'iu');
-  return regex.test(hash);
+  // Match either UUID format (8-4-4-4-12) or short hex ID format (exactly 12 hex chars without dashes).
+  var uuidRegex = new RegExp("^#?".concat(prefix, "[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}$"), 'iu');
+  var shortIdRegex = new RegExp("^#?".concat(prefix, "[0-9a-f]{12}$"), 'iu');
+  return uuidRegex.test(hash) || shortIdRegex.test(hash);
 };
 
 /**
  * Extracts the block ID from a block link hash.
  *
- * @param hash The hash string to extract the block ID from (e.g., '#block-123e4567-e89b-12d3-a456-426614174000' or 'block-123e4567-e89b-12d3-a456-426614174000')
- * @param prefix The prefix to look for (default is 'block-')
- * @returns The extracted block ID if the hash is valid, null otherwise
+ * Supports both UUID format (e.g., '123e4567-e89b-12d3-a456-426614174000') and
+ * short hex ID format (e.g., 'ab2366c43b52').
+ *
+ * @param hash - The hash string to extract the block ID from (e.g., '#block-123e4567-e89b-12d3-a456-426614174000', '#block-ab2366c43b52', or without '#').
+ * @param prefix - The prefix to look for (default is 'block-').
+ * @returns The extracted block ID if the hash is valid, null otherwise.
  */
 export var extractBlockIdFromLinkHash = function extractBlockIdFromLinkHash(hash) {
   var prefix = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : DEFAULT_BLOCK_LINK_HASH_PREFIX;
   if (!isBlockLinkHash(hash, prefix)) {
     return null;
   }
-  // Remove leading # if present, then remove the prefix
+  // Remove leading # if present, then remove the prefix.
   var normalized = hash.startsWith('#') ? hash.slice(1) : hash;
   return normalized.slice(prefix.length);
 };
@@ -36,9 +50,9 @@ export var extractBlockIdFromLinkHash = function extractBlockIdFromLinkHash(hash
 /**
  * Creates a block link hash from a given block ID.
  *
- * @param blockId The block ID to create the hash from (e.g., '123e4567-e89b-12d3-a456-426614174000')
- * @param prefix The prefix to use (default is 'block-')
- * @returns The constructed block link hash value (e.g., 'block-123e4567-e89b-12d3-a456-426614174000')
+ * @param blockId - The block ID to create the hash from (e.g., '123e4567-e89b-12d3-a456-426614174000').
+ * @param prefix - The prefix to use (default is 'block-').
+ * @returns The constructed block link hash value (e.g., 'block-123e4567-e89b-12d3-a456-426614174000').
  */
 export var createBlockLinkHashValue = function createBlockLinkHashValue(blockId) {
   var prefix = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : DEFAULT_BLOCK_LINK_HASH_PREFIX;

package/dist/esm/block-menu/index.js

@@ -4,4 +4,5 @@ export { BLOCK_ACTIONS_MENU_SECTION, BLOCK_ACTIONS_FEATURED_EXTENSION_SLOT_MENU_
 export { FORMAT_HEADING_1_MENU_ITEM, FORMAT_HEADING_2_MENU_ITEM, FORMAT_HEADING_3_MENU_ITEM, FORMAT_HEADING_4_MENU_ITEM, FORMAT_HEADING_5_MENU_ITEM, FORMAT_HEADING_6_MENU_ITEM, FORMAT_PARAGRAPH_MENU_ITEM, FORMAT_QUOTE_MENU_ITEM, FORMAT_EXPAND_MENU_ITEM, FORMAT_LAYOUT_MENU_ITEM, FORMAT_PANEL_MENU_ITEM, FORMAT_CODE_BLOCK_MENU_ITEM, FORMAT_BULLETED_LIST_MENU_ITEM, FORMAT_NUMBERED_LIST_MENU_ITEM, FORMAT_TASK_LIST_MENU_ITEM, COPY_MENU_SECTION, MOVE_UP_DOWN_MENU_SECTION, COPY_BLOCK_MENU_ITEM, COPY_LINK_MENU_ITEM, MOVE_UP_MENU_ITEM, MOVE_DOWN_MENU_ITEM, NESTED_FORMAT_MENU_SECTION, FORMAT_MENU_ITEM, NESTED_FORMAT_MENU, PRIMARY_MENU_SECTION, ADD_BLOCKS_MENU_SECTION, CREATE_SYNCED_BLOCK_MENU_ITEM } from './key-deprecated';
 export { MAIN_BLOCK_MENU_SECTION_RANK, TRANSFORM_MENU_SECTION_RANK, TRANSFORM_MENU_ITEM_RANK, TRANSFORM_HEADINGS_MENU_SECTION_RANK, TRANSFORM_STRUCTURE_MENU_SECTION_RANK, TRANSFORM_CLEAR_MENU_SECTION_RANK, BLOCK_ACTIONS_MENU_SECTION_RANK, POSITION_MENU_SECTION_RANK, DELETE_MENU_SECTION_RANK, TRANSFORM_SUGGESTED_MENU_SECTION_RANK, TRANSFORM_CREATE_MENU_SECTION_RANK } from './rank';
 export { FORMAT_NESTED_MENU_RANK, FORMAT_NESTED_MENU_RANK_REVISED, BLOCK_MENU_SECTION_RANK, PRIMARY_MENU_SECTION_RANK, COPY_MENU_SECTION_RANK, DELETE_SECTION_RANK, MOVE_BLOCK_SECTION_RANK, ADD_BLOCKS_MENU_SECTION_RANK } from './rank-deprecated';
-export { createBlockLinkHashValue, DEFAULT_BLOCK_LINK_HASH_PREFIX, extractBlockIdFromLinkHash, isBlockLinkHash } from './block-link';
+export { createBlockLinkHashValue, DEFAULT_BLOCK_LINK_HASH_PREFIX, extractBlockIdFromLinkHash, isBlockLinkHash } from './block-link';
+export { expandAllParentsThenScroll, findParentExpands, isExpandCollapsed, expandElement, findNodeWithExpandParents, SCROLL_TO_BLOCK_TIMING, getLocalIdSelector } from './scroll-to-block-utils';