@atlaskit/smart-card 43.20.8 → 43.22.0

package/dist/esm/extractors/flexible/icon/extract-file-formatIcon.js

@@ -1,144 +1,83 @@
-import { fg } from "@atlaskit/platform-feature-flags";
 import { IconType } from '../../../constants';
 var extractFileFormatIcon = function extractFileFormatIcon(fileFormat) {
   switch (fileFormat) {
     // Generic documents
     case 'folder':
-      return fg('navx-2827-eslint-object-translation-smart-links') ? {
+      return {
         icon: IconType.Folder
-      } : {
-        icon: IconType.Folder,
-        // eslint-disable-next-line @atlassian/i18n/no-literal-string-in-object
-        label: 'Folder'
       };
     case 'text/plain':
     case 'application/vnd.oasis.opendocument.text':
     case 'application/vnd.apple.pages':
-      return fg('navx-2827-eslint-object-translation-smart-links') ? {
+      return {
         icon: IconType.Document
-      } : {
-        icon: IconType.Document,
-        // eslint-disable-next-line @atlassian/i18n/no-literal-string-in-object
-        label: 'Document'
       };
     case 'application/pdf':
-      return fg('navx-2827-eslint-object-translation-smart-links') ? {
+      return {
         icon: IconType.PDF
-      } : {
-        icon: IconType.PDF,
-        // eslint-disable-next-line @atlassian/i18n/no-literal-string-in-object
-        label: 'PDF document'
       };
     case 'application/vnd.oasis.opendocument.presentation':
     case 'application/vnd.apple.keynote':
-      return fg('navx-2827-eslint-object-translation-smart-links') ? {
+      return {
         icon: IconType.Presentation
-      } : {
-        icon: IconType.Presentation,
-        // eslint-disable-next-line @atlassian/i18n/no-literal-string-in-object
-        label: 'Presentation'
       };
     case 'application/vnd.oasis.opendocument.spreadsheet':
     case 'application/vnd.apple.numbers':
-      return fg('navx-2827-eslint-object-translation-smart-links') ? {
+      return {
         icon: IconType.Spreadsheet
-      } : {
-        icon: IconType.Spreadsheet,
-        // eslint-disable-next-line @atlassian/i18n/no-literal-string-in-object
-        label: 'Spreadsheet'
       };
     // Google Drive
     case 'application/vnd.google-apps.document':
-      return fg('navx-2827-eslint-object-translation-smart-links') ? {
+      return {
         icon: IconType.GoogleDocs
-      } : {
-        icon: IconType.GoogleDocs,
-        // eslint-disable-next-line @atlassian/i18n/no-literal-string-in-object
-        label: 'Google Docs'
       };
     case 'application/vnd.google-apps.form':
-      return fg('navx-2827-eslint-object-translation-smart-links') ? {
+      return {
         icon: IconType.GoogleForms
-      } : {
-        icon: IconType.GoogleForms,
-        // eslint-disable-next-line @atlassian/i18n/no-literal-string-in-object
-        label: 'Google Form'
       };
     case 'application/vnd.google-apps.spreadsheet':
-      return fg('navx-2827-eslint-object-translation-smart-links') ? {
+      return {
         icon: IconType.GoogleSheets
-      } : {
-        icon: IconType.GoogleSheets,
-        // eslint-disable-next-line @atlassian/i18n/no-literal-string-in-object
-        label: 'Google Sheets'
       };
     case 'application/vnd.google-apps.presentation':
-      return fg('navx-2827-eslint-object-translation-smart-links') ? {
+      return {
         icon: IconType.GoogleSlides
-      } : {
-        icon: IconType.GoogleSlides,
-        // eslint-disable-next-line @atlassian/i18n/no-literal-string-in-object
-        label: 'Google Slides'
       };
     // Microsoft
     case 'application/vnd.ms-excel':
     case 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet':
-      return fg('navx-2827-eslint-object-translation-smart-links') ? {
+      return {
         icon: IconType.MSExcel
-      } : {
-        icon: IconType.MSExcel,
-        // eslint-disable-next-line @atlassian/i18n/no-literal-string-in-object
-        label: 'Excel spreadsheet'
       };
     case 'application/vnd.ms-powerpoint':
     case 'application/vnd.openxmlformats-officedocument.presentationml.presentation':
-      return fg('navx-2827-eslint-object-translation-smart-links') ? {
+      return {
         icon: IconType.MSPowerpoint
-      } : {
-        icon: IconType.MSPowerpoint,
-        // eslint-disable-next-line @atlassian/i18n/no-literal-string-in-object
-        label: 'PowerPoint presentation'
       };
     case 'application/msword':
     case 'application/vnd.openxmlformats-officedocument.wordprocessingml.document':
-      return fg('navx-2827-eslint-object-translation-smart-links') ? {
+      return {
         icon: IconType.MSWord
-      } : {
-        icon: IconType.MSWord,
-        // eslint-disable-next-line @atlassian/i18n/no-literal-string-in-object
-        label: 'Word document'
       };
     case 'image/png':
     case 'image/jpeg':
     case 'image/bmp':
     case 'image/webp':
     case 'image/svg+xml':
-      return fg('navx-2827-eslint-object-translation-smart-links') ? {
+      return {
         icon: IconType.Image
-      } : {
-        icon: IconType.Image,
-        // eslint-disable-next-line @atlassian/i18n/no-literal-string-in-object
-        label: 'Image'
       };
     case 'image/gif':
-      return fg('navx-2827-eslint-object-translation-smart-links') ? {
+      return {
         icon: IconType.GIF
-      } : {
-        icon: IconType.GIF,
-        // eslint-disable-next-line @atlassian/i18n/no-literal-string-in-object
-        label: 'GIF'
       };
     case 'audio/midi':
     case 'audio/mpeg':
     case 'audio/webm':
     case 'audio/ogg':
     case 'audio/wav':
-      return fg('navx-2827-eslint-object-translation-smart-links') ? {
+      return {
         icon: IconType.Audio
-      } : {
-        icon: IconType.Audio,
-        // eslint-disable-next-line @atlassian/i18n/no-literal-string-in-object
-        label: 'Audio'
       };
     case 'video/mp4':
     case 'video/quicktime':
@@ -147,23 +86,15 @@ var extractFileFormatIcon = function extractFileFormatIcon(fileFormat) {
     case 'video/ogg':
     case 'video/x-ms-wmv':
     case 'video/x-msvideo':
-      return fg('navx-2827-eslint-object-translation-smart-links') ? {
+      return {
         icon: IconType.Video
-      } : {
-        icon: IconType.Video,
-        // eslint-disable-next-line @atlassian/i18n/no-literal-string-in-object
-        label: 'Video'
       };
     // Others
     case 'text/css':
     case 'text/html':
     case 'application/javascript':
-      return fg('navx-2827-eslint-object-translation-smart-links') ? {
+      return {
         icon: IconType.Code
-      } : {
-        icon: IconType.Code,
-        // eslint-disable-next-line @atlassian/i18n/no-literal-string-in-object
-        label: 'Source Code'
       };
     case 'application/zip':
     case 'application/x-tar':
@@ -171,44 +102,24 @@ var extractFileFormatIcon = function extractFileFormatIcon(fileFormat) {
     case 'application/x-7z-compressed':
     case 'application/x-apple-diskimage':
     case 'application/vnd.rar':
-      return fg('navx-2827-eslint-object-translation-smart-links') ? {
+      return {
         icon: IconType.Archive
-      } : {
-        icon: IconType.Archive,
-        // eslint-disable-next-line @atlassian/i18n/no-literal-string-in-object
-        label: 'Archive'
       };
     case 'application/dmg':
-      return fg('navx-2827-eslint-object-translation-smart-links') ? {
+      return {
         icon: IconType.Executable
-      } : {
-        icon: IconType.Executable,
-        // eslint-disable-next-line @atlassian/i18n/no-literal-string-in-object
-        label: 'Executable'
       };
     case 'application/sketch':
-      return fg('navx-2827-eslint-object-translation-smart-links') ? {
+      return {
         icon: IconType.Sketch
-      } : {
-        icon: IconType.Sketch,
-        // eslint-disable-next-line @atlassian/i18n/no-literal-string-in-object
-        label: 'Sketch'
       };
     case 'application/octet-stream':
-      return fg('navx-2827-eslint-object-translation-smart-links') ? {
+      return {
         icon: IconType.Generic
-      } : {
-        icon: IconType.Generic,
-        // eslint-disable-next-line @atlassian/i18n/no-literal-string-in-object
-        label: 'Binary file'
       };
     case 'application/invision.prototype':
-      return fg('navx-2827-eslint-object-translation-smart-links') ? {
+      return {
         icon: IconType.Generic
-      } : {
-        icon: IconType.Generic,
-        // eslint-disable-next-line @atlassian/i18n/no-literal-string-in-object
-        label: 'Prototype'
       };
     default:
       return undefined;

package/dist/esm/extractors/flexible/icon/extract-jsonld-data-icon.js

@@ -1,5 +1,4 @@
 import { extractTitle } from '@atlaskit/link-extractors';
-import { fg } from '@atlaskit/platform-feature-flags';
 import { IconType } from '../../../constants';
 import { prioritiseIcon } from '../../common/icon';
 import { extractorPriorityMap as priorityMap } from '../../common/icon/priority';
@@ -63,58 +62,34 @@ function typeToIconDescriptor(_ref3) {
     data = _ref3.data;
   switch (type) {
     case 'atlassian:Goal':
-      return fg('navx-2827-eslint-object-translation-smart-links') ? {
+      return {
         icon: IconType.Task,
         label: label
-      } : {
-        icon: IconType.Task,
-        // eslint-disable-next-line @atlassian/i18n/no-literal-string-in-object
-        label: label || 'Goal'
       };
     case 'atlassian:Project':
-      return fg('navx-2827-eslint-object-translation-smart-links') ? {
+      return {
         icon: IconType.Project,
         label: label
-      } : {
-        icon: IconType.Project,
-        // eslint-disable-next-line @atlassian/i18n/no-literal-string-in-object
-        label: label || 'Project'
       };
     case 'atlassian:SourceCodeCommit':
-      return fg('navx-2827-eslint-object-translation-smart-links') ? {
+      return {
         icon: IconType.Commit,
         label: label
-      } : {
-        icon: IconType.Commit,
-        // eslint-disable-next-line @atlassian/i18n/no-literal-string-in-object
-        label: label || 'Commit'
       };
     case 'atlassian:SourceCodePullRequest':
-      return fg('navx-2827-eslint-object-translation-smart-links') ? {
+      return {
         icon: IconType.PullRequest,
         label: label
-      } : {
-        icon: IconType.PullRequest,
-        // eslint-disable-next-line @atlassian/i18n/no-literal-string-in-object
-        label: label || 'Pull request'
       };
     case 'atlassian:SourceCodeReference':
-      return fg('navx-2827-eslint-object-translation-smart-links') ? {
+      return {
         icon: IconType.Branch,
         label: label
-      } : {
-        icon: IconType.Branch,
-        // eslint-disable-next-line @atlassian/i18n/no-literal-string-in-object
-        label: label || 'Reference'
       };
     case 'atlassian:SourceCodeRepository':
-      return fg('navx-2827-eslint-object-translation-smart-links') ? {
+      return {
         icon: IconType.Repo,
         label: label
-      } : {
-        icon: IconType.Repo,
-        // eslint-disable-next-line @atlassian/i18n/no-literal-string-in-object
-        label: label || 'Repository'
       };
     case 'atlassian:Task':
       var taskLabel = label || 'Task';

package/dist/esm/utils/analytics/analytics.js

@@ -4,7 +4,7 @@ export var ANALYTICS_CHANNEL = 'media';
 export var context = {
   componentName: 'smart-cards',
   packageName: "@atlaskit/smart-card",
-  packageVersion: "43.20.7"
+  packageVersion: "43.21.0"
 };
 export var TrackQuickActionType = /*#__PURE__*/function (TrackQuickActionType) {
   TrackQuickActionType["StatusUpdate"] = "StatusUpdate";

package/dist/esm/utils/index.js

@@ -40,9 +40,8 @@ export var getIconForFileType = function getIconForFileType(fileMimeType) {
   if (!icon) {
     return;
   }
-  var _icon = _slicedToArray(icon, 2),
-    label = _icon[0],
-    importCb = _icon[1];
+  var _icon = _slicedToArray(icon, 1),
+    importCb = _icon[0];
   if (!importCb) {
     return;
   }
@@ -58,7 +57,6 @@ export var getIconForFileType = function getIconForFileType(fileMimeType) {
   }); // because we're using dynamic loading here, TS will not be able to infer the type
 
   return /*#__PURE__*/React.createElement(Icon, {
-    label: label,
     testId: "document-file-format-icon"
   });
 };
@@ -418,11 +416,11 @@ export var getLazyIcons = function getLazyIcons() {
 var getTypeToIconMap = function getTypeToIconMap(fileFormat) {
   var _lazyIcons$iconDescri;
   var iconDescriptor = extractFileFormatIcon(fileFormat);
-  if (!(iconDescriptor !== null && iconDescriptor !== void 0 && iconDescriptor.icon) || !iconDescriptor.label) {
+  if (!(iconDescriptor !== null && iconDescriptor !== void 0 && iconDescriptor.icon)) {
     return null;
   }
   var lazyIcons = getLazyIcons();
-  return [iconDescriptor.label, (_lazyIcons$iconDescri = lazyIcons[iconDescriptor.icon]) === null || _lazyIcons$iconDescri === void 0 ? void 0 : _lazyIcons$iconDescri.default];
+  return [(_lazyIcons$iconDescri = lazyIcons[iconDescriptor.icon]) === null || _lazyIcons$iconDescri === void 0 ? void 0 : _lazyIcons$iconDescri.default];
 };
 export var getIframeSandboxAttribute = function getIframeSandboxAttribute(isTrusted) {
   if (isTrusted) {

package/dist/esm/view/EmbedModal/components/link-info/index.js

@@ -73,8 +73,8 @@ var LinkInfo = function LinkInfo(_ref) {
         label: messages.viewOriginal,
         onClick: onViewButtonClick,
         testId: "".concat(testId, "-url"),
-        role: fg('navx-2185-smart-link-preview-modal-icon-role') ? 'link' : '',
-        "aria-label": fg('navx-2185-smart-link-preview-modal-icon-role') ? messages.viewOriginal : ''
+        role: 'link',
+        "aria-label": messages.viewOriginal
       });
     }
   }, [onViewButtonClick, providerName, testId]);
@@ -178,8 +178,8 @@ var LinkInfoNew = function LinkInfoNew(_ref2) {
         label: messages.viewOriginal,
         onClick: onViewButtonClick,
         testId: "".concat(testId, "-url"),
-        role: fg('navx-2185-smart-link-preview-modal-icon-role') ? 'link' : '',
-        "aria-label": fg('navx-2185-smart-link-preview-modal-icon-role') ? messages.viewOriginal : ''
+        role: 'link',
+        "aria-label": messages.viewOriginal
       });
     }
   }, [onViewButtonClick, providerName, testId]);

package/dist/esm/view/EmbedModal/components/link-info/link-info-button/index.js

@@ -1,8 +1,6 @@
-import _extends from "@babel/runtime/helpers/extends";
 import React from 'react';
 import { useIntl } from 'react-intl-next';
 import { IconButton } from '@atlaskit/button/new';
-import { fg } from '@atlaskit/platform-feature-flags';
 import Tooltip from '@atlaskit/tooltip';
 import { useMouseDownEvent } from '../../../../../state/analytics/useLinkClicked';
 var LinkInfoButton = function LinkInfoButton(_ref) {
@@ -20,15 +18,14 @@ var LinkInfoButton = function LinkInfoButton(_ref) {
     hideTooltipOnClick: true,
     tag: "span",
     testId: "".concat(testId, "-tooltip")
-  }, /*#__PURE__*/React.createElement(IconButton, _extends({
+  }, /*#__PURE__*/React.createElement(IconButton, {
     appearance: "subtle",
     icon: icon,
     label: formatMessage(label),
     onClick: onClick,
     onMouseDown: onMouseDown,
-    testId: "".concat(testId, "-button")
-  }, fg('navx-2185-smart-link-preview-modal-icon-role') ? {
+    testId: "".concat(testId, "-button"),
     role: role
-  } : {})));
+  }));
 };
 export default LinkInfoButton;

package/dist/esm/view/FlexibleCard/components/container/layered-link/index.js

@@ -2,7 +2,6 @@
 import "./index.compiled.css";
 import * as React from 'react';
 import { ax, ix } from "@compiled/react/runtime";
-import { fg } from '@atlaskit/platform-feature-flags';
 import { useMouseDownEvent } from '../../../../../state/analytics/useLinkClicked';
 var styles = null;
 
@@ -25,10 +24,7 @@ var LayeredLink = function LayeredLink(_ref) {
     href: url,
     onClick: onClick,
     onMouseDown: onMouseDown,
-    target: target,
-    tabIndex: fg('platform-linking-smart-card-layered-link-a11y') ? undefined : -1 // Hide tab index and let the title link be the link.
-    ,
-    "aria-hidden": fg('platform-linking-smart-card-layered-link-a11y') ? undefined : true // This is to avoid screen readers reading out the link twice.
+    target: target
   }, text);
 };
 export default LayeredLink;

package/dist/esm/view/FlexibleCard/components/elements/common/base-lozenge-element/index.js

@@ -19,28 +19,34 @@ var BaseLozengeElement = function BaseLozengeElement(_ref) {
   var action = _ref.action,
     _ref$appearance = _ref.appearance,
     appearance = _ref$appearance === void 0 ? 'default' : _ref$appearance,
-    name = _ref.name,
     className = _ref.className,
+    maxWidth = _ref.maxWidth,
+    name = _ref.name,
+    onAfterChanged = _ref.onAfterChanged,
     style = _ref.style,
     text = _ref.text,
     _ref$testId = _ref.testId,
-    testId = _ref$testId === void 0 ? 'smart-element-lozenge' : _ref$testId,
-    onAfterChanged = _ref.onAfterChanged;
+    testId = _ref$testId === void 0 ? 'smart-element-lozenge' : _ref$testId;
   var ui = useFlexibleUiOptionContext();
   if (!text) {
     return null;
   }
-  var lozenge = action ? /*#__PURE__*/React.createElement(LozengeAction, {
+  var lozenge = action ? /*#__PURE__*/React.createElement(LozengeAction, _extends({
     action: action,
-    appearance: appearance,
+    appearance: appearance
+  }, fg('platform_navx_sl_lozenge_max_width') ? {
+    maxWidth: maxWidth
+  } : undefined, {
     testId: testId,
     text: text,
     zIndex: ui === null || ui === void 0 ? void 0 : ui.zIndex,
     onAfterChanged: onAfterChanged
-  }) : /*#__PURE__*/React.createElement(AtlaskitLozenge, _extends({
+  })) : /*#__PURE__*/React.createElement(AtlaskitLozenge, _extends({
     appearance: appearance
   }, fg('platform-component-visual-refresh') ? {
     isBold: true
+  } : undefined, fg('platform_navx_sl_lozenge_max_width') ? {
+    maxWidth: maxWidth
   } : undefined, {
     // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
     style: style,

package/dist/esm/view/FlexibleCard/components/elements/common/base-lozenge-element/lozenge-action/index.js

@@ -29,6 +29,7 @@ var LozengeAction = function LozengeAction(_ref) {
   var _action$update;
   var action = _ref.action,
     appearance = _ref.appearance,
+    maxWidth = _ref.maxWidth,
     _ref$testId = _ref.testId,
     testId = _ref$testId === void 0 ? 'smart-element-lozenge-action' : _ref$testId,
     text = _ref.text,
@@ -137,11 +138,14 @@ var LozengeAction = function LozengeAction(_ref) {
   var trigger = useCallback(function (props) {
     return /*#__PURE__*/React.createElement(LozengeActionTrigger, _extends({}, props, {
       appearance: selected.appearance,
-      isOpen: isOpen,
+      isOpen: isOpen
+    }, fg('platform_navx_sl_lozenge_max_width') ? {
+      maxWidth: maxWidth
+    } : undefined, {
       testId: testId,
       text: selected.text
     }));
-  }, [selected.appearance, selected.text, isOpen, testId]);
+  }, [selected.appearance, selected.text, isOpen, maxWidth, testId]);
   var handleItemClick = useCallback( /*#__PURE__*/function () {
     var _ref4 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2(id, text, appearance) {
       var updateAction, request;

package/dist/esm/view/FlexibleCard/components/elements/common/base-lozenge-element/lozenge-action/lozenge-action-trigger/index.compiled.css

@@ -13,6 +13,7 @@
 ._18u0v77o{margin-left:var(--ds-space-025,2px)}
 ._19bvidpf{padding-left:0}
 ._19pkv77o{margin-top:var(--ds-space-025,2px)}
+._1bto1l2s{text-overflow:ellipsis}
 ._1e0c1txw{display:flex}
 ._1p1dn7od{text-transform:unset}
 ._1q2vglyw[aria-expanded=true]{outline-style:none}
@@ -29,6 +30,7 @@
 ._j8b81o36[aria-expanded=true]{outline-width:medium}
 ._k48pn7od{font-weight:unset}
 ._n3tdidpf{padding-bottom:0}
+._o5721q9c{white-space:nowrap}
 ._otyrv77o{margin-bottom:var(--ds-space-025,2px)}
 ._p8tl1r31[aria-expanded=true]{outline-color:currentColor}
 ._syazn7od{color:unset}

package/dist/esm/view/FlexibleCard/components/elements/common/base-lozenge-element/lozenge-action/lozenge-action-trigger/index.js

@@ -2,7 +2,7 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["appearance", "isOpen", "testId", "text", "triggerRef"];
+var _excluded = ["appearance", "isOpen", "maxWidth", "testId", "text", "triggerRef"];
 import "./index.compiled.css";
 import * as React from 'react';
 import { ax, ix } from "@compiled/react/runtime";
@@ -21,11 +21,13 @@ var styles = {
   lozengeContainer: "_kkk2n7od _2rko12b0 _1dqonqa1 _189ee4h9 _1h6d1j28 _bfhk1j28 _1e0c1txw _4cvr1h6o _4t3i7vkz",
   lozengeContainerSelected: "_1reo15vq _18m915vq _1h6d1v1w"
 };
+var textStyles = null;
 var triggerLozengeStyles = null;
 var triggerButtonStyles = null;
 var LozengeActionTrigger = function LozengeActionTrigger(_ref) {
   var appearance = _ref.appearance,
     isOpen = _ref.isOpen,
+    maxWidth = _ref.maxWidth,
     testId = _ref.testId,
     text = _ref.text,
     triggerRef = _ref.triggerRef,
@@ -79,18 +81,22 @@ var LozengeActionTrigger = function LozengeActionTrigger(_ref) {
     return /*#__PURE__*/React.createElement(Box, {
       xcss: cx(styles.lozengeContainer, (isOpen || isPressing) && styles.lozengeContainerSelected),
       as: "span"
-    }, /*#__PURE__*/React.createElement(Lozenge, {
+    }, /*#__PURE__*/React.createElement(Lozenge, _extends({
       appearance: appearance,
       isBold: fg('platform-component-visual-refresh') ? true : isHovering
+    }, fg('platform_navx_sl_lozenge_max_width') ? {
+      maxWidth: maxWidth
+    } : undefined, {
       // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
-      ,
       style: {
         backgroundColor: lozengeBackgroundColor,
         color: lozengeForegroundColor
       }
-    }, /*#__PURE__*/React.createElement("span", {
+    }), /*#__PURE__*/React.createElement("span", {
       className: ax(["_4cvr1h6o _1e0c1txw"])
-    }, /*#__PURE__*/React.createElement("span", null, text), /*#__PURE__*/React.createElement(Box, {
+    }, /*#__PURE__*/React.createElement("span", {
+      className: ax([fg('platform_navx_sl_lozenge_max_width') && "_1reo15vq _18m915vq _1bto1l2s _o5721q9c"])
+    }, text), /*#__PURE__*/React.createElement(Box, {
       as: "span",
       xcss: styles.chevronDown
     }, /*#__PURE__*/React.createElement(ChevronDownIcon, {
@@ -99,12 +105,15 @@ var LozengeActionTrigger = function LozengeActionTrigger(_ref) {
       size: "small",
       "aria-hidden": true
     })))));
-  }, [appearance, isHovering, isPressing, text, isOpen, lozengeBackgroundColor, lozengeForegroundColor]);
+  }, [appearance, isHovering, isPressing, text, isOpen, lozengeBackgroundColor, lozengeForegroundColor, maxWidth]);
   return /*#__PURE__*/React.createElement("button", _extends({
     type: "button"
   }, props, {
     "data-action-open": isOpen,
-    "data-testid": "".concat(testId, "--trigger")
+    "data-testid": "".concat(testId, "--trigger"),
+    style: {
+      maxWidth: fg('platform_navx_sl_lozenge_max_width') ? maxWidth : undefined
+    }
     // eslint-disable-next-line @atlassian/a11y/mouse-events-have-key-events
     ,
     onMouseEnter: onMouseEnter

package/dist/esm/view/FlexibleCard/external.js

@@ -8,6 +8,7 @@ import _extends from "@babel/runtime/helpers/extends";
  * DO NOT add a new prop to these components until we are ready to support it externally.
  */
 import React from 'react';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { SmartLinkSize } from '../../constants';
 import { CopyLinkAction as CopyLinkActionComponent, CustomAction as CustomActionComponent, DownloadAction as DownloadActionComponent, FollowAction as FollowActionComponent, PreviewAction as PreviewActionComponent, UnresolvedAction as UnresolvedActionComponent } from './components/actions';
 import { AssignedTo, AssignedToGroup, AttachmentCount, AuthorGroup, ChecklistProgress, CollaboratorGroup, CommentCount, CreatedBy, CreatedOn, DueOn, LatestCommit, LinkIcon, Location, ModifiedBy, ModifiedOn, OwnedBy, OwnedByGroup, Preview, Priority, ProgrammingLanguage, Provider, ReactCount, ReadTime, SentOn, Snippet, SourceBranch, State, StoryPoints, SubscriberCount, SubTasksProgress, TargetBranch, Title, ViewCount, VoteCount } from './components/elements';
@@ -118,8 +119,10 @@ export var SnippetElement = function SnippetElement(props) {
 export var SourceBranchElement = function SourceBranchElement() {
   return /*#__PURE__*/React.createElement(SourceBranch, null);
 };
-export var StateElement = function StateElement() {
-  return /*#__PURE__*/React.createElement(State, null);
+export var StateElement = function StateElement(props) {
+  return /*#__PURE__*/React.createElement(State, fg('platform_navx_sl_lozenge_max_width') ? {
+    maxWidth: props === null || props === void 0 ? void 0 : props.maxWidth
+  } : undefined);
 };
 export var StoryPointsElement = function StoryPointsElement() {
   return /*#__PURE__*/React.createElement(StoryPoints, null);

package/dist/esm/view/InlineCard/Frame/styled.compiled.css

@@ -13,6 +13,7 @@
 ._1bto1l2s{text-overflow:ellipsis}
 ._1e0c1abx{display:-webkit-inline-box}
 ._1e0c1nu9{display:inline}
+._1hms8stv{text-decoration-line:underline}
 ._1hmsglyw{text-decoration-line:none}
 ._1nmz9jpi{word-break:break-all}
 ._1qu2glyw{outline-style:none}

package/dist/esm/view/InlineCard/Frame/styled.js

@@ -1,20 +1,19 @@
 /* styled.tsx generated by @compiled/babel-plugin v0.38.1 */
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["truncateInline", "withoutBackground", "isHovered", "isInteractive", "isSelected", "href", "viewType"],
+var _excluded = ["truncateInline", "withoutBackground", "isHovered", "isSelected", "viewType"],
   _excluded2 = ["truncateInline", "withoutBackground", "isHovered", "isInteractive", "isSelected", "href", "viewType"];
 import "./styled.compiled.css";
 import { ax, ix } from "@compiled/react/runtime";
 import React, { forwardRef } from 'react';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { B100, B200, B400, B50, N40 } from '@atlaskit/theme/colors';
 import { expVal } from '@atlaskit/tmp-editor-statsig/expVal';
 export var WrapperSpan = /*#__PURE__*/forwardRef(function (_ref, ref) {
   var truncateInline = _ref.truncateInline,
     withoutBackground = _ref.withoutBackground,
     isHovered = _ref.isHovered,
-    isInteractive = _ref.isInteractive,
     isSelected = _ref.isSelected,
-    href = _ref.href,
     viewType = _ref.viewType,
     props = _objectWithoutProperties(_ref, _excluded);
   var experimentValue = viewType === 'unauthorised' ? expVal('platform_inline_smartcard_connect_button_exp', 'cohort', 'control') : 'control';
@@ -38,7 +37,7 @@ export var WrapperAnchor = /*#__PURE__*/forwardRef(function (_ref2, ref) {
     href: href,
     ref: ref
   }, props, {
-    className: ax(["_1yt4x7n9 _2rko12b0 _v56415x0 _1e0c1nu9 _16d9qvcn _syaz1y58 _1rkwglyw _4cvxmr28", truncateInline && "_1reo15vq _18m915vq _ca0qidpf _u5f3idpf _n3tdidpf _19bvidpf _1bto1l2s _1nmz9jpi _1e0c1abx _1yyjkb7n _sudp1e54 _nr8z1o8l _1voyv77o _3kwxidpf _jqg5v77o _6vwiidpf", truncateInline && experimentValue !== 'control' && "_syaz15cr", withoutBackground ? "_19bvidpf _18u01i6y" : "_19it1x13 _bfhkhp5a _1a3b1r31 _4fprglyw _5goinqa1 _9oik1r31 _1bnxglyw _jf4cnqa1 _1nrm1r31 _c2waglyw _1iohnqa1", isHovered && "_1h6dmr28", isHovered && !withoutBackground && "_4bfu1r31 _1hmsglyw _ajmmnqa1", isSelected ? "_12ji1r31 _1qu2glyw _12y31o36 _80omtlke _16qscw00 _uiztglyw _1a3b1r31 _4fprglyw _5goinqa1 _9oik1r31 _1bnxglyw _jf4cnqa1 _bfw71x13 _1nrm1r31 _c2waglyw _1iohnqa1" : "_uizt1kdv", isInteractive && "_nt751r31 _49pcglyw _1hvw1o36 _1372tlke _7ehicw00 _1j5pglyw _1di629zg"])
+    className: ax(["_1yt4x7n9 _2rko12b0 _v56415x0 _1e0c1nu9 _16d9qvcn _syaz1y58 _1rkwglyw _4cvxmr28", truncateInline && "_1reo15vq _18m915vq _ca0qidpf _u5f3idpf _n3tdidpf _19bvidpf _1bto1l2s _1nmz9jpi _1e0c1abx _1yyjkb7n _sudp1e54 _nr8z1o8l _1voyv77o _3kwxidpf _jqg5v77o _6vwiidpf", truncateInline && experimentValue !== 'control' && "_syaz15cr", withoutBackground ? "_19bvidpf _18u01i6y" : "_19it1x13 _bfhkhp5a _1a3b1r31 _4fprglyw _5goinqa1 _9oik1r31 _1bnxglyw _jf4cnqa1 _1nrm1r31 _c2waglyw _1iohnqa1", isHovered && "_1h6dmr28", isHovered && !withoutBackground && "_4bfu1r31 _1hmsglyw _ajmmnqa1", isSelected ? "_12ji1r31 _1qu2glyw _12y31o36 _80omtlke _16qscw00 _uiztglyw _1a3b1r31 _4fprglyw _5goinqa1 _9oik1r31 _1bnxglyw _jf4cnqa1 _bfw71x13 _1nrm1r31 _c2waglyw _1iohnqa1" : "_uizt1kdv", isInteractive && "_nt751r31 _49pcglyw _1hvw1o36 _1372tlke _7ehicw00 _1j5pglyw _1di629zg", viewType === 'errored' && fg('navx-2565-inline-card-error-state-underline') && "_4bfu1r31 _1hms8stv _ajmmnqa1 _9oik1r31 _1bnxglyw _jf4cnqa1"])
   }), props.children);
 });
 var baseWrapperStyles = null;
@@ -47,6 +46,7 @@ var baseWrapperStyles = null;
 var interactiveStyles = null;
 var hoveredStyles = null;
 var hoveredWithBackgroundStyles = null;
+var errorViewTypeStyles = null;
 var withoutBackgroundStyles = null;
 var withBackgroundStyles = null;
 var truncateStyles = null;