@atlaskit/editor-common 72.2.0 → 72.2.2

package/dist/esm/ui/OverflowShadow/shadowObserver.js

@@ -2,87 +2,63 @@ import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
 import _createClass from "@babel/runtime/helpers/createClass";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 export var ShadowKeys;
-
 (function (ShadowKeys) {
   ShadowKeys["SHOW_LEFT_SHADOW"] = "showLeftShadow";
   ShadowKeys["SHOW_RIGHT_SHADOW"] = "showRightShadow";
 })(ShadowKeys || (ShadowKeys = {}));
-
 export var shadowObserverClassNames = {
   SENTINEL_LEFT: 'sentinel-left',
   SENTINEL_RIGHT: 'sentinel-right',
   SHADOW_CONTAINER: 'with-shadow-observer'
 };
-
 var requestIdleCallback = function requestIdleCallback(fn) {
   return window.requestIdleCallback ? window.requestIdleCallback(fn) : window.requestAnimationFrame(fn);
 };
-
 var cancelIdleCallback = function cancelIdleCallback(id) {
   return window.cancelIdleCallback ? window.cancelIdleCallback(id) : window.cancelAnimationFrame(id);
 };
-
 export var ShadowObserver = /*#__PURE__*/function () {
   function ShadowObserver(_ref) {
     var _defineProperty2,
-        _this = this;
-
+      _this = this;
     var scrollContainer = _ref.scrollContainer,
-        onUpdateShadows = _ref.onUpdateShadows;
-
+      onUpdateShadows = _ref.onUpdateShadows;
     _classCallCheck(this, ShadowObserver);
-
     _defineProperty(this, "sentinels", {});
-
     _defineProperty(this, "shadowStates", (_defineProperty2 = {}, _defineProperty(_defineProperty2, ShadowKeys.SHOW_LEFT_SHADOW, false), _defineProperty(_defineProperty2, ShadowKeys.SHOW_RIGHT_SHADOW, false), _defineProperty2));
-
     _defineProperty(this, "init", function () {
       if (!_this.scrollContainer || _this.intersectionObserver) {
         return;
       }
-
       _this.sentinels.right = document.createElement('div');
-
       _this.sentinels.right.classList.add(shadowObserverClassNames.SENTINEL_RIGHT);
-
       _this.scrollContainer.appendChild(_this.sentinels.right);
-
       _this.sentinels.left = document.createElement('div');
-
       _this.sentinels.left.classList.add(shadowObserverClassNames.SENTINEL_LEFT);
-
       _this.scrollContainer.prepend(_this.sentinels.left);
-
       _this.intersectionObserver = new IntersectionObserver(function (entries, _) {
         entries.forEach(_this.onIntersect);
       }, {
         root: _this.scrollContainer
       });
-
       _this.intersectionObserver.observe(_this.sentinels.left);
-
       _this.intersectionObserver.observe(_this.sentinels.right);
     });
-
     _defineProperty(this, "onIntersect", function (entry) {
       _this.requestCallbackId = requestIdleCallback(function () {
         if (entry.target.classList.contains(shadowObserverClassNames.SENTINEL_LEFT)) {
           _this.shadowStates[ShadowKeys.SHOW_LEFT_SHADOW] = !entry.isIntersecting;
         }
-
         if (entry.target.classList.contains(shadowObserverClassNames.SENTINEL_RIGHT)) {
           _this.shadowStates[ShadowKeys.SHOW_RIGHT_SHADOW] = !entry.isIntersecting;
         }
-
         _this.onUpdateShadows(_this.shadowStates);
       });
     });
-
     this.scrollContainer = scrollContainer;
     this.onUpdateShadows = onUpdateShadows;
     this.init();
   }
-
   _createClass(ShadowObserver, [{
     key: "dispose",
     value: function dispose() {
@@ -93,6 +69,5 @@ export var ShadowObserver = /*#__PURE__*/function () {
       }
     }
   }]);
-
   return ShadowObserver;
 }();

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

@@ -5,77 +5,53 @@ import _inherits from "@babel/runtime/helpers/inherits";
 import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
 import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
 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; }
-
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(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; } }
-
 import React from 'react';
 import createFocusTrap from 'focus-trap';
 import rafSchedule from 'raf-schd';
 import { createPortal } from 'react-dom';
 import { akEditorFloatingPanelZIndex } from '@atlaskit/editor-shared-styles';
 import { calculatePlacement, calculatePosition as _calculatePosition, findOverflowScrollParent, validatePosition } from './utils';
