@atlaskit/mention 26.0.4 → 26.1.0

package/CHANGELOG.md

@@ -1,5 +1,12 @@
 # @atlaskit/mention
 
+## 26.1.0
+
+### Minor Changes
+
+- [`7567557c596c7`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/7567557c596c7) -
+  [ux] Update mention item styling platform_editor_agent_mentions
+
 ## 26.0.4
 
 ### Patch Changes

package/dist/cjs/components/MentionItem/index.js

@@ -10,6 +10,12 @@ Object.defineProperty(exports, "MENTION_ITEM_HEIGHT", {
     return _styles.MENTION_ITEM_HEIGHT;
   }
 });
+Object.defineProperty(exports, "MENTION_ITEM_HEIGHT_REFRESHED", {
+  enumerable: true,
+  get: function get() {
+    return _styles.MENTION_ITEM_HEIGHT_REFRESHED;
+  }
+});
 exports.default = exports.MentionItemWithRef = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
@@ -119,7 +125,8 @@ var MentionItem = exports.default = /*#__PURE__*/function (_React$PureComponent)
       var _this$props = this.props,
         mention = _this$props.mention,
         selected = _this$props.selected,
-        forwardedRef = _this$props.forwardedRef;
+        forwardedRef = _this$props.forwardedRef,
+        height = _this$props.height;
       var id = mention.id,
         highlight = mention.highlight,
         presence = mention.presence,
