@atlaskit/editor-common 74.3.1 → 74.5.0

package/CHANGELOG.md

@@ -1,5 +1,22 @@
 # @atlaskit/editor-common
 
+## 74.5.0
+
+### Minor Changes
+
+- [`7cd4abcdc0d`](https://bitbucket.org/atlassian/atlassian-frontend/commits/7cd4abcdc0d) - Fix workaround in `editor-plugin-width`. This involved removing `WidthEmitter` in `editor-core`, removing `containerWidth` from `WidthPluginState`. This change also introduces `usePluginHook` for an `EditorPlugin` - this enables a react hook to be mounted for plugins (in all appearances).
+
+## 74.4.0
+
+### Minor Changes
+
+- [`d9fe34b3f2b`](https://bitbucket.org/atlassian/atlassian-frontend/commits/d9fe34b3f2b) - [ux] The ResizerNext component now supports a new property handleAlignmentMethod which defaults to "sticky". This means the resizer handles wil stick to the top/bottom bounds of the browser viewport if the component extends beyond and the user scrolls down. An alternative "center" value can be set which means the handles will just center to their content and not stick.
+- [`f3d2c08d61b`](https://bitbucket.org/atlassian/atlassian-frontend/commits/f3d2c08d61b) - Adds new datasource attribute to existing blockCard node
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 74.3.1
 
 ### Patch Changes

package/dist/cjs/hooks/useSharedPluginState.js

@@ -28,6 +28,16 @@ function mapValues(object, mapFunction) {
   }, {});
 }
 
+// When we use the `useSharedPluginState` example: `useSharedPluginState(api, ['width'])`
+// it will re-render every time the component re-renders as the array "['width']" is seen as an update.
+// This hook is used to prevent re-renders due to this.
+function useStaticPlugins(plugins) {
+  // eslint-disable-next-line react-hooks/exhaustive-deps
+  return (0, _react.useMemo)(function () {
+    return plugins;
+  }, []);
+}
+
 /**
  *
  * Used to return the current plugin state of
@@ -61,12 +71,14 @@ function mapValues(object, mapFunction) {
  * the values are the shared state exposed by that plugin.
  */
 function useSharedPluginState(injectionApi, plugins) {
+  var pluginNames = useStaticPlugins(plugins);
+
   // Create a memoized object containing the named plugins
   var namedExternalPlugins = (0, _react.useMemo)(function () {
-    return plugins.reduce(function (acc, pluginName) {
+    return pluginNames.reduce(function (acc, pluginName) {
       return _objectSpread(_objectSpread({}, acc), {}, (0, _defineProperty2.default)({}, "".concat(pluginName, "State"), injectionApi === null || injectionApi === void 0 ? void 0 : injectionApi.dependencies[pluginName]));
     }, {});
-  }, [injectionApi === null || injectionApi === void 0 ? void 0 : injectionApi.dependencies, plugins]);
+  }, [injectionApi === null || injectionApi === void 0 ? void 0 : injectionApi.dependencies, pluginNames]);
   return useSharedPluginStateInternal(namedExternalPlugins);
 }
 function useSharedPluginStateInternal(externalPlugins) {
@@ -74,10 +86,10 @@ function useSharedPluginStateInternal(externalPlugins) {
       return value === null || value === void 0 ? void 0 : value.sharedState.currentState();
     })),
     _useState2 = (0, _slicedToArray2.default)(_useState, 2),
