@atlaskit/renderer 105.1.1 → 106.0.0

package/dist/esm/ui/Renderer/ErrorBoundary.js

@@ -5,43 +5,31 @@ 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 { PLATFORM } from '../../analytics/events';
 import { ACTION, EVENT_TYPE } from '@atlaskit/editor-common/analytics';
 import { FabricChannel } from '@atlaskit/analytics-listeners';
 export var ErrorBoundary = /*#__PURE__*/function (_React$Component) {
   _inherits(ErrorBoundary, _React$Component);
-
   var _super = _createSuper(ErrorBoundary);
-
   function ErrorBoundary() {
     var _this;
-
     _classCallCheck(this, ErrorBoundary);
-
     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", {
       errorCaptured: false
     });
-
     return _this;
   }
-
   _createClass(ErrorBoundary, [{
     key: "fireAnalyticsEvent",
     value: function fireAnalyticsEvent(event) {
       var createAnalyticsEvent = this.props.createAnalyticsEvent;
-
       if (createAnalyticsEvent) {
         var channel = FabricChannel.editor;
         createAnalyticsEvent(event).fire(channel);
@@ -61,7 +49,6 @@ export var ErrorBoundary = /*#__PURE__*/function (_React$Component) {
     key: "componentDidCatch",
     value: function componentDidCatch(error, errorInfo) {
       var _this2 = this;
-
       this.fireAnalyticsEvent({
         action: ACTION.CRASHED,
         actionSubject: this.props.component,
@@ -75,7 +62,6 @@ export var ErrorBoundary = /*#__PURE__*/function (_React$Component) {
           errorRethrown: Boolean(this.props.rethrowError)
         }
       });
-
       if (this.hasFallback()) {
         this.setState({
           errorCaptured: true
@@ -92,10 +78,8 @@ export var ErrorBoundary = /*#__PURE__*/function (_React$Component) {
       if (this.shouldRecover()) {
         return this.props.fallbackComponent;
       }
-
       return this.props.children;
     }
   }]);
-
   return ErrorBoundary;
 }(React.Component);

package/dist/esm/ui/Renderer/breakout-ssr.js

@@ -1,12 +1,12 @@
 import React from 'react';
 import { breakoutConsts } from '@atlaskit/editor-common/utils';
+
 /**
  * Inline Script that updates breakout node width on client side,
  * before main JavaScript bundle is ready.
  *
  * More info: https://product-fabric.atlassian.net/wiki/spaces/E/pages/1216218119/Renderer+SSR+for+Breakout+Nodes
  */
-
 export function BreakoutSSRInlineScript() {
   /**
    * Should only inline this script while SSR,
@@ -15,7 +15,6 @@ export function BreakoutSSRInlineScript() {
   if (typeof window !== 'undefined' && !window.navigator.userAgent.includes('jsdom')) {
     return null;
   }
-
   var id = Math.floor(Math.random() * (9999999999 - 9999 + 1)) + 9999;
   var context = createBreakoutInlineScript(id);
   return /*#__PURE__*/React.createElement("script", {
@@ -29,64 +28,51 @@ export function createBreakoutInlineScript(id) {
   return "\n  (function(window){\n    ".concat(breakoutInlineScriptContext, ";\n    (").concat(applyBreakoutAfterSSR.toString(), ")(\"").concat(id, "\", breakoutConsts);\n  })(window);\n");
 }
 export var breakoutInlineScriptContext = "\n  var breakoutConsts = ".concat(JSON.stringify(breakoutConsts), ";\n  breakoutConsts.mapBreakpointToLayoutMaxWidth = ").concat(breakoutConsts.mapBreakpointToLayoutMaxWidth.toString(), ";\n  breakoutConsts.getBreakpoint = ").concat(breakoutConsts.getBreakpoint.toString(), ";\n  breakoutConsts.calcBreakoutWidth = ").concat(breakoutConsts.calcBreakoutWidth.toString(), ";\n  breakoutConsts.calcLineLength = ").concat(breakoutConsts.calcLineLength.toString(), ";\n  breakoutConsts.calcWideWidth = ").concat(breakoutConsts.calcWideWidth.toString(), ";\n");
-
 function applyBreakoutAfterSSR(id, breakoutConsts) {
   var MEDIA_NODE_TYPE = 'mediaSingle';
   var WIDE_LAYOUT_MODES = ['full-width', 'wide'];
-
   function findUp(element, condition) {
     if (!element) {
       return;
     }
-
     while (element.parentElement) {
       if (condition(element)) {
         return element.parentElement;
       }
-
       element = element.parentElement;
     }
   }
-
   var renderer = findUp(document.querySelector('[data-breakout-script-id="' + id + '"]'), function (elem) {
     var _elem$parentElement;
-
     return !!((_elem$parentElement = elem.parentElement) !== null && _elem$parentElement !== void 0 && _elem$parentElement.classList.contains('ak-renderer-wrapper'));
   });
-
   if (!renderer) {
     return;
   }
-
   var observer = new MutationObserver(function (mutationsList) {
     mutationsList.forEach(function (item) {
       if (item.target.nodeType !== Node.ELEMENT_NODE) {
         return;
       }
-
       if (item.target.classList.contains('ak-renderer-document')) {
         item.addedNodes.forEach(function (maybeNode) {
           var node = maybeNode;
           var mode = node.dataset.mode || node.dataset.layout || '';
-
           if (!mode || !WIDE_LAYOUT_MODES.includes(mode)) {
             return;
           }
-
           var width = breakoutConsts.calcBreakoutWidth(mode, renderer.offsetWidth);
-
           if (node.style.width === width) {
             return;
           }
+          node.style.width = width;
 
-          node.style.width = width; // Tables require some special logic, as they are not using common css transform approach,
+          // Tables require some special logic, as they are not using common css transform approach,
           // because it breaks with sticky headers. This logic is copied from a table node:
           // https://bitbucket.org/atlassian/atlassian-frontend/src/77938aee0c140d02ff99b98a03849be1236865b4/packages/editor/renderer/src/react/nodes/table.tsx#table.tsx-235:245
-
           if (node.classList.contains('pm-table-container')) {
             var lineLength = breakoutConsts.calcLineLength();
             var left = lineLength / 2 - parseInt(width) / 2;
-
             if (left < 0) {
               node.style.left = left + 'px';
             }
@@ -105,36 +91,33 @@ function applyBreakoutAfterSSR(id, breakoutConsts) {
       }
     });
   });
-
   var applyMediaBreakout = function applyMediaBreakout(card) {
     // width was already set by another breakout script
     if (card.style.width) {
       return;
     }
-
     var tableParent = findUp(card, function (elem) {
       return elem instanceof HTMLTableCellElement;
-    }); // only apply the breakout to media elements not nested inside table
-    // table sizing is not based on percentage width
+    });
 
+    // only apply the breakout to media elements not nested inside table
+    // table sizing is not based on percentage width
     if (tableParent) {
       return;
     }
-
     var mode = card.dataset.mode || card.dataset.layout || '';
     var width = card.dataset.width;
-
     if (WIDE_LAYOUT_MODES.includes(mode)) {
       card.style.width = '100%';
     } else if (width) {
       card.style.width = "".concat(width, "%");
     }
   };
-
   observer.observe(renderer, {
     childList: true,
     subtree: true
   });
+
   /**
    * Using window load event to unsubscribe from mutation observer, as at this stage document is fully rendered.
    * Experiment with DOMContentLoaded showed that some of the blocks were not processed at all.
@@ -145,13 +128,10 @@ function applyBreakoutAfterSSR(id, breakoutConsts) {
    * – https://developer.mozilla.org/en-US/docs/Web/API/Window/load_event
    * – https://developer.mozilla.org/en-US/docs/Web/API/Document/DOMContentLoaded_event
    */
-
   var disconnect = function disconnect() {
     observer.disconnect();
     window.removeEventListener('load', disconnect);
   };
-
   window.addEventListener('load', disconnect);
 }
-
 export var calcLineLength = breakoutConsts.calcLineLength;

package/dist/esm/ui/Renderer/click-to-edit.js

@@ -1,23 +1,20 @@
 import { fileCardImageViewSelector } from '@atlaskit/media-card/classnames';
 import { mediaViewerPopupClass } from '@atlaskit/media-viewer/classnames';
+
 /**
  * Check if an element is interactive (or otherwise if clicking on it shouldn't transition the
  * renderer to the editor in somewhere like the Jira description
  * @param element
  */
-
 export function isInteractiveElement(element) {
   if ('href' in element && element.href != null) {
     return true;
   }
-
   if (element.classList.contains(mediaViewerPopupClass)) {
     return true;
   }
-
   if (element.classList.contains(fileCardImageViewSelector)) {
     return true;
   }
-
   return false;
 }

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

@@ -6,15 +6,10 @@ 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; } }
-
 /** @jsx jsx */
 import React, { Fragment, useContext, useLayoutEffect, useRef } from 'react';
 import { jsx } from '@emotion/react';
@@ -50,25 +45,20 @@ import { RenderTracking } from '../../react/utils/performance/RenderTracking';
 export var NORMAL_SEVERITY_THRESHOLD = 2000;
 export var DEGRADED_SEVERITY_THRESHOLD = 3000;
 var packageName = "@atlaskit/renderer";
-var packageVersion = "105.1.1";
+var packageVersion = "106.0.0";
 export var Renderer = /*#__PURE__*/function (_PureComponent) {
   _inherits(Renderer, _PureComponent);
-
   var _super = _createSuper(Renderer);
-
   /**
    * This is used in measuring the Renderer Mount time and is then
    * deleted once that measurement occurs.
    */
+
   function Renderer(props) {
     var _this;
-
     _classCallCheck(this, Renderer);
-
     _this = _super.call(this, props);
-
     _defineProperty(_assertThisInitialized(_this), "renderedMeasurementDistortedDurationMonitor", getDistortedDurationMonitor());
-
     _defineProperty(_assertThisInitialized(_this), "featureFlags", memoizeOne(function (featureFlags) {
       var normalizedFeatureFlags = normalizeFeatureFlags(featureFlags, {
         objectFlagKeys: ['rendererRenderTracking']
@@ -77,24 +67,19 @@ export var Renderer = /*#__PURE__*/function (_PureComponent) {
         featureFlags: normalizedFeatureFlags
       };
     }));
-
     _defineProperty(_assertThisInitialized(_this), "fireAnalyticsEvent", function (event) {
       var createAnalyticsEvent = _this.props.createAnalyticsEvent;
-
       if (createAnalyticsEvent) {
         var channel = FabricChannel.editor;
         createAnalyticsEvent(event).fire(channel);
       }
     });
-
     _defineProperty(_assertThisInitialized(_this), "getSchema", memoizeOne(function (schema, adfStage) {
       if (schema) {
         return schema;
       }
-
       return getSchemaBasedOnStage(adfStage);
     }));
-
     _defineProperty(_assertThisInitialized(_this), "onMouseDownEditView", function () {
       // When the user is deselecting text on the screen by clicking, if they are clicking outside
       // the current selection, by the time the onclick handler is called the window.getSelection()
@@ -103,72 +88,55 @@ export var Renderer = /*#__PURE__*/function (_PureComponent) {
       var windowSelection = window.getSelection();
       _this.mouseDownSelection = windowSelection !== null ? windowSelection.toString() : undefined;
     });
-
     _defineProperty(_assertThisInitialized(_this), "handleMouseTripleClickInTables", function (event) {
       var _parentElement, _parentElement2;
-
       if (browser.ios || browser.android) {
         return;
       }
-
       var badBrowser = browser.chrome || browser.safari;
       var tripleClick = event.detail >= 3;
-
       if (!(badBrowser && tripleClick)) {
         return;
       }
-
       var selection = window.getSelection();
-
       if (!selection) {
         return;
       }
-
       var type = selection.type,
-          anchorNode = selection.anchorNode,
-          focusNode = selection.focusNode;
+        anchorNode = selection.anchorNode,
+        focusNode = selection.focusNode;
       var rangeSelection = Boolean(type === 'Range' && anchorNode && focusNode);
-
       if (!rangeSelection) {
         return;
       }
-
       var target = event.target;
       var tableCell = target.closest('td,th');
       var clickedInCell = Boolean(tableCell);
-
       if (!clickedInCell) {
         return;
       }
-
       var anchorInCell = tableCell.contains(anchorNode);
       var focusInCell = tableCell.contains(focusNode);
       var selectionStartsOrEndsOutsideClickedCell = !(anchorInCell && focusInCell);
-
       if (!selectionStartsOrEndsOutsideClickedCell) {
         return;
-      } // If selection starts or ends in a different cell than the clicked cell,
+      }
+      // If selection starts or ends in a different cell than the clicked cell,
       // we select the node inside the clicked cell (or if both are in a different
       // cell, we select the cell's contents instead). We want to select the nearest
       // parent block, so that a whole line of text/content is selected (rather than
       // selecting a span that would select one specific chunk of text).
-
-
       var elementToSelect = anchorInCell ? (_parentElement = anchorNode.parentElement) === null || _parentElement === void 0 ? void 0 : _parentElement.closest('div,p') : focusInCell ? (_parentElement2 = focusNode.parentElement) === null || _parentElement2 === void 0 ? void 0 : _parentElement2.closest('div,p') : tableCell;
-
       if (elementToSelect) {
         selection.selectAllChildren(elementToSelect);
       }
     });
-
     _this.providerFactory = props.dataProviders || new ProviderFactory();
     _this.serializer = new ReactSerializer(_this.deriveSerializerProps(props));
     _this.editorRef = props.innerRef || /*#__PURE__*/React.createRef();
     _this.id = uuid();
     startMeasure("Renderer Render Time: ".concat(_this.id));
-
     var _featureFlags = _this.featureFlags(_this.props.featureFlags).featureFlags;
-
     if (_featureFlags !== null && _featureFlags !== void 0 && _featureFlags.rendererTtiTracking) {
       measureTTI(function (tti, ttiFromInvocation, canceled) {
         _this.fireAnalyticsEvent({
@@ -183,20 +151,17 @@ export var Renderer = /*#__PURE__*/function (_PureComponent) {
         });
       });
     }
-
     return _this;
   }
-
   _createClass(Renderer, [{
     key: "anchorLinkAnalytics",
     value: function anchorLinkAnalytics() {
       var hash = window.location.hash && decodeURIComponent(window.location.hash.slice(1));
       var disableHeadingIDs = this.props.disableHeadingIDs;
-
       if (!disableHeadingIDs && hash && this.editorRef && this.editorRef.current instanceof HTMLElement) {
-        var anchorLinkElement = document.getElementById(hash); // We are not use this.editorRef.querySelector here, instead we have this.editorRef.contains
+        var anchorLinkElement = document.getElementById(hash);
+        // We are not use this.editorRef.querySelector here, instead we have this.editorRef.contains
         // because querySelector might fail if there are special characters in hash, and CSS.escape is still experimental.
-
         if (anchorLinkElement && this.editorRef.current.contains(anchorLinkElement)) {
           this.fireAnalyticsEvent({
             action: ACTION.VIEWED,
@@ -214,7 +179,6 @@ export var Renderer = /*#__PURE__*/function (_PureComponent) {
     key: "componentDidMount",
     value: function componentDidMount() {
       var _this2 = this;
-
       this.fireAnalyticsEvent({
         action: ACTION.STARTED,
         actionSubject: ACTION_SUBJECT.RENDERER,
@@ -226,11 +190,9 @@ export var Renderer = /*#__PURE__*/function (_PureComponent) {
       this.rafID = requestAnimationFrame(function () {
         stopMeasure("Renderer Render Time: ".concat(_this2.id), function (duration) {
           var _analyticsEventSeveri, _analyticsEventSeveri2;
-
           var analyticsEventSeverityTracking = _this2.props.analyticsEventSeverityTracking;
           var forceSeverityTracking = typeof analyticsEventSeverityTracking === 'undefined' && shouldForceTracking();
           var severity = !!forceSeverityTracking || analyticsEventSeverityTracking !== null && analyticsEventSeverityTracking !== void 0 && analyticsEventSeverityTracking.enabled ? getAnalyticsEventSeverity(duration, (_analyticsEventSeveri = analyticsEventSeverityTracking === null || analyticsEventSeverityTracking === void 0 ? void 0 : analyticsEventSeverityTracking.severityNormalThreshold) !== null && _analyticsEventSeveri !== void 0 ? _analyticsEventSeveri : NORMAL_SEVERITY_THRESHOLD, (_analyticsEventSeveri2 = analyticsEventSeverityTracking === null || analyticsEventSeverityTracking === void 0 ? void 0 : analyticsEventSeverityTracking.severityDegradedThreshold) !== null && _analyticsEventSeveri2 !== void 0 ? _analyticsEventSeveri2 : DEGRADED_SEVERITY_THRESHOLD) : undefined;
-
           _this2.fireAnalyticsEvent({
             action: ACTION.RENDERED,
             actionSubject: ACTION_SUBJECT.RENDERER,
@@ -247,12 +209,9 @@ export var Renderer = /*#__PURE__*/function (_PureComponent) {
             },
             eventType: EVENT_TYPE.OPERATIONAL
           });
-
           _this2.renderedMeasurementDistortedDurationMonitor.cleanup();
-
           delete _this2.renderedMeasurementDistortedDurationMonitor;
         });
-
         _this2.anchorLinkAnalytics();
       });
     }
@@ -261,7 +220,6 @@ export var Renderer = /*#__PURE__*/function (_PureComponent) {
     value: function UNSAFE_componentWillReceiveProps(nextProps) {
       var nextMedia = nextProps.media || {};
       var media = this.props.media || {};
-
       if (nextProps.portal !== this.props.portal || nextProps.appearance !== this.props.appearance || nextProps.stickyHeaders !== this.props.stickyHeaders || nextProps.disableActions !== this.props.disableActions || nextProps.allowCustomPanels !== this.props.allowCustomPanels || nextProps.allowHeadingAnchorLinks !== this.props.allowHeadingAnchorLinks || nextMedia.allowLinking !== media.allowLinking) {
         this.serializer = new ReactSerializer(this.deriveSerializerProps(nextProps));
       }
@@ -273,10 +231,8 @@ export var Renderer = /*#__PURE__*/function (_PureComponent) {
       var stickyHeaders = props.stickyHeaders ? props.stickyHeaders === true ? {} : props.stickyHeaders : undefined;
       var annotationProvider = props.annotationProvider;
       var allowAnnotationsDraftMode = Boolean(annotationProvider && annotationProvider.inlineComment && annotationProvider.inlineComment.allowDraftMode);
-
       var _this$featureFlags = this.featureFlags(props.featureFlags),
-          featureFlags = _this$featureFlags.featureFlags;
-
+        featureFlags = _this$featureFlags.featureFlags;
       return {
         providers: this.providerFactory,
         eventHandlers: props.eventHandlers,
@@ -314,22 +270,21 @@ export var Renderer = /*#__PURE__*/function (_PureComponent) {
     key: "render",
     value: function render() {
       var _this3 = this;
-
       var _this$props = this.props,
-          adfDocument = _this$props.document,
-          onComplete = _this$props.onComplete,
-          onError = _this$props.onError,
-          appearance = _this$props.appearance,
-          adfStage = _this$props.adfStage,
-          truncated = _this$props.truncated,
-          maxHeight = _this$props.maxHeight,
-          fadeOutHeight = _this$props.fadeOutHeight,
-          enableSsrInlineScripts = _this$props.enableSsrInlineScripts,
-          allowHeadingAnchorLinks = _this$props.allowHeadingAnchorLinks,
-          allowPlaceholderText = _this$props.allowPlaceholderText,
-          allowColumnSorting = _this$props.allowColumnSorting,
-          allowCopyToClipboard = _this$props.allowCopyToClipboard,
-          allowCustomPanels = _this$props.allowCustomPanels;
+        adfDocument = _this$props.document,
+        onComplete = _this$props.onComplete,
+        onError = _this$props.onError,
+        appearance = _this$props.appearance,
+        adfStage = _this$props.adfStage,
+        truncated = _this$props.truncated,
+        maxHeight = _this$props.maxHeight,
+        fadeOutHeight = _this$props.fadeOutHeight,
+        enableSsrInlineScripts = _this$props.enableSsrInlineScripts,
+        allowHeadingAnchorLinks = _this$props.allowHeadingAnchorLinks,
+        allowPlaceholderText = _this$props.allowPlaceholderText,
+        allowColumnSorting = _this$props.allowColumnSorting,
+        allowCopyToClipboard = _this$props.allowCopyToClipboard,
+        allowCustomPanels = _this$props.allowCustomPanels;
       var allowNestedHeaderLinks = isNestedHeaderLinksEnabled(allowHeadingAnchorLinks);
       /**
        * Handle clicks inside renderer. If the click isn't on media, in the media picker, or on a
@@ -337,64 +292,55 @@ export var Renderer = /*#__PURE__*/function (_PureComponent) {
        * renderer out for the editor).
        * @param event Click event anywhere inside renderer
        */
-
       var handleWrapperOnClick = function handleWrapperOnClick(event) {
         var _this3$props$eventHan;
+        var targetElement = event.target;
 
-        var targetElement = event.target; // ED-14862: When a user triple clicks to select a line of content inside a
+        // ED-14862: When a user triple clicks to select a line of content inside a
         // a table cell, but the browser incorrectly moves the selection start or end into
         // a different table cell, we manually set the selection back to within the original
         // table cell the user intended to target
-
         _this3.handleMouseTripleClickInTables(event);
-
         if (!((_this3$props$eventHan = _this3.props.eventHandlers) !== null && _this3$props$eventHan !== void 0 && _this3$props$eventHan.onUnhandledClick)) {
           return;
         }
-
         if (!(targetElement instanceof window.Element)) {
           return;
         }
+        var rendererWrapper = event.currentTarget;
 
-        var rendererWrapper = event.currentTarget; // Check if the click was on an interactive element
-
+        // Check if the click was on an interactive element
         var isInteractiveElementInTree = findInTree(targetElement, rendererWrapper, isInteractiveElement);
-
         if (isInteractiveElementInTree) {
           return;
-        } // Ensure that selecting text in the renderer doesn't trigger onUnhandledClick
+        }
+
+        // Ensure that selecting text in the renderer doesn't trigger onUnhandledClick
         // This logic originated in jira-frontend:
         // src/packages/issue/issue-view/src/views/field/rich-text/rich-text-inline-edit-view.js
+
         // The selection is required to be checked in `onMouseDown` and here. If not here, a new
         // selection isn't reported; if not in `onMouseDown`, a click outside the selection will
         // return an empty selection, which will erroneously fire onUnhandledClick.
-
-
         var windowSelection = window.getSelection();
         var selection = windowSelection !== null ? windowSelection.toString() : undefined;
         var hasSelection = selection && selection.length !== 0;
         var hasSelectionMouseDown = _this3.mouseDownSelection && _this3.mouseDownSelection.length !== 0;
         var allowEditBasedOnSelection = !hasSelection && !hasSelectionMouseDown;
-
         if (allowEditBasedOnSelection) {
           _this3.props.eventHandlers.onUnhandledClick(event);
         }
       };
-
       try {
         var _this$featureFlags2, _this$featureFlags2$f, _this$featureFlags2$f2;
-
         var schema = this.getSchema(this.props.schema, this.props.adfStage);
-
         var _renderDocument = renderDocument(adfDocument, this.serializer, schema, adfStage, this.props.useSpecBasedValidator, this.id, this.fireAnalyticsEvent, this.props.unsupportedContentLevelsTracking, this.props.appearance),
-            result = _renderDocument.result,
-            stat = _renderDocument.stat,
-            pmDoc = _renderDocument.pmDoc;
-
+          result = _renderDocument.result,
+          stat = _renderDocument.stat,
+          pmDoc = _renderDocument.pmDoc;
         if (onComplete) {
           onComplete(stat);
         }
-
         var rendererOutput = jsx(RendererContextProvider, {
           value: this.featureFlags(this.props.featureFlags)
         }, jsx(ActiveHeaderIdProvider, {
@@ -437,7 +383,6 @@ export var Renderer = /*#__PURE__*/function (_PureComponent) {
         if (onError) {
           onError(e);
         }
-
         return jsx(RendererWrapper, {
           appearance: appearance,
           allowCopyToClipboard: allowCopyToClipboard,
@@ -452,19 +397,17 @@ export var Renderer = /*#__PURE__*/function (_PureComponent) {
     key: "componentWillUnmount",
     value: function componentWillUnmount() {
       var dataProviders = this.props.dataProviders;
-
       if (this.rafID) {
         window.cancelAnimationFrame(this.rafID);
-      } // if this is the ProviderFactory which was created in constructor
-      // it's safe to destroy it on Renderer unmount
-
+      }
 
+      // if this is the ProviderFactory which was created in constructor
+      // it's safe to destroy it on Renderer unmount
       if (!dataProviders) {
         this.providerFactory.destroy();
       }
     }
   }]);
-
   return Renderer;
 }(PureComponent);
 var RendererWithAnalytics = /*#__PURE__*/React.memo(function (props) {
@@ -492,12 +435,12 @@ var RendererWithAnalytics = /*#__PURE__*/React.memo(function (props) {
 });
 var RendererWrapper = /*#__PURE__*/React.memo(function (props) {
   var allowColumnSorting = props.allowColumnSorting,
-      allowNestedHeaderLinks = props.allowNestedHeaderLinks,
-      innerRef = props.innerRef,
-      appearance = props.appearance,
-      children = props.children,
-      onClick = props.onClick,
-      onMouseDown = props.onMouseDown;
+    allowNestedHeaderLinks = props.allowNestedHeaderLinks,
+    innerRef = props.innerRef,
+    appearance = props.appearance,
+    children = props.children,
+    onClick = props.onClick,
+    onMouseDown = props.onMouseDown;
   return jsx(WidthProvider, {
     className: "ak-renderer-wrapper"
   }, jsx(BaseTheme, {
@@ -513,12 +456,11 @@ var RendererWrapper = /*#__PURE__*/React.memo(function (props) {
     })
   }, children)));
 });
-
 function RendererActionsInternalUpdater(_ref) {
   var children = _ref.children,
-      doc = _ref.doc,
-      schema = _ref.schema,
-      onAnalyticsEvent = _ref.onAnalyticsEvent;
+    doc = _ref.doc,
+    schema = _ref.schema,
+    onAnalyticsEvent = _ref.onAnalyticsEvent;
   var actions = useContext(ActionsContext);
   var rendererRef = useRef(null);
   useLayoutEffect(function () {
@@ -527,26 +469,22 @@ function RendererActionsInternalUpdater(_ref) {
     } else {
       actions._privateUnregisterRenderer();
     }
-
     return function () {
       return actions._privateUnregisterRenderer();
     };
   }, [actions, schema, doc, onAnalyticsEvent]);
   return children;
 }
-
 var RendererWithAnnotationSelection = function RendererWithAnnotationSelection(props) {
   var allowAnnotations = props.allowAnnotations,
-      adfDocument = props.document;
+    adfDocument = props.document;
   var localRef = React.useRef(null);
   var innerRef = props.innerRef || localRef;
-
   if (!allowAnnotations) {
     return jsx(RendererWithAnalytics, _extends({
       innerRef: innerRef
     }, props));
   }
-
   return jsx(RendererActionsContext, null, jsx(AnnotationsWrapper, {
     rendererRef: innerRef,
     adfDocument: adfDocument,
@@ -557,5 +495,4 @@ var RendererWithAnnotationSelection = function RendererWithAnnotationSelection(p
     featureFlags: props.featureFlags
   }))));
 };
-
 export default RendererWithAnnotationSelection;