@atlaskit/smart-card 26.52.2 → 26.52.4

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

@@ -0,0 +1,63 @@
+import { Stack, xcss } from '@atlaskit/primitives';
+import React, { useMemo } from 'react';
+import { SmartLinkSize } from '../../../../../constants';
+import { useFlexibleUiContext, useFlexibleUiOptionContext } from '../../../../../state/flexible-ui-context';
+import * as Actions from '../../actions';
+import { getPrimitivesPaddingSpaceBySize } from '../../utils';
+// We have to find a better way to ignore container padding
+// This has become more and more of a common use case.
+var ignoreContainerPaddingStyles = xcss({
+  marginLeft: 'calc(var(--container-gap-left) * -1)',
+  marginRight: 'calc(var(--container-gap-right) * -1)'
+});
+var ActionBlock = function ActionBlock(_ref) {
+  var blockRef = _ref.blockRef,
+    onClickCallback = _ref.onClick,
+    size = _ref.size,
+    sort = _ref.sort,
+    spaceInline = _ref.spaceInline,
+    _ref$testId = _ref.testId,
+    testId = _ref$testId === void 0 ? 'smart-block-action' : _ref$testId;
+  var context = useFlexibleUiContext();
+  var ui = useFlexibleUiOptionContext();
+  var padding = !(ui !== null && ui !== void 0 && ui.hidePadding) ? getPrimitivesPaddingSpaceBySize((ui === null || ui === void 0 ? void 0 : ui.size) || SmartLinkSize.Medium) : undefined;
+  var actions = useMemo(function () {
+    if (!(context !== null && context !== void 0 && context.actions)) {
+      return;
+    }
+    var arr = Object.keys(context.actions);
+    if (sort) {
+      arr.sort(sort);
+    }
+    return arr.map(function (name) {
+      var Action = Actions[name];
+      return Action ? /*#__PURE__*/React.createElement(Action, {
+        as: "stack-item",
+        spaceInline: spaceInline,
+        key: name,
+        onClick: function onClick() {
+          return onClickCallback === null || onClickCallback === void 0 ? void 0 : onClickCallback(name);
+        },
+        size: size
+        // Remove url once ViewAction is retired.
+        // This seems to be a typescript workaround
+        // because ViewAction marks it as required,
+        // which does not reflect actual implementation as the url
+        // came from data context and not all actions require url.
+        // https://product-fabric.atlassian.net/browse/EDM-9547
+        ,
+        url: "",
+        xcss: xcss({
+          paddingInline: padding
+        })
+      }) : null;
+    });
+  }, [context === null || context === void 0 ? void 0 : context.actions, onClickCallback, padding, size, sort, spaceInline]);
+  return actions ? /*#__PURE__*/React.createElement(Stack, {
+    grow: "fill",
+    xcss: ignoreContainerPaddingStyles,
+    ref: blockRef,
+    testId: testId
+  }, actions) : null;
+};
+export default ActionBlock;

package/dist/esm/view/FlexibleCard/components/blocks/action-block/types.js

@@ -0,0 +1 @@
+export {};

package/dist/esm/view/FlexibleCard/components/blocks/index.js

@@ -8,4 +8,5 @@ export { default as CustomBlock } from './block';
 // Internal components to be used within @atlaskit/smart-card only.
 export { default as InternalFooterBlock } from './footer-block/resolved';
 export { default as RelatedUrlsBlock } from './related-urls-block';
-export { default as AISummaryBlock } from './ai-summary-block';
+export { default as AISummaryBlock } from './ai-summary-block';
+export { default as ActionBlock } from './action-block';

package/dist/esm/view/FlexibleCard/components/blocks/utils.js

@@ -31,6 +31,12 @@ var getDirectionStyles = function getDirectionStyles(direction) {
       });
   }
 };
