@atlaskit/smart-card 26.69.1 → 26.71.0

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

@@ -0,0 +1,60 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.AutomationModalHeader = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _reactIntlNext = require("react-intl-next");
+var _heading = _interopRequireDefault(require("@atlaskit/heading"));
+var _icon = _interopRequireDefault(require("@atlaskit/icon"));
+var _modalDialog = require("@atlaskit/modal-dialog");
+var _primitives = require("@atlaskit/primitives");
+var _colors = require("@atlaskit/theme/colors");
+var _menuContext = require("../../menu-context");
+var _manualTriggerIcon = require("./manual-trigger-icon");
+var i18n = (0, _reactIntlNext.defineMessages)({
+  modalHeaderIconLabel: {
+    id: 'automation-menu.modal.header.icon.label',
+    defaultMessage: 'Automation modal header icon',
+    description: 'A label for the icon in the header of the automation modal.'
+  }
+});
+var iconStyle = (0, _primitives.xcss)({
+  marginRight: 'space.150',
+  backgroundColor: 'color.background.accent.green.subtlest',
+  borderRadius: 'border.radius'
+});
+var modalDescriptionStyle = (0, _primitives.xcss)({
+  marginTop: 'space.150'
+});
+var AutomationModalHeader = exports.AutomationModalHeader = function AutomationModalHeader(_ref) {
+  var modalTitle = _ref.modalTitle,
+    modalDescription = _ref.modalDescription;
+  var _useIntl = (0, _reactIntlNext.useIntl)(),
+    formatMessage = _useIntl.formatMessage;
+  var _useAutomationMenu = (0, _menuContext.useAutomationMenu)(),
+    initialised = _useAutomationMenu.initialised,
+    rules = _useAutomationMenu.rules;
+  var _useModal = (0, _modalDialog.useModal)(),
+    titleId = _useModal.titleId;
+  var showDescription = initialised && rules.length > 0 && !!modalDescription;
+  return /*#__PURE__*/_react.default.createElement(_modalDialog.ModalHeader, null, /*#__PURE__*/_react.default.createElement(_primitives.Stack, null, /*#__PURE__*/_react.default.createElement(_primitives.Inline, {
+    alignBlock: "center"
+  }, /*#__PURE__*/_react.default.createElement(_primitives.Box, {
+    xcss: iconStyle,
+    paddingInline: "space.050",
+    paddingBlock: "space.025"
+  }, /*#__PURE__*/_react.default.createElement(_icon.default, {
+    size: "small",
+    glyph: _manualTriggerIcon.ManualTriggerGlyph,
+    label: formatMessage(i18n.modalHeaderIconLabel),
+    primaryColor: "var(--ds-icon-accent-green, ".concat(_colors.G50, ")")
+  })), /*#__PURE__*/_react.default.createElement(_heading.default, {
+    level: "h600",
+    id: titleId
+  }, modalTitle)), showDescription && /*#__PURE__*/_react.default.createElement(_primitives.Box, {
+    xcss: modalDescriptionStyle
+  }, modalDescription)));
+};

package/dist/cjs/view/FlexibleCard/components/actions/automation-action/automation-manual-triggers/manual-triggers-modal/sub-components/header/manual-trigger-icon/index.js

