@atlaskit/editor-common 110.16.1 → 110.16.3

package/CHANGELOG.md

@@ -1,5 +1,20 @@
 # @atlaskit/editor-common
 
+## 110.16.3
+
+### Patch Changes
+
+- [`4821b70c5e660`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/4821b70c5e660) -
+  ED-29531 Arrow key navigation on primary toolbar cannot go pass format text dropdown button
+- Updated dependencies
+
+## 110.16.2
+
+### Patch Changes
+
+- [`c219d22cf0788`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/c219d22cf0788) -
+  [ux] Card hover link overlay in compact mode
+
 ## 110.16.1
 
 ### Patch Changes

package/dist/cjs/monitoring/error.js

@@ -16,7 +16,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
 var SENTRY_DSN = 'https://0b10c8e02fb44d8796c047b102c9bee8@o55978.ingest.sentry.io/4505129224110080';
 var packageName = 'editor-common'; // Sentry doesn't accept '/' in its releases https://docs.sentry.io/platforms/javascript/configuration/releases/
-var packageVersion = "0.0.0-development";
+var packageVersion = "110.16.2";
 var sanitiseSentryEvents = function sanitiseSentryEvents(data, _hint) {
   // Remove URL as it has UGC
   // Ignored via go/ees007

package/dist/cjs/ui/DropList/index.js

@@ -24,7 +24,7 @@ function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.
  * @jsx jsx
  */ // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 var packageName = "@atlaskit/editor-common";
-var packageVersion = "0.0.0-development";
+var packageVersion = "110.16.2";
 var halfFocusRing = 1;
 var dropOffset = '0, 8';
 var fadeIn = (0, _react2.keyframes)({

package/dist/cjs/ui/HoverLinkOverlay/index.js

@@ -11,9 +11,11 @@ var _react = _interopRequireWildcard(require("react"));
 var _react2 = require("@emotion/react");
 var _reactIntlNext = require("react-intl-next");
 var _state = require("@atlaskit/editor-prosemirror/state");
+var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
 var _growDiagonal = _interopRequireDefault(require("@atlaskit/icon/core/grow-diagonal"));
 var _linkExternal = _interopRequireDefault(require("@atlaskit/icon/core/link-external"));
 var _panelRight = _interopRequireDefault(require("@atlaskit/icon/core/panel-right"));
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _platformFeatureFlagsReact = require("@atlaskit/platform-feature-flags-react");
 var _primitives = require("@atlaskit/primitives");
 var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
@@ -34,6 +36,12 @@ function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r
 
 // eslint-disable-next-line @atlaskit/design-system/no-emotion-primitives -- to be migrated to @atlaskit/primitives/compiled – go/akcss
 
+/**
+ * Dynamic padding value that adjusts based on the editor's base font size.
+ * When base font size is <= akEditorFullPageDenseFontSize (13px), uses 1px padding.
+ * Otherwise, uses default value with token('space.025').
+ */
+var DYNAMIC_PADDING_BLOCK = "clamp(1px, calc((var(--ak-editor-base-font-size, ".concat(_editorSharedStyles.akEditorFullPageDefaultFontSize, "px) - ").concat(_editorSharedStyles.akEditorFullPageDenseFontSize, "px) * 999), ", "var(--ds-space-025, 2px)", ")");
 var containerStylesOld = (0, _react2.css)({
   position: 'relative'
 });
@@ -246,7 +254,7 @@ var HoverLinkOverlayOriginal = function HoverLinkOverlayOriginal(_ref) {
       href: url,
       target: "_blank",
       style: {
-        paddingBlock: compactPadding ? '1px' : "var(--ds-space-025, 2px)"
+        paddingBlock: compactPadding ? '1px' : (0, _expValEquals.expValEquals)('cc_editor_ai_content_mode', 'variant', 'test') && (0, _platformFeatureFlags.fg)('platform_editor_content_mode_button_mvp') ? DYNAMIC_PADDING_BLOCK : "var(--ds-space-025, 2px)"
       },
       onClick: handleClick,
       testId: "inline-card-hoverlink-overlay"
@@ -386,7 +394,7 @@ var HoverLinkOverlayNew = function HoverLinkOverlayNew(_ref2) {
     href: url,
     target: "_blank",
     style: {
-      paddingBlock: compactPadding ? '1px' : "var(--ds-space-025, 2px)"
+      paddingBlock: compactPadding ? '1px' : (0, _expValEquals.expValEquals)('cc_editor_ai_content_mode', 'variant', 'test') && (0, _platformFeatureFlags.fg)('platform_editor_content_mode_button_mvp') ? DYNAMIC_PADDING_BLOCK : "var(--ds-space-025, 2px)"
     },
     onClick: handleClick,
     testId: "inline-card-hoverlink-overlay"

package/dist/cjs/ui-menu/ToolbarArrowKeyNavigationProvider/index.js

@@ -7,6 +7,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.ToolbarArrowKeyNavigationProvider = exports.KeyDownHandlerContext = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var _react2 = require("@emotion/react");
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _elementBrowser = require("../../element-browser");
 var _messages = require("../../messages");
 var _mediaInsert = require("../../messages/media-insert");
@@ -248,12 +249,38 @@ function getFocusableElements(rootNode) {
   var focusableModalElements = rootNode.querySelectorAll('a[href], button:not([disabled]), textarea, input, select, div[tabindex="-1"], div[tabindex="0"]') || [];
   return Array.from(focusableModalElements);
 }
+function isElementOrAncestorHiddenOrDisabled(element, rootNode) {
+  var currentElement = element;
+  while (currentElement && currentElement !== rootNode && currentElement !== document.body) {
+    var style = window.getComputedStyle(currentElement);
+
+    // Check if current element is hidden
+    if (style.visibility === 'hidden' || style.display === 'none') {
+      return true;
+    }
+
+    // Check if current element is disabled
+    if (currentElement.hasAttribute('disabled') || currentElement.getAttribute('aria-disabled') === 'true' || currentElement.disabled === true) {
+      return true;
+    }
+
+    // Move to parent element
+    currentElement = currentElement.parentElement;
+  }
+  return false;
+}
 function getFilteredFocusableElements(rootNode) {
   // The focusable elements from child components such as dropdown menus / popups are ignored
   return getFocusableElements(rootNode).filter(function (elm) {
     var style = window.getComputedStyle(elm);
     // ignore invisible element to avoid losing focus
     var isVisible = style.visibility !== 'hidden' && style.display !== 'none';
+
+    // Check if element or any ancestor is hidden or disabled
+    var isHiddenOrDisabled = isElementOrAncestorHiddenOrDisabled(elm, rootNode);
+    if ((0, _platformFeatureFlags.fg)('platform_editor_toolbar_aifc_patch_7')) {
+      return !elm.closest('[data-role="droplistContent"]') && !elm.closest('[data-emoji-picker-container="true"]') && !elm.closest('[data-test-id="color-picker-menu"]') && !elm.closest('.scroll-buttons') && !isHiddenOrDisabled;
+    }
     return !elm.closest('[data-role="droplistContent"]') && !elm.closest('[data-emoji-picker-container="true"]') && !elm.closest('[data-test-id="color-picker-menu"]') && !elm.closest('.scroll-buttons') && isVisible;
   });
 }

package/dist/es2019/monitoring/error.js

@@ -1,7 +1,7 @@
 import { isFedRamp } from './environment';
 const SENTRY_DSN = 'https://0b10c8e02fb44d8796c047b102c9bee8@o55978.ingest.sentry.io/4505129224110080';
 const packageName = 'editor-common'; // Sentry doesn't accept '/' in its releases https://docs.sentry.io/platforms/javascript/configuration/releases/
-const packageVersion = "0.0.0-development";
+const packageVersion = "110.16.2";
 const sanitiseSentryEvents = (data, _hint) => {
   // Remove URL as it has UGC
   // Ignored via go/ees007

package/dist/es2019/ui/DropList/index.js

@@ -14,7 +14,7 @@ import withAnalyticsEvents from '@atlaskit/analytics-next/withAnalyticsEvents';
 import { fg } from '@atlaskit/platform-feature-flags';
 import Layer from '../Layer';
 const packageName = "@atlaskit/editor-common";
-const packageVersion = "0.0.0-development";
+const packageVersion = "110.16.2";
 const halfFocusRing = 1;
 const dropOffset = '0, 8';
 const fadeIn = keyframes({

package/dist/es2019/ui/HoverLinkOverlay/index.js

@@ -8,10 +8,12 @@ import React, { useLayoutEffect, useRef, useState } from 'react';
 import { css, jsx } from '@emotion/react'; // eslint-disable-line @atlaskit/ui-styling-standard/use-compiled
 import { useIntl } from 'react-intl-next';
 import { NodeSelection } from '@atlaskit/editor-prosemirror/state';
+import { akEditorFullPageDefaultFontSize, akEditorFullPageDenseFontSize } from '@atlaskit/editor-shared-styles';
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import GrowDiagonalIcon from '@atlaskit/icon/core/grow-diagonal';
 import LinkExternalIcon from '@atlaskit/icon/core/link-external';
 import PanelRightIcon from '@atlaskit/icon/core/panel-right';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { componentWithCondition } from '@atlaskit/platform-feature-flags-react';
 // eslint-disable-next-line @atlaskit/design-system/no-emotion-primitives -- to be migrated to @atlaskit/primitives/compiled – go/akcss
 import { Anchor, Box, Text, xcss } from '@atlaskit/primitives';
@@ -19,6 +21,12 @@ import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import { buildVisitedNonHyperLinkPayload, INPUT_METHOD } from '../../analytics';
 import { cardMessages } from '../../messages';
+/**
+ * Dynamic padding value that adjusts based on the editor's base font size.
+ * When base font size is <= akEditorFullPageDenseFontSize (13px), uses 1px padding.
+ * Otherwise, uses default value with token('space.025').
+ */
+const DYNAMIC_PADDING_BLOCK = `clamp(1px, calc((var(--ak-editor-base-font-size, ${akEditorFullPageDefaultFontSize}px) - ${akEditorFullPageDenseFontSize}px) * 999), ${"var(--ds-space-025, 2px)"})`;
 const containerStylesOld = css({
   position: 'relative'
 });
@@ -222,7 +230,7 @@ const HoverLinkOverlayOriginal = ({
       href: url,
       target: "_blank",
       style: {
-        paddingBlock: compactPadding ? '1px' : "var(--ds-space-025, 2px)"
+        paddingBlock: compactPadding ? '1px' : expValEquals('cc_editor_ai_content_mode', 'variant', 'test') && fg('platform_editor_content_mode_button_mvp') ? DYNAMIC_PADDING_BLOCK : "var(--ds-space-025, 2px)"
       },
       onClick: handleClick,
       testId: "inline-card-hoverlink-overlay"
@@ -348,7 +356,7 @@ const HoverLinkOverlayNew = ({
     href: url,
     target: "_blank",
     style: {
-      paddingBlock: compactPadding ? '1px' : "var(--ds-space-025, 2px)"
+      paddingBlock: compactPadding ? '1px' : expValEquals('cc_editor_ai_content_mode', 'variant', 'test') && fg('platform_editor_content_mode_button_mvp') ? DYNAMIC_PADDING_BLOCK : "var(--ds-space-025, 2px)"
     },
     onClick: handleClick,
     testId: "inline-card-hoverlink-overlay"

package/dist/es2019/ui-menu/ToolbarArrowKeyNavigationProvider/index.js

@@ -7,6 +7,7 @@ import React, { useCallback, useLayoutEffect, useMemo, useRef } from 'react';
 
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { css, jsx } from '@emotion/react';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { ELEMENT_BROWSER_ID } from '../../element-browser';
 import { fullPageMessages } from '../../messages';
 import { mediaInsertMessages } from '../../messages/media-insert';
@@ -240,12 +241,38 @@ function getFocusableElements(rootNode) {
   const focusableModalElements = rootNode.querySelectorAll('a[href], button:not([disabled]), textarea, input, select, div[tabindex="-1"], div[tabindex="0"]') || [];
   return Array.from(focusableModalElements);
 }
+function isElementOrAncestorHiddenOrDisabled(element, rootNode) {
+  let currentElement = element;
+  while (currentElement && currentElement !== rootNode && currentElement !== document.body) {
+    const style = window.getComputedStyle(currentElement);
+
+    // Check if current element is hidden
+    if (style.visibility === 'hidden' || style.display === 'none') {
+      return true;
+    }
+
+    // Check if current element is disabled
+    if (currentElement.hasAttribute('disabled') || currentElement.getAttribute('aria-disabled') === 'true' || currentElement.disabled === true) {
+      return true;
+    }
+
+    // Move to parent element
+    currentElement = currentElement.parentElement;
+  }
+  return false;
+}
 function getFilteredFocusableElements(rootNode) {
   // The focusable elements from child components such as dropdown menus / popups are ignored
   return getFocusableElements(rootNode).filter(elm => {
     const style = window.getComputedStyle(elm);
     // ignore invisible element to avoid losing focus
     const isVisible = style.visibility !== 'hidden' && style.display !== 'none';
+
+    // Check if element or any ancestor is hidden or disabled
+    const isHiddenOrDisabled = isElementOrAncestorHiddenOrDisabled(elm, rootNode);
+    if (fg('platform_editor_toolbar_aifc_patch_7')) {
+      return !elm.closest('[data-role="droplistContent"]') && !elm.closest('[data-emoji-picker-container="true"]') && !elm.closest('[data-test-id="color-picker-menu"]') && !elm.closest('.scroll-buttons') && !isHiddenOrDisabled;
+    }
     return !elm.closest('[data-role="droplistContent"]') && !elm.closest('[data-emoji-picker-container="true"]') && !elm.closest('[data-test-id="color-picker-menu"]') && !elm.closest('.scroll-buttons') && isVisible;
   });
 }

package/dist/esm/monitoring/error.js

@@ -7,7 +7,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 import { isFedRamp } from './environment';
 var SENTRY_DSN = 'https://0b10c8e02fb44d8796c047b102c9bee8@o55978.ingest.sentry.io/4505129224110080';
 var packageName = 'editor-common'; // Sentry doesn't accept '/' in its releases https://docs.sentry.io/platforms/javascript/configuration/releases/
-var packageVersion = "0.0.0-development";
+var packageVersion = "110.16.2";
 var sanitiseSentryEvents = function sanitiseSentryEvents(data, _hint) {
   // Remove URL as it has UGC
   // Ignored via go/ees007

package/dist/esm/ui/DropList/index.js

@@ -21,7 +21,7 @@ import withAnalyticsEvents from '@atlaskit/analytics-next/withAnalyticsEvents';
 import { fg } from '@atlaskit/platform-feature-flags';
 import Layer from '../Layer';
 var packageName = "@atlaskit/editor-common";
-var packageVersion = "0.0.0-development";
+var packageVersion = "110.16.2";
 var halfFocusRing = 1;
 var dropOffset = '0, 8';
 var fadeIn = keyframes({

package/dist/esm/ui/HoverLinkOverlay/index.js

@@ -9,10 +9,12 @@ import React, { useLayoutEffect, useRef, useState } from 'react';
 import { css, jsx } from '@emotion/react'; // eslint-disable-line @atlaskit/ui-styling-standard/use-compiled
 import { useIntl } from 'react-intl-next';
 import { NodeSelection } from '@atlaskit/editor-prosemirror/state';
+import { akEditorFullPageDefaultFontSize, akEditorFullPageDenseFontSize } from '@atlaskit/editor-shared-styles';
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import GrowDiagonalIcon from '@atlaskit/icon/core/grow-diagonal';
 import LinkExternalIcon from '@atlaskit/icon/core/link-external';
 import PanelRightIcon from '@atlaskit/icon/core/panel-right';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { componentWithCondition } from '@atlaskit/platform-feature-flags-react';
 // eslint-disable-next-line @atlaskit/design-system/no-emotion-primitives -- to be migrated to @atlaskit/primitives/compiled – go/akcss
 import { Anchor, Box, Text, xcss } from '@atlaskit/primitives';
@@ -20,6 +22,12 @@ import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import { buildVisitedNonHyperLinkPayload, INPUT_METHOD } from '../../analytics';
 import { cardMessages } from '../../messages';
+/**
+ * Dynamic padding value that adjusts based on the editor's base font size.
+ * When base font size is <= akEditorFullPageDenseFontSize (13px), uses 1px padding.
+ * Otherwise, uses default value with token('space.025').
+ */
+var DYNAMIC_PADDING_BLOCK = "clamp(1px, calc((var(--ak-editor-base-font-size, ".concat(akEditorFullPageDefaultFontSize, "px) - ").concat(akEditorFullPageDenseFontSize, "px) * 999), ", "var(--ds-space-025, 2px)", ")");
 var containerStylesOld = css({
   position: 'relative'
 });
@@ -232,7 +240,7 @@ var HoverLinkOverlayOriginal = function HoverLinkOverlayOriginal(_ref) {
       href: url,
       target: "_blank",
       style: {
-        paddingBlock: compactPadding ? '1px' : "var(--ds-space-025, 2px)"
+        paddingBlock: compactPadding ? '1px' : expValEquals('cc_editor_ai_content_mode', 'variant', 'test') && fg('platform_editor_content_mode_button_mvp') ? DYNAMIC_PADDING_BLOCK : "var(--ds-space-025, 2px)"
       },
       onClick: handleClick,
       testId: "inline-card-hoverlink-overlay"
@@ -372,7 +380,7 @@ var HoverLinkOverlayNew = function HoverLinkOverlayNew(_ref2) {
     href: url,
     target: "_blank",
     style: {
-      paddingBlock: compactPadding ? '1px' : "var(--ds-space-025, 2px)"
+      paddingBlock: compactPadding ? '1px' : expValEquals('cc_editor_ai_content_mode', 'variant', 'test') && fg('platform_editor_content_mode_button_mvp') ? DYNAMIC_PADDING_BLOCK : "var(--ds-space-025, 2px)"
     },
     onClick: handleClick,
     testId: "inline-card-hoverlink-overlay"

package/dist/esm/ui-menu/ToolbarArrowKeyNavigationProvider/index.js

@@ -7,6 +7,7 @@ import React, { useCallback, useLayoutEffect, useMemo, useRef } from 'react';
 
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { css, jsx } from '@emotion/react';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { ELEMENT_BROWSER_ID } from '../../element-browser';
 import { fullPageMessages } from '../../messages';
 import { mediaInsertMessages } from '../../messages/media-insert';
@@ -240,12 +241,38 @@ function getFocusableElements(rootNode) {
   var focusableModalElements = rootNode.querySelectorAll('a[href], button:not([disabled]), textarea, input, select, div[tabindex="-1"], div[tabindex="0"]') || [];
   return Array.from(focusableModalElements);
 }
+function isElementOrAncestorHiddenOrDisabled(element, rootNode) {
+  var currentElement = element;
+  while (currentElement && currentElement !== rootNode && currentElement !== document.body) {
+    var style = window.getComputedStyle(currentElement);
+
+    // Check if current element is hidden
+    if (style.visibility === 'hidden' || style.display === 'none') {
+      return true;
+    }
+
+    // Check if current element is disabled
+    if (currentElement.hasAttribute('disabled') || currentElement.getAttribute('aria-disabled') === 'true' || currentElement.disabled === true) {
+      return true;
+    }
+
+    // Move to parent element
+    currentElement = currentElement.parentElement;
+  }
+  return false;
+}
 function getFilteredFocusableElements(rootNode) {
   // The focusable elements from child components such as dropdown menus / popups are ignored
   return getFocusableElements(rootNode).filter(function (elm) {
     var style = window.getComputedStyle(elm);
     // ignore invisible element to avoid losing focus
     var isVisible = style.visibility !== 'hidden' && style.display !== 'none';
+
+    // Check if element or any ancestor is hidden or disabled
+    var isHiddenOrDisabled = isElementOrAncestorHiddenOrDisabled(elm, rootNode);
+    if (fg('platform_editor_toolbar_aifc_patch_7')) {
+      return !elm.closest('[data-role="droplistContent"]') && !elm.closest('[data-emoji-picker-container="true"]') && !elm.closest('[data-test-id="color-picker-menu"]') && !elm.closest('.scroll-buttons') && !isHiddenOrDisabled;
+    }
     return !elm.closest('[data-role="droplistContent"]') && !elm.closest('[data-emoji-picker-container="true"]') && !elm.closest('[data-test-id="color-picker-menu"]') && !elm.closest('.scroll-buttons') && isVisible;
   });
 }

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-common",
-	"version": "110.16.1",
+	"version": "110.16.3",
 	"description": "A package that contains common classes and components for editor and renderer",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -267,12 +267,18 @@
 		"platform_editor_a11y_insert_link_item_focus": {
 			"type": "boolean"
 		},
+		"platform_editor_toolbar_aifc_patch_7": {
+			"type": "boolean"
+		},
 		"platform_editor_block_menu_format_rank_revised": {
 			"type": "boolean"
 		},
 		"platform_editor_update_modal_close_button": {
 			"type": "boolean"
 		},
+		"platform_editor_content_mode_button_mvp": {
+			"type": "boolean"
+		},
 		"platform_editor_fix_mixed_types_column_sort": {
 			"type": "boolean"
 		}