@atlaskit/renderer 137.2.0 → 137.2.2

package/CHANGELOG.md

@@ -1,5 +1,41 @@
 # @atlaskit/renderer
 
+## 137.2.2
+
+### Patch Changes
+
+- Updated dependencies
+
+## 137.2.1
+
+### Patch Changes
+
+- [`4db8fed8666c0`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/4db8fed8666c0) -
+  Clean up experiment `platform_editor_close_expand_find` and permanently enable browser find in
+  collapsed Expand content.
+- [`5cacf96fc4102`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/5cacf96fc4102) -
+  A collapsed expand no longer wraps a body that is standing in for itself in `WidthProvider`, or
+  renders the div that clears the following sibling's margin. Nothing in that body is laid out until
+  the reader or browser find opens the expand, so neither is of any use yet, and `WidthProvider`
+  costs two divs, a `ResizeObserver` and an `IntersectionObserver` for every expand on the page.
+
+  Opening the expand puts both back. React cannot add a DOM ancestor without rebuilding what is
+  under it, so the blocks that do render while collapsed are mounted a second time then: a nested
+  expand, which comes back open through the set browser find records it in, and an extension holding
+  stashed ADF, whose nested renderer is rebuilt.
+
+  Behind the `platform_editor_defer_collapsed_expand_body` experiment, which controls whether a
+  collapsed expand holds its body back at all.
+
+- [`08bf773f7599a`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/08bf773f7599a) -
+  Migrate experiments to use the new platform experiment API. This major release removes the
+  migrated experiment entries from `@atlaskit/tmp-editor-statsig`'s `editorExperimentsConfig` and
+  test overrides. Consumers must replace legacy `expVal`/`expValEquals` calls with
+  `@atlaskit/platform-feature-experiments` APIs, using `isExperimentEnabled` for boolean `isEnabled`
+  experiments and `expVal` for parameterized experiments; use `mockExpEnabled`/`mockExpDisabled` in
+  tests.
+- Updated dependencies
+
 ## 137.2.0
 
 ### Minor Changes

package/dist/cjs/react/nodes/heading-anchor.js

@@ -19,8 +19,9 @@ var _react = _interopRequireDefault(require("react"));
 var _react2 = require("@emotion/react");
 var _reactIntl = require("react-intl");
 var _link = _interopRequireDefault(require("@atlaskit/icon/core/link"));
-var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
+var _isExperimentEnabled = require("@atlaskit/platform-feature-experiments/is-experiment-enabled");
 var _Tooltip = _interopRequireDefault(require("@atlaskit/tooltip/Tooltip"));