@@ -0,0 +1,29 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.ManualTriggerGlyph = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _react = _interopRequireDefault(require("react"));
+var ManualTriggerGlyph = exports.ManualTriggerGlyph = function ManualTriggerGlyph(props) {
+  return /*#__PURE__*/_react.default.createElement("svg", (0, _extends2.default)({}, props, {
+    width: 24,
+    viewBox: "0 0 24 24"
+  }), /*#__PURE__*/_react.default.createElement("path", {
+    d: "m21.192 19.778-4.9498-4.9498c-0.3905-0.3905-1.0237-0.3905-1.4142 0-0.3905 0.3906-0.3905 1.0237 0 1.4143l4.9498 4.9497c0.3905 0.3905 1.0237 0.3905 1.4142 0s0.3905-1.0237 0-1.4142z",
+    fill: "currentColor"
+  }), /*#__PURE__*/_react.default.createElement("path", {
+    d: "m8.7738 8.1319 11.685 4.305c0.2591 0.0955 0.3917 0.3829 0.2963 0.6421-0.025 0.0679-0.0645 0.1295-0.1156 0.1807l-7.3802 7.3801c-0.1952 0.1953-0.5118 0.1953-0.7071 0-0.0511-0.0512-0.0906-0.1128-0.1156-0.1807l-4.3051-11.685c-0.09546-0.25911 0.03721-0.54656 0.29632-0.64202 0.11157-0.0411 0.23414-0.0411 0.34571 0z",
+    clipRule: "evenodd",
+    fill: "currentColor",
+    fillRule: "evenodd"
+  }), /*#__PURE__*/_react.default.createElement("path", {
+    d: "m4.2218 4.2218c1.9526-1.9526 5.1184-1.9526 7.0711 0 0.5977 0.59776 1.0125 1.3092 1.2443 2.0648 0.1974 0.6437-0.4389 1.1502-1.0873 0.96899l-0.2172-0.06069c-0.3475-0.09709-0.6037-0.38008-0.7563-0.70702-0.1439-0.30836-0.3432-0.59728-0.59773-0.85184-1.1716-1.1716-3.0711-1.1716-4.2426 0-1.1716 1.1716-1.1716 3.0711 0 4.2426 0.2547 0.25469 0.54381 0.45399 0.85236 0.59799 0.32725 0.1527 0.61051 0.4091 0.70752 0.7569l0.06045 0.2168c0.18082 0.6483-0.32561 1.2843-0.96914 1.087-0.75578-0.2317-1.4675-0.6466-2.0654-1.2445-1.9526-1.9526-1.9526-5.1184 0-7.071z",
+    clipRule: "evenodd",
+    fill: "currentColor",
+    fillRule: "evenodd"
+  }));
+};
+var _default = exports.default = ManualTriggerGlyph;

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

@@ -0,0 +1,12 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "AutomationModalRule", {
+  enumerable: true,
+  get: function get() {
+    return _main.AutomationModalRule;
+  }
+});
+var _main = require("./main");

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

@@ -0,0 +1,69 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.AutomationModalRule = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _analyticsNext = require("@atlaskit/analytics-next");
+var _menu = require("@atlaskit/menu");
+var _primitives = require("@atlaskit/primitives");
+var _spinner = _interopRequireDefault(require("@atlaskit/spinner"));
+var _menuContext = require("../../menu-context");
+var ruleButtonStyle = (0, _primitives.xcss)({
+  borderColor: 'color.border',
+  borderStyle: 'solid',
+  borderWidth: 'border.width',
+  borderRadius: 'border.radius'
+});
+var selectedRuleButtonStyle = (0, _primitives.xcss)({
+  backgroundColor: 'color.background.accent.blue.subtlest',
+  borderColor: 'color.border.accent.blue',
+  borderStyle: 'solid',
+  borderWidth: 'border.width.outline',
+  borderRadius: 'border.radius'
+});
+var ruleNameStyle = (0, _primitives.xcss)({
+  // Using this to increase the height of the button itself.
+  height: '28px'
+});
+var AutomationModalRule = exports.AutomationModalRule = function AutomationModalRule(_ref) {
+  var rule = _ref.rule,
+    selectedRule = _ref.selectedRule,
+    setSelectedRule = _ref.setSelectedRule;
+  var _useAnalyticsEvents = (0, _analyticsNext.useAnalyticsEvents)(),
+    createAnalyticsEvent = _useAnalyticsEvents.createAnalyticsEvent;
+  var _useAutomationMenu = (0, _menuContext.useAutomationMenu)(),
+    analyticsSource = _useAutomationMenu.analyticsSource,
+    invokingRuleId = _useAutomationMenu.invokingRuleId;
+  var isSelectedRule = (selectedRule === null || selectedRule === void 0 ? void 0 : selectedRule.id) === rule.id;
+  var isExecuting = rule.id === invokingRuleId;
+  var ruleOnClick = function ruleOnClick() {
+    createAnalyticsEvent({
+      type: 'sendUIEvent',
+      data: {
+        action: 'clicked',
+        actionSubject: 'button',
+        actionSubjectId: 'selectManualTriggerAutomation',
+        source: analyticsSource,
+        attributes: {
+          ruleId: rule.id.toString()
+        }
+      }
+    }).fire();
+    setSelectedRule(rule);
+  };
+  return /*#__PURE__*/_react.default.createElement(_primitives.Box, {
+    xcss: isSelectedRule ? selectedRuleButtonStyle : ruleButtonStyle
+  }, /*#__PURE__*/_react.default.createElement(_menu.ButtonItem, {
+    isDisabled: !!invokingRuleId,
+    iconBefore: isExecuting ? /*#__PURE__*/_react.default.createElement(_spinner.default, {
+      size: "small"
+    }) : null,
+    onClick: ruleOnClick
+  }, /*#__PURE__*/_react.default.createElement(_primitives.Stack, {
+    xcss: ruleNameStyle,
+    alignBlock: "center"
+  }, rule.name)));
+};

