@atlaskit/smart-card 34.5.2 → 34.6.1

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

@@ -0,0 +1,75 @@
+import _extends from "@babel/runtime/helpers/extends";
+import React, { useEffect, useMemo, useState } from 'react';
+import { ActionName, ElementName, SmartLinkPosition } from '../../../constants';
+import FlexibleCard from '../../FlexibleCard';
+import { FooterBlock, MetadataBlock, PreviewBlock, SnippetBlock, TitleBlock } from '../../FlexibleCard/components/blocks';
+import { metadataBlockCss } from './styledOld';
+import { FlexibleCardUiOptions, FooterBlockOptionsOld, getSimulatedBetterMetadata, PreviewBlockOptions, titleBlockOptionsOld } from './utils';
+
+/**
+ * This view represents a Block card that has an 'Resolved' status.
+ * @see SmartLinkStatus
+ * @see FlexibleCardProps
+ */
+const ResolvedViewOld = ({
+  cardState,
+  onClick,
+  onError,
+  onResolve,
+  actionOptions,
+  testId = 'smart-block-resolved-view',
+  url
+}) => {
+  const [isPreviewBlockErrored, setIsPreviewBlockErrored] = useState(false);
+  useEffect(() => {
+    setIsPreviewBlockErrored(false);
+  }, [url, cardState]);
+  const {
+    titleMetadata,
+    topMetadata,
+    bottomMetadata
+  } = getSimulatedBetterMetadata(cardState.details);
+  const footerActions = useMemo(() => [{
+    name: ActionName.FollowAction,
+    hideIcon: true
+  }, {
+    name: ActionName.PreviewAction,
+    hideIcon: true
+  }, {
+    name: ActionName.DownloadAction,
+    hideIcon: true
+  }], []);
+  return /*#__PURE__*/React.createElement(FlexibleCard, {
+    appearance: "block",
+    cardState: cardState,
+    onClick: onClick,
+    onError: onError,
+    onResolve: onResolve,
+    origin: "smartLinkCard",
+    actionOptions: actionOptions,
+    testId: testId,
+    ui: FlexibleCardUiOptions,
+    url: url
+  }, /*#__PURE__*/React.createElement(TitleBlock, _extends({}, titleBlockOptionsOld, {
+    metadata: titleMetadata,
+    subtitle: [{
+      name: ElementName.Location
+    }],
+    metadataPosition: SmartLinkPosition.Top
+  })), /*#__PURE__*/React.createElement(MetadataBlock, {
+    primary: topMetadata,
+    maxLines: 1,
+    overrideCss: metadataBlockCss
+  }), /*#__PURE__*/React.createElement(SnippetBlock, null), /*#__PURE__*/React.createElement(MetadataBlock, {
+    primary: bottomMetadata,
+    maxLines: 1,
+    overrideCss: metadataBlockCss
+  }), !isPreviewBlockErrored ? /*#__PURE__*/React.createElement(PreviewBlock, _extends({}, PreviewBlockOptions, {
+    onError: () => {
+      setIsPreviewBlockErrored(true);
+    }
+  })) : null, /*#__PURE__*/React.createElement(FooterBlock, _extends({}, FooterBlockOptionsOld, {
+    actions: footerActions
+  })));
+};
+export default ResolvedViewOld;

package/dist/es2019/view/BlockCard/views/UnauthorisedView.compiled.css

