@atlaskit/editor-plugin-card 27.0.3 → 27.1.0

package/CHANGELOG.md

@@ -1,5 +1,28 @@
 # @atlaskit/editor-plugin-card
 
+## 27.1.0
+
+### Minor Changes
+
+- [`067939baaaeb9`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/067939baaaeb9) -
+  Fix the pre-auth value proposition modal in the `platform_sl_3p_preauth_value_modal` experiment
+  treatments behind `platform_sl_3p_preauth_value_modal_killswitch`:
+  - Allow titles to wrap in both treatment variants. Preserve the image variant's default height
+    while allowing taller text to reveal more of the centered illustration, keeping provider icons
+    aligned.
+  - Truncate long provider names in the Connect button so the Close button remains fully visible.
+  - Prevent editor floating toolbars from appearing above the modal using the existing `overlayOpen`
+    user intent, without layout effects that warn during server rendering.
+
+  In `@atlaskit/smart-card/pre-auth-value-proposition-modal`, `PreAuthValuePropositionModalProps`
+  adds optional `onOpenChange` to notify hosts when the modal opens, closes, or unmounts.
+  `@atlaskit/editor-plugin-card` adds an optional `UserIntentPlugin` integration and declares its
+  package dependency.
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 27.0.3
 
 ### Patch Changes

package/dist/cjs/cardPlugin.js