package/dist/cjs/view/FlexibleCard/components/actions/automation-action/automation-manual-triggers/manual-triggers-modal/sub-components/rule-list/index.js

@@ -0,0 +1,12 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "AutomationModalRuleList", {
+  enumerable: true,
+  get: function get() {
+    return _main.AutomationModalRuleList;
+  }
+});
+var _main = require("./main");

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

@@ -0,0 +1,32 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.AutomationModalRuleList = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _menu = require("@atlaskit/menu");
+var _primitives = require("@atlaskit/primitives");
+var _menuContext = require("../../menu-context");
+var _emptyState = require("../empty-state");
+var _rule = require("../rule");
+var AutomationModalRuleList = exports.AutomationModalRuleList = function AutomationModalRuleList(_ref) {
+  var selectedRule = _ref.selectedRule,
+    setSelectedRule = _ref.setSelectedRule;
+  var _useAutomationMenu = (0, _menuContext.useAutomationMenu)(),
+    rules = _useAutomationMenu.rules;
+  if (rules.length === 0) {
+    return /*#__PURE__*/_react.default.createElement(_emptyState.AutomationModalEmptyState, null);
+  }
+  return /*#__PURE__*/_react.default.createElement(_menu.MenuGroup, null, /*#__PURE__*/_react.default.createElement(_primitives.Stack, {
+    space: "space.050"
+  }, rules.map(function (rule) {
+    return /*#__PURE__*/_react.default.createElement(_rule.AutomationModalRule, {
+      key: "manual-rule-".concat(rule.id),
+      rule: rule,
+      selectedRule: selectedRule,
+      setSelectedRule: setSelectedRule
+    });
+  })));
+};

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

@@ -0,0 +1,12 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "Skeleton", {
+  enumerable: true,
+  get: function get() {
+    return _main.Skeleton;
+  }
+});
+var _main = require("./main");

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

