@atlaskit/renderer 114.7.8 → 114.8.0

package/CHANGELOG.md

@@ -1,5 +1,22 @@
 # @atlaskit/renderer
 
+## 114.8.0
+
+### Minor Changes
+
+- [#139497](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/139497)
+  [`cac027cee3848`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/cac027cee3848) -
+  Clean up the forbid_comments_on_empty_newlines feature gate
+
+## 114.7.9
+
+### Patch Changes
+
+- [#139133](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/139133)
+  [`a66b33f8fd694`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/a66b33f8fd694) -
+  EDITOR-552 Fixes triple clicking on paragrpahs that contain inline nodes to select the entire
+  paragraph. Changes behind FG platform_renderer_triple_click_selects_paragraph
+
 ## 114.7.8
 
 ### Patch Changes

package/dist/cjs/actions/index.js

@@ -69,11 +69,9 @@ var RendererActions = exports.default = /*#__PURE__*/function () {
       if (!this.doc || !this.schema) {
         return false;
       }
-      if ((0, _platformFeatureFlags.fg)('forbid_comments_on_empty_newlines')) {
-        var currentSelection = _state.TextSelection.create(this.doc, from, to);
-        if ((0, _utils.isEmptyTextSelection)(currentSelection, this.schema)) {
-          return false;
-        }
+      var currentSelection = _state.TextSelection.create(this.doc, from, to);
+      if ((0, _utils.isEmptyTextSelection)(currentSelection, this.schema)) {
+        return false;
       }
       return (0, _utils.canApplyAnnotationOnRange)({
         from: from,

package/dist/cjs/react/nodes/tableRow.js

@@ -14,6 +14,7 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
 var _react = _interopRequireDefault(require("react"));
 var _utils = require("@atlaskit/editor-common/utils");
 var _types = require("@atlaskit/editor-common/types");
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _consts = require("../../consts");
 function _callSuper(t, o, e) { return o = (0, _getPrototypeOf2.default)(o), (0, _possibleConstructorReturn2.default)(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], (0, _getPrototypeOf2.default)(t).constructor) : o.apply(t, e)); }
 function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
@@ -34,8 +35,8 @@ var TableRow = exports.default = /*#__PURE__*/function (_React$Component) {
       var _this$props = _this.props,
         allowColumnSorting = _this$props.allowColumnSorting,
         rowIndex = _this$props.index;
-      if (allowColumnSorting) {
-        var isHeaderRow = !rowIndex;
+      var isHeaderRow = !rowIndex;
+      if (allowColumnSorting && (!(0, _platformFeatureFlags.fg)('cc_complexit_fe_improve_table_sorting') || isHeaderRow)) {
         childrenArray = childrenArray.map(function (child, index) {
           if ( /*#__PURE__*/_react.default.isValidElement(child)) {
             var tableOrderStatus = _this.props.tableOrderStatus;

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

@@ -67,7 +67,7 @@ function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.
 var NORMAL_SEVERITY_THRESHOLD = exports.NORMAL_SEVERITY_THRESHOLD = 2000;
 var DEGRADED_SEVERITY_THRESHOLD = exports.DEGRADED_SEVERITY_THRESHOLD = 3000;
 var packageName = "@atlaskit/renderer";
-var packageVersion = "114.7.8";
+var packageVersion = "114.8.0";
 var setAsQueryContainerStyles = (0, _react2.css)({
   containerName: 'ak-renderer-wrapper',
   containerType: 'inline-size',

package/dist/cjs/ui/annotations/hooks/user-selection.js

@@ -8,6 +8,7 @@ var _react = require("react");
 var _AnnotationRangeContext = require("../contexts/AnnotationRangeContext");
 var _utils = require("./utils");
 var _steps = require("../../../steps");
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var useUserSelectionRange = exports.useUserSelectionRange = function useUserSelectionRange(props) {
   var rendererDOM = props.rendererRef.current;
   var selectionTimeoutRef = (0, _react.useRef)();
@@ -18,11 +19,47 @@ var useUserSelectionRange = exports.useUserSelectionRange = function useUserSele
     range = _useAnnotationRangeSt.range,
     draftRange = _useAnnotationRangeSt.draftRange,
     type = _useAnnotationRangeSt.type;
-  (0, _react.useEffect)(function () {
-    if (!document || !rendererDOM) {
-      return;
-    }
-    var onSelectionChange = function onSelectionChange(event) {
+  var lastRangeRef = (0, _react.useRef)(null);
+  var onSelectionChange = (0, _react.useCallback)(function (event) {
+    if ((0, _platformFeatureFlags.fg)('platform_renderer_triple_click_selects_paragraph')) {
+      if (selectionTimeoutRef.current) {
+        clearTimeout(selectionTimeoutRef.current);
+      }
+      selectionTimeoutRef.current = setTimeout(function () {
+        var sel = document.getSelection();
+        if (!sel || sel.type !== 'Range' || sel.rangeCount !== 1) {
+          lastRangeRef.current = null; // Clear last range if selection is invalid
+          return;
+        }
+        var _range = sel.getRangeAt(0);
+
+        // Skip if the selection hasn’t changed
+        if (lastRangeRef.current && _range.compareBoundaryPoints(Range.START_TO_START, lastRangeRef.current) === 0 && _range.compareBoundaryPoints(Range.END_TO_END, lastRangeRef.current) === 0) {
+          return;
+        }
+        if (rendererDOM && (0, _utils.isRangeInsideOfRendererContainer)(rendererDOM, _range)) {
+          var _range2 = _range,
+            startContainer = _range2.startContainer,
+            endContainer = _range2.endContainer;
+          var isTripleClick = endContainer.nodeType !== Node.TEXT_NODE;
+          if (isTripleClick) {
+            var p = startContainer;
+            while (p && p.nodeName !== 'P' && p !== rendererDOM) {
+              p = p.parentNode;
+            }
+            if (p && p.nodeName === 'P' && p instanceof Element) {
+              var _range3 = document.createRange();
+              _range3.selectNodeContents(p);
+              sel.removeAllRanges();
+              sel.addRange(_range3);
+              _range = sel.getRangeAt(0);
+            }
+          }
+          setRange(_range.cloneRange());
+          lastRangeRef.current = _range;
+        }
+      }, 100);
+    } else {
       if (selectionTimeoutRef.current) {
         clearTimeout(selectionTimeoutRef.current);
       }
@@ -62,8 +99,12 @@ var useUserSelectionRange = exports.useUserSelectionRange = function useUserSele
           setRange(_range.cloneRange());
         }
       }, 250);
-    };
-
+    }
+  }, [rendererDOM, setRange]);
+  (0, _react.useEffect)(function () {
+    if (!document || !rendererDOM) {
+      return;
+    }
     // Ignored via go/ees005
     // eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners
     document.addEventListener('selectionchange', onSelectionChange);
@@ -73,6 +114,6 @@ var useUserSelectionRange = exports.useUserSelectionRange = function useUserSele
       document.removeEventListener('selectionchange', onSelectionChange);
       clearRange();
     };
-  }, [rendererDOM, setRange, clearRange]);
+  }, [rendererDOM, onSelectionChange, clearRange]);
   return [type === 'selection' ? range : null, draftRange, clearRange];
 };

package/dist/es2019/actions/index.js

@@ -49,11 +49,9 @@ export default class RendererActions {
     if (!this.doc || !this.schema) {
       return false;
     }
-    if (fg('forbid_comments_on_empty_newlines')) {
-      const currentSelection = TextSelection.create(this.doc, from, to);
-      if (isEmptyTextSelection(currentSelection, this.schema)) {
-        return false;
-      }
+    const currentSelection = TextSelection.create(this.doc, from, to);
+    if (isEmptyTextSelection(currentSelection, this.schema)) {
+      return false;
     }
     return canApplyAnnotationOnRange({
       from,

package/dist/es2019/react/nodes/tableRow.js

@@ -2,6 +2,7 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import React from 'react';
 import { compose } from '@atlaskit/editor-common/utils';
 import { SortOrder } from '@atlaskit/editor-common/types';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { RendererCssClassName } from '../../consts';
 // Ignored via go/ees005
 // eslint-disable-next-line @repo/internal/react/no-class-components
@@ -16,8 +17,8 @@ export default class TableRow extends React.Component {
         allowColumnSorting,
         index: rowIndex
       } = this.props;
-      if (allowColumnSorting) {
-        const isHeaderRow = !rowIndex;
+      const isHeaderRow = !rowIndex;
+      if (allowColumnSorting && (!fg('cc_complexit_fe_improve_table_sorting') || isHeaderRow)) {
         childrenArray = childrenArray.map((child, index) => {
           if ( /*#__PURE__*/React.isValidElement(child)) {
             const {

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

@@ -48,7 +48,7 @@ import { removeEmptySpaceAroundContent } from './rendererHelper';
 export const NORMAL_SEVERITY_THRESHOLD = 2000;
 export const DEGRADED_SEVERITY_THRESHOLD = 3000;
 const packageName = "@atlaskit/renderer";
-const packageVersion = "114.7.8";
+const packageVersion = "114.8.0";
 const setAsQueryContainerStyles = css({
   containerName: 'ak-renderer-wrapper',
   containerType: 'inline-size',

package/dist/es2019/ui/annotations/hooks/user-selection.js

@@ -1,7 +1,8 @@
-import { useEffect, useRef } from 'react';
+import { useEffect, useRef, useCallback } from 'react';
 import { useAnnotationRangeDispatch, useAnnotationRangeState } from '../contexts/AnnotationRangeContext';
 import { isRangeInsideOfRendererContainer } from './utils';
 import { isRoot } from '../../../steps';
+import { fg } from '@atlaskit/platform-feature-flags';
 export const useUserSelectionRange = props => {
   const {
     rendererRef: {
@@ -18,11 +19,48 @@ export const useUserSelectionRange = props => {
     draftRange,
     type
   } = useAnnotationRangeState();
-  useEffect(() => {
-    if (!document || !rendererDOM) {
-      return;
-    }
-    const onSelectionChange = event => {
+  const lastRangeRef = useRef(null);
+  const onSelectionChange = useCallback(event => {
+    if (fg('platform_renderer_triple_click_selects_paragraph')) {
+      if (selectionTimeoutRef.current) {
+        clearTimeout(selectionTimeoutRef.current);
+      }
+      selectionTimeoutRef.current = setTimeout(() => {
+        const sel = document.getSelection();
+        if (!sel || sel.type !== 'Range' || sel.rangeCount !== 1) {
+          lastRangeRef.current = null; // Clear last range if selection is invalid
+          return;
+        }
+        let _range = sel.getRangeAt(0);
+
+        // Skip if the selection hasn’t changed
+        if (lastRangeRef.current && _range.compareBoundaryPoints(Range.START_TO_START, lastRangeRef.current) === 0 && _range.compareBoundaryPoints(Range.END_TO_END, lastRangeRef.current) === 0) {
+          return;
+        }
+        if (rendererDOM && isRangeInsideOfRendererContainer(rendererDOM, _range)) {
+          const {
+            startContainer,
+            endContainer
+          } = _range;
+          const isTripleClick = endContainer.nodeType !== Node.TEXT_NODE;
+          if (isTripleClick) {
+            let p = startContainer;
+            while (p && p.nodeName !== 'P' && p !== rendererDOM) {
+              p = p.parentNode;
+            }
+            if (p && p.nodeName === 'P' && p instanceof Element) {
+              const range = document.createRange();
+              range.selectNodeContents(p);
+              sel.removeAllRanges();
+              sel.addRange(range);
+              _range = sel.getRangeAt(0);
+            }
+          }
+          setRange(_range.cloneRange());
+          lastRangeRef.current = _range;
+        }
+      }, 100);
+    } else {
       if (selectionTimeoutRef.current) {
         clearTimeout(selectionTimeoutRef.current);
       }
@@ -64,8 +102,12 @@ export const useUserSelectionRange = props => {
           setRange(_range.cloneRange());
         }
       }, 250);
-    };
-
+    }
+  }, [rendererDOM, setRange]);
+  useEffect(() => {
+    if (!document || !rendererDOM) {
+      return;
+    }
     // Ignored via go/ees005
     // eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners
     document.addEventListener('selectionchange', onSelectionChange);
@@ -75,6 +117,6 @@ export const useUserSelectionRange = props => {
       document.removeEventListener('selectionchange', onSelectionChange);
       clearRange();
     };
-  }, [rendererDOM, setRange, clearRange]);
+  }, [rendererDOM, onSelectionChange, clearRange]);
   return [type === 'selection' ? range : null, draftRange, clearRange];
 };

package/dist/esm/actions/index.js

@@ -62,11 +62,9 @@ var RendererActions = /*#__PURE__*/function () {
       if (!this.doc || !this.schema) {
         return false;
       }
-      if (fg('forbid_comments_on_empty_newlines')) {
-        var currentSelection = TextSelection.create(this.doc, from, to);
-        if (isEmptyTextSelection(currentSelection, this.schema)) {
-          return false;
-        }
+      var currentSelection = TextSelection.create(this.doc, from, to);
+      if (isEmptyTextSelection(currentSelection, this.schema)) {
+        return false;
       }
       return canApplyAnnotationOnRange({
         from: from,

package/dist/esm/react/nodes/tableRow.js

@@ -9,6 +9,7 @@ function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.
 import React from 'react';
 import { compose } from '@atlaskit/editor-common/utils';
 import { SortOrder } from '@atlaskit/editor-common/types';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { RendererCssClassName } from '../../consts';
 // Ignored via go/ees005
 // eslint-disable-next-line @repo/internal/react/no-class-components
@@ -27,8 +28,8 @@ var TableRow = /*#__PURE__*/function (_React$Component) {
       var _this$props = _this.props,
         allowColumnSorting = _this$props.allowColumnSorting,
         rowIndex = _this$props.index;
-      if (allowColumnSorting) {
-        var isHeaderRow = !rowIndex;
+      var isHeaderRow = !rowIndex;
+      if (allowColumnSorting && (!fg('cc_complexit_fe_improve_table_sorting') || isHeaderRow)) {
         childrenArray = childrenArray.map(function (child, index) {
           if ( /*#__PURE__*/React.isValidElement(child)) {
             var tableOrderStatus = _this.props.tableOrderStatus;

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

@@ -57,7 +57,7 @@ import { removeEmptySpaceAroundContent } from './rendererHelper';
 export var NORMAL_SEVERITY_THRESHOLD = 2000;
 export var DEGRADED_SEVERITY_THRESHOLD = 3000;
 var packageName = "@atlaskit/renderer";
-var packageVersion = "114.7.8";
+var packageVersion = "114.8.0";
 var setAsQueryContainerStyles = css({
   containerName: 'ak-renderer-wrapper',
   containerType: 'inline-size',

package/dist/esm/ui/annotations/hooks/user-selection.js

@@ -1,7 +1,8 @@
-import { useEffect, useRef } from 'react';
+import { useEffect, useRef, useCallback } from 'react';
 import { useAnnotationRangeDispatch, useAnnotationRangeState } from '../contexts/AnnotationRangeContext';
 import { isRangeInsideOfRendererContainer } from './utils';
 import { isRoot } from '../../../steps';
+import { fg } from '@atlaskit/platform-feature-flags';
 export var useUserSelectionRange = function useUserSelectionRange(props) {
   var rendererDOM = props.rendererRef.current;
   var selectionTimeoutRef = useRef();
@@ -12,11 +13,47 @@ export var useUserSelectionRange = function useUserSelectionRange(props) {
     range = _useAnnotationRangeSt.range,
     draftRange = _useAnnotationRangeSt.draftRange,
     type = _useAnnotationRangeSt.type;
-  useEffect(function () {
-    if (!document || !rendererDOM) {
-      return;
-    }
-    var onSelectionChange = function onSelectionChange(event) {
+  var lastRangeRef = useRef(null);
+  var onSelectionChange = useCallback(function (event) {
+    if (fg('platform_renderer_triple_click_selects_paragraph')) {
+      if (selectionTimeoutRef.current) {
+        clearTimeout(selectionTimeoutRef.current);
+      }
+      selectionTimeoutRef.current = setTimeout(function () {
+        var sel = document.getSelection();
+        if (!sel || sel.type !== 'Range' || sel.rangeCount !== 1) {
+          lastRangeRef.current = null; // Clear last range if selection is invalid
+          return;
+        }
+        var _range = sel.getRangeAt(0);
+
+        // Skip if the selection hasn’t changed
+        if (lastRangeRef.current && _range.compareBoundaryPoints(Range.START_TO_START, lastRangeRef.current) === 0 && _range.compareBoundaryPoints(Range.END_TO_END, lastRangeRef.current) === 0) {
+          return;
+        }
+        if (rendererDOM && isRangeInsideOfRendererContainer(rendererDOM, _range)) {
+          var _range2 = _range,
+            startContainer = _range2.startContainer,
+            endContainer = _range2.endContainer;
+          var isTripleClick = endContainer.nodeType !== Node.TEXT_NODE;
+          if (isTripleClick) {
+            var p = startContainer;
+            while (p && p.nodeName !== 'P' && p !== rendererDOM) {
+              p = p.parentNode;
+            }
+            if (p && p.nodeName === 'P' && p instanceof Element) {
+              var _range3 = document.createRange();
+              _range3.selectNodeContents(p);
+              sel.removeAllRanges();
+              sel.addRange(_range3);
+              _range = sel.getRangeAt(0);
+            }
+          }
+          setRange(_range.cloneRange());
+          lastRangeRef.current = _range;
+        }
+      }, 100);
+    } else {
       if (selectionTimeoutRef.current) {
         clearTimeout(selectionTimeoutRef.current);
       }
@@ -56,8 +93,12 @@ export var useUserSelectionRange = function useUserSelectionRange(props) {
           setRange(_range.cloneRange());
         }
       }, 250);
-    };
-
+    }
+  }, [rendererDOM, setRange]);
+  useEffect(function () {
+    if (!document || !rendererDOM) {
+      return;
+    }
     // Ignored via go/ees005
     // eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners
     document.addEventListener('selectionchange', onSelectionChange);
@@ -67,6 +108,6 @@ export var useUserSelectionRange = function useUserSelectionRange(props) {
       document.removeEventListener('selectionchange', onSelectionChange);
       clearRange();
     };
-  }, [rendererDOM, setRange, clearRange]);
+  }, [rendererDOM, onSelectionChange, clearRange]);
   return [type === 'selection' ? range : null, draftRange, clearRange];
 };

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/renderer",
-	"version": "114.7.8",
+	"version": "114.8.0",
 	"description": "Renderer component",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -31,7 +31,7 @@
 		"@atlaskit/analytics-next": "^11.0.0",
 		"@atlaskit/button": "^23.0.0",
 		"@atlaskit/code": "^17.0.0",
-		"@atlaskit/editor-common": "^103.4.0",
+		"@atlaskit/editor-common": "^103.6.0",
 		"@atlaskit/editor-json-transformer": "^8.24.0",
 		"@atlaskit/editor-palette": "^2.1.0",
 		"@atlaskit/editor-prosemirror": "7.0.0",
@@ -39,7 +39,7 @@
 		"@atlaskit/emoji": "^69.0.0",
 		"@atlaskit/feature-gate-js-client": "^5.0.0",
 		"@atlaskit/icon": "^25.5.0",
-		"@atlaskit/link-datasource": "^4.1.0",
+		"@atlaskit/link-datasource": "^4.2.0",
 		"@atlaskit/media-card": "^79.0.0",
 		"@atlaskit/media-client": "^32.0.0",
 		"@atlaskit/media-client-react": "^4.0.0",
@@ -49,12 +49,12 @@
 		"@atlaskit/media-viewer": "^52.0.0",
 		"@atlaskit/platform-feature-flags": "^1.1.0",
 		"@atlaskit/platform-feature-flags-react": "^0.1.0",
-		"@atlaskit/react-ufo": "^3.4.0",
+		"@atlaskit/react-ufo": "^3.5.0",
 		"@atlaskit/smart-card": "^36.5.0",
 		"@atlaskit/status": "^3.0.0",
 		"@atlaskit/task-decision": "^19.1.0",
 		"@atlaskit/theme": "^18.0.0",
-		"@atlaskit/tmp-editor-statsig": "^4.6.0",
+		"@atlaskit/tmp-editor-statsig": "^4.7.0",
 		"@atlaskit/tokens": "^4.7.0",
 		"@atlaskit/tooltip": "^20.0.0",
 		"@atlaskit/visually-hidden": "^3.0.0",
@@ -120,6 +120,9 @@
 		}
 	},
 	"platform-feature-flags": {
+		"cc_complexit_fe_improve_table_sorting": {
+			"type": "boolean"
+		},
 		"platform_editor_typography_ugc": {
 			"type": "boolean"
 		},
@@ -132,9 +135,6 @@
 		"editor_inline_comments_on_inline_nodes": {
 			"type": "boolean"
 		},
-		"forbid_comments_on_empty_newlines": {
-			"type": "boolean"
-		},
 		"annotations_align_editor_and_renderer_styles": {
 			"type": "boolean"
 		},
@@ -206,6 +206,9 @@
 		},
 		"platform_renderer_nested_annotation_styling": {
 			"type": "boolean"
+		},
+		"platform_renderer_triple_click_selects_paragraph": {
+			"type": "boolean"
 		}
 	},
 	"af:exports": {