@atlaskit/renderer 137.1.7 → 137.1.9

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

@@ -19,6 +19,14 @@ type ExpandBody = {
      * expand find had just opened, and any nested renderer that had already loaded.
      */
     revealed: boolean;
+    /**
+     * The expands browser find has opened. One set is shared by a whole chain of expands.
+     *
+     * 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.
+     */
+    revealedByFind: WeakSet<PMNode>;
 };
 export declare const ExpandBodyProvider: Provider<ExpandBody | null>;
 export declare const useExpandBody: () => ExpandBody | null;
@@ -41,15 +49,28 @@ export declare const ExpandBodyBlock: ({ children, searchText }: ExpandBodyBlock
  * wraps it so it can show its text instead of rendering while that expand is collapsed.
  * Everything else is returned untouched.
  *
- * A block holding an expand of its own is also returned untouched, so a table with a nested
- * expand in it, or an extension holding stashed ADF, renders even while collapsed. That
- * expand needs an element of its own, because the element browser find reveals is the only
- * way we learn the match was inside it rather than higher up. We give up the saving on those
- * blocks so the reader searches once instead of once per level.
+ * A block holding an expand of its own is returned untouched, because standing in for the whole
+ * block would take that expand with it, and the expand needs an element of its own: the element
+ * browser find reveals is the only way we learn the match was inside it rather than higher up. A
+ * table is handed to `ExpandBodyTable`, which stands in for its own rows and keeps only the rows
+ * that hold an expand. Everything else — a panel, a list, an extension with stashed ADF — renders
+ * in full, so the reader searches once instead of once per level.
  *
  * `ancestors` is the node's ancestor chain, nearest last.
  */
 export declare const withExpandBodyBlock: (node: PMNode, ancestors: readonly PMNode[], index: number, serialized: JSX.Element | null) => JSX.Element | null;
+type ExpandBodyTableProps = {
+    /** The serialized table, as `serializeFragmentChild` returned it. */
+    children: JSX.Element;
+    node: PMNode;
+};
+/**
+ * A table in the body of a collapsed expand. Shows the text of its rows until the expand is opened,
+ * keeping the rows that hold an expand of their own — those need an element for find to reveal.
+ *
+ * Standing in for the whole table, the way an ordinary block does, would take that expand with it.
+ */
+export declare const ExpandBodyTable: ({ children, node }: ExpandBodyTableProps) => ReactNode;
 /** Whatever the serializer produced for one child: an element, a string, an array of either. */
 type SerializedChild = ReactNode;
 /**

package/dist/types/ui/utils/expand-search-text.d.ts

@@ -21,3 +21,17 @@ export declare const holdsRevealableContent: (node: PMNode) => boolean;
  * @returns the text, or `undefined` if this block has to be rendered instead.
  */
 export declare const getBlockSearchText: (node: PMNode) => string | undefined;
+/**
+ * One piece of what a collapsed table shows: either the text of the rows being stood in for, or the
+ * index of a row that has to keep rendering.
+ */
+export type TableStandInPart = string | number;
+/**
+ * What a table inside a collapsed expand shows in place of rendering, in table order so that find
+ * walks it the way the reader reads it.
+ *
+ * A row keeps rendering when it holds an expand of its own, which needs a real element for browser
+ * find to reveal, or when its text carries an inline comment. Its text is left out of the runs
+ * either side of it, since the row itself puts that text in the DOM.
+ */
+export declare const getTableStandInParts: (table: PMNode) => TableStandInPart[];

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/renderer",
-	"version": "137.1.7",
+	"version": "137.1.9",
 	"description": "Renderer component",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -33,7 +33,7 @@
 		"@atlaskit/adf-schema": "^57.2.0",
 		"@atlaskit/adf-utils": "^20.7.0",
 		"@atlaskit/afm-i18n-platform-editor-renderer": "2.200.0",
-		"@atlaskit/analytics-listeners": "^11.1.0",
+		"@atlaskit/analytics-listeners": "^11.2.0",
 		"@atlaskit/analytics-namespaced-context": "^8.1.0",
 		"@atlaskit/analytics-next": "^12.4.0",
 		"@atlaskit/browser-apis": "^1.2.0",
@@ -41,7 +41,7 @@
 		"@atlaskit/code": "^19.1.0",
 		"@atlaskit/css": "^1.1.0",
 		"@atlaskit/editor-card-provider": "^7.2.0",
-		"@atlaskit/editor-json-transformer": "^9.6.0",
+		"@atlaskit/editor-json-transformer": "^9.7.0",
 		"@atlaskit/editor-palette": "^3.4.0",
 		"@atlaskit/editor-prosemirror": "^8.0.0",
 		"@atlaskit/editor-shared-styles": "^4.0.0",
@@ -62,7 +62,7 @@
 		"@atlaskit/media-viewer": "^54.7.0",
 		"@atlaskit/platform-feature-experiments": "^0.3.0",
 		"@atlaskit/platform-feature-flags": "^2.1.0",
-		"@atlaskit/platform-feature-flags-react": "^1.1.0",
+		"@atlaskit/platform-feature-flags-react": "^1.2.0",
 		"@atlaskit/pragmatic-drag-and-drop": "^3.0.0",
 		"@atlaskit/react-compiler-gating": "^0.2.0",
 		"@atlaskit/react-ufo": "^7.7.0",
@@ -70,7 +70,7 @@
 		"@atlaskit/status": "^5.8.0",
 		"@atlaskit/task-decision": "^21.8.0",
 		"@atlaskit/theme": "^28.1.0",
-		"@atlaskit/tmp-editor-statsig": "^164.0.0",
+		"@atlaskit/tmp-editor-statsig": "^166.0.0",
 		"@atlaskit/tokens": "^16.8.0",
 		"@atlaskit/tooltip": "^24.2.0",
 		"@atlaskit/visually-hidden": "^4.3.0",
@@ -85,9 +85,9 @@
 		"uuid": "^3.1.0"
 	},
 	"peerDependencies": {
-		"@atlaskit/editor-common": "^120.3.0",
+		"@atlaskit/editor-common": "^120.6.0",
 		"@atlaskit/link-provider": "^5.4.0",
-		"@atlaskit/media-core": "^38.0.0",
+		"@atlaskit/media-core": "^38.1.0",
 		"react": "^18.2.0",
 		"react-dom": "^18.2.0",
 		"react-intl": "^5.25.1 || ^6.0.0 || ^7.0.0"
@@ -95,21 +95,21 @@
 	"devDependencies": {
 		"@af/integration-testing": "workspace:^",
 		"@af/visual-regression": "workspace:^",
-		"@atlaskit/analytics-gas-types": "^6.0.0",
+		"@atlaskit/analytics-gas-types": "^6.1.0",
 		"@atlaskit/checkbox": "^19.1.0",
 		"@atlaskit/editor-plugin-media": "^18.0.0",
 		"@atlaskit/editor-test-helpers": "workspace:^",
 		"@atlaskit/inline-edit": "^16.3.0",
 		"@atlaskit/link-provider": "^5.4.0",
 		"@atlaskit/link-test-helpers": "^11.1.0",
-		"@atlaskit/media-core": "^38.0.0",
+		"@atlaskit/media-core": "^38.1.0",
 		"@atlaskit/media-integration-test-helpers": "workspace:^",
 		"@atlaskit/media-test-helpers": "^42.3.0",
 		"@atlaskit/mention": "^27.18.0",
 		"@atlaskit/modal-dialog": "^16.5.0",
 		"@atlaskit/navigation-system": "^10.16.0",
 		"@atlaskit/primitives": "^22.4.0",
-		"@atlaskit/profilecard": "^26.19.0",
+		"@atlaskit/profilecard": "^26.20.0",
 		"@atlaskit/radio": "^10.1.0",
 		"@atlaskit/range": "^12.1.0",
 		"@atlaskit/section-message": "^10.1.0",

package/dist/cjs/ui/expand-body.js

@@ -1,122 +0,0 @@
-"use strict";
-
-var _typeof = require("@babel/runtime/helpers/typeof");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.withExpandBodyBlock = exports.useExpandBody = exports.mergeExpandBodyText = exports.ExpandBodyProvider = exports.ExpandBodyBlock = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var _isExperimentEnabled = require("@atlaskit/platform-feature-experiments/is-experiment-enabled");
-var _expandSearchText = require("./utils/expand-search-text");
-function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
-var ExpandBodyContext = /*#__PURE__*/(0, _react.createContext)(null);
-var ExpandBodyProvider = exports.ExpandBodyProvider = ExpandBodyContext.Provider;
-var useExpandBody = exports.useExpandBody = function useExpandBody() {
-  return (0, _react.useContext)(ExpandBodyContext);
-};
-/**
- * One or more neighbouring blocks of an expand's body. Shows their text until the expand is
- * opened, then renders them. Falls back to rendering if there is no text, or if there is no
- * expand above it.
- *
- * The text is rendered as-is, with no element around it. Nothing reads it but browser find,
- * which only needs the characters to be in the DOM.
- */
-var ExpandBodyBlock = exports.ExpandBodyBlock = function ExpandBodyBlock(_ref) {
-  var children = _ref.children,
-    searchText = _ref.searchText;
-  var body = useExpandBody();
-  if (searchText === undefined || body === null || body.revealed) {
-    return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, children);
-  }
-  return searchText;
-};
-
-/**
- * Called for every node the serializer renders. If the node is a block of an expand's body,
- * wraps it so it can show its text instead of rendering while that expand is collapsed.
- * Everything else is returned untouched.
- *
- * A block holding an expand of its own is also returned untouched, so a table with a nested
- * expand in it, or an extension holding stashed ADF, renders even while collapsed. That
- * expand needs an element of its own, because the element browser find reveals is the only
- * way we learn the match was inside it rather than higher up. We give up the saving on those
- * blocks so the reader searches once instead of once per level.
- *
- * `ancestors` is the node's ancestor chain, nearest last.
- */
-var withExpandBodyBlock = exports.withExpandBodyBlock = function withExpandBodyBlock(node, ancestors, index, serialized) {
-  var parent = ancestors[ancestors.length - 1];
-  if (!parent || !(0, _expandSearchText.isExpandNode)(parent)) {
-    return serialized;
-  }
-  if (!(0, _isExperimentEnabled.isExperimentEnabled)('platform_editor_defer_collapsed_expand_body') || (0, _expandSearchText.holdsRevealableContent)(node)) {
-    return serialized;
-  }
-  var searchText = (0, _expandSearchText.getBlockSearchText)(node);
-  if (searchText === undefined) {
-    return serialized;
-  }
-  return /*#__PURE__*/_react.default.createElement(ExpandBodyBlock, {
-    key: "expand-body-block-".concat(index),
-    searchText: searchText
-  }, serialized);
-};
-
-/** Whatever the serializer produced for one child: an element, a string, an array of either. */
-
-var searchTextOf = function searchTextOf(child) {
-  return /*#__PURE__*/(0, _react.isValidElement)(child) && child.type === ExpandBodyBlock ? child.props.searchText : undefined;
-};
-
-/**
- * Joins neighbouring blocks that are showing text into one, so a run of them is a single string in
- * the DOM rather than one per block. A body of twenty paragraphs becomes one text node instead of
- * twenty.
- *
- * A block that is being rendered — a nested expand, say — ends the run, because the text either
- * side of it has to stay either side of it.
- */
-var mergeExpandBodyText = exports.mergeExpandBodyText = function mergeExpandBodyText(children) {
-  // Called for every fragment in the document, and only an expand's body has anything to merge, so
-  // leave the array alone unless two neighbours are actually showing text.
-  var hasRun = children.some(function (child, index) {
-    return index > 0 && searchTextOf(child) !== undefined && searchTextOf(children[index - 1]) !== undefined;
-  });
-  if (!hasRun) {
-    return children;
-  }
-  var merged = [];
-  var run = [];
-  var endRun = function endRun() {
-    if (run.length === 0) {
-      return;
-    }
-    if (run.length === 1) {
-      merged.push(run[0]);
-    } else {
-      var _key;
-      var text = run.map(searchTextOf).filter(Boolean).join(_expandSearchText.BLOCK_SEPARATOR);
-      // The blocks themselves, not the wrappers around them: nesting the wrappers would show
-      // each block's text again inside the joined run.
-      var blocks = run.map(function (child) {
-        return child.props.children;
-      });
-      merged.push( /*#__PURE__*/_react.default.createElement(ExpandBodyBlock, {
-        key: (_key = run[0].key) !== null && _key !== void 0 ? _key : undefined,
-        searchText: text
-      }, blocks));
-    }
-    run = [];
-  };
-  children.forEach(function (child) {
-    if (searchTextOf(child) === undefined) {
-      endRun();
-      merged.push(child);
-      return;
-    }
-    run.push(child);
-  });
-  endRun();
-  return merged;
-};

package/dist/es2019/ui/expand-body.js

@@ -1,107 +0,0 @@
-import React, { createContext, isValidElement, useContext } from 'react';
-import { isExperimentEnabled } from '@atlaskit/platform-feature-experiments/is-experiment-enabled';
-import { BLOCK_SEPARATOR, getBlockSearchText, holdsRevealableContent, isExpandNode } from './utils/expand-search-text';
-const ExpandBodyContext = /*#__PURE__*/createContext(null);
-export const ExpandBodyProvider = ExpandBodyContext.Provider;
-export const useExpandBody = () => useContext(ExpandBodyContext);
-/**
- * One or more neighbouring blocks of an expand's body. Shows their text until the expand is
- * opened, then renders them. Falls back to rendering if there is no text, or if there is no
- * expand above it.
- *
- * The text is rendered as-is, with no element around it. Nothing reads it but browser find,
- * which only needs the characters to be in the DOM.
- */
-export const ExpandBodyBlock = ({
-  children,
-  searchText
-}) => {
-  const body = useExpandBody();
-  if (searchText === undefined || body === null || body.revealed) {
-    return /*#__PURE__*/React.createElement(React.Fragment, null, children);
-  }
-  return searchText;
-};
-
-/**
- * Called for every node the serializer renders. If the node is a block of an expand's body,
- * wraps it so it can show its text instead of rendering while that expand is collapsed.
- * Everything else is returned untouched.
- *
- * A block holding an expand of its own is also returned untouched, so a table with a nested
- * expand in it, or an extension holding stashed ADF, renders even while collapsed. That
- * expand needs an element of its own, because the element browser find reveals is the only
- * way we learn the match was inside it rather than higher up. We give up the saving on those
- * blocks so the reader searches once instead of once per level.
- *
- * `ancestors` is the node's ancestor chain, nearest last.
- */
-export const withExpandBodyBlock = (node, ancestors, index, serialized) => {
-  const parent = ancestors[ancestors.length - 1];
-  if (!parent || !isExpandNode(parent)) {
-    return serialized;
-  }
-  if (!isExperimentEnabled('platform_editor_defer_collapsed_expand_body') || holdsRevealableContent(node)) {
-    return serialized;
-  }
-  const searchText = getBlockSearchText(node);
-  if (searchText === undefined) {
-    return serialized;
-  }
-  return /*#__PURE__*/React.createElement(ExpandBodyBlock, {
-    key: `expand-body-block-${index}`,
-    searchText: searchText
-  }, serialized);
-};
-
-/** Whatever the serializer produced for one child: an element, a string, an array of either. */
-
-const searchTextOf = child => /*#__PURE__*/isValidElement(child) && child.type === ExpandBodyBlock ? child.props.searchText : undefined;
-
-/**
- * Joins neighbouring blocks that are showing text into one, so a run of them is a single string in
- * the DOM rather than one per block. A body of twenty paragraphs becomes one text node instead of
- * twenty.
- *
- * A block that is being rendered — a nested expand, say — ends the run, because the text either
- * side of it has to stay either side of it.
- */
-export const mergeExpandBodyText = children => {
-  // Called for every fragment in the document, and only an expand's body has anything to merge, so
-  // leave the array alone unless two neighbours are actually showing text.
-  const hasRun = children.some((child, index) => index > 0 && searchTextOf(child) !== undefined && searchTextOf(children[index - 1]) !== undefined);
-  if (!hasRun) {
-    return children;
-  }
-  const merged = [];
-  let run = [];
-  const endRun = () => {
-    if (run.length === 0) {
-      return;
-    }
-    if (run.length === 1) {
-      merged.push(run[0]);
-    } else {
-      var _key;
-      const text = run.map(searchTextOf).filter(Boolean).join(BLOCK_SEPARATOR);
-      // The blocks themselves, not the wrappers around them: nesting the wrappers would show
-      // each block's text again inside the joined run.
-      const blocks = run.map(child => child.props.children);
-      merged.push( /*#__PURE__*/React.createElement(ExpandBodyBlock, {
-        key: (_key = run[0].key) !== null && _key !== void 0 ? _key : undefined,
-        searchText: text
-      }, blocks));
-    }
-    run = [];
-  };
-  children.forEach(child => {
-    if (searchTextOf(child) === undefined) {
-      endRun();
-      merged.push(child);
-      return;
-    }
-    run.push(child);
-  });
-  endRun();
-  return merged;
-};

package/dist/esm/ui/expand-body.js

@@ -1,114 +0,0 @@
-import React, { createContext, isValidElement, useContext } from 'react';
-import { isExperimentEnabled } from '@atlaskit/platform-feature-experiments/is-experiment-enabled';
-import { BLOCK_SEPARATOR, getBlockSearchText, holdsRevealableContent, isExpandNode } from './utils/expand-search-text';
-var ExpandBodyContext = /*#__PURE__*/createContext(null);
-export var ExpandBodyProvider = ExpandBodyContext.Provider;
-export var useExpandBody = function useExpandBody() {
-  return useContext(ExpandBodyContext);
-};
-/**
- * One or more neighbouring blocks of an expand's body. Shows their text until the expand is
- * opened, then renders them. Falls back to rendering if there is no text, or if there is no
- * expand above it.
- *
- * The text is rendered as-is, with no element around it. Nothing reads it but browser find,
- * which only needs the characters to be in the DOM.
- */
-export var ExpandBodyBlock = function ExpandBodyBlock(_ref) {
-  var children = _ref.children,
-    searchText = _ref.searchText;
-  var body = useExpandBody();
-  if (searchText === undefined || body === null || body.revealed) {
-    return /*#__PURE__*/React.createElement(React.Fragment, null, children);
-  }
-  return searchText;
-};
-
-/**
- * Called for every node the serializer renders. If the node is a block of an expand's body,
- * wraps it so it can show its text instead of rendering while that expand is collapsed.
- * Everything else is returned untouched.
- *
- * A block holding an expand of its own is also returned untouched, so a table with a nested
- * expand in it, or an extension holding stashed ADF, renders even while collapsed. That
- * expand needs an element of its own, because the element browser find reveals is the only
- * way we learn the match was inside it rather than higher up. We give up the saving on those
- * blocks so the reader searches once instead of once per level.
- *
- * `ancestors` is the node's ancestor chain, nearest last.
- */
-export var withExpandBodyBlock = function withExpandBodyBlock(node, ancestors, index, serialized) {
-  var parent = ancestors[ancestors.length - 1];
-  if (!parent || !isExpandNode(parent)) {
-    return serialized;
-  }
-  if (!isExperimentEnabled('platform_editor_defer_collapsed_expand_body') || holdsRevealableContent(node)) {
-    return serialized;
-  }
-  var searchText = getBlockSearchText(node);
-  if (searchText === undefined) {
-    return serialized;
-  }
-  return /*#__PURE__*/React.createElement(ExpandBodyBlock, {
-    key: "expand-body-block-".concat(index),
-    searchText: searchText
-  }, serialized);
-};
-
-/** Whatever the serializer produced for one child: an element, a string, an array of either. */
-
-var searchTextOf = function searchTextOf(child) {
-  return /*#__PURE__*/isValidElement(child) && child.type === ExpandBodyBlock ? child.props.searchText : undefined;
-};
-
-/**
- * Joins neighbouring blocks that are showing text into one, so a run of them is a single string in
- * the DOM rather than one per block. A body of twenty paragraphs becomes one text node instead of
- * twenty.
- *
- * A block that is being rendered — a nested expand, say — ends the run, because the text either
- * side of it has to stay either side of it.
- */
-export var mergeExpandBodyText = function mergeExpandBodyText(children) {
-  // Called for every fragment in the document, and only an expand's body has anything to merge, so
-  // leave the array alone unless two neighbours are actually showing text.
-  var hasRun = children.some(function (child, index) {
-    return index > 0 && searchTextOf(child) !== undefined && searchTextOf(children[index - 1]) !== undefined;
-  });
-  if (!hasRun) {
-    return children;
-  }
-  var merged = [];
-  var run = [];
-  var endRun = function endRun() {
-    if (run.length === 0) {
-      return;
-    }
-    if (run.length === 1) {
-      merged.push(run[0]);
-    } else {
-      var _key;
-      var text = run.map(searchTextOf).filter(Boolean).join(BLOCK_SEPARATOR);
-      // The blocks themselves, not the wrappers around them: nesting the wrappers would show
-      // each block's text again inside the joined run.
-      var blocks = run.map(function (child) {
-        return child.props.children;
-      });
-      merged.push( /*#__PURE__*/React.createElement(ExpandBodyBlock, {
-        key: (_key = run[0].key) !== null && _key !== void 0 ? _key : undefined,
-        searchText: text
-      }, blocks));
-    }
-    run = [];
-  };
-  children.forEach(function (child) {
-    if (searchTextOf(child) === undefined) {
-      endRun();
-      merged.push(child);
-      return;
-    }
-    run.push(child);
-  });
-  endRun();
-  return merged;
-};