@atlaskit/editor-plugin-card 6.3.2 → 6.4.0

package/CHANGELOG.md

@@ -1,5 +1,41 @@
 # @atlaskit/editor-plugin-card
 
+## 6.4.0
+
+### Minor Changes
+
+- [#161266](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/161266)
+  [`3eb1f4c974f21`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/3eb1f4c974f21) -
+  Improved load performance by moving recalculate logic on interaction
+
+### Patch Changes
+
+- Updated dependencies
+
+## 6.3.3
+
+### Patch Changes
+
+- [#159655](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/159655)
+  [`24f8c627d50f2`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/24f8c627d50f2) - ##
+  WHAT? Remove experimental graceful edit mode from view mode plugin and associated props.
+
+  ## WHY?
+
+  This experiment is being cleaned up and we are no longer proceeding in this direction.
+
+  ## HOW to adjust?
+
+  This experiment was only enabled for Confluence and should not have been enabled in other places.
+  If for some reason any of the following props/state/methdos were used please remove them:
+
+  - isConsumption
+  - contentMode
+  - initialContentMode
+  - updateContentMode
+
+- Updated dependencies
+
 ## 6.3.2
 
 ### Patch Changes

package/compass.yml

@@ -1,3 +1,4 @@
+id: 'ari:cloud:compass:a436116f-02ce-4520-8fbb-7301462a1674:component/c5751cc6-3513-4070-9deb-af31e86aed34/b3ffe2fd-7f29-4a07-81cd-67c57914ec9a'
 name: '@atlaskit/editor-plugin-card'
 description: |-
   This is an editor plugin for Atlassian's rich text editor that enables support for "smart cards" and advanced linking features within the editor. It integrates with the Atlassian linking platform to allow users to insert, display, and interact with rich link previews (smart cards) directly in the editor surface.
@@ -18,11 +19,18 @@ links:
   - name: '#help-twg-linking-platform'
     type: CHAT_CHANNEL
     url: 'https://atlassian.enterprise.slack.com/archives/CFKGAQZRV'
-  - name: null
+  - name: ''
     type: ON_CALL
     url: 'https://atlassian.app.opsgenie.com/settings/schedule/detail/b9c8b313-dd6d-4a41-8eeb-d7a9df55be9d'
   - name: source code
     type: REPOSITORY
-    url: 'https://bitbucket.org/atlassian/atlassian-frontend/src/master/packages/editor/editor-plugin-card'
+    url: 'https://bitbucket.org/atlassian/atlassian-frontend-monorepo/src/master/platform/packages/editor/editor-plugin-card'
 customFields: []
-relationships: {}
+relationships:
+  DEPENDS_ON:
+    - 'ari:cloud:compass:a436116f-02ce-4520-8fbb-7301462a1674:component/c5751cc6-3513-4070-9deb-af31e86aed34/27e8ffab-42db-4c16-9afb-9eefd72d02ec' # link-analytics
+    - 'ari:cloud:compass:a436116f-02ce-4520-8fbb-7301462a1674:component/c5751cc6-3513-4070-9deb-af31e86aed34/37dc08cd-d81c-4bbb-9b26-5d6d8a417ea3' # link-client-extension
+    - 'ari:cloud:compass:a436116f-02ce-4520-8fbb-7301462a1674:component/c5751cc6-3513-4070-9deb-af31e86aed34/2833bb40-a2e4-4b79-b74b-147d0d23fdb1' # link-datasource
+    - 'ari:cloud:compass:a436116f-02ce-4520-8fbb-7301462a1674:component/c5751cc6-3513-4070-9deb-af31e86aed34/18157dad-b7fb-4cde-8b74-e905b5757611' # link-provider
+    - 'ari:cloud:compass:a436116f-02ce-4520-8fbb-7301462a1674:component/c5751cc6-3513-4070-9deb-af31e86aed34/3d229125-4f9d-4091-a303-84ae4eb643fb' # linking-common
+    - 'ari:cloud:compass:a436116f-02ce-4520-8fbb-7301462a1674:component/c5751cc6-3513-4070-9deb-af31e86aed34/c9898540-33b1-4cd4-9399-16e575bcedae' # smart-card

package/dist/cjs/nodeviews/inlineCard.js

@@ -21,7 +21,6 @@ var _state = require("@atlaskit/editor-prosemirror/state");
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _smartCard = require("@atlaskit/smart-card");
 var _ssr = require("@atlaskit/smart-card/ssr");
-var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
 var _actions = require("../pm-plugins/actions");
 var _utils = require("../pm-plugins/utils");
 var _ConfigureOverlay = _interopRequireDefault(require("../ui/ConfigureOverlay"));
@@ -230,7 +229,7 @@ function InlineCardNodeView(props) {
     appearance: "inline"
     // Ignored via go/ees005
     // eslint-disable-next-line react/jsx-props-no-spreading
-  }, enableInlineUpgradeFeatures && (0, _utils.getAwarenessProps)(view.state, getPos, allowEmbeds, allowBlockCards, !(0, _experiments.editorExperiment)('live_pages_graceful_edit', 'control') ? true : mode === 'view'))), (0, _platformFeatureFlags.fg)('prompt_whiteboard_competitor_link_gate') && CompetitorPromptComponent);
+  }, enableInlineUpgradeFeatures && (0, _utils.getAwarenessProps)(view.state, getPos, allowEmbeds, allowBlockCards, mode === 'view'))), (0, _platformFeatureFlags.fg)('prompt_whiteboard_competitor_link_gate') && CompetitorPromptComponent);
 }
 var inlineCardNodeView = exports.inlineCardNodeView = function inlineCardNodeView(_ref2) {
   var inlineCardViewProducer = _ref2.inlineCardViewProducer;

package/dist/cjs/ui/OpenButtonOverlay/index.js

@@ -15,6 +15,7 @@ var _messages = require("@atlaskit/editor-common/messages");
 var _linkExternal = _interopRequireDefault(require("@atlaskit/icon/core/link-external"));
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _primitives = require("@atlaskit/primitives");
+var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
 var _toolbar = require("../toolbar");
 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; }