@@ -0,0 +1,86 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Skeleton = void 0;
+var _react = require("@emotion/react");
+var _colors = require("@atlaskit/theme/colors");
+/** @jsx jsx */
+
+var AutomationSkeletonContainer = (0, _react.css)({
+  paddingBlock: "var(--ds-space-025, 2px)"
+});
+var SkeletonContainer = (0, _react.css)({
+  marginBlock: "var(--ds-space-100, 8px)",
+  marginInline: "var(--ds-space-250, 20px)",
+  display: 'flex'
+});
+var SkeletonIcon = (0, _react.css)({
+  width: "var(--ds-space-200, 16px)",
+  height: "var(--ds-space-200, 16px)",
+  display: 'inline-block',
+  borderRadius: "var(--ds-space-025, 2px)",
+  backgroundColor: 'currentColor',
+  border: "var(--ds-space-025, 2px)".concat(" solid transparent"),
+  opacity: 0.15
+});
+var MenuIcon = (0, _react.css)({
+  width: '24px',
+  height: '24px',
+  display: 'flex',
+  justifyContent: 'center',
+  alignItems: 'center'
+});
+var shimmer = (0, _react.keyframes)({
+  '0%': {
+    backgroundPosition: '-300px 0'
+  },
+  '100%': {
+    backgroundPosition: '2000px 0'
+  }
+});
+var SkeletonText = (0, _react.css)({
+  width: '85%',
+  height: "var(--ds-space-200, 16px)",
+  marginTop: "var(--ds-space-050, 4px)",
+  marginLeft: "var(--ds-space-150, 12px)",
+  animationDuration: '1s',
+  animationFillMode: 'forwards',
+  animationIterationCount: 'infinite',
+  animationName: shimmer,
+  animationTimingFunction: 'linear',
+  backgroundColor: "var(--ds-skeleton, ".concat(_colors.N30, ")"),
+  backgroundImage: "linear-gradient(to right, ".concat("var(--ds-skeleton, ".concat(_colors.N30, ")"), " 10%, ", "var(--ds-skeleton-subtle, ".concat(_colors.N20, ")"), " 30%, ", "var(--ds-skeleton, ".concat(_colors.N30, ")"), " 50%)"),
+  backgroundRepeat: 'no-repeat'
+});
+var SkeletonLine = function SkeletonLine() {
+  return (0, _react.jsx)("div", {
+    css: SkeletonContainer
+  }, (0, _react.jsx)("div", {
+    css: MenuIcon
+  }, (0, _react.jsx)("div", {
+    css: SkeletonIcon
+  })), (0, _react.jsx)("div", {
+    css: SkeletonText
+  }));
+};
+var getSkeletonLines = function getSkeletonLines(lineCount) {
+  var skeletonLines = [];
+  for (var i = 0; i < lineCount; i++) {
+    skeletonLines.push((0, _react.jsx)(SkeletonLine, {
+      key: "skeleton-line-".concat(i)
+    }));
+  }
+  return skeletonLines;
+};
+var Skeleton = exports.Skeleton = function Skeleton(props) {
+  var _props$lineCount = props.lineCount,
+    lineCount = _props$lineCount === void 0 ? 5 : _props$lineCount;
+  return (
+    // eslint-disable-next-line @atlaskit/design-system/use-primitives
+    (0, _react.jsx)("div", {
+      css: AutomationSkeletonContainer
+    }, getSkeletonLines(lineCount))
+  );
+};

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

@@ -1,11 +1,11 @@
 "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 _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _react = _interopRequireWildcard(require("react"));
@@ -15,32 +15,57 @@ var _action = _interopRequireDefault(require("../action"));
 var _flexibleUiContext = require("../../../../../state/flexible-ui-context");
 var _constants = require("../../../../../constants");
 var _messages = require("../../../../../messages");
+var _linkProvider = require("@atlaskit/link-provider");
 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 && Object.prototype.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; }
-// import { useSmartLinkContext } from '../../../../../../../link-provider/src';
-
+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 && Object.prototype.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 AutomationModal = /*#__PURE__*/(0, _react.lazy)(function () {
+  return Promise.resolve().then(function () {
+    return _interopRequireWildcard(require( /* webpackChunkName: "@atlaskit-internal_smart-card-automation-modal" */'./automation-manual-triggers/manual-triggers-modal'));
+  });
+});
 var handleAutomateActionClick = function handleAutomateActionClick(setIsModalOpen) {
   setIsModalOpen(true);
 };