@@ -0,0 +1,3 @@
+._11c8qk37{font:var(--ds-font-body-UNSAFE_small,normal 400 9pt/1pc ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,system-ui,"Helvetica Neue",sans-serif)}
+._19pkcxkx{margin-top:var(--ds-space-100,.5rem)}
+._syaz131l{color:var(--ds-text-subtlest,#626f86)}

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

@@ -1,12 +1,9 @@
+/* UnauthorisedView.tsx generated by @compiled/babel-plugin v0.35.0 */
 import _extends from "@babel/runtime/helpers/extends";
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
+import "./UnauthorisedView.compiled.css";
+import * as React from 'react';
+import { ax, ix } from "@compiled/react/runtime";
 import { useCallback, useMemo } from 'react';
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import { css, jsx } from '@emotion/react';
 import { FormattedMessage } from 'react-intl-next';
 import { extractProvider } from '@atlaskit/link-extractors';
 import { useAnalyticsEvents } from '../../../common/analytics/generated/use-analytics-events';
@@ -16,11 +13,7 @@ import UnauthorisedViewContent from '../../common/UnauthorisedViewContent';
 import { AuthorizeAction } from '../actions/AuthorizeAction';
 import UnresolvedView from './unresolved-view';
 import { withFlexibleUIBlockCardStyle } from './utils/withFlexibleUIBlockCardStyle';
-const contentStyles = css({
-  color: "var(--ds-text-subtlest, #626F86)",
-  marginTop: "var(--ds-space-100, 0.5rem)",
-  font: "var(--ds-font-body-UNSAFE_small, normal 400 12px/16px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)"
-});
+const contentStyles = null;
 
 /**
  * This view represents a Block card that has an 'Unauthorized' status .
@@ -50,22 +43,22 @@ const UnauthorisedView = ({
       onAuthorize();
     }
   }, [onAuthorize, fireEvent]);
-  const content = useMemo(() => onAuthorize ? jsx(UnauthorisedViewContent, {
+  const content = useMemo(() => onAuthorize ? /*#__PURE__*/React.createElement(UnauthorisedViewContent, {
     providerName: providerName,
     isProductIntegrationSupported: isProductIntegrationSupported,
     testId: testId
-  }) : jsx(FormattedMessage, _extends({}, messages[providerName ? 'unauthorised_account_description' : 'unauthorised_account_description_no_provider'], {
+  }) : /*#__PURE__*/React.createElement(FormattedMessage, _extends({}, messages[providerName ? 'unauthorised_account_description' : 'unauthorised_account_description_no_provider'], {
     values: {
       context: providerName
     }
   })), [isProductIntegrationSupported, onAuthorize, providerName, testId]);
   const actions = useMemo(() => onAuthorize ? [AuthorizeAction(handleAuthorize, providerName)] : [], [handleAuthorize, onAuthorize, providerName]);
-  return jsx(UnresolvedView, _extends({}, props, {
+  return /*#__PURE__*/React.createElement(UnresolvedView, _extends({}, props, {
     actions: actions,
     testId: testId
-  }), jsx("div", {
-    css: contentStyles,
-    "data-testid": `${testId}-content`
+  }), /*#__PURE__*/React.createElement("div", {
+    "data-testid": `${testId}-content`,
+    className: ax(["_11c8qk37 _syaz131l _19pkcxkx"])
   }, content));
 };
 export default withFlexibleUIBlockCardStyle(UnauthorisedView);

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

@@ -0,0 +1,42 @@
+import _extends from "@babel/runtime/helpers/extends";
+import React from 'react';
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
+import { css } from '@emotion/react';
+import FlexibleCard from '../../../FlexibleCard';
+import { CustomBlock, InternalFooterBlock, PreviewBlock, TitleBlock } from '../../../FlexibleCard/components/blocks';
+import { FlexibleCardUiOptions, FooterBlockOptionsOld, PreviewBlockOptions, titleBlockOptionsOld } from '../utils';
+const customBlockStyles = css({
+  alignItems: 'flex-start'
+});
+const UnresolvedViewOld = ({
+  actions,
+  cardState,
+  children,
+  onAuthorize,
+  onClick,
+  onError,
+  showPreview = false,
+  testId,
+  title,
+  url
+}) => /*#__PURE__*/React.createElement(FlexibleCard, {
+  appearance: "block",
+  cardState: cardState,
+  onAuthorize: onAuthorize,
+  onClick: onClick,
+  onError: onError,
+  origin: "smartLinkCard",
+  testId: testId,
+  ui: FlexibleCardUiOptions,
+  url: url
+}, /*#__PURE__*/React.createElement(TitleBlock, _extends({}, titleBlockOptionsOld, {
+  hideIcon: !!title,
+  text: title
+})), /*#__PURE__*/React.createElement(CustomBlock, {
+  overrideCss: customBlockStyles
+}, children), showPreview && /*#__PURE__*/React.createElement(PreviewBlock, PreviewBlockOptions), /*#__PURE__*/React.createElement(InternalFooterBlock, _extends({}, FooterBlockOptionsOld, {
+  actions: actions,
+  testId: "smart-block-card-footer"
+})));
+export default UnresolvedViewOld;

package/dist/es2019/view/BlockCard/views/unresolved-view/index.compiled.css

@@ -0,0 +1,5 @@
+
+._zulp1f3t{gap:var(--ds-space-100,.5em)}._13mh1pd9 [data-smart-element=Title]{font-weight:var(--ds-font-weight-semibold,600)}
+._4cvr1y6m{align-items:flex-start}
+._4t3i1k8s{height:1.5rem}
+._g0eioxwj .actions-button-group button, ._1qryoxwj .actions-button-group button:active, ._sxbroxwj .actions-button-group button:focus, ._1gyioxwj .actions-button-group button:hover{font-size:.875rem}

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

@@ -1,14 +1,16 @@
+/* index.tsx generated by @compiled/babel-plugin v0.35.0 */
 import _extends from "@babel/runtime/helpers/extends";
-import React from 'react';
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import { css } from '@emotion/react';
+import "./index.compiled.css";
+import * as React from 'react';
+import { ax, ix } from "@compiled/react/runtime";
+import { fg } from '@atlaskit/platform-feature-flags';
 import FlexibleCard from '../../../FlexibleCard';
 import { CustomBlock, InternalFooterBlock, PreviewBlock, TitleBlock } from '../../../FlexibleCard/components/blocks';
-import { FlexibleCardUiOptions, FooterBlockOptions, PreviewBlockOptions, titleBlockOptions } from '../utils';
-const customBlockStyles = css({
-  alignItems: 'flex-start'
-});
+import { FlexibleCardUiOptions, PreviewBlockOptions, titleBlockOptions } from '../utils';
+import UnresolvedViewOld from './UnresolvedViewOld';
+const customBlockStyles = null;
+const titleBlockCss = null;
+const footerBlockCss = null;
 const UnresolvedView = ({
   actions,
   cardState,
@@ -32,11 +34,25 @@ const UnresolvedView = ({
   url: url
 }, /*#__PURE__*/React.createElement(TitleBlock, _extends({}, titleBlockOptions, {
   hideIcon: !!title,
-  text: title
+  text: title,
+  status: cardState.status,
+  className: ax(["_zulp1f3t _13mh1pd9"])
 })), /*#__PURE__*/React.createElement(CustomBlock, {
-  overrideCss: customBlockStyles
-}, children), showPreview && /*#__PURE__*/React.createElement(PreviewBlock, PreviewBlockOptions), /*#__PURE__*/React.createElement(InternalFooterBlock, _extends({}, FooterBlockOptions, {
+  status: cardState.status,
+  className: ax(["_4cvr1y6m"])
+}, children), showPreview && /*#__PURE__*/React.createElement(PreviewBlock, _extends({}, PreviewBlockOptions, {
+  status: cardState.status
+})), /*#__PURE__*/React.createElement(InternalFooterBlock, {
   actions: actions,
-  testId: "smart-block-card-footer"
-})));
-export default UnresolvedView;
+  testId: "smart-block-card-footer",
+  status: cardState.status,
+  className: ax(["_4t3i1k8s _g0eioxwj _1qryoxwj _sxbroxwj _1gyioxwj"])
+}));
+export const UnresolvedViewExported = props => {
+  if (fg('bandicoots-compiled-migration-smartcard')) {
+    return /*#__PURE__*/React.createElement(UnresolvedView, props);
+  } else {
+    return /*#__PURE__*/React.createElement(UnresolvedViewOld, props);
+  }
+};
+export default UnresolvedViewExported;

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

@@ -2,7 +2,7 @@ import { fg } from '@atlaskit/platform-feature-flags';
 import { ElementName, MediaPlacement, SmartLinkPosition, SmartLinkSize } from '../../../../constants';
 import { extractOwnedBy } from '../../../../extractors/flexible/utils';
 import { getExtensionKey } from '../../../../state/helpers';
-import { footerBlockCss, titleBlockCss } from '../styled';
+import { footerBlockCss, titleBlockCss } from '../styledOld';
 const baseTopMetadata = [{
   name: ElementName.ModifiedOn
 }, {
@@ -137,6 +137,12 @@ export const FlexibleCardUiOptions = {
   hideElevation: true
 };
 export const titleBlockOptions = {
+  anchorTarget: '_self',
+  position: SmartLinkPosition.Center,
+  hideRetry: true,
+  size: SmartLinkSize.Large
+};
+export const titleBlockOptionsOld = {
   anchorTarget: '_self',
   position: SmartLinkPosition.Center,
   overrideCss: titleBlockCss,
@@ -147,6 +153,6 @@ export const PreviewBlockOptions = {
   placement: MediaPlacement.Right,
   ignoreContainerPadding: true
 };
-export const FooterBlockOptions = {
+export const FooterBlockOptionsOld = {
   overrideCss: footerBlockCss
 };

package/dist/es2019/view/BlockCard/views/utils/withFlexibleUIBlockCardStyle.compiled.css

@@ -0,0 +1,2 @@
+._1g96pd34>div{border-radius:var(--ds-border-radius-200,8px)}
+._1qo3h6cr>div{border:1px solid var(--ds-border,#dfe1e6)}

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

@@ -1,15 +1,20 @@
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import { jsx } from '@emotion/react';
-import { flexibleBlockCardStyle } from '../styled';
+/* withFlexibleUIBlockCardStyle.tsx generated by @compiled/babel-plugin v0.35.0 */
+import "./withFlexibleUIBlockCardStyle.compiled.css";
+import * as React from 'react';
+import { ax, ix } from "@compiled/react/runtime";
+import { fg } from '@atlaskit/platform-feature-flags';
+import { N40 } from '@atlaskit/theme/colors';
+import { withFlexibleUIBlockCardStyleOld } from './withFlexibleUIBlockCardStyleOld';
+const flexibleBlockCardStyle = null;
+export const withFlexibleUIBlockCardStyleNew = FlexibleBlockCardView => props => {
+  return /*#__PURE__*/React.createElement("div", {
+    className: ax(["_1g96pd34 _1qo3h6cr"])
+  }, /*#__PURE__*/React.createElement(FlexibleBlockCardView, props));
+};
 export const withFlexibleUIBlockCardStyle = FlexibleBlockCardView => props => {
-  return (
-    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-    jsx("div", {
-      css: flexibleBlockCardStyle
-    }, jsx(FlexibleBlockCardView, props))
-  );
+  if (fg('bandicoots-compiled-migration-smartcard')) {
+    return withFlexibleUIBlockCardStyleNew(FlexibleBlockCardView)(props);
+  } else {
+    return withFlexibleUIBlockCardStyleOld(FlexibleBlockCardView)(props);
+  }
 };

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

@@ -0,0 +1,15 @@
+/**
+ * @jsxRuntime classic
+ * @jsx jsx
+ */
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+import { jsx } from '@emotion/react';
+import { flexibleBlockCardStyle } from '../styledOld';
+export const withFlexibleUIBlockCardStyleOld = FlexibleBlockCardView => props => {
+  return (
+    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    jsx("div", {
+      css: flexibleBlockCardStyle
+    }, jsx(FlexibleBlockCardView, props))
+  );
+};

package/dist/es2019/view/EmbedModal/components/link-info/styledOld.js

@@ -1,3 +1,4 @@
+/* eslint-disable @atlaskit/design-system/use-tokens-typography */
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { css } from '@emotion/react';
 // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
@@ -54,11 +55,9 @@ export const actionCss = css({
   display: 'flex',
   flex: '0 0 auto',
   gap: "var(--ds-space-050, 4px)",
-  // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
   lineHeight: height,
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   span: {
-    // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
     lineHeight: height
   },
   '@media only screen and (max-width: 980px)': {

package/dist/es2019/view/FlexibleCard/components/actions/action/action-icon/ActionIconOld.js

@@ -1,3 +1,4 @@
+/* eslint-disable @atlaskit/design-system/use-tokens-typography */
 /**
  * @jsxRuntime classic
  * @jsx jsx
@@ -26,18 +27,15 @@ const stackItemIconSizeStyles = getIconSizeStyles('20px');
 // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
 const stackItemIconStyles = css(stackItemIconSizeStyles, {
   display: 'inline-block',
-  // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
   lineHeight: 0,
   padding: "var(--ds-space-025, 2px)",
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   'span,svg,img': {
-    // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
     lineHeight: 0
   }
 });
 const newStackItemIconStyles = css({
   display: 'inline-block',
-  // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
   lineHeight: 0
 });
 const ActionIconOld = ({

package/dist/es2019/view/FlexibleCard/components/blocks/block/index.compiled.css

@@ -31,4 +31,5 @@
 ._syaz1kw7{color:inherit}
 ._te17glyw{-ms-user-select:none}
 ._uiztglyw{-webkit-user-select:none;-ms-user-select:none;user-select:none}
+._vwz41j6v{line-height:1rem}
 ._ytq1bjq5 [data-smart-element=SourceBranch]+[data-smart-element=TargetBranch]:before{content:"→"}

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

@@ -27,7 +27,7 @@ const directionStyles = {
  * @param {ActionGroupProps} ActionGroupProps
  * @see Action
  */
-const Block = ({
+const BlockNew = ({
   children,
   direction = SmartLinkDirection.Horizontal,
   size = SmartLinkSize.Medium,
@@ -35,25 +35,29 @@ const Block = ({
   className,
   blockRef,
   onRender,
-  onTransitionEnd
+  onTransitionEnd,
+  style
 }) => {
   useEffect(() => {
     onRender && onRender();
   }, [onRender]);
   return /*#__PURE__*/React.createElement("div", {
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop
-    className: ax(["_1reo15vq _18m915vq _4cvr1h6o _1e0c1txw _1ul9idpf _1bah1y6m _fiawglyw _1ouwidpf _f6ju1ns9 _1uzp1mp2 _ytq1bjq5 _a7e8uxlv", "_12ji1snc _1qu2agmp _12y310yn _12ji1kw7 _syaz1kw7 _18ql1j28 _1ifmglyw _181uglyw _1rkwglyw _te17glyw _uiztglyw", directionStyles[direction], gapsStyles[size], className]),
+    className: ax(["_1reo15vq _18m915vq _4cvr1h6o _vwz41j6v _1e0c1txw _1ul9idpf _1bah1y6m _fiawglyw _1ouwidpf _f6ju1ns9 _1uzp1mp2 _ytq1bjq5 _a7e8uxlv", "_12ji1snc _1qu2agmp _12y310yn _12ji1kw7 _syaz1kw7 _18ql1j28 _1ifmglyw _181uglyw _1rkwglyw _te17glyw _uiztglyw", directionStyles[direction], gapsStyles[size], className]),
     "data-smart-block": true,
     "data-testid": testId,
     onTransitionEnd: onTransitionEnd,
     ref: blockRef
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
+    ,
+    style: style
   }, renderChildren(children, size));
 };
-const Exported = props => {
+const Block = props => {
   if (fg('bandicoots-compiled-migration-smartcard')) {
-    return /*#__PURE__*/React.createElement(Block, props);
+    return /*#__PURE__*/React.createElement(BlockNew, props);
   } else {
     return /*#__PURE__*/React.createElement(BlockOld, props);
   }
 };
-export default Exported;
+export default Block;

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

@@ -2,6 +2,7 @@
 import "./index.compiled.css";
 import * as React from 'react';
 import { ax, ix } from "@compiled/react/runtime";
+import { fg } from '@atlaskit/platform-feature-flags';
 import { SmartLinkAlignment, SmartLinkDirection, SmartLinkPosition, SmartLinkSize, SmartLinkWidth } from '../../../../../constants';
 import { renderChildren } from '../utils';
 import ElementGroupOld from './ElementGroupOld';
@@ -74,5 +75,11 @@ const ElementGroupNew = ({
     className: ax([baseStyleBySize[size], baseStyleByDirection[direction], "_fiawglyw _1ouwidpf _f6ju1ns9", alignmentStyleMap[align], "_1ul99by0", widthStyle[width], direction === SmartLinkDirection.Horizontal && "_1reo15vq _18m915vq _1e0c1ule _s7n4nkob _1bto1l2s _1nmz1hna _1yyjkb7n _sudp1e54 _1aaynkob _15tynkob _1iu61nu9 _166k1nu9 _1div1nu9 _bmfb1nu9", direction === SmartLinkDirection.Horizontal && "", SmartLinkAlignment.Left ? gapStylesLeft[size] : gapStylesRight[size], positionStyle[position], className])
   }, renderChildren(children, size));
 };
-export default ElementGroupOld;
-export { ElementGroupNew };
+const ElementGroup = props => {
+  if (fg('bandicoots-compiled-migration-smartcard')) {
+    return /*#__PURE__*/React.createElement(ElementGroupNew, props);
+  } else {
+    return /*#__PURE__*/React.createElement(ElementGroupOld, props);
+  }
+};
+export default ElementGroup;

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

@@ -0,0 +1,46 @@
+import _extends from "@babel/runtime/helpers/extends";
+import React, { useCallback, useMemo } from 'react';
+import { SmartLinkAlignment, SmartLinkDirection, SmartLinkSize, SmartLinkWidth } from '../../../../../../constants';
+import { useFlexibleUiContext } from '../../../../../../state/flexible-ui-context';
+import { Provider } from '../../../elements';
+import ActionGroup from '../../action-group';
+import Block from '../../block';
+import ElementGroup from '../../element-group';
+import { filterActionItems, getActionGroupStyles } from '../../utils';
+const FooterBlockResolvedViewOld = props => {
+  const {
+    actions,
+    testId,
+    onActionMenuOpenChange,
+    size = SmartLinkSize.Medium,
+    hideProvider
+  } = props;
+  const context = useFlexibleUiContext();
+  const hasActions = useMemo(() => {
+    var _filterActionItems;
+    return ((_filterActionItems = filterActionItems(actions, context)) === null || _filterActionItems === void 0 ? void 0 : _filterActionItems.length) > 0;
+  }, [actions, context]);
+  const onDropdownOpenChange = useCallback(isOpen => {
+    if (onActionMenuOpenChange) {
+      onActionMenuOpenChange({
+        isOpen
+      });
+    }
+  }, [onActionMenuOpenChange]);
+  return /*#__PURE__*/React.createElement(Block, _extends({}, props, {
+    testId: `${testId}-resolved-view`
+  }), !hideProvider && /*#__PURE__*/React.createElement(Provider, {
+    testId: `${testId}-provider`
+  }), actions && hasActions ? /*#__PURE__*/React.createElement(ElementGroup, {
+    testId: "smart-element-group-actions",
+    align: SmartLinkAlignment.Right,
+    direction: SmartLinkDirection.Horizontal,
+    overrideCss: getActionGroupStyles(size),
+    width: SmartLinkWidth.Flexible
+  }, /*#__PURE__*/React.createElement(ActionGroup, {
+    onDropdownOpenChange: onDropdownOpenChange,
+    items: actions,
+    appearance: "default"
+  })) : null);
+};
+export default FooterBlockResolvedViewOld;

package/dist/es2019/view/FlexibleCard/components/blocks/footer-block/resolved/index.compiled.css

@@ -0,0 +1 @@
+._c71lviql{max-height:2rem}

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

@@ -1,12 +1,19 @@
+/* index.tsx generated by @compiled/babel-plugin v0.35.0 */
 import _extends from "@babel/runtime/helpers/extends";
-import React, { useCallback, useMemo } from 'react';
+import "./index.compiled.css";
+import * as React from 'react';
+import { ax, ix } from "@compiled/react/runtime";
+import { useCallback, useMemo } from 'react';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { SmartLinkAlignment, SmartLinkDirection, SmartLinkSize, SmartLinkWidth } from '../../../../../../constants';
 import { useFlexibleUiContext } from '../../../../../../state/flexible-ui-context';
 import { Provider } from '../../../elements';
 import ActionGroup from '../../action-group';
 import Block from '../../block';
 import ElementGroup from '../../element-group';
-import { filterActionItems, getActionGroupStyles } from '../../utils';
+import { filterActionItems } from '../../utils';
+import FooterBlockResolvedViewOld from './FooterBlockResolvedViewOld';
+const actionGroupStyles = null;
 const FooterBlockResolvedView = props => {
   const {
     actions,
@@ -35,12 +42,19 @@ const FooterBlockResolvedView = props => {
     testId: "smart-element-group-actions",
     align: SmartLinkAlignment.Right,
     direction: SmartLinkDirection.Horizontal,
-    overrideCss: getActionGroupStyles(size),
-    width: SmartLinkWidth.Flexible
+    width: SmartLinkWidth.Flexible,
+    className: ax([size === SmartLinkSize.XLarge && "_c71lviql"])
   }, /*#__PURE__*/React.createElement(ActionGroup, {
     onDropdownOpenChange: onDropdownOpenChange,
     items: actions,
     appearance: "default"
   })) : null);
 };
-export default FooterBlockResolvedView;
+const FooterBlockResolvedViewExported = props => {
+  if (fg('bandicoots-compiled-migration-smartcard')) {
+    return /*#__PURE__*/React.createElement(FooterBlockResolvedView, props);
+  } else {
+    return /*#__PURE__*/React.createElement(FooterBlockResolvedViewOld, props);
+  }
+};
+export default FooterBlockResolvedViewExported;

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

@@ -6,7 +6,7 @@ import { ax, ix } from "@compiled/react/runtime";
 import { fg } from '@atlaskit/platform-feature-flags';
 import { SmartLinkAlignment, SmartLinkDirection, SmartLinkSize, SmartLinkStatus, SmartLinkWidth } from '../../../../../constants';
 import Block from '../block';
-import { ElementGroupNew as ElementGroup } from '../element-group';
+import ElementGroup from '../element-group';
 import { renderElementItems } from '../utils';
 import MetadataBlockOld from './MetadataBlockOld';
 const DEFAULT_MAX_LINES = 2;

package/dist/es2019/view/FlexibleCard/components/blocks/preview-block/resolved/index.compiled.css

@@ -1,15 +1,9 @@
 ._10aa1osq [data-smart-element-media=image]{width:100%}
-._154iidpf{top:0}
 ._18u01ivi{margin-left:calc(var(--container-gap-left)*-1)}
-._1bsb795p{width:calc(var(--preview-block-width))}
-._1ltvidpf{left:0}
 ._1t26n7od [data-smart-element-media=image]{aspect-ratio:unset}
-._1xi2idpf{right:0}
 ._2hwxc10g{margin-right:calc(var(--container-gap-right)*-1)}
-._94n5idpf{bottom:0}
 ._dmhj1ya9:last-of-type{margin-bottom:calc(var(--container-padding)*-1)}
 ._e0oi1ya9:first-of-type{margin-top:calc(var(--container-padding)*-1)}
-._kqswstnw{position:absolute}
 ._mr051dfr [data-smart-element-media=image]{object-fit:cover}
 ._rjuj1osq [data-smart-element-media=image]{height:100%}
 ._ze72n7od [data-smart-element-media=image]{padding-top:unset}