@@ -98,19 +99,23 @@ var OpenButtonOverlay = function OpenButtonOverlay(_ref) {
     setHovered = _useState4[1];
   var openTextWidthRef = (0, _react.useRef)(DEFAULT_OPEN_TEXT_WIDTH);
   (0, _react.useLayoutEffect)(function () {
-    var hiddenText = hiddenTextRef.current;
-    if (!hiddenText) {
-      return;
-    }
-    // Measure the width of the hidden text
-    // Temporarily make the element visible to measure its width
-    hiddenText.style.visibility = 'hidden';
-    hiddenText.style.display = 'inline';
-    openTextWidthRef.current = hiddenText.offsetWidth;
+    if ((0, _experiments.editorExperiment)('platform_editor_smart_card_open_overlay_perf', false, {
+      exposure: true
+    })) {
+      var hiddenText = hiddenTextRef.current;
+      if (!hiddenText) {
+        return;
+      }
+      // Measure the width of the hidden text
+      // Temporarily make the element visible to measure its width
+      hiddenText.style.visibility = 'hidden';
+      hiddenText.style.display = 'inline';
+      openTextWidthRef.current = hiddenText.offsetWidth;
 
-    // Reset the hiddenText's display property
-    hiddenText.style.display = 'none';
-    hiddenText.style.visibility = 'inherit';
+      // Reset the hiddenText's display property
+      hiddenText.style.display = 'none';
+      hiddenText.style.visibility = 'inherit';
+    }
   }, []);
   (0, _react.useLayoutEffect)(function () {
     var _containerRef$current, _openButtonRef$curren;
@@ -119,6 +124,28 @@ var OpenButtonOverlay = function OpenButtonOverlay(_ref) {
     }
     var cardWidth = (_containerRef$current = containerRef.current) === null || _containerRef$current === void 0 ? void 0 : _containerRef$current.offsetWidth;
     var openButtonWidth = (_openButtonRef$curren = openButtonRef.current) === null || _openButtonRef$curren === void 0 ? void 0 : _openButtonRef$curren.offsetWidth;
+
+    // Get the hidden text width
+    if ((0, _experiments.editorExperiment)('platform_editor_smart_card_open_overlay_perf', true, {
+      exposure: true
+    })) {
+      if (!openTextWidthRef.current) {
+        var hiddenText = hiddenTextRef.current;
+        if (!hiddenText) {
+          return;
+        }
+
+        // Measure the width of the hidden text
+        // Temporarily make the element visible to measure its width
+        hiddenText.style.visibility = 'hidden';
+        hiddenText.style.display = 'inline';
+        openTextWidthRef.current = hiddenText.offsetWidth;
+
+        // Reset the hiddenText's display property
+        hiddenText.style.display = 'none';
+        hiddenText.style.visibility = 'inherit';
+      }
+    }
     if (!cardWidth || !openButtonWidth) {
       return;
     }

package/dist/es2019/nodeviews/inlineCard.js

@@ -10,7 +10,6 @@ import { NodeSelection } from '@atlaskit/editor-prosemirror/state';
 import { fg } from '@atlaskit/platform-feature-flags';
 import { Card as SmartCard } from '@atlaskit/smart-card';
 import { CardSSR } from '@atlaskit/smart-card/ssr';
-import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import { registerCard, removeCard } from '../pm-plugins/actions';
 import { getAwarenessProps } from '../pm-plugins/utils';
 import OverlayWrapper from '../ui/ConfigureOverlay';
@@ -224,7 +223,7 @@ export function InlineCardNodeView(props) {
     appearance: "inline"
     // Ignored via go/ees005
     // eslint-disable-next-line react/jsx-props-no-spreading
-  }, enableInlineUpgradeFeatures && getAwarenessProps(view.state, getPos, allowEmbeds, allowBlockCards, !editorExperiment('live_pages_graceful_edit', 'control') ? true : mode === 'view'))), fg('prompt_whiteboard_competitor_link_gate') && CompetitorPromptComponent);
+  }, enableInlineUpgradeFeatures && getAwarenessProps(view.state, getPos, allowEmbeds, allowBlockCards, mode === 'view'))), fg('prompt_whiteboard_competitor_link_gate') && CompetitorPromptComponent);
 }
 export const inlineCardNodeView = ({
   inlineCardViewProducer

package/dist/es2019/ui/OpenButtonOverlay/index.js

@@ -13,6 +13,7 @@ import { cardMessages } from '@atlaskit/editor-common/messages';
 import LinkExternalIcon from '@atlaskit/icon/core/link-external';
 import { fg } from '@atlaskit/platform-feature-flags';
 import { Anchor, Box, Text, xcss } from '@atlaskit/primitives';
+import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import { visitCardLinkAnalyticsOnly } from '../toolbar';
 const containerStyles = css({
   position: 'relative'
@@ -78,19 +79,23 @@ const OpenButtonOverlay = ({
   const [isHovered, setHovered] = useState(false);
   const openTextWidthRef = useRef(DEFAULT_OPEN_TEXT_WIDTH);
   useLayoutEffect(() => {
-    const hiddenText = hiddenTextRef.current;
-    if (!hiddenText) {
-      return;
-    }
-    // Measure the width of the hidden text
-    // Temporarily make the element visible to measure its width
-    hiddenText.style.visibility = 'hidden';
-    hiddenText.style.display = 'inline';
-    openTextWidthRef.current = hiddenText.offsetWidth;
+    if (editorExperiment('platform_editor_smart_card_open_overlay_perf', false, {
+      exposure: true
+    })) {
+      const hiddenText = hiddenTextRef.current;
+      if (!hiddenText) {
+        return;
+      }
+      // Measure the width of the hidden text
+      // Temporarily make the element visible to measure its width
+      hiddenText.style.visibility = 'hidden';
+      hiddenText.style.display = 'inline';
+      openTextWidthRef.current = hiddenText.offsetWidth;
 
-    // Reset the hiddenText's display property
-    hiddenText.style.display = 'none';
-    hiddenText.style.visibility = 'inherit';
+      // Reset the hiddenText's display property
+      hiddenText.style.display = 'none';
+      hiddenText.style.visibility = 'inherit';
+    }
   }, []);
   useLayoutEffect(() => {
     var _containerRef$current, _openButtonRef$curren;
@@ -99,6 +104,28 @@ const OpenButtonOverlay = ({
     }
     const cardWidth = (_containerRef$current = containerRef.current) === null || _containerRef$current === void 0 ? void 0 : _containerRef$current.offsetWidth;
     const openButtonWidth = (_openButtonRef$curren = openButtonRef.current) === null || _openButtonRef$curren === void 0 ? void 0 : _openButtonRef$curren.offsetWidth;
+
+    // Get the hidden text width
+    if (editorExperiment('platform_editor_smart_card_open_overlay_perf', true, {
+      exposure: true
+    })) {
+      if (!openTextWidthRef.current) {
+        const hiddenText = hiddenTextRef.current;
+        if (!hiddenText) {
+          return;
+        }
+
+        // Measure the width of the hidden text
+        // Temporarily make the element visible to measure its width
+        hiddenText.style.visibility = 'hidden';
+        hiddenText.style.display = 'inline';
+        openTextWidthRef.current = hiddenText.offsetWidth;
+
+        // Reset the hiddenText's display property
+        hiddenText.style.display = 'none';
+        hiddenText.style.visibility = 'inherit';
+      }
+    }
     if (!cardWidth || !openButtonWidth) {
       return;
     }

package/dist/esm/nodeviews/inlineCard.js

@@ -11,7 +11,6 @@ import { NodeSelection } from '@atlaskit/editor-prosemirror/state';
 import { fg } from '@atlaskit/platform-feature-flags';
 import { Card as SmartCard } from '@atlaskit/smart-card';
 import { CardSSR } from '@atlaskit/smart-card/ssr';
-import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import { registerCard, removeCard } from '../pm-plugins/actions';
 import { getAwarenessProps } from '../pm-plugins/utils';
 import OverlayWrapper from '../ui/ConfigureOverlay';
@@ -218,7 +217,7 @@ export function InlineCardNodeView(props) {
     appearance: "inline"
     // Ignored via go/ees005
     // eslint-disable-next-line react/jsx-props-no-spreading
-  }, enableInlineUpgradeFeatures && getAwarenessProps(view.state, getPos, allowEmbeds, allowBlockCards, !editorExperiment('live_pages_graceful_edit', 'control') ? true : mode === 'view'))), fg('prompt_whiteboard_competitor_link_gate') && CompetitorPromptComponent);
+  }, enableInlineUpgradeFeatures && getAwarenessProps(view.state, getPos, allowEmbeds, allowBlockCards, mode === 'view'))), fg('prompt_whiteboard_competitor_link_gate') && CompetitorPromptComponent);
 }
 export var inlineCardNodeView = function inlineCardNodeView(_ref2) {
   var inlineCardViewProducer = _ref2.inlineCardViewProducer;

package/dist/esm/ui/OpenButtonOverlay/index.js

@@ -14,6 +14,7 @@ import { cardMessages } from '@atlaskit/editor-common/messages';
 import LinkExternalIcon from '@atlaskit/icon/core/link-external';
 import { fg } from '@atlaskit/platform-feature-flags';
 import { Anchor, Box, Text, xcss } from '@atlaskit/primitives';
+import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import { visitCardLinkAnalyticsOnly } from '../toolbar';
 var containerStyles = css({
   position: 'relative'
@@ -84,19 +85,23 @@ var OpenButtonOverlay = function OpenButtonOverlay(_ref) {
     setHovered = _useState4[1];
   var openTextWidthRef = useRef(DEFAULT_OPEN_TEXT_WIDTH);
   useLayoutEffect(function () {
-    var hiddenText = hiddenTextRef.current;
-    if (!hiddenText) {
-      return;
-    }
-    // Measure the width of the hidden text
-    // Temporarily make the element visible to measure its width
-    hiddenText.style.visibility = 'hidden';
-    hiddenText.style.display = 'inline';
-    openTextWidthRef.current = hiddenText.offsetWidth;
+    if (editorExperiment('platform_editor_smart_card_open_overlay_perf', false, {
+      exposure: true
+    })) {
+      var hiddenText = hiddenTextRef.current;
+      if (!hiddenText) {
+        return;
+      }
+      // Measure the width of the hidden text
+      // Temporarily make the element visible to measure its width
+      hiddenText.style.visibility = 'hidden';
+      hiddenText.style.display = 'inline';
+      openTextWidthRef.current = hiddenText.offsetWidth;
 
-    // Reset the hiddenText's display property
-    hiddenText.style.display = 'none';
-    hiddenText.style.visibility = 'inherit';
+      // Reset the hiddenText's display property
+      hiddenText.style.display = 'none';
+      hiddenText.style.visibility = 'inherit';
+    }
   }, []);
   useLayoutEffect(function () {
     var _containerRef$current, _openButtonRef$curren;
@@ -105,6 +110,28 @@ var OpenButtonOverlay = function OpenButtonOverlay(_ref) {
     }
     var cardWidth = (_containerRef$current = containerRef.current) === null || _containerRef$current === void 0 ? void 0 : _containerRef$current.offsetWidth;
     var openButtonWidth = (_openButtonRef$curren = openButtonRef.current) === null || _openButtonRef$curren === void 0 ? void 0 : _openButtonRef$curren.offsetWidth;
+
+    // Get the hidden text width
+    if (editorExperiment('platform_editor_smart_card_open_overlay_perf', true, {
+      exposure: true
+    })) {
+      if (!openTextWidthRef.current) {
+        var hiddenText = hiddenTextRef.current;
+        if (!hiddenText) {
+          return;
+        }
+
+        // Measure the width of the hidden text
+        // Temporarily make the element visible to measure its width
+        hiddenText.style.visibility = 'hidden';
+        hiddenText.style.display = 'inline';
+        openTextWidthRef.current = hiddenText.offsetWidth;
+
+        // Reset the hiddenText's display property
+        hiddenText.style.display = 'none';
+        hiddenText.style.visibility = 'inherit';
+      }
+    }
     if (!cardWidth || !openButtonWidth) {
       return;
     }

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-card",
-	"version": "6.3.2",
+	"version": "6.4.0",
 	"description": "Card plugin for @atlaskit/editor-core",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -37,13 +37,13 @@
 		"@atlaskit/analytics-next": "^11.0.0",
 		"@atlaskit/button": "^23.2.0",
 		"@atlaskit/custom-steps": "^0.11.0",
-		"@atlaskit/editor-common": "^105.8.0",
+		"@atlaskit/editor-common": "^105.11.0",
 		"@atlaskit/editor-plugin-analytics": "^2.3.0",
 		"@atlaskit/editor-plugin-base": "^3.0.0",
 		"@atlaskit/editor-plugin-connectivity": "^2.0.0",
 		"@atlaskit/editor-plugin-decorations": "^2.0.0",
 		"@atlaskit/editor-plugin-editor-disabled": "^2.0.0",
-		"@atlaskit/editor-plugin-editor-viewmode": "^3.1.0",
+		"@atlaskit/editor-plugin-editor-viewmode": "^4.0.0",
 		"@atlaskit/editor-plugin-feature-flags": "^1.4.0",
 		"@atlaskit/editor-plugin-floating-toolbar": "^4.1.0",
 		"@atlaskit/editor-plugin-grid": "^2.0.0",
@@ -51,7 +51,7 @@
 		"@atlaskit/editor-prosemirror": "7.0.0",
 		"@atlaskit/editor-shared-styles": "^3.4.0",
 		"@atlaskit/frontend-utilities": "^3.0.0",
-		"@atlaskit/icon": "^26.1.0",
+		"@atlaskit/icon": "^26.4.0",
 		"@atlaskit/link": "^3.2.0",
 		"@atlaskit/link-analytics": "^10.0.0",
 		"@atlaskit/link-client-extension": "^5.0.0",
@@ -61,9 +61,9 @@
 		"@atlaskit/menu": "^8.0.0",
 		"@atlaskit/platform-feature-flags": "^1.1.0",
 		"@atlaskit/primitives": "^14.8.0",
-		"@atlaskit/smart-card": "^38.4.0",
+		"@atlaskit/smart-card": "^38.5.0",
 		"@atlaskit/theme": "^18.0.0",
-		"@atlaskit/tmp-editor-statsig": "^4.24.0",
+		"@atlaskit/tmp-editor-statsig": "^5.2.0",
 		"@atlaskit/tokens": "^4.9.0",
 		"@babel/runtime": "^7.0.0",
 		"@emotion/react": "^11.7.1",
@@ -73,7 +73,7 @@
 		"uuid": "^3.1.0"
 	},
 	"peerDependencies": {
-		"@atlaskit/link-provider": "^3.0.0",
+		"@atlaskit/link-provider": "^3.1.0",
 		"react": "^18.2.0",
 		"react-intl-next": "npm:react-intl@^5.18.1"
 	},
@@ -173,5 +173,6 @@
 		"no-unused-dependencies": {
 			"checkDevDependencies": true
 		}
-	}
+	},
+	"compassUnitTestMetricSourceId": "ari:cloud:compass:a436116f-02ce-4520-8fbb-7301462a1674:metric-source/c5751cc6-3513-4070-9deb-af31e86aed34/e6f3220b-0ca2-445a-a4c5-78cff6ca2a34"
 }