@atlaskit/editor-common 72.1.2 → 72.2.1

package/dist/esm/ui/Layer/internal/helpers.js

@@ -52,11 +52,9 @@ export var POSITION_ATTRIBUTE_ENUM = {
   values: ['top left', 'top center', 'top right', 'right top', 'right middle', 'right bottom', 'bottom left', 'bottom center', 'bottom right', 'left top', 'left middle', 'left bottom'],
   default: 'right middle'
 };
-
 function positionToPopper(position) {
   return position && positionMap[position] ? positionMap[position].position : null;
 }
-
 export function positionPropToPopperPosition(position) {
   return positionToPopper(position) || positionMap[POSITION_ATTRIBUTE_ENUM.default].position;
 }

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

@@ -1,5 +1,4 @@
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
-
 /** @jsx jsx */
 import React from 'react';
 import { jsx } from '@emotion/react';
@@ -15,36 +14,32 @@ export var shouldAddDefaultWrappedWidth = function shouldAddDefaultWrappedWidth(
 };
 export default function MediaSingle(_ref) {
   var layout = _ref.layout,
-      width = _ref.width,
-      height = _ref.height,
-      _ref$containerWidth = _ref.containerWidth,
-      containerWidth = _ref$containerWidth === void 0 ? width : _ref$containerWidth,
-      _ref$isLoading = _ref.isLoading,
-      isLoading = _ref$isLoading === void 0 ? false : _ref$isLoading,
-      pctWidth = _ref.pctWidth,
-      className = _ref.className,
-      propsChildren = _ref.children,
-      _ref$nodeType = _ref.nodeType,
-      nodeType = _ref$nodeType === void 0 ? 'mediaSingle' : _ref$nodeType,
-      fullWidthMode = _ref.fullWidthMode,
-      lineLength = _ref.lineLength,
-      _ref$hasFallbackConta = _ref.hasFallbackContainer,
-      hasFallbackContainer = _ref$hasFallbackConta === void 0 ? true : _ref$hasFallbackConta,
-      handleMediaSingleRef = _ref.handleMediaSingleRef;
+    width = _ref.width,
+    height = _ref.height,
+    _ref$containerWidth = _ref.containerWidth,
+    containerWidth = _ref$containerWidth === void 0 ? width : _ref$containerWidth,
+    _ref$isLoading = _ref.isLoading,
+    isLoading = _ref$isLoading === void 0 ? false : _ref$isLoading,
+    pctWidth = _ref.pctWidth,
+    className = _ref.className,
+    propsChildren = _ref.children,
+    _ref$nodeType = _ref.nodeType,
+    nodeType = _ref$nodeType === void 0 ? 'mediaSingle' : _ref$nodeType,
+    fullWidthMode = _ref.fullWidthMode,
+    lineLength = _ref.lineLength,
+    _ref$hasFallbackConta = _ref.hasFallbackContainer,
+    hasFallbackContainer = _ref$hasFallbackConta === void 0 ? true : _ref$hasFallbackConta,
+    handleMediaSingleRef = _ref.handleMediaSingleRef;
   var children = React.Children.toArray(propsChildren);
-
   if (!pctWidth && shouldAddDefaultWrappedWidth(layout, width, lineLength)) {
     pctWidth = 50;
-  } // When width is not set we have an absolute height for a given embed.
+  }
+  // When width is not set we have an absolute height for a given embed.
   // When both width and height are set we use them to determine ratio and use that to define
   // embed height in relation to whatever width of an dom element is in runtime
-
-
   var isHeightOnly = width === undefined;
-
   if (pctWidth) {
     var pxWidth = Math.ceil(calcPxFromPct(pctWidth / 100, lineLength || containerWidth || 0));
-
     if (isHeightOnly) {
       width = pxWidth - akEditorMediaResizeHandlerPaddingWide;
     } else if (width !== undefined) {
@@ -53,37 +48,35 @@ export default function MediaSingle(_ref) {
     }
   } else if (isHeightOnly) {
     // No pctWidth can be found on already existing pages with existing embeds
+
     // It's ok to use Embed specific width, because width can be not set only in embed card.
     // This value will be used only in the case of non `wide` and non `full-width` cases inside MediaSingleDimensionHelper.
     width = DEFAULT_EMBED_CARD_WIDTH - akEditorMediaResizeHandlerPaddingWide;
-  } // Media wrapper controls the height of the box.
+  }
+
+  // Media wrapper controls the height of the box.
   // We can define this height
   // - via height directly
   // - via paddingBottom (if we have both height and width) which is a css trick to represent a ratio