+var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
 var _messages = require("../../messages");
 var _excluded = ["children"];
 /**
@@ -74,7 +75,7 @@ var HeadingAnchor = /*#__PURE__*/function (_React$PureComponent) {
         isClicked: isClicked
       }, function () {
         // Reposition tooltip after content change (replaces the key-based remount)
-        if ((0, _expValEquals.expValEquals)('a11y-fixes-week4-may-2026', 'isEnabled', true)) {
+        if ((0, _isExperimentEnabled.isExperimentEnabled)('a11y-fixes-week4-may-2026')) {
           var _this$_tooltipUpdate, _this2;
           (_this$_tooltipUpdate = (_this2 = _this)._tooltipUpdate) === null || _this$_tooltipUpdate === void 0 || _this$_tooltipUpdate.call(_this2);
         }
@@ -158,7 +159,7 @@ var HeadingAnchor = /*#__PURE__*/function (_React$PureComponent) {
     value: function render() {
       var tooltipMessage = this.state.tooltipMessage;
       if (tooltipMessage) {
-        if ((0, _expValEquals.expValEquals)('a11y-fixes-week4-may-2026', 'isEnabled', true)) {
+        if ((0, _isExperimentEnabled.isExperimentEnabled)('a11y-fixes-week4-may-2026')) {
           // Fix for A11Y-30972: Use content as a function with update callback so
           // the Tooltip repositions without unmounting (which caused focus loss).
           // @see https://hello.jira.atlassian.cloud/browse/A11Y-30972

package/dist/cjs/ui/Expand.js

@@ -102,7 +102,7 @@ var titleContainerStylesExpanded = (0, _react.css)({
 });
 
 // Base styles for the content container. visibility:hidden hides collapsed content.
-// When browser find is enabled, the useEffect clears visibility:hidden after setting
+// When browser find is supported, the useEffect clears visibility:hidden after setting
 // hidden="until-found" on the DOM element, which applies content-visibility:hidden natively —
 // this hides the content while allowing browser Ctrl+F to index the text.
 // The visibility:hidden in CSS serves as an SSR fallback (useEffect doesn't run server-side).
@@ -121,8 +121,8 @@ var contentContainerStyles = (0, _react.css)({
   }
 });
 
-// display:flow-root is applied only when browser find is NOT enabled.
-// It must NOT be set when browser find is enabled — it overrides the
+// display:flow-root is applied only when browser find is not supported.
+// It must NOT be set when browser find is supported — it overrides the
 // content-visibility:hidden applied by hidden="until-found" and makes content visible.
 var contentContainerStylesFlowRoot = (0, _react.css)({
   display: 'flow-root'
@@ -145,7 +145,7 @@ var contentContainerStylesNotExpanded = (0, _react.css)({
   }
 });
 
-// When browser find is enabled and expand is collapsed, we rely on the
+// When browser find is supported and expand is collapsed, we rely on the
 // hidden="until-found" attribute on the outer container to hide content.
 // We remove height:0/overflow:hidden/clip from the inner wrapper so the
 // browser can actually search through the content.
@@ -331,7 +331,7 @@ function Expand(_ref) {
     if (!contentWrapper) {
       return;
     }
-    if (supportsHiddenUntilFound && (0, _isExperimentEnabled.isExperimentEnabled)('platform_editor_close_expand_find') && !expanded) {
+    if (supportsHiddenUntilFound && !expanded) {
       contentWrapper.setAttribute('hidden', 'until-found');
       // Products ship a CSS reset with `[hidden] { display: none }` — Confluence does. That is an
       // author rule, so it beats the UA stylesheet's
@@ -354,7 +354,7 @@ function Expand(_ref) {
     }
   }, [expanded, supportsHiddenUntilFound]);
   (0, _react2.useEffect)(function () {
-    if (!(0, _isExperimentEnabled.isExperimentEnabled)('platform_editor_close_expand_find') || expanded) {
+    if (expanded) {
       return;
     }
     var contentWrapper = contentWrapperRef.current;
@@ -383,6 +383,9 @@ function Expand(_ref) {
       revealedByFind: revealedByFind
     };
   }, [revealed, openWithAncestors, revealedByFind]);
+  var body = (0, _react.jsx)(_expandBody.ExpandBodyProvider, {
+    value: expandBody
+  }, children);
   return (0, _react.jsx)(Container, {
     "data-testid": "expand-container-".concat(nodeType, "-").concat(id),
     "data-node-type": nodeType,
@@ -440,16 +443,14 @@ function Expand(_ref) {
     id: id
   }, title || intl.formatMessage(_ui.expandMessages.expandDefaultTitle))), (0, _react.jsx)(ContentContainer, {
     expanded: expanded,
-    enableBrowserFind: supportsHiddenUntilFound && (0, _isExperimentEnabled.isExperimentEnabled)('platform_editor_close_expand_find'),
+    enableBrowserFind: supportsHiddenUntilFound,
     contentRef: contentContainerRef
   }, (0, _react.jsx)("div", {
     className: "".concat(nodeType, "-content-wrapper"),
     ref: contentWrapperRef
-  }, (0, _react.jsx)(_ui.WidthProvider, null, (0, _react.jsx)("div", {
+  }, revealed ? (0, _react.jsx)(_ui.WidthProvider, null, (0, _react.jsx)("div", {
     css: clearNextSiblingMarginTopStyle
-  }), (0, _react.jsx)(_expandBody.ExpandBodyProvider, {
-    value: expandBody
-  }, children)))));
+  }), body) : body)));
 }
 
 // eslint-disable-next-line @typescript-eslint/no-restricted-types

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

@@ -74,7 +74,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 = "137.1.11";
+var packageVersion = "137.2.1";
 var setAsQueryContainerStyles = (0, _react2.css)({
   containerName: 'ak-renderer-wrapper',
   containerType: 'inline-size'

package/dist/es2019/react/nodes/heading-anchor.js

@@ -10,8 +10,9 @@ import React from 'react';
 import { css, jsx } from '@emotion/react';
 import { injectIntl } from 'react-intl';
 import LinkIcon from '@atlaskit/icon/core/link';
-import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
+import { isExperimentEnabled } from '@atlaskit/platform-feature-experiments/is-experiment-enabled';
 import Tooltip from '@atlaskit/tooltip/Tooltip';
+import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import { headingAnchorLinkMessages } from '../../messages';
 export const HeadingAnchorWrapperClassName = 'heading-anchor-wrapper';
 const CopyAnchorWrapperWithRef = /*#__PURE__*/React.forwardRef((props, ref) => {
@@ -57,7 +58,7 @@ class HeadingAnchor extends React.PureComponent {
         isClicked
       }, () => {
         // Reposition tooltip after content change (replaces the key-based remount)
-        if (expValEquals('a11y-fixes-week4-may-2026', 'isEnabled', true)) {
+        if (isExperimentEnabled('a11y-fixes-week4-may-2026')) {
           var _this$_tooltipUpdate;
           (_this$_tooltipUpdate = this._tooltipUpdate) === null || _this$_tooltipUpdate === void 0 ? void 0 : _this$_tooltipUpdate.call(this);
         }
@@ -123,7 +124,7 @@ class HeadingAnchor extends React.PureComponent {
       tooltipMessage
     } = this.state;
     if (tooltipMessage) {
-      if (expValEquals('a11y-fixes-week4-may-2026', 'isEnabled', true)) {
+      if (isExperimentEnabled('a11y-fixes-week4-may-2026')) {
         // Fix for A11Y-30972: Use content as a function with update callback so
         // the Tooltip repositions without unmounting (which caused focus loss).
         // @see https://hello.jira.atlassian.cloud/browse/A11Y-30972

package/dist/es2019/ui/Expand.js

@@ -91,7 +91,7 @@ const titleContainerStylesExpanded = css({
 });
 
 // Base styles for the content container. visibility:hidden hides collapsed content.
-// When browser find is enabled, the useEffect clears visibility:hidden after setting
+// When browser find is supported, the useEffect clears visibility:hidden after setting
 // hidden="until-found" on the DOM element, which applies content-visibility:hidden natively —
 // this hides the content while allowing browser Ctrl+F to index the text.
 // The visibility:hidden in CSS serves as an SSR fallback (useEffect doesn't run server-side).
@@ -110,8 +110,8 @@ const contentContainerStyles = css({
   }
 });
 
-// display:flow-root is applied only when browser find is NOT enabled.
-// It must NOT be set when browser find is enabled — it overrides the
+// display:flow-root is applied only when browser find is not supported.
+// It must NOT be set when browser find is supported — it overrides the
 // content-visibility:hidden applied by hidden="until-found" and makes content visible.
 const contentContainerStylesFlowRoot = css({
   display: 'flow-root'
@@ -134,7 +134,7 @@ const contentContainerStylesNotExpanded = css({
   }
 });
 
-// When browser find is enabled and expand is collapsed, we rely on the
+// When browser find is supported and expand is collapsed, we rely on the
 // hidden="until-found" attribute on the outer container to hide content.
 // We remove height:0/overflow:hidden/clip from the inner wrapper so the
 // browser can actually search through the content.
@@ -308,7 +308,7 @@ function Expand({
     if (!contentWrapper) {
       return;
     }
-    if (supportsHiddenUntilFound && isExperimentEnabled('platform_editor_close_expand_find') && !expanded) {
+    if (supportsHiddenUntilFound && !expanded) {
       contentWrapper.setAttribute('hidden', 'until-found');
       // Products ship a CSS reset with `[hidden] { display: none }` — Confluence does. That is an
       // author rule, so it beats the UA stylesheet's
@@ -331,7 +331,7 @@ function Expand({
     }
   }, [expanded, supportsHiddenUntilFound]);
   useEffect(() => {
-    if (!isExperimentEnabled('platform_editor_close_expand_find') || expanded) {
+    if (expanded) {
       return;
     }
     const contentWrapper = contentWrapperRef.current;
@@ -358,6 +358,9 @@ function Expand({
     openWithAncestors,
     revealedByFind
   }), [revealed, openWithAncestors, revealedByFind]);
+  const body = jsx(ExpandBodyProvider, {
+    value: expandBody
+  }, children);
   return jsx(Container, {
     "data-testid": `expand-container-${nodeType}-${id}`,
     "data-node-type": nodeType,
@@ -415,16 +418,14 @@ function Expand({
     id: id
   }, title || intl.formatMessage(expandMessages.expandDefaultTitle))), jsx(ContentContainer, {
     expanded: expanded,
-    enableBrowserFind: supportsHiddenUntilFound && isExperimentEnabled('platform_editor_close_expand_find'),
+    enableBrowserFind: supportsHiddenUntilFound,
     contentRef: contentContainerRef
   }, jsx("div", {
     className: `${nodeType}-content-wrapper`,
     ref: contentWrapperRef
-  }, jsx(WidthProvider, null, jsx("div", {
+  }, revealed ? jsx(WidthProvider, null, jsx("div", {
     css: clearNextSiblingMarginTopStyle
-  }), jsx(ExpandBodyProvider, {
-    value: expandBody
-  }, children)))));
+  }), body) : body)));
 }
 
 // eslint-disable-next-line @typescript-eslint/no-restricted-types

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

@@ -60,7 +60,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 = "137.1.11";
+const packageVersion = "137.2.1";
 const setAsQueryContainerStyles = css({
   containerName: 'ak-renderer-wrapper',
   containerType: 'inline-size'

package/dist/esm/react/nodes/heading-anchor.js

@@ -21,8 +21,9 @@ import React from 'react';
 import { css, jsx } from '@emotion/react';
 import { injectIntl } from 'react-intl';
 import LinkIcon from '@atlaskit/icon/core/link';
-import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
+import { isExperimentEnabled } from '@atlaskit/platform-feature-experiments/is-experiment-enabled';
 import Tooltip from '@atlaskit/tooltip/Tooltip';
+import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import { headingAnchorLinkMessages } from '../../messages';
 export var HeadingAnchorWrapperClassName = 'heading-anchor-wrapper';
 var CopyAnchorWrapperWithRef = /*#__PURE__*/React.forwardRef(function (props, ref) {
@@ -68,7 +69,7 @@ var HeadingAnchor = /*#__PURE__*/function (_React$PureComponent) {
         isClicked: isClicked
       }, function () {
         // Reposition tooltip after content change (replaces the key-based remount)
-        if (expValEquals('a11y-fixes-week4-may-2026', 'isEnabled', true)) {
+        if (isExperimentEnabled('a11y-fixes-week4-may-2026')) {
           var _this$_tooltipUpdate, _this2;
           (_this$_tooltipUpdate = (_this2 = _this)._tooltipUpdate) === null || _this$_tooltipUpdate === void 0 || _this$_tooltipUpdate.call(_this2);
         }
@@ -152,7 +153,7 @@ var HeadingAnchor = /*#__PURE__*/function (_React$PureComponent) {
     value: function render() {
       var tooltipMessage = this.state.tooltipMessage;
       if (tooltipMessage) {
-        if (expValEquals('a11y-fixes-week4-may-2026', 'isEnabled', true)) {
+        if (isExperimentEnabled('a11y-fixes-week4-may-2026')) {
           // Fix for A11Y-30972: Use content as a function with update callback so
           // the Tooltip repositions without unmounting (which caused focus loss).
           // @see https://hello.jira.atlassian.cloud/browse/A11Y-30972

package/dist/esm/ui/Expand.js

@@ -92,7 +92,7 @@ var titleContainerStylesExpanded = css({
 });
 
 // Base styles for the content container. visibility:hidden hides collapsed content.
-// When browser find is enabled, the useEffect clears visibility:hidden after setting
+// When browser find is supported, the useEffect clears visibility:hidden after setting
 // hidden="until-found" on the DOM element, which applies content-visibility:hidden natively —
 // this hides the content while allowing browser Ctrl+F to index the text.
 // The visibility:hidden in CSS serves as an SSR fallback (useEffect doesn't run server-side).
@@ -111,8 +111,8 @@ var contentContainerStyles = css({
   }
 });
 
-// display:flow-root is applied only when browser find is NOT enabled.
-// It must NOT be set when browser find is enabled — it overrides the
+// display:flow-root is applied only when browser find is not supported.
+// It must NOT be set when browser find is supported — it overrides the
 // content-visibility:hidden applied by hidden="until-found" and makes content visible.
 var contentContainerStylesFlowRoot = css({
   display: 'flow-root'
@@ -135,7 +135,7 @@ var contentContainerStylesNotExpanded = css({
   }
 });
 
-// When browser find is enabled and expand is collapsed, we rely on the
+// When browser find is supported and expand is collapsed, we rely on the
 // hidden="until-found" attribute on the outer container to hide content.
 // We remove height:0/overflow:hidden/clip from the inner wrapper so the
 // browser can actually search through the content.
@@ -321,7 +321,7 @@ function Expand(_ref) {
     if (!contentWrapper) {
       return;
     }
-    if (supportsHiddenUntilFound && isExperimentEnabled('platform_editor_close_expand_find') && !expanded) {
+    if (supportsHiddenUntilFound && !expanded) {
       contentWrapper.setAttribute('hidden', 'until-found');
       // Products ship a CSS reset with `[hidden] { display: none }` — Confluence does. That is an
       // author rule, so it beats the UA stylesheet's
@@ -344,7 +344,7 @@ function Expand(_ref) {
     }
   }, [expanded, supportsHiddenUntilFound]);
   useEffect(function () {
-    if (!isExperimentEnabled('platform_editor_close_expand_find') || expanded) {
+    if (expanded) {
       return;
     }
     var contentWrapper = contentWrapperRef.current;
@@ -373,6 +373,9 @@ function Expand(_ref) {
       revealedByFind: revealedByFind
     };
   }, [revealed, openWithAncestors, revealedByFind]);
+  var body = jsx(ExpandBodyProvider, {
+    value: expandBody
+  }, children);
   return jsx(Container, {
     "data-testid": "expand-container-".concat(nodeType, "-").concat(id),
     "data-node-type": nodeType,
@@ -430,16 +433,14 @@ function Expand(_ref) {
     id: id
   }, title || intl.formatMessage(expandMessages.expandDefaultTitle))), jsx(ContentContainer, {
     expanded: expanded,
-    enableBrowserFind: supportsHiddenUntilFound && isExperimentEnabled('platform_editor_close_expand_find'),
+    enableBrowserFind: supportsHiddenUntilFound,
     contentRef: contentContainerRef
   }, jsx("div", {
     className: "".concat(nodeType, "-content-wrapper"),
     ref: contentWrapperRef
-  }, jsx(WidthProvider, null, jsx("div", {
+  }, revealed ? jsx(WidthProvider, null, jsx("div", {
     css: clearNextSiblingMarginTopStyle
-  }), jsx(ExpandBodyProvider, {
-    value: expandBody
-  }, children)))));
+  }), body) : body)));
 }
 
 // eslint-disable-next-line @typescript-eslint/no-restricted-types

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

@@ -65,7 +65,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 = "137.1.11";
+var packageVersion = "137.2.1";
 var setAsQueryContainerStyles = css({
   containerName: 'ak-renderer-wrapper',
   containerType: 'inline-size'

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/renderer",
-	"version": "137.2.0",
+	"version": "137.2.2",
 	"description": "Renderer component",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -55,7 +55,7 @@
 		"@atlaskit/linking-common": "^12.1.0",
 		"@atlaskit/media-card": "^81.9.0",
 		"@atlaskit/media-client": "^37.6.0",
-		"@atlaskit/media-client-react": "^6.3.0",
+		"@atlaskit/media-client-react": "^6.4.0",
 		"@atlaskit/media-common": "^14.6.0",
 		"@atlaskit/media-filmstrip": "^52.4.0",
 		"@atlaskit/media-ui": "^30.15.0",
@@ -70,8 +70,8 @@
 		"@atlaskit/status": "^5.9.0",
 		"@atlaskit/task-decision": "^21.9.0",
 		"@atlaskit/theme": "^28.2.0",
-		"@atlaskit/tmp-editor-statsig": "^168.0.0",
-		"@atlaskit/tokens": "^16.10.0",
+		"@atlaskit/tmp-editor-statsig": "^170.0.0",
+		"@atlaskit/tokens": "^16.11.0",
 		"@atlaskit/tooltip": "^24.3.0",
 		"@atlaskit/visually-hidden": "^4.4.0",
 		"@babel/runtime": "^7.0.0",
@@ -85,7 +85,7 @@
 		"uuid": "^3.1.0"
 	},
 	"peerDependencies": {
-		"@atlaskit/editor-common": "^120.9.0",
+		"@atlaskit/editor-common": "^120.10.0",
 		"@atlaskit/link-provider": "^5.5.0",
 		"@atlaskit/media-core": "^38.2.0",
 		"react": "^18.2.0",