+var handleAutomationActionClose = function handleAutomationActionClose(setIsModalOpen) {
+  setIsModalOpen(false);
+};
 var AutomationAction = function AutomationAction(props) {
-  var _context$actions;
+  var _ref, _context$actions;
   var _useState = (0, _react.useState)(false),
     _useState2 = (0, _slicedToArray2.default)(_useState, 2),
-    _isModalOpen = _useState2[0],
+    isModalOpen = _useState2[0],
     setIsModalOpen = _useState2[1];
   var _useIntl = (0, _reactIntlNext.useIntl)(),
     formatMessage = _useIntl.formatMessage;
-  // const { connections } = useSmartLinkContext();
-
-  // const env = connections.client.envKey ?? 'prod';
+  var smartLinkContext = (0, _linkProvider.useSmartLinkContext)();
+  var connections = smartLinkContext.connections;
+  var environment = (_ref = connections.client.envKey) !== null && _ref !== void 0 ? _ref : 'prod';
   var context = (0, _flexibleUiContext.useFlexibleUiContext)();
-  var data = context === null || context === void 0 || (_context$actions = context.actions) === null || _context$actions === void 0 ? void 0 : _context$actions[_constants.ActionName.AutomationAction];
-  if (!data) {
+  var automationActionData = context === null || context === void 0 || (_context$actions = context.actions) === null || _context$actions === void 0 ? void 0 : _context$actions[_constants.ActionName.AutomationAction];
+  if (!automationActionData) {
     return null;
   }
+  var baseAutomationUrl = automationActionData.baseAutomationUrl,
+    objectName = automationActionData.objectName,
+    objectAri = automationActionData.objectAri,
+    siteAri = automationActionData.siteAri,
+    canManageAutomation = automationActionData.canManageAutomation,
+    analyticsSource = automationActionData.analyticsSource,
+    modalTitle = automationActionData.modalTitle,
+    modalDescription = automationActionData.modalDescription;
   var automationActionTitle = /*#__PURE__*/_react.default.createElement(_reactIntlNext.FormattedMessage, _messages.messages.automation_action_title);
   var automationActionTooltip = /*#__PURE__*/_react.default.createElement(_reactIntlNext.FormattedMessage, _messages.messages.automation_action_tooltip);
   var automationActionIconLabel = formatMessage(_messages.messages.automation_action_icon_label);
+  var automationModalTitle = /*#__PURE__*/_react.default.createElement(_reactIntlNext.FormattedMessage, modalTitle);
+  var automationModalDescription = /*#__PURE__*/_react.default.createElement(_reactIntlNext.FormattedMessage, (0, _extends2.default)({}, modalDescription, {
+    values: {
+      name: objectName,
+      b: function b(chunks) {
+        return /*#__PURE__*/_react.default.createElement("strong", null, chunks);
+      },
+      br: /*#__PURE__*/_react.default.createElement("br", null)
+    }
+  }));
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_action.default, (0, _extends2.default)({
     content: automationActionTitle,
     icon: /*#__PURE__*/_react.default.createElement(_manaulTriggersIcon.default, {
@@ -48,10 +73,27 @@ var AutomationAction = function AutomationAction(props) {
     }),
     testId: "smart-action-automation-action",
     tooltipMessage: automationActionTooltip
-  }, data, props, {
+  }, automationActionData, props, {
     onClick: function onClick() {
       return handleAutomateActionClick(setIsModalOpen);
     }
+  })), isModalOpen &&
+  /*#__PURE__*/
+  // TODO skeleton modal fallback
+  _react.default.createElement(_react.Suspense, {
+    fallback: false
+  }, /*#__PURE__*/_react.default.createElement(AutomationModal, {
+    environment: environment,
+    baseAutomationUrl: baseAutomationUrl,
+    objectAri: objectAri,
+    siteAri: siteAri,
+    canManageAutomation: canManageAutomation,
+    analyticsSource: analyticsSource,
+    modalTitle: automationModalTitle,
+    modalDescription: automationModalDescription,
+    onClose: function onClose() {
+      return handleAutomationActionClose(setIsModalOpen);
+    }
   })));
 };
 var _default = exports.default = AutomationAction;

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

@@ -56,6 +56,13 @@ var ActionBlock = function ActionBlock(_ref) {
     _useState2 = (0, _slicedToArray2.default)(_useState, 2),
     message = _useState2[0],
     setMessage = _useState2[1];
+  var _useState3 = (0, _react2.useState)(false),
+    _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
+    isLoading = _useState4[0],
+    setIsLoading = _useState4[1];
+  var onLoadingChange = (0, _react2.useCallback)(function (isLoading) {
+    setIsLoading(isLoading);
+  }, [setIsLoading]);
   var padding = !(ui !== null && ui !== void 0 && ui.hidePadding) ? (0, _utils.getPrimitivesPaddingSpaceBySize)((ui === null || ui === void 0 ? void 0 : ui.size) || _constants.SmartLinkSize.Medium) : undefined;
   var _onClick = (0, _react2.useCallback)(function (name) {
     setMessage(undefined);
@@ -80,13 +87,15 @@ var ActionBlock = function ActionBlock(_ref) {
           return _onClick(name);
         },
         onError: onError,
+        onLoadingChange: onLoadingChange,
         size: size,
         xcss: (0, _primitives.xcss)({
           paddingInline: padding
-        })
+        }),
+        hideTooltip: isLoading
       }) : null;
     });