@@ -177,6 +177,7 @@ var cardPlugin = exports.cardPlugin = function cardPlugin(_ref2) {
       editorViewForPasteMenu = editorView;
       var breakoutEnabled = options.editorAppearance === 'full-page';
       return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, (0, _fg.fg)('platform_sl_3p_preauth_value_modal_killswitch') ? /*#__PURE__*/_react.default.createElement(_PreAuthValuePropositionModal.PreAuthValuePropositionModalListener, {
+        api: api,
         cardPluginEvents: cardPluginEvents
       }) : null, shouldRegisterPasteDisplayAsMenu && /*#__PURE__*/_react.default.createElement(PasteMenuSmartCardClientSync, {
         clientRef: pasteMenuSmartCardClientRef

package/dist/cjs/ui/PreAuthValuePropositionModal.js

@@ -29,11 +29,35 @@ var getNewSmartLinkUrl = function getNewSmartLinkUrl(event) {
   }
 };
 var ModalListener = function ModalListener(_ref) {
-  var cardPluginEvents = _ref.cardPluginEvents;
+  var api = _ref.api,
+    cardPluginEvents = _ref.cardPluginEvents;
   var _useState = (0, _react.useState)(),
     _useState2 = (0, _slicedToArray2.default)(_useState, 2),
     url = _useState2[0],
     setUrl = _useState2[1];
+  var _useState3 = (0, _react.useState)(false),
+    _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
+    isOpen = _useState4[0],
+    setIsOpen = _useState4[1];
+
+  // While the pre-auth modal is visible, use 'overlayOpen' to suppress the floating toolbar.
+  // Jira portals editor popups above its issue dialog, so the toolbar would otherwise appear
+  // above the modal blanket. Keep it available while link eligibility is still being checked.
+  // On close or unmount, restore the previous intent unless another interaction has changed it.
+  (0, _react.useEffect)(function () {
+    var _api$userIntent$share, _api$userIntent$share2;
+    if (!isOpen || !(api !== null && api !== void 0 && api.userIntent)) {
+      return;
+    }
+    var previousIntent = (_api$userIntent$share = (_api$userIntent$share2 = api.userIntent.sharedState.currentState()) === null || _api$userIntent$share2 === void 0 ? void 0 : _api$userIntent$share2.currentUserIntent) !== null && _api$userIntent$share !== void 0 ? _api$userIntent$share : 'default';
+    api.core.actions.execute(api.userIntent.commands.setCurrentUserIntent('overlayOpen'));
+    return function () {
+      var _api$userIntent;
+      if (((_api$userIntent = api.userIntent) === null || _api$userIntent === void 0 || (_api$userIntent = _api$userIntent.sharedState.currentState()) === null || _api$userIntent === void 0 ? void 0 : _api$userIntent.currentUserIntent) === 'overlayOpen') {
+        api.core.actions.execute(api.userIntent.commands.setCurrentUserIntent(previousIntent));
+      }
+    };
+  }, [api, isOpen]);
   (0, _react.useEffect)(function () {
     return cardPluginEvents.subscribe(function (event) {
       var newSmartLinkUrl = getNewSmartLinkUrl(event);
@@ -45,14 +69,16 @@ var ModalListener = function ModalListener(_ref) {
     });
   }, [cardPluginEvents]);
   var onFinished = (0, _react.useCallback)(function () {
-    return setUrl(undefined);
+    setIsOpen(false);
+    setUrl(undefined);
   }, []);
   return url ? /*#__PURE__*/_react.default.createElement(_react.Suspense, {
     fallback: null
   }, /*#__PURE__*/_react.default.createElement(PreAuthValuePropositionModal, {
     key: url,
     url: url,
-    onFinished: onFinished
+    onFinished: onFinished,
+    onOpenChange: setIsOpen
   })) : null;
 };
 var PreAuthValuePropositionModalListener = exports.PreAuthValuePropositionModalListener = /*#__PURE__*/_react.default.memo(ModalListener);

package/dist/es2019/cardPlugin.js

@@ -172,6 +172,7 @@ export const cardPlugin = ({
       editorViewForPasteMenu = editorView;
       const breakoutEnabled = options.editorAppearance === 'full-page';
       return /*#__PURE__*/React.createElement(React.Fragment, null, fg('platform_sl_3p_preauth_value_modal_killswitch') ? /*#__PURE__*/React.createElement(PreAuthValuePropositionModalListener, {
+        api: api,
         cardPluginEvents: cardPluginEvents
       }) : null, shouldRegisterPasteDisplayAsMenu && /*#__PURE__*/React.createElement(PasteMenuSmartCardClientSync, {
         clientRef: pasteMenuSmartCardClientRef

package/dist/es2019/ui/PreAuthValuePropositionModal.js

@@ -13,22 +13,47 @@ const getNewSmartLinkUrl = event => {
   }
 };
 const ModalListener = ({
+  api,
   cardPluginEvents
 }) => {
   const [url, setUrl] = useState();
+  const [isOpen, setIsOpen] = useState(false);
+
+  // While the pre-auth modal is visible, use 'overlayOpen' to suppress the floating toolbar.
+  // Jira portals editor popups above its issue dialog, so the toolbar would otherwise appear
+  // above the modal blanket. Keep it available while link eligibility is still being checked.
+  // On close or unmount, restore the previous intent unless another interaction has changed it.
+  useEffect(() => {
+    var _api$userIntent$share, _api$userIntent$share2;
+    if (!isOpen || !(api !== null && api !== void 0 && api.userIntent)) {
+      return;
+    }
+    const previousIntent = (_api$userIntent$share = (_api$userIntent$share2 = api.userIntent.sharedState.currentState()) === null || _api$userIntent$share2 === void 0 ? void 0 : _api$userIntent$share2.currentUserIntent) !== null && _api$userIntent$share !== void 0 ? _api$userIntent$share : 'default';
+    api.core.actions.execute(api.userIntent.commands.setCurrentUserIntent('overlayOpen'));
+    return () => {
+      var _api$userIntent, _api$userIntent$share3;
+      if (((_api$userIntent = api.userIntent) === null || _api$userIntent === void 0 ? void 0 : (_api$userIntent$share3 = _api$userIntent.sharedState.currentState()) === null || _api$userIntent$share3 === void 0 ? void 0 : _api$userIntent$share3.currentUserIntent) === 'overlayOpen') {
+        api.core.actions.execute(api.userIntent.commands.setCurrentUserIntent(previousIntent));
+      }
+    };
+  }, [api, isOpen]);
   useEffect(() => cardPluginEvents.subscribe(event => {
     const newSmartLinkUrl = getNewSmartLinkUrl(event);
     if (newSmartLinkUrl) {
       setUrl(currentUrl => currentUrl !== null && currentUrl !== void 0 ? currentUrl : newSmartLinkUrl);
     }
   }), [cardPluginEvents]);
-  const onFinished = useCallback(() => setUrl(undefined), []);
+  const onFinished = useCallback(() => {
+    setIsOpen(false);
+    setUrl(undefined);
+  }, []);
   return url ? /*#__PURE__*/React.createElement(Suspense, {
     fallback: null
   }, /*#__PURE__*/React.createElement(PreAuthValuePropositionModal, {
     key: url,
     url: url,
-    onFinished: onFinished
+    onFinished: onFinished,
+    onOpenChange: setIsOpen
   })) : null;
 };
 export const PreAuthValuePropositionModalListener = /*#__PURE__*/React.memo(ModalListener);

package/dist/esm/cardPlugin.js

@@ -169,6 +169,7 @@ export var cardPlugin = function cardPlugin(_ref2) {
       editorViewForPasteMenu = editorView;
       var breakoutEnabled = options.editorAppearance === 'full-page';
       return /*#__PURE__*/React.createElement(React.Fragment, null, fg('platform_sl_3p_preauth_value_modal_killswitch') ? /*#__PURE__*/React.createElement(PreAuthValuePropositionModalListener, {
+        api: api,
         cardPluginEvents: cardPluginEvents
       }) : null, shouldRegisterPasteDisplayAsMenu && /*#__PURE__*/React.createElement(PasteMenuSmartCardClientSync, {
         clientRef: pasteMenuSmartCardClientRef

package/dist/esm/ui/PreAuthValuePropositionModal.js

@@ -18,11 +18,35 @@ var getNewSmartLinkUrl = function getNewSmartLinkUrl(event) {
   }
 };
 var ModalListener = function ModalListener(_ref) {
-  var cardPluginEvents = _ref.cardPluginEvents;
+  var api = _ref.api,
+    cardPluginEvents = _ref.cardPluginEvents;
   var _useState = useState(),
     _useState2 = _slicedToArray(_useState, 2),
     url = _useState2[0],
     setUrl = _useState2[1];
+  var _useState3 = useState(false),
+    _useState4 = _slicedToArray(_useState3, 2),
+    isOpen = _useState4[0],
+    setIsOpen = _useState4[1];
+
+  // While the pre-auth modal is visible, use 'overlayOpen' to suppress the floating toolbar.
+  // Jira portals editor popups above its issue dialog, so the toolbar would otherwise appear
+  // above the modal blanket. Keep it available while link eligibility is still being checked.
+  // On close or unmount, restore the previous intent unless another interaction has changed it.
+  useEffect(function () {
+    var _api$userIntent$share, _api$userIntent$share2;
+    if (!isOpen || !(api !== null && api !== void 0 && api.userIntent)) {
+      return;
+    }
+    var previousIntent = (_api$userIntent$share = (_api$userIntent$share2 = api.userIntent.sharedState.currentState()) === null || _api$userIntent$share2 === void 0 ? void 0 : _api$userIntent$share2.currentUserIntent) !== null && _api$userIntent$share !== void 0 ? _api$userIntent$share : 'default';
+    api.core.actions.execute(api.userIntent.commands.setCurrentUserIntent('overlayOpen'));
+    return function () {
+      var _api$userIntent;
+      if (((_api$userIntent = api.userIntent) === null || _api$userIntent === void 0 || (_api$userIntent = _api$userIntent.sharedState.currentState()) === null || _api$userIntent === void 0 ? void 0 : _api$userIntent.currentUserIntent) === 'overlayOpen') {
+        api.core.actions.execute(api.userIntent.commands.setCurrentUserIntent(previousIntent));
+      }
+    };
+  }, [api, isOpen]);
   useEffect(function () {
     return cardPluginEvents.subscribe(function (event) {
       var newSmartLinkUrl = getNewSmartLinkUrl(event);
@@ -34,14 +58,16 @@ var ModalListener = function ModalListener(_ref) {
     });
   }, [cardPluginEvents]);
   var onFinished = useCallback(function () {
-    return setUrl(undefined);
+    setIsOpen(false);
+    setUrl(undefined);
   }, []);
   return url ? /*#__PURE__*/React.createElement(Suspense, {
     fallback: null
   }, /*#__PURE__*/React.createElement(PreAuthValuePropositionModal, {
     key: url,
     url: url,
-    onFinished: onFinished
+    onFinished: onFinished,
+    onOpenChange: setIsOpen
   })) : null;
 };
 export var PreAuthValuePropositionModalListener = /*#__PURE__*/React.memo(ModalListener);

package/dist/types/cardPluginType.d.ts

@@ -16,6 +16,7 @@ import type { GridPlugin } from '@atlaskit/editor-plugin-grid';
 import type { SelectionPlugin } from '@atlaskit/editor-plugin-selection';
 import type { ToolbarPlugin } from '@atlaskit/editor-plugin-toolbar';
 import type { UiControlRegistryPlugin } from '@atlaskit/editor-plugin-ui-control-registry';
+import type { UserIntentPlugin } from '@atlaskit/editor-plugin-user-intent/user-intent-plugin-type';
 import type { WidthPlugin } from '@atlaskit/editor-plugin-width';
 import type { CardPluginOptions, CardPluginState } from './types';
 type DummyAnnotationPlugin = NextEditorPlugin<'annotation', {
@@ -38,7 +39,8 @@ export type CardPluginDependencies = [
     OptionalPlugin<ConnectivityPlugin>,
     OptionalPlugin<BasePlugin>,
     OptionalPlugin<ToolbarPlugin>,
-    OptionalPlugin<UiControlRegistryPlugin>
+    OptionalPlugin<UiControlRegistryPlugin>,
+    OptionalPlugin<UserIntentPlugin>
 ];
 export type CardPlugin = NextEditorPlugin<'card', {
     actions: CardPluginActions;

package/dist/types/ui/PreAuthValuePropositionModal.d.ts

@@ -1,7 +1,10 @@
 import React from 'react';
+import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
+import type { CardPlugin } from '../cardPluginType';
 import type { EditorCardPluginEvents } from './analytics/create-events-queue';
 import type { CardPluginEvent } from './analytics/types';
 type PreAuthValuePropositionModalListenerProps = {
+    api?: ExtractInjectionAPI<CardPlugin>;
     cardPluginEvents: EditorCardPluginEvents<CardPluginEvent>;
 };
 export declare const PreAuthValuePropositionModalListener: React.MemoExoticComponent<(props: PreAuthValuePropositionModalListenerProps) => React.JSX.Element | null>;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-card",
-	"version": "27.0.3",
+	"version": "27.1.0",
 	"description": "Card plugin for @atlaskit/editor-core",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -40,6 +40,7 @@
 		"@atlaskit/editor-plugin-selection": "^21.0.0",
 		"@atlaskit/editor-plugin-toolbar": "^18.0.0",
 		"@atlaskit/editor-plugin-ui-control-registry": "^15.0.0",
+		"@atlaskit/editor-plugin-user-intent": "^19.0.0",
 		"@atlaskit/editor-plugin-width": "^22.0.0",
 		"@atlaskit/editor-prosemirror": "^9.0.0",
 		"@atlaskit/editor-shared-styles": "^4.3.0",
@@ -62,7 +63,7 @@
 		"@atlaskit/platform-feature-flags-react": "^1.2.0",
 		"@atlaskit/primitives": "^22.5.0",
 		"@atlaskit/prosemirror-history": "^1.2.0",
-		"@atlaskit/smart-card": "^46.0.0",
+		"@atlaskit/smart-card": "^46.1.0",
 		"@atlaskit/tmp-editor-statsig": "^208.0.0",
 		"@atlaskit/tokens": "^20.0.0",
 		"@babel/runtime": "^7.0.0",