@atlaskit/smart-card 38.5.1 → 38.5.2

package/dist/es2019/view/BlockCard/views/ResolvedView.js

@@ -9,7 +9,7 @@ import { fg } from '@atlaskit/platform-feature-flags';
 import { ActionName, ElementName, SmartLinkPosition, SmartLinkStatus } from '../../../constants';
 import FlexibleCard from '../../FlexibleCard';
 import { FooterBlock, MetadataBlock, PreviewBlock, SnippetBlock, TitleBlock } from '../../FlexibleCard/components/blocks';
-import { FlexibleCardUiOptions, getSimulatedBetterMetadata, PreviewBlockOptions, titleBlockOptions } from './utils';
+import { FlexibleCardUiOptions, FlexibleCardUiOptionsOld, getSimulatedBetterMetadata, PreviewBlockOptions, titleBlockOptions } from './utils';
 import { withFlexibleUIBlockCardStyle } from './utils/withFlexibleUIBlockCardStyle';
 const titleBlockCssOld = null;
 const titleBlockCss = null;
@@ -66,35 +66,44 @@ const ResolvedView = ({
     origin: "smartLinkCard",
     actionOptions: actionOptions,
     testId: testId,
-    ui: FlexibleCardUiOptions,
+    ui: fg('platform-linking-flexible-card-context') ? FlexibleCardUiOptions : FlexibleCardUiOptionsOld,
     url: url
   }, /*#__PURE__*/React.createElement(TitleBlock, _extends({}, titleBlockOptions, {
     metadata: titleMetadata,
     subtitle: [{
       name: ElementName.Location
     }],
-    metadataPosition: SmartLinkPosition.Top,
-    status: status,
+    metadataPosition: SmartLinkPosition.Top
+  }, fg('platform-linking-flexible-card-context') ? undefined : {
+    status
+  }, {
     className: ax([fg('platform-linking-visual-refresh-v1') ? "_zulpu2gc _13mh1pd9 _2yhz14q2" : "_zulpcxkx _13mh1pd9"])
-  })), /*#__PURE__*/React.createElement(MetadataBlock, {
+  })), /*#__PURE__*/React.createElement(MetadataBlock, _extends({
     primary: topMetadata,
-    maxLines: 1,
-    status: SmartLinkStatus.Resolved,
+    maxLines: 1
+  }, fg('platform-linking-flexible-card-context') ? undefined : {
+    status: SmartLinkStatus.Resolved
+  }, {
     className: ax([!fg('platform-linking-visual-refresh-v1') && "_wwyvidpf _1sxbcxkx _i8d01j6v"])
-  }), /*#__PURE__*/React.createElement(SnippetBlock, null), /*#__PURE__*/React.createElement(MetadataBlock, {
+  })), /*#__PURE__*/React.createElement(SnippetBlock, null), /*#__PURE__*/React.createElement(MetadataBlock, _extends({
     primary: bottomMetadata,
-    maxLines: 1,
-    status: SmartLinkStatus.Resolved,
+    maxLines: 1
+  }, fg('platform-linking-flexible-card-context') ? undefined : {
+    status: SmartLinkStatus.Resolved
+  }, {
     className: ax([!fg('platform-linking-visual-refresh-v1') && "_wwyvidpf _1sxbcxkx _i8d01j6v"])
-  }), !isPreviewBlockErrored ? /*#__PURE__*/React.createElement(PreviewBlock, _extends({}, PreviewBlockOptions, {
+  })), !isPreviewBlockErrored ? /*#__PURE__*/React.createElement(PreviewBlock, _extends({}, PreviewBlockOptions, {
     onError: () => {
       setIsPreviewBlockErrored(true);
-    },
+    }
+  }, fg('platform-linking-flexible-card-context') ? undefined : {
+    status: SmartLinkStatus.Resolved
+  })) : null, /*#__PURE__*/React.createElement(FooterBlock, _extends({
+    actions: footerActions
+  }, fg('platform-linking-flexible-card-context') ? undefined : {
     status: SmartLinkStatus.Resolved
-  })) : null, /*#__PURE__*/React.createElement(FooterBlock, {
-    actions: footerActions,
-    status: SmartLinkStatus.Resolved,
+  }, {
     className: ax([fg('platform-linking-visual-refresh-v1') ? "_4t3i1k8s _1e0c1txw _1bah1yb4 _4cvresu3 _1wpz1fhb" : "_4t3i1k8s _g0eioxwj _1qryoxwj _sxbroxwj _1gyioxwj", safari && fg('platform-linking-visual-refresh-v2') && "_4t3i1osq"])
-  }));
+  })));
 };
 export default withFlexibleUIBlockCardStyle(ResolvedView);

