@atlaskit/editor-plugin-type-ahead 12.0.6 → 12.0.7

package/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @atlaskit/editor-plugin-type-ahead
 
+## 12.0.7
+
+### Patch Changes
+
+- [`cf7797df5ff1e`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/cf7797df5ff1e) -
+  [ux] Add a Labs lozenge to the agent mention typeahead section.
+- Updated dependencies
+
 ## 12.0.6
 
 ### Patch Changes

package/dist/cjs/ui/TypeAheadList.js

@@ -377,6 +377,7 @@ var TypeAheadListComponent = /*#__PURE__*/_react.default.memo(function (_ref4) {
     });
   }, [items]);
   var config = triggerHandler === null || triggerHandler === void 0 || (_triggerHandler$getMo = triggerHandler.getMoreOptionsButtonConfig) === null || _triggerHandler$getMo === void 0 ? void 0 : _triggerHandler$getMo.call(triggerHandler, intl);
+  var shouldRenderSectionLozenge = (0, _expVal.expVal)('platform_editor_agent_mentions', 'isEnabled', false);
   var handleClick = function handleClick() {
     if (onMoreOptionsClicked) {
       onMoreOptionsClicked();
@@ -401,6 +402,7 @@ var TypeAheadListComponent = /*#__PURE__*/_react.default.memo(function (_ref4) {
     if (!currentRow) {
       return null;
     }
+    var sectionLozenge = currentRow.type === 'section' && shouldRenderSectionLozenge ? currentRow.section.lozenge : null;
     return (0, _react2.jsx)(_CellMeasurer.CellMeasurer, {
       key: key,
       cache: cache,
@@ -425,11 +427,20 @@ var TypeAheadListComponent = /*#__PURE__*/_react.default.memo(function (_ref4) {
       }, currentRow.type === 'section' ? (0, _react2.jsx)(_compiled.Box, {
         paddingInline: "space.150",
         paddingBlock: "space.050"
+      }, sectionLozenge ? (0, _react2.jsx)(_compiled.Inline, {
+        as: "span",
+        space: "space.075",
+        alignBlock: "center"
       }, (0, _react2.jsx)(_compiled.Text, {
         as: "span",
         size: "small",
         color: "color.text.subtle",
         weight: "medium"
+      }, currentRow.section.title), sectionLozenge) : (0, _react2.jsx)(_compiled.Text, {
+        as: "span",
+        size: "small",
+        color: "color.text.subtle",
+        weight: "medium"
       }, currentRow.section.title)) : (0, _react2.jsx)(_TypeAheadListItem.TypeAheadListItem, {
         key: items[currentRow.itemIndex].title,
         item: items[currentRow.itemIndex],

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

@@ -111,6 +111,9 @@ var buildSectionedResult = exports.buildSectionedResult = function buildSectione
         startIndex: startIndex,
         title: _section.title
       };
+      if (_section.lozenge !== undefined) {
+        resolvedSection.lozenge = _section.lozenge;
+      }
       if (_section.sectionTitleDisplay) {
         resolvedSection.sectionTitleDisplay = _section.sectionTitleDisplay;
       }

package/dist/es2019/ui/TypeAheadList.js

@@ -15,7 +15,7 @@ import { toolbarInsertBlockMessages as messages } from '@atlaskit/editor-common/
 import { SelectItemMode, typeAheadListMessages } from '@atlaskit/editor-common/type-ahead';
 import { AssistiveText } from '@atlaskit/editor-common/ui';
 import { MenuGroup } from '@atlaskit/menu';
-import { Text, Box } from '@atlaskit/primitives/compiled';
+import { Box, Inline, Text } from '@atlaskit/primitives/compiled';
 import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import { expVal } from '@atlaskit/tmp-editor-statsig/expVal';
 import { closeTypeAhead } from '../pm-plugins/commands/close-type-ahead';
@@ -350,6 +350,7 @@ const TypeAheadListComponent = /*#__PURE__*/React.memo(({
     return items.findIndex(item => item.isDisabledOffline !== true);
   }, [items]);
   const config = triggerHandler === null || triggerHandler === void 0 ? void 0 : (_triggerHandler$getMo = triggerHandler.getMoreOptionsButtonConfig) === null || _triggerHandler$getMo === void 0 ? void 0 : _triggerHandler$getMo.call(triggerHandler, intl);
+  const shouldRenderSectionLozenge = expVal('platform_editor_agent_mentions', 'isEnabled', false);
   const handleClick = () => {
     if (onMoreOptionsClicked) {
       onMoreOptionsClicked();
@@ -376,6 +377,7 @@ const TypeAheadListComponent = /*#__PURE__*/React.memo(({
     if (!currentRow) {
       return null;
     }
+    const sectionLozenge = currentRow.type === 'section' && shouldRenderSectionLozenge ? currentRow.section.lozenge : null;
     return jsx(CellMeasurer, {
       key: key,
       cache: cache,
@@ -398,11 +400,20 @@ const TypeAheadListComponent = /*#__PURE__*/React.memo(({
     }, currentRow.type === 'section' ? jsx(Box, {
       paddingInline: "space.150",
       paddingBlock: "space.050"
+    }, sectionLozenge ? jsx(Inline, {
+      as: "span",
+      space: "space.075",
+      alignBlock: "center"
     }, jsx(Text, {
       as: "span",
       size: "small",
       color: "color.text.subtle",
       weight: "medium"
+    }, currentRow.section.title), sectionLozenge) : jsx(Text, {
+      as: "span",
+      size: "small",
+      color: "color.text.subtle",
+      weight: "medium"
     }, currentRow.section.title)) : jsx(TypeAheadListItem, {
       key: items[currentRow.itemIndex].title,
       item: items[currentRow.itemIndex],

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

@@ -68,6 +68,9 @@ export const buildSectionedResult = ({
       startIndex,
       title: section.title
     };
+    if (section.lozenge !== undefined) {
+      resolvedSection.lozenge = section.lozenge;
+    }
     if (section.sectionTitleDisplay) {
       resolvedSection.sectionTitleDisplay = section.sectionTitleDisplay;
     }

package/dist/esm/ui/TypeAheadList.js

@@ -17,7 +17,7 @@ import { toolbarInsertBlockMessages as messages } from '@atlaskit/editor-common/
 import { SelectItemMode, typeAheadListMessages } from '@atlaskit/editor-common/type-ahead';
 import { AssistiveText } from '@atlaskit/editor-common/ui';
 import { MenuGroup } from '@atlaskit/menu';
-import { Text, Box } from '@atlaskit/primitives/compiled';
+import { Box, Inline, Text } from '@atlaskit/primitives/compiled';
 import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import { expVal } from '@atlaskit/tmp-editor-statsig/expVal';
 import { closeTypeAhead } from '../pm-plugins/commands/close-type-ahead';
@@ -368,6 +368,7 @@ var TypeAheadListComponent = /*#__PURE__*/React.memo(function (_ref4) {
     });
   }, [items]);
   var config = triggerHandler === null || triggerHandler === void 0 || (_triggerHandler$getMo = triggerHandler.getMoreOptionsButtonConfig) === null || _triggerHandler$getMo === void 0 ? void 0 : _triggerHandler$getMo.call(triggerHandler, intl);
+  var shouldRenderSectionLozenge = expVal('platform_editor_agent_mentions', 'isEnabled', false);
   var handleClick = function handleClick() {
     if (onMoreOptionsClicked) {
       onMoreOptionsClicked();
@@ -392,6 +393,7 @@ var TypeAheadListComponent = /*#__PURE__*/React.memo(function (_ref4) {
     if (!currentRow) {
       return null;
     }
+    var sectionLozenge = currentRow.type === 'section' && shouldRenderSectionLozenge ? currentRow.section.lozenge : null;
     return jsx(CellMeasurer, {
       key: key,
       cache: cache,
@@ -416,11 +418,20 @@ var TypeAheadListComponent = /*#__PURE__*/React.memo(function (_ref4) {
       }, currentRow.type === 'section' ? jsx(Box, {
         paddingInline: "space.150",
         paddingBlock: "space.050"
+      }, sectionLozenge ? jsx(Inline, {
+        as: "span",
+        space: "space.075",
+        alignBlock: "center"
       }, jsx(Text, {
         as: "span",
         size: "small",
         color: "color.text.subtle",
         weight: "medium"
+      }, currentRow.section.title), sectionLozenge) : jsx(Text, {
+        as: "span",
+        size: "small",
+        color: "color.text.subtle",
+        weight: "medium"
       }, currentRow.section.title)) : jsx(TypeAheadListItem, {
         key: items[currentRow.itemIndex].title,
         item: items[currentRow.itemIndex],

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

@@ -104,6 +104,9 @@ export var buildSectionedResult = function buildSectionedResult(_ref) {
         startIndex: startIndex,
         title: _section.title
       };
+      if (_section.lozenge !== undefined) {
+        resolvedSection.lozenge = _section.lozenge;
+      }
       if (_section.sectionTitleDisplay) {
         resolvedSection.sectionTitleDisplay = _section.sectionTitleDisplay;
       }

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

@@ -1,3 +1,4 @@
+import type { ReactNode } from 'react';
 import type { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
 import type { SelectItemMode } from '@atlaskit/editor-common/type-ahead';
 import type { TypeAheadHandler, TypeAheadItem, TypeAheadStats, UiComponentFactoryParams } from '@atlaskit/editor-common/types';
@@ -47,6 +48,7 @@ export type TypeAheadPluginState = {
 export type TypeAheadResolvedSection = {
     endIndex: number;
     id: string;
+    lozenge?: ReactNode;
     /**
      * Section title display rules copied from the section definition and optional runtime updates.
      */

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-type-ahead",
-	"version": "12.0.6",
+	"version": "12.0.7",
 	"description": "Type-ahead plugin for @atlaskit/editor-core",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -36,7 +36,7 @@
 		"@atlaskit/primitives": "^20.0.0",
 		"@atlaskit/prosemirror-history": "^1.0.0",
 		"@atlaskit/prosemirror-input-rules": "^4.0.0",
-		"@atlaskit/tmp-editor-statsig": "^109.0.0",
+		"@atlaskit/tmp-editor-statsig": "^109.2.0",
 		"@atlaskit/tokens": "^14.0.0",
 		"@atlaskit/visually-hidden": "^4.0.0",
 		"@babel/runtime": "^7.0.0",
@@ -48,7 +48,7 @@
 		"w3c-keyname": "^2.1.8"
 	},
 	"peerDependencies": {
-		"@atlaskit/editor-common": "^116.6.0",
+		"@atlaskit/editor-common": "^116.10.0",
 		"react": "^18.2.0",
 		"react-dom": "^18.2.0",
 		"react-intl": "^5.25.1 || ^6.0.0 || ^7.0.0"
@@ -58,7 +58,7 @@
 		"@types/react-virtualized": "^9.18.12",
 		"react": "^18.2.0",
 		"react-dom": "^18.2.0",
-		"react-intl": "^6.6.2",
+		"react-intl": "^7.0.0",
 		"wait-for-expect": "^1.2.0"
 	},
 	"techstack": {