@atlaskit/smart-card 34.3.0 → 34.4.0

package/dist/cjs/view/FlexibleCard/components/common/atlaskit-icon/index.js

@@ -12,13 +12,15 @@ var _reactLoadable = _interopRequireDefault(require("react-loadable"));
 var _ = _interopRequireDefault(require("@atlaskit/icon-file-type/glyph/document/16"));
 var _2 = _interopRequireDefault(require("@atlaskit/icon-object/glyph/blog/16"));
 var _logo = require("@atlaskit/logo");
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _colors = require("@atlaskit/theme/colors");
 var _constants = require("../../../../../constants");
-var _importIconMapper;
+var _utils = require("../../../../../utils");
+var _importIconMapperOld;
 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" != (0, _typeof2.default)(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; }
 // prettier-ignore
-var importIconMapper = (_importIconMapper = {}, (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)(_importIconMapper, _constants.IconType.Archive, function () {
+var importIconMapperOld = (_importIconMapperOld = {}, (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)(_importIconMapperOld, _constants.IconType.Archive, function () {
   return Promise.resolve().then(function () {
     return _interopRequireWildcard(require( /* webpackChunkName: "glyphArchive" */'@atlaskit/icon-file-type/glyph/archive/16'));
   });
@@ -58,7 +60,7 @@ var importIconMapper = (_importIconMapper = {}, (0, _defineProperty2.default)((0
   return Promise.resolve().then(function () {
     return _interopRequireWildcard(require( /* webpackChunkName: "glyphGoogleForms" */'@atlaskit/icon-file-type/glyph/google-form/16'));
   });
-}), (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)(_importIconMapper, _constants.IconType.GoogleSheets, function () {
+}), (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)(_importIconMapperOld, _constants.IconType.GoogleSheets, function () {
   return Promise.resolve().then(function () {
     return _interopRequireWildcard(require( /* webpackChunkName: "glyphGoogleSheets" */'@atlaskit/icon-file-type/glyph/google-sheet/16'));
   });
@@ -98,7 +100,7 @@ var importIconMapper = (_importIconMapper = {}, (0, _defineProperty2.default)((0
   return Promise.resolve().then(function () {
     return _interopRequireWildcard(require( /* webpackChunkName: "glyphSpreadsheet" */'@atlaskit/icon-file-type/glyph/spreadsheet/16'));
   });
-}), (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)(_importIconMapper, _constants.IconType.Template, function () {
+}), (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)(_importIconMapperOld, _constants.IconType.Template, function () {
   return Promise.resolve().then(function () {
     return _interopRequireWildcard(require( /* webpackChunkName: "glyphTemplate" */'@atlaskit/icon/glyph/document-filled'));
   });
@@ -138,7 +140,7 @@ var importIconMapper = (_importIconMapper = {}, (0, _defineProperty2.default)((0
   return Promise.resolve().then(function () {
     return _interopRequireWildcard(require( /* webpackChunkName: "glyphEpic" */'@atlaskit/icon-object/glyph/epic/16'));
   });
-}), (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)(_importIconMapper, _constants.IconType.Incident, function () {
+}), (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)(_importIconMapperOld, _constants.IconType.Incident, function () {
   return Promise.resolve().then(function () {
     return _interopRequireWildcard(require( /* webpackChunkName: "glyphIncident" */'@atlaskit/icon-object/glyph/incident/16'));
   });
@@ -188,7 +190,7 @@ var importIconMapper = (_importIconMapper = {}, (0, _defineProperty2.default)((0
   return Promise.resolve().then(function () {
     return _interopRequireWildcard(require( /* webpackChunkName: "glyphError" */'@atlaskit/icon/glyph/error'));
   });
-}), (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)(_importIconMapper, _constants.IconType.Forbidden, function () {
+}), (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)(_importIconMapperOld, _constants.IconType.Forbidden, function () {
   return Promise.resolve().then(function () {
     return _interopRequireWildcard(require( /* webpackChunkName: "glyphForbidden" */'@atlaskit/icon/glyph/lock-filled'));
   });
@@ -228,7 +230,7 @@ var importIconMapper = (_importIconMapper = {}, (0, _defineProperty2.default)((0
   return Promise.resolve().then(function () {
     return _interopRequireWildcard(require( /* webpackChunkName: "glyphHigh" */'@atlaskit/icon-priority/glyph/priority-high'));
   });
-}), (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)(_importIconMapper, _constants.IconType.PriorityHighest, function () {
+}), (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)(_importIconMapperOld, _constants.IconType.PriorityHighest, function () {
   return Promise.resolve().then(function () {
     return _interopRequireWildcard(require( /* webpackChunkName: "glyphHighest" */'@atlaskit/icon-priority/glyph/priority-highest'));
   });
@@ -268,13 +270,16 @@ var importIconMapper = (_importIconMapper = {}, (0, _defineProperty2.default)((0
   return Promise.resolve().then(function () {
     return _interopRequireWildcard(require( /* webpackChunkName: "glyphSubscriber" */'@atlaskit/icon/glyph/people'));
   });
-}), (0, _defineProperty2.default)(_importIconMapper, _constants.IconType.SubTasksProgress, function () {
+}), (0, _defineProperty2.default)(_importIconMapperOld, _constants.IconType.SubTasksProgress, function () {
   return Promise.resolve().then(function () {
     return _interopRequireWildcard(require( /* webpackChunkName: "glyphSubtaskProgress" */'@atlaskit/icon/glyph/subtask'));
   });
 }));
 var getIconImportFn = function getIconImportFn(icon) {
-  return importIconMapper[icon];
+  if ((0, _platformFeatureFlags.fg)('platform-smart-card-icon-migration')) {
+    return (0, _utils.getLazyIcons)()[icon];
+  }
+  return importIconMapperOld[icon];
 };
 var importIcon = function importIcon(importFn) {
   return (0, _reactLoadable.default)({

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: "34.3.0",
+  packageVersion: "34.4.0",
   componentName: 'linkUrl'
 };
 var Anchor = (0, _click.withLinkClickedEvent)('a');

package/dist/cjs/view/RelatedLinksModal/components/RelatedLinksBaseModal.js

@@ -6,23 +6,17 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _react = require("react");
-var _react2 = require("@emotion/react");
+var _react = _interopRequireWildcard(require("react"));
 var _reactIntlNext = require("react-intl-next");
 var _new = _interopRequireDefault(require("@atlaskit/button/new"));
 var _modalDialog = _interopRequireWildcard(require("@atlaskit/modal-dialog"));
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _primitives = require("@atlaskit/primitives");
 var _useAnalyticsEvents2 = require("../../../common/analytics/generated/use-analytics-events");
 var _messages = require("../../../messages");
+var _RelatedLinksBaseModalOld = _interopRequireDefault(require("./RelatedLinksBaseModalOld"));
 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; }
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-
 var fixedWidth = 'small'; // pre-defined 400px by Atlaskit
 
 var boxStyles = (0, _primitives.xcss)({
@@ -46,18 +40,25 @@ var RelatedLinksBaseModal = function RelatedLinksBaseModal(_ref) {
     });
     onClose === null || onClose === void 0 || onClose();
   }, [fireEvent, onClose]);
-  return (0, _react2.jsx)(_modalDialog.ModalTransition, null, showModal && (0, _react2.jsx)(_modalDialog.default, {
+  return /*#__PURE__*/_react.default.createElement(_modalDialog.ModalTransition, null, showModal && /*#__PURE__*/_react.default.createElement(_modalDialog.default, {
     testId: "related-links-modal",
     onClose: closeHandler,
     width: fixedWidth,
     autoFocus: false,
     shouldReturnFocus: false,
     onOpenComplete: openCompleteHandler
-  }, (0, _react2.jsx)(_modalDialog.ModalHeader, null, (0, _react2.jsx)(_modalDialog.ModalTitle, null, (0, _react2.jsx)(_reactIntlNext.FormattedMessage, _messages.messages.related_links_modal_title))), (0, _react2.jsx)(_modalDialog.ModalBody, null, (0, _react2.jsx)(_primitives.Box, {
+  }, /*#__PURE__*/_react.default.createElement(_modalDialog.ModalHeader, null, /*#__PURE__*/_react.default.createElement(_modalDialog.ModalTitle, null, /*#__PURE__*/_react.default.createElement(_reactIntlNext.FormattedMessage, _messages.messages.related_links_modal_title))), /*#__PURE__*/_react.default.createElement(_modalDialog.ModalBody, null, /*#__PURE__*/_react.default.createElement(_primitives.Box, {
     xcss: boxStyles
-  }, children)), (0, _react2.jsx)(_modalDialog.ModalFooter, null, (0, _react2.jsx)(_new.default, {
+  }, children)), /*#__PURE__*/_react.default.createElement(_modalDialog.ModalFooter, null, /*#__PURE__*/_react.default.createElement(_new.default, {
     appearance: "primary",
     onClick: closeHandler
-  }, (0, _react2.jsx)(_reactIntlNext.FormattedMessage, _messages.messages.close)))));
+  }, /*#__PURE__*/_react.default.createElement(_reactIntlNext.FormattedMessage, _messages.messages.close)))));
+};
+var RelatedLinksBaseModalExported = function RelatedLinksBaseModalExported(props) {
+  if ((0, _platformFeatureFlags.fg)('bandicoots-compiled-migration-smartcard')) {
+    return /*#__PURE__*/_react.default.createElement(RelatedLinksBaseModal, props);
+  } else {
+    return /*#__PURE__*/_react.default.createElement(_RelatedLinksBaseModalOld.default, props);
+  }
 };
-var _default = exports.default = RelatedLinksBaseModal;
+var _default = exports.default = RelatedLinksBaseModalExported;

package/dist/cjs/view/RelatedLinksModal/components/RelatedLinksBaseModalOld.js

@@ -0,0 +1,63 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = require("react");
+var _react2 = require("@emotion/react");
+var _reactIntlNext = require("react-intl-next");
+var _new = _interopRequireDefault(require("@atlaskit/button/new"));
+var _modalDialog = _interopRequireWildcard(require("@atlaskit/modal-dialog"));
+var _primitives = require("@atlaskit/primitives");
+var _useAnalyticsEvents2 = require("../../../common/analytics/generated/use-analytics-events");
+var _messages = require("../../../messages");
+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; }
+/**
+ * @jsxRuntime classic
+ * @jsx jsx
+ */
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+
+var fixedWidth = 'small'; // pre-defined 400px by Atlaskit
+
+var boxStyles = (0, _primitives.xcss)({
+  height: '396px' // Specified by the designer as this will display 5 incoming links and 2 outgoing links
+});
+var RelatedLinksBaseModal = function RelatedLinksBaseModal(_ref) {
+  var onClose = _ref.onClose,
+    showModal = _ref.showModal,
+    children = _ref.children;
+  var _useAnalyticsEvents = (0, _useAnalyticsEvents2.useAnalyticsEvents)(),
+    fireEvent = _useAnalyticsEvents.fireEvent;
+  var modalOpenTimeRef = (0, _react.useRef)(Date.now());
+  var openCompleteHandler = (0, _react.useCallback)(function (el) {
+    el.focus();
+    modalOpenTimeRef.current = Date.now();
+    fireEvent('ui.modal.opened.relatedLinks', {});
+  }, [fireEvent]);
+  var closeHandler = (0, _react.useCallback)(function () {
+    fireEvent('ui.modal.closed.relatedLinks', {
+      dwellTime: Date.now() - modalOpenTimeRef.current
+    });
+    onClose === null || onClose === void 0 || onClose();
+  }, [fireEvent, onClose]);
+  return (0, _react2.jsx)(_modalDialog.ModalTransition, null, showModal && (0, _react2.jsx)(_modalDialog.default, {
+    testId: "related-links-modal",
+    onClose: closeHandler,
+    width: fixedWidth,
+    autoFocus: false,
+    shouldReturnFocus: false,
+    onOpenComplete: openCompleteHandler
+  }, (0, _react2.jsx)(_modalDialog.ModalHeader, null, (0, _react2.jsx)(_modalDialog.ModalTitle, null, (0, _react2.jsx)(_reactIntlNext.FormattedMessage, _messages.messages.related_links_modal_title))), (0, _react2.jsx)(_modalDialog.ModalBody, null, (0, _react2.jsx)(_primitives.Box, {
+    xcss: boxStyles
+  }, children)), (0, _react2.jsx)(_modalDialog.ModalFooter, null, (0, _react2.jsx)(_new.default, {
+    appearance: "primary",
+    onClick: closeHandler
+  }, (0, _react2.jsx)(_reactIntlNext.FormattedMessage, _messages.messages.close)))));
+};
+var _default = exports.default = RelatedLinksBaseModal;

package/dist/cjs/view/RelatedLinksModal/components/related-link-item/RelatedLinkItemOld.js

@@ -0,0 +1,61 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = require("@emotion/react");
+var _primitives = require("@atlaskit/primitives");
+var _index = require("../../../../index");
+/**
+ * @jsxRuntime classic
+ * @jsx jsx
+ */
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+
+var hoverStyles = (0, _primitives.xcss)({
+  ':hover': {
+    backgroundColor: 'color.background.input.hovered',
+    borderRadius: 'border.radius.100',
+    marginInline: 'space.negative.100',
+    paddingInline: 'space.100'
+  }
+});
+var relatedLinkItemStyles = (0, _react.css)({
+  paddingTop: "var(--ds-space-100, 8px)",
+  paddingBottom: "var(--ds-space-100, 8px)",
+  gap: "var(--ds-space-150, 12px)",
+  font: "var(--ds-font-body-small, normal 400 11px/16px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)"
+});
+var RelatedLinkItem = function RelatedLinkItem(_ref) {
+  var url = _ref.url,
+    testId = _ref.testId;
+  var subtitle = [{
+    name: _index.ElementName.Provider,
+    hideIcon: true
+  }];
+  var ui = {
+    hideElevation: true,
+    hidePadding: true,
+    hideBackground: true,
+    theme: _index.SmartLinkTheme.Black,
+    clickableContainer: true,
+    size: _index.SmartLinkSize.Large
+  };
+  return (0, _react.jsx)(_primitives.Box, {
+    testId: testId,
+    xcss: hoverStyles
+  }, (0, _react.jsx)(_index.Card, {
+    appearance: "block",
+    ui: ui,
+    url: url
+  }, (0, _react.jsx)(_index.TitleBlock, {
+    maxLines: 1,
+    hideTitleTooltip: true,
+    position: _index.SmartLinkPosition.Center,
+    subtitle: subtitle,
+    overrideCss: relatedLinkItemStyles,
+    anchorTarget: "_blank"
+  })));
+};
+var _default = exports.default = RelatedLinkItem;

package/dist/cjs/view/RelatedLinksModal/components/related-link-item/index.js

@@ -1,31 +1,26 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _react = require("@emotion/react");
+var _react = _interopRequireDefault(require("react"));
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _primitives = require("@atlaskit/primitives");
 var _index = require("../../../../index");
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-
+var _RelatedLinkItemOld = _interopRequireDefault(require("./RelatedLinkItemOld"));
 var hoverStyles = (0, _primitives.xcss)({
   ':hover': {
     backgroundColor: 'color.background.input.hovered',
     borderRadius: 'border.radius.100',
     marginInline: 'space.negative.100',
     paddingInline: 'space.100'
-  }
-});
-var relatedLinkItemStyles = (0, _react.css)({
-  paddingTop: "var(--ds-space-100, 8px)",
-  paddingBottom: "var(--ds-space-100, 8px)",
-  gap: "var(--ds-space-150, 12px)",
-  font: "var(--ds-font-body-small, normal 400 11px/16px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)"
+  },
+  paddingTop: 'space.100',
+  paddingBottom: 'space.100',
+  gap: 'space.150',
+  font: 'font.body.small'
 });
 var RelatedLinkItem = function RelatedLinkItem(_ref) {
   var url = _ref.url,
@@ -42,20 +37,26 @@ var RelatedLinkItem = function RelatedLinkItem(_ref) {
     clickableContainer: true,
     size: _index.SmartLinkSize.Large
   };
-  return (0, _react.jsx)(_primitives.Box, {
+  return /*#__PURE__*/_react.default.createElement(_primitives.Box, {
     testId: testId,
     xcss: hoverStyles
-  }, (0, _react.jsx)(_index.Card, {
+  }, /*#__PURE__*/_react.default.createElement(_index.Card, {
     appearance: "block",
     ui: ui,
     url: url
-  }, (0, _react.jsx)(_index.TitleBlock, {
+  }, /*#__PURE__*/_react.default.createElement(_index.TitleBlock, {
     maxLines: 1,
     hideTitleTooltip: true,
     position: _index.SmartLinkPosition.Center,
     subtitle: subtitle,
-    overrideCss: relatedLinkItemStyles,
     anchorTarget: "_blank"
   })));
 };
-var _default = exports.default = RelatedLinkItem;
+var RelatedLinkItemExported = function RelatedLinkItemExported(props) {
+  if ((0, _platformFeatureFlags.fg)('bandicoots-compiled-migration-smartcard')) {
+    return /*#__PURE__*/_react.default.createElement(RelatedLinkItem, props);
+  } else {
+    return /*#__PURE__*/_react.default.createElement(_RelatedLinkItemOld.default, props);
+  }
+};
+var _default = exports.default = RelatedLinkItemExported;

package/dist/cjs/view/RelatedLinksModal/components/related-links-list/RelatedLinksListOld.js

@@ -0,0 +1,51 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = require("@emotion/react");
+var _reactIntlNext = require("react-intl-next");
+var _primitives = require("@atlaskit/primitives");
+var _messages = require("../../../../messages");
+var _relatedLinkItem = _interopRequireDefault(require("../related-link-item"));
+/**
+ * @jsxRuntime classic
+ * @jsx jsx
+ */
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+
+var RelatedLinksList = function RelatedLinksList(_ref) {
+  var urls = _ref.urls,
+    title = _ref.title,
+    testId = _ref.testId;
+  return (0, _react.jsx)(_primitives.Stack, {
+    testId: testId
+  }, (0, _react.jsx)(_primitives.Box, {
+    paddingBlockStart: "space.050"
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
+    ,
+    xcss: (0, _primitives.xcss)({
+      font: "var(--ds-font-heading-xxsmall, normal 600 12px/16px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)",
+      // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
+      textTransform: 'uppercase'
+    })
+  }, (0, _react.jsx)(_reactIntlNext.FormattedMessage, title)), urls.length > 0 && (0, _react.jsx)(_primitives.Box, null, urls.map(function (url, idx) {
+    return (0, _react.jsx)(_primitives.Stack, {
+      key: "".concat(idx, "-").concat(url)
+    }, (0, _react.jsx)(_relatedLinkItem.default, {
+      url: url,
+      testId: "".concat(testId, "-item-").concat(idx)
+    }));
+  })), urls.length === 0 &&
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
+  (0, _react.jsx)(_primitives.Box, {
+    paddingBlock: "space.100",
+    xcss: (0, _primitives.xcss)({
+      font: "var(--ds-font-body-small, normal 400 11px/16px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)"
+    })
+  }, (0, _react.jsx)(_reactIntlNext.FormattedMessage, _messages.messages.related_links_not_found)));
+};
+var _default = exports.default = RelatedLinksList;

package/dist/cjs/view/RelatedLinksModal/components/related-links-list/index.js

@@ -5,47 +5,47 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _react = require("@emotion/react");
+var _react = _interopRequireDefault(require("react"));
 var _reactIntlNext = require("react-intl-next");
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _primitives = require("@atlaskit/primitives");
 var _messages = require("../../../../messages");
 var _relatedLinkItem = _interopRequireDefault(require("../related-link-item"));
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-
+var _RelatedLinksListOld = _interopRequireDefault(require("./RelatedLinksListOld"));
+var sectionTitleStyles = (0, _primitives.xcss)({
+  font: "var(--ds-font-heading-xxsmall, normal 600 12px/16px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)"
+});
 var RelatedLinksList = function RelatedLinksList(_ref) {
   var urls = _ref.urls,
     title = _ref.title,
     testId = _ref.testId;
-  return (0, _react.jsx)(_primitives.Stack, {
+  return /*#__PURE__*/_react.default.createElement(_primitives.Stack, {
     testId: testId
-  }, (0, _react.jsx)(_primitives.Box, {
-    paddingBlockStart: "space.050"
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
-    ,
-    xcss: (0, _primitives.xcss)({
-      font: "var(--ds-font-heading-xxsmall, normal 600 12px/16px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)",
-      // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
-      textTransform: 'uppercase'
-    })
-  }, (0, _react.jsx)(_reactIntlNext.FormattedMessage, title)), urls.length > 0 && (0, _react.jsx)(_primitives.Box, null, urls.map(function (url, idx) {
-    return (0, _react.jsx)(_primitives.Stack, {
+  }, /*#__PURE__*/_react.default.createElement(_primitives.Box, {
+    paddingBlockStart: "space.050",
+    xcss: sectionTitleStyles
+  }, /*#__PURE__*/_react.default.createElement(_reactIntlNext.FormattedMessage, title)), urls.length > 0 && /*#__PURE__*/_react.default.createElement(_primitives.Box, null, urls.map(function (url, idx) {
+    return /*#__PURE__*/_react.default.createElement(_primitives.Stack, {
       key: "".concat(idx, "-").concat(url)
-    }, (0, _react.jsx)(_relatedLinkItem.default, {
+    }, /*#__PURE__*/_react.default.createElement(_relatedLinkItem.default, {
       url: url,
       testId: "".concat(testId, "-item-").concat(idx)
     }));
   })), urls.length === 0 &&
+  /*#__PURE__*/
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
-  (0, _react.jsx)(_primitives.Box, {
+  _react.default.createElement(_primitives.Box, {
     paddingBlock: "space.100",
     xcss: (0, _primitives.xcss)({
       font: "var(--ds-font-body-small, normal 400 11px/16px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)"
     })
-  }, (0, _react.jsx)(_reactIntlNext.FormattedMessage, _messages.messages.related_links_not_found)));
+  }, /*#__PURE__*/_react.default.createElement(_reactIntlNext.FormattedMessage, _messages.messages.related_links_not_found)));
+};
+var RelatedLinksListExported = function RelatedLinksListExported(props) {
+  if ((0, _platformFeatureFlags.fg)('bandicoots-compiled-migration-smartcard')) {
+    return /*#__PURE__*/_react.default.createElement(RelatedLinksList, props);
+  } else {
+    return /*#__PURE__*/_react.default.createElement(_RelatedLinksListOld.default, props);
+  }
 };
-var _default = exports.default = RelatedLinksList;
+var _default = exports.default = RelatedLinksListExported;

package/dist/cjs/view/RelatedLinksModal/views/errored/error-svg/ErrorSvgOld.js

@@ -0,0 +1,66 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ErrorSVGOld = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _react = require("@emotion/react");
+/**
+ * @jsxRuntime classic
+ * @jsx jsx
+ */
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+
+var errorStyles = (0, _react.css)({
+  width: '80px',
+  margin: "0 auto ".concat("var(--ds-space-300, 24px)"),
+  display: 'block'
+});
+var ErrorSVGOld = exports.ErrorSVGOld = function ErrorSVGOld(props) {
+  var id = 'related-links-error-svg';
+  return (0, _react.jsx)("svg", (0, _extends2.default)({
+    "data-testid": id,
+    viewBox: "0 0 164 212",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg",
+    css: errorStyles
+  }, props), (0, _react.jsx)("path", {
+    d: "m95.43 74.16 66.44 115.08c5.84 10.12-1.46 22.76-13.14 22.76H15.85c-11.68 0-18.98-12.65-13.14-22.76L69.15 74.16c5.84-10.12 20.44-10.12 26.28 0Zm-7.56 83.55 2.88-44.35c.34-5.29-3.86-9.78-9.16-9.78-5.31 0-9.51 4.48-9.16 9.78l2.88 44.35a6.3 6.3 0 0 0 6.28 5.89c3.31 0 6.06-2.58 6.28-5.89Zm-15.84 23.54c0 5.66 4.76 10.1 10.39 9.58 4.85-.45 8.73-4.5 8.83-9.37.11-5.45-4.31-9.94-9.73-9.94-5.23-.01-9.49 4.37-9.49 9.73Z",
+    fill: "url(#".concat(id, ")")
+  }), (0, _react.jsx)("path", {
+    opacity: ".6",
+    d: "M93.35 27.17 85.94.45c-.17-.62-1.07-.58-1.19.05l-4.66 25.1-5.8-1.08a.612.612 0 0 0-.7.76L81 52c.17.62 1.07.58 1.19-.05l4.66-25.1 5.8 1.08c.45.08.82-.33.7-.76ZM66.77 41.81 55.9 33.26c-.22-.18-.53.07-.41.33l5.53 11.43-2.66 1.29c-.18.09-.2.33-.05.45l10.87 8.55c.22.18.53-.07.41-.33l-5.53-11.43 2.66-1.29c.17-.08.2-.33.05-.45Z",
+    fill: "#C1C7D0"
+  }), (0, _react.jsx)("path", {
+    opacity: ".6",
+    d: "M102.78 56.75a.993.993 0 0 1-.92-1.38c-.24-.77-2.29-2.85-3.54-4.11-2.97-3.01-4.93-5-3.84-6.49 1.09-1.48 3.58-.22 7.35 1.7 1.32.67 3.35 1.7 4.45 2.03-.64-.95-2.24-2.58-3.28-3.63-2.97-3.01-4.93-5-3.84-6.49 1.08-1.48 3.58-.22 7.34 1.7 1.32.67 3.34 1.7 4.45 2.03-.64-.95-2.24-2.57-3.28-3.62-2.97-3.01-4.93-5-3.84-6.49 1.08-1.48 3.57-.22 7.34 1.7 1.58.8 4.18 2.13 4.98 2.13a1.005 1.005 0 0 1 1.46 1.36c-1.09 1.48-3.57.22-7.34-1.7-1.32-.67-3.34-1.7-4.44-2.03.64.95 2.24 2.57 3.28 3.62 2.97 3.01 4.93 5 3.84 6.49-1.08 1.48-3.57.22-7.34-1.7-1.32-.67-3.35-1.7-4.45-2.03.64.95 2.24 2.57 3.28 3.63 2.97 3.01 4.93 5 3.84 6.49-1.09 1.48-3.58.22-7.35-1.7-1.32-.67-3.35-1.71-4.45-2.03.64.95 2.24 2.58 3.28 3.63 2.97 3.01 4.93 5 3.84 6.49-.21.26-.51.4-.82.4Zm5.56 14.32c-.35 0-.69-.19-.88-.52-1.04-1.88-2.22-4.02-.91-5.21 1.31-1.2 3.34.18 5.49 1.63.87.59 2.26 1.53 2.93 1.71-.12-.68-.93-2.15-1.45-3.07-1.26-2.27-2.45-4.41-1.14-5.61 1.31-1.2 3.34.18 5.49 1.63.96.65 2.54 1.72 3.1 1.74a1 1 0 0 1 1.27 1.54c-1.31 1.2-3.34-.17-5.49-1.63-.87-.59-2.26-1.53-2.93-1.71.12.68.93 2.15 1.45 3.07 1.26 2.27 2.45 4.41 1.14 5.61-1.31 1.2-3.34-.18-5.49-1.63-.87-.59-2.26-1.53-2.93-1.71.12.68.93 2.14 1.22 2.67.27.48.09 1.09-.39 1.36-.15.09-.32.13-.48.13Zm-54.32-2.89c-.22 0-.44-.04-.67-.14-1.64-.69-1.24-3.11-.81-5.67.17-1.04.45-2.7.33-3.38-.57.39-1.56 1.75-2.18 2.6-1.53 2.09-2.99 4.07-4.62 3.38a.991.991 0 0 1-.53-1.31c.2-.48.73-.72 1.21-.57.52-.21 1.65-1.75 2.34-2.68 1.53-2.09 2.98-4.08 4.62-3.38 1.64.69 1.24 3.11.81 5.67-.17 1.04-.45 2.7-.33 3.38.57-.39 1.56-1.75 2.18-2.6 1.53-2.09 2.98-4.08 4.62-3.38 1.63.69 1.24 3.09.89 5.21-.09.54-.6.91-1.15.83-.54-.09-.92-.6-.83-1.15.1-.59.37-2.24.26-2.92-.57.39-1.56 1.75-2.18 2.6-1.33 1.79-2.59 3.51-3.96 3.51Z",
+    fill: "#B3BAC5"
+  }), (0, _react.jsx)("defs", null, (0, _react.jsx)("linearGradient", {
+    id: id,
+    x1: "26.169",
+    y1: "228.621",
+    x2: "138.408",
+    y2: "116.382",
+    gradientUnits: "userSpaceOnUse"
+  }, (0, _react.jsx)("stop", {
+    stopColor: "#C1C7D0"
+  }), (0, _react.jsx)("stop", {
+    offset: ".297",
+    stopColor: "#C6CBD4",
+    stopOpacity: ".881"
+  }), (0, _react.jsx)("stop", {
+    offset: ".63",
+    stopColor: "#D3D7DE",
+    stopOpacity: ".748"
+  }), (0, _react.jsx)("stop", {
+    offset: ".98",
+    stopColor: "#E9EBEF",
+    stopOpacity: ".608"
+  }), (0, _react.jsx)("stop", {
+    offset: "1",
+    stopColor: "#EBECF0",
+    stopOpacity: ".6"
+  }))));
+};

package/dist/cjs/view/RelatedLinksModal/views/errored/error-svg/index.compiled.css

@@ -0,0 +1,6 @@
+._18u01wug{margin-left:auto}
+._19pkidpf{margin-top:0}
+._1bsbys9h{width:5pc}
+._1e0c1ule{display:block}
+._2hwx1wug{margin-right:auto}
+._otyr1ejb{margin-bottom:var(--ds-space-300,24px)}