@atlaskit/editor-plugin-type-ahead 11.3.5 → 12.0.0

package/CHANGELOG.md

@@ -1,5 +1,42 @@
 # @atlaskit/editor-plugin-type-ahead
 
+## 12.0.0
+
+### Major Changes
+
+- [`f2dc9097319f0`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/f2dc9097319f0) - ###
+  Dropped support for _legacy_ Typescript 4 types. **Typescript 5 is now the new minimum**.
+
+  Removes the `typesVersions` property and `dist/types-ts4.5` directory from the dist.
+
+  Types are now exclusively via the `"types": "dist/types/index.d.ts"` property.
+
+  ```diff
+  - "typesVersions": {
+  -    ">=4.5 <4.9": {
+  -        "*": [
+  -            "dist/types-ts4.5/*",
+  -            "dist/types-ts4.5/index.d.ts"
+  -        ]
+  -    }
+  - },
+  ```
+
+### Minor Changes
+
+- [`78adaba64ee33`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/78adaba64ee33) -
+  Add opt-in section title display controls for typeahead sections
+
+### Patch Changes
+
+- Updated dependencies
+
+## 11.3.6
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 11.3.5
 
 ### Patch Changes

package/commands/package.json

@@ -6,12 +6,5 @@
   "sideEffects": [
     "*.compiled.css"
   ],
-  "types": "../dist/types/entry-points/commands.d.ts",
-  "typesVersions": {
-    ">=4.5 <5.9": {
-      "*": [
-        "../dist/types-ts4.5/entry-points/commands.d.ts"
-      ]
-    }
-  }
+  "types": "../dist/types/entry-points/commands.d.ts"
 }

package/dist/cjs/pm-plugins/commands/update-section-title.js

@@ -1,30 +1,27 @@
 "use strict";
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.updateSectionTitle = void 0;
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _expVal = require("@atlaskit/tmp-editor-statsig/expVal");
 var _actions = require("../actions");
 var _key = require("../key");
