@atlaskit/renderer 148.0.3 → 148.1.0

package/CHANGELOG.md

@@ -1,5 +1,29 @@
 # @atlaskit/renderer
 
+## 148.1.0
+
+### Minor Changes
+
+- [`f115a893c63dd`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/f115a893c63dd) -
+  Exports `ExpandBodyProvider` (`@atlaskit/renderer/expand-body`), so a product can provide the
+  outermost expand body itself. Expands under it share one `revealedByFind` set, so they come back
+  as browser find left them when the product remounts them, such as when it replaces a lightly
+  rendered subtree with its full render. Under `cc_light_mode_table_virtualization`, the set also
+  records expands the reader opens and closes, so they come back as the reader left them too.
+
+### Patch Changes
+
+- Updated dependencies
+
+## 148.0.4
+
+### Patch Changes
+
+- [`b50791096b149`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/b50791096b149) -
+  Reduce built-in paragraph serializer props allocation behind
+  platform_renderer_paragraph_props_fast_path.
+- Updated dependencies
+
 ## 148.0.3
 
 ### Patch Changes

package/dist/cjs/entry-points/expand-body.js

@@ -0,0 +1,12 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "ExpandBodyProvider", {
+  enumerable: true,
+  get: function get() {
+    return _expandBody.ExpandBodyProvider;
+  }
+});
+var _expandBody = require("../ui/utils/expand-body");

package/dist/cjs/react/index.js