@@ -135,6 +142,7 @@ var MentionItem = exports.default = /*#__PURE__*/function (_React$PureComponent)
       var xProductUserInfoIconColor = selected ? "var(--ds-icon-selected, #1868DB)" : "var(--ds-icon, #292A2E)";
       return /*#__PURE__*/_react.default.createElement(_MessagesIntlProvider.default, null, /*#__PURE__*/_react.default.createElement(_styles.MentionItemStyle, {
         selected: selected,
+        height: height,
         onMouseDown: this.onMentionSelected,
         onMouseMove: this.onMentionMenuItemMouseMove,
         onMouseEnter: this.onMentionMenuItemMouseEnter,

package/dist/cjs/components/MentionItem/styles.js

@@ -4,7 +4,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.TimeStyle = exports.RowStyle = exports.NameSectionStyle = exports.MentionItemStyle = exports.MENTION_ITEM_HEIGHT = exports.InfoSectionStyle = exports.FullNameStyle = exports.AvatarStyle = exports.AccessSectionStyle = void 0;
+exports.TimeStyle = exports.RowStyle = exports.NameSectionStyle = exports.MentionItemStyle = exports.MENTION_ITEM_HEIGHT_REFRESHED = exports.MENTION_ITEM_HEIGHT = exports.InfoSectionStyle = exports.FullNameStyle = exports.AvatarStyle = exports.AccessSectionStyle = void 0;
 var _styled = _interopRequireDefault(require("@emotion/styled"));
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
@@ -83,15 +83,18 @@ var TimeStyle = exports.TimeStyle = _styled.default.div({
   font: "var(--ds-font-body-small, normal 400 12px/16px \"Atlassian Sans\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif)"
 });
 var MENTION_ITEM_HEIGHT = exports.MENTION_ITEM_HEIGHT = 48;
+var MENTION_ITEM_HEIGHT_REFRESHED = exports.MENTION_ITEM_HEIGHT_REFRESHED = 44;
 // eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/ui-styling-standard/no-dynamic-styles -- Ignored via go/DSP-18766
 var MentionItemStyle = exports.MentionItemStyle = _styled.default.div(function (props) {
+  var _props$height;
   return {
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
     backgroundColor: props.selected ? "var(--ds-background-selected, #E9F2FE)" : 'transparent',
     display: 'block',
     overflow: 'hidden',
     listStyleType: 'none',
-    height: "".concat(MENTION_ITEM_HEIGHT, "px"),
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+    height: "".concat((_props$height = props.height) !== null && _props$height !== void 0 ? _props$height : MENTION_ITEM_HEIGHT, "px"),
     // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
     lineHeight: 1.2,
     cursor: 'pointer'

package/dist/cjs/item.js

@@ -10,6 +10,12 @@ Object.defineProperty(exports, "MENTION_ITEM_HEIGHT", {
     return _MentionItem.MENTION_ITEM_HEIGHT;
   }
 });
+Object.defineProperty(exports, "MENTION_ITEM_HEIGHT_REFRESHED", {
+  enumerable: true,
+  get: function get() {
+    return _MentionItem.MENTION_ITEM_HEIGHT_REFRESHED;
+  }
+});
 Object.defineProperty(exports, "MentionItem", {
   enumerable: true,
   get: function get() {

package/dist/cjs/util/analytics.js

@@ -12,7 +12,7 @@ var _types = require("../types");
 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 packageName = "@atlaskit/mention";
-var packageVersion = "26.0.3";
+var packageVersion = "26.0.4";
 var SLI_EVENT_TYPE = exports.SLI_EVENT_TYPE = 'sli';
 var SMART_EVENT_TYPE = exports.SMART_EVENT_TYPE = 'smart';
 var fireAnalyticsMentionTypeaheadEvent = exports.fireAnalyticsMentionTypeaheadEvent = function fireAnalyticsMentionTypeaheadEvent(props) {

package/dist/es2019/components/MentionItem/index.js

@@ -15,7 +15,7 @@ import { renderHighlight } from './MentionHighlightHelpers';
 import MentionDescriptionByline from '../MentionDescriptionByline';
 import MessagesIntlProvider from '../MessagesIntlProvider';
 import { MentionAvatar } from '../MentionAvatar';
-export { MENTION_ITEM_HEIGHT } from './styles';
+export { MENTION_ITEM_HEIGHT, MENTION_ITEM_HEIGHT_REFRESHED } from './styles';
 const lozengeAppearanceToTagColor = {
   default: 'standard',
   success: 'lime',
@@ -94,7 +94,8 @@ export default class MentionItem extends React.PureComponent {
     const {
       mention,
       selected,
-      forwardedRef
+      forwardedRef,
+      height
     } = this.props;
     const {
       id,
@@ -114,6 +115,7 @@ export default class MentionItem extends React.PureComponent {
     const xProductUserInfoIconColor = selected ? "var(--ds-icon-selected, #1868DB)" : "var(--ds-icon, #292A2E)";
     return /*#__PURE__*/React.createElement(MessagesIntlProvider, null, /*#__PURE__*/React.createElement(MentionItemStyle, {
       selected: selected,
+      height: height,
       onMouseDown: this.onMentionSelected,
       onMouseMove: this.onMentionMenuItemMouseMove,
       onMouseEnter: this.onMentionMenuItemMouseEnter,

package/dist/es2019/components/MentionItem/styles.js

@@ -69,18 +69,23 @@ export const TimeStyle = styled.div({
   font: "var(--ds-font-body-small, normal 400 12px/16px \"Atlassian Sans\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif)"
 });
 export const MENTION_ITEM_HEIGHT = 48;
+export const MENTION_ITEM_HEIGHT_REFRESHED = 44;
 // eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/ui-styling-standard/no-dynamic-styles -- Ignored via go/DSP-18766
-export const MentionItemStyle = styled.div(props => ({
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
-  backgroundColor: props.selected ? "var(--ds-background-selected, #E9F2FE)" : 'transparent',
-  display: 'block',
-  overflow: 'hidden',
-  listStyleType: 'none',
-  height: `${MENTION_ITEM_HEIGHT}px`,
-  // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
-  lineHeight: 1.2,
-  cursor: 'pointer'
-}));
+export const MentionItemStyle = styled.div(props => {
+  var _props$height;
+  return {
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+    backgroundColor: props.selected ? "var(--ds-background-selected, #E9F2FE)" : 'transparent',
+    display: 'block',
+    overflow: 'hidden',
+    listStyleType: 'none',
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+    height: `${(_props$height = props.height) !== null && _props$height !== void 0 ? _props$height : MENTION_ITEM_HEIGHT}px`,
+    // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
+    lineHeight: 1.2,
+    cursor: 'pointer'
+  };
+});
 
 // eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
 export const AccessSectionStyle = styled.div({

package/dist/es2019/item.js

@@ -1,4 +1,4 @@
-import MentionItem, { MENTION_ITEM_HEIGHT } from './components/MentionItem';
+import MentionItem, { MENTION_ITEM_HEIGHT, MENTION_ITEM_HEIGHT_REFRESHED } from './components/MentionItem';
 export {
 // Components
-MentionItem, MENTION_ITEM_HEIGHT };
+MentionItem, MENTION_ITEM_HEIGHT, MENTION_ITEM_HEIGHT_REFRESHED };

package/dist/es2019/util/analytics.js

@@ -2,7 +2,7 @@ import { OPERATIONAL_EVENT_TYPE, UI_EVENT_TYPE } from '@atlaskit/analytics-gas-t
 import { ELEMENTS_CHANNEL } from '../_constants';
 import { ComponentNames, isSpecialMentionText } from '../types';
 const packageName = "@atlaskit/mention";
-const packageVersion = "26.0.3";
+const packageVersion = "26.0.4";
 export const SLI_EVENT_TYPE = 'sli';
 export const SMART_EVENT_TYPE = 'smart';
 export const fireAnalyticsMentionTypeaheadEvent = props => (action, duration, userIds = [], query) => {

package/dist/esm/components/MentionItem/index.js

@@ -23,7 +23,7 @@ import { renderHighlight } from './MentionHighlightHelpers';
 import MentionDescriptionByline from '../MentionDescriptionByline';
 import MessagesIntlProvider from '../MessagesIntlProvider';
 import { MentionAvatar } from '../MentionAvatar';
-export { MENTION_ITEM_HEIGHT } from './styles';
+export { MENTION_ITEM_HEIGHT, MENTION_ITEM_HEIGHT_REFRESHED } from './styles';
 var lozengeAppearanceToTagColor = {
   default: 'standard',
   success: 'lime',
@@ -107,7 +107,8 @@ var MentionItem = /*#__PURE__*/function (_React$PureComponent) {
       var _this$props = this.props,
         mention = _this$props.mention,
         selected = _this$props.selected,
-        forwardedRef = _this$props.forwardedRef;
+        forwardedRef = _this$props.forwardedRef,
+        height = _this$props.height;
       var id = mention.id,
         highlight = mention.highlight,
         presence = mention.presence,
@@ -123,6 +124,7 @@ var MentionItem = /*#__PURE__*/function (_React$PureComponent) {
       var xProductUserInfoIconColor = selected ? "var(--ds-icon-selected, #1868DB)" : "var(--ds-icon, #292A2E)";
       return /*#__PURE__*/React.createElement(MessagesIntlProvider, null, /*#__PURE__*/React.createElement(MentionItemStyle, {
         selected: selected,
+        height: height,
         onMouseDown: this.onMentionSelected,
         onMouseMove: this.onMentionMenuItemMouseMove,
         onMouseEnter: this.onMentionMenuItemMouseEnter,

package/dist/esm/components/MentionItem/styles.js

@@ -75,15 +75,18 @@ export var TimeStyle = styled.div({
   font: "var(--ds-font-body-small, normal 400 12px/16px \"Atlassian Sans\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif)"
 });
 export var MENTION_ITEM_HEIGHT = 48;
+export var MENTION_ITEM_HEIGHT_REFRESHED = 44;
 // eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/ui-styling-standard/no-dynamic-styles -- Ignored via go/DSP-18766
 export var MentionItemStyle = styled.div(function (props) {
+  var _props$height;
   return {
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
     backgroundColor: props.selected ? "var(--ds-background-selected, #E9F2FE)" : 'transparent',
     display: 'block',
     overflow: 'hidden',
     listStyleType: 'none',
-    height: "".concat(MENTION_ITEM_HEIGHT, "px"),
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+    height: "".concat((_props$height = props.height) !== null && _props$height !== void 0 ? _props$height : MENTION_ITEM_HEIGHT, "px"),
     // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
     lineHeight: 1.2,
     cursor: 'pointer'

package/dist/esm/item.js

@@ -1,4 +1,4 @@
-import MentionItem, { MENTION_ITEM_HEIGHT } from './components/MentionItem';
+import MentionItem, { MENTION_ITEM_HEIGHT, MENTION_ITEM_HEIGHT_REFRESHED } from './components/MentionItem';
 export {
 // Components
-MentionItem, MENTION_ITEM_HEIGHT };
+MentionItem, MENTION_ITEM_HEIGHT, MENTION_ITEM_HEIGHT_REFRESHED };

package/dist/esm/util/analytics.js

@@ -5,7 +5,7 @@ import { OPERATIONAL_EVENT_TYPE, UI_EVENT_TYPE } from '@atlaskit/analytics-gas-t
 import { ELEMENTS_CHANNEL } from '../_constants';
 import { ComponentNames, isSpecialMentionText } from '../types';
 var packageName = "@atlaskit/mention";
-var packageVersion = "26.0.3";
+var packageVersion = "26.0.4";
 export var SLI_EVENT_TYPE = 'sli';
 export var SMART_EVENT_TYPE = 'smart';
 export var fireAnalyticsMentionTypeaheadEvent = function fireAnalyticsMentionTypeaheadEvent(props) {

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

@@ -1,8 +1,9 @@
 import React from 'react';
 import { type MentionDescription, type OnMentionEvent } from '../../types';
-export { MENTION_ITEM_HEIGHT } from './styles';
+export { MENTION_ITEM_HEIGHT, MENTION_ITEM_HEIGHT_REFRESHED } from './styles';
 export interface Props {
     forwardedRef?: React.Ref<HTMLDivElement>;
+    height?: number;
     mention: MentionDescription;
     onMouseEnter?: OnMentionEvent;
     onMouseMove?: OnMentionEvent;

package/dist/types/components/MentionItem/styles.d.ts

@@ -2,6 +2,7 @@ import { type StyledComponent } from '@emotion/styled';
 import type { Theme } from '@emotion/react';
 import type { DetailedHTMLProps, HTMLAttributes } from 'react';
 export interface MentionItemStyleProps {
+    height?: number;
     selected?: boolean;
 }
 export interface AvatarSectionStyleProps {
@@ -38,6 +39,7 @@ export declare const TimeStyle: StyledComponent<{
     theme?: Theme;
 }, DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export declare const MENTION_ITEM_HEIGHT = 48;
+export declare const MENTION_ITEM_HEIGHT_REFRESHED = 44;
 export declare const MentionItemStyle: StyledComponent<{
     as?: React.ElementType;
     theme?: Theme;

package/dist/types/item.d.ts

@@ -1,2 +1,2 @@
-import MentionItem, { MENTION_ITEM_HEIGHT } from './components/MentionItem';
-export { MentionItem, MENTION_ITEM_HEIGHT, };
+import MentionItem, { MENTION_ITEM_HEIGHT, MENTION_ITEM_HEIGHT_REFRESHED } from './components/MentionItem';
+export { MentionItem, MENTION_ITEM_HEIGHT, MENTION_ITEM_HEIGHT_REFRESHED, };

package/dist/types-ts4.5/components/MentionItem/index.d.ts

@@ -1,8 +1,9 @@
 import React from 'react';
 import { type MentionDescription, type OnMentionEvent } from '../../types';
-export { MENTION_ITEM_HEIGHT } from './styles';
+export { MENTION_ITEM_HEIGHT, MENTION_ITEM_HEIGHT_REFRESHED } from './styles';
 export interface Props {
     forwardedRef?: React.Ref<HTMLDivElement>;
+    height?: number;
     mention: MentionDescription;
     onMouseEnter?: OnMentionEvent;
     onMouseMove?: OnMentionEvent;

package/dist/types-ts4.5/components/MentionItem/styles.d.ts

@@ -2,6 +2,7 @@ import { type StyledComponent } from '@emotion/styled';
 import type { Theme } from '@emotion/react';
 import type { DetailedHTMLProps, HTMLAttributes } from 'react';
 export interface MentionItemStyleProps {
+    height?: number;
     selected?: boolean;
 }
 export interface AvatarSectionStyleProps {
@@ -38,6 +39,7 @@ export declare const TimeStyle: StyledComponent<{
     theme?: Theme;
 }, DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export declare const MENTION_ITEM_HEIGHT = 48;
+export declare const MENTION_ITEM_HEIGHT_REFRESHED = 44;
 export declare const MentionItemStyle: StyledComponent<{
     as?: React.ElementType;
     theme?: Theme;

package/dist/types-ts4.5/item.d.ts

@@ -1,2 +1,2 @@
-import MentionItem, { MENTION_ITEM_HEIGHT } from './components/MentionItem';
-export { MentionItem, MENTION_ITEM_HEIGHT, };
+import MentionItem, { MENTION_ITEM_HEIGHT, MENTION_ITEM_HEIGHT_REFRESHED } from './components/MentionItem';
+export { MentionItem, MENTION_ITEM_HEIGHT, MENTION_ITEM_HEIGHT_REFRESHED, };

package/package.json

@@ -26,20 +26,20 @@
 		"access": "public"
 	},
 	"dependencies": {
-		"@atlaskit/afm-i18n-platform-elements-mention": "2.130.0",
+		"@atlaskit/afm-i18n-platform-elements-mention": "2.142.0",
 		"@atlaskit/analytics-gas-types": "^5.1.0",
-		"@atlaskit/analytics-next": "^11.2.0",
+		"@atlaskit/analytics-next": "^11.3.0",
 		"@atlaskit/avatar": "^25.15.0",
 		"@atlaskit/focus-ring": "^3.1.0",
 		"@atlaskit/heading": "^5.4.0",
-		"@atlaskit/icon": "^35.3.0",
+		"@atlaskit/icon": "^35.4.0",
 		"@atlaskit/lozenge": "^13.8.0",
 		"@atlaskit/platform-feature-flags": "^1.1.0",
 		"@atlaskit/primitives": "^19.0.0",
-		"@atlaskit/tag": "^14.14.0",
+		"@atlaskit/tag": "^14.15.0",
 		"@atlaskit/teams-avatar": "^2.7.0",
-		"@atlaskit/tokens": "^13.0.0",
-		"@atlaskit/tooltip": "^22.3.0",
+		"@atlaskit/tokens": "^13.1.0",
+		"@atlaskit/tooltip": "^22.6.0",
 		"@atlaskit/ufo": "^0.5.0",
 		"@atlaskit/util-service-support": "^6.4.0",
 		"@babel/runtime": "^7.0.0",
@@ -120,5 +120,5 @@
 			]
 		}
 	},
-	"version": "26.0.4"
+	"version": "26.1.0"
 }