-    state = _useState2[0],
-    setState = _useState2[1];
-  (0, _react.useEffect)(function () {
-    var unsubscribeListeners = Object.entries(externalPlugins).map(function (_ref3) {
+    pluginStates = _useState2[0],
+    setPluginState = _useState2[1];
+  (0, _react.useLayoutEffect)(function () {
+    var unsubs = Object.entries(externalPlugins).map(function (_ref3) {
       var _ref4 = (0, _slicedToArray2.default)(_ref3, 2),
         pluginKey = _ref4[0],
         externalPlugin = _ref4[1];
@@ -87,16 +99,19 @@ function useSharedPluginStateInternal(externalPlugins) {
         if (prevSharedState === nextSharedState) {
           return;
         }
-        setState(function (state) {
-          return _objectSpread(_objectSpread({}, state), {}, (0, _defineProperty2.default)({}, pluginKey, nextSharedState));
+        setPluginState(function (currentPluginStates) {
+          return _objectSpread(_objectSpread({}, currentPluginStates), {}, (0, _defineProperty2.default)({}, pluginKey, nextSharedState));
         });
       });
     });
     return function () {
-      unsubscribeListeners.forEach(function (cb) {
+      unsubs.forEach(function (cb) {
         return cb === null || cb === void 0 ? void 0 : cb();
       });
     };
+    // Do not re-render due to state changes, we only need to check this when
+    // setting up the initial subscription.
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [externalPlugins]);
-  return state;
+  return pluginStates;
 }

package/dist/cjs/monitoring/error.js

@@ -16,7 +16,7 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 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 = "74.3.1";
+var packageVersion = "74.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/styles/shared/resizer.js

@@ -4,7 +4,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.resizerStyles = exports.resizerItemClassName = exports.resizerHandlerSmallClassName = exports.resizerHandlerMediumClassName = exports.resizerHandlerLargeClassName = exports.resizerHandlerClassName = exports.resizerHandleZIndex = exports.resizerHandleRightClassName = exports.resizerHandlePadding = exports.resizerHandleLeftClassName = void 0;
+exports.resizerStyles = exports.resizerItemClassName = exports.resizerHandlerSmallClassName = exports.resizerHandlerMediumClassName = exports.resizerHandlerLargeClassName = exports.resizerHandlerClassName = exports.resizerHandleZIndex = exports.resizerHandleStickyClassName = exports.resizerHandleRightClassName = exports.resizerHandlePadding = exports.resizerHandleLeftClassName = void 0;
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
 var _react = require("@emotion/react");
 var _colors = require("@atlaskit/theme/colors");
@@ -19,9 +19,11 @@ exports.resizerItemClassName = resizerItemClassName;
 var resizerHandleRightClassName = 'resizer-handle-right';
 exports.resizerHandleRightClassName = resizerHandleRightClassName;
 var resizerHandleLeftClassName = 'resizer-handle-left';
+exports.resizerHandleLeftClassName = resizerHandleLeftClassName;
+var resizerHandleStickyClassName = 'resizer-handle-sticky';
 
 // akEditorSelectedNodeClassName from '@atlaskit/editor-shared-styles';
-exports.resizerHandleLeftClassName = resizerHandleLeftClassName;
+exports.resizerHandleStickyClassName = resizerHandleStickyClassName;
 var akEditorSelectedNodeClassName = 'ak-editor-selected-node';
 var resizerHandlePadding = 13;
 exports.resizerHandlePadding = resizerHandlePadding;
@@ -39,5 +41,5 @@ var resizerHandlerClassName = {
   large: resizerHandlerLargeClassName
 };
 exports.resizerHandlerClassName = resizerHandlerClassName;
-var resizerStyles = (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  .", " {\n    background: ", ";\n  }\n\n  .", ", .", " {\n    display: flex;\n    flex-direction: column;\n\n    /* vertical align */\n    justify-content: center;\n  }\n\n  .", " {\n    align-items: flex-end;\n    /* padding-right: 12px; */\n    /* margin-right: -", "px; */\n  }\n\n  .", " {\n    align-items: flex-start;\n    /* padding-left: 12px; */\n    /* margin-left: -", "px; */\n  }\n\n  .", "::after,\n    .", "::after {\n    content: ' ';\n    display: flex;\n    width: 3px;\n    height: 64px;\n\n    border-radius: 6px;\n  }\n\n  .", ":hover\n    .", "::after,\n    .", ":hover\n    .", "::after {\n    background: ", ";\n  }\n\n  .", "\n    .", "::after,\n    .", "\n    .", "::after,\n    .", "\n    .", ":hover::after,\n    .", "\n    .", ":hover::after,\n    .", ".is-resizing\n    .", "::after,\n    .", ".is-resizing\n    .", "::after {\n    background: ", ";\n  }\n\n  .", ".", "::after,\n    .", ".", "::after {\n    height: 64px;\n  }\n\n  .", ".", "::after,\n    .", ".", "::after {\n    height: 43px;\n  }\n\n  .", ".", "::after,\n    .", ".", "::after {\n    height: 96px;\n  }\n"])), resizerItemClassName, "var(--ds-border-focused, ".concat(_colors.B200, ")"), resizerHandleRightClassName, resizerHandleLeftClassName, resizerHandleRightClassName, resizerHandlePadding, resizerHandleLeftClassName, resizerHandlePadding, resizerHandleRightClassName, resizerHandleLeftClassName, resizerItemClassName, resizerHandleLeftClassName, resizerItemClassName, resizerHandleRightClassName, "var(--ds-border, ".concat(_colors.N60, ")"), akEditorSelectedNodeClassName, resizerHandleRightClassName, akEditorSelectedNodeClassName, resizerHandleLeftClassName, resizerItemClassName, resizerHandleRightClassName, resizerItemClassName, resizerHandleLeftClassName, resizerItemClassName, resizerHandleRightClassName, resizerItemClassName, resizerHandleLeftClassName, "var(--ds-border-focused, ".concat(_colors.B200, ")"), resizerHandleRightClassName, resizerHandlerClassName.medium, resizerHandleLeftClassName, resizerHandlerClassName.medium, resizerHandleRightClassName, resizerHandlerClassName.small, resizerHandleLeftClassName, resizerHandlerClassName.small, resizerHandleRightClassName, resizerHandlerClassName.large, resizerHandleLeftClassName, resizerHandlerClassName.large);
+var resizerStyles = (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  .", " {\n    background: ", ";\n  }\n\n  .", ", .", " {\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n  }\n\n  .", " {\n    align-items: flex-end;\n  }\n\n  .", " {\n    align-items: flex-start;\n  }\n\n  .", "::after,\n    .", "::after {\n    content: ' ';\n    display: flex;\n    width: 3px;\n    height: 64px;\n\n    border-radius: 6px;\n  }\n\n  .", ":hover\n    .", "::after,\n    .", ":hover\n    .", "::after {\n    background: ", ";\n  }\n\n  .", "\n    .", "::after,\n    .", "\n    .", "::after,\n    .", "\n    .", ":hover::after,\n    .", "\n    .", ":hover::after,\n    .", ".is-resizing\n    .", "::after,\n    .", ".is-resizing\n    .", "::after {\n    background: ", ";\n  }\n\n  .", ".", "::after,\n    .", ".", "::after {\n    height: 64px;\n  }\n\n  .", ".", "::after,\n    .", ".", "::after {\n    height: 43px;\n  }\n\n  .", ".", "::after,\n    .", ".", "::after {\n    height: 96px;\n  }\n\n  .", ".", "::after,\n    .", ".", "::after {\n    position: sticky;\n    top: 10px;\n    bottom: 10px;\n  }\n"])), resizerItemClassName, "var(--ds-border-focused, ".concat(_colors.B200, ")"), resizerHandleRightClassName, resizerHandleLeftClassName, resizerHandleRightClassName, resizerHandleLeftClassName, resizerHandleRightClassName, resizerHandleLeftClassName, resizerItemClassName, resizerHandleLeftClassName, resizerItemClassName, resizerHandleRightClassName, "var(--ds-border, ".concat(_colors.N60, ")"), akEditorSelectedNodeClassName, resizerHandleRightClassName, akEditorSelectedNodeClassName, resizerHandleLeftClassName, resizerItemClassName, resizerHandleRightClassName, resizerItemClassName, resizerHandleLeftClassName, resizerItemClassName, resizerHandleRightClassName, resizerItemClassName, resizerHandleLeftClassName, "var(--ds-border-focused, ".concat(_colors.B200, ")"), resizerHandleRightClassName, resizerHandlerClassName.medium, resizerHandleLeftClassName, resizerHandlerClassName.medium, resizerHandleRightClassName, resizerHandlerClassName.small, resizerHandleLeftClassName, resizerHandlerClassName.small, resizerHandleRightClassName, resizerHandlerClassName.large, resizerHandleLeftClassName, resizerHandlerClassName.large, resizerHandleRightClassName, resizerHandleStickyClassName, resizerHandleLeftClassName, resizerHandleStickyClassName);
 exports.resizerStyles = resizerStyles;

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

@@ -24,7 +24,7 @@ var _templateObject, _templateObject2, _templateObject3;
 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() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } } /** @jsx jsx */
 var packageName = "@atlaskit/editor-common";
-var packageVersion = "74.3.1";
+var packageVersion = "74.5.0";
 var halfFocusRing = 1;
 var dropOffset = '0, 8';
 var DropList = /*#__PURE__*/function (_Component) {

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

@@ -5,18 +5,21 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = ResizerNext;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = _interopRequireDefault(require("react"));
-var _classnames = _interopRequireDefault(require("classnames"));
+var _classnames3 = _interopRequireDefault(require("classnames"));
 var _reResizable = require("re-resizable");
 var _resizer = require("../../styles/shared/resizer");
-var _utils = require("./utils");
 function ResizerNext(props) {
+  var _classnames, _classnames2;
   var resizable = _react.default.useRef(null);
   var handleResize = props.handleResize,
     handleResizeStart = props.handleResizeStart,
     handleResizeStop = props.handleResizeStop,
     _props$handlerHeightS = props.handlerHeightSize,
-    handlerHeightSize = _props$handlerHeightS === void 0 ? 'medium' : _props$handlerHeightS;
+    handlerHeightSize = _props$handlerHeightS === void 0 ? 'medium' : _props$handlerHeightS,
+    _props$handleAlignmen = props.handleAlignmentMethod,
+    handleAlignmentMethod = _props$handleAlignmen === void 0 ? 'center' : _props$handleAlignmen;
   var onResizeStart = _react.default.useCallback(function (event) {
     // prevent creating a drag event on Firefox
     event.preventDefault();
@@ -48,22 +51,10 @@ function ResizerNext(props) {
     };
     handleResizeStop(originalState, delta);
   }, [handleResizeStop]);
-  var handles = {};
-  if (props.handleClassName) {
-    _utils.handleSides.forEach(function (side) {
-      handles[side] = "".concat(props.handleClassName, "-").concat(side);
-    });
-  } else {
-    handles = {
-      left: _resizer.resizerHandleLeftClassName,
-      right: _resizer.resizerHandleRightClassName
-    };
-  }
-
-  // add handler height size classname to handleClasses
-  Object.keys(handles).forEach(function (key) {
-    handles[key] = (0, _classnames.default)(handles[key], _resizer.resizerHandlerClassName[handlerHeightSize]);
-  });
+  var handles = {
+    left: (0, _classnames3.default)((_classnames = {}, (0, _defineProperty2.default)(_classnames, "".concat(props.handleClassName, "-left"), !!props.handleClassName), (0, _defineProperty2.default)(_classnames, _resizer.resizerHandleLeftClassName, !props.handleClassName), (0, _defineProperty2.default)(_classnames, _resizer.resizerHandlerClassName[handlerHeightSize], true), (0, _defineProperty2.default)(_classnames, _resizer.resizerHandleStickyClassName, handleAlignmentMethod === 'sticky'), _classnames)),
+    right: (0, _classnames3.default)((_classnames2 = {}, (0, _defineProperty2.default)(_classnames2, "".concat(props.handleClassName, "-right"), !!props.handleClassName), (0, _defineProperty2.default)(_classnames2, _resizer.resizerHandleRightClassName, !props.handleClassName), (0, _defineProperty2.default)(_classnames2, _resizer.resizerHandlerClassName[handlerHeightSize], true), (0, _defineProperty2.default)(_classnames2, _resizer.resizerHandleStickyClassName, handleAlignmentMethod === 'sticky'), _classnames2))
+  };
   var innerPadding = props.innerPadding || _resizer.resizerHandlePadding;
   var handleStyles = {
     left: {
@@ -79,7 +70,7 @@ function ResizerNext(props) {
       pointerEvents: 'auto'
     }
   };
-  var className = (0, _classnames.default)(props.className, _resizer.resizerItemClassName);
+  var className = (0, _classnames3.default)(props.className, _resizer.resizerItemClassName);
   return /*#__PURE__*/_react.default.createElement(_reResizable.Resizable, {
     ref: resizable,
     size: {

package/dist/cjs/utils/validator.js

@@ -299,7 +299,7 @@ var getValidNode = function getValidNode(originalNode) {
       case 'inlineCard':
       case 'blockCard':
         {
-          if (attrs && (attrs.url && (0, _adfSchema.isSafeUrl)(attrs.url) || attrs.data && attrs.data.url && (0, _adfSchema.isSafeUrl)(attrs.data.url))) {
+          if (attrs && (attrs.datasource && !attrs.url || attrs.url && (0, _adfSchema.isSafeUrl)(attrs.url) || attrs.data && attrs.data.url && (0, _adfSchema.isSafeUrl)(attrs.data.url))) {
             return {
               type: type,
               attrs: attrs

package/dist/cjs/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/editor-common",
-	"version": "74.3.1",
+	"version": "74.5.0",
 	"sideEffects": false
 }

package/dist/es2019/hooks/useSharedPluginState.js

@@ -1,4 +1,4 @@
-import { useEffect, useMemo, useState } from 'react';
+import { useLayoutEffect, useMemo, useState } from 'react';
 /**
  *
  * Directly map object values
@@ -15,6 +15,14 @@ function mapValues(object, mapFunction) {
   }), {});
 }
 
+// When we use the `useSharedPluginState` example: `useSharedPluginState(api, ['width'])`
+// it will re-render every time the component re-renders as the array "['width']" is seen as an update.
+// This hook is used to prevent re-renders due to this.
+function useStaticPlugins(plugins) {
+  // eslint-disable-next-line react-hooks/exhaustive-deps
+  return useMemo(() => plugins, []);
+}
+
 /**
  *
  * Used to return the current plugin state of
@@ -48,31 +56,38 @@ function mapValues(object, mapFunction) {
  * the values are the shared state exposed by that plugin.
  */
 export function useSharedPluginState(injectionApi, plugins) {
+  const pluginNames = useStaticPlugins(plugins);
+
   // Create a memoized object containing the named plugins
-  const namedExternalPlugins = useMemo(() => plugins.reduce((acc, pluginName) => ({
+  const namedExternalPlugins = useMemo(() => pluginNames.reduce((acc, pluginName) => ({
     ...acc,
     [`${pluginName}State`]: injectionApi === null || injectionApi === void 0 ? void 0 : injectionApi.dependencies[pluginName]
-  }), {}), [injectionApi === null || injectionApi === void 0 ? void 0 : injectionApi.dependencies, plugins]);
+  }), {}), [injectionApi === null || injectionApi === void 0 ? void 0 : injectionApi.dependencies, pluginNames]);
   return useSharedPluginStateInternal(namedExternalPlugins);
 }
 function useSharedPluginStateInternal(externalPlugins) {
-  const [state, setState] = useState(mapValues(externalPlugins, value => value === null || value === void 0 ? void 0 : value.sharedState.currentState()));
-  useEffect(() => {
-    const unsubscribeListeners = Object.entries(externalPlugins).map(([pluginKey, externalPlugin]) => externalPlugin === null || externalPlugin === void 0 ? void 0 : externalPlugin.sharedState.onChange(({
-      nextSharedState,
-      prevSharedState
-    }) => {
-      if (prevSharedState === nextSharedState) {
-        return;
-      }
-      setState(state => ({
-        ...state,
-        [pluginKey]: nextSharedState
-      }));
-    }));
+  const [pluginStates, setPluginState] = useState(mapValues(externalPlugins, value => value === null || value === void 0 ? void 0 : value.sharedState.currentState()));
+  useLayoutEffect(() => {
+    const unsubs = Object.entries(externalPlugins).map(([pluginKey, externalPlugin]) => {
+      return externalPlugin === null || externalPlugin === void 0 ? void 0 : externalPlugin.sharedState.onChange(({
+        nextSharedState,
+        prevSharedState
+      }) => {
+        if (prevSharedState === nextSharedState) {
+          return;
+        }
+        setPluginState(currentPluginStates => ({
+          ...currentPluginStates,
+          [pluginKey]: nextSharedState
+        }));
+      });
+    });
     return () => {
-      unsubscribeListeners.forEach(cb => cb === null || cb === void 0 ? void 0 : cb());
+      unsubs.forEach(cb => cb === null || cb === void 0 ? void 0 : cb());
     };
+    // Do not re-render due to state changes, we only need to check this when
+    // setting up the initial subscription.
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [externalPlugins]);
-  return state;
+  return pluginStates;
 }

package/dist/es2019/monitoring/error.js

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

package/dist/es2019/styles/shared/resizer.js

@@ -8,6 +8,7 @@ import { B200, N60 } from '@atlaskit/theme/colors';
 export const resizerItemClassName = 'resizer-item';
 export const resizerHandleRightClassName = 'resizer-handle-right';
 export const resizerHandleLeftClassName = 'resizer-handle-left';
+export const resizerHandleStickyClassName = 'resizer-handle-sticky';
 
 // akEditorSelectedNodeClassName from '@atlaskit/editor-shared-styles';
 const akEditorSelectedNodeClassName = 'ak-editor-selected-node';
@@ -29,21 +30,15 @@ export const resizerStyles = css`
   .${resizerHandleRightClassName}, .${resizerHandleLeftClassName} {
     display: flex;
     flex-direction: column;
-
-    /* vertical align */
     justify-content: center;
   }
 
   .${resizerHandleRightClassName} {
     align-items: flex-end;
-    /* padding-right: 12px; */
-    /* margin-right: -${resizerHandlePadding}px; */
   }
 
   .${resizerHandleLeftClassName} {
     align-items: flex-start;
-    /* padding-left: 12px; */
-    /* margin-left: -${resizerHandlePadding}px; */
   }
 
   .${resizerHandleRightClassName}::after,
@@ -92,4 +87,11 @@ export const resizerStyles = css`
     .${resizerHandleLeftClassName}.${resizerHandlerClassName.large}::after {
     height: 96px;
   }
+
+  .${resizerHandleRightClassName}.${resizerHandleStickyClassName}::after,
+    .${resizerHandleLeftClassName}.${resizerHandleStickyClassName}::after {
+    position: sticky;
+    top: 10px;
+    bottom: 10px;
+  }
 `;

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

@@ -8,7 +8,7 @@ import { themed } from '@atlaskit/theme/components';
 import { borderRadius } from '@atlaskit/theme/constants';
 import Layer from '../Layer';
 const packageName = "@atlaskit/editor-common";
-const packageVersion = "74.3.1";
+const packageVersion = "74.5.0";
 const halfFocusRing = 1;
 const dropOffset = '0, 8';
 class DropList extends Component {

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

@@ -1,15 +1,15 @@
 import React from 'react';
 import classnames from 'classnames';
 import { Resizable } from 're-resizable';
-import { resizerHandleLeftClassName, resizerHandlePadding, resizerHandlerClassName, resizerHandleRightClassName, resizerHandleZIndex, resizerItemClassName } from '../../styles/shared/resizer';
-import { handleSides } from './utils';
+import { resizerHandleLeftClassName, resizerHandlePadding, resizerHandlerClassName, resizerHandleRightClassName, resizerHandleStickyClassName, resizerHandleZIndex, resizerItemClassName } from '../../styles/shared/resizer';
 export default function ResizerNext(props) {
   const resizable = React.useRef(null);
   const {
     handleResize,
     handleResizeStart,
     handleResizeStop,
-    handlerHeightSize = 'medium'
+    handlerHeightSize = 'medium',
+    handleAlignmentMethod = 'center'
   } = props;
   const onResizeStart = React.useCallback(event => {
     // prevent creating a drag event on Firefox
@@ -42,22 +42,20 @@ export default function ResizerNext(props) {
     };
     handleResizeStop(originalState, delta);
   }, [handleResizeStop]);
-  let handles = {};
-  if (props.handleClassName) {
-    handleSides.forEach(side => {
-      handles[side] = `${props.handleClassName}-${side}`;
-    });
-  } else {
-    handles = {
-      left: resizerHandleLeftClassName,
-      right: resizerHandleRightClassName
-    };
-  }
-
-  // add handler height size classname to handleClasses
-  Object.keys(handles).forEach(key => {
-    handles[key] = classnames(handles[key], resizerHandlerClassName[handlerHeightSize]);
-  });
+  const handles = {
+    left: classnames({
+      [`${props.handleClassName}-left`]: !!props.handleClassName,
+      [resizerHandleLeftClassName]: !props.handleClassName,
+      [resizerHandlerClassName[handlerHeightSize]]: true,
+      [resizerHandleStickyClassName]: handleAlignmentMethod === 'sticky'
+    }),
+    right: classnames({
+      [`${props.handleClassName}-right`]: !!props.handleClassName,
+      [resizerHandleRightClassName]: !props.handleClassName,
+      [resizerHandlerClassName[handlerHeightSize]]: true,
+      [resizerHandleStickyClassName]: handleAlignmentMethod === 'sticky'
+    })
+  };
   const innerPadding = props.innerPadding || resizerHandlePadding;
   const handleStyles = {
     left: {

package/dist/es2019/utils/validator.js

@@ -273,7 +273,7 @@ export const getValidNode = (originalNode, schema = defaultSchema, adfStage = 'f
       case 'inlineCard':
       case 'blockCard':
         {
-          if (attrs && (attrs.url && isSafeUrl(attrs.url) || attrs.data && attrs.data.url && isSafeUrl(attrs.data.url))) {
+          if (attrs && (attrs.datasource && !attrs.url || attrs.url && isSafeUrl(attrs.url) || attrs.data && attrs.data.url && isSafeUrl(attrs.data.url))) {
             return {
               type,
               attrs

package/dist/es2019/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/editor-common",
-	"version": "74.3.1",
+	"version": "74.5.0",
 	"sideEffects": false
 }

package/dist/esm/hooks/useSharedPluginState.js

@@ -2,7 +2,7 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-import { useEffect, useMemo, useState } from 'react';
+import { useLayoutEffect, useMemo, useState } from 'react';
 /**
  *
  * Directly map object values
@@ -21,6 +21,16 @@ function mapValues(object, mapFunction) {
   }, {});
 }
 
+// When we use the `useSharedPluginState` example: `useSharedPluginState(api, ['width'])`
+// it will re-render every time the component re-renders as the array "['width']" is seen as an update.
+// This hook is used to prevent re-renders due to this.
+function useStaticPlugins(plugins) {
+  // eslint-disable-next-line react-hooks/exhaustive-deps
+  return useMemo(function () {
+    return plugins;
+  }, []);
+}
+
 /**
  *
  * Used to return the current plugin state of
@@ -54,12 +64,14 @@ function mapValues(object, mapFunction) {
  * the values are the shared state exposed by that plugin.
  */
 export function useSharedPluginState(injectionApi, plugins) {
+  var pluginNames = useStaticPlugins(plugins);
+
   // Create a memoized object containing the named plugins
   var namedExternalPlugins = useMemo(function () {
-    return plugins.reduce(function (acc, pluginName) {
+    return pluginNames.reduce(function (acc, pluginName) {
       return _objectSpread(_objectSpread({}, acc), {}, _defineProperty({}, "".concat(pluginName, "State"), injectionApi === null || injectionApi === void 0 ? void 0 : injectionApi.dependencies[pluginName]));
     }, {});
-  }, [injectionApi === null || injectionApi === void 0 ? void 0 : injectionApi.dependencies, plugins]);
+  }, [injectionApi === null || injectionApi === void 0 ? void 0 : injectionApi.dependencies, pluginNames]);
   return useSharedPluginStateInternal(namedExternalPlugins);
 }
 function useSharedPluginStateInternal(externalPlugins) {
@@ -67,10 +79,10 @@ function useSharedPluginStateInternal(externalPlugins) {
       return value === null || value === void 0 ? void 0 : value.sharedState.currentState();
     })),
     _useState2 = _slicedToArray(_useState, 2),
-    state = _useState2[0],
-    setState = _useState2[1];
-  useEffect(function () {
-    var unsubscribeListeners = Object.entries(externalPlugins).map(function (_ref3) {
+    pluginStates = _useState2[0],
+    setPluginState = _useState2[1];
+  useLayoutEffect(function () {
+    var unsubs = Object.entries(externalPlugins).map(function (_ref3) {
       var _ref4 = _slicedToArray(_ref3, 2),
         pluginKey = _ref4[0],
         externalPlugin = _ref4[1];
@@ -80,16 +92,19 @@ function useSharedPluginStateInternal(externalPlugins) {
         if (prevSharedState === nextSharedState) {
           return;
         }
-        setState(function (state) {
-          return _objectSpread(_objectSpread({}, state), {}, _defineProperty({}, pluginKey, nextSharedState));
+        setPluginState(function (currentPluginStates) {
+          return _objectSpread(_objectSpread({}, currentPluginStates), {}, _defineProperty({}, pluginKey, nextSharedState));
         });
       });
     });
     return function () {
-      unsubscribeListeners.forEach(function (cb) {
+      unsubs.forEach(function (cb) {
         return cb === null || cb === void 0 ? void 0 : cb();
       });
     };
+    // Do not re-render due to state changes, we only need to check this when
+    // setting up the initial subscription.
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [externalPlugins]);
-  return state;
+  return pluginStates;
 }

package/dist/esm/monitoring/error.js

@@ -6,7 +6,7 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 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 = "74.3.1";
+var packageVersion = "74.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/styles/shared/resizer.js

@@ -10,6 +10,7 @@ import { B200, N60 } from '@atlaskit/theme/colors';
 export var resizerItemClassName = 'resizer-item';
 export var resizerHandleRightClassName = 'resizer-handle-right';
 export var resizerHandleLeftClassName = 'resizer-handle-left';
+export var resizerHandleStickyClassName = 'resizer-handle-sticky';
 
 // akEditorSelectedNodeClassName from '@atlaskit/editor-shared-styles';
 var akEditorSelectedNodeClassName = 'ak-editor-selected-node';
@@ -23,4 +24,4 @@ export var resizerHandlerClassName = {
   medium: resizerHandlerMediumClassName,
   large: resizerHandlerLargeClassName
 };
-export var resizerStyles = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  .", " {\n    background: ", ";\n  }\n\n  .", ", .", " {\n    display: flex;\n    flex-direction: column;\n\n    /* vertical align */\n    justify-content: center;\n  }\n\n  .", " {\n    align-items: flex-end;\n    /* padding-right: 12px; */\n    /* margin-right: -", "px; */\n  }\n\n  .", " {\n    align-items: flex-start;\n    /* padding-left: 12px; */\n    /* margin-left: -", "px; */\n  }\n\n  .", "::after,\n    .", "::after {\n    content: ' ';\n    display: flex;\n    width: 3px;\n    height: 64px;\n\n    border-radius: 6px;\n  }\n\n  .", ":hover\n    .", "::after,\n    .", ":hover\n    .", "::after {\n    background: ", ";\n  }\n\n  .", "\n    .", "::after,\n    .", "\n    .", "::after,\n    .", "\n    .", ":hover::after,\n    .", "\n    .", ":hover::after,\n    .", ".is-resizing\n    .", "::after,\n    .", ".is-resizing\n    .", "::after {\n    background: ", ";\n  }\n\n  .", ".", "::after,\n    .", ".", "::after {\n    height: 64px;\n  }\n\n  .", ".", "::after,\n    .", ".", "::after {\n    height: 43px;\n  }\n\n  .", ".", "::after,\n    .", ".", "::after {\n    height: 96px;\n  }\n"])), resizerItemClassName, "var(--ds-border-focused, ".concat(B200, ")"), resizerHandleRightClassName, resizerHandleLeftClassName, resizerHandleRightClassName, resizerHandlePadding, resizerHandleLeftClassName, resizerHandlePadding, resizerHandleRightClassName, resizerHandleLeftClassName, resizerItemClassName, resizerHandleLeftClassName, resizerItemClassName, resizerHandleRightClassName, "var(--ds-border, ".concat(N60, ")"), akEditorSelectedNodeClassName, resizerHandleRightClassName, akEditorSelectedNodeClassName, resizerHandleLeftClassName, resizerItemClassName, resizerHandleRightClassName, resizerItemClassName, resizerHandleLeftClassName, resizerItemClassName, resizerHandleRightClassName, resizerItemClassName, resizerHandleLeftClassName, "var(--ds-border-focused, ".concat(B200, ")"), resizerHandleRightClassName, resizerHandlerClassName.medium, resizerHandleLeftClassName, resizerHandlerClassName.medium, resizerHandleRightClassName, resizerHandlerClassName.small, resizerHandleLeftClassName, resizerHandlerClassName.small, resizerHandleRightClassName, resizerHandlerClassName.large, resizerHandleLeftClassName, resizerHandlerClassName.large);
+export var resizerStyles = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  .", " {\n    background: ", ";\n  }\n\n  .", ", .", " {\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n  }\n\n  .", " {\n    align-items: flex-end;\n  }\n\n  .", " {\n    align-items: flex-start;\n  }\n\n  .", "::after,\n    .", "::after {\n    content: ' ';\n    display: flex;\n    width: 3px;\n    height: 64px;\n\n    border-radius: 6px;\n  }\n\n  .", ":hover\n    .", "::after,\n    .", ":hover\n    .", "::after {\n    background: ", ";\n  }\n\n  .", "\n    .", "::after,\n    .", "\n    .", "::after,\n    .", "\n    .", ":hover::after,\n    .", "\n    .", ":hover::after,\n    .", ".is-resizing\n    .", "::after,\n    .", ".is-resizing\n    .", "::after {\n    background: ", ";\n  }\n\n  .", ".", "::after,\n    .", ".", "::after {\n    height: 64px;\n  }\n\n  .", ".", "::after,\n    .", ".", "::after {\n    height: 43px;\n  }\n\n  .", ".", "::after,\n    .", ".", "::after {\n    height: 96px;\n  }\n\n  .", ".", "::after,\n    .", ".", "::after {\n    position: sticky;\n    top: 10px;\n    bottom: 10px;\n  }\n"])), resizerItemClassName, "var(--ds-border-focused, ".concat(B200, ")"), resizerHandleRightClassName, resizerHandleLeftClassName, resizerHandleRightClassName, resizerHandleLeftClassName, resizerHandleRightClassName, resizerHandleLeftClassName, resizerItemClassName, resizerHandleLeftClassName, resizerItemClassName, resizerHandleRightClassName, "var(--ds-border, ".concat(N60, ")"), akEditorSelectedNodeClassName, resizerHandleRightClassName, akEditorSelectedNodeClassName, resizerHandleLeftClassName, resizerItemClassName, resizerHandleRightClassName, resizerItemClassName, resizerHandleLeftClassName, resizerItemClassName, resizerHandleRightClassName, resizerItemClassName, resizerHandleLeftClassName, "var(--ds-border-focused, ".concat(B200, ")"), resizerHandleRightClassName, resizerHandlerClassName.medium, resizerHandleLeftClassName, resizerHandlerClassName.medium, resizerHandleRightClassName, resizerHandlerClassName.small, resizerHandleLeftClassName, resizerHandlerClassName.small, resizerHandleRightClassName, resizerHandlerClassName.large, resizerHandleLeftClassName, resizerHandlerClassName.large, resizerHandleRightClassName, resizerHandleStickyClassName, resizerHandleLeftClassName, resizerHandleStickyClassName);

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

@@ -18,7 +18,7 @@ import { themed } from '@atlaskit/theme/components';
 import { borderRadius } from '@atlaskit/theme/constants';
 import Layer from '../Layer';
 var packageName = "@atlaskit/editor-common";
-var packageVersion = "74.3.1";
+var packageVersion = "74.5.0";
 var halfFocusRing = 1;
 var dropOffset = '0, 8';
 var DropList = /*#__PURE__*/function (_Component) {

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

@@ -1,15 +1,18 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import React from 'react';
 import classnames from 'classnames';
 import { Resizable } from 're-resizable';
-import { resizerHandleLeftClassName, resizerHandlePadding, resizerHandlerClassName, resizerHandleRightClassName, resizerHandleZIndex, resizerItemClassName } from '../../styles/shared/resizer';
-import { handleSides } from './utils';
+import { resizerHandleLeftClassName, resizerHandlePadding, resizerHandlerClassName, resizerHandleRightClassName, resizerHandleStickyClassName, resizerHandleZIndex, resizerItemClassName } from '../../styles/shared/resizer';
 export default function ResizerNext(props) {
+  var _classnames, _classnames2;
   var resizable = React.useRef(null);
   var handleResize = props.handleResize,
     handleResizeStart = props.handleResizeStart,
     handleResizeStop = props.handleResizeStop,
     _props$handlerHeightS = props.handlerHeightSize,
-    handlerHeightSize = _props$handlerHeightS === void 0 ? 'medium' : _props$handlerHeightS;
+    handlerHeightSize = _props$handlerHeightS === void 0 ? 'medium' : _props$handlerHeightS,
+    _props$handleAlignmen = props.handleAlignmentMethod,
+    handleAlignmentMethod = _props$handleAlignmen === void 0 ? 'center' : _props$handleAlignmen;
   var onResizeStart = React.useCallback(function (event) {
     // prevent creating a drag event on Firefox
     event.preventDefault();
@@ -41,22 +44,10 @@ export default function ResizerNext(props) {
     };
     handleResizeStop(originalState, delta);
   }, [handleResizeStop]);
-  var handles = {};
-  if (props.handleClassName) {
-    handleSides.forEach(function (side) {
-      handles[side] = "".concat(props.handleClassName, "-").concat(side);
-    });
-  } else {
-    handles = {
-      left: resizerHandleLeftClassName,
-      right: resizerHandleRightClassName
-    };
-  }
-
-  // add handler height size classname to handleClasses
-  Object.keys(handles).forEach(function (key) {
-    handles[key] = classnames(handles[key], resizerHandlerClassName[handlerHeightSize]);
-  });
+  var handles = {
+    left: classnames((_classnames = {}, _defineProperty(_classnames, "".concat(props.handleClassName, "-left"), !!props.handleClassName), _defineProperty(_classnames, resizerHandleLeftClassName, !props.handleClassName), _defineProperty(_classnames, resizerHandlerClassName[handlerHeightSize], true), _defineProperty(_classnames, resizerHandleStickyClassName, handleAlignmentMethod === 'sticky'), _classnames)),
+    right: classnames((_classnames2 = {}, _defineProperty(_classnames2, "".concat(props.handleClassName, "-right"), !!props.handleClassName), _defineProperty(_classnames2, resizerHandleRightClassName, !props.handleClassName), _defineProperty(_classnames2, resizerHandlerClassName[handlerHeightSize], true), _defineProperty(_classnames2, resizerHandleStickyClassName, handleAlignmentMethod === 'sticky'), _classnames2))
+  };
   var innerPadding = props.innerPadding || resizerHandlePadding;
   var handleStyles = {
     left: {

package/dist/esm/utils/validator.js

@@ -285,7 +285,7 @@ export var getValidNode = function getValidNode(originalNode) {
       case 'inlineCard':
       case 'blockCard':
         {
-          if (attrs && (attrs.url && isSafeUrl(attrs.url) || attrs.data && attrs.data.url && isSafeUrl(attrs.data.url))) {
+          if (attrs && (attrs.datasource && !attrs.url || attrs.url && isSafeUrl(attrs.url) || attrs.data && attrs.data.url && isSafeUrl(attrs.data.url))) {
             return {
               type: type,
               attrs: attrs

package/dist/esm/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/editor-common",
-	"version": "74.3.1",
+	"version": "74.5.0",
 	"sideEffects": false
 }

package/dist/types/styles/shared/resizer.d.ts

@@ -1,6 +1,7 @@
 export declare const resizerItemClassName = "resizer-item";
 export declare const resizerHandleRightClassName = "resizer-handle-right";
 export declare const resizerHandleLeftClassName = "resizer-handle-left";
+export declare const resizerHandleStickyClassName = "resizer-handle-sticky";
 export declare const resizerHandlePadding = 13;
 export declare const resizerHandleZIndex = 99;
 export declare const resizerHandlerSmallClassName = "resizer-handler-small";

package/dist/types/types/editor-container-width.d.ts

@@ -6,7 +6,6 @@ export type EditorContainerWidth = {
      * container element prop).
      */
     width: number;
-    containerWidth?: number;
     /**
      * Starts as undefined, and then updates to the
      * clientWidth of the dom element the EditorView

package/dist/types/types/editor-plugin.d.ts

@@ -6,7 +6,7 @@ import type { MarkConfig, NodeConfig } from './prosemirror-config';
 import type { QuickInsertHandler } from './quick-insert';
 import type { ToolbarUIComponentFactory } from './toolbar';
 import type { TypeAheadHandler } from './type-ahead';
-import type { UIComponentFactory } from './ui-components';
+import type { ReactHookFactory, UIComponentFactory } from './ui-components';
 export type PluginsOptions = {
     [pluginName: string]: any;
     /**
@@ -60,6 +60,15 @@ export interface EditorPlugin {
      * Although it’s common to specify a custom mount point (eg. date picker)
      */
     contentComponent?: UIComponentFactory;
+    /**
+     * Optional react hook that is mounted for all appearances
+     *
+     * This can be used to access React context, or other React specific code (ie. run `useEffect`)
+     * within a plugin that will run for all appearances without mounting any components.
+     *
+     * Example usages include analytics or width.
+     */
+    usePluginHook?: ReactHookFactory;
     /**
      * Optional UI-component that will be added to the toolbar at the top of the editor (doesn't exist in the compact-editor).
      *

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

@@ -23,7 +23,7 @@ export type { ContextPanelHandler } from './context-panel';
 export type { EditorAppearance } from './editor-appearance';
 export type { ToolbarUiComponentFactoryParams, ToolbarUIComponentFactory, } from './toolbar';
 export { ToolbarSize, ToolbarWidths, ToolbarWidthsFullPage } from './toolbar';
-export type { UiComponentFactoryParams, UIComponentFactory, } from './ui-components';
+export type { UiComponentFactoryParams, UIComponentFactory, ReactHookFactory, } from './ui-components';
 export type { EditorReactContext } from './editor-react-context';
 export type { PMPluginFactoryParams, PMPluginFactory, PMPlugin, } from './plugin-factory';
 export type { NodeConfig, MarkConfig, NodeViewConfig, } from './prosemirror-config';

package/dist/types/types/ui-components.d.ts

@@ -20,3 +20,4 @@ export type UiComponentFactoryParams = {
     wrapperElement: HTMLElement | null;
 };
 export type UIComponentFactory = (params: UiComponentFactoryParams) => React.ReactElement<any> | null;
+export type ReactHookFactory = (params: Pick<UiComponentFactoryParams, 'editorView' | 'containerElement'>) => void;

package/dist/types/ui/Resizer/index.d.ts

@@ -1,6 +1,6 @@
 import React, { PropsWithChildren } from 'react';
 import { HandleComponent } from 're-resizable';
-import { EnabledHandles, HandleResize, HandlerHeightSizeType } from './types';
+import { EnabledHandles, HandleAlignmentMethod, HandleResize, HandlerHeightSizeType } from './types';
 export interface ResizableNumberSize {
     width: number;
     height: number;
@@ -19,5 +19,6 @@ export type ResizerProps = {
     handleWrapperStyle?: React.CSSProperties;
     handleComponent?: HandleComponent;
     handlerHeightSize?: HandlerHeightSizeType;
+    handleAlignmentMethod?: HandleAlignmentMethod;
 };
 export default function ResizerNext(props: PropsWithChildren<ResizerProps>): JSX.Element;

package/dist/types/ui/Resizer/types.d.ts

@@ -17,3 +17,4 @@ export type HandleStyles = {
     left?: React.CSSProperties;
 };
 export type HandlerHeightSizeType = 'small' | 'medium' | 'large';
+export type HandleAlignmentMethod = 'center' | 'sticky';

package/dist/types-ts4.5/styles/shared/resizer.d.ts

@@ -1,6 +1,7 @@
 export declare const resizerItemClassName = "resizer-item";
 export declare const resizerHandleRightClassName = "resizer-handle-right";
 export declare const resizerHandleLeftClassName = "resizer-handle-left";
+export declare const resizerHandleStickyClassName = "resizer-handle-sticky";
 export declare const resizerHandlePadding = 13;
 export declare const resizerHandleZIndex = 99;
 export declare const resizerHandlerSmallClassName = "resizer-handler-small";

package/dist/types-ts4.5/types/editor-container-width.d.ts

@@ -6,7 +6,6 @@ export type EditorContainerWidth = {
      * container element prop).
      */
     width: number;
-    containerWidth?: number;
     /**
      * Starts as undefined, and then updates to the
      * clientWidth of the dom element the EditorView

package/dist/types-ts4.5/types/editor-plugin.d.ts

@@ -6,7 +6,7 @@ import type { MarkConfig, NodeConfig } from './prosemirror-config';
 import type { QuickInsertHandler } from './quick-insert';
 import type { ToolbarUIComponentFactory } from './toolbar';
 import type { TypeAheadHandler } from './type-ahead';
-import type { UIComponentFactory } from './ui-components';
+import type { ReactHookFactory, UIComponentFactory } from './ui-components';
 export type PluginsOptions = {
     [pluginName: string]: any;
     /**
@@ -60,6 +60,15 @@ export interface EditorPlugin {
      * Although it’s common to specify a custom mount point (eg. date picker)
      */
     contentComponent?: UIComponentFactory;
+    /**
+     * Optional react hook that is mounted for all appearances
+     *
+     * This can be used to access React context, or other React specific code (ie. run `useEffect`)
+     * within a plugin that will run for all appearances without mounting any components.
+     *
+     * Example usages include analytics or width.
+     */
+    usePluginHook?: ReactHookFactory;
     /**
      * Optional UI-component that will be added to the toolbar at the top of the editor (doesn't exist in the compact-editor).
      *

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

@@ -23,7 +23,7 @@ export type { ContextPanelHandler } from './context-panel';
 export type { EditorAppearance } from './editor-appearance';
 export type { ToolbarUiComponentFactoryParams, ToolbarUIComponentFactory, } from './toolbar';
 export { ToolbarSize, ToolbarWidths, ToolbarWidthsFullPage } from './toolbar';
-export type { UiComponentFactoryParams, UIComponentFactory, } from './ui-components';
+export type { UiComponentFactoryParams, UIComponentFactory, ReactHookFactory, } from './ui-components';
 export type { EditorReactContext } from './editor-react-context';
 export type { PMPluginFactoryParams, PMPluginFactory, PMPlugin, } from './plugin-factory';
 export type { NodeConfig, MarkConfig, NodeViewConfig, } from './prosemirror-config';

package/dist/types-ts4.5/types/ui-components.d.ts

@@ -20,3 +20,4 @@ export type UiComponentFactoryParams = {
     wrapperElement: HTMLElement | null;
 };
 export type UIComponentFactory = (params: UiComponentFactoryParams) => React.ReactElement<any> | null;
+export type ReactHookFactory = (params: Pick<UiComponentFactoryParams, 'editorView' | 'containerElement'>) => void;

package/dist/types-ts4.5/ui/Resizer/index.d.ts

@@ -1,6 +1,6 @@
 import React, { PropsWithChildren } from 'react';
 import { HandleComponent } from 're-resizable';
-import { EnabledHandles, HandleResize, HandlerHeightSizeType } from './types';
+import { EnabledHandles, HandleAlignmentMethod, HandleResize, HandlerHeightSizeType } from './types';
 export interface ResizableNumberSize {
     width: number;
     height: number;
@@ -19,5 +19,6 @@ export type ResizerProps = {
     handleWrapperStyle?: React.CSSProperties;
     handleComponent?: HandleComponent;
     handlerHeightSize?: HandlerHeightSizeType;
+    handleAlignmentMethod?: HandleAlignmentMethod;
 };
 export default function ResizerNext(props: PropsWithChildren<ResizerProps>): JSX.Element;

package/dist/types-ts4.5/ui/Resizer/types.d.ts

@@ -17,3 +17,4 @@ export type HandleStyles = {
     left?: React.CSSProperties;
 };
 export type HandlerHeightSizeType = 'small' | 'medium' | 'large';
+export type HandleAlignmentMethod = 'center' | 'sticky';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/editor-common",
-  "version": "74.3.1",
+  "version": "74.5.0",
   "description": "A package that contains common classes and components for editor and renderer",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -25,7 +25,7 @@
   "atlassian": {
     "team": "Editor",
     "inPublicMirror": true,
-    "releaseModel": "scheduled"
+    "releaseModel": "continuous"
   },
   "af:exports": {
     "./event-dispatcher": "./src/event-dispatcher/index.ts",
@@ -70,8 +70,8 @@
   },
   "dependencies": {
     "@atlaskit/activity-provider": "^2.4.0",
-    "@atlaskit/adf-schema": "^25.7.0",
-    "@atlaskit/adf-utils": "^18.2.0",
+    "@atlaskit/adf-schema": "^25.8.0",
+    "@atlaskit/adf-utils": "^18.3.0",
     "@atlaskit/analytics-listeners": "^8.7.0",
     "@atlaskit/analytics-namespaced-context": "^6.7.0",
     "@atlaskit/analytics-next": "^9.1.0",
@@ -79,7 +79,7 @@
     "@atlaskit/button": "^16.7.0",
     "@atlaskit/code": "^14.6.0",
     "@atlaskit/codemod-utils": "^4.2.0",
-    "@atlaskit/collab-provider": "^9.0.0",
+    "@atlaskit/collab-provider": "^9.2.0",
     "@atlaskit/editor-json-transformer": "^8.9.0",
     "@atlaskit/editor-palette": "1.4.2",
     "@atlaskit/editor-shared-styles": "^2.4.0",
@@ -87,7 +87,7 @@
     "@atlaskit/icon": "^21.12.0",
     "@atlaskit/in-product-testing": "^0.2.0",
     "@atlaskit/media-card": "^76.0.0",
-    "@atlaskit/media-client": "^22.0.0",
+    "@atlaskit/media-client": "^23.0.0",
     "@atlaskit/media-picker": "^66.0.0",
     "@atlaskit/mention": "^22.1.0",
     "@atlaskit/menu": "^1.7.0",
@@ -135,7 +135,7 @@
     "react-intl-next": "npm:react-intl@^5.18.1"
   },
   "devDependencies": {
-    "@atlaskit/editor-core": "^185.0.0",
+    "@atlaskit/editor-core": "^185.1.0",
     "@atlaskit/editor-json-transformer": "^8.9.0",
     "@atlaskit/editor-plugin-analytics": "^0.0.1",
     "@atlaskit/editor-plugin-content-insertion": "^0.0.1",
@@ -143,7 +143,7 @@
     "@atlaskit/editor-plugin-feature-flags": "^0.1.0",
     "@atlaskit/editor-plugin-grid": "^0.1.0",
     "@atlaskit/editor-plugin-table": "^1.5.0",
-    "@atlaskit/editor-plugin-width": "^0.0.1",
+    "@atlaskit/editor-plugin-width": "^0.1.0",
     "@atlaskit/editor-test-helpers": "^18.5.0",
     "@atlaskit/media-core": "^34.1.0",
     "@atlaskit/util-data-test": "^17.8.0",

package/tmp/api-report-tmp.d.ts

@@ -0,0 +1,9 @@
+## API Report File for "@atlaskit/editor-common"
+
+> Do not edit this file. It is a report generated by [API Extractor](https://api-extractor.com/).
+
+```ts
+
+// (No @packageDocumentation comment for this package)
+
+```