@atlaskit/editor-common 74.17.1 → 74.19.0

package/CHANGELOG.md

@@ -1,5 +1,21 @@
 # @atlaskit/editor-common
 
+## 74.19.0
+
+### Minor Changes
+
+- [`f486dbd535c`](https://bitbucket.org/atlassian/atlassian-frontend/commits/f486dbd535c) - MEX-2481 Fix minor gap between image and border
+
+### Patch Changes
+
+- Updated dependencies
+
+## 74.18.0
+
+### Minor Changes
+
+- [`11285b1d77e`](https://bitbucket.org/atlassian/atlassian-frontend/commits/11285b1d77e) - ED-18971 Added editor dynamic guideline util and new guideline entry point in editor-common
+
 ## 74.17.1
 
 ### Patch Changes

package/dist/cjs/guideline/constants.js

@@ -0,0 +1,8 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.MEDIA_DYNAMIC_GUIDELINE_PREFIX = void 0;
+var MEDIA_DYNAMIC_GUIDELINE_PREFIX = 'media_';
+exports.MEDIA_DYNAMIC_GUIDELINE_PREFIX = MEDIA_DYNAMIC_GUIDELINE_PREFIX;

package/dist/cjs/guideline/dynamicGuideline.js

@@ -0,0 +1,73 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.generateDynamicGuidelines = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _prosemirrorState = require("prosemirror-state");
+var _prosemirrorUtils = require("prosemirror-utils");
+var _constants = require("./constants");
+var _types = require("./types");
+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) { (0, _defineProperty2.default)(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 generateDynamicGuidelines = function generateDynamicGuidelines(state, editorWidth) {
+  var selectedNode = state.selection instanceof _prosemirrorState.NodeSelection && state.selection.node;
+  var mediaSingleNode = (0, _prosemirrorUtils.findChildren)(state.tr.doc, function (node) {
+    return node.type === state.schema.nodes.mediaSingle;
+  }, false // only top level
+  );
+
+  var offset = editorWidth / 2;
+  return mediaSingleNode.map(function (_ref, index) {
+    var node = _ref.node;
+    if (selectedNode === node) {
+      return [];
+    }
+    var _node$attrs = node.attrs,
+      layout = _node$attrs.layout,
+      width = _node$attrs.width,
+      widthType = _node$attrs.widthType;
+    var pixelWidth = !widthType || widthType === _types.WidthTypes.PERCENTAGE ? width / 100 * editorWidth : width;
+    var commonStyles = {
+      style: 'dashed',
+      show: true
+    };
+    var key = "".concat(_constants.MEDIA_DYNAMIC_GUIDELINE_PREFIX).concat(index);
+    switch (layout) {
+      case 'align-start':
+      case 'wrap-left':
+        return _objectSpread({
+          position: {
+            x: pixelWidth - offset
+          },
+          key: key
+        }, commonStyles);
+      case 'align-end':
+      case 'wrap-right':
+        return _objectSpread({
+          position: {
+            x: editorWidth - pixelWidth - offset
+          },
+          key: key
+        }, commonStyles);
+      case 'center':
+        return [_objectSpread({
+          position: {
+            x: pixelWidth / 2
+          },
+          key: "".concat(key, "_right")
+        }, commonStyles), _objectSpread({
+          position: {
+            x: -pixelWidth / 2
+          },
+          key: "".concat(key, "_left")
+        }, commonStyles)];
+      // we ignore full-width and wide
+      default:
+        return [];
+    }
+  }).flat();
+};
+exports.generateDynamicGuidelines = generateDynamicGuidelines;

package/dist/cjs/guideline/index.js

@@ -0,0 +1,12 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "generateDynamicGuidelines", {
+  enumerable: true,
+  get: function get() {
+    return _dynamicGuideline.generateDynamicGuidelines;
+  }
+});
+var _dynamicGuideline = require("./dynamicGuideline");

package/dist/cjs/guideline/types.js

@@ -0,0 +1,12 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.WidthTypes = void 0;
+var WidthTypes = /*#__PURE__*/function (WidthTypes) {
+  WidthTypes["PERCENTAGE"] = "percentage";
+  WidthTypes["PIXEL"] = "pixel";
+  return WidthTypes;
+}({});
+exports.WidthTypes = WidthTypes;

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.17.1";
+var packageVersion = "74.19.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

@@ -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.17.1";
+var packageVersion = "74.19.0";
 var halfFocusRing = 1;
 var dropOffset = '0, 8';
 var DropList = /*#__PURE__*/function (_Component) {

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

@@ -4,7 +4,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.DEFAULT_IMAGE_WIDTH = exports.DEFAULT_IMAGE_HEIGHT = void 0;
+exports.IMAGE_AND_BORDER_ADJUSTMENT = exports.DEFAULT_IMAGE_WIDTH = exports.DEFAULT_IMAGE_HEIGHT = void 0;
 exports.default = MediaSingle;
 exports.shouldAddDefaultWrappedWidth = void 0;
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
@@ -19,7 +19,14 @@ var _styled = require("./styled");
 var DEFAULT_IMAGE_WIDTH = 250;
 exports.DEFAULT_IMAGE_WIDTH = DEFAULT_IMAGE_WIDTH;
 var DEFAULT_IMAGE_HEIGHT = 200;
+
+/*
+    This constant is used to proportionally adjust the image and its border to avoid any gaps. i.e. The value will simultaneously expand the width and height of the image by 2 pixels; and similarly contract the border by 2 pixels.
+    Read more: https://product-fabric.atlassian.net/browse/MEX-2481
+*/
 exports.DEFAULT_IMAGE_HEIGHT = DEFAULT_IMAGE_HEIGHT;
+var IMAGE_AND_BORDER_ADJUSTMENT = 2;
+exports.IMAGE_AND_BORDER_ADJUSTMENT = IMAGE_AND_BORDER_ADJUSTMENT;
 var shouldAddDefaultWrappedWidth = function shouldAddDefaultWrappedWidth(layout, width, lineLength) {
   return _grid.wrappedLayouts.indexOf(layout) > -1 && lineLength && width && width > 0.5 * lineLength;
 };

package/dist/cjs/ui/index.js

@@ -83,6 +83,12 @@ Object.defineProperty(exports, "HelperMessage", {
     return _Messages.HelperMessage;
   }
 });
+Object.defineProperty(exports, "IMAGE_AND_BORDER_ADJUSTMENT", {
+  enumerable: true,
+  get: function get() {
+    return _MediaSingle.IMAGE_AND_BORDER_ADJUSTMENT;
+  }
+});
 Object.defineProperty(exports, "IntlErrorBoundary", {
   enumerable: true,
   get: function get() {

package/dist/cjs/version.json

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

package/dist/es2019/guideline/constants.js

@@ -0,0 +1 @@
+export const MEDIA_DYNAMIC_GUIDELINE_PREFIX = 'media_';

package/dist/es2019/guideline/dynamicGuideline.js

@@ -0,0 +1,68 @@
+import { NodeSelection } from 'prosemirror-state';
+import { findChildren } from 'prosemirror-utils';
+import { MEDIA_DYNAMIC_GUIDELINE_PREFIX } from './constants';
+import { WidthTypes } from './types';
+export const generateDynamicGuidelines = (state, editorWidth) => {
+  const selectedNode = state.selection instanceof NodeSelection && state.selection.node;
+  const mediaSingleNode = findChildren(state.tr.doc, node => {
+    return node.type === state.schema.nodes.mediaSingle;
+  }, false // only top level
+  );
+
+  const offset = editorWidth / 2;
+  return mediaSingleNode.map(({
+    node
+  }, index) => {
+    if (selectedNode === node) {
+      return [];
+    }
+    const {
+      layout,
+      width,
+      widthType
+    } = node.attrs;
+    const pixelWidth = !widthType || widthType === WidthTypes.PERCENTAGE ? width / 100 * editorWidth : width;
+    const commonStyles = {
+      style: 'dashed',
+      show: true
+    };
+    const key = `${MEDIA_DYNAMIC_GUIDELINE_PREFIX}${index}`;
+    switch (layout) {
+      case 'align-start':
+      case 'wrap-left':
+        return {
+          position: {
+            x: pixelWidth - offset
+          },
+          key,
+          ...commonStyles
+        };
+      case 'align-end':
+      case 'wrap-right':
+        return {
+          position: {
+            x: editorWidth - pixelWidth - offset
+          },
+          key,
+          ...commonStyles
+        };
+      case 'center':
+        return [{
+          position: {
+            x: pixelWidth / 2
+          },
+          key: `${key}_right`,
+          ...commonStyles
+        }, {
+          position: {
+            x: -pixelWidth / 2
+          },
+          key: `${key}_left`,
+          ...commonStyles
+        }];
+      // we ignore full-width and wide
+      default:
+        return [];
+    }
+  }).flat();
+};

package/dist/es2019/guideline/index.js

@@ -0,0 +1 @@
+export { generateDynamicGuidelines } from './dynamicGuideline';

package/dist/es2019/guideline/types.js

@@ -0,0 +1,5 @@
+export let WidthTypes = /*#__PURE__*/function (WidthTypes) {
+  WidthTypes["PERCENTAGE"] = "percentage";
+  WidthTypes["PIXEL"] = "pixel";
+  return WidthTypes;
+}({});

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.17.1";
+const packageVersion = "74.19.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

@@ -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.17.1";
+const packageVersion = "74.19.0";
 const halfFocusRing = 1;
 const dropOffset = '0, 8';
 class DropList extends Component {

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

@@ -7,6 +7,12 @@ import { calcPxFromPct, wrappedLayouts } from './grid';
 import { MediaSingleDimensionHelper, MediaWrapper } from './styled';
 export const DEFAULT_IMAGE_WIDTH = 250;
 export const DEFAULT_IMAGE_HEIGHT = 200;
+
+/*
+    This constant is used to proportionally adjust the image and its border to avoid any gaps. i.e. The value will simultaneously expand the width and height of the image by 2 pixels; and similarly contract the border by 2 pixels.
+    Read more: https://product-fabric.atlassian.net/browse/MEX-2481
+*/
+export const IMAGE_AND_BORDER_ADJUSTMENT = 2;
 export const shouldAddDefaultWrappedWidth = (layout, width, lineLength) => {
   return wrappedLayouts.indexOf(layout) > -1 && lineLength && width && width > 0.5 * lineLength;
 };

package/dist/es2019/ui/index.js

@@ -1,5 +1,5 @@
 export { default as Caption } from './Caption';
-export { default as MediaSingle, DEFAULT_IMAGE_WIDTH, DEFAULT_IMAGE_HEIGHT, shouldAddDefaultWrappedWidth } from './MediaSingle';
+export { default as MediaSingle, DEFAULT_IMAGE_WIDTH, DEFAULT_IMAGE_HEIGHT, IMAGE_AND_BORDER_ADJUSTMENT, shouldAddDefaultWrappedWidth } from './MediaSingle';
 export { MediaSingleDimensionHelper } from './MediaSingle/styled';
 export { layoutSupportsWidth, calcPxFromColumns, calcPctFromPx, calcPxFromPct, calcColumnsFromPx, snapToGrid, calcMediaPxWidth, wrappedLayouts } from './MediaSingle/grid';
 export { mediaLinkStyle } from './MediaSingle/link';

package/dist/es2019/version.json

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

package/dist/esm/guideline/constants.js

@@ -0,0 +1 @@
+export var MEDIA_DYNAMIC_GUIDELINE_PREFIX = 'media_';

package/dist/esm/guideline/dynamicGuideline.js

@@ -0,0 +1,65 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+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 { NodeSelection } from 'prosemirror-state';
+import { findChildren } from 'prosemirror-utils';
+import { MEDIA_DYNAMIC_GUIDELINE_PREFIX } from './constants';
+import { WidthTypes } from './types';
+export var generateDynamicGuidelines = function generateDynamicGuidelines(state, editorWidth) {
+  var selectedNode = state.selection instanceof NodeSelection && state.selection.node;
+  var mediaSingleNode = findChildren(state.tr.doc, function (node) {
+    return node.type === state.schema.nodes.mediaSingle;
+  }, false // only top level
+  );
+
+  var offset = editorWidth / 2;
+  return mediaSingleNode.map(function (_ref, index) {
+    var node = _ref.node;
+    if (selectedNode === node) {
+      return [];
+    }
+    var _node$attrs = node.attrs,
+      layout = _node$attrs.layout,
+      width = _node$attrs.width,
+      widthType = _node$attrs.widthType;
+    var pixelWidth = !widthType || widthType === WidthTypes.PERCENTAGE ? width / 100 * editorWidth : width;
+    var commonStyles = {
+      style: 'dashed',
+      show: true
+    };
+    var key = "".concat(MEDIA_DYNAMIC_GUIDELINE_PREFIX).concat(index);
+    switch (layout) {
+      case 'align-start':
+      case 'wrap-left':
+        return _objectSpread({
+          position: {
+            x: pixelWidth - offset
+          },
+          key: key
+        }, commonStyles);
+      case 'align-end':
+      case 'wrap-right':
+        return _objectSpread({
+          position: {
+            x: editorWidth - pixelWidth - offset
+          },
+          key: key
+        }, commonStyles);
+      case 'center':
+        return [_objectSpread({
+          position: {
+            x: pixelWidth / 2
+          },
+          key: "".concat(key, "_right")
+        }, commonStyles), _objectSpread({
+          position: {
+            x: -pixelWidth / 2
+          },
+          key: "".concat(key, "_left")
+        }, commonStyles)];
+      // we ignore full-width and wide
+      default:
+        return [];
+    }
+  }).flat();
+};

package/dist/esm/guideline/index.js

@@ -0,0 +1 @@
+export { generateDynamicGuidelines } from './dynamicGuideline';

package/dist/esm/guideline/types.js

@@ -0,0 +1,5 @@
+export var WidthTypes = /*#__PURE__*/function (WidthTypes) {
+  WidthTypes["PERCENTAGE"] = "percentage";
+  WidthTypes["PIXEL"] = "pixel";
+  return WidthTypes;
+}({});

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.17.1";
+var packageVersion = "74.19.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

@@ -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.17.1";
+var packageVersion = "74.19.0";
 var halfFocusRing = 1;
 var dropOffset = '0, 8';
 var DropList = /*#__PURE__*/function (_Component) {

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

@@ -8,6 +8,12 @@ import { calcPxFromPct, wrappedLayouts } from './grid';
 import { MediaSingleDimensionHelper, MediaWrapper } from './styled';
 export var DEFAULT_IMAGE_WIDTH = 250;
 export var DEFAULT_IMAGE_HEIGHT = 200;
+
+/*
+    This constant is used to proportionally adjust the image and its border to avoid any gaps. i.e. The value will simultaneously expand the width and height of the image by 2 pixels; and similarly contract the border by 2 pixels.
+    Read more: https://product-fabric.atlassian.net/browse/MEX-2481
+*/
+export var IMAGE_AND_BORDER_ADJUSTMENT = 2;
 export var shouldAddDefaultWrappedWidth = function shouldAddDefaultWrappedWidth(layout, width, lineLength) {
   return wrappedLayouts.indexOf(layout) > -1 && lineLength && width && width > 0.5 * lineLength;
 };

package/dist/esm/ui/index.js

@@ -1,5 +1,5 @@
 export { default as Caption } from './Caption';
-export { default as MediaSingle, DEFAULT_IMAGE_WIDTH, DEFAULT_IMAGE_HEIGHT, shouldAddDefaultWrappedWidth } from './MediaSingle';
+export { default as MediaSingle, DEFAULT_IMAGE_WIDTH, DEFAULT_IMAGE_HEIGHT, IMAGE_AND_BORDER_ADJUSTMENT, shouldAddDefaultWrappedWidth } from './MediaSingle';
 export { MediaSingleDimensionHelper } from './MediaSingle/styled';
 export { layoutSupportsWidth, calcPxFromColumns, calcPctFromPx, calcPxFromPct, calcColumnsFromPx, snapToGrid, calcMediaPxWidth, wrappedLayouts } from './MediaSingle/grid';
 export { mediaLinkStyle } from './MediaSingle/link';

package/dist/esm/version.json

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

package/dist/types/guideline/constants.d.ts

@@ -0,0 +1 @@
+export declare const MEDIA_DYNAMIC_GUIDELINE_PREFIX = "media_";

package/dist/types/guideline/dynamicGuideline.d.ts

@@ -0,0 +1,16 @@
+import { EditorState } from 'prosemirror-state';
+export declare const generateDynamicGuidelines: (state: EditorState, editorWidth: number) => ({
+    style: string;
+    show: boolean;
+    position: {
+        x: number;
+    };
+    key: string;
+} | {
+    style: string;
+    show: boolean;
+    position: {
+        x: number;
+    };
+    key: string;
+})[];

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

@@ -0,0 +1 @@
+export { generateDynamicGuidelines } from './dynamicGuideline';

package/dist/types/guideline/types.d.ts

@@ -0,0 +1,4 @@
+export declare enum WidthTypes {
+    PERCENTAGE = "percentage",
+    PIXEL = "pixel"
+}

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

@@ -4,6 +4,7 @@ import { jsx } from '@emotion/react';
 import { RichMediaLayout as MediaSingleLayout, RichMediaLayout } from '@atlaskit/adf-schema';
 export declare const DEFAULT_IMAGE_WIDTH = 250;
 export declare const DEFAULT_IMAGE_HEIGHT = 200;
+export declare const IMAGE_AND_BORDER_ADJUSTMENT = 2;
 export interface Props {
     children: React.ReactNode;
     layout: MediaSingleLayout;

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

@@ -1,5 +1,5 @@
 export { default as Caption } from './Caption';
-export { default as MediaSingle, DEFAULT_IMAGE_WIDTH, DEFAULT_IMAGE_HEIGHT, shouldAddDefaultWrappedWidth, } from './MediaSingle';
+export { default as MediaSingle, DEFAULT_IMAGE_WIDTH, DEFAULT_IMAGE_HEIGHT, IMAGE_AND_BORDER_ADJUSTMENT, shouldAddDefaultWrappedWidth, } from './MediaSingle';
 export type { Props as MediaSingleProps } from './MediaSingle';
 export { MediaSingleDimensionHelper } from './MediaSingle/styled';
 export type { MediaSingleWrapperProps as MediaSingleDimensionHelperProps } from './MediaSingle/styled';

package/dist/types-ts4.5/guideline/constants.d.ts

@@ -0,0 +1 @@
+export declare const MEDIA_DYNAMIC_GUIDELINE_PREFIX = "media_";

package/dist/types-ts4.5/guideline/dynamicGuideline.d.ts

@@ -0,0 +1,16 @@
+import { EditorState } from 'prosemirror-state';
+export declare const generateDynamicGuidelines: (state: EditorState, editorWidth: number) => ({
+    style: string;
+    show: boolean;
+    position: {
+        x: number;
+    };
+    key: string;
+} | {
+    style: string;
+    show: boolean;
+    position: {
+        x: number;
+    };
+    key: string;
+})[];

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

@@ -0,0 +1 @@
+export { generateDynamicGuidelines } from './dynamicGuideline';

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

@@ -0,0 +1,4 @@
+export declare enum WidthTypes {
+    PERCENTAGE = "percentage",
+    PIXEL = "pixel"
+}

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

@@ -4,6 +4,7 @@ import { jsx } from '@emotion/react';
 import { RichMediaLayout as MediaSingleLayout, RichMediaLayout } from '@atlaskit/adf-schema';
 export declare const DEFAULT_IMAGE_WIDTH = 250;
 export declare const DEFAULT_IMAGE_HEIGHT = 200;
+export declare const IMAGE_AND_BORDER_ADJUSTMENT = 2;
 export interface Props {
     children: React.ReactNode;
     layout: MediaSingleLayout;

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

@@ -1,5 +1,5 @@
 export { default as Caption } from './Caption';
-export { default as MediaSingle, DEFAULT_IMAGE_WIDTH, DEFAULT_IMAGE_HEIGHT, shouldAddDefaultWrappedWidth, } from './MediaSingle';
+export { default as MediaSingle, DEFAULT_IMAGE_WIDTH, DEFAULT_IMAGE_HEIGHT, IMAGE_AND_BORDER_ADJUSTMENT, shouldAddDefaultWrappedWidth, } from './MediaSingle';
 export type { Props as MediaSingleProps } from './MediaSingle';
 export { MediaSingleDimensionHelper } from './MediaSingle/styled';
 export type { MediaSingleWrapperProps as MediaSingleDimensionHelperProps } from './MediaSingle/styled';

package/guideline/package.json

@@ -0,0 +1,15 @@
+{
+  "name": "@atlaskit/editor-common/guideline",
+  "main": "../dist/cjs/guideline/index.js",
+  "module": "../dist/esm/guideline/index.js",
+  "module:es2019": "../dist/es2019/guideline/index.js",
+  "sideEffects": false,
+  "types": "../dist/types/guideline/index.d.ts",
+  "typesVersions": {
+    ">=4.5 <4.9": {
+      "*": [
+        "../dist/types-ts4.5/guideline/index.d.ts"
+      ]
+    }
+  }
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/editor-common",
-  "version": "74.17.1",
+  "version": "74.19.0",
   "description": "A package that contains common classes and components for editor and renderer",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -69,7 +69,8 @@
     "./paste": "./src/paste/index.ts",
     "./resizer": "./src/resizer/index.ts",
     "./editor-analytics": "./src/editor-analytics/index.ts",
-    "./selection-based-node-view": "./src/selection-based-node-view/index.ts"
+    "./selection-based-node-view": "./src/selection-based-node-view/index.ts",
+    "./guideline": "./src/guideline/index.ts"
   },
   "dependencies": {
     "@atlaskit/activity-provider": "^2.4.0",
@@ -82,13 +83,13 @@
     "@atlaskit/button": "^16.8.0",
     "@atlaskit/code": "^14.6.0",
     "@atlaskit/codemod-utils": "^4.2.0",
-    "@atlaskit/collab-provider": "^9.5.0",
+    "@atlaskit/collab-provider": "^9.6.0",
     "@atlaskit/editor-palette": "1.5.1",
     "@atlaskit/editor-shared-styles": "^2.4.0",
     "@atlaskit/emoji": "^67.4.0",
     "@atlaskit/icon": "^21.12.0",
     "@atlaskit/in-product-testing": "^0.2.0",
-    "@atlaskit/media-card": "^76.0.0",
+    "@atlaskit/media-card": "^76.1.0",
     "@atlaskit/media-client": "^23.1.0",
     "@atlaskit/media-picker": "^66.1.0",
     "@atlaskit/mention": "^22.1.0",
@@ -134,7 +135,7 @@
   },
   "devDependencies": {
     "@atlaskit/editor-json-transformer": "^8.10.0",
-    "@atlaskit/editor-test-helpers": "^18.9.0",
+    "@atlaskit/editor-test-helpers": "^18.10.0",
     "@atlaskit/media-core": "^34.1.0",
     "@atlaskit/media-test-helpers": "^33.0.0",
     "@atlaskit/smart-card": "^26.9.0",