package/dist/es2019/view/BlockCard/views/unresolved-view/index.js

@@ -8,7 +8,7 @@ import { browser } from '@atlaskit/linking-common/user-agent';
 import { fg } from '@atlaskit/platform-feature-flags';
 import FlexibleCard from '../../../FlexibleCard';
 import { CustomBlock, InternalFooterBlock, PreviewBlock, TitleBlock } from '../../../FlexibleCard/components/blocks';
-import { FlexibleCardUiOptions, PreviewBlockOptions, titleBlockOptions } from '../utils';
+import { FlexibleCardUiOptions, FlexibleCardUiOptionsOld, PreviewBlockOptions, titleBlockOptions } from '../utils';
 const customBlockStylesOld = null;
 const customBlockStyles = null;
 const titleBlockCssOld = null;
@@ -41,23 +41,28 @@ const UnresolvedView = ({
     onError: onError,
     origin: "smartLinkCard",
     testId: testId,
-    ui: FlexibleCardUiOptions,
+    ui: fg('platform-linking-flexible-card-context') ? FlexibleCardUiOptions : FlexibleCardUiOptionsOld,
     url: url
   }, /*#__PURE__*/React.createElement(TitleBlock, _extends({}, titleBlockOptions, {
     hideIcon: !!title,
-    text: title,
-    status: cardState.status,
+    text: title
+  }, fg('platform-linking-flexible-card-context') ? undefined : {
+    status: cardState.status
+  }, {
     className: ax([fg('platform-linking-visual-refresh-v1') ? "_zulpu2gc _13mh1pd9 _2yhz14q2" : "_zulp1f3t _13mh1pd9"])
-  })), /*#__PURE__*/React.createElement(CustomBlock, {
-    status: cardState.status,
+  })), /*#__PURE__*/React.createElement(CustomBlock, _extends({}, fg('platform-linking-flexible-card-context') ? undefined : {
+    status: cardState.status
+  }, {
     className: ax([fg('platform-linking-visual-refresh-v1') ? "_zulp1b66 _1e0c1txw _4cvr1y6m _1wpz1fhb _7yjtidpf _ngc01fxt" : "_4cvr1y6m"])
-  }, children), showPreview && /*#__PURE__*/React.createElement(PreviewBlock, _extends({}, PreviewBlockOptions, {
+  }), children), showPreview && /*#__PURE__*/React.createElement(PreviewBlock, _extends({}, PreviewBlockOptions, fg('platform-linking-flexible-card-context') ? undefined : {
     status: cardState.status
-  })), /*#__PURE__*/React.createElement(InternalFooterBlock, {
+  })), /*#__PURE__*/React.createElement(InternalFooterBlock, _extends({
     actions: actions,
-    testId: "smart-block-card-footer",
-    status: cardState.status,
+    testId: "smart-block-card-footer"
+  }, fg('platform-linking-flexible-card-context') ? undefined : {
+    status: cardState.status
+  }, {
     className: ax([fg('platform-linking-visual-refresh-v1') ? "_4t3i1k8s _1e0c1txw _1bah1yb4 _4cvresu3 _1wpz1fhb" : "_4t3i1k8s _g0eioxwj _1qryoxwj _sxbroxwj _1gyioxwj", safari && fg('platform-linking-visual-refresh-v2') && "_4t3i1osq"])
-  }));
+  })));
 };
 export default UnresolvedView;

package/dist/es2019/view/BlockCard/views/utils/index.js

@@ -152,10 +152,18 @@ export const getSimulatedBetterMetadata = cardDetails => {
       };
   }
 };