-  }, [context === null || context === void 0 ? void 0 : context.actions, _onClick, onError, padding, size, spaceInline]);
+  }, [context === null || context === void 0 ? void 0 : context.actions, _onClick, onError, padding, size, spaceInline, isLoading, onLoadingChange]);
   return actions ? (0, _react.jsx)("div", {
     css: ignoreContainerPaddingStyles,
     ref: blockRef,

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

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

package/dist/es2019/extractors/flexible/actions/extract-automation-action.js

@@ -23,7 +23,7 @@ const getProductData = meta => {
   return ProductData === null || ProductData === void 0 ? void 0 : (_ProductData$product = ProductData[product]) === null || _ProductData$product === void 0 ? void 0 : _ProductData$product[resourceType];
 };
 export const extractAutomationAction = response => {
-  if (!getBooleanFF('platform.linking-platfom.smart-card.confluence.page.automation-action') || !response.data) {
+  if (!getBooleanFF('platform.linking-platfom.smart-card.confluence.page.automation-action_xcdoi') || !response.data) {
     return undefined;
   }
   const data = response.data;

package/dist/es2019/messages.js

@@ -67,7 +67,7 @@ export const messages = defineMessages({
   },
   automation_action_title: {
     id: 'fabric.linking.automation-action.title',
-    defaultMessage: 'Run automation...',
+    defaultMessage: 'View automation rules...',
     description: 'The title of the button in a hover card to open an automation menu for a given SmartLink.'
   },
   automation_action_icon_label: {
@@ -77,7 +77,7 @@ export const messages = defineMessages({
   },
   automation_action_tooltip: {
     id: 'fabric.linking.automation-action.tooltip',
-    defaultMessage: 'Open an automation modal',
+    defaultMessage: 'Select an automation rule to run',
     description: 'The tooltip for the automation action indicating that a button will open an automation modal.'
   },
   automation_action_confluence_page_modal_title: {

package/dist/es2019/state/hooks/use-ai-summary/ai-summary-service/index.js

@@ -1,13 +1,13 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import uuid from 'uuid';
 import { errorMessages } from './types';
-import { addPath } from './utils';
+import { addPath, getXProductHeaderValue } from './utils';
 import { readStream } from './readStream';
 import { getBaseUrl } from '@atlaskit/linking-common';
 import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 export class AISummaryService {
   constructor(props) {
-    var _props$product;
+    var _getXProductHeaderVal;
     _defineProperty(this, "state", {
       content: '',
       status: 'ready'
@@ -52,7 +52,7 @@ export class AISummaryService {
       headers: {
         'Content-Type': 'application/json;charset=UTF-8',
         'x-experience-id': 'smart-link',
-        'x-product': ((_props$product = props.product) === null || _props$product === void 0 ? void 0 : _props$product.toLowerCase()) || 'confluence',
+        'x-product': ((_getXProductHeaderVal = getXProductHeaderValue(props.product)) === null || _getXProductHeaderVal === void 0 ? void 0 : _getXProductHeaderVal.toLowerCase()) || 'confluence',
         ...props.headers
       }
     };

package/dist/es2019/state/hooks/use-ai-summary/ai-summary-service/utils.js

@@ -9,4 +9,34 @@ export const addPath = (baseUrl, path) => {
   const pathWithoutLeadingSlash = !path.startsWith('/') ? path : path.substring(1, path.length);
   const url = [urlWithTrailingSlash, pathWithoutLeadingSlash].join('');
   return url;
+};
+
+/**
+ * Subset of a map of Jira `ProductTypes` to AI Mate expected values
+ * See for more info: https://atlassian.slack.com/archives/C066UP0G0G3/p1716341647677829?thread_ts=1716338063.255939&cid=C066UP0G0G3
+ */
+const AiMateJiraXProduct = {
+  JSM: 'JSM',
+  JSW: 'JIRA-SOFTWARE',
+  JWM: 'JIRA-CORE',
+  JPD: 'JPD'
+};
+/**
+ * Checks if `product` is a Jira related product.
+ */
+const isJiraProduct = product => {
+  const JIRA_PRODUCTS = ['JPD', 'JSM', 'JSW', 'JWM'];
+  return product !== undefined && JIRA_PRODUCTS.includes(product);
+};
+
+/**
+ * Converts a `ProductType` to the expected `x-product` header value for AI Mate.
+ *
+ * @see https://developer.atlassian.com/platform/assistance-service/security/entitlements/#approach
+ */
+export const getXProductHeaderValue = product => {
+  if (isJiraProduct(product)) {
+    return AiMateJiraXProduct[product];
+  }
+  return product;
 };

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

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

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

@@ -0,0 +1,79 @@
+import _extends from "@babel/runtime/helpers/extends";
+import { xcss } from '@atlaskit/primitives';
+import { Box, Inline } from '@atlaskit/primitives';
+import Spinner from '@atlaskit/spinner';
+import React, { useCallback } from 'react';
+import { getPrimitivesInlineSpaceBySize } from '../../../utils';
+import ActionIcon from '../action-icon';
+const buttonStyles = xcss({
+  all: 'unset',
+  cursor: 'pointer',
+  padding: 'space.050',
+  width: '100%',
+  ':focus:not(:focus-visible)': {
+    outline: 'none'
+  },
+  ':focus': {
+    outlineColor: 'color.border.focused',
+    // xcss outlineOffset does not support space.negative.025
+    // @ts-ignore-next-line TS2322: Type "var(--ds-space-negative-025)" is not assignable to type
+    outlineOffset: "var(--ds-space-negative-025, -2px)",
+    outlineStyle: 'solid',
+    outlineWidth: 'border.width.outline'
+  },
+  ':hover': {
+    backgroundColor: 'color.background.neutral.subtle.hovered'
+  },
+  ':active': {
+    backgroundColor: 'color.background.neutral.subtle.pressed'
+  }
+});
+const contentStyles = xcss({
+  color: 'color.text',
+  // Replace with font token once it becomes stable (currently alpha)
+  // font: 'font.body.small',
+  fontSize: '12px',
+  fontStyle: 'normal',
+  fontWeight: '400',
+  lineHeight: '20px'
+});
+const ActionButton = ({
+  content,
+  icon: iconOption,
+  isDisabled,
+  isLoading,
+  onClick: onClickCallback,
+  size,
+  space: spaceOption,
+  testId,
+  tooltipProps,
+  xcss
+}) => {
+  const space = spaceOption !== null && spaceOption !== void 0 ? spaceOption : getPrimitivesInlineSpaceBySize(size);
+  const onClick = useCallback(() => {
+    if (!isDisabled && !isLoading && onClickCallback) {
+      onClickCallback();
+    }
+  }, [isDisabled, isLoading, onClickCallback]);
+  const icon = iconOption && isLoading ? /*#__PURE__*/React.createElement(ActionIcon, {
+    asStackItemIcon: true,
+    icon: /*#__PURE__*/React.createElement(Spinner, {
+      testId: `${testId}-loading`
+    }),
+    size: size
+  }) : iconOption;
+  return /*#__PURE__*/React.createElement(Box, _extends({
+    as: "button",
+    xcss: [buttonStyles, xcss]
+  }, tooltipProps, {
+    onClick: onClick,
+    testId: testId
+  }), /*#__PURE__*/React.createElement(Inline, {
+    alignBlock: "center",
+    grow: "fill",
+    space: space
+  }, icon, /*#__PURE__*/React.createElement(Box, {
+    xcss: contentStyles
+  }, content)));
+};
+export default ActionButton;