@atlaskit/smart-card 36.11.1 → 36.12.0

package/CHANGELOG.md

@@ -1,5 +1,18 @@
 # @atlaskit/smart-card
 
+## 36.12.0
+
+### Minor Changes
+
+- [#147420](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/147420)
+  [`b01d0803eef3f`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/b01d0803eef3f) -
+  [ux] Behind fg `platform-smart-card-remove-legacy-button` - deprecates legacy Button component in
+  favour of new Button component for EmbedCard, EmbedModal, HoverCard & AutomationModal
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 36.11.1
 
 ### Patch Changes

package/dist/cjs/utils/analytics/analytics.js

@@ -11,7 +11,7 @@ var ANALYTICS_CHANNEL = exports.ANALYTICS_CHANNEL = 'media';
 var context = exports.context = {
   componentName: 'smart-cards',
   packageName: "@atlaskit/smart-card",
-  packageVersion: "36.11.1"
+  packageVersion: "36.12.0"
 };
 var TrackQuickActionType = exports.TrackQuickActionType = /*#__PURE__*/function (TrackQuickActionType) {
   TrackQuickActionType["StatusUpdate"] = "StatusUpdate";

package/dist/cjs/view/EmbedCard/views/ErroredView.js

@@ -12,7 +12,9 @@ var React = _interopRequireWildcard(require("react"));
 var _runtime = require("@compiled/react/runtime");
 var _reactIntlNext = require("react-intl-next");
 var _button = _interopRequireDefault(require("@atlaskit/button"));
+var _new = _interopRequireDefault(require("@atlaskit/button/new"));
 var _error = _interopRequireDefault(require("@atlaskit/icon/core/migration/error"));
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _compiled = require("@atlaskit/primitives/compiled");
 var _colors = require("@atlaskit/theme/colors");
 var _messages = require("../../../messages");
@@ -40,7 +42,11 @@ var EmbedCardErroredView = exports.EmbedCardErroredView = function EmbedCardErro
     label: "error-icon"
   }), /*#__PURE__*/React.createElement(_compiled.Box, {
     xcss: styles.boxStyles
-  }, /*#__PURE__*/React.createElement(_compiled.Inline, null, /*#__PURE__*/React.createElement(_reactIntlNext.FormattedMessage, _messages.messages.could_not_load_link))), /*#__PURE__*/React.createElement(_button.default, {
+  }, /*#__PURE__*/React.createElement(_compiled.Inline, null, /*#__PURE__*/React.createElement(_reactIntlNext.FormattedMessage, _messages.messages.could_not_load_link))), (0, _platformFeatureFlags.fg)('platform-smart-card-remove-legacy-button') ? /*#__PURE__*/React.createElement(_new.default, {
+    testId: "err-view-retry",
+    spacing: "compact",
+    onClick: onRetry
+  }, /*#__PURE__*/React.createElement(_reactIntlNext.FormattedMessage, _messages.messages.try_again)) : /*#__PURE__*/React.createElement(_button.default, {
     testId: "err-view-retry",
     appearance: "link",
     spacing: "none",

package/dist/cjs/view/EmbedCard/views/forbidden-view/index.js

@@ -11,6 +11,8 @@ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/h
 var _react = _interopRequireWildcard(require("react"));
 var _reactIntlNext = require("react-intl-next");
 var _button = _interopRequireDefault(require("@atlaskit/button"));
+var _new = _interopRequireDefault(require("@atlaskit/button/new"));
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _messages = require("../../../../messages");
 var _intlUtils = require("../../../../utils/intl-utils");
 var _unresolvedView = _interopRequireDefault(require("../unresolved-view"));
@@ -58,7 +60,8 @@ var ForbiddenView = function ForbiddenView(_ref) {
     if (!onEmbedCardClick) {
       return null;
     }
-    return /*#__PURE__*/_react.default.createElement(_button.default, {
+    var ButtonComponent = (0, _platformFeatureFlags.fg)('platform-smart-card-remove-legacy-button') ? _new.default : _button.default;
+    return /*#__PURE__*/_react.default.createElement(ButtonComponent, {
       testId: "button-".concat((action === null || action === void 0 ? void 0 : action.id) || 'connect-other-account'),
       appearance: "primary",
       onClick: onEmbedCardClick,

package/dist/cjs/view/EmbedCard/views/unauthorized-view/index.js

@@ -11,6 +11,8 @@ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/h
 var _react = _interopRequireWildcard(require("react"));
 var _reactIntlNext = require("react-intl-next");
 var _button = _interopRequireDefault(require("@atlaskit/button"));
+var _new = _interopRequireDefault(require("@atlaskit/button/new"));
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _useAnalyticsEvents2 = require("../../../../common/analytics/generated/use-analytics-events");
 var _messages = require("../../../../messages");
 var _UnauthorisedViewContent = _interopRequireDefault(require("../../../common/UnauthorisedViewContent"));
@@ -37,6 +39,7 @@ var UnauthorizedView = function UnauthorizedView(_ref) {
     }
   }, [onAuthorize, fireEvent]);
   var content = (0, _react.useMemo)(function () {
+    var ButtonComponent = (0, _platformFeatureFlags.fg)('platform-smart-card-remove-legacy-button') ? _new.default : _button.default;
     if (onAuthorize) {
       var _context$text;
       // Our title and button messages always expect the product name to be present
@@ -57,7 +60,7 @@ var UnauthorizedView = function UnauthorizedView(_ref) {
             isProductIntegrationSupported: isProductIntegrationSupported,
             testId: testId
           }),
-          button: /*#__PURE__*/_react.default.createElement(_button.default, {
+          button: /*#__PURE__*/_react.default.createElement(ButtonComponent, {
             testId: "connect-account",
             appearance: "primary",
             onClick: handleOnAuthorizeClick

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

@@ -25,6 +25,7 @@ var _messages = require("../../../../messages");
 var _Icon = require("../../../common/Icon");
 var _constants = require("../../constants");
 var _linkInfoButton = _interopRequireDefault(require("./link-info-button"));
+var _old = _interopRequireDefault(require("./link-info-button/old"));
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 var containerStylesOld = null;
@@ -51,7 +52,20 @@ var LinkInfo = function LinkInfo(_ref) {
     onClose = _useModal.onClose;
   var downloadButton = (0, _react.useMemo)(function () {
     if (onDownloadButtonClick) {
-      return /*#__PURE__*/_react.default.createElement(_linkInfoButton.default, {
+      return (0, _platformFeatureFlags.fg)('platform-smart-card-remove-legacy-button') ? /*#__PURE__*/_react.default.createElement(_linkInfoButton.default, {
+        content: /*#__PURE__*/_react.default.createElement(_reactIntlNext.FormattedMessage, _messages.messages.download),
+        icon: function icon() {
+          return /*#__PURE__*/_react.default.createElement(_download.default, {
+            label: _messages.messages.download.defaultMessage,
+            LEGACY_fallbackIcon: _download2.default,
+            spacing: "spacious",
+            color: "currentColor"
+          });
+        },
+        label: _messages.messages.download,
+        onClick: onDownloadButtonClick,
+        testId: "".concat(testId, "-download")
+      }) : /*#__PURE__*/_react.default.createElement(_old.default, {
         content: /*#__PURE__*/_react.default.createElement(_reactIntlNext.FormattedMessage, _messages.messages.download),
         icon: /*#__PURE__*/_react.default.createElement(_download.default, {
           label: _messages.messages.download.defaultMessage,
@@ -67,7 +81,19 @@ var LinkInfo = function LinkInfo(_ref) {
   var urlButton = (0, _react.useMemo)(function () {
     if (onViewButtonClick) {
       var content = providerName ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_reactIntlNext.FormattedMessage, _messages.messages.viewIn), " ", providerName) : /*#__PURE__*/_react.default.createElement(_reactIntlNext.FormattedMessage, _messages.messages.viewOriginal);
-      return /*#__PURE__*/_react.default.createElement(_linkInfoButton.default, {
+      return (0, _platformFeatureFlags.fg)('platform-smart-card-remove-legacy-button') ? /*#__PURE__*/_react.default.createElement(_linkInfoButton.default, {
+        content: content,
+        icon: function icon() {
+          return /*#__PURE__*/_react.default.createElement(_linkExternalShortcut.default, {
+            label: _messages.messages.viewOriginal.defaultMessage,
+            spacing: "spacious",
+            color: "currentColor"
+          });
+        },
+        label: _messages.messages.viewOriginal,
+        onClick: onViewButtonClick,
+        testId: "".concat(testId, "-url")
+      }) : /*#__PURE__*/_react.default.createElement(_old.default, {
         content: content,
         icon: /*#__PURE__*/_react.default.createElement(_linkExternalShortcut.default, {
           label: _messages.messages.viewOriginal.defaultMessage,
@@ -82,7 +108,7 @@ var LinkInfo = function LinkInfo(_ref) {
   var sizeButton = (0, _react.useMemo)(function () {
     var isFullScreen = size === _constants.MAX_MODAL_SIZE;
     var message = isFullScreen ? _messages.messages.preview_min_size : _messages.messages.preview_max_size;
-    var icon = isFullScreen ? /*#__PURE__*/_react.default.createElement(_fullscreenExit.default, {
+    var _icon = isFullScreen ? /*#__PURE__*/_react.default.createElement(_fullscreenExit.default, {
       LEGACY_fallbackIcon: _vidFullScreenOff.default,
       label: message.defaultMessage,
       spacing: "spacious",
@@ -97,9 +123,17 @@ var LinkInfo = function LinkInfo(_ref) {
       // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
       _react.default.createElement("span", {
         className: "smart-link-resize-button"
-      }, /*#__PURE__*/_react.default.createElement(_linkInfoButton.default, {
+      }, (0, _platformFeatureFlags.fg)('platform-smart-card-remove-legacy-button') ? /*#__PURE__*/_react.default.createElement(_linkInfoButton.default, {
         content: /*#__PURE__*/_react.default.createElement(_reactIntlNext.FormattedMessage, message),
-        icon: icon,
+        icon: function icon() {
+          return _icon;
+        },
+        label: message,
+        onClick: onResizeButtonClick,
+        testId: "".concat(testId, "-resize")
+      }) : /*#__PURE__*/_react.default.createElement(_old.default, {
+        content: /*#__PURE__*/_react.default.createElement(_reactIntlNext.FormattedMessage, message),
+        icon: _icon,
         onClick: onResizeButtonClick,
         testId: "".concat(testId, "-resize")
       }))
@@ -120,7 +154,19 @@ var LinkInfo = function LinkInfo(_ref) {
     tabIndex: 0
   })), /*#__PURE__*/_react.default.createElement("div", {
     className: (0, _runtime.ax)(["_16jlidpf _1o9zidpf _i0dl1wug _zulp1b66 _1e0c1txw _3kllglyw"])
-  }, downloadButton, urlButton, sizeButton, /*#__PURE__*/_react.default.createElement(_linkInfoButton.default, {
+  }, downloadButton, urlButton, sizeButton, (0, _platformFeatureFlags.fg)('platform-smart-card-remove-legacy-button') ? /*#__PURE__*/_react.default.createElement(_linkInfoButton.default, {
+    content: /*#__PURE__*/_react.default.createElement(_reactIntlNext.FormattedMessage, _messages.messages.preview_close),
+    icon: function icon() {
+      return /*#__PURE__*/_react.default.createElement(_closeCross.default, {
+        label: _messages.messages.preview_close.defaultMessage,
+        color: "currentColor",
+        spacing: "spacious"
+      });
+    },
+    label: _messages.messages.preview_close,
+    onClick: onClose,
+    testId: "".concat(testId, "-close")
+  }) : /*#__PURE__*/_react.default.createElement(_old.default, {
     content: /*#__PURE__*/_react.default.createElement(_reactIntlNext.FormattedMessage, _messages.messages.preview_close),
     icon: /*#__PURE__*/_react.default.createElement(_closeCross.default, {
       label: _messages.messages.preview_close.defaultMessage,

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

@@ -6,30 +6,30 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
-var _button = _interopRequireDefault(require("@atlaskit/button"));
+var _reactIntlNext = require("react-intl-next");
+var _new = require("@atlaskit/button/new");
 var _tooltip = _interopRequireDefault(require("@atlaskit/tooltip"));
 var _useLinkClicked = require("../../../../../state/analytics/useLinkClicked");
 var LinkInfoButton = function LinkInfoButton(_ref) {
   var content = _ref.content,
-    href = _ref.href,
     icon = _ref.icon,
+    label = _ref.label,
     onClick = _ref.onClick,
-    target = _ref.target,
     testId = _ref.testId;
   var onMouseDown = (0, _useLinkClicked.useMouseDownEvent)();
+  var _useIntl = (0, _reactIntlNext.useIntl)(),
+    formatMessage = _useIntl.formatMessage;
   return /*#__PURE__*/_react.default.createElement(_tooltip.default, {
     content: content,
     hideTooltipOnClick: true,
     tag: "span",
     testId: "".concat(testId, "-tooltip")
-  }, /*#__PURE__*/_react.default.createElement(_button.default, {
+  }, /*#__PURE__*/_react.default.createElement(_new.IconButton, {
     appearance: "subtle",
-    href: href,
-    iconBefore: icon,
+    icon: icon,
+    label: formatMessage(label),
     onClick: onClick,
     onMouseDown: onMouseDown,
-    spacing: "none",
-    target: target,
     testId: "".concat(testId, "-button")
   }));
 };

package/dist/cjs/view/EmbedModal/components/link-info/link-info-button/old.js

@@ -0,0 +1,40 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _button = _interopRequireDefault(require("@atlaskit/button"));
+var _tooltip = _interopRequireDefault(require("@atlaskit/tooltip"));
+var _useLinkClicked = require("../../../../../state/analytics/useLinkClicked");
+/**
+ * @private
+ * @deprecated Remove when cleaning up fg `platform-smart-card-remove-legacy-button` - EDM-12433
+ */
+var LinkInfoButton = function LinkInfoButton(_ref) {
+  var content = _ref.content,
+    href = _ref.href,
+    icon = _ref.icon,
+    onClick = _ref.onClick,
+    target = _ref.target,
+    testId = _ref.testId;
+  var onMouseDown = (0, _useLinkClicked.useMouseDownEvent)();
+  return /*#__PURE__*/_react.default.createElement(_tooltip.default, {
+    content: content,
+    hideTooltipOnClick: true,
+    tag: "span",
+    testId: "".concat(testId, "-tooltip")
+  }, /*#__PURE__*/_react.default.createElement(_button.default, {
+    appearance: "subtle",
+    href: href,
+    iconBefore: icon,
+    onClick: onClick,
+    onMouseDown: onMouseDown,
+    spacing: "none",
+    target: target,
+    testId: "".concat(testId, "-button")
+  }));
+};
+var _default = exports.default = LinkInfoButton;

package/dist/cjs/view/EmbedModal/components/link-info/link-info-button/types.js

@@ -1 +1,5 @@
-"use strict";
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

package/dist/cjs/view/FlexibleCard/components/actions/automation-action/automation-manual-triggers/manual-triggers-modal/sub-components/empty-state/main.js

@@ -13,6 +13,8 @@ var _runtime = require("@compiled/react/runtime");
 var _reactIntlNext = require("react-intl-next");
 var _analyticsNext = require("@atlaskit/analytics-next");
 var _button = _interopRequireDefault(require("@atlaskit/button"));
+var _link = _interopRequireDefault(require("@atlaskit/link"));
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _compiled = require("@atlaskit/primitives/compiled");
 var _menuContext = require("../../menu-context");
 var _emptyIcon = _interopRequireDefault(require("./empty-icon"));
@@ -69,7 +71,21 @@ var AutomationModalEmptyState = exports.AutomationModalEmptyState = function Aut
     alt: formatMessage(i18n.emptyAutomationListImageAlt)
   })), /*#__PURE__*/React.createElement(_compiled.Box, {
     xcss: styles.description
-  }, displayedEmptyStateDesc, canManageAutomation && /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(_button.default, {
+  }, displayedEmptyStateDesc, canManageAutomation && /*#__PURE__*/React.createElement("div", null, (0, _platformFeatureFlags.fg)('platform-smart-card-remove-legacy-button') ? /*#__PURE__*/React.createElement(_link.default, {
+    href: "https://www.atlassian.com/platform/automation",
+    target: "_blank",
+    onClick: function onClick() {
+      createAnalyticsEvent({
+        type: 'sendUIEvent',
+        data: {
+          action: 'clicked',
+          actionSubject: 'link',
+          actionSubjectId: 'learnMore',
+          source: analyticsSource
+        }
+      }).fire();
+    }
+  }, /*#__PURE__*/React.createElement(_reactIntlNext.FormattedMessage, i18n.learnMoreLink)) : /*#__PURE__*/React.createElement(_button.default, {
     appearance: "link",
     spacing: "none",
     href: "https://www.atlassian.com/platform/automation",

package/dist/cjs/view/FlexibleCard/components/actions/automation-action/automation-manual-triggers/manual-triggers-modal/sub-components/footer/main.js

@@ -1,6 +1,7 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -9,7 +10,11 @@ var _react = _interopRequireDefault(require("react"));
 var _reactIntlNext = require("react-intl-next");
 var _analyticsNext = require("@atlaskit/analytics-next");
 var _button = _interopRequireDefault(require("@atlaskit/button"));
+var _new = _interopRequireWildcard(require("@atlaskit/button/new"));
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _menuContext = require("../../menu-context");
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 var i18n = (0, _reactIntlNext.defineMessages)({
   modalFooterCancelButton: {
     id: 'automation-menu.modal.footer.cancel-button',
@@ -64,7 +69,8 @@ var AutomationModalFooter = exports.AutomationModalFooter = function AutomationM
     }
     event.fire();
   };
-  var okButton = /*#__PURE__*/_react.default.createElement(_button.default, {
+  var ButtonComponent = (0, _platformFeatureFlags.fg)('platform-smart-card-remove-legacy-button') ? _new.default : _button.default;
+  var okButton = /*#__PURE__*/_react.default.createElement(ButtonComponent, {
     key: "automation-modal-footer-ok",
     appearance: "primary",
     onClick: function onClick() {
@@ -72,7 +78,7 @@ var AutomationModalFooter = exports.AutomationModalFooter = function AutomationM
       onClose();
     }
   }, /*#__PURE__*/_react.default.createElement(_reactIntlNext.FormattedMessage, i18n.modalFooterOkButton));
-  var cancelButton = /*#__PURE__*/_react.default.createElement(_button.default, {
+  var cancelButton = /*#__PURE__*/_react.default.createElement(ButtonComponent, {
     key: "automation-modal-footer-cancel",
     appearance: "subtle",
     onClick: function onClick() {
@@ -80,7 +86,15 @@ var AutomationModalFooter = exports.AutomationModalFooter = function AutomationM
       onClose();
     }
   }, /*#__PURE__*/_react.default.createElement(_reactIntlNext.FormattedMessage, i18n.modalFooterCancelButton));
-  var createAutomationButton = /*#__PURE__*/_react.default.createElement(_button.default, {
+  var createAutomationButton = (0, _platformFeatureFlags.fg)('platform-smart-card-remove-legacy-button') ? /*#__PURE__*/_react.default.createElement(_new.LinkButton, {
+    key: "automation-modal-footer-create-automation",
+    appearance: "primary",
+    href: "".concat(baseAutomationUrl, "#rule/new"),
+    onClick: function onClick() {
+      sendFooterAnalyticsEvent('createAutomation');
+    },
+    target: "_blank"
+  }, /*#__PURE__*/_react.default.createElement(_reactIntlNext.FormattedMessage, i18n.modalFooterCreateAutomationButton)) : /*#__PURE__*/_react.default.createElement(_button.default, {
     key: "automation-modal-footer-create-automation",
     appearance: "primary",
     href: "".concat(baseAutomationUrl, "#rule/new"),
@@ -89,7 +103,7 @@ var AutomationModalFooter = exports.AutomationModalFooter = function AutomationM
     },
     target: "_blank"
   }, /*#__PURE__*/_react.default.createElement(_reactIntlNext.FormattedMessage, i18n.modalFooterCreateAutomationButton));
-  var automateButton = /*#__PURE__*/_react.default.createElement(_button.default, {
+  var automateButton = /*#__PURE__*/_react.default.createElement(ButtonComponent, {
     key: "automation-modal-footer-automate",
     appearance: "primary",
     onClick: function onClick() {

package/dist/cjs/view/HoverCard/components/views/forbidden/index.js

@@ -14,6 +14,7 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
 var _reactIntlNext = require("react-intl-next");
 var _analyticsNext = require("@atlaskit/analytics-next");
 var _button = _interopRequireDefault(require("@atlaskit/button"));
+var _new = _interopRequireDefault(require("@atlaskit/button/new"));
 var _linkExtractors = require("@atlaskit/link-extractors");
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _constants = require("../../../../../constants");
@@ -58,6 +59,7 @@ var HoverCardForbiddenView = function HoverCardForbiddenView(_ref) {
   if (!titleMessageKey || !descriptiveMessageKey) {
     return null;
   }
+  var ButtonComponent = (0, _platformFeatureFlags.fg)('platform-smart-card-remove-legacy-button') ? _new.default : _button.default;
   return /*#__PURE__*/React.createElement(_FlexibleCard.default, (0, _extends2.default)({}, flexibleCardProps, {
     testId: testId
   }), /*#__PURE__*/React.createElement(_blocks.PreviewBlock, {
@@ -85,7 +87,7 @@ var HoverCardForbiddenView = function HoverCardForbiddenView(_ref) {
   }))), action && /*#__PURE__*/React.createElement(_blocks.CustomBlock, {
     status: _constants.SmartLinkStatus.Forbidden,
     className: (0, _runtime.ax)([(0, _platformFeatureFlags.fg)('platform-linking-visual-refresh-v1') ? "_1bah1h6o _19pku2gc" : "_1bah1h6o _19pku2gc"])
-  }, /*#__PURE__*/React.createElement(_button.default, {
+  }, /*#__PURE__*/React.createElement(ButtonComponent, {
     testId: "".concat(testId, "-button"),
     onClick: action === null || action === void 0 ? void 0 : action.promise,
     appearance: "primary",

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

@@ -118,7 +118,7 @@ var IconAndTitleLayout = exports.IconAndTitleLayout = function IconAndTitleLayou
       });
     }
     var removedProps = !(0, _platformFeatureFlags.fg)('platform-linking-visual-refresh-v2') ? {
-      className: "smart-link-icon"
+      className: 'smart-link-icon'
     } : {};
     return /*#__PURE__*/_react.default.createElement(_reactRenderImage.default, {
       src: icon,

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

@@ -20,7 +20,7 @@ var _excluded = ["href", "children", "checkSafety", "onClick", "testId", "isLink
   _excluded2 = ["isLinkSafe", "showSafetyWarningModal"];
 var PACKAGE_DATA = {
   packageName: "@atlaskit/smart-card",
-  packageVersion: "36.11.1",
+  packageVersion: "36.12.0",
   componentName: 'linkUrl'
 };
 var Anchor = (0, _click.withLinkClickedEvent)('a');

package/dist/es2019/utils/analytics/analytics.js

@@ -2,7 +2,7 @@ export const ANALYTICS_CHANNEL = 'media';
 export const context = {
   componentName: 'smart-cards',
   packageName: "@atlaskit/smart-card",
-  packageVersion: "36.11.1"
+  packageVersion: "36.12.0"
 };
 export let TrackQuickActionType = /*#__PURE__*/function (TrackQuickActionType) {
   TrackQuickActionType["StatusUpdate"] = "StatusUpdate";

package/dist/es2019/view/EmbedCard/views/ErroredView.js

@@ -3,8 +3,10 @@ import "./ErroredView.compiled.css";
 import * as React from 'react';
 import { ax, ix } from "@compiled/react/runtime";
 import { FormattedMessage } from 'react-intl-next';
-import Button from '@atlaskit/button';
+import ButtonOld from '@atlaskit/button';
+import Button from '@atlaskit/button/new';
 import ErrorIcon from '@atlaskit/icon/core/migration/error';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { Box, Inline } from '@atlaskit/primitives/compiled';
 import { R300 } from '@atlaskit/theme/colors';
 import { messages } from '../../../messages';
@@ -28,7 +30,11 @@ export const EmbedCardErroredView = ({
   label: "error-icon"
 }), /*#__PURE__*/React.createElement(Box, {
   xcss: styles.boxStyles
-}, /*#__PURE__*/React.createElement(Inline, null, /*#__PURE__*/React.createElement(FormattedMessage, messages.could_not_load_link))), /*#__PURE__*/React.createElement(Button, {
+}, /*#__PURE__*/React.createElement(Inline, null, /*#__PURE__*/React.createElement(FormattedMessage, messages.could_not_load_link))), fg('platform-smart-card-remove-legacy-button') ? /*#__PURE__*/React.createElement(Button, {
+  testId: "err-view-retry",
+  spacing: "compact",
+  onClick: onRetry
+}, /*#__PURE__*/React.createElement(FormattedMessage, messages.try_again)) : /*#__PURE__*/React.createElement(ButtonOld, {
   testId: "err-view-retry",
   appearance: "link",
   spacing: "none",

package/dist/es2019/view/EmbedCard/views/forbidden-view/index.js

@@ -1,7 +1,9 @@
 import _extends from "@babel/runtime/helpers/extends";
 import React, { useMemo } from 'react';
 import { FormattedMessage } from 'react-intl-next';
-import Button from '@atlaskit/button';
+import ButtonOld from '@atlaskit/button';
+import Button from '@atlaskit/button/new';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { messages } from '../../../../messages';
 import { toMessage } from '../../../../utils/intl-utils';
 import UnresolvedView from '../unresolved-view';
@@ -47,7 +49,8 @@ const ForbiddenView = ({
     if (!onEmbedCardClick) {
       return null;
     }
-    return /*#__PURE__*/React.createElement(Button, {
+    const ButtonComponent = fg('platform-smart-card-remove-legacy-button') ? Button : ButtonOld;
+    return /*#__PURE__*/React.createElement(ButtonComponent, {
       testId: `button-${(action === null || action === void 0 ? void 0 : action.id) || 'connect-other-account'}`,
       appearance: "primary",
       onClick: onEmbedCardClick,

package/dist/es2019/view/EmbedCard/views/unauthorized-view/index.js

@@ -1,7 +1,9 @@
 import _extends from "@babel/runtime/helpers/extends";
 import React, { useCallback, useMemo } from 'react';
 import { FormattedMessage } from 'react-intl-next';
-import Button from '@atlaskit/button';
+import ButtonOld from '@atlaskit/button';
+import Button from '@atlaskit/button/new';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { useAnalyticsEvents } from '../../../../common/analytics/generated/use-analytics-events';
 import { messages } from '../../../../messages';
 import UnauthorisedViewContent from '../../../common/UnauthorisedViewContent';
@@ -26,6 +28,7 @@ const UnauthorizedView = ({
     }
   }, [onAuthorize, fireEvent]);
   const content = useMemo(() => {
+    const ButtonComponent = fg('platform-smart-card-remove-legacy-button') ? Button : ButtonOld;
     if (onAuthorize) {
       var _context$text;
       // Our title and button messages always expect the product name to be present
@@ -46,7 +49,7 @@ const UnauthorizedView = ({
             isProductIntegrationSupported: isProductIntegrationSupported,
             testId: testId
           }),
-          button: /*#__PURE__*/React.createElement(Button, {
+          button: /*#__PURE__*/React.createElement(ButtonComponent, {
             testId: "connect-account",
             appearance: "primary",
             onClick: handleOnAuthorizeClick

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

@@ -17,6 +17,7 @@ import { messages } from '../../../../messages';
 import { Icon } from '../../../common/Icon';
 import { MAX_MODAL_SIZE } from '../../constants';
 import LinkInfoButton from './link-info-button';
+import LinkInfoButtonOld from './link-info-button/old';
 const containerStylesOld = null;
 const containerStyles = null;
 const iconSize = '24px';
@@ -43,7 +44,18 @@ const LinkInfo = ({
   } = useModal();
   const downloadButton = useMemo(() => {
     if (onDownloadButtonClick) {
-      return /*#__PURE__*/React.createElement(LinkInfoButton, {
+      return fg('platform-smart-card-remove-legacy-button') ? /*#__PURE__*/React.createElement(LinkInfoButton, {
+        content: /*#__PURE__*/React.createElement(FormattedMessage, messages.download),
+        icon: () => /*#__PURE__*/React.createElement(DownloadIcon, {
+          label: messages.download.defaultMessage,
+          LEGACY_fallbackIcon: DownloadIconLegacy,
+          spacing: "spacious",
+          color: "currentColor"
+        }),
+        label: messages.download,
+        onClick: onDownloadButtonClick,
+        testId: `${testId}-download`
+      }) : /*#__PURE__*/React.createElement(LinkInfoButtonOld, {
         content: /*#__PURE__*/React.createElement(FormattedMessage, messages.download),
         icon: /*#__PURE__*/React.createElement(DownloadIcon, {
           label: messages.download.defaultMessage,
@@ -59,7 +71,17 @@ const LinkInfo = ({
   const urlButton = useMemo(() => {
     if (onViewButtonClick) {
       const content = providerName ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(FormattedMessage, messages.viewIn), " ", providerName) : /*#__PURE__*/React.createElement(FormattedMessage, messages.viewOriginal);
-      return /*#__PURE__*/React.createElement(LinkInfoButton, {
+      return fg('platform-smart-card-remove-legacy-button') ? /*#__PURE__*/React.createElement(LinkInfoButton, {
+        content: content,
+        icon: () => /*#__PURE__*/React.createElement(ShortcutIcon, {
+          label: messages.viewOriginal.defaultMessage,
+          spacing: "spacious",
+          color: "currentColor"
+        }),
+        label: messages.viewOriginal,
+        onClick: onViewButtonClick,
+        testId: `${testId}-url`
+      }) : /*#__PURE__*/React.createElement(LinkInfoButtonOld, {
         content: content,
         icon: /*#__PURE__*/React.createElement(ShortcutIcon, {
           label: messages.viewOriginal.defaultMessage,
@@ -89,7 +111,13 @@ const LinkInfo = ({
       // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
       React.createElement("span", {
         className: "smart-link-resize-button"
-      }, /*#__PURE__*/React.createElement(LinkInfoButton, {
+      }, fg('platform-smart-card-remove-legacy-button') ? /*#__PURE__*/React.createElement(LinkInfoButton, {
+        content: /*#__PURE__*/React.createElement(FormattedMessage, message),
+        icon: () => icon,
+        label: message,
+        onClick: onResizeButtonClick,
+        testId: `${testId}-resize`
+      }) : /*#__PURE__*/React.createElement(LinkInfoButtonOld, {
         content: /*#__PURE__*/React.createElement(FormattedMessage, message),
         icon: icon,
         onClick: onResizeButtonClick,
@@ -112,7 +140,17 @@ const LinkInfo = ({
     tabIndex: 0
   })), /*#__PURE__*/React.createElement("div", {
     className: ax(["_16jlidpf _1o9zidpf _i0dl1wug _zulp1b66 _1e0c1txw _3kllglyw"])
-  }, downloadButton, urlButton, sizeButton, /*#__PURE__*/React.createElement(LinkInfoButton, {
+  }, downloadButton, urlButton, sizeButton, fg('platform-smart-card-remove-legacy-button') ? /*#__PURE__*/React.createElement(LinkInfoButton, {
+    content: /*#__PURE__*/React.createElement(FormattedMessage, messages.preview_close),
+    icon: () => /*#__PURE__*/React.createElement(CrossIcon, {
+      label: messages.preview_close.defaultMessage,
+      color: "currentColor",
+      spacing: "spacious"
+    }),
+    label: messages.preview_close,
+    onClick: onClose,
+    testId: `${testId}-close`
+  }) : /*#__PURE__*/React.createElement(LinkInfoButtonOld, {
     content: /*#__PURE__*/React.createElement(FormattedMessage, messages.preview_close),
     icon: /*#__PURE__*/React.createElement(CrossIcon, {
       label: messages.preview_close.defaultMessage,

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

@@ -1,29 +1,30 @@
 import React from 'react';
-import Button from '@atlaskit/button';
+import { useIntl } from 'react-intl-next';
+import { IconButton } from '@atlaskit/button/new';
 import Tooltip from '@atlaskit/tooltip';
 import { useMouseDownEvent } from '../../../../../state/analytics/useLinkClicked';
 const LinkInfoButton = ({
   content,
-  href,
   icon,
+  label,
   onClick,
-  target,
   testId
 }) => {
   const onMouseDown = useMouseDownEvent();
+  const {
+    formatMessage
+  } = useIntl();
   return /*#__PURE__*/React.createElement(Tooltip, {
     content: content,
     hideTooltipOnClick: true,
     tag: "span",
     testId: `${testId}-tooltip`
-  }, /*#__PURE__*/React.createElement(Button, {
+  }, /*#__PURE__*/React.createElement(IconButton, {
     appearance: "subtle",
-    href: href,
-    iconBefore: icon,
+    icon: icon,
+    label: formatMessage(label),
     onClick: onClick,
     onMouseDown: onMouseDown,
-    spacing: "none",
-    target: target,
     testId: `${testId}-button`
   }));
 };