-export const FlexibleCardUiOptions = {
+/**
+ * @deprecated Remove on platform-linking-flexible-card-context cleanup
+ */
+export const FlexibleCardUiOptionsOld = {
   hideElevation: true,
   hideLegacyButton: true
 };
+export const FlexibleCardUiOptions = {
+  hideElevation: true,
+  hideLegacyButton: true,
+  removeBlockRestriction: true
+};
 export const titleBlockOptions = {
   anchorTarget: '_self',
   position: SmartLinkPosition.Center,

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

@@ -5,7 +5,7 @@ import { useAnalyticsEvents } from '../../common/analytics/generated/use-analyti
 import { CardDisplay } from '../../constants';
 import { useSmartLink } from '../../state';
 import { succeedUfoExperience } from '../../state/analytics';
-import { getClickUrl, getDefinitionId, getExtensionKey, getResourceType, getServices, isFinalState } from '../../state/helpers';
+import { getClickUrl, getDefinitionId, getExtensionKey, getObjectAri, getResourceType, getServices, isFinalState } from '../../state/helpers';
 import { SmartLinkModalProvider } from '../../state/modal';
 import { isSpecialEvent } from '../../utils';
 import { combineActionOptions } from '../../utils/actions/combine-action-options';
@@ -55,8 +55,11 @@ function Component({
     actions,
     config,
     renderers,
-    error
+    error,
+    isGlancePanelAvailable,
+    openGlancePanel
   } = useSmartLink(id, url);
+  const ari = fg('fun-1765_wire_up_glance_panel_to_smart_cards') ? getObjectAri(state.details) : undefined;
   const definitionId = getDefinitionId(state.details);
   const extensionKey = getExtensionKey(state.details);
   const resourceType = getResourceType(state.details);
@@ -70,19 +73,37 @@ function Component({
   // Setup UI handlers.
   const handleClickWrapper = useCallback(event => {
     const isModifierKeyPressed = isSpecialEvent(event);
+    // Ctrl+left click on mac typically doesn't trigger onClick
+    // The event could have potentially had `e.preventDefault()` called on it by now
+    // event by smart card internally
+    // If it has been called then only then can `isModifierKeyPressed` be true.
+    const target = isModifierKeyPressed ? '_blank' : '_self';
     fireEvent('ui.smartLink.clicked', {
       id,
       display: isFlexibleUi ? CardDisplay.Flexible : appearance,
       definitionId: definitionId !== null && definitionId !== void 0 ? definitionId : null,
       isModifierKeyPressed
     });
-    if (!onClick && !isFlexibleUi) {
+
+    // If glance panel is available and the user clicked on the link,
+    // delegate the click to the glance panel handler
+    if (
+    // eslint-disable-next-line @atlaskit/platform/no-preconditioning
+    fg('fun-1765_wire_up_glance_panel_to_smart_cards') && target !== '_blank' && ari && isGlancePanelAvailable !== null && isGlancePanelAvailable !== void 0 && isGlancePanelAvailable({
+      url,
+      ari
+    }) && openGlancePanel) {
+      openGlancePanel({
+        url,
+        ari
+      });
+      fireLinkClickedEvent(createAnalyticsEvent)(event, {
+        attributes: {
+          clickOutcome: 'glancePanel'
+        }
+      });
+    } else if (!onClick && !isFlexibleUi) {
       const clickUrl = getClickUrl(url, state.details);
-      // Ctrl+left click on mac typically doesn't trigger onClick
-      // The event could have potentially had `e.preventDefault()` called on it by now
-      // event by smart card internally
-      // If it has been called then only then can `isModifierKeyPressed` be true.
-      const target = isModifierKeyPressed ? '_blank' : '_self';
       window.open(clickUrl, target);
       fireLinkClickedEvent(createAnalyticsEvent)(event, {
         attributes: {
@@ -95,7 +116,7 @@ function Component({
       }
       fireLinkClickedEvent(createAnalyticsEvent)(event);
     }
-  }, [id, url, state.details, appearance, definitionId, onClick, isFlexibleUi, createAnalyticsEvent, fireEvent]);
+  }, [fireEvent, id, isFlexibleUi, appearance, definitionId, onClick, url, state.details, ari, isGlancePanelAvailable, openGlancePanel, createAnalyticsEvent]);
   const handleAuthorize = useCallback(() => actions.authorize(appearance), [actions, appearance]);
   const handleRetry = useCallback(() => {
     actions.reload();

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

@@ -80,7 +80,7 @@ const ActionBlock = ({
         onClick: () => onClick(name),
         onError: onError,
         onLoadingChange: onLoadingChange,
-        size: size
+        size: fg('platform-linking-flexible-card-context') ? size || (ui === null || ui === void 0 ? void 0 : ui.size) : size
         // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop, @atlaskit/design-system/no-unsafe-design-token-usage
         ,
         style: padding && {
@@ -89,7 +89,7 @@ const ActionBlock = ({
         hideTooltip: isLoading
       }) : null;
     });
-  }, [context === null || context === void 0 ? void 0 : context.actions, onClick, onError, padding, size, spaceInline, isLoading, onLoadingChange]);
+  }, [context === null || context === void 0 ? void 0 : context.actions, spaceInline, onError, onLoadingChange, size, ui === null || ui === void 0 ? void 0 : ui.size, padding, isLoading, onClick]);
   return actions ? /*#__PURE__*/React.createElement("div", {
     ref: blockRef,
     "data-testid": testId

package/dist/es2019/view/FlexibleCard/components/blocks/ai-footer-block/index.js

@@ -1,6 +1,8 @@
 import _extends from "@babel/runtime/helpers/extends";
 import React from 'react';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { SmartLinkStatus } from '../../../../../constants';
+import { useFlexibleCardContext } from '../../../../../state/flexible-ui-context';
 import AIFooterBlockResolvedView from './resolved';
 /**
  * Represents a AIFooterBlock, designed to show provider metadata in
@@ -13,10 +15,22 @@ const AIFooterBlock = ({
   testId = 'smart-ai-footer-block',
   ...props
 }) => {
-  if (status !== SmartLinkStatus.Resolved) {
-    return null;
+  var _props$size, _cardContext$ui;
+  const cardContext = fg('platform-linking-flexible-card-context') ?
+  // eslint-disable-next-line react-hooks/rules-of-hooks
+  useFlexibleCardContext() : undefined;
+  if (fg('platform-linking-flexible-card-context')) {
+    if ((cardContext === null || cardContext === void 0 ? void 0 : cardContext.status) !== SmartLinkStatus.Resolved) {
+      return null;
+    }
+  } else {
+    if (status !== SmartLinkStatus.Resolved) {
+      return null;
+    }
   }
-  return /*#__PURE__*/React.createElement(AIFooterBlockResolvedView, _extends({}, props, {
+  return /*#__PURE__*/React.createElement(AIFooterBlockResolvedView, _extends({}, props, fg('platform-linking-flexible-card-context') ? {
+    size: (_props$size = props.size) !== null && _props$size !== void 0 ? _props$size : cardContext === null || cardContext === void 0 ? void 0 : (_cardContext$ui = cardContext.ui) === null || _cardContext$ui === void 0 ? void 0 : _cardContext$ui.size
+  } : undefined, {
     testId: testId
   }));
 };

package/dist/es2019/view/FlexibleCard/components/blocks/ai-summary-block/index.js

@@ -1,7 +1,8 @@
 import _extends from "@babel/runtime/helpers/extends";
 import React from 'react';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { InternalActionName, SmartLinkStatus } from '../../../../../constants';
-import { useFlexibleUiContext } from '../../../../../state/flexible-ui-context';
+import { useFlexibleCardContext, useFlexibleUiContext } from '../../../../../state/flexible-ui-context';
 import AISummaryBlockResolvedView from './resolved';
 /**
  * Represents an AISummaryBlock, designed to summarising link resource
@@ -15,16 +16,27 @@ const AISummaryBlock = ({
   testId = 'smart-ai-summary-block',
   ...props
 }) => {
-  var _context$actions;
+  var _context$actions, _props$size, _cardContext$ui;
+  const cardContext = fg('platform-linking-flexible-card-context') ?
+  // eslint-disable-next-line react-hooks/rules-of-hooks
+  useFlexibleCardContext() : undefined;
   const context = useFlexibleUiContext();
   const actionData = context === null || context === void 0 ? void 0 : (_context$actions = context.actions) === null || _context$actions === void 0 ? void 0 : _context$actions[InternalActionName.AISummaryAction];
-  if (status !== SmartLinkStatus.Resolved) {
-    return null;
+  if (fg('platform-linking-flexible-card-context')) {
+    if ((cardContext === null || cardContext === void 0 ? void 0 : cardContext.status) !== SmartLinkStatus.Resolved) {
+      return null;
+    }
+  } else {
+    if (status !== SmartLinkStatus.Resolved) {
+      return null;
+    }
   }
   if (!(actionData !== null && actionData !== void 0 && actionData.url)) {
     return null;
   }
-  return /*#__PURE__*/React.createElement(AISummaryBlockResolvedView, _extends({}, props, {
+  return /*#__PURE__*/React.createElement(AISummaryBlockResolvedView, _extends({}, props, fg('platform-linking-flexible-card-context') ? {
+    size: (_props$size = props.size) !== null && _props$size !== void 0 ? _props$size : cardContext === null || cardContext === void 0 ? void 0 : (_cardContext$ui = cardContext.ui) === null || _cardContext$ui === void 0 ? void 0 : _cardContext$ui.size
+  } : undefined, {
     testId: testId,
     url: actionData.url
   }));

package/dist/es2019/view/FlexibleCard/components/blocks/footer-block/index.js

@@ -1,6 +1,8 @@
 import _extends from "@babel/runtime/helpers/extends";
 import React from 'react';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { SmartLinkStatus } from '../../../../../constants';
+import { useFlexibleCardContext } from '../../../../../state/flexible-ui-context';
 import FooterBlockResolvedView from './resolved';
 /**
  * Represents a FooterBlock, designed to contain elements and actions that should appear
@@ -15,10 +17,22 @@ const FooterBlock = ({
   alwaysShow,
   ...props
 }) => {
-  if (status !== SmartLinkStatus.Resolved && !alwaysShow) {
-    return null;
+  var _props$size, _cardContext$ui;
+  const cardContext = fg('platform-linking-flexible-card-context') ?
+  // eslint-disable-next-line react-hooks/rules-of-hooks
+  useFlexibleCardContext() : undefined;
+  if (fg('platform-linking-flexible-card-context')) {
+    if ((cardContext === null || cardContext === void 0 ? void 0 : cardContext.status) !== SmartLinkStatus.Resolved && !alwaysShow) {
+      return null;
+    }
+  } else {
+    if (status !== SmartLinkStatus.Resolved && !alwaysShow) {
+      return null;
+    }
   }
-  return /*#__PURE__*/React.createElement(FooterBlockResolvedView, _extends({}, props, {
+  return /*#__PURE__*/React.createElement(FooterBlockResolvedView, _extends({}, props, fg('platform-linking-flexible-card-context') ? {
+    size: (_props$size = props.size) !== null && _props$size !== void 0 ? _props$size : cardContext === null || cardContext === void 0 ? void 0 : (_cardContext$ui = cardContext.ui) === null || _cardContext$ui === void 0 ? void 0 : _cardContext$ui.size
+  } : undefined, {
     testId: testId
   }));
 };

package/dist/es2019/view/FlexibleCard/components/blocks/metadata-block/index.js

@@ -7,6 +7,7 @@ import { ax, ix } from "@compiled/react/runtime";
 
 import { fg } from '@atlaskit/platform-feature-flags';
 import { SmartLinkAlignment, SmartLinkDirection, SmartLinkSize, SmartLinkStatus, SmartLinkWidth } from '../../../../../constants';
+import { useFlexibleCardContext } from '../../../../../state/flexible-ui-context';
 import Block from '../block';
 import ElementGroup from '../element-group';
 import { renderElementItems } from '../utils';
@@ -38,6 +39,22 @@ const getMaxLines = maxLines => {
   }
   return maxLines;
 };
+const ElementItemRenderer = ({
+  align = SmartLinkAlignment.Left,
+  items = [],
+  display = 'inline',
+  size = SmartLinkSize.Medium,
+  maxLines = DEFAULT_MAX_LINES
+}) => {
+  const elements = renderElementItems(items, display);
+  return elements && /*#__PURE__*/React.createElement(ElementGroup, {
+    align: align,
+    direction: SmartLinkDirection.Horizontal,
+    width: SmartLinkWidth.Flexible,
+    size: size,
+    className: ax([truncateStyles[maxLines], !fg('platform-linking-visual-refresh-v1') && sizeStylesOld[size], fg('platform-linking-visual-refresh-v1') && sizeStyles[size]])
+  }, elements);
+};
 
 /**
  * Represents a MetadataBlock, designed to contain groups of metadata in the form of elements.
@@ -54,15 +71,41 @@ const MetadataBlock = ({
   secondary = [],
   ...blockProps
 }) => {
-  if (primary.length === 0 && secondary.length === 0 || status !== SmartLinkStatus.Resolved) {
-    return null;
+  var _ref, _blockProps$size, _cardContext$ui;
+  const cardContext = fg('platform-linking-flexible-card-context') ?
+  // eslint-disable-next-line react-hooks/rules-of-hooks
+  useFlexibleCardContext() : undefined;
+  if (fg('platform-linking-flexible-card-context')) {
+    if (primary.length === 0 && secondary.length === 0 || (cardContext === null || cardContext === void 0 ? void 0 : cardContext.status) !== SmartLinkStatus.Resolved) {
+      return null;
+    }
+  } else {
+    if (primary.length === 0 && secondary.length === 0 || status !== SmartLinkStatus.Resolved) {
+      return null;
+    }
   }
-  const primaryElements = renderElementItems(primary);
-  const secondaryElements = renderElementItems(secondary);
   const {
-    size = SmartLinkSize.Medium
+    size: sizeProp = SmartLinkSize.Medium
   } = blockProps;
+  const size = fg('platform-linking-flexible-card-context') ? (_ref = (_blockProps$size = blockProps === null || blockProps === void 0 ? void 0 : blockProps.size) !== null && _blockProps$size !== void 0 ? _blockProps$size : cardContext === null || cardContext === void 0 ? void 0 : (_cardContext$ui = cardContext.ui) === null || _cardContext$ui === void 0 ? void 0 : _cardContext$ui.size) !== null && _ref !== void 0 ? _ref : SmartLinkSize.Medium : sizeProp;
   const maxLinesTotal = getMaxLines(maxLines);
+  if (fg('platform-linking-flexible-card-context')) {
+    return /*#__PURE__*/React.createElement(Block, _extends({}, blockProps, {
+      size: size,
+      testId: `${testId}-resolved-view`
+    }), /*#__PURE__*/React.createElement(ElementItemRenderer, {
+      items: primary,
+      size: size,
+      maxLines: maxLinesTotal
+    }), /*#__PURE__*/React.createElement(ElementItemRenderer, {
+      align: SmartLinkAlignment.Right,
+      items: secondary,
+      size: size,
+      maxLines: maxLinesTotal
+    }));
+  }
+  const primaryElements = renderElementItems(primary);
+  const secondaryElements = renderElementItems(secondary);
   return /*#__PURE__*/React.createElement(Block, _extends({}, blockProps, {
     testId: `${testId}-resolved-view`
   }), primaryElements && /*#__PURE__*/React.createElement(ElementGroup, {

package/dist/es2019/view/FlexibleCard/components/blocks/preview-block/index.js

@@ -1,6 +1,8 @@
 import _extends from "@babel/runtime/helpers/extends";
 import React from 'react';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { SmartLinkStatus } from '../../../../../constants';
+import { useFlexibleUiOptionContext } from '../../../../../state/flexible-ui-context';
 import PreviewBlockResolvedView from './resolved';
 /**
  * Represents a PreviewBlock, which typically contains media or other large format content.
@@ -15,7 +17,13 @@ const PreviewBlock = ({
   overrideUrl,
   ...blockProps
 }) => {
-  return /*#__PURE__*/React.createElement(PreviewBlockResolvedView, _extends({}, blockProps, {
+  var _blockProps$size;
+  const ui = fg('platform-linking-flexible-card-context') ?
+  // eslint-disable-next-line react-hooks/rules-of-hooks
+  useFlexibleUiOptionContext() : undefined;
+  return /*#__PURE__*/React.createElement(PreviewBlockResolvedView, _extends({}, blockProps, fg('platform-linking-flexible-card-context') ? {
+    size: (_blockProps$size = blockProps.size) !== null && _blockProps$size !== void 0 ? _blockProps$size : ui === null || ui === void 0 ? void 0 : ui.size
+  } : undefined, {
     testId: testId,
     overrideUrl: overrideUrl
   }));

package/dist/es2019/view/FlexibleCard/components/blocks/snippet-block/index.js

@@ -2,7 +2,7 @@ import _extends from "@babel/runtime/helpers/extends";
 import React from 'react';
 import { fg } from '@atlaskit/platform-feature-flags';
 import { SmartLinkStatus } from '../../../../../constants';
-import { useFlexibleUiContext } from '../../../../../state/flexible-ui-context';
+import { useFlexibleCardContext, useFlexibleUiContext } from '../../../../../state/flexible-ui-context';
 import { useSmartLinkRenderers } from '../../../../../state/renderers';
 import { Snippet } from '../../elements';
 import { getMaxLines } from '../../utils';
@@ -24,15 +24,24 @@ const SnippetBlock = ({
   text,
   ...blockProps
 }) => {
-  var _ref, _context$meta$objectI, _context$meta, _context$meta$resourc, _context$meta2, _context$meta$tenantI, _context$meta3;
+  var _blockProps$size2, _cardContext$ui2, _ref, _context$meta$objectI, _context$meta, _context$meta$resourc, _context$meta2, _context$meta$tenantI, _context$meta3;
   const context = fg('cc-ai-linking-platform-snippet-renderer') ?
   // eslint-disable-next-line react-hooks/rules-of-hooks
   useFlexibleUiContext() : undefined;
   const renderers = fg('cc-ai-linking-platform-snippet-renderer') ?
   // eslint-disable-next-line react-hooks/rules-of-hooks
   useSmartLinkRenderers() : undefined;
-  if (status !== SmartLinkStatus.Resolved && !text) {
-    return null;
+  const cardContext = fg('platform-linking-flexible-card-context') ?
+  // eslint-disable-next-line react-hooks/rules-of-hooks
+  useFlexibleCardContext() : undefined;
+  if (fg('platform-linking-flexible-card-context')) {
+    if ((cardContext === null || cardContext === void 0 ? void 0 : cardContext.status) !== SmartLinkStatus.Resolved && !text) {
+      return null;
+    }
+  } else {
+    if (status !== SmartLinkStatus.Resolved && !text) {
+      return null;
+    }
   }
   const snippetMaxLines = getMaxLines(maxLines, DEFAULT_MAX_LINES, MAXIMUM_MAX_LINES, MINIMUM_MAX_LINES);
   const statusTestId = !text ? 'resolved' : 'non-resolved';
@@ -41,12 +50,17 @@ const SnippetBlock = ({
     content: text
   });
   if (!fg('cc-ai-linking-platform-snippet-renderer')) {
-    return /*#__PURE__*/React.createElement(Block, _extends({}, blockProps, {
+    var _blockProps$size, _cardContext$ui;
+    return /*#__PURE__*/React.createElement(Block, _extends({}, blockProps, fg('platform-linking-flexible-card-context') ? {
+      size: (_blockProps$size = blockProps.size) !== null && _blockProps$size !== void 0 ? _blockProps$size : cardContext === null || cardContext === void 0 ? void 0 : (_cardContext$ui = cardContext.ui) === null || _cardContext$ui === void 0 ? void 0 : _cardContext$ui.size
+    } : undefined, {
       testId: `${testId}-${statusTestId}-view`
     }), snippet);
   }
   const SnippetReplacement = renderers === null || renderers === void 0 ? void 0 : renderers.snippet;
-  return /*#__PURE__*/React.createElement(Block, _extends({}, blockProps, {
+  return /*#__PURE__*/React.createElement(Block, _extends({}, blockProps, fg('platform-linking-flexible-card-context') ? {
+    size: (_blockProps$size2 = blockProps.size) !== null && _blockProps$size2 !== void 0 ? _blockProps$size2 : cardContext === null || cardContext === void 0 ? void 0 : (_cardContext$ui2 = cardContext.ui) === null || _cardContext$ui2 === void 0 ? void 0 : _cardContext$ui2.size
+  } : undefined, {
     testId: `${testId}-${statusTestId}-view`
   }), SnippetReplacement ? /*#__PURE__*/React.createElement(SnippetReplacement, {
     fallbackText: (_ref = text || (context === null || context === void 0 ? void 0 : context.snippet)) !== null && _ref !== void 0 ? _ref : '',

package/dist/es2019/view/FlexibleCard/components/blocks/title-block/index.js

@@ -7,6 +7,7 @@ import { useCallback, useState } from 'react';
 import { fg } from '@atlaskit/platform-feature-flags';
 import { SmartLinkStatus } from '../../../../../constants';
 import { useMouseDownEvent } from '../../../../../state/analytics/useLinkClicked';
+import { useFlexibleCardContext } from '../../../../../state/flexible-ui-context';
 import { Title } from '../../elements';
 import ActionGroup from '../action-group';
 import TitleBlockErroredView from './errored';
@@ -49,7 +50,7 @@ const TitleBlock = ({
   maxLines,
   onActionMenuOpenChange,
   onClick,
-  status = SmartLinkStatus.Fallback,
+  status: statusProp = SmartLinkStatus.Fallback,
   showActionOnHover,
   testId = 'smart-block-title',
   text,
@@ -62,6 +63,14 @@ const TitleBlock = ({
   anchorRef,
   ...props
 }) => {
+  var _props$size;
+  const cardContext = fg('platform-linking-flexible-card-context') ?
+  // eslint-disable-next-line react-hooks/rules-of-hooks
+  useFlexibleCardContext() : undefined;
+  const {
+    status = SmartLinkStatus.Fallback,
+    ui
+  } = cardContext || {};
   if (!fg('platform-linking-flexible-card-unresolved-action')) {
     if (hideRetry && props.retry) {
       delete props.retry;
@@ -87,14 +96,16 @@ const TitleBlock = ({
   const onMouseDown = useMouseDownEvent();
   const title = /*#__PURE__*/React.createElement(Title, _extends({
     hideTooltip: hideTitleTooltip,
-    maxLines: maxLines,
-    onClick: onClick,
+    maxLines: maxLines
+  }, fg('platform-linking-flexible-card-context') ? undefined : {
+    onClick
+  }, {
     onMouseDown: onMouseDown,
     target: anchorTarget,
-    theme: theme,
+    theme: fg('platform-linking-flexible-card-context') ? ui === null || ui === void 0 ? void 0 : ui.theme : theme,
     anchorRef: anchorRef
   }, overrideText));
-  const Component = getTitleBlockViewComponent(status);
+  const Component = getTitleBlockViewComponent(fg('platform-linking-flexible-card-context') ? status : statusProp);
   return /*#__PURE__*/React.createElement(Component, _extends({}, props, {
     actionGroup: actionGroup
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop
@@ -108,8 +119,9 @@ const TitleBlock = ({
     hideRetry
   } : undefined, {
     icon: icon,
-    size: props.size,
-    theme: theme
+    size: fg('platform-linking-flexible-card-context') ? (_props$size = props.size) !== null && _props$size !== void 0 ? _props$size : ui === null || ui === void 0 ? void 0 : ui.size : props === null || props === void 0 ? void 0 : props.size
+  }, fg('platform-linking-flexible-card-context') ? undefined : {
+    theme
   }));
 };
 export default TitleBlock;

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

@@ -35,6 +35,14 @@ export const getChildrenOptions = (children, context) => {
   }
   return options;
 };
+const filterChildren = (children, removeBlockRestriction) => {
+  if (fg('platform-linking-flexible-card-openness')) {
+    if (removeBlockRestriction) {
+      return children;
+    }
+  }
+  return React.Children.map(children, child => /*#__PURE__*/React.isValidElement(child) && isFlexibleUiBlock(child) ? child : undefined);
+};
 const renderChildren = (children, containerSize, containerTheme, status, retry, onClick, removeBlockRestriction) => {
   return React.Children.map(children, child => {
     if ( /*#__PURE__*/React.isValidElement(child) && isFlexibleUiBlock(child)) {
@@ -333,7 +341,7 @@ const Container = ({
       "--_73mooq": ix(previewOnLeft ? gap : padding),
       "--_12k13bg": ix(previewOnRight ? gap : padding)
     }
-  }, clickableContainer ? getLayeredLink(testId, context, children, onClick) : null, renderChildren(children, size, theme, status, retry, onClick, removeBlockRestriction)) : /*#__PURE__*/React.createElement("div", {
+  }, clickableContainer ? getLayeredLink(testId, context, children, onClick) : null, fg('platform-linking-flexible-card-context') ? filterChildren(children, removeBlockRestriction) : renderChildren(children, size, theme, status, retry, onClick, removeBlockRestriction)) : /*#__PURE__*/React.createElement("div", {
     "data-smart-link-container": true,
     "data-testid": testId,
     className: ax(["_1e0c1txw _2lx21bp4 _1ul9idpf _1reo15vq _kqswh2mm _1pcmkb7n _1v7y1i6y _ufn21i6y", gapStyleMapOld[size], !hideBackground && "_bfhkhp5a", "_1yt418y6 _jb7v18y6 _y5vk167t _1yob1wow _r37x1r5k", previewOnLeft && previewOnLeftStyleMapOld[size], previewOnRight && previewOnRightStyleMapOld[size], !hideElevation && "_19ith6cr _2rkopd34 _19pkv77o _2hwxv77o _otyrv77o _18u0v77o", clickableContainer && "_nqwih2mm _18ywh2mm _1nq3h2mm _1t4ckb7n _1nxdkb7n _xnbykb7n"]),
@@ -342,7 +350,7 @@ const Container = ({
       "--_73mooq": ix(previewOnLeft ? gap : padding),
       "--_12k13bg": ix(previewOnRight ? gap : padding)
     }
-  }, clickableContainer ? getLayeredLink(testId, context, children, onClick) : null, renderChildren(children, size, theme, status, retry, onClick, removeBlockRestriction));
+  }, clickableContainer ? getLayeredLink(testId, context, children, onClick) : null, fg('platform-linking-flexible-card-context') ? filterChildren(children, removeBlockRestriction) : renderChildren(children, size, theme, status, retry, onClick, removeBlockRestriction));
   if (context !== null && context !== void 0 && context.url && (canShowHoverPreview || canShowAuthTooltip)) {
     return /*#__PURE__*/React.createElement(HoverCardControl, {
       isHoverPreview: canShowHoverPreview,

package/dist/es2019/view/FlexibleCard/components/elements/title-element/index.js

@@ -1,11 +1,12 @@
 import _extends from "@babel/runtime/helpers/extends";
 import React from 'react';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { ElementName } from '../../../../../constants';
 import { useFlexibleUiContext } from '../../../../../state/flexible-ui-context';
 import { BaseLinkElement, toLinkProps } from '../common';
 const TitleElement = props => {
   const context = useFlexibleUiContext();
-  const data = context ? toLinkProps(context.title, context.url) : null;
+  const data = context ? fg('platform-linking-flexible-card-context') ? context === null || context === void 0 ? void 0 : context.linkTitle : toLinkProps(context.title, context.url) : null;
   return data ? /*#__PURE__*/React.createElement(BaseLinkElement, _extends({}, data, props, {
     name: ElementName.Title
   })) : null;

package/dist/es2019/view/FlexibleCard/components/elements/utils.js

@@ -283,6 +283,9 @@ const getData = (elementName, contextKey, context) => {
     case ElementName.TargetBranch:
       return toTextProps(data);
     case ElementName.Title:
+      if (fg('platform-linking-flexible-card-context')) {
+        return context.linkTitle;
+      }
       return toLinkProps(context.title, context.url);
     case ElementName.LinkIcon:
       if (fg('platform-linking-visual-refresh-v2')) {