-
 var Popup = /*#__PURE__*/function (_React$Component) {
   _inherits(Popup, _React$Component);
-
   var _super = _createSuper(Popup);
-
   function Popup() {
     var _window;
-
     var _this;
-
     _classCallCheck(this, Popup);
-
     for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
       args[_key] = arguments[_key];
     }
-
     _this = _super.call.apply(_super, [this].concat(args));
-
     _defineProperty(_assertThisInitialized(_this), "rafIds", new Set());
-
     _defineProperty(_assertThisInitialized(_this), "state", {
       validPosition: true
     });
-
     _defineProperty(_assertThisInitialized(_this), "popupRef", /*#__PURE__*/React.createRef());
-
     _defineProperty(_assertThisInitialized(_this), "placement", ['', '']);
-
     _defineProperty(_assertThisInitialized(_this), "handleRef", function (popup) {
       if (!popup) {
         return;
       }
-
       _this.initPopup(popup);
     });
-
     _defineProperty(_assertThisInitialized(_this), "scheduledUpdatePosition", rafSchedule(function (props) {
       _this.updatePosition(_this.props);
     }));
-
     _defineProperty(_assertThisInitialized(_this), "onResize", function () {
       return _this.scheduledUpdatePosition(_this.props);
     });
-
     _defineProperty(_assertThisInitialized(_this), "resizeObserver", (_window = window) !== null && _window !== void 0 && _window.ResizeObserver ? new ResizeObserver(function () {
       _this.scheduledUpdatePosition(_this.props);
     }) : undefined);
-
     _defineProperty(_assertThisInitialized(_this), "initFocusTrap", rafSchedule(function () {
       var popup = _this.popupRef.current;
-
       if (!popup) {
         return;
       }
-
       var trapConfig = {
         clickOutsideDeactivates: true,
         escapeDeactivates: true,
@@ -84,13 +60,10 @@ var Popup = /*#__PURE__*/function (_React$Component) {
         returnFocusOnDeactivate: false
       };
       _this.focusTrap = createFocusTrap(popup, trapConfig);
-
       _this.focusTrap.activate();
     }));
-
     return _this;
   }
-
   _createClass(Popup, [{
     key: "calculatePosition",
     value:
@@ -99,31 +72,27 @@ var Popup = /*#__PURE__*/function (_React$Component) {
      */
     function calculatePosition(props, popup) {
       var target = props.target,
-          fitHeight = props.fitHeight,
-          fitWidth = props.fitWidth,
-          boundariesElement = props.boundariesElement,
-          offset = props.offset,
-          onPositionCalculated = props.onPositionCalculated,
-          onPlacementChanged = props.onPlacementChanged,
-          alignX = props.alignX,
-          alignY = props.alignY,
-          stick = props.stick,
-          forcePlacement = props.forcePlacement,
-          allowOutOfBounds = props.allowOutOfBounds,
-          rect = props.rect,
-          preventOverflow = props.preventOverflow;
-
+        fitHeight = props.fitHeight,
+        fitWidth = props.fitWidth,
+        boundariesElement = props.boundariesElement,
+        offset = props.offset,
+        onPositionCalculated = props.onPositionCalculated,
+        onPlacementChanged = props.onPlacementChanged,
+        alignX = props.alignX,
+        alignY = props.alignY,
+        stick = props.stick,
+        forcePlacement = props.forcePlacement,
+        allowOutOfBounds = props.allowOutOfBounds,
+        rect = props.rect,
+        preventOverflow = props.preventOverflow;
       if (!target || !popup) {
         return {};
       }
-
       var placement = calculatePlacement(target, boundariesElement || document.body, fitWidth, fitHeight, alignX, alignY, forcePlacement, preventOverflow);
-
       if (onPlacementChanged && this.placement.join('') !== placement.join('')) {
         onPlacementChanged(placement);
         this.placement = placement;
       }
-
       var position = _calculatePosition({
         placement: placement,
         popup: popup,
@@ -133,7 +102,6 @@ var Popup = /*#__PURE__*/function (_React$Component) {
         allowOutOfBounds: allowOutOfBounds,
         rect: rect
       });
-
       position = onPositionCalculated ? onPositionCalculated(position) : position;
       return {
         position: position,
@@ -146,11 +114,9 @@ var Popup = /*#__PURE__*/function (_React$Component) {
       var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.props;
       var state = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : this.state;
       var popup = state.popup;
-
       var _this$calculatePositi = this.calculatePosition(props, popup),
-          position = _this$calculatePositi.position,
-          validPosition = _this$calculatePositi.validPosition;
-
+        position = _this$calculatePositi.position,
+        validPosition = _this$calculatePositi.validPosition;
       if (position && validPosition) {
         this.setState({
           position: position,
@@ -171,22 +137,20 @@ var Popup = /*#__PURE__*/function (_React$Component) {
        */
       return !target || document.body.contains(target) && popup.offsetParent && !popup.offsetParent.contains(target) || overflowScrollParent && !overflowScrollParent.contains(popup.offsetParent);
     }
+
     /**
      * Popup initialization.
      * Checks whether it's possible to position popup along given target, and if it's not throws an error.
      */
-
   }, {
     key: "initPopup",
     value: function initPopup(popup) {
       this.popupRef.current = popup;
       var target = this.props.target;
       var overflowScrollParent = findOverflowScrollParent(popup);
-
       if (this.cannotSetPopup(popup, target, overflowScrollParent)) {
         return;
       }
-
       this.setState({
         popup: popup
       });
@@ -201,9 +165,7 @@ var Popup = /*#__PURE__*/function (_React$Component) {
        * So, calling scheduledUpdatePosition to position popup on next request animation frame,
        * which is currently working for most of the floating toolbar and other popups.
        */
-
       this.scheduledUpdatePosition(this.props);
-
       if (this.props.focusTrap) {
         this.initFocusTrap();
       }
@@ -224,14 +186,13 @@ var Popup = /*#__PURE__*/function (_React$Component) {
      */
     function destroyFocusTrap() {
       var _this$focusTrap;
-
       this.initFocusTrap.cancel();
       (_this$focusTrap = this.focusTrap) === null || _this$focusTrap === void 0 ? void 0 : _this$focusTrap.deactivate();
     }
+
     /**
      * Handle pausing, unpausing, and initialising (if not yet initialised) of the focus trap
      */
-
   }, {
     key: "handleChangedFocusTrapProp",
     value: function handleChangedFocusTrapProp(prevProps) {
@@ -239,16 +200,15 @@ var Popup = /*#__PURE__*/function (_React$Component) {
         // If currently set to disable, then pause the trap if it exists
         if (!this.props.focusTrap) {
           var _this$focusTrap2;
-
           return (_this$focusTrap2 = this.focusTrap) === null || _this$focusTrap2 === void 0 ? void 0 : _this$focusTrap2.pause();
-        } // If set to enabled and trap already exists, unpause
-
+        }
 
+        // If set to enabled and trap already exists, unpause
         if (this.focusTrap) {
           this.focusTrap.unpause();
-        } // Else initialise the focus trap
-
+        }
 
+        // Else initialise the focus trap
         return this.initFocusTrap();
       }
     }
@@ -263,17 +223,14 @@ var Popup = /*#__PURE__*/function (_React$Component) {
       window.addEventListener('resize', this.onResize);
       var stick = this.props.stick;
       this.scrollParentElement = findOverflowScrollParent(this.props.target);
-
       if (this.scrollParentElement && this.resizeObserver) {
         this.resizeObserver.observe(this.scrollParentElement);
       }
-
       if (stick) {
         this.scrollElement = this.scrollParentElement;
       } else {
         this.scrollElement = this.props.scrollableElement;
       }
-
       if (this.scrollElement) {
         this.scrollElement.addEventListener('scroll', this.onResize);
       }
@@ -282,15 +239,12 @@ var Popup = /*#__PURE__*/function (_React$Component) {
     key: "componentWillUnmount",
     value: function componentWillUnmount() {
       window.removeEventListener('resize', this.onResize);
-
       if (this.scrollElement) {
         this.scrollElement.removeEventListener('scroll', this.onResize);
       }
-
       if (this.scrollParentElement && this.resizeObserver) {
         this.resizeObserver.unobserve(this.scrollParentElement);
       }
-
       this.scheduledUpdatePosition.cancel();
       this.destroyFocusTrap();
     }
@@ -299,18 +253,17 @@ var Popup = /*#__PURE__*/function (_React$Component) {
     value: function renderPopup() {
       var position = this.state.position;
       var shouldRenderPopup = this.props.shouldRenderPopup;
-
       if (shouldRenderPopup && !shouldRenderPopup(position || {})) {
         return null;
       }
-
       return /*#__PURE__*/React.createElement("div", {
         ref: this.handleRef,
         style: _objectSpread(_objectSpread({
           position: 'absolute',
           zIndex: this.props.zIndex || akEditorFloatingPanelZIndex
         }, position), this.props.style),
-        "aria-label": this.props.ariaLabel || 'Popup' // Indicates component is an editor pop. Required for focus handling in Message.tsx
+        "aria-label": this.props.ariaLabel || 'Popup'
+        // Indicates component is an editor pop. Required for focus handling in Message.tsx
         ,
         "data-editor-popup": true
       }, this.props.children);
@@ -319,31 +272,26 @@ var Popup = /*#__PURE__*/function (_React$Component) {
     key: "render",
     value: function render() {
       var _this$props = this.props,
-          target = _this$props.target,
-          mountTo = _this$props.mountTo;
+        target = _this$props.target,
+        mountTo = _this$props.mountTo;
       var validPosition = this.state.validPosition;
-
       if (!target || !validPosition) {
         return null;
       }
-
       if (mountTo) {
         return /*#__PURE__*/createPortal(this.renderPopup(), mountTo);
-      } // Without mountTo property renders popup as is,
-      // which means it will be cropped by "overflow: hidden" container.
-
+      }
 
+      // Without mountTo property renders popup as is,
+      // which means it will be cropped by "overflow: hidden" container.
       return this.renderPopup();
     }
   }]);
-
   return Popup;
 }(React.Component);
-
 _defineProperty(Popup, "defaultProps", {
   offset: [0, 0],
   allowOutOfBound: false
 });
-
 export { Popup as default };
 export { findOverflowScrollParent } from './utils';