-function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var updateSectionTitle = exports.updateSectionTitle = function updateSectionTitle(_ref) {
   var id = _ref.id,
     title = _ref.title,
-    showTitleWhenOnlySection = _ref.showTitleWhenOnlySection;
+    sectionTitleDisplay = _ref.sectionTitleDisplay;
   return function (state, dispatch) {
     if (!(0, _expVal.expVal)('platform_editor_agent_mentions', 'isEnabled', false) || !dispatch) {
       return false;
     }
     var tr = state.tr;
-    var update = _objectSpread({
+    var update = {
       title: title
-    }, showTitleWhenOnlySection !== undefined ? {
-      showTitleWhenOnlySection: showTitleWhenOnlySection
-    } : {});
+    };
+    if (sectionTitleDisplay !== undefined) {
+      update.sectionTitleDisplay = sectionTitleDisplay;
+    }
     tr.setMeta(_key.pluginKey, {
       action: _actions.ACTIONS.UPDATE_SECTION_TITLE,
       params: {

package/dist/cjs/ui/TypeAheadList.js

@@ -20,7 +20,7 @@ var _ui = require("@atlaskit/editor-common/ui");
 var _menu = require("@atlaskit/menu");
 var _compiled = require("@atlaskit/primitives/compiled");
 var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
-var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
+var _expVal = require("@atlaskit/tmp-editor-statsig/expVal");
 var _closeTypeAhead = require("../pm-plugins/commands/close-type-ahead");
 var _updateSelectedIndex = require("../pm-plugins/commands/update-selected-index");
 var _constants = require("../pm-plugins/constants");
@@ -44,9 +44,34 @@ var list = (0, _react2.css)({
     padding: "var(--ds-space-100, 8px)".concat(" ", "var(--ds-space-150, 12px)")
   }
 });
-var buildTypeAheadRows = exports.buildTypeAheadRows = function buildTypeAheadRows(_ref) {
-  var itemsLength = _ref.itemsLength,
-    sections = _ref.sections;
+/**
+ * Resolves section title visibility before rows are built so hidden titles do not
+ * occupy virtualized list rows. A single populated section keeps the existing
+ * no-title behaviour unless it opts in with `showWhenOnlySection`; multiple
+ * populated sections show titles by default. `showWhenQueryPresent: false`
+ * takes precedence once the query is non-empty.
+ */
+var shouldRenderSectionTitle = function shouldRenderSectionTitle(_ref) {
+  var _section$sectionTitle;
+  var isEmptyQuery = _ref.isEmptyQuery,
+    populatedSectionCount = _ref.populatedSectionCount,
+    section = _ref.section;
+  if (!(0, _expVal.expVal)('platform_editor_agent_mentions', 'isEnabled', false)) {
+    return populatedSectionCount > 1;
+  }
+  if (!isEmptyQuery && ((_section$sectionTitle = section.sectionTitleDisplay) === null || _section$sectionTitle === void 0 ? void 0 : _section$sectionTitle.showWhenQueryPresent) === false) {
+    return false;
+  }
+  if (populatedSectionCount === 1) {
+    var _section$sectionTitle2;
+    return ((_section$sectionTitle2 = section.sectionTitleDisplay) === null || _section$sectionTitle2 === void 0 ? void 0 : _section$sectionTitle2.showWhenOnlySection) === true;
+  }
+  return true;
+};
+var buildTypeAheadRows = exports.buildTypeAheadRows = function buildTypeAheadRows(_ref2) {
+  var isEmptyQuery = _ref2.isEmptyQuery,
+    itemsLength = _ref2.itemsLength,
+    sections = _ref2.sections;
   if (sections.length === 0) {
     return Array.from({
       length: itemsLength
@@ -64,13 +89,21 @@ var buildTypeAheadRows = exports.buildTypeAheadRows = function buildTypeAheadRow
     return [section.startIndex, section];
   }));
   var rows = [];
+  var populatedSectionCount = sortedSections.length;
   for (var itemIndex = 0; itemIndex < itemsLength; itemIndex++) {
     var section = sectionsByStartIndex.get(itemIndex);
     if (section) {
-      rows.push({
-        type: 'section',
+      var shouldRenderTitle = shouldRenderSectionTitle({
+        isEmptyQuery: isEmptyQuery,
+        populatedSectionCount: populatedSectionCount,
         section: section
       });
+      if (shouldRenderTitle) {
+        rows.push({
+          type: 'section',
+          section: section
+        });
+      }
     }
     rows.push({
       type: 'item',
@@ -79,8 +112,8 @@ var buildTypeAheadRows = exports.buildTypeAheadRows = function buildTypeAheadRow
   }
   return rows;
 };
-var TypeaheadAssistiveTextPureComponent = /*#__PURE__*/_react.default.memo(function (_ref2) {
-  var numberOfResults = _ref2.numberOfResults;
+var TypeaheadAssistiveTextPureComponent = /*#__PURE__*/_react.default.memo(function (_ref3) {
+  var numberOfResults = _ref3.numberOfResults;
   var intl = (0, _reactIntl.useIntl)();
   return (0, _react2.jsx)(_ui.AssistiveText, {
     assistiveText: intl.formatMessage(_typeAhead.typeAheadListMessages.searchResultsLabel, {
@@ -92,22 +125,24 @@ var TypeaheadAssistiveTextPureComponent = /*#__PURE__*/_react.default.memo(funct
     id: _constants.TYPE_AHEAD_DECORATION_ELEMENT_ID + '__popup'
   });
 });
-var TypeAheadListComponent = /*#__PURE__*/_react.default.memo(function (_ref3) {
+var TypeAheadListComponent = /*#__PURE__*/_react.default.memo(function (_ref4) {
   var _itemRowIndexByItemIn, _triggerHandler$getMo, _decorationElement$qu2;
-  var items = _ref3.items,
-    sections = _ref3.sections,
-    emptyItem = _ref3.emptyItem,
-    selectedIndex = _ref3.selectedIndex,
-    editorView = _ref3.editorView,
-    onItemClick = _ref3.onItemClick,
-    intl = _ref3.intl,
-    fitHeight = _ref3.fitHeight,
-    decorationElement = _ref3.decorationElement,
-    triggerHandler = _ref3.triggerHandler,
-    moreElementsInQuickInsertViewEnabled = _ref3.moreElementsInQuickInsertViewEnabled,
-    api = _ref3.api,
-    showMoreOptionsButton = _ref3.showMoreOptionsButton,
-    onMoreOptionsClicked = _ref3.onMoreOptionsClicked;
+  var items = _ref4.items,
+    sections = _ref4.sections,
+    emptyItem = _ref4.emptyItem,
+    selectedIndex = _ref4.selectedIndex,
+    _ref4$isEmptyQuery = _ref4.isEmptyQuery,
+    isEmptyQuery = _ref4$isEmptyQuery === void 0 ? true : _ref4$isEmptyQuery,
+    editorView = _ref4.editorView,
+    onItemClick = _ref4.onItemClick,
+    intl = _ref4.intl,
+    fitHeight = _ref4.fitHeight,
+    decorationElement = _ref4.decorationElement,
+    triggerHandler = _ref4.triggerHandler,
+    moreElementsInQuickInsertViewEnabled = _ref4.moreElementsInQuickInsertViewEnabled,
+    api = _ref4.api,
+    showMoreOptionsButton = _ref4.showMoreOptionsButton,
+    onMoreOptionsClicked = _ref4.onMoreOptionsClicked;
   var listRef = (0, _react.useRef)();
   var listContainerRef = (0, _react.useRef)(null);
   var lastInputMethodRef = (0, _react.useRef)('keyboard');
@@ -136,10 +171,11 @@ var TypeAheadListComponent = /*#__PURE__*/_react.default.memo(function (_ref3) {
     setCache = _useState4[1];
   var listRows = (0, _react.useMemo)(function () {
     return buildTypeAheadRows({
+      isEmptyQuery: isEmptyQuery,
       itemsLength: itemsLength,
       sections: sections || []
     });
-  }, [itemsLength, sections]);
+  }, [isEmptyQuery, itemsLength, sections]);
   var itemRowIndexByItemIndex = (0, _react.useMemo)(function () {
     var rowIndexByItemIndex = new Map();
     listRows.forEach(function (row, rowIndex) {
@@ -150,11 +186,6 @@ var TypeAheadListComponent = /*#__PURE__*/_react.default.memo(function (_ref3) {
     return rowIndexByItemIndex;
   }, [listRows]);
   var selectedItemRowIndex = selectedIndex >= 0 ? (_itemRowIndexByItemIn = itemRowIndexByItemIndex.get(selectedIndex)) !== null && _itemRowIndexByItemIn !== void 0 ? _itemRowIndexByItemIn : -1 : -1;
-  var populatedSectionCount = (0, _react.useMemo)(function () {
-    return listRows.filter(function (row) {
-      return row.type === 'section';
-    }).length;
-  }, [listRows]);
   var onItemsRendered = (0, _react.useCallback)(function (props) {
     lastVisibleIndexes.current = props;
   }, []);
@@ -191,8 +222,8 @@ var TypeAheadListComponent = /*#__PURE__*/_react.default.memo(function (_ref3) {
   var lastVisibleStopIndex = lastVisibleIndexes.current.stopIndex;
   var onScroll = (0, _react.useCallback)(
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  function (_ref4) {
-    var scrollUpdateWasRequested = _ref4.scrollUpdateWasRequested;
+  function (_ref5) {
+    var scrollUpdateWasRequested = _ref5.scrollUpdateWasRequested;
     if (!scrollUpdateWasRequested) {
       return;
     }
@@ -278,7 +309,7 @@ var TypeAheadListComponent = /*#__PURE__*/_react.default.memo(function (_ref3) {
   }, [items, sections]);
   (0, _react.useLayoutEffect)(function () {
     // Exclude view more item from the count
-    var itemsToRender = (0, _experiments.editorExperiment)('platform_editor_agent_mentions', true) ? listRows : showMoreOptionsButton ? items.slice(0, -1) : items;
+    var itemsToRender = (0, _expVal.expVal)('platform_editor_agent_mentions', 'isEnabled', false) ? listRows : showMoreOptionsButton ? items.slice(0, -1) : items;
     var height = Math.min(
     // eslint-disable-next-line @atlassian/perf-linting/no-expensive-computations-in-render -- Ignored via go/ees017 (to be fixed)
     itemsToRender.reduce(function (prevValue, currentValue, index) {
@@ -350,8 +381,8 @@ var TypeAheadListComponent = /*#__PURE__*/_react.default.memo(function (_ref3) {
     if (onMoreOptionsClicked) {
       onMoreOptionsClicked();
     }
-    api === null || api === void 0 || api.core.actions.execute(function (_ref5) {
-      var tr = _ref5.tr;
+    api === null || api === void 0 || api.core.actions.execute(function (_ref6) {
+      var tr = _ref6.tr;
       (0, _closeTypeAhead.closeTypeAhead)(tr);
       config === null || config === void 0 || config.onClick({
         tr: tr
@@ -359,26 +390,25 @@ var TypeAheadListComponent = /*#__PURE__*/_react.default.memo(function (_ref3) {
       return tr;
     });
   };
-  var renderRow = function renderRow(_ref6) {
-    var index = _ref6.index,
-      key = _ref6.key,
-      style = _ref6.style,
-      parent = _ref6.parent,
-      isScrolling = _ref6.isScrolling,
-      isVisible = _ref6.isVisible;
+  var renderRow = function renderRow(_ref7) {
+    var index = _ref7.index,
+      key = _ref7.key,
+      style = _ref7.style,
+      parent = _ref7.parent,
+      isScrolling = _ref7.isScrolling,
+      isVisible = _ref7.isVisible;
     var currentRow = listRows[index];
     if (!currentRow) {
       return null;
     }
-    var shouldHideSingleSectionTitle = currentRow.type === 'section' && populatedSectionCount === 1 && !currentRow.section.showTitleWhenOnlySection;
     return (0, _react2.jsx)(_CellMeasurer.CellMeasurer, {
       key: key,
       cache: cache,
       parent: parent,
       columnIndex: 0,
       rowIndex: index
-    }, function (_ref7) {
-      var measure = _ref7.measure;
+    }, function (_ref8) {
+      var measure = _ref8.measure;
       return (0, _react2.jsx)(_ListRow.ListRow, {
         measure: measure,
         index: index
@@ -392,10 +422,7 @@ var TypeAheadListComponent = /*#__PURE__*/_react.default.memo(function (_ref3) {
         onMouseMove: function onMouseMove(e) {
           return _onMouseMove(e, currentRow);
         }
-      }, currentRow.type === 'section' ?
-      // Preserve the existing collapsed-title behaviour for single-section results unless
-      // the gated section title API explicitly asks for the title to remain visible.
-      shouldHideSingleSectionTitle ? null : (0, _react2.jsx)(_compiled.Box, {
+      }, currentRow.type === 'section' ? (0, _react2.jsx)(_compiled.Box, {
         paddingInline: "space.150",
         paddingBlock: "space.050"
       }, (0, _react2.jsx)(_compiled.Text, {

package/dist/cjs/ui/TypeAheadPopup.js

@@ -351,6 +351,7 @@ var TypeAheadPopup = exports.TypeAheadPopup = /*#__PURE__*/_react.default.memo(f
     triggerHandler: triggerHandler
   }), (0, _react2.jsx)(_TypeAheadList.TypeAheadList, {
     items: items,
+    isEmptyQuery: isEmptyQuery,
     sections: sections,
     emptyItem: emptyItem,
     selectedIndex: selectedIndex

package/dist/cjs/ui/hooks/build-sectioned-result.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.buildSectionedResult = void 0;
 var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
-var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
+var _expVal = require("@atlaskit/tmp-editor-statsig/expVal");
 function _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) { t && (r = t); var _n = 0, F = function F() {}; return { s: F, n: function n() { return _n >= r.length ? { done: !0 } : { done: !1, value: r[_n++] }; }, e: function e(r) { throw r; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var o, a = !0, u = !1; return { s: function s() { t = t.call(r); }, n: function n() { var r = t.next(); return a = r.done, r; }, e: function e(r) { u = !0, o = r; }, f: function f() { try { a || null == t.return || t.return(); } finally { if (u) throw o; } } }; }
 function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
 function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
@@ -15,7 +15,7 @@ var buildSectionedResult = exports.buildSectionedResult = function buildSectione
   var items = _ref.items,
     triggerHandler = _ref.triggerHandler,
     intl = _ref.intl;
-  if (!(0, _experiments.editorExperiment)('platform_editor_agent_mentions', true) || !intl) {
+  if (!(0, _expVal.expVal)('platform_editor_agent_mentions', 'isEnabled', false) || !intl) {
     return {
       items: items,
       sections: []
@@ -105,12 +105,16 @@ var buildSectionedResult = exports.buildSectionedResult = function buildSectione
         return items[i];
       })));
       var endIndex = flattenedItems.length - 1;
-      sections.push({
+      var resolvedSection = {
         endIndex: endIndex,
         id: _section.id,
         startIndex: startIndex,
         title: _section.title
-      });
+      };
+      if (_section.sectionTitleDisplay) {
+        resolvedSection.sectionTitleDisplay = _section.sectionTitleDisplay;
+      }
+      sections.push(resolvedSection);
     }
 
     // Append items not claimed by any section and not excluded by a limit

package/dist/es2019/pm-plugins/commands/update-section-title.js

@@ -4,7 +4,7 @@ import { pluginKey as typeAheadPluginKey } from '../key';
 export const updateSectionTitle = ({
   id,
   title,
-  showTitleWhenOnlySection
+  sectionTitleDisplay
 }) => {
   return (state, dispatch) => {
     if (!expVal('platform_editor_agent_mentions', 'isEnabled', false) || !dispatch) {
@@ -12,11 +12,11 @@ export const updateSectionTitle = ({
     }
     const tr = state.tr;
     const update = {
-      title,
-      ...(showTitleWhenOnlySection !== undefined ? {
-        showTitleWhenOnlySection
-      } : {})
+      title
     };
+    if (sectionTitleDisplay !== undefined) {
+      update.sectionTitleDisplay = sectionTitleDisplay;
+    }
     tr.setMeta(typeAheadPluginKey, {
       action: ACTIONS.UPDATE_SECTION_TITLE,
       params: {

package/dist/es2019/ui/TypeAheadList.js

@@ -17,7 +17,7 @@ import { AssistiveText } from '@atlaskit/editor-common/ui';
 import { MenuGroup } from '@atlaskit/menu';
 import { Text, Box } from '@atlaskit/primitives/compiled';
 import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
-import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
+import { expVal } from '@atlaskit/tmp-editor-statsig/expVal';
 import { closeTypeAhead } from '../pm-plugins/commands/close-type-ahead';
 import { updateSelectedIndex } from '../pm-plugins/commands/update-selected-index';
 import { TYPE_AHEAD_DECORATION_ELEMENT_ID } from '../pm-plugins/constants';
@@ -33,7 +33,33 @@ const list = css({
     padding: `${"var(--ds-space-100, 8px)"} ${"var(--ds-space-150, 12px)"}`
   }
 });
+/**
+ * Resolves section title visibility before rows are built so hidden titles do not
+ * occupy virtualized list rows. A single populated section keeps the existing
+ * no-title behaviour unless it opts in with `showWhenOnlySection`; multiple
+ * populated sections show titles by default. `showWhenQueryPresent: false`
+ * takes precedence once the query is non-empty.
+ */
+const shouldRenderSectionTitle = ({
+  isEmptyQuery,
+  populatedSectionCount,
+  section
+}) => {
+  var _section$sectionTitle;
+  if (!expVal('platform_editor_agent_mentions', 'isEnabled', false)) {
+    return populatedSectionCount > 1;
+  }
+  if (!isEmptyQuery && ((_section$sectionTitle = section.sectionTitleDisplay) === null || _section$sectionTitle === void 0 ? void 0 : _section$sectionTitle.showWhenQueryPresent) === false) {
+    return false;
+  }
+  if (populatedSectionCount === 1) {
+    var _section$sectionTitle2;
+    return ((_section$sectionTitle2 = section.sectionTitleDisplay) === null || _section$sectionTitle2 === void 0 ? void 0 : _section$sectionTitle2.showWhenOnlySection) === true;
+  }
+  return true;
+};
 export const buildTypeAheadRows = ({
+  isEmptyQuery,
   itemsLength,
   sections
 }) => {
@@ -48,13 +74,21 @@ export const buildTypeAheadRows = ({
   const sortedSections = [...sections].sort((left, right) => left.startIndex - right.startIndex);
   const sectionsByStartIndex = new Map(sortedSections.map(section => [section.startIndex, section]));
   const rows = [];
+  const populatedSectionCount = sortedSections.length;
   for (let itemIndex = 0; itemIndex < itemsLength; itemIndex++) {
     const section = sectionsByStartIndex.get(itemIndex);
     if (section) {
-      rows.push({
-        type: 'section',
+      const shouldRenderTitle = shouldRenderSectionTitle({
+        isEmptyQuery,
+        populatedSectionCount,
         section
       });
+      if (shouldRenderTitle) {
+        rows.push({
+          type: 'section',
+          section
+        });
+      }
     }
     rows.push({
       type: 'item',
@@ -82,6 +116,7 @@ const TypeAheadListComponent = /*#__PURE__*/React.memo(({
   sections,
   emptyItem,
   selectedIndex,
+  isEmptyQuery = true,
   editorView,
   onItemClick,
   intl,
@@ -115,9 +150,10 @@ const TypeAheadListComponent = /*#__PURE__*/React.memo(({
     defaultHeight: LIST_ITEM_ESTIMATED_HEIGHT
   }));
   const listRows = useMemo(() => buildTypeAheadRows({
+    isEmptyQuery,
     itemsLength,
     sections: sections || []
-  }), [itemsLength, sections]);
+  }), [isEmptyQuery, itemsLength, sections]);
   const itemRowIndexByItemIndex = useMemo(() => {
     const rowIndexByItemIndex = new Map();
     listRows.forEach((row, rowIndex) => {
@@ -128,7 +164,6 @@ const TypeAheadListComponent = /*#__PURE__*/React.memo(({
     return rowIndexByItemIndex;
   }, [listRows]);
   const selectedItemRowIndex = selectedIndex >= 0 ? (_itemRowIndexByItemIn = itemRowIndexByItemIndex.get(selectedIndex)) !== null && _itemRowIndexByItemIn !== void 0 ? _itemRowIndexByItemIn : -1 : -1;
-  const populatedSectionCount = useMemo(() => listRows.filter(row => row.type === 'section').length, [listRows]);
   const onItemsRendered = useCallback(props => {
     lastVisibleIndexes.current = props;
   }, []);
@@ -247,7 +282,7 @@ const TypeAheadListComponent = /*#__PURE__*/React.memo(({
   }, [items, sections]);
   useLayoutEffect(() => {
     // Exclude view more item from the count
-    const itemsToRender = editorExperiment('platform_editor_agent_mentions', true) ? listRows : showMoreOptionsButton ? items.slice(0, -1) : items;
+    const itemsToRender = expVal('platform_editor_agent_mentions', 'isEnabled', false) ? listRows : showMoreOptionsButton ? items.slice(0, -1) : items;
     const height = Math.min(
     // eslint-disable-next-line @atlassian/perf-linting/no-expensive-computations-in-render -- Ignored via go/ees017 (to be fixed)
     itemsToRender.reduce((prevValue, currentValue, index) => {
@@ -341,7 +376,6 @@ const TypeAheadListComponent = /*#__PURE__*/React.memo(({
     if (!currentRow) {
       return null;
     }
-    const shouldHideSingleSectionTitle = currentRow.type === 'section' && populatedSectionCount === 1 && !currentRow.section.showTitleWhenOnlySection;
     return jsx(CellMeasurer, {
       key: key,
       cache: cache,
@@ -361,10 +395,7 @@ const TypeAheadListComponent = /*#__PURE__*/React.memo(({
       // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
       ,
       onMouseMove: e => onMouseMove(e, currentRow)
-    }, currentRow.type === 'section' ?
-    // Preserve the existing collapsed-title behaviour for single-section results unless
-    // the gated section title API explicitly asks for the title to remain visible.
-    shouldHideSingleSectionTitle ? null : jsx(Box, {
+    }, currentRow.type === 'section' ? jsx(Box, {
       paddingInline: "space.150",
       paddingBlock: "space.050"
     }, jsx(Text, {

package/dist/es2019/ui/TypeAheadPopup.js

@@ -346,6 +346,7 @@ export const TypeAheadPopup = /*#__PURE__*/React.memo(props => {
     triggerHandler: triggerHandler
   }), jsx(TypeAheadList, {
     items: items,
+    isEmptyQuery: isEmptyQuery,
     sections: sections,
     emptyItem: emptyItem,
     selectedIndex: selectedIndex

package/dist/es2019/ui/hooks/build-sectioned-result.js

@@ -1,11 +1,11 @@
-import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
+import { expVal } from '@atlaskit/tmp-editor-statsig/expVal';
 export const buildSectionedResult = ({
   items,
   triggerHandler,
   intl
 }) => {
   var _triggerHandler$getSe;
-  if (!editorExperiment('platform_editor_agent_mentions', true) || !intl) {
+  if (!expVal('platform_editor_agent_mentions', 'isEnabled', false) || !intl) {
     return {
       items,
       sections: []
@@ -62,12 +62,16 @@ export const buildSectionedResult = ({
     const startIndex = flattenedItems.length;
     flattenedItems.push(...grouped.indexes.map(i => items[i]));
     const endIndex = flattenedItems.length - 1;
-    sections.push({
+    const resolvedSection = {
       endIndex,
       id: section.id,
       startIndex,
       title: section.title
-    });
+    };
+    if (section.sectionTitleDisplay) {
+      resolvedSection.sectionTitleDisplay = section.sectionTitleDisplay;
+    }
+    sections.push(resolvedSection);
   }
 
   // Append items not claimed by any section and not excluded by a limit

package/dist/esm/pm-plugins/commands/update-section-title.js

@@ -1,23 +1,21 @@
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 import { expVal } from '@atlaskit/tmp-editor-statsig/expVal';
 import { ACTIONS } from '../actions';
 import { pluginKey as typeAheadPluginKey } from '../key';
 export var updateSectionTitle = function updateSectionTitle(_ref) {
   var id = _ref.id,
     title = _ref.title,
-    showTitleWhenOnlySection = _ref.showTitleWhenOnlySection;
+    sectionTitleDisplay = _ref.sectionTitleDisplay;
   return function (state, dispatch) {
     if (!expVal('platform_editor_agent_mentions', 'isEnabled', false) || !dispatch) {
       return false;
     }
     var tr = state.tr;
-    var update = _objectSpread({
+    var update = {
       title: title
-    }, showTitleWhenOnlySection !== undefined ? {
-      showTitleWhenOnlySection: showTitleWhenOnlySection
-    } : {});
+    };
+    if (sectionTitleDisplay !== undefined) {
+      update.sectionTitleDisplay = sectionTitleDisplay;
+    }
     tr.setMeta(typeAheadPluginKey, {
       action: ACTIONS.UPDATE_SECTION_TITLE,
       params: {