@atlaskit/smart-card 25.6.1 → 25.7.1

package/dist/cjs/view/InlineCard/index.js

@@ -64,7 +64,8 @@ var InlineCard = function InlineCard(_ref) {
     testId = _ref.testId,
     inlinePreloaderStyle = _ref.inlinePreloaderStyle,
     showHoverPreview = _ref.showHoverPreview,
-    showAuthTooltip = _ref.showAuthTooltip;
+    showAuthTooltip = _ref.showAuthTooltip,
+    showServerActions = _ref.showServerActions;
   var status = cardState.status,
     details = cardState.details;
   var cardDetails = details && details.data || (0, _jsonld.getEmptyJsonLd)();
@@ -95,6 +96,7 @@ var InlineCard = function InlineCard(_ref) {
       return /*#__PURE__*/_react.default.createElement(_ResolvedView.InlineCardResolvedView, (0, _extends2.default)({}, resolvedProps, {
         id: id,
         showHoverPreview: showHoverPreview,
+        showServerActions: showServerActions,
         link: url,
         isSelected: isSelected,
         onClick: handleFrameClick,

package/dist/es2019/messages.js

@@ -200,6 +200,11 @@ export const messages = defineMessages({
     defaultMessage: "Uh oh. We can't find this link!",
     description: 'Error case for when a provided link is not found'
   },
+  open_issue_in_jira: {
+    id: 'fabric.linking.open_issue_in_jira',
+    defaultMessage: 'Open issue in Jira',
+    description: 'Click to open link in Jira'
+  },
   open_link_in_a_new_tab: {
     id: 'fabric.linking.open_link_in_a_new_tab',
     defaultMessage: 'Open link in a new tab',
@@ -345,6 +350,21 @@ export const messages = defineMessages({
     defaultMessage: 'Save',
     description: 'Just the "save" word'
   },
+  status_change_load_error: {
+    id: 'fabric.linking.status_change_load_error',
+    defaultMessage: 'We couldn’t load the statuses and transitions',
+    description: 'Informs the user that the loading of status transitions failed'
+  },
+  status_change_permission_error: {
+    id: 'fabric.linking.status_change_permission_error',
+    defaultMessage: 'You don’t have permission to transition this issue. ',
+    description: 'Informs the user that they do not have enough permissions to update a status'
+  },
+  status_change_update_error: {
+    id: 'fabric.linking.status_change_update_error',
+    defaultMessage: 'We couldn’t update the status',
+    description: "Occurs when a user tries to update an issue's status but fails to do so"
+  },
   try_again: {
     id: 'fabric.linking.try_again',
     defaultMessage: 'Try again',

package/dist/es2019/state/flexible-ui-context/index.js

@@ -11,4 +11,11 @@ export const useFlexibleUiContext = () => useContext(FlexibleUiContext);
  * underlying elements.
  */
 export const FlexibleUiAnalyticsContext = /*#__PURE__*/createContext(undefined);
-export const useFlexibleUiAnalyticsContext = () => useContext(FlexibleUiAnalyticsContext);
+export const useFlexibleUiAnalyticsContext = () => useContext(FlexibleUiAnalyticsContext);
+
+/**
+ * This provides the ui options that will be used by Smart Links Flexible UI
+ * to render its underlying elements.
+ */
+export const FlexibleUiOptionContext = /*#__PURE__*/createContext(undefined);
+export const useFlexibleUiOptionContext = () => useContext(FlexibleUiOptionContext);

package/dist/es2019/state/hooks/use-invoke/types.js

@@ -1,15 +1 @@
-export let InvokeActionError;
-
-/**
- * Additional details for invoke function that may be required for component
- */
-(function (InvokeActionError) {
-  InvokeActionError["NoData"] = "NoData";
-  InvokeActionError["Unknown"] = "Unknown";
-})(InvokeActionError || (InvokeActionError = {}));
-/**
- * Invoke request with additional details for the component
- */
-/**
- * CRUD invoke requests for the component that support server actions
- */
+export {};

package/dist/es2019/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/smart-card",
-	"version": "25.6.1",
+	"version": "25.7.1",
 	"sideEffects": false
 }

package/dist/es2019/view/CardWithUrl/component.js

@@ -205,7 +205,8 @@ export function CardWithUrlContent({
         testId: testId,
         inlinePreloaderStyle: inlinePreloaderStyle,
         showHoverPreview: showHoverPreview,
-        showAuthTooltip: showAuthTooltip
+        showAuthTooltip: showAuthTooltip,
+        showServerActions: showServerActions
       });
     case 'block':
       return /*#__PURE__*/React.createElement(BlockCard, {

package/dist/es2019/view/FlexibleCard/components/blocks/action-group/index.js

@@ -11,7 +11,7 @@ import Button from '@atlaskit/button/standard-button';
 import MoreIcon from '@atlaskit/icon/glyph/more';
 import { sizeToButtonSpacing } from '../../utils';
 import { messages } from '../../../../../messages';
-import { useFlexibleUiContext } from '../../../../../state/flexible-ui-context';
+import { useFlexibleUiContext, useFlexibleUiOptionContext } from '../../../../../state/flexible-ui-context';
 import ActionGroupItem from './action-group-item';
 const styles = css`
   display: inline-flex;
@@ -70,6 +70,7 @@ const ActionGroup = ({
   testId
 }) => {
   const context = useFlexibleUiContext();
+  const ui = useFlexibleUiOptionContext();
   const [isOpen, setIsOpen] = useState(false);
   const renderableActionItems = useMemo(() => filterActionItems(items, context), [context, items]);
   const isMoreThenTwoItems = renderableActionItems.length > visibleButtonsNum;
@@ -115,11 +116,12 @@ const ActionGroup = ({
           iconBefore: moreIcon,
           ref: triggerRef
         }))),
-        testId: "action-group-dropdown"
+        testId: "action-group-dropdown",
+        zIndex: ui === null || ui === void 0 ? void 0 : ui.zIndex
       }, renderActionItems(actionItems, size, appearance, true, onActionItemClick));
     }
     return null;
-  }, [appearance, isMoreThenTwoItems, isOpen, onActionItemClick, onOpenChange, renderableActionItems, size, visibleButtonsNum]);
+  }, [appearance, isMoreThenTwoItems, isOpen, onActionItemClick, onOpenChange, renderableActionItems, size, ui === null || ui === void 0 ? void 0 : ui.zIndex, visibleButtonsNum]);
   return renderableActionItems.length > 0 ? jsx("div", {
     css: styles,
     className: "actions-button-group"

package/dist/es2019/view/FlexibleCard/components/common/lozenge-action/index.js

@@ -9,24 +9,26 @@ import LozengeActionError from './lozenge-action-error';
 import withErrorBoundary from './error-boundary';
 import { dropdownItemGroupStyles } from './styled';
 import useInvoke from '../../../../../state/hooks/use-invoke';
-import { InvokeActionError } from '../../../../../state/hooks/use-invoke/types';
 import extractLozengeActionItems from '../../../../../extractors/action/extract-lozenge-action-items';
 import createStatusUpdateRequest from '../../../../../utils/actions/create-status-update-request';
 import useResolve from '../../../../../state/hooks/use-resolve';
+import { LozengeActionErrorMessages } from './lozenge-action-error/types';
 const validateItems = (items = [], text) => {
   return items.filter(item => item.text !== text);
 };
+const isInvokeCustomError = err => err.message !== undefined && err.errorCode !== undefined;
 const LozengeAction = ({
   action,
   appearance,
   testId = 'smart-element-lozenge-action',
-  text
+  text,
+  zIndex
 }) => {
   const [isLoaded, setIsLoaded] = useState(false);
   const [isLoading, setIsLoading] = useState(false);
   const [isOpen, setIsOpen] = useState(false);
   const [items, setItems] = useState();
-  const [errorCode, setErrorCode] = useState();
+  const [errorMessage, setErrorMessage] = useState();
   const invoke = useInvoke();
   const reload = useResolve();
   const handleOpenChange = useCallback(async args => {
@@ -39,17 +41,18 @@ const LozengeAction = ({
         setItems(validItems);
         setIsLoaded(true);
         if ((validItems === null || validItems === void 0 ? void 0 : validItems.length) === 0) {
-          setErrorCode(InvokeActionError.NoData);
+          setErrorMessage(LozengeActionErrorMessages.noData);
+          setIsLoaded(false);
         }
       } catch (err) {
-        // TODO: EDM-6261: Error state
-        setErrorCode(InvokeActionError.Unknown);
+        setErrorMessage(LozengeActionErrorMessages.unknown);
+        setIsLoaded(false);
       } finally {
         setIsLoading(false);
       }
     }
     if (!args.isOpen) {
-      setErrorCode(undefined);
+      setErrorMessage(undefined);
     }
   }, [action === null || action === void 0 ? void 0 : action.read, invoke, isLoaded, text]);
   const trigger = useCallback(props => jsx(LozengeActionTrigger, _extends({}, props, {
@@ -65,7 +68,9 @@ const LozengeAction = ({
         const request = createStatusUpdateRequest(updateAction, id);
         await invoke(request);
         setIsLoading(false);
+        setIsLoaded(false);
         setIsOpen(false);
+        setItems([]);
         const {
           url,
           id: linkId
@@ -75,15 +80,18 @@ const LozengeAction = ({
         }
       }
     } catch (err) {
-      // TODO: EDM-6261: Error state
       setIsLoading(false);
-      setErrorCode(InvokeActionError.Unknown);
+      if (isInvokeCustomError(err)) {
+        setErrorMessage(err.message);
+      } else {
+        setErrorMessage(LozengeActionErrorMessages.updateFailed);
+      }
     }
   }, [action === null || action === void 0 ? void 0 : action.update, invoke, reload]);
   const dropdownItemGroup = useMemo(() => {
-    if (errorCode) {
+    if (errorMessage) {
       return jsx(LozengeActionError, {
-        errorCode: errorCode,
+        errorMessage: errorMessage,
         testId: testId
       });
     }
@@ -97,13 +105,14 @@ const LozengeAction = ({
         testId: `${testId}-item-${idx}`
       })))));
     }
-  }, [errorCode, handleItemClick, items, testId]);
+  }, [errorMessage, handleItemClick, items, testId]);
   return jsx(DropdownMenu, {
     isLoading: isLoading,
     isOpen: isOpen,
     onOpenChange: handleOpenChange,
     testId: testId,
-    trigger: trigger
+    trigger: trigger,
+    zIndex: zIndex
   }, dropdownItemGroup);
 };
 export default withErrorBoundary(LozengeAction);

package/dist/es2019/view/FlexibleCard/components/common/lozenge-action/lozenge-action-error/index.js

@@ -1,13 +1,36 @@
-import React, { useMemo } from 'react';
+/** @jsx jsx */
+import { jsx } from '@emotion/react';
+import { Fragment, useMemo } from 'react';
 import { DropdownItem, DropdownItemGroup } from '@atlaskit/dropdown-menu';
+import { R50, R500 } from '@atlaskit/theme/colors';
+import ErrorIcon from '@atlaskit/icon/glyph/error';
+import { dropdownItemGroupStyles, contentStyles, textStyles } from './styled';
+import { getFormattedMessage } from '../../../utils';
+const MAX_LINE_NUMBER = 8;
 const LozengeActionError = ({
-  errorCode,
-  testId
+  errorMessage,
+  testId,
+  maxLineNumber = MAX_LINE_NUMBER
 }) => {
-  // TODO: EDM-5746 and EDM-5782
-  const content = useMemo(() => errorCode, [errorCode]);
-  return /*#__PURE__*/React.createElement(DropdownItemGroup, null, /*#__PURE__*/React.createElement(DropdownItem, {
+  const content = useMemo(() => {
+    return jsx(Fragment, null, jsx("div", {
+      css: contentStyles
+    }, jsx(ErrorIcon, {
+      testId: `${testId}-icon`,
+      size: "medium",
+      primaryColor: `var(--ds-icon-danger, ${R500})`,
+      secondaryColor: `var(--ds-background-danger, ${R50})`,
+      label: 'error'
+    }), jsx("span", {
+      css: textStyles(maxLineNumber),
+      "data-testid": `${testId}-error-message`
+    }, typeof errorMessage === 'string' ? errorMessage : getFormattedMessage(errorMessage))));
+  }, [errorMessage, maxLineNumber, testId]);
+  return jsx("span", {
+    css: dropdownItemGroupStyles,
+    "data-testid": `${testId}-error-item-group`
+  }, jsx(DropdownItemGroup, null, jsx(DropdownItem, {
     testId: `${testId}-error`
-  }, content));
+  }, content)));
 };
 export default LozengeActionError;

package/dist/es2019/view/FlexibleCard/components/common/lozenge-action/lozenge-action-error/styled.js

@@ -0,0 +1,41 @@
+import { css } from '@emotion/react';
+import { N800 } from '@atlaskit/theme/colors';
+import { getTruncateStyles } from '../../../utils';
+export const dropdownItemGroupStyles = css`
+  button {
+    width: 220px;
+
+    &:hover {
+      background-color: inherit;
+      cursor: default;
+    }
+  }
+`;
+const sharedBlockStyles = css`
+  display: flex;
+  gap: 0.5rem;
+  line-height: 1rem;
+  min-width: 0;
+  overflow: hidden;
+  flex-direction: row;
+  align-items: center;
+`;
+export const contentStyles = css`
+  ${sharedBlockStyles};
+
+  margin-top: 2px;
+  align-items: flex-start;
+
+  > span,
+  > div {
+    &[data-smart-element-text] {
+      font-size: 0.875rem;
+      color: ${`var(--ds-text, ${N800})`};
+    }
+  }
+`;
+export const textStyles = maxLines => css`
+  line-height: 1rem;
+  white-space: normal;
+  ${getTruncateStyles(maxLines)};
+`;

package/dist/es2019/view/FlexibleCard/components/common/lozenge-action/lozenge-action-error/types.js

@@ -1 +1,12 @@
-export {};
+import { messages } from '../../../../../../messages';
+export const LozengeActionErrorMessages = {
+  noData: {
+    descriptor: messages['status_change_permission_error']
+  },
+  unknown: {
+    descriptor: messages['status_change_load_error']
+  },
+  updateFailed: {
+    descriptor: messages['status_change_update_error']
+  }
+};

package/dist/es2019/view/FlexibleCard/components/container/index.js

@@ -112,6 +112,7 @@ export const getContainerStyles = (size, hideBackground, hideElevation, hidePadd
   `;
 };
 const renderChildren = (children, containerSize, containerTheme, status, retry, onClick, onActionMenuOpenChange) => React.Children.map(children, child => {
+  // TODO: EDM-6468: Use useFlexibleUiOptionContext for rendering options inside block/element instead
   if ( /*#__PURE__*/React.isValidElement(child) && isFlexibleUiBlock(child)) {
     const {
       size: blockSize
@@ -177,9 +178,10 @@ const Container = ({
   hideElevation = false,
   hideHoverCardPreviewButton = false,
   hidePadding = false,
-  showHoverPreview = false,
   onClick,
   retry,
+  showHoverPreview = false,
+  showServerActions = false,
   size = SmartLinkSize.Medium,
   status,
   testId = 'smart-links-container',
@@ -199,7 +201,8 @@ const Container = ({
       url: context === null || context === void 0 ? void 0 : context.url,
       canOpen: hoverCardCanOpen,
       closeOnChildClick: true,
-      hidePreviewButton: hideHoverCardPreviewButton
+      hidePreviewButton: hideHoverCardPreviewButton,
+      showServerActions: showServerActions
     }, containerContent);
   }
   return containerContent;

package/dist/es2019/view/FlexibleCard/components/elements/lozenge/index.js

@@ -3,6 +3,7 @@ import React, { useCallback, useState } from 'react';
 import { css, jsx } from '@emotion/react';
 import AtlaskitLozenge from '@atlaskit/lozenge';
 import LozengeAction from '../../common/lozenge-action';
+import { useFlexibleUiOptionContext } from '../../../../../state/flexible-ui-context';
 const styles = css`
   display: inline-flex;
   line-height: inherit;
@@ -26,6 +27,7 @@ const Lozenge = ({
   text,
   testId = 'smart-element-lozenge'
 }) => {
+  const ui = useFlexibleUiOptionContext();
   const [isBold, setIsBold] = useState(false);
   const onHover = useCallback(isHover => {
     if (onClick) {
@@ -41,7 +43,8 @@ const Lozenge = ({
     action: action,
     appearance: appearance,
     testId: testId,
-    text: text
+    text: text,
+    zIndex: ui === null || ui === void 0 ? void 0 : ui.zIndex
   }) : jsx(AtlaskitLozenge, {
     appearance: appearance,
     isBold: isBold,

package/dist/es2019/view/FlexibleCard/index.js

@@ -3,7 +3,7 @@ import React, { useEffect, useMemo } from 'react';
 import { useFeatureFlag } from '@atlaskit/link-provider';
 import { SmartLinkStatus } from '../../constants';
 import Container from './components/container';
-import { FlexibleUiAnalyticsContext, FlexibleUiContext } from '../../state/flexible-ui-context';
+import { FlexibleUiAnalyticsContext, FlexibleUiContext, FlexibleUiOptionContext } from '../../state/flexible-ui-context';
 import { getContextByStatus, getRetryOptions } from './utils';
 
 /**
@@ -76,15 +76,18 @@ const FlexibleCard = ({
   }, [onError, onResolve, status, title, url]);
   return /*#__PURE__*/React.createElement(FlexibleUiAnalyticsContext.Provider, {
     value: analytics
+  }, /*#__PURE__*/React.createElement(FlexibleUiOptionContext.Provider, {
+    value: ui
   }, /*#__PURE__*/React.createElement(FlexibleUiContext.Provider, {
     value: context
   }, /*#__PURE__*/React.createElement(Container, _extends({
     testId: testId
   }, ui, {
-    showHoverPreview: showHoverPreview,
     onClick: onClick,
     retry: retry,
+    showHoverPreview: showHoverPreview,
+    showServerActions: showServerActions,
     status: status
-  }), children)));
+  }), children))));
 };
 export default FlexibleCard;

package/dist/es2019/view/HoverCard/components/HoverCardComponent.js

@@ -7,7 +7,7 @@ import { useSmartLinkActions } from '../../../state/hooks-external/useSmartLinkA
 import { useSmartLinkRenderers } from '../../../state/renderers';
 import { useSmartCardState as useLinkState } from '../../../state/store';
 import HoverCardContent from '../components/HoverCardContent';
-import { CARD_GAP_PX } from '../styled';
+import { CARD_GAP_PX, HOVER_CARD_Z_INDEX } from '../styled';
 import { CardDisplay } from '../../../constants';
 export const HoverCardComponent = ({
   children,
@@ -16,7 +16,8 @@ export const HoverCardComponent = ({
   analytics,
   canOpen = true,
   closeOnChildClick = false,
-  hidePreviewButton = false
+  hidePreviewButton = false,
+  showServerActions = false
 }) => {
   const delay = 300;
   const [isOpen, setIsOpen] = React.useState(false);
@@ -120,8 +121,9 @@ export const HoverCardComponent = ({
     onActionClick: onActionClick,
     onResolve: update,
     renderers: renderers,
+    showServerActions: showServerActions,
     url: url
-  }), [analytics, initHideCard, initShowCard, filteredActions, linkState, onActionClick, renderers, url]);
+  }), [analytics, initHideCard, initShowCard, filteredActions, linkState, onActionClick, renderers, showServerActions, url]);
   const trigger = useCallback(triggerProps => jsx("span", {
     ref: parentSpan
   }, jsx("span", _extends({}, triggerProps, {
@@ -140,6 +142,6 @@ export const HoverCardComponent = ({
     autoFocus: false,
     content: content,
     trigger: trigger,
-    zIndex: 511 // Temporary fix for Confluence inline comment on editor mod has z-index of 500, Jira issue view has z-index of 510
+    zIndex: HOVER_CARD_Z_INDEX
   });
 };

package/dist/es2019/view/HoverCard/components/HoverCardContent.js

@@ -58,7 +58,8 @@ const HoverCardContent = ({
   renderers,
   url,
   onMouseEnter,
-  onMouseLeave
+  onMouseLeave,
+  showServerActions
 }) => {
   var _cardState$details;
   const {
@@ -99,6 +100,7 @@ const HoverCardContent = ({
     onClick: onClick,
     onResolve: onResolve,
     renderers: renderers,
+    showServerActions,
     ui: flexibleUiOptions,
     url: url,
     children: {}

package/dist/es2019/view/HoverCard/styled.js

@@ -1,6 +1,8 @@
 import { css } from '@emotion/react';
 import { loadingPlaceholderClassName } from '../../index';
 import { SmartLinkSize, SmartLinkTheme } from '../../constants';
+// Temporary fix for Confluence inline comment on editor mod has z-index of 500, Jira issue view has z-index of 510
+export const HOVER_CARD_Z_INDEX = 511;
 export const flexibleUiOptions = {
   hideBackground: true,
   hideElevation: true,
@@ -8,7 +10,8 @@ export const flexibleUiOptions = {
   // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
   theme: SmartLinkTheme.Black,
   hidePadding: true,
-  hideHoverCardPreviewButton: false
+  hideHoverCardPreviewButton: false,
+  zIndex: HOVER_CARD_Z_INDEX + 1
 };
 export const CARD_WIDTH_REM = 24;
 // gap between mouse cursor and hover card

package/dist/es2019/view/InlineCard/ResolvedView/index.js

@@ -29,7 +29,8 @@ export class InlineCardResolvedView extends React.Component {
       testId = 'inline-card-resolved-view',
       titleTextColor,
       titlePrefix,
-      showHoverPreview = false
+      showHoverPreview = false,
+      showServerActions = false
     } = this.props;
     const inlineCardResolvedView = /*#__PURE__*/React.createElement(Frame, {
       testId: testId,
@@ -45,6 +46,7 @@ export class InlineCardResolvedView extends React.Component {
     if (showHoverPreview && link) {
       return /*#__PURE__*/React.createElement(HoverCard, {
         id: id,
+        showServerActions: showServerActions,
         url: link
       }, inlineCardResolvedView);
     }

package/dist/es2019/view/InlineCard/index.js

@@ -27,7 +27,8 @@ export const InlineCard = ({
   testId,
   inlinePreloaderStyle,
   showHoverPreview,
-  showAuthTooltip
+  showAuthTooltip,
+  showServerActions
 }) => {
   var _details$meta;
   const {
@@ -62,6 +63,7 @@ export const InlineCard = ({
       return /*#__PURE__*/React.createElement(InlineCardResolvedView, _extends({}, resolvedProps, {
         id: id,
         showHoverPreview: showHoverPreview,
+        showServerActions: showServerActions,
         link: url,
         isSelected: isSelected,
         onClick: handleFrameClick,

package/dist/esm/messages.js

@@ -200,6 +200,11 @@ export var messages = defineMessages({
     defaultMessage: "Uh oh. We can't find this link!",
     description: 'Error case for when a provided link is not found'
   },
+  open_issue_in_jira: {
+    id: 'fabric.linking.open_issue_in_jira',
+    defaultMessage: 'Open issue in Jira',
+    description: 'Click to open link in Jira'
+  },
   open_link_in_a_new_tab: {
     id: 'fabric.linking.open_link_in_a_new_tab',
     defaultMessage: 'Open link in a new tab',
@@ -345,6 +350,21 @@ export var messages = defineMessages({
     defaultMessage: 'Save',
     description: 'Just the "save" word'
   },
+  status_change_load_error: {
+    id: 'fabric.linking.status_change_load_error',
+    defaultMessage: 'We couldn’t load the statuses and transitions',
+    description: 'Informs the user that the loading of status transitions failed'
+  },
+  status_change_permission_error: {
+    id: 'fabric.linking.status_change_permission_error',
+    defaultMessage: 'You don’t have permission to transition this issue. ',
+    description: 'Informs the user that they do not have enough permissions to update a status'
+  },
+  status_change_update_error: {
+    id: 'fabric.linking.status_change_update_error',
+    defaultMessage: 'We couldn’t update the status',
+    description: "Occurs when a user tries to update an issue's status but fails to do so"
+  },
   try_again: {
     id: 'fabric.linking.try_again',
     defaultMessage: 'Try again',

package/dist/esm/state/flexible-ui-context/index.js

@@ -15,4 +15,13 @@ export var useFlexibleUiContext = function useFlexibleUiContext() {
 export var FlexibleUiAnalyticsContext = /*#__PURE__*/createContext(undefined);
 export var useFlexibleUiAnalyticsContext = function useFlexibleUiAnalyticsContext() {
   return useContext(FlexibleUiAnalyticsContext);
+};
+
+/**
+ * This provides the ui options that will be used by Smart Links Flexible UI
+ * to render its underlying elements.
+ */
+export var FlexibleUiOptionContext = /*#__PURE__*/createContext(undefined);
+export var useFlexibleUiOptionContext = function useFlexibleUiOptionContext() {
+  return useContext(FlexibleUiOptionContext);
 };

package/dist/esm/state/hooks/use-invoke/types.js

@@ -1,15 +1 @@
-export var InvokeActionError;
-
-/**
- * Additional details for invoke function that may be required for component
- */
-(function (InvokeActionError) {
-  InvokeActionError["NoData"] = "NoData";
-  InvokeActionError["Unknown"] = "Unknown";
-})(InvokeActionError || (InvokeActionError = {}));
-/**
- * Invoke request with additional details for the component
- */
-/**
- * CRUD invoke requests for the component that support server actions
- */
+export {};

package/dist/esm/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/smart-card",
-	"version": "25.6.1",
+	"version": "25.7.1",
 	"sideEffects": false
 }

package/dist/esm/view/CardWithUrl/component.js

@@ -208,7 +208,8 @@ export function CardWithUrlContent(_ref) {
         testId: testId,
         inlinePreloaderStyle: inlinePreloaderStyle,
         showHoverPreview: showHoverPreview,
-        showAuthTooltip: showAuthTooltip
+        showAuthTooltip: showAuthTooltip,
+        showServerActions: showServerActions
       });
     case 'block':
       return /*#__PURE__*/React.createElement(BlockCard, {

package/dist/esm/view/FlexibleCard/components/blocks/action-group/index.js

@@ -16,7 +16,7 @@ import Button from '@atlaskit/button/standard-button';
 import MoreIcon from '@atlaskit/icon/glyph/more';
 import { sizeToButtonSpacing } from '../../utils';
 import { messages } from '../../../../../messages';
-import { useFlexibleUiContext } from '../../../../../state/flexible-ui-context';
+import { useFlexibleUiContext, useFlexibleUiOptionContext } from '../../../../../state/flexible-ui-context';
 import ActionGroupItem from './action-group-item';
 var styles = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: inline-flex;\n  line-height: 1rem;\n  > div {\n    align-items: center;\n    button:focus-visible {\n      // AK button removes the default browser outline on focus and apply\n      // box-shadow styling to create the outline appearance.\n      // Due to our container elements (Container/Block/ElementGroup) has\n      // overflow hidden to prevent the metadata element from leaking outside\n      // of its container, the box-shadow doesn't show properly.\n      // Invert the AK box-shadow styling.\n      outline-offset: -2px;\n    }\n  }\n"])));
 var renderActionItems = function renderActionItems() {
@@ -73,6 +73,7 @@ var ActionGroup = function ActionGroup(_ref) {
     onDropdownOpenChange = _ref.onDropdownOpenChange,
     testId = _ref.testId;
   var context = useFlexibleUiContext();
+  var ui = useFlexibleUiOptionContext();
   var _useState = useState(false),
     _useState2 = _slicedToArray(_useState, 2),
     isOpen = _useState2[0],
@@ -124,11 +125,12 @@ var ActionGroup = function ActionGroup(_ref) {
             ref: triggerRef
           })));
         },
-        testId: "action-group-dropdown"
+        testId: "action-group-dropdown",
+        zIndex: ui === null || ui === void 0 ? void 0 : ui.zIndex
       }, renderActionItems(actionItems, size, appearance, true, onActionItemClick));
     }
     return null;
-  }, [appearance, isMoreThenTwoItems, isOpen, onActionItemClick, onOpenChange, renderableActionItems, size, visibleButtonsNum]);
+  }, [appearance, isMoreThenTwoItems, isOpen, onActionItemClick, onOpenChange, renderableActionItems, size, ui === null || ui === void 0 ? void 0 : ui.zIndex, visibleButtonsNum]);
   return renderableActionItems.length > 0 ? jsx("div", {
     css: styles,
     className: "actions-button-group"