@atlaskit/editor-core 187.13.0 → 187.13.3

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @atlaskit/editor-core
 
+## 187.13.3
+
+### Patch Changes
+
+- [`62d6f381722`](https://bitbucket.org/atlassian/atlassian-frontend/commits/62d6f381722) - ED-18969 preliminaary refactor for relative guideline.
+
+## 187.13.2
+
+### Patch Changes
+
+- [`f194fae5d20`](https://bitbucket.org/atlassian/atlassian-frontend/commits/f194fae5d20) - Refactored ResizableMediaSingleNext to use editor-common utils
+
 ## 187.13.0
 
 ### Minor Changes

package/dist/cjs/plugins/media/ui/ResizableMediaSingle/ResizableMediaSingleNext.js

@@ -4,9 +4,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.UnwrappedResizableMediaSingleNext = void 0;
-exports.calcOffsetLeft = calcOffsetLeft;
-exports.resizerNextTestId = exports.default = void 0;
+exports.resizerNextTestId = exports.default = exports.UnwrappedResizableMediaSingleNext = void 0;
 var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
 var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
 var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
@@ -34,21 +32,12 @@ var _classnames = _interopRequireDefault(require("classnames"));
 var _styles = require("@atlaskit/editor-common/styles");
 var _mediaSingle = require("@atlaskit/editor-common/media-single");
 var _guideline = require("@atlaskit/editor-common/guideline");
-var _guidelines = require("./guidelines");
 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 resizerNextTestId = 'mediaSingle.resizerNext.testid';
-exports.resizerNextTestId = resizerNextTestId;
-function calcOffsetLeft(insideInlineLike, insideLayout, pmViewDom, wrapper) {
-  if (wrapper && insideInlineLike && !insideLayout) {
-    var currentNode = wrapper;
-    var boundingRect = currentNode.getBoundingClientRect();
-    return boundingRect.left - pmViewDom.getBoundingClientRect().left;
-  }
-  return 0;
-}
 
 // TODO: Create new fixed image size event
+exports.resizerNextTestId = resizerNextTestId;
 var getResizeAnalyticsEvent = function getResizeAnalyticsEvent(type, size, layout) {
   var actionSubject = type === 'embed' ? _analytics.ACTION_SUBJECT.EMBEDS : _analytics.ACTION_SUBJECT.MEDIA_SINGLE;
   return {
@@ -139,7 +128,7 @@ var ResizableMediaSingleNext = /*#__PURE__*/function (_React$Component) {
     });
     var initialWidth = props.mediaSingleWidth || _mediaSingle.DEFAULT_IMAGE_WIDTH;
     _this.state = {
-      offsetLeft: calcOffsetLeft(_this.insideInlineLike, _this.insideLayout, _this.props.view.dom, undefined),
+      offsetLeft: (0, _mediaSingle.calculateOffsetLeft)(_this.insideInlineLike, _this.insideLayout, _this.props.view.dom, undefined),
       // We default to true until we resolve the file type
       isVideoFile: true,
       isResizing: false,
@@ -169,7 +158,7 @@ var ResizableMediaSingleNext = /*#__PURE__*/function (_React$Component) {
   }, {
     key: "componentDidUpdate",
     value: function componentDidUpdate(prevProps, prevState) {
-      var offsetLeft = calcOffsetLeft(this.insideInlineLike, this.insideLayout, this.props.view.dom, this.wrapper);
+      var offsetLeft = (0, _mediaSingle.calculateOffsetLeft)(this.insideInlineLike, this.insideLayout, this.props.view.dom, this.wrapper);
       if (offsetLeft !== this.state.offsetLeft && offsetLeft >= 0) {
         this.setState({
           offsetLeft: offsetLeft
@@ -216,7 +205,7 @@ var ResizableMediaSingleNext = /*#__PURE__*/function (_React$Component) {
         fullWidthMode = _this$props4.fullWidthMode;
 
       // disable guidelines for nested media single node
-      return this.isNestedNode() ? [] : (0, _guidelines.generateDefaultGuidelines)(lineLength, containerWidth, fullWidthMode);
+      return this.isNestedNode() ? [] : (0, _guideline.generateDefaultGuidelines)(lineLength, containerWidth, fullWidthMode);
     }
 
     // Calculate width of media nodes for snaps based on dynamic guidelines
@@ -230,7 +219,12 @@ var ResizableMediaSingleNext = /*#__PURE__*/function (_React$Component) {
       var dom = view.dom;
       var defaultGuidelines = this.getDefaultGuidelines();
       // disable guidelines for nested media single node
-      var dynamicGuidelines = this.isNestedNode() ? [] : (0, _guideline.generateDynamicGuidelines)(view.state, lineLength);
+      var dynamicGuidelines = this.isNestedNode() ? [] : (0, _guideline.generateDynamicGuidelines)(view.state, lineLength, {
+        styles: {
+          lineStyle: 'dashed'
+        },
+        show: false
+      });
       var guidelines = [].concat((0, _toConsumableArray2.default)(defaultGuidelines), (0, _toConsumableArray2.default)(dynamicGuidelines));
       var mediaSingleSelector = 'div.mediaSingleView-content-wrap.ProseMirror-selectednode';
       var _dom$getBoundingClien = dom.getBoundingClientRect(),

package/dist/cjs/version-wrapper.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.version = exports.nextMajorVersion = exports.name = void 0;
 var name = "@atlaskit/editor-core";
 exports.name = name;
-var version = "187.13.0";
+var version = "187.13.3";
 exports.version = version;
 var nextMajorVersion = function nextMajorVersion() {
   return [Number(version.split('.')[0]) + 1, 0, 0].join('.');

package/dist/cjs/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/editor-core",
-	"version": "187.13.0",
+	"version": "187.13.3",
 	"sideEffects": false
 }

package/dist/es2019/plugins/media/ui/ResizableMediaSingle/ResizableMediaSingleNext.js

@@ -15,18 +15,9 @@ import { messages } from './resizable-media-single-messages';
 import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE } from '@atlaskit/editor-common/analytics';
 import classnames from 'classnames';
 import { richMediaClassName, resizerStyles } from '@atlaskit/editor-common/styles';
-import { MEDIA_SINGLE_MIN_PIXEL_WIDTH, MEDIA_SINGLE_SNAP_GAP, MEDIA_SINGLE_HIGHLIGHT_GAP, DEFAULT_IMAGE_WIDTH } from '@atlaskit/editor-common/media-single';
-import { findClosestSnap, getSnapWidth, getGuidelinesWithHighlights, generateDynamicGuidelines } from '@atlaskit/editor-common/guideline';
-import { generateDefaultGuidelines } from './guidelines';
+import { MEDIA_SINGLE_MIN_PIXEL_WIDTH, MEDIA_SINGLE_SNAP_GAP, MEDIA_SINGLE_HIGHLIGHT_GAP, calculateOffsetLeft, DEFAULT_IMAGE_WIDTH } from '@atlaskit/editor-common/media-single';
+import { findClosestSnap, getSnapWidth, getGuidelinesWithHighlights, generateDefaultGuidelines, generateDynamicGuidelines } from '@atlaskit/editor-common/guideline';
 export const resizerNextTestId = 'mediaSingle.resizerNext.testid';
-export function calcOffsetLeft(insideInlineLike, insideLayout, pmViewDom, wrapper) {
-  if (wrapper && insideInlineLike && !insideLayout) {
-    const currentNode = wrapper;
-    const boundingRect = currentNode.getBoundingClientRect();
-    return boundingRect.left - pmViewDom.getBoundingClientRect().left;
-  }
-  return 0;
-}
 
 // TODO: Create new fixed image size event
 const getResizeAnalyticsEvent = (type, size, layout) => {
@@ -121,7 +112,7 @@ class ResizableMediaSingleNext extends React.Component {
     });
     const initialWidth = props.mediaSingleWidth || DEFAULT_IMAGE_WIDTH;
     this.state = {
-      offsetLeft: calcOffsetLeft(this.insideInlineLike, this.insideLayout, this.props.view.dom, undefined),
+      offsetLeft: calculateOffsetLeft(this.insideInlineLike, this.insideLayout, this.props.view.dom, undefined),
       // We default to true until we resolve the file type
       isVideoFile: true,
       isResizing: false,
@@ -147,7 +138,7 @@ class ResizableMediaSingleNext extends React.Component {
     return Math.max(Math.min(origWidth || DEFAULT_IMAGE_WIDTH, contentWidth || containerWidth || akEditorDefaultLayoutWidth), MEDIA_SINGLE_MIN_PIXEL_WIDTH);
   }
   componentDidUpdate(prevProps, prevState) {
-    const offsetLeft = calcOffsetLeft(this.insideInlineLike, this.insideLayout, this.props.view.dom, this.wrapper);
+    const offsetLeft = calculateOffsetLeft(this.insideInlineLike, this.insideLayout, this.props.view.dom, this.wrapper);
     if (offsetLeft !== this.state.offsetLeft && offsetLeft >= 0) {
       this.setState({
         offsetLeft
@@ -206,7 +197,12 @@ class ResizableMediaSingleNext extends React.Component {
     } = view;
     const defaultGuidelines = this.getDefaultGuidelines();
     // disable guidelines for nested media single node
-    const dynamicGuidelines = this.isNestedNode() ? [] : generateDynamicGuidelines(view.state, lineLength);
+    const dynamicGuidelines = this.isNestedNode() ? [] : generateDynamicGuidelines(view.state, lineLength, {
+      styles: {
+        lineStyle: 'dashed'
+      },
+      show: false
+    });
     const guidelines = [...defaultGuidelines, ...dynamicGuidelines];
     const mediaSingleSelector = 'div.mediaSingleView-content-wrap.ProseMirror-selectednode';
     const {

package/dist/es2019/version-wrapper.js

@@ -1,5 +1,5 @@
 export const name = "@atlaskit/editor-core";
-export const version = "187.13.0";
+export const version = "187.13.3";
 export const nextMajorVersion = () => {
   return [Number(version.split('.')[0]) + 1, 0, 0].join('.');
 };

package/dist/es2019/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/editor-core",
-	"version": "187.13.0",
+	"version": "187.13.3",
 	"sideEffects": false
 }

package/dist/esm/plugins/media/ui/ResizableMediaSingle/ResizableMediaSingleNext.js

@@ -26,18 +26,9 @@ import { messages } from './resizable-media-single-messages';
 import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE } from '@atlaskit/editor-common/analytics';
 import classnames from 'classnames';
 import { richMediaClassName, resizerStyles } from '@atlaskit/editor-common/styles';
-import { MEDIA_SINGLE_MIN_PIXEL_WIDTH, MEDIA_SINGLE_SNAP_GAP, MEDIA_SINGLE_HIGHLIGHT_GAP, DEFAULT_IMAGE_WIDTH } from '@atlaskit/editor-common/media-single';
-import { findClosestSnap, getSnapWidth, getGuidelinesWithHighlights, generateDynamicGuidelines } from '@atlaskit/editor-common/guideline';
-import { generateDefaultGuidelines } from './guidelines';
+import { MEDIA_SINGLE_MIN_PIXEL_WIDTH, MEDIA_SINGLE_SNAP_GAP, MEDIA_SINGLE_HIGHLIGHT_GAP, calculateOffsetLeft, DEFAULT_IMAGE_WIDTH } from '@atlaskit/editor-common/media-single';
+import { findClosestSnap, getSnapWidth, getGuidelinesWithHighlights, generateDefaultGuidelines, generateDynamicGuidelines } from '@atlaskit/editor-common/guideline';
 export var resizerNextTestId = 'mediaSingle.resizerNext.testid';
-export function calcOffsetLeft(insideInlineLike, insideLayout, pmViewDom, wrapper) {
-  if (wrapper && insideInlineLike && !insideLayout) {
-    var currentNode = wrapper;
-    var boundingRect = currentNode.getBoundingClientRect();
-    return boundingRect.left - pmViewDom.getBoundingClientRect().left;
-  }
-  return 0;
-}
 
 // TODO: Create new fixed image size event
 var getResizeAnalyticsEvent = function getResizeAnalyticsEvent(type, size, layout) {
@@ -130,7 +121,7 @@ var ResizableMediaSingleNext = /*#__PURE__*/function (_React$Component) {
     });
     var initialWidth = props.mediaSingleWidth || DEFAULT_IMAGE_WIDTH;
     _this.state = {
-      offsetLeft: calcOffsetLeft(_this.insideInlineLike, _this.insideLayout, _this.props.view.dom, undefined),
+      offsetLeft: calculateOffsetLeft(_this.insideInlineLike, _this.insideLayout, _this.props.view.dom, undefined),
       // We default to true until we resolve the file type
       isVideoFile: true,
       isResizing: false,
@@ -160,7 +151,7 @@ var ResizableMediaSingleNext = /*#__PURE__*/function (_React$Component) {
   }, {
     key: "componentDidUpdate",
     value: function componentDidUpdate(prevProps, prevState) {
-      var offsetLeft = calcOffsetLeft(this.insideInlineLike, this.insideLayout, this.props.view.dom, this.wrapper);
+      var offsetLeft = calculateOffsetLeft(this.insideInlineLike, this.insideLayout, this.props.view.dom, this.wrapper);
       if (offsetLeft !== this.state.offsetLeft && offsetLeft >= 0) {
         this.setState({
           offsetLeft: offsetLeft
@@ -221,7 +212,12 @@ var ResizableMediaSingleNext = /*#__PURE__*/function (_React$Component) {
       var dom = view.dom;
       var defaultGuidelines = this.getDefaultGuidelines();
       // disable guidelines for nested media single node
-      var dynamicGuidelines = this.isNestedNode() ? [] : generateDynamicGuidelines(view.state, lineLength);
+      var dynamicGuidelines = this.isNestedNode() ? [] : generateDynamicGuidelines(view.state, lineLength, {
+        styles: {
+          lineStyle: 'dashed'
+        },
+        show: false
+      });
       var guidelines = [].concat(_toConsumableArray(defaultGuidelines), _toConsumableArray(dynamicGuidelines));
       var mediaSingleSelector = 'div.mediaSingleView-content-wrap.ProseMirror-selectednode';
       var _dom$getBoundingClien = dom.getBoundingClientRect(),

package/dist/esm/version-wrapper.js

@@ -1,5 +1,5 @@
 export var name = "@atlaskit/editor-core";
-export var version = "187.13.0";
+export var version = "187.13.3";
 export var nextMajorVersion = function nextMajorVersion() {
   return [Number(version.split('.')[0]) + 1, 0, 0].join('.');
 };

package/dist/esm/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/editor-core",
-	"version": "187.13.0",
+	"version": "187.13.3",
 	"sideEffects": false
 }

package/dist/types/plugins/media/ui/ResizableMediaSingle/ResizableMediaSingleNext.d.ts

@@ -15,7 +15,6 @@ type State = {
     size: Dimensions;
 };
 export declare const resizerNextTestId = "mediaSingle.resizerNext.testid";
-export declare function calcOffsetLeft(insideInlineLike: boolean, insideLayout: boolean, pmViewDom: Element, wrapper?: HTMLElement): number;
 type ResizableMediaSingleNextProps = Props & WrappedComponentProps;
 declare class ResizableMediaSingleNext extends React.Component<ResizableMediaSingleNextProps, State> {
     constructor(props: ResizableMediaSingleNextProps);

package/dist/types-ts4.5/plugins/media/ui/ResizableMediaSingle/ResizableMediaSingleNext.d.ts

@@ -15,7 +15,6 @@ type State = {
     size: Dimensions;
 };
 export declare const resizerNextTestId = "mediaSingle.resizerNext.testid";
-export declare function calcOffsetLeft(insideInlineLike: boolean, insideLayout: boolean, pmViewDom: Element, wrapper?: HTMLElement): number;
 type ResizableMediaSingleNextProps = Props & WrappedComponentProps;
 declare class ResizableMediaSingleNext extends React.Component<ResizableMediaSingleNextProps, State> {
     constructor(props: ResizableMediaSingleNextProps);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/editor-core",
-  "version": "187.13.0",
+  "version": "187.13.3",
   "description": "A package contains Atlassian editor core functionality",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -140,7 +140,7 @@
     "@af/editor-libra": "*",
     "@af/integration-testing": "*",
     "@atlaskit/code": "^14.6.0",
-    "@atlaskit/collab-provider": "9.8.0",
+    "@atlaskit/collab-provider": "9.9.0",
     "@atlaskit/dropdown-menu": "^11.11.0",
     "@atlaskit/editor-extension-dropbox": "^0.4.0",
     "@atlaskit/editor-plugin-table": "^2.6.0",

package/dist/cjs/plugins/media/ui/ResizableMediaSingle/guidelines.js

@@ -1,117 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.generateDynamicGuidelines = exports.generateDefaultGuidelines = void 0;
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
-var _memoizeOne = _interopRequireDefault(require("memoize-one"));
-var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
-var _guideline = require("@atlaskit/editor-common/guideline");
-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 mediaSingleSelector = 'div.mediaSingleView-content-wrap:not(.ProseMirror-selectednode)';
-var getDefaultGuidelines = (0, _memoizeOne.default)(function (editorWidth) {
-  return [-6, -5, -4, -3, -2, -1, 0, 1, 2, 3, 4, 5, 6].map(function (val, index) {
-    return {
-      key: "grid_".concat(index),
-      position: {
-        x: val / 12 * editorWidth
-      }
-    };
-  });
-});
-var getWideGuidelines = (0, _memoizeOne.default)(function (editorWidth) {
-  var wideSpacing = editorWidth * _editorSharedStyles.breakoutWideScaleRatio / 2;
-  return [{
-    key: "wide_left",
-    position: {
-      x: -wideSpacing
-    }
-  }, {
-    key: "wide_right",
-    position: {
-      x: wideSpacing
-    }
-  }];
-});
-var getFullWidthGuidelines = (0, _memoizeOne.default)(function (containerWidth) {
-  var fullWidth = Math.min(containerWidth - _editorSharedStyles.akEditorGutterPadding * 2, _editorSharedStyles.akEditorFullWidthLayoutWidth) / 2;
-  return [{
-    key: "full_width_left",
-    position: {
-      x: -fullWidth
-    }
-  }, {
-    key: "full_width_right",
-    position: {
-      x: fullWidth
-    }
-  }];
-});
-var generateDefaultGuidelines = function generateDefaultGuidelines(editorWidth, containerWidth) {
-  var isFullWidthMode = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
-  var innerGrids = getDefaultGuidelines(editorWidth);
-  var wideGuidelines = !isFullWidthMode ? getWideGuidelines(editorWidth) : [];
-  var fullWidthGuidelines = !isFullWidthMode ? getFullWidthGuidelines(containerWidth) : [];
-  return [].concat((0, _toConsumableArray2.default)(innerGrids), (0, _toConsumableArray2.default)(wideGuidelines), (0, _toConsumableArray2.default)(fullWidthGuidelines));
-};
-exports.generateDefaultGuidelines = generateDefaultGuidelines;
-var generateDynamicGuidelines = function generateDynamicGuidelines(view) {
-  var dom = view.dom;
-  var _dom$getBoundingClien = dom.getBoundingClientRect(),
-    width = _dom$getBoundingClien.width;
-  var halfWidth = width / 2;
-  var keyIdx = 0;
-  var dynamicGuidelines = (0, _toConsumableArray2.default)(dom.querySelectorAll(mediaSingleSelector)).map(function (elem, _index) {
-    var pixelWidthAttr = elem.getAttribute('widthType') === 'pixel' ? elem.getAttribute('width') : '';
-    var pixelWidth = parseFloat(pixelWidthAttr || '');
-    if (Number.isNaN(pixelWidth)) {
-      return [];
-    }
-    var commonStyles = {
-      styles: {
-        lineStyle: 'dashed'
-      },
-      show: false
-    };
-    var key = "".concat(_guideline.MEDIA_DYNAMIC_GUIDELINE_PREFIX).concat(++keyIdx);
-    switch (elem.getAttribute('layout')) {
-      case 'align-start':
-      case 'wrap-left':
-        return _objectSpread({
-          position: {
-            x: pixelWidth - halfWidth
-          },
-          key: key
-        }, commonStyles);
-      case 'align-end':
-      case 'wrap-right':
-        return _objectSpread({
-          position: {
-            x: width - pixelWidth - halfWidth
-          },
-          key: key
-        }, commonStyles);
-      case 'center':
-        return [_objectSpread({
-          position: {
-            x: pixelWidth / 2
-          },
-          key: key
-        }, commonStyles), _objectSpread({
-          position: {
-            x: -pixelWidth / 2
-          },
-          key: key
-        }, commonStyles)];
-      // we ignore full-width and wide
-      default:
-        return [];
-    }
-  }).flat();
-  return dynamicGuidelines;
-};
-exports.generateDynamicGuidelines = generateDynamicGuidelines;

package/dist/es2019/plugins/media/ui/ResizableMediaSingle/guidelines.js

@@ -1,108 +0,0 @@
-import memoizeOne from 'memoize-one';
-import { akEditorGutterPadding, akEditorFullWidthLayoutWidth, breakoutWideScaleRatio } from '@atlaskit/editor-shared-styles';
-import { MEDIA_DYNAMIC_GUIDELINE_PREFIX } from '@atlaskit/editor-common/guideline';
-const mediaSingleSelector = 'div.mediaSingleView-content-wrap:not(.ProseMirror-selectednode)';
-const getDefaultGuidelines = memoizeOne(editorWidth => {
-  return [-6, -5, -4, -3, -2, -1, 0, 1, 2, 3, 4, 5, 6].map((val, index) => ({
-    key: `grid_${index}`,
-    position: {
-      x: val / 12 * editorWidth
-    }
-  }));
-});
-const getWideGuidelines = memoizeOne(editorWidth => {
-  const wideSpacing = editorWidth * breakoutWideScaleRatio / 2;
-  return [{
-    key: `wide_left`,
-    position: {
-      x: -wideSpacing
-    }
-  }, {
-    key: `wide_right`,
-    position: {
-      x: wideSpacing
-    }
-  }];
-});
-const getFullWidthGuidelines = memoizeOne(containerWidth => {
-  const fullWidth = Math.min(containerWidth - akEditorGutterPadding * 2, akEditorFullWidthLayoutWidth) / 2;
-  return [{
-    key: `full_width_left`,
-    position: {
-      x: -fullWidth
-    }
-  }, {
-    key: `full_width_right`,
-    position: {
-      x: fullWidth
-    }
-  }];
-});
-export const generateDefaultGuidelines = (editorWidth, containerWidth, isFullWidthMode = false) => {
-  const innerGrids = getDefaultGuidelines(editorWidth);
-  const wideGuidelines = !isFullWidthMode ? getWideGuidelines(editorWidth) : [];
-  const fullWidthGuidelines = !isFullWidthMode ? getFullWidthGuidelines(containerWidth) : [];
-  return [...innerGrids, ...wideGuidelines, ...fullWidthGuidelines];
-};
-export const generateDynamicGuidelines = view => {
-  const {
-    dom
-  } = view;
-  const {
-    width
-  } = dom.getBoundingClientRect();
-  const halfWidth = width / 2;
-  let keyIdx = 0;
-  const dynamicGuidelines = [...dom.querySelectorAll(mediaSingleSelector)].map((elem, _index) => {
-    const pixelWidthAttr = elem.getAttribute('widthType') === 'pixel' ? elem.getAttribute('width') : '';
-    const pixelWidth = parseFloat(pixelWidthAttr || '');
-    if (Number.isNaN(pixelWidth)) {
-      return [];
-    }
-    const commonStyles = {
-      styles: {
-        lineStyle: 'dashed'
-      },
-      show: false
-    };
-    const key = `${MEDIA_DYNAMIC_GUIDELINE_PREFIX}${++keyIdx}`;
-    switch (elem.getAttribute('layout')) {
-      case 'align-start':
-      case 'wrap-left':
-        return {
-          position: {
-            x: pixelWidth - halfWidth
-          },
-          key,
-          ...commonStyles
-        };
-      case 'align-end':
-      case 'wrap-right':
-        return {
-          position: {
-            x: width - pixelWidth - halfWidth
-          },
-          key,
-          ...commonStyles
-        };
-      case 'center':
-        return [{
-          position: {
-            x: pixelWidth / 2
-          },
-          key,
-          ...commonStyles
-        }, {
-          position: {
-            x: -pixelWidth / 2
-          },
-          key,
-          ...commonStyles
-        }];
-      // we ignore full-width and wide
-      default:
-        return [];
-    }
-  }).flat();
-  return dynamicGuidelines;
-};

package/dist/esm/plugins/media/ui/ResizableMediaSingle/guidelines.js

@@ -1,108 +0,0 @@
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
-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 memoizeOne from 'memoize-one';
-import { akEditorGutterPadding, akEditorFullWidthLayoutWidth, breakoutWideScaleRatio } from '@atlaskit/editor-shared-styles';
-import { MEDIA_DYNAMIC_GUIDELINE_PREFIX } from '@atlaskit/editor-common/guideline';
-var mediaSingleSelector = 'div.mediaSingleView-content-wrap:not(.ProseMirror-selectednode)';
-var getDefaultGuidelines = memoizeOne(function (editorWidth) {
-  return [-6, -5, -4, -3, -2, -1, 0, 1, 2, 3, 4, 5, 6].map(function (val, index) {
-    return {
-      key: "grid_".concat(index),
-      position: {
-        x: val / 12 * editorWidth
-      }
-    };
-  });
-});
-var getWideGuidelines = memoizeOne(function (editorWidth) {
-  var wideSpacing = editorWidth * breakoutWideScaleRatio / 2;
-  return [{
-    key: "wide_left",
-    position: {
-      x: -wideSpacing
-    }
-  }, {
-    key: "wide_right",
-    position: {
-      x: wideSpacing
-    }
-  }];
-});
-var getFullWidthGuidelines = memoizeOne(function (containerWidth) {
-  var fullWidth = Math.min(containerWidth - akEditorGutterPadding * 2, akEditorFullWidthLayoutWidth) / 2;
-  return [{
-    key: "full_width_left",
-    position: {
-      x: -fullWidth
-    }
-  }, {
-    key: "full_width_right",
-    position: {
-      x: fullWidth
-    }
-  }];
-});
-export var generateDefaultGuidelines = function generateDefaultGuidelines(editorWidth, containerWidth) {
-  var isFullWidthMode = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
-  var innerGrids = getDefaultGuidelines(editorWidth);
-  var wideGuidelines = !isFullWidthMode ? getWideGuidelines(editorWidth) : [];
-  var fullWidthGuidelines = !isFullWidthMode ? getFullWidthGuidelines(containerWidth) : [];
-  return [].concat(_toConsumableArray(innerGrids), _toConsumableArray(wideGuidelines), _toConsumableArray(fullWidthGuidelines));
-};
-export var generateDynamicGuidelines = function generateDynamicGuidelines(view) {
-  var dom = view.dom;
-  var _dom$getBoundingClien = dom.getBoundingClientRect(),
-    width = _dom$getBoundingClien.width;
-  var halfWidth = width / 2;
-  var keyIdx = 0;
-  var dynamicGuidelines = _toConsumableArray(dom.querySelectorAll(mediaSingleSelector)).map(function (elem, _index) {
-    var pixelWidthAttr = elem.getAttribute('widthType') === 'pixel' ? elem.getAttribute('width') : '';
-    var pixelWidth = parseFloat(pixelWidthAttr || '');
-    if (Number.isNaN(pixelWidth)) {
-      return [];
-    }
-    var commonStyles = {
-      styles: {
-        lineStyle: 'dashed'
-      },
-      show: false
-    };
-    var key = "".concat(MEDIA_DYNAMIC_GUIDELINE_PREFIX).concat(++keyIdx);
-    switch (elem.getAttribute('layout')) {
-      case 'align-start':
-      case 'wrap-left':
-        return _objectSpread({
-          position: {
-            x: pixelWidth - halfWidth
-          },
-          key: key
-        }, commonStyles);
-      case 'align-end':
-      case 'wrap-right':
-        return _objectSpread({
-          position: {
-            x: width - pixelWidth - halfWidth
-          },
-          key: key
-        }, commonStyles);
-      case 'center':
-        return [_objectSpread({
-          position: {
-            x: pixelWidth / 2
-          },
-          key: key
-        }, commonStyles), _objectSpread({
-          position: {
-            x: -pixelWidth / 2
-          },
-          key: key
-        }, commonStyles)];
-      // we ignore full-width and wide
-      default:
-        return [];
-    }
-  }).flat();
-  return dynamicGuidelines;
-};

package/dist/types/plugins/media/ui/ResizableMediaSingle/guidelines.d.ts

@@ -1,4 +0,0 @@
-import type { GuidelineConfig } from '@atlaskit/editor-common/guideline';
-import type { EditorView } from '@atlaskit/editor-prosemirror/view';
-export declare const generateDefaultGuidelines: (editorWidth: number, containerWidth: number, isFullWidthMode?: boolean | undefined) => GuidelineConfig[];
-export declare const generateDynamicGuidelines: (view: EditorView) => GuidelineConfig[];

package/dist/types-ts4.5/plugins/media/ui/ResizableMediaSingle/guidelines.d.ts

@@ -1,4 +0,0 @@
-import type { GuidelineConfig } from '@atlaskit/editor-common/guideline';
-import type { EditorView } from '@atlaskit/editor-prosemirror/view';
-export declare const generateDefaultGuidelines: (editorWidth: number, containerWidth: number, isFullWidthMode?: boolean | undefined) => GuidelineConfig[];
-export declare const generateDynamicGuidelines: (view: EditorView) => GuidelineConfig[];