@atlaskit/smart-card 26.22.0 → 26.23.0

package/CHANGELOG.md

@@ -1,5 +1,21 @@
 # @atlaskit/smart-card
 
+## 26.23.0
+
+### Minor Changes
+
+- [`253d4604c50`](https://bitbucket.org/atlassian/atlassian-frontend/commits/253d4604c50) - We are testing support for allow-storage-access-by-user-activation sandbox permission on untrusted embeds behind the "platform.linking-platform.smart-card.iframes-allow-storage-access-by-user-activation" feature flag. If this is successful it will always be enabled for unstrusted embeds in a future release.
+
+### Patch Changes
+
+- [`f85b3744521`](https://bitbucket.org/atlassian/atlassian-frontend/commits/f85b3744521) - Add async action base component to flexible smart links (internal)
+
+## 26.22.1
+
+### Patch Changes
+
+- [`419f14321f3`](https://bitbucket.org/atlassian/atlassian-frontend/commits/419f14321f3) - Adds a JiraTask check when getting a metadata for hovercard. The change is behind a FF. If this update is successful it will be available in a later release.
+
 ## 26.22.0
 
 ### Minor Changes

package/dist/cjs/utils/actions/create-invoke-request.js

@@ -0,0 +1,20 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var createInvokeRequest = function createInvokeRequest(request, payload) {
+  return {
+    action: _objectSpread(_objectSpread({}, request.action), {}, {
+      payload: payload
+    }),
+    providerKey: request.providerKey
+  };
+};
+var _default = createInvokeRequest;
+exports.default = _default;

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

@@ -21,7 +21,7 @@ exports.ANALYTICS_CHANNEL = ANALYTICS_CHANNEL;
 var context = {
   componentName: 'smart-cards',
   packageName: "@atlaskit/smart-card",
-  packageVersion: "26.22.0"
+  packageVersion: "26.23.0"
 };
 exports.context = context;
 var TrackQuickActionType = /*#__PURE__*/function (TrackQuickActionType) {

package/dist/cjs/utils/index.js

@@ -11,6 +11,7 @@ var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _react = _interopRequireDefault(require("react"));
 var _reactLoadable = _interopRequireDefault(require("react-loadable"));
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 var isCardWithData = function isCardWithData(props) {
@@ -338,7 +339,15 @@ var typeToIcon = {
   }]
 };
 var getIframeSandboxAttribute = function getIframeSandboxAttribute(isTrusted) {
-  return isTrusted ? undefined : 'allow-downloads allow-forms allow-popups allow-popups-to-escape-sandbox allow-presentation allow-same-origin allow-scripts';
+  if (isTrusted) {
+    return undefined;
+  }
+  var sandboxPermissions = 'allow-downloads allow-forms allow-popups allow-popups-to-escape-sandbox allow-presentation allow-same-origin allow-scripts';
+  var allowStorageAccess = 'allow-storage-access-by-user-activation';
+  if ((0, _platformFeatureFlags.getBooleanFF)('platform.linking-platform.smart-card.iframes-allow-storage-access-by-user-activation')) {
+    return "".concat(sandboxPermissions, " ").concat(allowStorageAccess);
+  }
+  return sandboxPermissions;
 };
 exports.getIframeSandboxAttribute = getIframeSandboxAttribute;
 var handleOnClick = function handleOnClick(handler) {

package/dist/cjs/view/FlexibleCard/components/actions/action/action-button/index.js

@@ -10,6 +10,8 @@ var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/hel
 var _react = _interopRequireWildcard(require("react"));
 var _react2 = require("@emotion/react");
 var _customThemeButton = _interopRequireDefault(require("@atlaskit/button/custom-theme-button"));
+var _button = require("@atlaskit/button");
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _tooltip = _interopRequireDefault(require("@atlaskit/tooltip"));
 var _constants = require("../../../../../../constants");
 var _utils = require("../../../utils");
@@ -34,6 +36,7 @@ var ActionButton = function ActionButton(_ref) {
     content = _ref.content,
     iconAfter = _ref.iconAfter,
     iconBefore = _ref.iconBefore,
+    isLoading = _ref.isLoading,
     onClick = _ref.onClick,
     overrideCss = _ref.overrideCss,
     size = _ref.size,
@@ -53,7 +56,15 @@ var ActionButton = function ActionButton(_ref) {
     content: tooltipMessage,
     hideTooltipOnClick: true,
     testId: "".concat(testId, "-tooltip")
-  }, (0, _react2.jsx)(_customThemeButton.default, {
+  }, (0, _platformFeatureFlags.getBooleanFF)('platform.linking-platform.smart-card.follow-button') ? (0, _react2.jsx)(_button.LoadingButton, {
+    appearance: appearance,
+    iconAfter: iconAfter,
+    iconBefore: iconBefore,
+    isLoading: isLoading,
+    onClick: onButtonClick(onClick),
+    spacing: _utils.sizeToButtonSpacing[size],
+    testId: testId
+  }, content) : (0, _react2.jsx)(_customThemeButton.default, {
     appearance: appearance,
     iconAfter: iconAfter,
     iconBefore: iconBefore,

package/dist/cjs/view/FlexibleCard/components/actions/action/action-dropdown-item/index.js

@@ -12,11 +12,13 @@ var ActionDropdownItem = function ActionDropdownItem(_ref) {
   var content = _ref.content,
     iconAfter = _ref.iconAfter,
     iconBefore = _ref.iconBefore,
+    isLoading = _ref.isLoading,
     onClick = _ref.onClick,
     testId = _ref.testId;
   return /*#__PURE__*/_react.default.createElement(_dropdownMenu.DropdownItem, {
     elemAfter: iconAfter,
     elemBefore: iconBefore,
+    isDisabled: isLoading,
     onClick: (0, _utils.handleOnClick)(onClick),
     testId: testId
   }, content);

package/dist/cjs/view/FlexibleCard/components/actions/action/index.js

@@ -25,6 +25,8 @@ var Action = function Action(_ref) {
   var _ref$appearance = _ref.appearance,
     appearance = _ref$appearance === void 0 ? 'subtle' : _ref$appearance,
     content = _ref.content,
+    _ref$isLoading = _ref.isLoading,
+    isLoading = _ref$isLoading === void 0 ? false : _ref$isLoading,
     onClick = _ref.onClick,
     _ref$size = _ref.size,
     size = _ref$size === void 0 ? _constants.SmartLinkSize.Medium : _ref$size,
@@ -51,6 +53,7 @@ var Action = function Action(_ref) {
       content: content,
       iconAfter: iconAfter,
       iconBefore: iconBefore,
+      isLoading: isLoading,
       onClick: onClick,
       testId: testId
     });
@@ -60,6 +63,7 @@ var Action = function Action(_ref) {
       content: content,
       iconAfter: iconAfter,
       iconBefore: iconBefore,
+      isLoading: isLoading,
       onClick: onClick,
       overrideCss: overrideCss,
       size: size,

package/dist/cjs/view/FlexibleCard/components/actions/action/server-action/index.js

@@ -0,0 +1,76 @@
+"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 _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+var _react = _interopRequireWildcard(require("react"));
+var _useInvoke = _interopRequireDefault(require("../../../../../../state/hooks/use-invoke"));
+var _useResolve = _interopRequireDefault(require("../../../../../../state/hooks/use-resolve"));
+var _createInvokeRequest = _interopRequireDefault(require("../../../../../../utils/actions/create-invoke-request"));
+var _index = _interopRequireDefault(require("../index"));
+var _excluded = ["action", "onClick"];
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+var ServerAction = function ServerAction(_ref) {
+  var action = _ref.action,
+    onClick = _ref.onClick,
+    props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
+  var _useState = (0, _react.useState)(false),
+    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+    isLoading = _useState2[0],
+    setIsLoading = _useState2[1];
+  var invoke = (0, _useInvoke.default)();
+  var reload = (0, _useResolve.default)();
+  var handleClick = (0, _react.useCallback)( /*#__PURE__*/(0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee() {
+    var request;
+    return _regenerator.default.wrap(function _callee$(_context) {
+      while (1) switch (_context.prev = _context.next) {
+        case 0:
+          if (!action) {
+            _context.next = 16;
+            break;
+          }
+          _context.prev = 1;
+          setIsLoading(true);
+          request = (0, _createInvokeRequest.default)(action);
+          _context.next = 6;
+          return invoke(request);
+        case 6:
+          setIsLoading(false);
+          if (!(action.reload && action.reload.url)) {
+            _context.next = 10;
+            break;
+          }
+          _context.next = 10;
+          return reload(action.reload.url, true, undefined, action.reload.id);
+        case 10:
+          if (onClick) {
+            onClick();
+          }
+          _context.next = 16;
+          break;
+        case 13:
+          _context.prev = 13;
+          _context.t0 = _context["catch"](1);
+          setIsLoading(false);
+        case 16:
+        case "end":
+          return _context.stop();
+      }
+    }, _callee, null, [[1, 13]]);
+  })), [action, invoke, onClick, reload]);
+  return /*#__PURE__*/_react.default.createElement(_index.default, (0, _extends2.default)({}, props, {
+    isLoading: isLoading,
+    onClick: handleClick
+  }));
+};
+var _default = ServerAction;
+exports.default = _default;

package/dist/cjs/view/FlexibleCard/components/actions/action/server-action/types.js

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

package/dist/cjs/view/HoverCard/utils.js

@@ -88,6 +88,7 @@ var getSimulatedMetadata = function getSimulatedMetadata() {
 };
 exports.getSimulatedMetadata = getSimulatedMetadata;
 var getSimulatedBetterMetadata = function getSimulatedBetterMetadata() {
+  var _data$Type$includes, _data$Type;
   var extensionKey = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
   var data = arguments.length > 1 ? arguments[1] : undefined;
   var types = data ? (0, _linkExtractors.extractType)(data) : undefined;
@@ -137,7 +138,8 @@ var getSimulatedBetterMetadata = function getSimulatedBetterMetadata() {
         }
       };
     case 'jira-object-provider':
-      return _objectSpread(_objectSpread({}, defaultMetadata), {}, {
+      var isJiraTask = (_data$Type$includes = (_data$Type = data['@type']) === null || _data$Type === void 0 ? void 0 : _data$Type.includes('atlassian:Task')) !== null && _data$Type$includes !== void 0 ? _data$Type$includes : false;
+      return _objectSpread(_objectSpread({}, defaultMetadata), isJiraTask && {
         topMetadataBlock: {
           primary: [_constants.ElementName.AssignedToGroup, _constants.ElementName.State, _constants.ElementName.StoryPoints, _constants.ElementName.Priority],
           secondary: [],

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

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

package/dist/es2019/utils/actions/create-invoke-request.js

@@ -0,0 +1,8 @@
+const createInvokeRequest = (request, payload) => ({
+  action: {
+    ...request.action,
+    payload
+  },
+  providerKey: request.providerKey
+});
+export default createInvokeRequest;

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

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

package/dist/es2019/utils/index.js

@@ -1,5 +1,6 @@
 import React from 'react';
 import Loadable from 'react-loadable';
+import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 export const isCardWithData = props => !!props.data;
 export const isSpecialEvent = evt => evt.isDefaultPrevented() && (isIframe() || isSpecialKey(evt) || isSpecialClick(evt));
 export const isIframe = () => window.parent !== parent;
@@ -98,7 +99,17 @@ const typeToIcon = {
   'application/sketch': ['Sketch', () => import('@atlaskit/icon-file-type/glyph/sketch/16')],
   folder: ['Folder', () => import('@atlaskit/icon-file-type/glyph/folder/16')]
 };
-export const getIframeSandboxAttribute = isTrusted => isTrusted ? undefined : 'allow-downloads allow-forms allow-popups allow-popups-to-escape-sandbox allow-presentation allow-same-origin allow-scripts';
+export const getIframeSandboxAttribute = isTrusted => {
+  if (isTrusted) {
+    return undefined;
+  }
+  const sandboxPermissions = 'allow-downloads allow-forms allow-popups allow-popups-to-escape-sandbox allow-presentation allow-same-origin allow-scripts';
+  const allowStorageAccess = 'allow-storage-access-by-user-activation';
+  if (getBooleanFF('platform.linking-platform.smart-card.iframes-allow-storage-access-by-user-activation')) {
+    return `${sandboxPermissions} ${allowStorageAccess}`;
+  }
+  return sandboxPermissions;
+};
 export const handleOnClick = handler => e => {
   e.preventDefault();
   e.stopPropagation();

package/dist/es2019/view/FlexibleCard/components/actions/action/action-button/index.js

@@ -2,6 +2,8 @@
 import React, { useCallback } from 'react';
 import { css, jsx } from '@emotion/react';
 import Button from '@atlaskit/button/custom-theme-button';
+import { LoadingButton } from '@atlaskit/button';
+import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 import Tooltip from '@atlaskit/tooltip';
 import { SmartLinkSize } from '../../../../../../constants';
 import { sizeToButtonSpacing } from '../../../utils';
@@ -48,6 +50,7 @@ const ActionButton = ({
   content,
   iconAfter,
   iconBefore,
+  isLoading,
   onClick,
   overrideCss,
   size,
@@ -66,7 +69,15 @@ const ActionButton = ({
     content: tooltipMessage,
     hideTooltipOnClick: true,
     testId: `${testId}-tooltip`
-  }, jsx(Button, {
+  }, getBooleanFF('platform.linking-platform.smart-card.follow-button') ? jsx(LoadingButton, {
+    appearance: appearance,
+    iconAfter: iconAfter,
+    iconBefore: iconBefore,
+    isLoading: isLoading,
+    onClick: onButtonClick(onClick),
+    spacing: sizeToButtonSpacing[size],
+    testId: testId
+  }, content) : jsx(Button, {
     appearance: appearance,
     iconAfter: iconAfter,
     iconBefore: iconBefore,

package/dist/es2019/view/FlexibleCard/components/actions/action/action-dropdown-item/index.js

@@ -5,11 +5,13 @@ const ActionDropdownItem = ({
   content,
   iconAfter,
   iconBefore,
+  isLoading,
   onClick,
   testId
 }) => /*#__PURE__*/React.createElement(DropdownItem, {
   elemAfter: iconAfter,
   elemBefore: iconBefore,
+  isDisabled: isLoading,
   onClick: handleOnClick(onClick),
   testId: testId
 }, content);

package/dist/es2019/view/FlexibleCard/components/actions/action/index.js

@@ -17,6 +17,7 @@ import ActionIcon from './action-icon';
 const Action = ({
   appearance = 'subtle',
   content,
+  isLoading = false,
   onClick,
   size = SmartLinkSize.Medium,
   testId = 'smart-action',
@@ -41,6 +42,7 @@ const Action = ({
       content: content,
       iconAfter: iconAfter,
       iconBefore: iconBefore,
+      isLoading: isLoading,
       onClick: onClick,
       testId: testId
     });
@@ -50,6 +52,7 @@ const Action = ({
       content: content,
       iconAfter: iconAfter,
       iconBefore: iconBefore,
+      isLoading: isLoading,
       onClick: onClick,
       overrideCss: overrideCss,
       size: size,

package/dist/es2019/view/FlexibleCard/components/actions/action/server-action/index.js

@@ -0,0 +1,38 @@
+import _extends from "@babel/runtime/helpers/extends";
+import React, { useCallback, useState } from 'react';
+import useInvoke from '../../../../../../state/hooks/use-invoke';
+import useResolve from '../../../../../../state/hooks/use-resolve';
+import createInvokeRequest from '../../../../../../utils/actions/create-invoke-request';
+import Action from '../index';
+const ServerAction = ({
+  action,
+  onClick,
+  ...props
+}) => {
+  const [isLoading, setIsLoading] = useState(false);
+  const invoke = useInvoke();
+  const reload = useResolve();
+  const handleClick = useCallback(async () => {
+    if (action) {
+      try {
+        setIsLoading(true);
+        const request = createInvokeRequest(action);
+        await invoke(request);
+        setIsLoading(false);
+        if (action.reload && action.reload.url) {
+          await reload(action.reload.url, true, undefined, action.reload.id);
+        }
+        if (onClick) {
+          onClick();
+        }
+      } catch (err) {
+        setIsLoading(false);
+      }
+    }
+  }, [action, invoke, onClick, reload]);
+  return /*#__PURE__*/React.createElement(Action, _extends({}, props, {
+    isLoading: isLoading,
+    onClick: handleClick
+  }));
+};
+export default ServerAction;

package/dist/es2019/view/FlexibleCard/components/actions/action/server-action/types.js

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

package/dist/es2019/view/HoverCard/utils.js

@@ -75,6 +75,7 @@ export const getSimulatedMetadata = (extensionKey = '', data) => {
   }
 };
 export const getSimulatedBetterMetadata = (extensionKey = '', data) => {
+  var _data$Type$includes, _data$Type;
   const types = data ? extractType(data) : undefined;
   const defaultMetadata = {
     topMetadataBlock: {
@@ -124,13 +125,16 @@ export const getSimulatedBetterMetadata = (extensionKey = '', data) => {
         }
       };
     case 'jira-object-provider':
+      const isJiraTask = (_data$Type$includes = (_data$Type = data['@type']) === null || _data$Type === void 0 ? void 0 : _data$Type.includes('atlassian:Task')) !== null && _data$Type$includes !== void 0 ? _data$Type$includes : false;
       return {
         ...defaultMetadata,
-        topMetadataBlock: {
-          primary: [ElementName.AssignedToGroup, ElementName.State, ElementName.StoryPoints, ElementName.Priority],
-          secondary: [],
-          subtitle: []
-        }
+        ...(isJiraTask && {
+          topMetadataBlock: {
+            primary: [ElementName.AssignedToGroup, ElementName.State, ElementName.StoryPoints, ElementName.Priority],
+            secondary: [],
+            subtitle: []
+          }
+        })
       };
     case 'trello-object-provider':
       return {

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

@@ -8,7 +8,7 @@ import LinkWarningModal from './LinkWarningModal';
 import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 const PACKAGE_DATA = {
   packageName: "@atlaskit/smart-card",
-  packageVersion: "26.22.0",
+  packageVersion: "26.23.0",
   componentName: 'linkUrl'
 };
 const Link = withLinkClickedEvent('a');

package/dist/esm/utils/actions/create-invoke-request.js

@@ -0,0 +1,12 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var createInvokeRequest = function createInvokeRequest(request, payload) {
+  return {
+    action: _objectSpread(_objectSpread({}, request.action), {}, {
+      payload: payload
+    }),
+    providerKey: request.providerKey
+  };
+};
+export default createInvokeRequest;

package/dist/esm/utils/analytics/analytics.js

@@ -13,7 +13,7 @@ export var ANALYTICS_CHANNEL = 'media';
 export var context = {
   componentName: 'smart-cards',
   packageName: "@atlaskit/smart-card",
-  packageVersion: "26.22.0"
+  packageVersion: "26.23.0"
 };
 export var TrackQuickActionType = /*#__PURE__*/function (TrackQuickActionType) {
   TrackQuickActionType["StatusUpdate"] = "StatusUpdate";

package/dist/esm/utils/index.js

@@ -3,6 +3,7 @@ import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _regeneratorRuntime from "@babel/runtime/regenerator";
 import React from 'react';
 import Loadable from 'react-loadable';
+import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 export var isCardWithData = function isCardWithData(props) {
   return !!props.data;
 };
@@ -221,7 +222,15 @@ var typeToIcon = {
   }]
 };
 export var getIframeSandboxAttribute = function getIframeSandboxAttribute(isTrusted) {
-  return isTrusted ? undefined : 'allow-downloads allow-forms allow-popups allow-popups-to-escape-sandbox allow-presentation allow-same-origin allow-scripts';
+  if (isTrusted) {
+    return undefined;
+  }
+  var sandboxPermissions = 'allow-downloads allow-forms allow-popups allow-popups-to-escape-sandbox allow-presentation allow-same-origin allow-scripts';
+  var allowStorageAccess = 'allow-storage-access-by-user-activation';
+  if (getBooleanFF('platform.linking-platform.smart-card.iframes-allow-storage-access-by-user-activation')) {
+    return "".concat(sandboxPermissions, " ").concat(allowStorageAccess);
+  }
+  return sandboxPermissions;
 };
 export var handleOnClick = function handleOnClick(handler) {
   return function (e) {

package/dist/esm/view/FlexibleCard/components/actions/action/action-button/index.js

@@ -4,6 +4,8 @@ var _templateObject, _templateObject2;
 import React, { useCallback } from 'react';
 import { css, jsx } from '@emotion/react';
 import Button from '@atlaskit/button/custom-theme-button';
+import { LoadingButton } from '@atlaskit/button';
+import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 import Tooltip from '@atlaskit/tooltip';
 import { SmartLinkSize } from '../../../../../../constants';
 import { sizeToButtonSpacing } from '../../../utils';
@@ -24,6 +26,7 @@ var ActionButton = function ActionButton(_ref) {
     content = _ref.content,
     iconAfter = _ref.iconAfter,
     iconBefore = _ref.iconBefore,
+    isLoading = _ref.isLoading,
     onClick = _ref.onClick,
     overrideCss = _ref.overrideCss,
     size = _ref.size,
@@ -43,7 +46,15 @@ var ActionButton = function ActionButton(_ref) {
     content: tooltipMessage,
     hideTooltipOnClick: true,
     testId: "".concat(testId, "-tooltip")
-  }, jsx(Button, {
+  }, getBooleanFF('platform.linking-platform.smart-card.follow-button') ? jsx(LoadingButton, {
+    appearance: appearance,
+    iconAfter: iconAfter,
+    iconBefore: iconBefore,
+    isLoading: isLoading,
+    onClick: onButtonClick(onClick),
+    spacing: sizeToButtonSpacing[size],
+    testId: testId
+  }, content) : jsx(Button, {
     appearance: appearance,
     iconAfter: iconAfter,
     iconBefore: iconBefore,

package/dist/esm/view/FlexibleCard/components/actions/action/action-dropdown-item/index.js

@@ -5,11 +5,13 @@ var ActionDropdownItem = function ActionDropdownItem(_ref) {
   var content = _ref.content,
     iconAfter = _ref.iconAfter,
     iconBefore = _ref.iconBefore,
+    isLoading = _ref.isLoading,
     onClick = _ref.onClick,
     testId = _ref.testId;
   return /*#__PURE__*/React.createElement(DropdownItem, {
     elemAfter: iconAfter,
     elemBefore: iconBefore,
+    isDisabled: isLoading,
     onClick: handleOnClick(onClick),
     testId: testId
   }, content);

package/dist/esm/view/FlexibleCard/components/actions/action/index.js

@@ -18,6 +18,8 @@ var Action = function Action(_ref) {
   var _ref$appearance = _ref.appearance,
     appearance = _ref$appearance === void 0 ? 'subtle' : _ref$appearance,
     content = _ref.content,
+    _ref$isLoading = _ref.isLoading,
+    isLoading = _ref$isLoading === void 0 ? false : _ref$isLoading,
     onClick = _ref.onClick,
     _ref$size = _ref.size,
     size = _ref$size === void 0 ? SmartLinkSize.Medium : _ref$size,
@@ -44,6 +46,7 @@ var Action = function Action(_ref) {
       content: content,
       iconAfter: iconAfter,
       iconBefore: iconBefore,
+      isLoading: isLoading,
       onClick: onClick,
       testId: testId
     });
@@ -53,6 +56,7 @@ var Action = function Action(_ref) {
       content: content,
       iconAfter: iconAfter,
       iconBefore: iconBefore,
+      isLoading: isLoading,
       onClick: onClick,
       overrideCss: overrideCss,
       size: size,

package/dist/esm/view/FlexibleCard/components/actions/action/server-action/index.js

@@ -0,0 +1,65 @@
+import _extends from "@babel/runtime/helpers/extends";
+import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+var _excluded = ["action", "onClick"];
+import _regeneratorRuntime from "@babel/runtime/regenerator";
+import React, { useCallback, useState } from 'react';
+import useInvoke from '../../../../../../state/hooks/use-invoke';
+import useResolve from '../../../../../../state/hooks/use-resolve';
+import createInvokeRequest from '../../../../../../utils/actions/create-invoke-request';
+import Action from '../index';
+var ServerAction = function ServerAction(_ref) {
+  var action = _ref.action,
+    onClick = _ref.onClick,
+    props = _objectWithoutProperties(_ref, _excluded);
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    isLoading = _useState2[0],
+    setIsLoading = _useState2[1];
+  var invoke = useInvoke();
+  var reload = useResolve();
+  var handleClick = useCallback( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
+    var request;
+    return _regeneratorRuntime.wrap(function _callee$(_context) {
+      while (1) switch (_context.prev = _context.next) {
+        case 0:
+          if (!action) {
+            _context.next = 16;
+            break;
+          }
+          _context.prev = 1;
+          setIsLoading(true);
+          request = createInvokeRequest(action);
+          _context.next = 6;
+          return invoke(request);
+        case 6:
+          setIsLoading(false);
+          if (!(action.reload && action.reload.url)) {
+            _context.next = 10;
+            break;
+          }
+          _context.next = 10;
+          return reload(action.reload.url, true, undefined, action.reload.id);
+        case 10:
+          if (onClick) {
+            onClick();
+          }
+          _context.next = 16;
+          break;
+        case 13:
+          _context.prev = 13;
+          _context.t0 = _context["catch"](1);
+          setIsLoading(false);
+        case 16:
+        case "end":
+          return _context.stop();
+      }
+    }, _callee, null, [[1, 13]]);
+  })), [action, invoke, onClick, reload]);
+  return /*#__PURE__*/React.createElement(Action, _extends({}, props, {
+    isLoading: isLoading,
+    onClick: handleClick
+  }));
+};
+export default ServerAction;

package/dist/esm/view/FlexibleCard/components/actions/action/server-action/types.js

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

package/dist/esm/view/HoverCard/utils.js

@@ -80,6 +80,7 @@ export var getSimulatedMetadata = function getSimulatedMetadata() {
   }
 };
 export var getSimulatedBetterMetadata = function getSimulatedBetterMetadata() {
+  var _data$Type$includes, _data$Type;
   var extensionKey = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
   var data = arguments.length > 1 ? arguments[1] : undefined;
   var types = data ? extractType(data) : undefined;
@@ -129,7 +130,8 @@ export var getSimulatedBetterMetadata = function getSimulatedBetterMetadata() {
         }
       };
     case 'jira-object-provider':
-      return _objectSpread(_objectSpread({}, defaultMetadata), {}, {
+      var isJiraTask = (_data$Type$includes = (_data$Type = data['@type']) === null || _data$Type === void 0 ? void 0 : _data$Type.includes('atlassian:Task')) !== null && _data$Type$includes !== void 0 ? _data$Type$includes : false;
+      return _objectSpread(_objectSpread({}, defaultMetadata), isJiraTask && {
         topMetadataBlock: {
           primary: [ElementName.AssignedToGroup, ElementName.State, ElementName.StoryPoints, ElementName.Priority],
           secondary: [],

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

@@ -11,7 +11,7 @@ import LinkWarningModal from './LinkWarningModal';
 import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 var PACKAGE_DATA = {
   packageName: "@atlaskit/smart-card",
-  packageVersion: "26.22.0",
+  packageVersion: "26.23.0",
   componentName: 'linkUrl'
 };
 var Link = withLinkClickedEvent('a');

package/dist/types/state/hooks/use-invoke/types.d.ts

@@ -17,11 +17,25 @@ export type CardDetails = {
      */
     previewData?: PreviewActionData | null;
 };
+/**
+ * Additional details to reload smart links
+ */
+export type InvokeReloadDetails = {
+    /**
+     * An identifier for Smart Link analytics
+     */
+    id?: string;
+    /**
+     * The URL of the Smart Link
+     */
+    url?: string;
+};
 /**
  * Invoke request with additional details for the component
  */
 export type InvokeRequestWithCardDetails = InvokeRequest & {
     details?: CardDetails;
+    reload?: InvokeReloadDetails;
 };
 /**
  * CRUD invoke requests for the component that support server actions

package/dist/types/utils/actions/create-invoke-request.d.ts

@@ -0,0 +1,3 @@
+import type { InvokeRequest } from '@atlaskit/linking-types/smart-link-actions';
+declare const createInvokeRequest: <TPayload extends object>(request: InvokeRequest, payload?: TPayload | undefined) => InvokeRequest<TPayload>;
+export default createInvokeRequest;

package/dist/types/utils/index.d.ts

@@ -16,7 +16,7 @@ export declare const isSpecialKey: (event: React.MouseEvent | React.KeyboardEven
 export declare const isSpecialClick: (event: React.MouseEvent) => boolean;
 export declare const getIconForFileType: (fileMimeType: string) => React.ReactNode | undefined;
 export declare const getLabelForFileType: (fileMimeType: string) => React.ReactNode | undefined;
-export declare const getIframeSandboxAttribute: (isTrusted: boolean) => "allow-downloads allow-forms allow-popups allow-popups-to-escape-sandbox allow-presentation allow-same-origin allow-scripts" | undefined;
+export declare const getIframeSandboxAttribute: (isTrusted: boolean) => string | undefined;
 export declare const handleOnClick: (handler: Function) => (e: React.BaseSyntheticEvent) => void;
 export declare const isIntersectionObserverSupported: () => boolean;
 export declare const sleep: (ms: number) => Promise<void>;

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

@@ -4,5 +4,6 @@ import { ActionProps } from '../types';
 export type ActionButtonProps = ActionProps & {
     iconAfter?: React.ReactChild;
     iconBefore?: React.ReactChild;
+    isLoading?: boolean;
     size: SmartLinkSize;
 };

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

@@ -3,6 +3,7 @@ export type ActionDropdownItemProps = {
     content?: React.ReactNode;
     iconAfter?: React.ReactNode;
     iconBefore?: React.ReactNode;
+    isLoading?: boolean;
     onClick: () => any;
     testId?: string;
 };

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

@@ -1,6 +1,6 @@
 /** @jsx jsx */
 import React from 'react';
-import { ActionProps } from './types';
+import { ActionProps, InternalActionProps } from './types';
 /**
  * A base action that can be triggered with an on click.
  * @internal
@@ -9,5 +9,5 @@ import { ActionProps } from './types';
  * @see EditAction
  * @see CustomAction
  */
-declare const Action: React.FC<ActionProps>;
+declare const Action: React.FC<ActionProps & InternalActionProps>;
 export default Action;

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

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

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

@@ -0,0 +1,6 @@
+import { ActionProps } from '../types';
+import { InvokeRequestWithCardDetails } from '../../../../../../state/hooks/use-invoke/types';
+export type ServerActionProps = Omit<ActionProps, 'onClick'> & {
+    action?: InvokeRequestWithCardDetails;
+    onClick?: ActionProps['onClick'];
+};

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

@@ -46,3 +46,15 @@ export type ActionProps = {
      */
     testId?: string;
 };
+/**
+ * The internal props that should only be controlled by internal components
+ * and/or used by experiment. If there is a use case where these props/feature
+ * should be available as part of smart-card, please move them to ActionProps.
+ */
+export type InternalActionProps = {
+    /**
+     * Conditionally show a spinner over the top of a button or disable a dropdown item
+     * while server action is executing.
+     */
+    isLoading?: boolean;
+};

package/dist/types-ts4.5/state/hooks/use-invoke/types.d.ts

@@ -17,11 +17,25 @@ export type CardDetails = {
      */
     previewData?: PreviewActionData | null;
 };
+/**
+ * Additional details to reload smart links
+ */
+export type InvokeReloadDetails = {
+    /**
+     * An identifier for Smart Link analytics
+     */
+    id?: string;
+    /**
+     * The URL of the Smart Link
+     */
+    url?: string;
+};
 /**
  * Invoke request with additional details for the component
  */
 export type InvokeRequestWithCardDetails = InvokeRequest & {
     details?: CardDetails;
+    reload?: InvokeReloadDetails;
 };
 /**
  * CRUD invoke requests for the component that support server actions

package/dist/types-ts4.5/utils/actions/create-invoke-request.d.ts

@@ -0,0 +1,3 @@
+import type { InvokeRequest } from '@atlaskit/linking-types/smart-link-actions';
+declare const createInvokeRequest: <TPayload extends object>(request: InvokeRequest, payload?: TPayload | undefined) => InvokeRequest<TPayload>;
+export default createInvokeRequest;

package/dist/types-ts4.5/utils/index.d.ts

@@ -16,7 +16,7 @@ export declare const isSpecialKey: (event: React.MouseEvent | React.KeyboardEven
 export declare const isSpecialClick: (event: React.MouseEvent) => boolean;
 export declare const getIconForFileType: (fileMimeType: string) => React.ReactNode | undefined;
 export declare const getLabelForFileType: (fileMimeType: string) => React.ReactNode | undefined;
-export declare const getIframeSandboxAttribute: (isTrusted: boolean) => "allow-downloads allow-forms allow-popups allow-popups-to-escape-sandbox allow-presentation allow-same-origin allow-scripts" | undefined;
+export declare const getIframeSandboxAttribute: (isTrusted: boolean) => string | undefined;
 export declare const handleOnClick: (handler: Function) => (e: React.BaseSyntheticEvent) => void;
 export declare const isIntersectionObserverSupported: () => boolean;
 export declare const sleep: (ms: number) => Promise<void>;

package/dist/types-ts4.5/view/FlexibleCard/components/actions/action/action-button/types.d.ts

@@ -4,5 +4,6 @@ import { ActionProps } from '../types';
 export type ActionButtonProps = ActionProps & {
     iconAfter?: React.ReactChild;
     iconBefore?: React.ReactChild;
+    isLoading?: boolean;
     size: SmartLinkSize;
 };

package/dist/types-ts4.5/view/FlexibleCard/components/actions/action/action-dropdown-item/types.d.ts

@@ -3,6 +3,7 @@ export type ActionDropdownItemProps = {
     content?: React.ReactNode;
     iconAfter?: React.ReactNode;
     iconBefore?: React.ReactNode;
+    isLoading?: boolean;
     onClick: () => any;
     testId?: string;
 };

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

@@ -1,6 +1,6 @@
 /** @jsx jsx */
 import React from 'react';
-import { ActionProps } from './types';
+import { ActionProps, InternalActionProps } from './types';
 /**
  * A base action that can be triggered with an on click.
  * @internal
@@ -9,5 +9,5 @@ import { ActionProps } from './types';
  * @see EditAction
  * @see CustomAction
  */
-declare const Action: React.FC<ActionProps>;
+declare const Action: React.FC<ActionProps & InternalActionProps>;
 export default Action;

package/dist/types-ts4.5/view/FlexibleCard/components/actions/action/server-action/index.d.ts

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

package/dist/types-ts4.5/view/FlexibleCard/components/actions/action/server-action/types.d.ts

@@ -0,0 +1,6 @@
+import { ActionProps } from '../types';
+import { InvokeRequestWithCardDetails } from '../../../../../../state/hooks/use-invoke/types';
+export type ServerActionProps = Omit<ActionProps, 'onClick'> & {
+    action?: InvokeRequestWithCardDetails;
+    onClick?: ActionProps['onClick'];
+};

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

@@ -46,3 +46,15 @@ export type ActionProps = {
      */
     testId?: string;
 };
+/**
+ * The internal props that should only be controlled by internal components
+ * and/or used by experiment. If there is a use case where these props/feature
+ * should be available as part of smart-card, please move them to ActionProps.
+ */
+export type InternalActionProps = {
+    /**
+     * Conditionally show a spinner over the top of a button or disable a dropdown item
+     * while server action is executing.
+     */
+    isLoading?: boolean;
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/smart-card",
-  "version": "26.22.0",
+  "version": "26.23.0",
   "description": "Smart card component",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -137,6 +137,9 @@
     "platform.linking-platform.smart-card.enable-block-card-clicks-opening-in-same-tab": {
       "type": "boolean"
     },
+    "platform.linking-platform.smart-card.follow-button": {
+      "type": "boolean"
+    },
     "platform.linking-platform.smart-card.should-call-onclick-in-warning-modal-only-when-safe": {
       "type": "boolean"
     },
@@ -148,6 +151,9 @@
     },
     "platform.linking-platform.smart-card.fix-is-trusted-pop": {
       "type": "boolean"
+    },
+    "platform.linking-platform.smart-card.iframes-allow-storage-access-by-user-activation": {
+      "type": "boolean"
     }
   },
   "prettier": "@atlassian/atlassian-frontend-prettier-config-1.0.1"