@@ -66,6 +66,7 @@ var ReactSerializer = exports.default = /*#__PURE__*/function () {
     (0, _defineProperty2.default)(this, "allowCustomPanels", false);
     (0, _defineProperty2.default)(this, "surroundTextNodesWithTextWrapper", false);
     (0, _defineProperty2.default)(this, "textFastPath", false);
+    (0, _defineProperty2.default)(this, "paragraphPropsFastPath", false);
     (0, _defineProperty2.default)(this, "allowAnnotations", false);
     (0, _defineProperty2.default)(this, "standaloneBackgroundColorMarks", []);
     (0, _defineProperty2.default)(this, "inlinePositions", new Set());
@@ -210,6 +211,7 @@ var ReactSerializer = exports.default = /*#__PURE__*/function () {
     this.allowAnnotations = Boolean(init.allowAnnotations);
     this.surroundTextNodesWithTextWrapper = Boolean(init.surroundTextNodesWithTextWrapper);
     this.textFastPath = (0, _expVal.expVal)('platform_renderer_text_paragraph_fast_path', 'isEnabled', false);
+    this.paragraphPropsFastPath = (0, _expVal.expVal)('platform_renderer_paragraph_props_fast_path', 'isEnabled', false);
     this.media = init.media;
     this.mentionNodeDataProvider = init.mentionNodeDataProvider;
     this.emojiProviderLookupOrder = init.emojiProviderLookupOrder;
@@ -243,6 +245,12 @@ var ReactSerializer = exports.default = /*#__PURE__*/function () {
     value: function getNodeProps(node, parentInfo) {
       var path = parentInfo ? parentInfo.path : undefined;
       switch (node.type.name) {
+        case 'paragraph':
+          // Explicit paragraph overrides retain the full generic props contract.
+          if (this.paragraphPropsFastPath && (!this.nodeComponents || !Object.prototype.hasOwnProperty.call(this.nodeComponents, 'paragraph'))) {
+            return this.getParagraphProps(node, path);
+          }
+          return this.getProps(node, path);
         case 'date':
           return this.getDateProps(node, parentInfo, path);
         case 'hardBreak':
@@ -661,6 +669,25 @@ var ReactSerializer = exports.default = /*#__PURE__*/function () {
         allowCustomPanels: this.allowCustomPanels
       });
     }
+  }, {
+    key: "getParagraphProps",
+    value: function getParagraphProps(node) {
+      var path = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
+      var startPos = this.startPos + path.length;
+
+      // Keep traversal metadata for serializer subclasses without allocating unused content getters.
+      return _objectSpread({
+        asInline: this.inlinePositions.has(startPos) ? 'on' : undefined,
+        plainTextFastPath: this.textFastPath,
+        nodeType: node.type.name,
+        marks: node.marks,
+        dataAttributes: {
+          'data-renderer-start-pos': startPos
+        },
+        startPos: startPos,
+        path: path
+      }, node.attrs);
+    }
   }, {
     key: "getProps",
     value: function getProps(node) {

package/dist/cjs/ui/Expand.js

@@ -17,6 +17,7 @@ var _analytics = require("@atlaskit/editor-common/analytics");
 var _ui = require("@atlaskit/editor-common/ui");
 var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
 var _chevronRight = _interopRequireDefault(require("@atlaskit/icon/core/chevron-right"));
+var _isExperimentEnabled = require("@atlaskit/platform-feature-experiments/is-experiment-enabled");
 var _Tooltip = _interopRequireDefault(require("@atlaskit/tooltip/Tooltip"));
 var _events = require("../analytics/events");
 var _activeHeaderIdProvider = require("./active-header-id-provider");
@@ -403,10 +404,19 @@ function Expand(_ref) {
       e.preventDefault();
       e.stopPropagation();
       fireExpandToggleAnalytics(nodeType, expanded, fireAnalyticsEvent);
+      // Recorded so a product remounting this expand under its own body gets it back as the
+      // reader left it.
+      var recordsToggle = node !== undefined && (0, _isExperimentEnabled.isExperimentEnabled)('cc_light_mode_table_virtualization');
       if (expanded) {
         setExpanded(false);
+        if (recordsToggle) {
+          revealedByFind.delete(node);
+        }
       } else {
         openBody();
+        if (recordsToggle) {
+          revealedByFind.add(node);
+        }
       }
       e.persist();
       // @ts-ignore detail doesn't exist on type

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

@@ -72,7 +72,7 @@ var DEGRADED_SEVERITY_THRESHOLD = exports.DEGRADED_SEVERITY_THRESHOLD = 3000;
 var TABLE_INFO_TIMEOUT = 10000;
 var RENDER_EVENT_SAMPLE_RATE = 0.1;
 var packageName = "@atlaskit/renderer";
-var packageVersion = "148.0.2";
+var packageVersion = "148.0.4";
 var setAsQueryContainerStyles = (0, _react2.css)({
   containerName: 'ak-renderer-wrapper',
   containerType: 'inline-size'

package/dist/es2019/entry-points/expand-body.js

@@ -0,0 +1,3 @@
+/* eslint-disable @atlaskit/editor/no-re-export */
+
+export { ExpandBodyProvider } from '../ui/utils/expand-body';

package/dist/es2019/react/index.js

@@ -50,6 +50,7 @@ export default class ReactSerializer {
     _defineProperty(this, "allowCustomPanels", false);
     _defineProperty(this, "surroundTextNodesWithTextWrapper", false);
     _defineProperty(this, "textFastPath", false);
+    _defineProperty(this, "paragraphPropsFastPath", false);
     _defineProperty(this, "allowAnnotations", false);
     _defineProperty(this, "standaloneBackgroundColorMarks", []);
     _defineProperty(this, "inlinePositions", new Set());
@@ -197,6 +198,7 @@ export default class ReactSerializer {
     this.allowAnnotations = Boolean(init.allowAnnotations);
     this.surroundTextNodesWithTextWrapper = Boolean(init.surroundTextNodesWithTextWrapper);
     this.textFastPath = expVal('platform_renderer_text_paragraph_fast_path', 'isEnabled', false);
+    this.paragraphPropsFastPath = expVal('platform_renderer_paragraph_props_fast_path', 'isEnabled', false);
     this.media = init.media;
     this.mentionNodeDataProvider = init.mentionNodeDataProvider;
     this.emojiProviderLookupOrder = init.emojiProviderLookupOrder;
@@ -226,6 +228,12 @@ export default class ReactSerializer {
   getNodeProps(node, parentInfo) {
     const path = parentInfo ? parentInfo.path : undefined;
     switch (node.type.name) {
+      case 'paragraph':
+        // Explicit paragraph overrides retain the full generic props contract.
+        if (this.paragraphPropsFastPath && (!this.nodeComponents || !Object.prototype.hasOwnProperty.call(this.nodeComponents, 'paragraph'))) {
+          return this.getParagraphProps(node, path);
+        }
+        return this.getProps(node, path);
       case 'date':
         return this.getDateProps(node, parentInfo, path);
       case 'hardBreak':
@@ -590,6 +598,23 @@ export default class ReactSerializer {
       allowCustomPanels: this.allowCustomPanels
     };
   }
+  getParagraphProps(node, path = []) {
+    const startPos = this.startPos + path.length;
+
+    // Keep traversal metadata for serializer subclasses without allocating unused content getters.
+    return {
+      asInline: this.inlinePositions.has(startPos) ? 'on' : undefined,
+      plainTextFastPath: this.textFastPath,
+      nodeType: node.type.name,
+      marks: node.marks,
+      dataAttributes: {
+        'data-renderer-start-pos': startPos
+      },
+      startPos,
+      path,
+      ...node.attrs
+    };
+  }
   getProps(node, path = []) {
     const startPos = this.startPos + path.length;
     return {

package/dist/es2019/ui/Expand.js

@@ -15,6 +15,7 @@ import { ACTION, ACTION_SUBJECT, EVENT_TYPE } from '@atlaskit/editor-common/anal
 import { ExpandIconWrapper, ExpandLayoutWrapperWithRef, expandMessages, WidthProvider } from '@atlaskit/editor-common/ui';
 import { akEditorLineHeight, akEditorSwoopCubicBezier, akLayoutGutterOffset } from '@atlaskit/editor-shared-styles';
 import ChevronRightIcon from '@atlaskit/icon/core/chevron-right';
+import { isExperimentEnabled } from '@atlaskit/platform-feature-experiments/is-experiment-enabled';
 import Tooltip from '@atlaskit/tooltip/Tooltip';
 import { MODE, PLATFORM } from '../analytics/events';
 import { ActiveHeaderIdConsumer } from './active-header-id-provider';
@@ -379,10 +380,19 @@ function Expand({
       e.preventDefault();
       e.stopPropagation();
       fireExpandToggleAnalytics(nodeType, expanded, fireAnalyticsEvent);
+      // Recorded so a product remounting this expand under its own body gets it back as the
+      // reader left it.
+      const recordsToggle = node !== undefined && isExperimentEnabled('cc_light_mode_table_virtualization');
       if (expanded) {
         setExpanded(false);
+        if (recordsToggle) {
+          revealedByFind.delete(node);
+        }
       } else {
         openBody();
+        if (recordsToggle) {
+          revealedByFind.add(node);
+        }
       }
       e.persist();
       // @ts-ignore detail doesn't exist on type

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

@@ -57,7 +57,7 @@ export const DEGRADED_SEVERITY_THRESHOLD = 3000;
 const TABLE_INFO_TIMEOUT = 10000;
 const RENDER_EVENT_SAMPLE_RATE = 0.1;
 const packageName = "@atlaskit/renderer";
-const packageVersion = "148.0.2";
+const packageVersion = "148.0.4";
 const setAsQueryContainerStyles = css({
   containerName: 'ak-renderer-wrapper',
   containerType: 'inline-size'

package/dist/esm/entry-points/expand-body.js

@@ -0,0 +1,3 @@
+/* eslint-disable @atlaskit/editor/no-re-export */
+
+export { ExpandBodyProvider } from '../ui/utils/expand-body';

package/dist/esm/react/index.js

@@ -59,6 +59,7 @@ var ReactSerializer = /*#__PURE__*/function () {
     _defineProperty(this, "allowCustomPanels", false);
     _defineProperty(this, "surroundTextNodesWithTextWrapper", false);
     _defineProperty(this, "textFastPath", false);
+    _defineProperty(this, "paragraphPropsFastPath", false);
     _defineProperty(this, "allowAnnotations", false);
     _defineProperty(this, "standaloneBackgroundColorMarks", []);
     _defineProperty(this, "inlinePositions", new Set());
@@ -203,6 +204,7 @@ var ReactSerializer = /*#__PURE__*/function () {
     this.allowAnnotations = Boolean(init.allowAnnotations);
     this.surroundTextNodesWithTextWrapper = Boolean(init.surroundTextNodesWithTextWrapper);
     this.textFastPath = expVal('platform_renderer_text_paragraph_fast_path', 'isEnabled', false);
+    this.paragraphPropsFastPath = expVal('platform_renderer_paragraph_props_fast_path', 'isEnabled', false);
     this.media = init.media;
     this.mentionNodeDataProvider = init.mentionNodeDataProvider;
     this.emojiProviderLookupOrder = init.emojiProviderLookupOrder;
@@ -236,6 +238,12 @@ var ReactSerializer = /*#__PURE__*/function () {
     value: function getNodeProps(node, parentInfo) {
       var path = parentInfo ? parentInfo.path : undefined;
       switch (node.type.name) {
+        case 'paragraph':
+          // Explicit paragraph overrides retain the full generic props contract.
+          if (this.paragraphPropsFastPath && (!this.nodeComponents || !Object.prototype.hasOwnProperty.call(this.nodeComponents, 'paragraph'))) {
+            return this.getParagraphProps(node, path);
+          }
+          return this.getProps(node, path);
         case 'date':
           return this.getDateProps(node, parentInfo, path);
         case 'hardBreak':
@@ -654,6 +662,25 @@ var ReactSerializer = /*#__PURE__*/function () {
         allowCustomPanels: this.allowCustomPanels
       });
     }
+  }, {
+    key: "getParagraphProps",
+    value: function getParagraphProps(node) {
+      var path = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
+      var startPos = this.startPos + path.length;
+
+      // Keep traversal metadata for serializer subclasses without allocating unused content getters.
+      return _objectSpread({
+        asInline: this.inlinePositions.has(startPos) ? 'on' : undefined,
+        plainTextFastPath: this.textFastPath,
+        nodeType: node.type.name,
+        marks: node.marks,
+        dataAttributes: {
+          'data-renderer-start-pos': startPos
+        },
+        startPos: startPos,
+        path: path
+      }, node.attrs);
+    }
   }, {
     key: "getProps",
     value: function getProps(node) {

package/dist/esm/ui/Expand.js

@@ -16,6 +16,7 @@ import { ACTION, ACTION_SUBJECT, EVENT_TYPE } from '@atlaskit/editor-common/anal
 import { ExpandIconWrapper, ExpandLayoutWrapperWithRef, expandMessages, WidthProvider } from '@atlaskit/editor-common/ui';
 import { akEditorLineHeight, akEditorSwoopCubicBezier, akLayoutGutterOffset } from '@atlaskit/editor-shared-styles';
 import ChevronRightIcon from '@atlaskit/icon/core/chevron-right';
+import { isExperimentEnabled } from '@atlaskit/platform-feature-experiments/is-experiment-enabled';
 import Tooltip from '@atlaskit/tooltip/Tooltip';
 import { MODE, PLATFORM } from '../analytics/events';
 import { ActiveHeaderIdConsumer } from './active-header-id-provider';
@@ -394,10 +395,19 @@ function Expand(_ref) {
       e.preventDefault();
       e.stopPropagation();
       fireExpandToggleAnalytics(nodeType, expanded, fireAnalyticsEvent);
+      // Recorded so a product remounting this expand under its own body gets it back as the
+      // reader left it.
+      var recordsToggle = node !== undefined && isExperimentEnabled('cc_light_mode_table_virtualization');
       if (expanded) {
         setExpanded(false);
+        if (recordsToggle) {
+          revealedByFind.delete(node);
+        }
       } else {
         openBody();
+        if (recordsToggle) {
+          revealedByFind.add(node);
+        }
       }
       e.persist();
       // @ts-ignore detail doesn't exist on type

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

@@ -62,7 +62,7 @@ export var DEGRADED_SEVERITY_THRESHOLD = 3000;
 var TABLE_INFO_TIMEOUT = 10000;
 var RENDER_EVENT_SAMPLE_RATE = 0.1;
 var packageName = "@atlaskit/renderer";
-var packageVersion = "148.0.2";
+var packageVersion = "148.0.4";
 var setAsQueryContainerStyles = css({
   containerName: 'ak-renderer-wrapper',
   containerType: 'inline-size'

package/dist/types/entry-points/expand-body.d.ts

@@ -0,0 +1,2 @@
+export { ExpandBodyProvider } from '../ui/utils/expand-body';
+export type { ExpandBody } from '../ui/utils/expand-body';

package/dist/types/react/index.d.ts

@@ -105,6 +105,7 @@ export default class ReactSerializer implements Serializer<JSX.Element> {
     private startPos;
     private surroundTextNodesWithTextWrapper;
     private textFastPath;
+    private paragraphPropsFastPath;
     private media?;
     private mentionNodeDataProvider?;
     private emojiProviderLookupOrder?;
@@ -156,6 +157,7 @@ export default class ReactSerializer implements Serializer<JSX.Element> {
     private getCodeBlockProps;
     private getPanelProps;
     private getUnsupportedContentProps;
+    private getParagraphProps;
     private getProps;
     private headingAnchorSupported;
     private getHeadingProps;

package/dist/types/react/types.d.ts

@@ -58,6 +58,11 @@ export interface NodeMeta {
     serializer: Serializer<JSX.Element>;
     text?: PMNode['text'];
 }
+/** Internal metadata for built-in paragraphs; custom node components still receive NodeMeta. */
+export type ParagraphMeta = Pick<NodeMeta, 'asInline' | 'plainTextFastPath' | 'dataAttributes' | 'nodeType' | 'marks'> & {
+    path: PMNode[];
+    startPos: number;
+};
 export interface MarkMeta {
     [key: string]: any;
     dataAttributes: {

package/dist/types/ui/utils/expand-body.d.ts

@@ -1,6 +1,6 @@
 import type { Provider, ReactNode } from 'react';
 import type { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
-type ExpandBody = {
+export type ExpandBody = {
     /**
      * Opens this expand, then asks the expand above it to do the same.
      *
@@ -20,11 +20,13 @@ type ExpandBody = {
      */
     revealed: boolean;
     /**
-     * The expands browser find has opened. One set is shared by a whole chain of expands.
+     * The expands browser find or the reader has opened. One set is shared by a whole chain of
+     * expands, and by every expand under a body a product provides itself.
      *
      * A table standing in for itself does swap out what it renders, and a nested expand in one of its
      * rows is rebuilt when it does. This is how that expand knows to come back open rather than
-     * closed over the match the reader was just taken to.
+     * closed over the match the reader was just taken to. A product that remounts what is under its
+     * own body gets its expands back the same way.
      */
     revealedByFind: WeakSet<PMNode>;
 };

package/expand-body/package.json

@@ -0,0 +1,10 @@
+{
+  "name": "@atlaskit/renderer/expand-body",
+  "main": "../dist/cjs/entry-points/expand-body.js",
+  "module": "../dist/esm/entry-points/expand-body.js",
+  "module:es2019": "../dist/es2019/entry-points/expand-body.js",
+  "sideEffects": [
+    "*.compiled.css"
+  ],
+  "types": "../dist/types/entry-points/expand-body.d.ts"
+}

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/renderer",
-	"version": "148.0.3",
+	"version": "148.1.0",
 	"description": "Renderer component",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -73,7 +73,7 @@
 		"@atlaskit/status": "^5.13.0",
 		"@atlaskit/task-decision": "^21.12.0",
 		"@atlaskit/theme": "^28.2.0",
-		"@atlaskit/tmp-editor-statsig": "^226.0.0",
+		"@atlaskit/tmp-editor-statsig": "^227.0.0",
 		"@atlaskit/tokens": "^20.3.0",
 		"@atlaskit/tooltip": "^24.4.0",
 		"@atlaskit/visually-hidden": "^4.4.0",