@atlaskit/editor-common 82.4.0 → 82.5.0

package/CHANGELOG.md

@@ -1,5 +1,23 @@
 # @atlaskit/editor-common
 
+## 82.5.0
+
+### Minor Changes
+
+- [#108718](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/108718)
+  [`1aad4f15416c2`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/1aad4f15416c2) -
+  [EDF-737] Add content warning to the floating toolbar of the ai panels, extended extensions
+  floating toolbar API to allow custom JSX
+- [#108805](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/108805)
+  [`5c0926002a5ac`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/5c0926002a5ac) -
+  Add new element drag and drop analytic events
+
+### Patch Changes
+
+- [#110426](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/110426)
+  [`f423990451a12`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/f423990451a12) -
+  [ED-23348] Fixed the feature flag set-up for the text highlight decorator
+
 ## 82.4.0
 
 ### Minor Changes

package/dist/cjs/analytics/types/element-events.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

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

@@ -15,6 +15,7 @@ var ACTION = exports.ACTION = /*#__PURE__*/function (ACTION) {
   ACTION["ACTIVATED"] = "activated";
   ACTION["ADDED"] = "added";
   ACTION["BROWSER_FREEZE"] = "browserFreeze";
+  ACTION["CANCELLED"] = "cancelled";
   ACTION["CAUGHT_DOM_ERROR"] = "caughtDomError";
   ACTION["CHANGED_BACKGROUND_COLOR"] = "changedBackgroundColor";
   ACTION["CHANGED_ICON"] = "changedIcon";
@@ -40,6 +41,7 @@ var ACTION = exports.ACTION = /*#__PURE__*/function (ACTION) {
   ACTION["DISMISSED"] = "dismissed";
   ACTION["DISPATCHED_INVALID_TRANSACTION"] = "dispatchedInvalidTransaction";
   ACTION["DISPATCHED_VALID_TRANSACTION"] = "dispatchedValidTransaction";
+  ACTION["DRAGGED"] = "dragged";
   ACTION["EDITED"] = "edited";
   ACTION["EDITOR_CRASHED"] = "unhandledErrorCaught";
   ACTION["EDITOR_CRASHED_ADDITIONAL_INFORMATION"] = "unhandledErrorCaughtAdditionalInfov2";
@@ -154,6 +156,7 @@ var INPUT_METHOD = exports.INPUT_METHOD = /*#__PURE__*/function (INPUT_METHOD) {
   INPUT_METHOD["CONFIG_PANEL"] = "configPanel";
   INPUT_METHOD["CONTEXT_MENU"] = "contextMenu";
   INPUT_METHOD["DRAG_AND_DROP"] = "dragAndDrop";
+  INPUT_METHOD["DRAG"] = "drag";
   INPUT_METHOD["EXTERNAL"] = "external";
   INPUT_METHOD["EXTENSION_API"] = "extensionApi";
   INPUT_METHOD["FLOATING_TB"] = "floatingToolbar";
@@ -231,6 +234,9 @@ var ACTION_SUBJECT = exports.ACTION_SUBJECT = /*#__PURE__*/function (ACTION_SUBJ
   ACTION_SUBJECT["LOOM"] = "loom";
   ACTION_SUBJECT["MULTI_BODIED_EXTENSION"] = "multiBodiedExtension";
   ACTION_SUBJECT["BODIED_EXTENSION"] = "bodiedExtension";
+  ACTION_SUBJECT["DROP_TARGET"] = "dropTarget";
+  ACTION_SUBJECT["DRAG"] = "drag";
+  ACTION_SUBJECT["ELEMENT"] = "element";
   return ACTION_SUBJECT;
 }({});
 var ACTION_SUBJECT_ID = exports.ACTION_SUBJECT_ID = /*#__PURE__*/function (ACTION_SUBJECT_ID) {
@@ -260,6 +266,8 @@ var ACTION_SUBJECT_ID = exports.ACTION_SUBJECT_ID = /*#__PURE__*/function (ACTIO
   ACTION_SUBJECT_ID["DECISION"] = "decision";
   ACTION_SUBJECT_ID["DIVIDER"] = "divider";
   ACTION_SUBJECT_ID["EDIT_LINK"] = "editLink";
+  ACTION_SUBJECT_ID["ELEMENT_DRAG_HANDLE"] = "elementDragHandle";
+  ACTION_SUBJECT_ID["ELEMENT_DROP_TARGET"] = "elementDropTarget";
   ACTION_SUBJECT_ID["EMBEDS"] = "embeds";
   ACTION_SUBJECT_ID["EMOJI"] = "emoji";
   ACTION_SUBJECT_ID["EXPAND"] = "expand";

package/dist/cjs/extensions/module-helpers.js

@@ -158,8 +158,10 @@ var logError = function logError(msg) {
 };
 var toolbarItemToButtonConfig = function toolbarItemToButtonConfig(toolbarItem, parentKey) {
   var tooltip = toolbarItem.tooltip,
+    tooltipStyle = toolbarItem.tooltipStyle,
     key = toolbarItem.key,
     label = toolbarItem.label,
+    ariaLabel = toolbarItem.ariaLabel,
     icon = toolbarItem.icon,
     action = toolbarItem.action,
     disabled = toolbarItem.disabled;
@@ -197,7 +199,9 @@ var toolbarItemToButtonConfig = function toolbarItemToButtonConfig(toolbarItem,
   }
   return _objectSpread({
     key: itemKey,
+    ariaLabel: ariaLabel,
     tooltip: tooltip,
+    tooltipStyle: tooltipStyle,
     action: action,
     disabled: disabled
   }, labelAndIcon);

package/dist/cjs/monitoring/error.js

@@ -17,7 +17,7 @@ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 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 = "82.4.0";
+var packageVersion = "82.5.0";
 var sanitiseSentryEvents = function sanitiseSentryEvents(data, _hint) {
   // Remove URL as it has UGC
   // TODO: Sanitise the URL instead of just removing it

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

@@ -20,7 +20,7 @@ var _Layer = _interopRequireDefault(require("../Layer"));
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
 function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); } /** @jsx jsx */
 var packageName = "@atlaskit/editor-common";
-var packageVersion = "82.4.0";
+var packageVersion = "82.5.0";
 var halfFocusRing = 1;
 var dropOffset = '0, 8';
 var DropList = /*#__PURE__*/function (_Component) {

package/dist/cjs/ui/FloatingToolbar/Button.js

@@ -34,6 +34,7 @@ var _default = exports.default = function _default(_ref) {
     children = _ref.children,
     className = _ref.className,
     tooltipContent = _ref.tooltipContent,
+    tooltipStyle = _ref.tooltipStyle,
     testId = _ref.testId,
     _ref$hideTooltipOnCli = _ref.hideTooltipOnClick,
     hideTooltipOnClick = _ref$hideTooltipOnCli === void 0 ? true : _ref$hideTooltipOnCli,
@@ -54,6 +55,7 @@ var _default = exports.default = function _default(_ref) {
   // Only fallback to title for tooltip if title is not shown
   , {
     content: tooltipContent || (iconOnly ? title : undefined),
+    component: tooltipStyle,
     hideTooltipOnClick: hideTooltipOnClick,
     position: "top"
   }, /*#__PURE__*/_react.default.createElement("div", {

package/dist/cjs/ui-color/ColorPalette/Color/index.js

@@ -140,5 +140,10 @@ var ClassComponentColor = /*#__PURE__*/function (_PureComponent) {
   }]);
   return ClassComponentColor;
 }(_react.PureComponent);
-var Color = (0, _platformFeatureFlags.getBooleanFF)('platform.editor.transparent-diagonal-decorator') ? FunctionalComponentColor : ClassComponentColor;
+var Color = function Color(props) {
+  if ((0, _platformFeatureFlags.getBooleanFF)('platform.editor.transparent-diagonal-decorator')) {
+    return (0, _react2.jsx)(FunctionalComponentColor, props);
+  }
+  return (0, _react2.jsx)(ClassComponentColor, props);
+};
 var _default = exports.default = Color;

package/dist/es2019/analytics/types/element-events.js

@@ -0,0 +1 @@
+export {};

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

@@ -9,6 +9,7 @@ export let ACTION = /*#__PURE__*/function (ACTION) {
   ACTION["ACTIVATED"] = "activated";
   ACTION["ADDED"] = "added";
   ACTION["BROWSER_FREEZE"] = "browserFreeze";
+  ACTION["CANCELLED"] = "cancelled";
   ACTION["CAUGHT_DOM_ERROR"] = "caughtDomError";
   ACTION["CHANGED_BACKGROUND_COLOR"] = "changedBackgroundColor";
   ACTION["CHANGED_ICON"] = "changedIcon";
@@ -34,6 +35,7 @@ export let ACTION = /*#__PURE__*/function (ACTION) {
   ACTION["DISMISSED"] = "dismissed";
   ACTION["DISPATCHED_INVALID_TRANSACTION"] = "dispatchedInvalidTransaction";
   ACTION["DISPATCHED_VALID_TRANSACTION"] = "dispatchedValidTransaction";
+  ACTION["DRAGGED"] = "dragged";
   ACTION["EDITED"] = "edited";
   ACTION["EDITOR_CRASHED"] = "unhandledErrorCaught";
   ACTION["EDITOR_CRASHED_ADDITIONAL_INFORMATION"] = "unhandledErrorCaughtAdditionalInfov2";
@@ -148,6 +150,7 @@ export let INPUT_METHOD = /*#__PURE__*/function (INPUT_METHOD) {
   INPUT_METHOD["CONFIG_PANEL"] = "configPanel";
   INPUT_METHOD["CONTEXT_MENU"] = "contextMenu";
   INPUT_METHOD["DRAG_AND_DROP"] = "dragAndDrop";
+  INPUT_METHOD["DRAG"] = "drag";
   INPUT_METHOD["EXTERNAL"] = "external";
   INPUT_METHOD["EXTENSION_API"] = "extensionApi";
   INPUT_METHOD["FLOATING_TB"] = "floatingToolbar";
@@ -225,6 +228,9 @@ export let ACTION_SUBJECT = /*#__PURE__*/function (ACTION_SUBJECT) {
   ACTION_SUBJECT["LOOM"] = "loom";
   ACTION_SUBJECT["MULTI_BODIED_EXTENSION"] = "multiBodiedExtension";
   ACTION_SUBJECT["BODIED_EXTENSION"] = "bodiedExtension";
+  ACTION_SUBJECT["DROP_TARGET"] = "dropTarget";
+  ACTION_SUBJECT["DRAG"] = "drag";
+  ACTION_SUBJECT["ELEMENT"] = "element";
   return ACTION_SUBJECT;
 }({});
 export let ACTION_SUBJECT_ID = /*#__PURE__*/function (ACTION_SUBJECT_ID) {
@@ -254,6 +260,8 @@ export let ACTION_SUBJECT_ID = /*#__PURE__*/function (ACTION_SUBJECT_ID) {
   ACTION_SUBJECT_ID["DECISION"] = "decision";
   ACTION_SUBJECT_ID["DIVIDER"] = "divider";
   ACTION_SUBJECT_ID["EDIT_LINK"] = "editLink";
+  ACTION_SUBJECT_ID["ELEMENT_DRAG_HANDLE"] = "elementDragHandle";
+  ACTION_SUBJECT_ID["ELEMENT_DROP_TARGET"] = "elementDropTarget";
   ACTION_SUBJECT_ID["EMBEDS"] = "embeds";
   ACTION_SUBJECT_ID["EMOJI"] = "emoji";
   ACTION_SUBJECT_ID["EXPAND"] = "expand";

package/dist/es2019/extensions/module-helpers.js

@@ -62,8 +62,10 @@ const logError = (msg, ...args) => {
 const toolbarItemToButtonConfig = (toolbarItem, parentKey) => {
   const {
     tooltip,
+    tooltipStyle,
     key,
     label,
+    ariaLabel,
     icon,
     action,
     disabled
@@ -102,7 +104,9 @@ const toolbarItemToButtonConfig = (toolbarItem, parentKey) => {
   }
   return {
     key: itemKey,
+    ariaLabel,
     tooltip,
+    tooltipStyle,
     action,
     disabled,
     ...labelAndIcon

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 = "82.4.0";
+const packageVersion = "82.5.0";
 const sanitiseSentryEvents = (data, _hint) => {
   // Remove URL as it has UGC
   // TODO: Sanitise the URL instead of just removing it

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

@@ -7,7 +7,7 @@ import { createAndFireEvent, withAnalyticsContext, withAnalyticsEvents } from '@
 import { N0, N50A, N60A, N900 } from '@atlaskit/theme/colors';
 import Layer from '../Layer';
 const packageName = "@atlaskit/editor-common";
-const packageVersion = "82.4.0";
+const packageVersion = "82.5.0";
 const halfFocusRing = 1;
 const dropOffset = '0, 8';
 class DropList extends Component {

package/dist/es2019/ui/FloatingToolbar/Button.js

@@ -21,6 +21,7 @@ export default (({
   children,
   className,
   tooltipContent,
+  tooltipStyle,
   testId,
   hideTooltipOnClick = true,
   ariaHasPopup,
@@ -41,6 +42,7 @@ export default (({
   // Only fallback to title for tooltip if title is not shown
   , {
     content: tooltipContent || (iconOnly ? title : undefined),
+    component: tooltipStyle,
     hideTooltipOnClick: hideTooltipOnClick,
     position: "top"
   }, /*#__PURE__*/React.createElement("div", {

package/dist/es2019/ui-color/ColorPalette/Color/index.js

@@ -129,5 +129,10 @@ class ClassComponentColor extends PureComponent {
     }))));
   }
 }
-const Color = getBooleanFF('platform.editor.transparent-diagonal-decorator') ? FunctionalComponentColor : ClassComponentColor;
+const Color = props => {
+  if (getBooleanFF('platform.editor.transparent-diagonal-decorator')) {
+    return jsx(FunctionalComponentColor, props);
+  }
+  return jsx(ClassComponentColor, props);
+};
 export default Color;

package/dist/esm/analytics/types/element-events.js

@@ -0,0 +1 @@
+export {};

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

@@ -9,6 +9,7 @@ export var ACTION = /*#__PURE__*/function (ACTION) {
   ACTION["ACTIVATED"] = "activated";
   ACTION["ADDED"] = "added";
   ACTION["BROWSER_FREEZE"] = "browserFreeze";
+  ACTION["CANCELLED"] = "cancelled";
   ACTION["CAUGHT_DOM_ERROR"] = "caughtDomError";
   ACTION["CHANGED_BACKGROUND_COLOR"] = "changedBackgroundColor";
   ACTION["CHANGED_ICON"] = "changedIcon";
@@ -34,6 +35,7 @@ export var ACTION = /*#__PURE__*/function (ACTION) {
   ACTION["DISMISSED"] = "dismissed";
   ACTION["DISPATCHED_INVALID_TRANSACTION"] = "dispatchedInvalidTransaction";
   ACTION["DISPATCHED_VALID_TRANSACTION"] = "dispatchedValidTransaction";
+  ACTION["DRAGGED"] = "dragged";
   ACTION["EDITED"] = "edited";
   ACTION["EDITOR_CRASHED"] = "unhandledErrorCaught";
   ACTION["EDITOR_CRASHED_ADDITIONAL_INFORMATION"] = "unhandledErrorCaughtAdditionalInfov2";
@@ -148,6 +150,7 @@ export var INPUT_METHOD = /*#__PURE__*/function (INPUT_METHOD) {
   INPUT_METHOD["CONFIG_PANEL"] = "configPanel";
   INPUT_METHOD["CONTEXT_MENU"] = "contextMenu";
   INPUT_METHOD["DRAG_AND_DROP"] = "dragAndDrop";
+  INPUT_METHOD["DRAG"] = "drag";
   INPUT_METHOD["EXTERNAL"] = "external";
   INPUT_METHOD["EXTENSION_API"] = "extensionApi";
   INPUT_METHOD["FLOATING_TB"] = "floatingToolbar";
@@ -225,6 +228,9 @@ export var ACTION_SUBJECT = /*#__PURE__*/function (ACTION_SUBJECT) {
   ACTION_SUBJECT["LOOM"] = "loom";
   ACTION_SUBJECT["MULTI_BODIED_EXTENSION"] = "multiBodiedExtension";
   ACTION_SUBJECT["BODIED_EXTENSION"] = "bodiedExtension";
+  ACTION_SUBJECT["DROP_TARGET"] = "dropTarget";
+  ACTION_SUBJECT["DRAG"] = "drag";
+  ACTION_SUBJECT["ELEMENT"] = "element";
   return ACTION_SUBJECT;
 }({});
 export var ACTION_SUBJECT_ID = /*#__PURE__*/function (ACTION_SUBJECT_ID) {
@@ -254,6 +260,8 @@ export var ACTION_SUBJECT_ID = /*#__PURE__*/function (ACTION_SUBJECT_ID) {
   ACTION_SUBJECT_ID["DECISION"] = "decision";
   ACTION_SUBJECT_ID["DIVIDER"] = "divider";
   ACTION_SUBJECT_ID["EDIT_LINK"] = "editLink";
+  ACTION_SUBJECT_ID["ELEMENT_DRAG_HANDLE"] = "elementDragHandle";
+  ACTION_SUBJECT_ID["ELEMENT_DROP_TARGET"] = "elementDropTarget";
   ACTION_SUBJECT_ID["EMBEDS"] = "embeds";
   ACTION_SUBJECT_ID["EMOJI"] = "emoji";
   ACTION_SUBJECT_ID["EXPAND"] = "expand";

package/dist/esm/extensions/module-helpers.js

@@ -146,8 +146,10 @@ var logError = function logError(msg) {
 };
 var toolbarItemToButtonConfig = function toolbarItemToButtonConfig(toolbarItem, parentKey) {
   var tooltip = toolbarItem.tooltip,
+    tooltipStyle = toolbarItem.tooltipStyle,
     key = toolbarItem.key,
     label = toolbarItem.label,
+    ariaLabel = toolbarItem.ariaLabel,
     icon = toolbarItem.icon,
     action = toolbarItem.action,
     disabled = toolbarItem.disabled;
@@ -185,7 +187,9 @@ var toolbarItemToButtonConfig = function toolbarItemToButtonConfig(toolbarItem,
   }
   return _objectSpread({
     key: itemKey,
+    ariaLabel: ariaLabel,
     tooltip: tooltip,
+    tooltipStyle: tooltipStyle,
     action: action,
     disabled: disabled
   }, labelAndIcon);

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 = "82.4.0";
+var packageVersion = "82.5.0";
 var sanitiseSentryEvents = function sanitiseSentryEvents(data, _hint) {
   // Remove URL as it has UGC
   // TODO: Sanitise the URL instead of just removing it

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

@@ -15,7 +15,7 @@ import { createAndFireEvent, withAnalyticsContext, withAnalyticsEvents } from '@
 import { N0, N50A, N60A, N900 } from '@atlaskit/theme/colors';
 import Layer from '../Layer';
 var packageName = "@atlaskit/editor-common";
-var packageVersion = "82.4.0";
+var packageVersion = "82.5.0";
 var halfFocusRing = 1;
 var dropOffset = '0, 8';
 var DropList = /*#__PURE__*/function (_Component) {

package/dist/esm/ui/FloatingToolbar/Button.js

@@ -27,6 +27,7 @@ export default (function (_ref) {
     children = _ref.children,
     className = _ref.className,
     tooltipContent = _ref.tooltipContent,
+    tooltipStyle = _ref.tooltipStyle,
     testId = _ref.testId,
     _ref$hideTooltipOnCli = _ref.hideTooltipOnClick,
     hideTooltipOnClick = _ref$hideTooltipOnCli === void 0 ? true : _ref$hideTooltipOnCli,
@@ -47,6 +48,7 @@ export default (function (_ref) {
   // Only fallback to title for tooltip if title is not shown
   , {
     content: tooltipContent || (iconOnly ? title : undefined),
+    component: tooltipStyle,
     hideTooltipOnClick: hideTooltipOnClick,
     position: "top"
   }, /*#__PURE__*/React.createElement("div", {

package/dist/esm/ui-color/ColorPalette/Color/index.js

@@ -131,5 +131,10 @@ var ClassComponentColor = /*#__PURE__*/function (_PureComponent) {
   }]);
   return ClassComponentColor;
 }(PureComponent);
-var Color = getBooleanFF('platform.editor.transparent-diagonal-decorator') ? FunctionalComponentColor : ClassComponentColor;
+var Color = function Color(props) {
+  if (getBooleanFF('platform.editor.transparent-diagonal-decorator')) {
+    return jsx(FunctionalComponentColor, props);
+  }
+  return jsx(ClassComponentColor, props);
+};
 export default Color;

package/dist/types/analytics/types/element-events.d.ts

@@ -0,0 +1,10 @@
+import type { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID } from './enums';
+import type { UIAEP } from './utils';
+type ElementAttributes = {
+    nodeDepth: number;
+    nodeType: string;
+};
+type ElementDragAEP = UIAEP<ACTION.DRAGGED, ACTION_SUBJECT.ELEMENT, ACTION_SUBJECT_ID.ELEMENT_DRAG_HANDLE, ElementAttributes, null>;
+type DragCancelledAEP = UIAEP<ACTION.CANCELLED, ACTION_SUBJECT.DRAG, ACTION_SUBJECT_ID.ELEMENT_DRAG_HANDLE, ElementAttributes, null>;
+export type ElementEventPayload = ElementDragAEP | DragCancelledAEP;
+export {};

package/dist/types/analytics/types/enums.d.ts

@@ -8,6 +8,7 @@ export declare enum ACTION {
     ACTIVATED = "activated",
     ADDED = "added",
     BROWSER_FREEZE = "browserFreeze",
+    CANCELLED = "cancelled",
     CAUGHT_DOM_ERROR = "caughtDomError",
     CHANGED_BACKGROUND_COLOR = "changedBackgroundColor",
     CHANGED_ICON = "changedIcon",
@@ -36,6 +37,7 @@ export declare enum ACTION {
     DISMISSED = "dismissed",
     DISPATCHED_INVALID_TRANSACTION = "dispatchedInvalidTransaction",
     DISPATCHED_VALID_TRANSACTION = "dispatchedValidTransaction",
+    DRAGGED = "dragged",
     EDITED = "edited",
     EDITOR_CRASHED = "unhandledErrorCaught",
     EDITOR_CRASHED_ADDITIONAL_INFORMATION = "unhandledErrorCaughtAdditionalInfov2",
@@ -154,6 +156,7 @@ export declare enum INPUT_METHOD {
     CONFIG_PANEL = "configPanel",
     CONTEXT_MENU = "contextMenu",
     DRAG_AND_DROP = "dragAndDrop",
+    DRAG = "drag",
     EXTERNAL = "external",
     EXTENSION_API = "extensionApi",
     FLOATING_TB = "floatingToolbar",
@@ -228,7 +231,10 @@ export declare enum ACTION_SUBJECT {
     TOOLTIP = "tooltip",
     LOOM = "loom",
     MULTI_BODIED_EXTENSION = "multiBodiedExtension",
-    BODIED_EXTENSION = "bodiedExtension"
+    BODIED_EXTENSION = "bodiedExtension",
+    DROP_TARGET = "dropTarget",
+    DRAG = "drag",
+    ELEMENT = "element"
 }
 export declare enum ACTION_SUBJECT_ID {
     ACTION = "action",
@@ -257,6 +263,8 @@ export declare enum ACTION_SUBJECT_ID {
     DECISION = "decision",
     DIVIDER = "divider",
     EDIT_LINK = "editLink",
+    ELEMENT_DRAG_HANDLE = "elementDragHandle",
+    ELEMENT_DROP_TARGET = "elementDropTarget",
     EMBEDS = "embeds",
     EMOJI = "emoji",
     EXPAND = "expand",

package/dist/types/analytics/types/events.d.ts

@@ -8,6 +8,7 @@ import type { ConfigPanelEventPayload } from './config-panel-events';
 import type { CutCopyEventPayload } from './cut-copy-events';
 import type { DateEventPayload } from './date-events';
 import type { ElementBrowserEventPayload } from './element-browser-events';
+import type { ElementEventPayload } from './element-events';
 import type { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, CONTENT_COMPONENT, FLOATING_CONTROLS_TITLE } from './enums';
 import type { ExperimentalEventPayload } from './experimental-events';
 import type { ExtensionEventPayload } from './extension-events';
@@ -37,7 +38,7 @@ export type SimplifiedNode = {
     marks?: string[];
     content?: SimplifiedNode[];
 };
-export type AnalyticsEventPayload<T = void> = AvatarEventPayload | GeneralEventPayload<T> | FormatEventPayload | SubstituteEventPayload | InsertEventPayload | NodeEventPayload | MediaEventPayload | TableEventPayload | PasteEventPayload | CutCopyEventPayload | ErrorEventPayload | ExperimentalEventPayload | FindReplaceEventPayload | DateEventPayload | SelectionEventPayload | ListEventPayload | ConfigPanelEventPayload | ElementBrowserEventPayload | CreateLinkInlineDialogEventPayload | HighlightActionsEventPayload | UnsupportedContentPayload | ExtensionEventPayload | TransactionEventPayload | TypeAheadPayload | UnlinkToolbarAEP | EditLinkToolbarAEP | OpenSettingsToolbarAEP | CustomPanelEventPayload | FeatureExposureAEP | NewCollabSyncUpErrorAEP | UnsupportedContentTooltipPayload | ReferentialityEventPayload | LoomEventPayload | MBEEventPayload | HighlightEventPayload;
+export type AnalyticsEventPayload<T = void> = AvatarEventPayload | GeneralEventPayload<T> | FormatEventPayload | SubstituteEventPayload | InsertEventPayload | NodeEventPayload | MediaEventPayload | TableEventPayload | PasteEventPayload | CutCopyEventPayload | ErrorEventPayload | ExperimentalEventPayload | FindReplaceEventPayload | DateEventPayload | SelectionEventPayload | ListEventPayload | ConfigPanelEventPayload | ElementBrowserEventPayload | CreateLinkInlineDialogEventPayload | HighlightActionsEventPayload | UnsupportedContentPayload | ExtensionEventPayload | TransactionEventPayload | TypeAheadPayload | UnlinkToolbarAEP | EditLinkToolbarAEP | OpenSettingsToolbarAEP | CustomPanelEventPayload | FeatureExposureAEP | NewCollabSyncUpErrorAEP | UnsupportedContentTooltipPayload | ReferentialityEventPayload | LoomEventPayload | MBEEventPayload | HighlightEventPayload | ElementEventPayload;
 type CustomPanelEventPayload = TrackAEP<ACTION.CHANGED_BACKGROUND_COLOR | ACTION.CHANGED_ICON | ACTION.REMOVE_ICON, ACTION_SUBJECT.PANEL, ACTION_SUBJECT_ID.PANEL, {
     previousColor: string;
     newColor: string;

package/dist/types/analytics/types/index.d.ts

@@ -34,3 +34,4 @@ export { SELECTION_POSITION, SELECTION_TYPE } from './utils';
 export type { OperationalAEP } from './utils';
 export type { PluginMethodReport, PluginsReport, NodeCount, PluginPerformanceReportData, } from './performance-report';
 export type { InitialiseFragmentMarksAEP, ConnectedNodesAEP, DisconnectedSourceAEP, DisconnectedTargetAEP, GotConnectionsAEP, UpdatedFragmentMarkNameAEP, UpdatedSourceAEP, UpdatedTargetAEP, } from './referentiality-events';
+export type { ElementEventPayload } from './element-events';

package/dist/types/extensions/types/extension-manifest-toolbar-item.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import type { ADFEntity } from '@atlaskit/adf-utils/types';
 import type { ExtensionAPI } from './extension-handler';
 import type { ExtensionIconModule } from './extension-manifest-common';
@@ -6,7 +7,14 @@ export type ToolbarButton = ExtensionModuleToolbarButtonLabelOrIcon & {
     key: string;
     action: ToolbarButtonAction;
     label: string;
-    tooltip?: string;
+    ariaLabel?: string;
+    tooltip?: React.ReactNode | string;
+    /**
+     * Tooltip Style
+     * This uses the Custom component feature of the Tooltip component.
+     * How to use: https://atlassian.design/components/tooltip/examples#custom-component
+     */
+    tooltipStyle?: React.ForwardRefExoticComponent<any> | React.ComponentType<any>;
     icon?: () => ExtensionIconModule;
     display?: 'icon' | 'label' | 'icon-and-label';
     disabled?: boolean;
@@ -38,7 +46,14 @@ export type StandardNodeContext = {
 export type ExtensionToolbarButton = {
     key: string;
     label?: string;
-    tooltip?: string;
+    ariaLabel?: string;
+    tooltip?: React.ReactNode | string;
+    /**
+     * Tooltip Style
+     * This uses the Custom component feature of the Tooltip component.
+     * How to use: https://atlassian.design/components/tooltip/examples#custom-component
+     */
+    tooltipStyle?: React.ForwardRefExoticComponent<any> | React.ComponentType<any>;
     icon?: () => ExtensionIconModule;
     action: ToolbarButtonAction;
     disabled?: boolean;

package/dist/types/ui/FloatingToolbar/Button.d.ts

@@ -21,11 +21,12 @@ export interface Props {
     children?: React.ReactNode;
     className?: string;
     tooltipContent?: React.ReactNode;
+    tooltipStyle?: React.ForwardRefExoticComponent<any> | React.ComponentType<any>;
     testId?: string;
     hideTooltipOnClick?: boolean;
     tabIndex?: number | null | undefined;
     areaControls?: string;
     isRadioButton?: boolean;
 }
-declare const _default: ({ title, icon, iconAfter, onClick, onKeyDown, onMouseEnter, onMouseLeave, onFocus, onBlur, selected, disabled, href, target, appearance, children, className, tooltipContent, testId, hideTooltipOnClick, ariaHasPopup, tabIndex, areaControls, ariaLabel, isRadioButton, }: Props) => JSX.Element;
+declare const _default: ({ title, icon, iconAfter, onClick, onKeyDown, onMouseEnter, onMouseLeave, onFocus, onBlur, selected, disabled, href, target, appearance, children, className, tooltipContent, tooltipStyle, testId, hideTooltipOnClick, ariaHasPopup, tabIndex, areaControls, ariaLabel, isRadioButton, }: Props) => JSX.Element;
 export default _default;

package/dist/types/ui-color/ColorPalette/Color/index.d.ts

@@ -1,5 +1,5 @@
 /** @jsx jsx */
-import React, { PureComponent, type ReactElement } from 'react';
+import { type ReactElement } from 'react';
 import { jsx } from '@emotion/react';
 export interface Props {
     value: string;
@@ -13,11 +13,5 @@ export interface Props {
     hexToPaletteColor?: (hexColor: string) => string | undefined;
     decorator?: ReactElement;
 }
-declare function FunctionalComponentColor(props: Props): jsx.JSX.Element;
-declare class ClassComponentColor extends PureComponent<Props> {
-    render(): jsx.JSX.Element;
-    onMouseDown: (e: React.MouseEvent<{}>) => void;
-    onClick: (e: React.MouseEvent<{}>) => void;
-}
-declare const Color: typeof ClassComponentColor | typeof FunctionalComponentColor;
+declare const Color: (props: Props) => jsx.JSX.Element;
 export default Color;

package/dist/types-ts4.5/analytics/types/element-events.d.ts

@@ -0,0 +1,10 @@
+import type { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID } from './enums';
+import type { UIAEP } from './utils';
+type ElementAttributes = {
+    nodeDepth: number;
+    nodeType: string;
+};
+type ElementDragAEP = UIAEP<ACTION.DRAGGED, ACTION_SUBJECT.ELEMENT, ACTION_SUBJECT_ID.ELEMENT_DRAG_HANDLE, ElementAttributes, null>;
+type DragCancelledAEP = UIAEP<ACTION.CANCELLED, ACTION_SUBJECT.DRAG, ACTION_SUBJECT_ID.ELEMENT_DRAG_HANDLE, ElementAttributes, null>;
+export type ElementEventPayload = ElementDragAEP | DragCancelledAEP;
+export {};

package/dist/types-ts4.5/analytics/types/enums.d.ts

@@ -8,6 +8,7 @@ export declare enum ACTION {
     ACTIVATED = "activated",
     ADDED = "added",
     BROWSER_FREEZE = "browserFreeze",
+    CANCELLED = "cancelled",
     CAUGHT_DOM_ERROR = "caughtDomError",
     CHANGED_BACKGROUND_COLOR = "changedBackgroundColor",
     CHANGED_ICON = "changedIcon",
@@ -36,6 +37,7 @@ export declare enum ACTION {
     DISMISSED = "dismissed",
     DISPATCHED_INVALID_TRANSACTION = "dispatchedInvalidTransaction",
     DISPATCHED_VALID_TRANSACTION = "dispatchedValidTransaction",
+    DRAGGED = "dragged",
     EDITED = "edited",
     EDITOR_CRASHED = "unhandledErrorCaught",
     EDITOR_CRASHED_ADDITIONAL_INFORMATION = "unhandledErrorCaughtAdditionalInfov2",
@@ -154,6 +156,7 @@ export declare enum INPUT_METHOD {
     CONFIG_PANEL = "configPanel",
     CONTEXT_MENU = "contextMenu",
     DRAG_AND_DROP = "dragAndDrop",
+    DRAG = "drag",
     EXTERNAL = "external",
     EXTENSION_API = "extensionApi",
     FLOATING_TB = "floatingToolbar",
@@ -228,7 +231,10 @@ export declare enum ACTION_SUBJECT {
     TOOLTIP = "tooltip",
     LOOM = "loom",
     MULTI_BODIED_EXTENSION = "multiBodiedExtension",
-    BODIED_EXTENSION = "bodiedExtension"
+    BODIED_EXTENSION = "bodiedExtension",
+    DROP_TARGET = "dropTarget",
+    DRAG = "drag",
+    ELEMENT = "element"
 }
 export declare enum ACTION_SUBJECT_ID {
     ACTION = "action",
@@ -257,6 +263,8 @@ export declare enum ACTION_SUBJECT_ID {
     DECISION = "decision",
     DIVIDER = "divider",
     EDIT_LINK = "editLink",
+    ELEMENT_DRAG_HANDLE = "elementDragHandle",
+    ELEMENT_DROP_TARGET = "elementDropTarget",
     EMBEDS = "embeds",
     EMOJI = "emoji",
     EXPAND = "expand",

package/dist/types-ts4.5/analytics/types/events.d.ts

@@ -8,6 +8,7 @@ import type { ConfigPanelEventPayload } from './config-panel-events';
 import type { CutCopyEventPayload } from './cut-copy-events';
 import type { DateEventPayload } from './date-events';
 import type { ElementBrowserEventPayload } from './element-browser-events';
+import type { ElementEventPayload } from './element-events';
 import type { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, CONTENT_COMPONENT, FLOATING_CONTROLS_TITLE } from './enums';
 import type { ExperimentalEventPayload } from './experimental-events';
 import type { ExtensionEventPayload } from './extension-events';
@@ -37,7 +38,7 @@ export type SimplifiedNode = {
     marks?: string[];
     content?: SimplifiedNode[];
 };
-export type AnalyticsEventPayload<T = void> = AvatarEventPayload | GeneralEventPayload<T> | FormatEventPayload | SubstituteEventPayload | InsertEventPayload | NodeEventPayload | MediaEventPayload | TableEventPayload | PasteEventPayload | CutCopyEventPayload | ErrorEventPayload | ExperimentalEventPayload | FindReplaceEventPayload | DateEventPayload | SelectionEventPayload | ListEventPayload | ConfigPanelEventPayload | ElementBrowserEventPayload | CreateLinkInlineDialogEventPayload | HighlightActionsEventPayload | UnsupportedContentPayload | ExtensionEventPayload | TransactionEventPayload | TypeAheadPayload | UnlinkToolbarAEP | EditLinkToolbarAEP | OpenSettingsToolbarAEP | CustomPanelEventPayload | FeatureExposureAEP | NewCollabSyncUpErrorAEP | UnsupportedContentTooltipPayload | ReferentialityEventPayload | LoomEventPayload | MBEEventPayload | HighlightEventPayload;
+export type AnalyticsEventPayload<T = void> = AvatarEventPayload | GeneralEventPayload<T> | FormatEventPayload | SubstituteEventPayload | InsertEventPayload | NodeEventPayload | MediaEventPayload | TableEventPayload | PasteEventPayload | CutCopyEventPayload | ErrorEventPayload | ExperimentalEventPayload | FindReplaceEventPayload | DateEventPayload | SelectionEventPayload | ListEventPayload | ConfigPanelEventPayload | ElementBrowserEventPayload | CreateLinkInlineDialogEventPayload | HighlightActionsEventPayload | UnsupportedContentPayload | ExtensionEventPayload | TransactionEventPayload | TypeAheadPayload | UnlinkToolbarAEP | EditLinkToolbarAEP | OpenSettingsToolbarAEP | CustomPanelEventPayload | FeatureExposureAEP | NewCollabSyncUpErrorAEP | UnsupportedContentTooltipPayload | ReferentialityEventPayload | LoomEventPayload | MBEEventPayload | HighlightEventPayload | ElementEventPayload;
 type CustomPanelEventPayload = TrackAEP<ACTION.CHANGED_BACKGROUND_COLOR | ACTION.CHANGED_ICON | ACTION.REMOVE_ICON, ACTION_SUBJECT.PANEL, ACTION_SUBJECT_ID.PANEL, {
     previousColor: string;
     newColor: string;

package/dist/types-ts4.5/analytics/types/index.d.ts

@@ -34,3 +34,4 @@ export { SELECTION_POSITION, SELECTION_TYPE } from './utils';
 export type { OperationalAEP } from './utils';
 export type { PluginMethodReport, PluginsReport, NodeCount, PluginPerformanceReportData, } from './performance-report';
 export type { InitialiseFragmentMarksAEP, ConnectedNodesAEP, DisconnectedSourceAEP, DisconnectedTargetAEP, GotConnectionsAEP, UpdatedFragmentMarkNameAEP, UpdatedSourceAEP, UpdatedTargetAEP, } from './referentiality-events';
+export type { ElementEventPayload } from './element-events';

package/dist/types-ts4.5/extensions/types/extension-manifest-toolbar-item.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import type { ADFEntity } from '@atlaskit/adf-utils/types';
 import type { ExtensionAPI } from './extension-handler';
 import type { ExtensionIconModule } from './extension-manifest-common';
@@ -6,7 +7,14 @@ export type ToolbarButton = ExtensionModuleToolbarButtonLabelOrIcon & {
     key: string;
     action: ToolbarButtonAction;
     label: string;
-    tooltip?: string;
+    ariaLabel?: string;
+    tooltip?: React.ReactNode | string;
+    /**
+     * Tooltip Style
+     * This uses the Custom component feature of the Tooltip component.
+     * How to use: https://atlassian.design/components/tooltip/examples#custom-component
+     */
+    tooltipStyle?: React.ForwardRefExoticComponent<any> | React.ComponentType<any>;
     icon?: () => ExtensionIconModule;
     display?: 'icon' | 'label' | 'icon-and-label';
     disabled?: boolean;
@@ -38,7 +46,14 @@ export type StandardNodeContext = {
 export type ExtensionToolbarButton = {
     key: string;
     label?: string;
-    tooltip?: string;
+    ariaLabel?: string;
+    tooltip?: React.ReactNode | string;
+    /**
+     * Tooltip Style
+     * This uses the Custom component feature of the Tooltip component.
+     * How to use: https://atlassian.design/components/tooltip/examples#custom-component
+     */
+    tooltipStyle?: React.ForwardRefExoticComponent<any> | React.ComponentType<any>;
     icon?: () => ExtensionIconModule;
     action: ToolbarButtonAction;
     disabled?: boolean;

package/dist/types-ts4.5/ui/FloatingToolbar/Button.d.ts

@@ -21,11 +21,12 @@ export interface Props {
     children?: React.ReactNode;
     className?: string;
     tooltipContent?: React.ReactNode;
+    tooltipStyle?: React.ForwardRefExoticComponent<any> | React.ComponentType<any>;
     testId?: string;
     hideTooltipOnClick?: boolean;
     tabIndex?: number | null | undefined;
     areaControls?: string;
     isRadioButton?: boolean;
 }
-declare const _default: ({ title, icon, iconAfter, onClick, onKeyDown, onMouseEnter, onMouseLeave, onFocus, onBlur, selected, disabled, href, target, appearance, children, className, tooltipContent, testId, hideTooltipOnClick, ariaHasPopup, tabIndex, areaControls, ariaLabel, isRadioButton, }: Props) => JSX.Element;
+declare const _default: ({ title, icon, iconAfter, onClick, onKeyDown, onMouseEnter, onMouseLeave, onFocus, onBlur, selected, disabled, href, target, appearance, children, className, tooltipContent, tooltipStyle, testId, hideTooltipOnClick, ariaHasPopup, tabIndex, areaControls, ariaLabel, isRadioButton, }: Props) => JSX.Element;
 export default _default;

package/dist/types-ts4.5/ui-color/ColorPalette/Color/index.d.ts

@@ -1,5 +1,5 @@
 /** @jsx jsx */
-import React, { PureComponent, type ReactElement } from 'react';
+import { type ReactElement } from 'react';
 import { jsx } from '@emotion/react';
 export interface Props {
     value: string;
@@ -13,11 +13,5 @@ export interface Props {
     hexToPaletteColor?: (hexColor: string) => string | undefined;
     decorator?: ReactElement;
 }
-declare function FunctionalComponentColor(props: Props): jsx.JSX.Element;
-declare class ClassComponentColor extends PureComponent<Props> {
-    render(): jsx.JSX.Element;
-    onMouseDown: (e: React.MouseEvent<{}>) => void;
-    onClick: (e: React.MouseEvent<{}>) => void;
-}
-declare const Color: typeof ClassComponentColor | typeof FunctionalComponentColor;
+declare const Color: (props: Props) => jsx.JSX.Element;
 export default Color;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/editor-common",
-  "version": "82.4.0",
+  "version": "82.5.0",
   "description": "A package that contains common classes and components for editor and renderer",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"