-
-
   var mediaWrapperHeight;
   var paddingBottom;
-
   if (isHeightOnly) {
     mediaWrapperHeight = height;
   } else if (width !== undefined) {
     var mediaWrapperRatio = height / width * 100;
     paddingBottom = "".concat(mediaWrapperRatio.toFixed(3), "%");
-
     if (nodeType === 'embedCard') {
       // we want to set ratio of whole box (including header) buy knowing ratio of iframe itself
+
       // For some reason importing `embedHeaderHeight` from '@atlaskit/smart-card' breaks
       // packages/editor/editor-core/src/plugins/table/__tests__/unit/toolbar.ts 🤷‍️, but we have a test
       // that uses imported value, so it's should be good.
       paddingBottom = "calc(".concat(paddingBottom, " + 32px)");
     }
   }
-
   var _children = _slicedToArray(children, 2),
-      media = _children[0],
-      caption = _children[1];
-
+    media = _children[0],
+    caption = _children[1];
   return jsx("div", {
     ref: handleMediaSingleRef,
     css: MediaSingleDimensionHelper({

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

@@ -1,6 +1,4 @@
 import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
-
 var _templateObject;
-
 import { css } from '@emotion/react';
 export var mediaLinkStyle = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  position: absolute;\n  background: transparent;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: 0;\n  cursor: pointer;\n  width: 100%;\n  height: 100%;\n"])));

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

@@ -1,35 +1,29 @@
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
 var _excluded = ["children"];
-
 var _templateObject, _templateObject2, _templateObject3;
-
 /** @jsx jsx */
 import React from 'react';
 import { css, jsx } from '@emotion/react';
 import { akEditorFullPageMaxWidth, akEditorFullWidthLayoutWidth } from '@atlaskit/editor-shared-styles';
 import { calcBreakoutWidth, calcWideWidth } from '../../utils/breakout';
-
 function float(layout) {
   switch (layout) {
     case 'wrap-right':
       return 'right';
-
     case 'wrap-left':
       return 'left';
-
     default:
       return 'none';
   }
 }
-
 function getWidthIfFullWidthMode(width) {
   return width > akEditorFullWidthLayoutWidth ? '100%' : "".concat(width, "px");
 }
-
 function getWidthIfDefaultMode(width) {
   return width > akEditorFullPageMaxWidth ? '100%' : "".concat(width, "px");
 }
+
 /**
  * Calculates the image width for non-resized images.
  *
@@ -37,120 +31,98 @@ function getWidthIfDefaultMode(width) {
  * then an image in wide or full-width can not be wider than the image's
  * original width.
  */
-
-
 export function calcLegacyWidth(layout, width) {
   var containerWidth = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
   var fullWidthMode = arguments.length > 3 ? arguments[3] : undefined;
   var isResized = arguments.length > 4 ? arguments[4] : undefined;
-
   switch (layout) {
     case 'align-start':
     case 'align-end':
     case 'wrap-right':
     case 'wrap-left':
       return width > containerWidth / 2 ? 'calc(50% - 12px)' : "".concat(width, "px");
-
     case 'wide':
       return calcWideWidth(containerWidth);
-
     case 'full-width':
       return calcBreakoutWidth(layout, containerWidth);
-
     default:
       return isResized ? "".concat(width, "px") : fullWidthMode ? getWidthIfFullWidthMode(width) : getWidthIfDefaultMode(width);
   }
 }
+
 /**
  * Calculates the image width for previously resized images.
  *
  * Wide and full-width images are always that size (960px and 100%); there is
  * no distinction between max-width and width.
  */
-
 export function calcResizedWidth(layout, width) {
   var containerWidth = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
-
   switch (layout) {
     case 'wide':
       return calcWideWidth(containerWidth);
-
     case 'full-width':
       return calcBreakoutWidth(layout, containerWidth);
-
     default:
       return "".concat(width, "px");
   }
 }
-
 function calcMaxWidth(layout, containerWidth) {
   switch (layout) {
     case 'wide':
       return calcWideWidth(containerWidth);
-
     case 'full-width':
       return calcBreakoutWidth(layout, containerWidth);
-
     default:
       return '100%';
   }
 }
-
 function calcMargin(layout) {
   switch (layout) {
     case 'wrap-right':
       return '12px auto 12px 12px';
-
     case 'wrap-left':
       return '12px 12px 12px auto';
-
     default:
       return '24px auto';
   }
 }
-
 function isImageAligned(layout) {
   switch (layout) {
     case 'align-end':
       return 'margin-right: 0';
-
     case 'align-start':
       return 'margin-left: 0';
-
     default:
       return '';
   }
 }
-
 /**
  * Can't use `.attrs` to handle highly dynamic styles because we are still
  * supporting `styled-components` v1.
  */
 export var MediaSingleDimensionHelper = function MediaSingleDimensionHelper(_ref) {
   var _ref$containerWidth = _ref.containerWidth,
-      containerWidth = _ref$containerWidth === void 0 ? 0 : _ref$containerWidth,
-      fullWidthMode = _ref.fullWidthMode,
-      isResized = _ref.isResized,
-      layout = _ref.layout,
-      pctWidth = _ref.pctWidth,
-      width = _ref.width;
+    containerWidth = _ref$containerWidth === void 0 ? 0 : _ref$containerWidth,
+    fullWidthMode = _ref.fullWidthMode,
+    isResized = _ref.isResized,
+    layout = _ref.layout,
+    pctWidth = _ref.pctWidth,
+    width = _ref.width;
   return css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  /* For nested rich media items, set max-width to 100% */\n  tr &,\n  [data-layout-column] &,\n  [data-node-type='expand'] & {\n    max-width: 100%;\n  }\n\n  width: ", ";\n  max-width: ", ";\n  float: ", ";\n  margin: ", ";\n  ", ";\n\n  &:not(.is-resizing) {\n    transition: width 100ms ease-in;\n  }\n"])), pctWidth ? calcResizedWidth(layout, width || 0, containerWidth) : calcLegacyWidth(layout, width || 0, containerWidth, fullWidthMode, isResized), calcMaxWidth(layout, containerWidth), float(layout), calcMargin(layout), isImageAligned(layout));
 };
-
 var RenderFallbackContainer = function RenderFallbackContainer(_ref2) {
   var hasFallbackContainer = _ref2.hasFallbackContainer,
-      paddingBottom = _ref2.paddingBottom,
-      height = _ref2.height;
+    paddingBottom = _ref2.paddingBottom,
+    height = _ref2.height;
   return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  ", "\n"])), hasFallbackContainer ? "\n  &::after {\n    content: '';\n    display: block;\n    ".concat(height ? "height: ".concat(height, "px;") : paddingBottom ? "padding-bottom: ".concat(paddingBottom, ";") : '', "\n\n    /* Fixes extra padding problem in Firefox */\n    font-size: 0;\n    line-height: 0;\n  }\n  ") : '');
 };
-
 export var mediaWrapperStyle = function mediaWrapperStyle(props) {
   return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  position: relative;\n\n  ", "\n\n  /* Editor */\n  & > figure {\n    position: ", ";\n    height: 100%;\n    width: 100%;\n  }\n\n  & > div {\n    position: ", ";\n    height: 100%;\n    width: 100%;\n  }\n\n  &[data-node-type='embedCard'] > div {\n    width: 100%;\n  }\n\n  /* Renderer */\n  [data-node-type='media'] {\n    position: static !important;\n\n    > div {\n      position: absolute;\n      height: 100%;\n    }\n  }\n"])), RenderFallbackContainer(props), props.hasFallbackContainer ? 'absolute' : 'relative', props.hasFallbackContainer ? 'absolute' : 'relative');
 };
 export var MediaWrapper = function MediaWrapper(_ref3) {
   var children = _ref3.children,
-      rest = _objectWithoutProperties(_ref3, _excluded);
-
+    rest = _objectWithoutProperties(_ref3, _excluded);
   return jsx("div", {
     css: mediaWrapperStyle(rest)
   }, children);

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

@@ -5,35 +5,26 @@ 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 _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, { PureComponent } from 'react';
 import { ProviderFactory, WithProviders } from '../../provider-factory';
 import MentionWithProviders from './mention-with-providers';
-
 var Mention = /*#__PURE__*/function (_PureComponent) {
   _inherits(Mention, _PureComponent);
-
   var _super = _createSuper(Mention);
-
   function Mention(props) {
     var _this;
-
     _classCallCheck(this, Mention);
-
     _this = _super.call(this, props);
-
     _defineProperty(_assertThisInitialized(_this), "renderWithProvider", function (providers) {
       var _this$props = _this.props,
-          accessLevel = _this$props.accessLevel,
-          eventHandlers = _this$props.eventHandlers,
-          id = _this$props.id,
-          text = _this$props.text;
+        accessLevel = _this$props.accessLevel,
+        eventHandlers = _this$props.eventHandlers,
+        id = _this$props.id,
+        text = _this$props.text;
       var mentionProvider = providers.mentionProvider,
-          profilecardProvider = providers.profilecardProvider;
+        profilecardProvider = providers.profilecardProvider;
       return /*#__PURE__*/React.createElement(MentionWithProviders, {
         id: id,
         text: text,
@@ -43,11 +34,9 @@ var Mention = /*#__PURE__*/function (_PureComponent) {
         profilecardProvider: profilecardProvider
       });
     });
-
     _this.providerFactory = props.providers || new ProviderFactory();
     return _this;
   }
-
   _createClass(Mention, [{
     key: "componentWillUnmount",
     value: function componentWillUnmount() {
@@ -67,8 +56,6 @@ var Mention = /*#__PURE__*/function (_PureComponent) {
       });
     }
   }]);
-
   return Mention;
 }(PureComponent);
-
 export { Mention as default };

package/dist/esm/ui/Mention/mention-with-profilecard.js

@@ -3,15 +3,15 @@ import { ResourcedMention } from '@atlaskit/mention';
 import ProfileCardTrigger from '@atlaskit/profilecard/user';
 export default function MentionWithProfileCard(_ref) {
   var id = _ref.id,
-      text = _ref.text,
-      accessLevel = _ref.accessLevel,
-      mentionProvider = _ref.mentionProvider,
-      profilecardProvider = _ref.profilecardProvider,
-      onClick = _ref.onClick,
-      onMouseEnter = _ref.onMouseEnter,
-      onMouseLeave = _ref.onMouseLeave;
+    text = _ref.text,
+    accessLevel = _ref.accessLevel,
+    mentionProvider = _ref.mentionProvider,
+    profilecardProvider = _ref.profilecardProvider,
+    onClick = _ref.onClick,
+    onMouseEnter = _ref.onMouseEnter,
+    onMouseLeave = _ref.onMouseLeave;
   var cloudId = profilecardProvider.cloudId,
-      resourceClient = profilecardProvider.resourceClient;
+    resourceClient = profilecardProvider.resourceClient;
   var actions = useMemo(function () {
     return profilecardProvider.getActions(id, text, accessLevel);
   }, [accessLevel, id, profilecardProvider, text]);

package/dist/esm/ui/Mention/mention-with-providers.js

@@ -6,41 +6,28 @@ 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 _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, { PureComponent } from 'react';
 import { ResourcedMention } from '@atlaskit/mention/element';
 import ResourcedMentionWithProfilecard from './mention-with-profilecard';
 var GENERIC_USER_IDS = ['HipChat', 'all', 'here'];
-
 var noop = function noop() {};
-
 var MentionWithProviders = /*#__PURE__*/function (_PureComponent) {
   _inherits(MentionWithProviders, _PureComponent);
-
   var _super = _createSuper(MentionWithProviders);
-
   function MentionWithProviders() {
     var _this;
-
     _classCallCheck(this, MentionWithProviders);
-
     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), "state", {
       profilecardProvider: null
     });
-
     return _this;
   }
-
   _createClass(MentionWithProviders, [{
     key: "UNSAFE_componentWillMount",
     value: function UNSAFE_componentWillMount() {
@@ -57,7 +44,6 @@ var MentionWithProviders = /*#__PURE__*/function (_PureComponent) {
     key: "updateProfilecardProvider",
     value: function updateProfilecardProvider(props) {
       var _this2 = this;
-
       // We are not using async/await here to avoid having an intermediate Promise
       // introduced by the transpiler.
       // This will allow consumer to use a SynchronousPromise.resolve and avoid useless
@@ -82,11 +68,11 @@ var MentionWithProviders = /*#__PURE__*/function (_PureComponent) {
     key: "render",
     value: function render() {
       var _this$props = this.props,
-          accessLevel = _this$props.accessLevel,
-          eventHandlers = _this$props.eventHandlers,
-          id = _this$props.id,
-          mentionProvider = _this$props.mentionProvider,
-          text = _this$props.text;
+        accessLevel = _this$props.accessLevel,
+        eventHandlers = _this$props.eventHandlers,
+        id = _this$props.id,
+        mentionProvider = _this$props.mentionProvider,
+        text = _this$props.text;
       var profilecardProvider = this.state.profilecardProvider;
       var actionHandlers = {};
       ['onClick', 'onMouseEnter', 'onMouseLeave'].forEach(function (handler) {
@@ -102,8 +88,6 @@ var MentionWithProviders = /*#__PURE__*/function (_PureComponent) {
       }, actionHandlers));
     }
   }]);
-
   return MentionWithProviders;
 }(PureComponent);
-
 export { MentionWithProviders as default };

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

@@ -1,8 +1,7 @@
 import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
-
 var _templateObject, _templateObject2, _templateObject3, _templateObject4;
-
 /** @jsx jsx */
+
 import { css, jsx } from '@emotion/react';
 import SuccessIcon from '@atlaskit/icon/glyph/editor/success';
 import ErrorIcon from '@atlaskit/icon/glyph/error';
@@ -11,11 +10,9 @@ import { gridSize } from '@atlaskit/theme/constants';
 import { h200 } from '@atlaskit/theme/typography';
 var errorColor = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  color: ", ";\n"])), "var(--ds-text-danger, ".concat(R400, ")"));
 var validColor = css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  color: ", ";\n"])), "var(--ds-text-success, ".concat(G400, ")"));
-
 var messageStyle = function messageStyle(props) {
   return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  ", " font-weight: normal;\n  color: ", ";\n  margin-top: ", "px;\n  display: flex;\n  justify-content: baseline;\n"])), h200(props), "var(--ds-text-subtlest, ".concat(N200, ")"), gridSize() / 2);
 };
-
 var iconWrapperStyle = css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  display: flex;\n  margin-right: 4px;\n"])));
 export var HelperMessage = function HelperMessage(_ref) {
   var children = _ref.children;

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

@@ -6,11 +6,8 @@ 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 _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 { ShadowObserver, shadowObserverClassNames } from './shadowObserver';
 export var shadowClassNames = {
@@ -20,131 +17,96 @@ export var shadowClassNames = {
 export default function overflowShadow(Component, options) {
   return /*#__PURE__*/function (_React$Component) {
     _inherits(OverflowShadow, _React$Component);
-
     var _super = _createSuper(OverflowShadow);
-
     function OverflowShadow() {
       var _this;
-
       _classCallCheck(this, OverflowShadow);
-
       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), "overflowContainerWidth", 0);
-
       _defineProperty(_assertThisInitialized(_this), "state", {
         showLeftShadow: false,
         showRightShadow: false
       });
-
       _defineProperty(_assertThisInitialized(_this), "handleScroll", function (event) {
         if (!_this.overflowContainer || event.target !== _this.overflowContainer || options.useShadowObserver) {
           return;
         }
-
         _this.updateShadows();
       });
-
       _defineProperty(_assertThisInitialized(_this), "updateShadows", function () {
         if (options.useShadowObserver) {
           return;
         }
-
         _this.setState(function (prevState) {
           if (!_this.overflowContainer) {
             return;
           }
-
           var diff = _this.calcOverflowDiff();
-
           var showRightShadow = diff > 0 && diff > _this.overflowContainer.scrollLeft;
-
           var showLeftShadow = _this.showLeftShadow(_this.overflowContainer);
-
           if (showLeftShadow !== prevState.showLeftShadow || showRightShadow !== _this.state.showRightShadow) {
             return {
               showLeftShadow: showLeftShadow,
               showRightShadow: showRightShadow
             };
           }
-
           return null;
         });
       });
-
       _defineProperty(_assertThisInitialized(_this), "showLeftShadow", function (overflowContainer) {
         return !!overflowContainer && overflowContainer.scrollLeft > 0;
       });
-
       _defineProperty(_assertThisInitialized(_this), "calcOverflowDiff", function () {
         if (!_this.overflowContainer) {
           return 0;
         }
-
         _this.diff = _this.calcScrollableWidth();
         return _this.diff - _this.overflowContainer.offsetWidth;
       });
-
       _defineProperty(_assertThisInitialized(_this), "calcScrollableWidth", function () {
         if (!_this.scrollable && _this.overflowContainer) {
           return _this.overflowContainer.scrollWidth;
         }
-
         if (!_this.scrollable) {
           return 0;
         }
-
         var width = 0;
-
         for (var i = 0; i < _this.scrollable.length; i++) {
           var scrollableElement = _this.scrollable[i];
           width += scrollableElement.scrollWidth;
         }
-
         return width;
       });
-
       _defineProperty(_assertThisInitialized(_this), "handleContainer", function (container) {
         if (!container || _this.container) {
           return;
         }
-
         _this.container = container;
         _this.overflowContainer = container.querySelector(options.overflowSelector);
-
         if (!_this.overflowContainer) {
           _this.overflowContainer = container;
         }
-
         if (options.useShadowObserver) {
           _this.initShadowObserver();
-
           return;
         }
-
         _this.updateShadows();
-
         _this.overflowContainer.addEventListener('scroll', _this.handleScroll);
       });
-
       return _this;
     }
-
     _createClass(OverflowShadow, [{
       key: "componentWillUnmount",
       value: function componentWillUnmount() {
         if (options.useShadowObserver) {
           return this.shadowObserver && this.shadowObserver.dispose();
         }
-
         if (this.overflowContainer) {
           this.overflowContainer.removeEventListener('scroll', this.handleScroll);
         }
-
         this.updateShadows();
       }
     }, {
@@ -158,25 +120,21 @@ export default function overflowShadow(Component, options) {
       key: "initShadowObserver",
       value: function initShadowObserver() {
         var _this2 = this;
-
         if (this.shadowObserver || !this.overflowContainer) {
           return;
         }
-
         this.shadowObserver = new ShadowObserver({
           scrollContainer: this.overflowContainer,
           onUpdateShadows: function onUpdateShadows(shadowStates) {
             _this2.setState(function (prevState) {
               var showLeftShadow = shadowStates.showLeftShadow,
-                  showRightShadow = shadowStates.showRightShadow;
-
+                showRightShadow = shadowStates.showRightShadow;
               if (showLeftShadow !== prevState.showLeftShadow || showRightShadow !== prevState.showRightShadow) {
                 return {
                   showLeftShadow: showLeftShadow,
                   showRightShadow: showRightShadow
                 };
               }
-
               return null;
             });
           }
@@ -186,8 +144,8 @@ export default function overflowShadow(Component, options) {
       key: "render",
       value: function render() {
         var _this$state = this.state,
-            showLeftShadow = _this$state.showLeftShadow,
-            showRightShadow = _this$state.showRightShadow;
+          showLeftShadow = _this$state.showLeftShadow,
+          showRightShadow = _this$state.showRightShadow;
         var classNames = [showRightShadow && shadowClassNames.RIGHT_SHADOW, showLeftShadow && shadowClassNames.LEFT_SHADOW, options.useShadowObserver && shadowObserverClassNames.SHADOW_CONTAINER].filter(Boolean).join(' ');
         return /*#__PURE__*/React.createElement(Component, _extends({
           handleRef: this.handleContainer,
@@ -195,7 +153,6 @@ export default function overflowShadow(Component, options) {
         }, this.props));
       }
     }]);
-
     return OverflowShadow;
   }(React.Component);
 }