+
+/**
+ * Get gap size between elements inside a block
+ * Equivalent version for DS primitives space token is getPrimitivesInlineSpaceBySize()
+ * at view/FlexibleCard/components/utils.tsx
+ */
 export var getGapSize = function getGapSize(size) {
   switch (size) {
     case SmartLinkSize.XLarge:

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

@@ -1,5 +1,5 @@
 import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
-var _templateObject, _templateObject2, _templateObject3, _templateObject4;
+var _templateObject;
 /** @jsx jsx */
 import React, { useContext } from 'react';
 import { css, jsx } from '@emotion/react';
@@ -11,7 +11,11 @@ import HoverCardControl from './hover-card-control';
 import { isFlexUiPreviewPresent } from '../../../../state/flexible-ui-context/utils';
 import { N40 } from '@atlaskit/theme/colors';
 import { di } from 'react-magnetic-di';
-var elevationStyles = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  border: 1px solid ", ";\n  border-radius: ", ";\n  margin: ", ";\n"])), "var(--ds-border, ".concat(N40, ")"), "var(--ds-border-radius-200, 8px)", "var(--ds-space-025, 2px)");
+var elevationStyles = css({
+  border: "1px solid ".concat("var(--ds-border, ".concat(N40, ")")),
+  borderRadius: "var(--ds-border-radius-200, 8px)",
+  margin: "var(--ds-space-025, 2px)"
+});
 var getGap = function getGap(size) {
   switch (size) {
     case SmartLinkSize.XLarge:
@@ -25,6 +29,12 @@ var getGap = function getGap(size) {
       return '.25rem';
   }
 };
+
+/**
+ * Get container padding based on smart link size
+ * Equivalent version for DS primitives space token is getPrimitivesPaddingSpaceBySize()
+ * at view/FlexibleCard/components/utils.tsx
+ */
 var getPadding = function getPadding(size) {
   switch (size) {
     case SmartLinkSize.XLarge:
@@ -38,13 +48,24 @@ var getPadding = function getPadding(size) {
       return '.5rem';
   }
 };
-var clickableContainerStyles = css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  // Position any interactive elements at the top of the z-index stack.\n  a,\n  button,\n  .has-action {\n    position: relative;\n    z-index: 1;\n  }\n"])));
+var clickableContainerStyles = css({
+  'a, button, .has-action': {
+    position: 'relative',
+    zIndex: 1
+  }
+});
 var getContainerPaddingStyles = function getContainerPaddingStyles(size, hidePadding, childrenOptions) {
   var padding = hidePadding ? '0rem' : getPadding(size);
   var gap = getGap(size);
   var previewOnLeft = childrenOptions.previewOnLeft,
     previewOnRight = childrenOptions.previewOnRight;
-  return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n    // Set variables for PreviewBlock to use.\n    --container-padding: ", ";\n    --container-gap-left: ", ";\n    --container-gap-right: ", ";\n    --preview-block-width: 30%;\n\n    padding: ", ";\n    ", "\n    ", "\n  "])), padding, previewOnLeft ? gap : padding, previewOnRight ? gap : padding, padding, previewOnLeft ? "padding-left: calc(var(--preview-block-width) + ".concat(gap, ");") : '', previewOnRight ? "padding-right: calc(var(--preview-block-width) + ".concat(gap, ");") : '');
+  return css({
+    '--container-padding': padding,
+    '--container-gap-left': previewOnLeft ? gap : padding,
+    '--container-gap-right': previewOnRight ? gap : padding,
+    '--preview-block-width': '30%',
+    padding: padding
+  }, previewOnLeft ? "padding-left: calc(var(--preview-block-width) + ".concat(gap, ");") : '', previewOnRight ? "padding-right: calc(var(--preview-block-width) + ".concat(gap, ");") : '');
 };
 var getChildrenOptions = function getChildrenOptions(children, context) {
   var options = {};
@@ -67,7 +88,7 @@ var getChildrenOptions = function getChildrenOptions(children, context) {
 };
 export var getContainerStyles = function getContainerStyles(size, hideBackground, hideElevation, hidePadding, clickableContainer, childrenOptions) {
   var paddingCss = getContainerPaddingStyles(size, hidePadding, childrenOptions);
-  return css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n    display: flex;\n    gap: ", " 0;\n    flex-direction: column;\n    min-width: 0;\n    overflow-x: hidden;\n    position: relative;\n    ", "\n    ", "\n    ", "\n    ", "\n    &:hover ~ .actions-button-group {\n      opacity: 1;\n    }\n    a:focus,\n    .has-action:focus {\n      outline-offset: -2px;\n    }\n  "])), getGap(size), hideBackground ? '' : "background-color: ".concat("var(--ds-surface-raised, #FFFFFF)", ";"), paddingCss, hideElevation ? '' : elevationStyles, clickableContainer ? clickableContainerStyles : '');
+  return css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    display: flex;\n    gap: ", " 0;\n    flex-direction: column;\n    min-width: 0;\n    overflow-x: hidden;\n    position: relative;\n    ", "\n    ", "\n    ", "\n    ", "\n    &:hover ~ .actions-button-group {\n      opacity: 1;\n    }\n    a:focus,\n    .has-action:focus {\n      outline-offset: -2px;\n    }\n  "])), getGap(size), hideBackground ? '' : "background-color: ".concat("var(--ds-surface-raised, #FFFFFF)", ";"), paddingCss, hideElevation ? '' : elevationStyles, clickableContainer ? clickableContainerStyles : '');
 };
 var renderChildren = function renderChildren(children, containerSize, containerTheme, status, retry, onClick) {
   return React.Children.map(children, function (child) {

package/dist/esm/view/FlexibleCard/components/utils.js

@@ -3,7 +3,7 @@ import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral
 import _extends from "@babel/runtime/helpers/extends";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 var _excluded = ["linkIcon"];
-var _sizeToButtonSpacing, _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6;
+var _sizeToButtonSpacing, _templateObject;
 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 React from 'react';
@@ -29,11 +29,18 @@ export var getFormattedMessageAsString = function getFormattedMessageAsString(in
   }) : '';
 };
 var getIconDimensionStyles = function getIconDimensionStyles(value) {
-  return css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  height: ", ";\n  min-height: ", ";\n  max-height: ", ";\n  width: ", ";\n  min-width: ", ";\n  max-width: ", ";\n"])), value, value, value, value, value, value);
+  return css({
+    height: value,
+    minHeight: value,
+    maxHeight: value,
+    width: value,
+    minWidth: value,
+    maxWidth: value
+  });
 };
 export var getIconSizeStyles = function getIconSizeStyles(width) {
   var sizeStyles = getIconDimensionStyles(width);
-  return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    flex: 0 0 auto;\n    ", "\n    span,\n    svg,\n    img {\n      ", "\n    }\n    svg {\n      padding: 0;\n    }\n  "])), sizeStyles, sizeStyles);
+  return css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    flex: 0 0 auto;\n    ", "\n    span,\n    svg,\n    img {\n      ", "\n    }\n    svg {\n      padding: 0;\n    }\n  "])), sizeStyles, sizeStyles);
 };
 export var getIconWidth = function getIconWidth(size) {
   switch (size) {
@@ -62,13 +69,28 @@ export var getLinkLineHeight = function getLinkLineHeight(size) {
 export var getLinkSizeStyles = function getLinkSizeStyles(size) {
   switch (size) {
     case SmartLinkSize.XLarge:
-      return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n        font-size: 1.25rem;\n        font-weight: 400;\n        letter-spacing: -0.008em;\n        line-height: ", ";\n      "])), getLinkLineHeight(size));
+      return css({
+        fontSize: '1.25rem',
+        fontWeight: 400,
+        letterSpacing: '-0.008em',
+        lineHeight: getLinkLineHeight(size)
+      });
     case SmartLinkSize.Large:
     case SmartLinkSize.Medium:
-      return css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n        font-size: 0.875rem;\n        font-weight: 400;\n        letter-spacing: -0.003em;\n        line-height: ", ";\n      "])), getLinkLineHeight(size));
+      return css({
+        fontSize: '0.875rem',
+        fontWeight: 400,
+        letterSpacing: '-0.003em',
+        lineHeight: getLinkLineHeight(size)
+      });
     case SmartLinkSize.Small:
     default:
-      return css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n        font-size: 0.75rem;\n        font-weight: 400;\n        letter-spacing: 0em;\n        line-height: ", ";\n      "])), getLinkLineHeight(size));
+      return css({
+        fontSize: '0.75rem',
+        fontWeight: 400,
+        letterSpacing: '0em',
+        lineHeight: getLinkLineHeight(size)
+      });
   }
 };
 export var getMaxLineHeight = function getMaxLineHeight(size) {
@@ -93,10 +115,56 @@ export var getMaxLines = function getMaxLines(value, defaultValue, max, min) {
   }
   return value;
 };
+
+/**
+ * A space between element based on smart link size
+ * To replace blocks/utils.tsz getGapSize() with space token for primitives
+ */
+export var getPrimitivesInlineSpaceBySize = function getPrimitivesInlineSpaceBySize(size) {
+  switch (size) {
+    case SmartLinkSize.XLarge:
+      return 'space.250';
+    case SmartLinkSize.Large:
+      return 'space.200';
+    case SmartLinkSize.Medium:
+      return 'space.100';
+    case SmartLinkSize.Small:
+    default:
+      return 'space.050';
+  }
+};
+
+/**
+ * Get container padding based on smart link size
+ * To replace container/index.tsx getPadding() with space token for primitives
+ */
+export var getPrimitivesPaddingSpaceBySize = function getPrimitivesPaddingSpaceBySize(size) {
+  switch (size) {
+    case SmartLinkSize.XLarge:
+      return 'space.300';
+    case SmartLinkSize.Large:
+      return 'space.250';
+    case SmartLinkSize.Medium:
+      return 'space.200';
+    case SmartLinkSize.Small:
+    default:
+      return 'space.100';
+  }
+};
 export var getTruncateStyles = function getTruncateStyles(maxLines) {
   var lineHeight = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '1rem';
   var wordBreak = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'break-word';
-  return css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n    display: -webkit-box;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    word-break: ", ";\n    -webkit-line-clamp: ", ";\n    -webkit-box-orient: vertical;\n    // Fallback options\n    @supports not (-webkit-line-clamp: 1) {\n      max-height: calc(", " * ", ");\n    }\n  "])), wordBreak, maxLines, maxLines, lineHeight);
+  return css({
+    display: '-webkit-box',
+    overflow: 'hidden',
+    textOverflow: 'ellipsis',
+    wordBreak: wordBreak,
+    WebkitLineClamp: maxLines,
+    WebkitBoxOrient: 'vertical',
+    '@supports not (-webkit-line-clamp: 1)': {
+      maxHeight: "calc(".concat(maxLines, " * ").concat(lineHeight, ")")
+    }
+  });
 };
 export var hasWhiteSpace = function hasWhiteSpace(str) {
   return str.search(/\s/) >= 0;

package/dist/esm/view/HoverCard/components/views/resolved/index.js

@@ -2,7 +2,7 @@ import _extends from "@babel/runtime/helpers/extends";
 import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
 import React, { useCallback, useEffect, useMemo, useRef } from 'react';
 import { ActionName, CardDisplay, ElementName, SmartLinkPosition, SmartLinkSize, SmartLinkDirection } from '../../../../../constants';
-import { FooterBlock, MetadataBlock, RelatedUrlsBlock, SnippetBlock, TitleBlock, AISummaryBlock, CustomBlock } from '../../../../FlexibleCard/components/blocks';
+import { FooterBlock, MetadataBlock, RelatedUrlsBlock, SnippetBlock, TitleBlock, AISummaryBlock, CustomBlock, ActionBlock } from '../../../../FlexibleCard/components/blocks';
 import { footerBlockCss, hiddenSnippetStyles, metadataBlockCss } from './styled';
 import FlexibleCard from '../../../../FlexibleCard';
 import { getSimulatedBetterMetadata } from '../../../utils';
@@ -183,6 +183,8 @@ var HoverCardResolvedView = function HoverCardResolvedView(_ref2) {
     actions: footerActions,
     size: SmartLinkSize.Large,
     overrideCss: footerBlockCss
+  }), getBooleanFF('platform.linking-platform.smart-card.hover-card-action-redesign') && /*#__PURE__*/React.createElement(ActionBlock, {
+    spaceInline: "space.150"
   }));
 };
 export default HoverCardResolvedView;

package/dist/esm/view/LinkUrl/index.js

@@ -10,7 +10,7 @@ import { useLinkWarningModal } from './LinkWarningModal/hooks/use-link-warning-m
 import LinkWarningModal from './LinkWarningModal';
 var PACKAGE_DATA = {
   packageName: "@atlaskit/smart-card",
-  packageVersion: "26.52.2",
+  packageVersion: "26.52.4",
   componentName: 'linkUrl'
 };
 var Link = withLinkClickedEvent('a');

package/dist/types/messages.d.ts

@@ -1,6 +1,6 @@
 import { MessageDescriptor } from 'react-intl-next';
 export type RequestAccessMessageKey = 'click_to_join' | 'click_to_join_description' | 'forbidden_description' | 'request_access' | 'request_access_description' | 'request_access_pending' | 'request_access_pending_title' | 'request_access_pending_description' | 'request_denied_description' | 'default_no_access_title' | 'direct_access_title' | 'direct_access_description' | 'direct_access' | 'access_exists_description' | 'not_found_description' | 'not_found_title';
-export type MessageKey = 'assigned_to' | 'ai_summarize' | 'ai_summarized' | 'ai_summarized_abbreviation' | 'ai_summarized_info' | 'ai_summarizing' | 'ai_summary_error_generic' | 'ai_summary_error_acceptable_use_violation' | 'beta' | 'cannot_find_link' | 'connect_link_account_card' | 'connect_link_account_card_name' | 'connect_link_account_card_description' | 'connect_unauthorised_account_action' | 'connect_unauthorised_account_description' | 'connect_unauthorised_account_description_no_provider' | 'continue' | 'copy_url_to_clipboard' | 'could_not_load_link' | 'download' | 'follow' | 'go_back' | 'invalid_permissions' | 'invalid_permissions_description' | 'join_to_view' | 'connect_link_account' | 'created_by' | 'created_on_relative' | 'created_on_absolute' | 'check_this_link' | 'delete' | 'edit' | 'learn_more_about_smart_links' | 'learn_more_about_connecting_account' | 'loading' | 'link_safety_warning_message' | 'modified_by' | 'modified_on_relative' | 'modified_on_absolute' | 'more_actions' | 'not_found_title' | 'not_found_description' | 'open_issue_in_jira' | 'open_link_in_a_new_tab' | 'owned_by' | 'preview_improved' | 'preview_close' | 'preview_max_size' | 'preview_min_size' | 'priority_blocker' | 'priority_critical' | 'priority_high' | 'priority_highest' | 'priority_low' | 'priority_lowest' | 'priority_major' | 'priority_medium' | 'priority_minor' | 'priority_trivial' | 'priority_undefined' | 'forbidden_access' | 'pending_request' | 'read_time' | 'restricted_link' | 'request_access_to_view' | 'request_denied' | 'sent_on_relative' | 'sent_on_absolute' | 'status_change_load_error' | 'status_change_permission_error' | 'status_change_update_error' | 'try_again' | 'try_another_account' | 'unauthorised_account_description' | 'unauthorised_account_description_no_provider' | 'unauthorised_account_name' | 'unauthorised_account_name_no_provider' | 'unassigned' | 'unfollow' | 'view' | 'viewIn' | 'viewOriginal' | 'actions' | 'add_account' | 'cancel' | 'close' | 'connect_to' | 'connect_account_description' | 'retry' | 'save' | 'unlink_account' | RequestAccessMessageKey | 'related_work_items_not_found' | 'last_mentioned_in' | 'related' | 'generic_error_message';
+export type MessageKey = 'assigned_to' | 'ai_summarize' | 'ai_summarized' | 'ai_summarized_abbreviation' | 'ai_summarized_info' | 'ai_summarizing' | 'ai_summary_error_generic' | 'ai_summary_error_acceptable_use_violation' | 'beta' | 'cannot_find_link' | 'connect_link_account_card' | 'connect_link_account_card_name' | 'connect_link_account_card_description' | 'connect_unauthorised_account_action' | 'connect_unauthorised_account_description' | 'connect_unauthorised_account_description_no_provider' | 'continue' | 'copy_url_to_clipboard' | 'could_not_load_link' | 'download' | 'follow' | 'go_back' | 'invalid_permissions' | 'invalid_permissions_description' | 'join_to_view' | 'connect_link_account' | 'created_by' | 'created_on_relative' | 'created_on_absolute' | 'check_this_link' | 'delete' | 'edit' | 'learn_more_about_smart_links' | 'learn_more_about_connecting_account' | 'loading' | 'link_safety_warning_message' | 'modified_by' | 'modified_on_relative' | 'modified_on_absolute' | 'more_actions' | 'not_found_title' | 'not_found_description' | 'open_issue_in_jira' | 'open_link_in_a_new_tab' | 'owned_by' | 'preview_description' | 'preview_improved' | 'preview_close' | 'preview_max_size' | 'preview_min_size' | 'priority_blocker' | 'priority_critical' | 'priority_high' | 'priority_highest' | 'priority_low' | 'priority_lowest' | 'priority_major' | 'priority_medium' | 'priority_minor' | 'priority_trivial' | 'priority_undefined' | 'forbidden_access' | 'pending_request' | 'read_time' | 'restricted_link' | 'request_access_to_view' | 'request_denied' | 'sent_on_relative' | 'sent_on_absolute' | 'status_change_load_error' | 'status_change_permission_error' | 'status_change_update_error' | 'try_again' | 'try_another_account' | 'unauthorised_account_description' | 'unauthorised_account_description_no_provider' | 'unauthorised_account_name' | 'unauthorised_account_name_no_provider' | 'unassigned' | 'unfollow' | 'view' | 'viewIn' | 'viewOriginal' | 'actions' | 'add_account' | 'cancel' | 'close' | 'connect_to' | 'connect_account_description' | 'retry' | 'save' | 'unlink_account' | RequestAccessMessageKey | 'related_work_items_not_found' | 'last_mentioned_in' | 'related' | 'generic_error_message';
 type Messages = {
     [K in MessageKey]: MessageDescriptor;
 };

package/dist/types/state/hooks/use-ai-summary/ai-summary-service/index.d.ts

@@ -1,4 +1,4 @@
-import { type AISummaryServiceProps, type AISummaryServiceInt, type AISummaryState, type StateSetter, type SummaryStyle } from './types';
+import { type AISummaryServiceProps, type AISummaryServiceInt, type AISummaryState, type StateSetter } from './types';
 export declare class AISummaryService implements AISummaryServiceInt {
     state: AISummaryState;
     private config;
@@ -10,7 +10,7 @@ export declare class AISummaryService implements AISummaryServiceInt {
     private onError?;
     constructor(props: AISummaryServiceProps);
     private fetchStream;
-    summariseUrl(summaryStyle?: SummaryStyle): Promise<void>;
+    summariseUrl(): Promise<void>;
     private isExpectedError;
     subscribe(stateSetter: StateSetter): () => void;
 }

package/dist/types/state/hooks/use-ai-summary/ai-summary-service/types.d.ts

@@ -28,10 +28,10 @@ export type PostAgentPayload = {
 export type AgentInputContext = {
     content_url: string;
     content_ari?: string;
-    summary_style?: SummaryStyle;
+    prompt_id: PromptId;
     summary_output_mimetype?: SummaryOutputMimeType;
 };
-export type SummaryStyle = 'short' | 'medium' | 'long';
+export type PromptId = 'smart_links';
 export type SummaryOutputMimeType = 'text/adf' | 'text/markdown' | 'text/json';
 export declare const errorMessages: readonly ["NETWORK_ERROR", "NO_ANSWER", "RATE_LIMIT", "NO_AGENT", "PLUGIN_ERRORED", "OPENAI_RATE_LIMIT_USER_ABUSE", "ACCEPTABLE_USE_VIOLATIONS", "AI_DISABLED", "UNEXPECTED"];
 export type ErrorMessage = (typeof errorMessages)[number];
@@ -124,7 +124,7 @@ export type Message = {
     content: string;
     content_mime_type: ContentType;
     conversation_channel_id?: string;
-    experience_id: ExpirienceID;
+    experience_id: ExperienceId;
     message_metadata?: Metadata;
     plugin_invocations: PluginInvocationMessage[];
     role: Role;
@@ -134,7 +134,7 @@ export type Message = {
     sources?: Sources;
 };
 export type ContentType = 'text/markdown';
-export type ExpirienceID = 'ai-mate';
+export type ExperienceId = 'ai-mate' | 'smart-link';
 export type Role = 'ASSISTANT';
 export type Appendices = Array<Appendix>;
 export type Appendix = {

package/dist/types/view/FlexibleCard/components/actions/action/action-icon/types.d.ts

@@ -1,8 +1,9 @@
-import { ReactChild } from 'react';
-import { SmartLinkSize } from '../../../../../../constants';
+import type { ReactChild } from 'react';
+import type { SmartLinkSize } from '../../../../../../constants';
 export type ActionIconProps = {
     size?: SmartLinkSize;
     icon?: ReactChild;
-    testId?: string;
     isDisabled?: boolean;
+    showBackground?: boolean;
+    testId?: string;
 };

package/dist/types/view/FlexibleCard/components/actions/action/action-stack-item/index.d.ts

@@ -0,0 +1,4 @@
+import { type FC } from 'react';
+import { ActionStackItemProps } from './types';
+declare const ActionStackItem: FC<ActionStackItemProps>;
+export default ActionStackItem;

package/dist/types/view/FlexibleCard/components/actions/action/action-stack-item/types.d.ts

@@ -0,0 +1,10 @@
+import type { Space, XCSS } from '@atlaskit/primitives';
+import type { SmartLinkSize } from '../../../../../../constants';
+import type { ActionProps } from '../types';
+export type ActionStackItemProps = ActionProps & {
+    isLoading?: boolean;
+    size: SmartLinkSize;
+    isDisabled?: boolean;
+    space?: Space;
+    xcss?: XCSS;
+};

package/dist/types/view/FlexibleCard/components/actions/action/index.d.ts

@@ -1,13 +1,10 @@
 /** @jsx jsx */
-import React from 'react';
-import { ActionProps, InternalActionProps } from './types';
+import { type FC } from 'react';
+import { ActionProps } from './types';
 /**
  * A base action that can be triggered with an on click.
  * @internal
  * @param {ActionProps} ActionProps - The props necessary for the Action.
- * @see DeleteAction
- * @see EditAction
- * @see CustomAction
  */
-declare const Action: React.FC<ActionProps & InternalActionProps>;
+declare const Action: FC<ActionProps>;
 export default Action;

package/dist/types/view/FlexibleCard/components/actions/action/types.d.ts

@@ -1,8 +1,13 @@
-import { SerializedStyles } from '@emotion/react';
-import { SmartLinkSize } from '../../../../../constants';
-import { Appearance } from '@atlaskit/button/types';
-import { ReactChild } from 'react';
+import type { Appearance } from '@atlaskit/button/types';
+import type { Space, XCSS } from '@atlaskit/primitives';
+import type { SerializedStyles } from '@emotion/react';
+import type { ReactChild, ReactNode } from 'react';
+import type { SmartLinkSize } from '../../../../../constants';
 export type ActionProps = {
+    /**
+     * Determines the appearance of the action.
+     */
+    as?: 'button' | 'dropdown-item' | 'stack-item';
     /**
      * Determines the size of the Action. Corresponds to an Action appearance.
      */
@@ -10,7 +15,7 @@ export type ActionProps = {
     /**
      * Determines the text content of the Action.
      */
-    content?: React.ReactNode;
+    content?: ReactNode;
     /**
      * Determines the appearance of the action. Corresponds to the Atlaskit action appearance.
      */
@@ -27,18 +32,29 @@ export type ActionProps = {
      * Determines where the icon should be rendered if text is provided.
      */
     iconPosition?: 'before' | 'after';
+    /**
+     * Conditionally show a spinner over the top of a button or disable a dropdown item
+     * while server action is executing.
+     */
+    isLoading?: boolean;
     /**
      * Determines the tooltip message when hovering over the Action.
      */
-    tooltipMessage?: React.ReactNode;
+    tooltipMessage?: ReactNode;
     /**
+     * @deprecated Use 'as' instead
      * Used to determine whether the Action is in a Dropdown.
      */
     asDropDownItem?: boolean;
     /**
      * Additional CSS properties on the Action.
+     * Note: This should be replaced with xcss once component has migrate to use DS Primitives
      */
     overrideCss?: SerializedStyles;
+    /**
+     * Used to add space along the inline axis in ActionStackItem.
+     */
+    spaceInline?: Space;
     /**
      * A `testId` prop is provided for specified elements, which is a unique
      * string that appears as a data attribute `data-testid` in the rendered code,
@@ -49,16 +65,8 @@ export type ActionProps = {
      * Determines whether the button displays as disabled.
      */
     isDisabled?: boolean;
-};
-/**
- * The internal props that should only be controlled by internal components
- * and/or used by experiment. If there is a use case where these props/feature
- * should be available as part of smart-card, please move them to ActionProps.
- */
-export type InternalActionProps = {
     /**
-     * Conditionally show a spinner over the top of a button or disable a dropdown item
-     * while server action is executing.
+     * Additional styling properties for Primitives based component
      */
-    isLoading?: boolean;
+    xcss?: XCSS;
 };

package/dist/types/view/FlexibleCard/components/actions/delete-action/index.d.ts

@@ -0,0 +1,4 @@
+import { type FC } from 'react';
+import { DeleteActionProps } from './types';
+declare const DeleteAction: FC<DeleteActionProps>;
+export default DeleteAction;

package/dist/types/view/FlexibleCard/components/actions/delete-action/types.d.ts

@@ -0,0 +1,2 @@
+import type { ActionProps } from '../action/types';
+export type DeleteActionProps = ActionProps;

package/dist/types/view/FlexibleCard/components/actions/edit-action/index.d.ts

@@ -0,0 +1,4 @@
+import { type FC } from 'react';
+import { EditActionProps } from './types';
+declare const EditAction: FC<EditActionProps>;
+export default EditAction;

package/dist/types/view/FlexibleCard/components/actions/edit-action/types.d.ts

@@ -0,0 +1,2 @@
+import type { ActionProps } from '../action/types';
+export type EditActionProps = ActionProps;

package/dist/types/view/FlexibleCard/components/actions/index.d.ts

@@ -4,18 +4,8 @@ import { ViewActionProps } from './action/view-action/types';
 export { default as FollowAction } from './follow-action';
 export { default as PreviewAction } from './preview-action';
 export { default as DownloadAction } from './download-action';
-/**
- * Creates a DeleteAction component. Accepts default ActionProps, but defaults
- * the icon to a cross icon.
- * @see Action
- */
-export declare const DeleteAction: import("react").FC<ActionProps>;
-/**
- * Creates a EditAction component. Accepts default ActionProps, but defaults
- * the icon to an edit (pencil) icon.
- * @see Action
- */
-export declare const EditAction: import("react").FC<ActionProps>;
+export { default as EditAction } from './edit-action';
+export { default as DeleteAction } from './delete-action';
 /**
  * Creates a ViewAction component. Accepts default ViewActionProps, and defaults
  * to the text 'View' inside the button.

package/dist/types/view/FlexibleCard/components/actions/preview-action/preview-icon/index.d.ts

@@ -0,0 +1,4 @@
+import type { GlyphProps } from '@atlaskit/icon';
+import React from 'react';
+declare const PreviewIcon: React.FC<GlyphProps>;
+export default PreviewIcon;

package/dist/types/view/FlexibleCard/components/blocks/action-block/index.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { ActionBlockProps } from './types';
+declare const ActionBlock: React.FC<ActionBlockProps>;
+export default ActionBlock;

package/dist/types/view/FlexibleCard/components/blocks/action-block/types.d.ts

@@ -0,0 +1,17 @@
+import type { Space } from '@atlaskit/primitives';
+import type { ActionName } from '../../../../../constants';
+import type { BlockProps } from '../types';
+export type ActionBlockProps = {
+    /**
+     * Callback once action is executed.
+     */
+    onClick?: (name: ActionName) => {};
+    /**
+     * Array.Sort function to order the actions
+     */
+    sort?: (a: ActionName, b: ActionName) => number;
+    /**
+     * Used to add space along the inline axis (typically horizontal).
+     */
+    spaceInline?: Space;
+} & BlockProps;

package/dist/types/view/FlexibleCard/components/blocks/index.d.ts

@@ -7,3 +7,4 @@ export { default as CustomBlock } from './block';
 export { default as InternalFooterBlock } from './footer-block/resolved';
 export { default as RelatedUrlsBlock } from './related-urls-block';
 export { default as AISummaryBlock } from './ai-summary-block';
+export { default as ActionBlock } from './action-block';

package/dist/types/view/FlexibleCard/components/blocks/utils.d.ts

@@ -5,6 +5,11 @@ import { ElementName, SmartLinkDirection, SmartLinkSize } from '../../../../cons
 import type { FlexibleUiDataContext } from '../../../../state/flexible-ui-context/types';
 export type ElementDisplaySchemaType = 'inline' | 'block';
 export declare const ElementDisplaySchema: Record<ElementName, ElementDisplaySchemaType[]>;
+/**
+ * Get gap size between elements inside a block
+ * Equivalent version for DS primitives space token is getPrimitivesInlineSpaceBySize()
+ * at view/FlexibleCard/components/utils.tsx
+ */
 export declare const getGapSize: (size: SmartLinkSize) => number;
 export declare const getBaseStyles: (direction: SmartLinkDirection, size: SmartLinkSize) => SerializedStyles;
 export declare const highlightRemoveStyles: SerializedStyles;

package/dist/types/view/FlexibleCard/components/utils.d.ts

@@ -1,6 +1,7 @@
 /// <reference types="react" />
 import { SerializedStyles } from '@emotion/react';
 import { Spacing } from '@atlaskit/button';
+import type { Space } from '@atlaskit/primitives';
 import { SmartLinkSize } from '../../../constants';
 import { MessageProps } from './types';
 import { PreviewActionData } from '../../../state/flexible-ui-context/types';
@@ -15,6 +16,16 @@ export declare const getLinkLineHeight: (size: SmartLinkSize) => string;
 export declare const getLinkSizeStyles: (size: SmartLinkSize) => SerializedStyles;
 export declare const getMaxLineHeight: (size: SmartLinkSize) => 1.5 | 1.75;
 export declare const getMaxLines: (value: number, defaultValue: number, max: number, min: number) => number;
+/**
+ * A space between element based on smart link size
+ * To replace blocks/utils.tsz getGapSize() with space token for primitives
+ */
+export declare const getPrimitivesInlineSpaceBySize: (size: SmartLinkSize) => Space;
+/**
+ * Get container padding based on smart link size
+ * To replace container/index.tsx getPadding() with space token for primitives
+ */
+export declare const getPrimitivesPaddingSpaceBySize: (size: SmartLinkSize) => Space;
 export declare const getTruncateStyles: (maxLines: number, lineHeight?: string, wordBreak?: 'break-word' | 'break-all') => SerializedStyles;
 export declare const hasWhiteSpace: (str: string) => boolean;
 export declare const openEmbedModalWithFlexibleUiIcon: ({ linkIcon, ...props }: Partial<EmbedModalProps> & Pick<PreviewActionData, 'linkIcon'>) => Promise<void>;