@atlaskit/smart-card 43.25.14 → 43.25.15

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @atlaskit/smart-card
 
+## 43.25.15
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 43.25.14
 
 ### Patch Changes

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

@@ -11,7 +11,7 @@ var ANALYTICS_CHANNEL = exports.ANALYTICS_CHANNEL = 'media';
 var context = exports.context = {
   componentName: 'smart-cards',
   packageName: "@atlaskit/smart-card",
-  packageVersion: "43.25.13"
+  packageVersion: "43.25.14"
 };
 var TrackQuickActionType = exports.TrackQuickActionType = /*#__PURE__*/function (TrackQuickActionType) {
   TrackQuickActionType["StatusUpdate"] = "StatusUpdate";

package/dist/cjs/view/EmbedCard/components/Frame.js

@@ -12,6 +12,8 @@ var _runtime = require("@compiled/react/runtime");
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _react = _interopRequireWildcard(require("react"));
 var _reactMagneticDi = require("react-magnetic-di");
+var _browserApis = require("@atlaskit/browser-apis");
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _utils = require("../../../utils");
 var _IFrame = require("./IFrame");
 var _IframeDwellTracker = require("./IframeDwellTracker");
@@ -38,6 +40,7 @@ var Frame = exports.Frame = /*#__PURE__*/_react.default.forwardRef(function (_re
     onIframeFocus = _ref.onIframeFocus,
     title = _ref.title,
     extensionKey = _ref.extensionKey;
+  var doc = (0, _browserApis.getDocument)();
   var _useState = (0, _react.useState)(false),
     _useState2 = (0, _slicedToArray2.default)(_useState, 2),
     isIframeLoaded = _useState2[0],
@@ -84,8 +87,16 @@ var Frame = exports.Frame = /*#__PURE__*/_react.default.forwardRef(function (_re
   (0, _react.useEffect)(function () {
     var onBlur = function onBlur() {
       setWindowFocused(false);
-      if (document.activeElement === ref.current) {
-        onIframeFocus && onIframeFocus();
+      if ((0, _platformFeatureFlags.fg)('jpx-833-smart-links-graphql-provider')) {
+        if ((doc === null || doc === void 0 ? void 0 : doc.activeElement) === ref.current) {
+          onIframeFocus && onIframeFocus();
+        }
+      } else {
+        // The below will be removed as part of FG cleanup
+        // eslint-disable-next-line @atlaskit/platform/no-direct-document-usage
+        if (document.activeElement === ref.current) {
+          onIframeFocus && onIframeFocus();
+        }
       }
     };
     var onFocus = function onFocus() {
@@ -97,7 +108,7 @@ var Frame = exports.Frame = /*#__PURE__*/_react.default.forwardRef(function (_re
       window.removeEventListener('blur', onBlur);
       window.removeEventListener('focus', onFocus);
     };
-  }, [ref, onIframeFocus]);
+  }, [ref, onIframeFocus, doc]);
   if (!url) {
     return null;
   }
@@ -131,6 +142,7 @@ var Frame = exports.Frame = /*#__PURE__*/_react.default.forwardRef(function (_re
   }));
 });
 var FrameUpdated = exports.FrameUpdated = /*#__PURE__*/_react.default.forwardRef(function (_ref2, iframeRef) {
+  var _doc$hasFocus;
   var url = _ref2.url,
     _ref2$isTrusted = _ref2.isTrusted,
     isTrusted = _ref2$isTrusted === void 0 ? false : _ref2$isTrusted,
@@ -142,6 +154,7 @@ var FrameUpdated = exports.FrameUpdated = /*#__PURE__*/_react.default.forwardRef
     isMouseOverProp = _ref2.isMouseOver,
     title = _ref2.title,
     extensionKey = _ref2.extensionKey;
+  var doc = (0, _browserApis.getDocument)();
   var _useState1 = (0, _react.useState)(false),
     _useState10 = (0, _slicedToArray2.default)(_useState1, 2),
     isIframeLoaded = _useState10[0],
@@ -150,7 +163,16 @@ var FrameUpdated = exports.FrameUpdated = /*#__PURE__*/_react.default.forwardRef
     _useState12 = (0, _slicedToArray2.default)(_useState11, 2),
     isMouseOver = _useState12[0],
     setMouseOver = _useState12[1];
-  var _useState13 = (0, _react.useState)(document.hasFocus()),
+  // Accessing the document here for SSR where document.hasFocus may be absent breaks SSR
+  // when we're trying to load things like Loom frames in SSR
+  // We _could_ either throw a guard in here (i.e check for the existence of document)
+  // _or_
+  // we can default to false, and set this state once the frame ref is available in a useEffect (safer IMO)
+  // which already seems to be existing behavior in a useEffect below.
+  var _useState13 = (0, _react.useState)(
+    // The below will be removed as part of FG cleanup
+    // eslint-disable-next-line @atlaskit/platform/no-direct-document-usage
+    (0, _platformFeatureFlags.fg)('jpx-833-smart-links-graphql-provider') ? (_doc$hasFocus = doc === null || doc === void 0 ? void 0 : doc.hasFocus()) !== null && _doc$hasFocus !== void 0 ? _doc$hasFocus : false : document.hasFocus()),
     _useState14 = (0, _slicedToArray2.default)(_useState13, 2),
     isWindowFocused = _useState14[0],
     setWindowFocused = _useState14[1];
@@ -189,12 +211,23 @@ var FrameUpdated = exports.FrameUpdated = /*#__PURE__*/_react.default.forwardRef
     };
   }, [threshold, mergedRef]);
   (0, _react.useEffect)(function () {
+    var _doc$hasFocus2;
     // Initialize with current focus state
-    setWindowFocused(document.hasFocus());
+    // The below will be removed as part of FG cleanup
+    // eslint-disable-next-line @atlaskit/platform/no-direct-document-usage
+    setWindowFocused((0, _platformFeatureFlags.fg)('jpx-833-smart-links-graphql-provider') ? (_doc$hasFocus2 = doc === null || doc === void 0 ? void 0 : doc.hasFocus()) !== null && _doc$hasFocus2 !== void 0 ? _doc$hasFocus2 : false : document.hasFocus());
     var onBlur = function onBlur() {
       setWindowFocused(false);
-      if (document.activeElement === ref.current) {
-        onIframeFocus && onIframeFocus();
+      if ((0, _platformFeatureFlags.fg)('jpx-833-smart-links-graphql-provider')) {
+        if ((doc === null || doc === void 0 ? void 0 : doc.activeElement) === ref.current) {
+          onIframeFocus && onIframeFocus();
+        }
+      } else {
+        // The below will be removed as part of FG cleanup
+        // eslint-disable-next-line @atlaskit/platform/no-direct-document-usage
+        if (document.activeElement === ref.current) {
+          onIframeFocus && onIframeFocus();
+        }
       }
     };
     var onFocus = function onFocus() {
@@ -206,7 +239,7 @@ var FrameUpdated = exports.FrameUpdated = /*#__PURE__*/_react.default.forwardRef
       window.removeEventListener('blur', onBlur);
       window.removeEventListener('focus', onFocus);
     };
-  }, [ref, onIframeFocus]);
+  }, [ref, onIframeFocus, doc]);
   if (!url) {
     return null;
   }

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

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

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

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

package/dist/es2019/view/EmbedCard/components/Frame.js

@@ -6,6 +6,8 @@ import React, { useEffect, useRef, useState } from 'react';
 // eslint-disable-next-line no-unused-vars
 
 import { di } from 'react-magnetic-di';
+import { getDocument } from '@atlaskit/browser-apis';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { getIframeSandboxAttribute } from '../../../utils';
 import { IFrame } from './IFrame';
 import { IframeDwellTracker } from './IframeDwellTracker';
@@ -30,6 +32,7 @@ export const Frame = /*#__PURE__*/React.forwardRef(({
   title,
   extensionKey
 }, iframeRef) => {
+  const doc = getDocument();
   const [isIframeLoaded, setIframeLoaded] = useState(false);
   const [isMouseOver, setMouseOver] = useState(false);
   const [isWindowFocused, setWindowFocused] = useState(true);
@@ -62,8 +65,16 @@ export const Frame = /*#__PURE__*/React.forwardRef(({
   useEffect(() => {
     const onBlur = () => {
       setWindowFocused(false);
-      if (document.activeElement === ref.current) {
-        onIframeFocus && onIframeFocus();
+      if (fg('jpx-833-smart-links-graphql-provider')) {
+        if ((doc === null || doc === void 0 ? void 0 : doc.activeElement) === ref.current) {
+          onIframeFocus && onIframeFocus();
+        }
+      } else {
+        // The below will be removed as part of FG cleanup
+        // eslint-disable-next-line @atlaskit/platform/no-direct-document-usage
+        if (document.activeElement === ref.current) {
+          onIframeFocus && onIframeFocus();
+        }
       }
     };
     const onFocus = () => {
@@ -75,7 +86,7 @@ export const Frame = /*#__PURE__*/React.forwardRef(({
       window.removeEventListener('blur', onBlur);
       window.removeEventListener('focus', onFocus);
     };
-  }, [ref, onIframeFocus]);
+  }, [ref, onIframeFocus, doc]);
   if (!url) {
     return null;
   }
@@ -120,9 +131,20 @@ export const FrameUpdated = /*#__PURE__*/React.forwardRef(({
   title,
   extensionKey
 }, iframeRef) => {
+  var _doc$hasFocus;
+  const doc = getDocument();
   const [isIframeLoaded, setIframeLoaded] = useState(false);
   const [isMouseOver, setMouseOver] = useState(false);
-  const [isWindowFocused, setWindowFocused] = useState(document.hasFocus());
+  // Accessing the document here for SSR where document.hasFocus may be absent breaks SSR
+  // when we're trying to load things like Loom frames in SSR
+  // We _could_ either throw a guard in here (i.e check for the existence of document)
+  // _or_
+  // we can default to false, and set this state once the frame ref is available in a useEffect (safer IMO)
+  // which already seems to be existing behavior in a useEffect below.
+  const [isWindowFocused, setWindowFocused] = useState(
+  // The below will be removed as part of FG cleanup
+  // eslint-disable-next-line @atlaskit/platform/no-direct-document-usage
+  fg('jpx-833-smart-links-graphql-provider') ? (_doc$hasFocus = doc === null || doc === void 0 ? void 0 : doc.hasFocus()) !== null && _doc$hasFocus !== void 0 ? _doc$hasFocus : false : document.hasFocus());
 
   // Use prop if provided (from wrapper), otherwise use local state (for backward compatibility)
   const effectiveMouseOver = isMouseOverProp !== undefined ? isMouseOverProp : isMouseOver;
@@ -153,12 +175,23 @@ export const FrameUpdated = /*#__PURE__*/React.forwardRef(({
     };
   }, [threshold, mergedRef]);
   useEffect(() => {
+    var _doc$hasFocus2;
     // Initialize with current focus state
-    setWindowFocused(document.hasFocus());
+    // The below will be removed as part of FG cleanup
+    // eslint-disable-next-line @atlaskit/platform/no-direct-document-usage
+    setWindowFocused(fg('jpx-833-smart-links-graphql-provider') ? (_doc$hasFocus2 = doc === null || doc === void 0 ? void 0 : doc.hasFocus()) !== null && _doc$hasFocus2 !== void 0 ? _doc$hasFocus2 : false : document.hasFocus());
     const onBlur = () => {
       setWindowFocused(false);
-      if (document.activeElement === ref.current) {
-        onIframeFocus && onIframeFocus();
+      if (fg('jpx-833-smart-links-graphql-provider')) {
+        if ((doc === null || doc === void 0 ? void 0 : doc.activeElement) === ref.current) {
+          onIframeFocus && onIframeFocus();
+        }
+      } else {
+        // The below will be removed as part of FG cleanup
+        // eslint-disable-next-line @atlaskit/platform/no-direct-document-usage
+        if (document.activeElement === ref.current) {
+          onIframeFocus && onIframeFocus();
+        }
       }
     };
     const onFocus = () => {
@@ -170,7 +203,7 @@ export const FrameUpdated = /*#__PURE__*/React.forwardRef(({
       window.removeEventListener('blur', onBlur);
       window.removeEventListener('focus', onFocus);
     };
-  }, [ref, onIframeFocus]);
+  }, [ref, onIframeFocus, doc]);
   if (!url) {
     return null;
   }

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

@@ -12,7 +12,7 @@ import LinkWarningModal from './LinkWarningModal';
 import { useLinkWarningModal } from './LinkWarningModal/hooks/use-link-warning-modal';
 const PACKAGE_DATA = {
   packageName: "@atlaskit/smart-card",
-  packageVersion: "43.25.13",
+  packageVersion: "43.25.14",
   componentName: 'linkUrl'
 };
 const Anchor = withLinkClickedEvent('a');

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

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

package/dist/esm/view/EmbedCard/components/Frame.js

@@ -7,6 +7,8 @@ import React, { useEffect, useRef, useState } from 'react';
 // eslint-disable-next-line no-unused-vars
 
 import { di } from 'react-magnetic-di';
+import { getDocument } from '@atlaskit/browser-apis';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { getIframeSandboxAttribute } from '../../../utils';
 import { IFrame } from './IFrame';
 import { IframeDwellTracker } from './IframeDwellTracker';
@@ -31,6 +33,7 @@ export var Frame = /*#__PURE__*/React.forwardRef(function (_ref, iframeRef) {
     onIframeFocus = _ref.onIframeFocus,
     title = _ref.title,
     extensionKey = _ref.extensionKey;
+  var doc = getDocument();
   var _useState = useState(false),
     _useState2 = _slicedToArray(_useState, 2),
     isIframeLoaded = _useState2[0],
@@ -77,8 +80,16 @@ export var Frame = /*#__PURE__*/React.forwardRef(function (_ref, iframeRef) {
   useEffect(function () {
     var onBlur = function onBlur() {
       setWindowFocused(false);
-      if (document.activeElement === ref.current) {
-        onIframeFocus && onIframeFocus();
+      if (fg('jpx-833-smart-links-graphql-provider')) {
+        if ((doc === null || doc === void 0 ? void 0 : doc.activeElement) === ref.current) {
+          onIframeFocus && onIframeFocus();
+        }
+      } else {
+        // The below will be removed as part of FG cleanup
+        // eslint-disable-next-line @atlaskit/platform/no-direct-document-usage
+        if (document.activeElement === ref.current) {
+          onIframeFocus && onIframeFocus();
+        }
       }
     };
     var onFocus = function onFocus() {
@@ -90,7 +101,7 @@ export var Frame = /*#__PURE__*/React.forwardRef(function (_ref, iframeRef) {
       window.removeEventListener('blur', onBlur);
       window.removeEventListener('focus', onFocus);
     };
-  }, [ref, onIframeFocus]);
+  }, [ref, onIframeFocus, doc]);
   if (!url) {
     return null;
   }
@@ -124,6 +135,7 @@ export var Frame = /*#__PURE__*/React.forwardRef(function (_ref, iframeRef) {
   }));
 });
 export var FrameUpdated = /*#__PURE__*/React.forwardRef(function (_ref2, iframeRef) {
+  var _doc$hasFocus;
   var url = _ref2.url,
     _ref2$isTrusted = _ref2.isTrusted,
     isTrusted = _ref2$isTrusted === void 0 ? false : _ref2$isTrusted,
@@ -135,6 +147,7 @@ export var FrameUpdated = /*#__PURE__*/React.forwardRef(function (_ref2, iframeR
     isMouseOverProp = _ref2.isMouseOver,
     title = _ref2.title,
     extensionKey = _ref2.extensionKey;
+  var doc = getDocument();
   var _useState1 = useState(false),
     _useState10 = _slicedToArray(_useState1, 2),
     isIframeLoaded = _useState10[0],
@@ -143,7 +156,16 @@ export var FrameUpdated = /*#__PURE__*/React.forwardRef(function (_ref2, iframeR
     _useState12 = _slicedToArray(_useState11, 2),
     isMouseOver = _useState12[0],
     setMouseOver = _useState12[1];
-  var _useState13 = useState(document.hasFocus()),
+  // Accessing the document here for SSR where document.hasFocus may be absent breaks SSR
+  // when we're trying to load things like Loom frames in SSR
+  // We _could_ either throw a guard in here (i.e check for the existence of document)
+  // _or_
+  // we can default to false, and set this state once the frame ref is available in a useEffect (safer IMO)
+  // which already seems to be existing behavior in a useEffect below.
+  var _useState13 = useState(
+    // The below will be removed as part of FG cleanup
+    // eslint-disable-next-line @atlaskit/platform/no-direct-document-usage
+    fg('jpx-833-smart-links-graphql-provider') ? (_doc$hasFocus = doc === null || doc === void 0 ? void 0 : doc.hasFocus()) !== null && _doc$hasFocus !== void 0 ? _doc$hasFocus : false : document.hasFocus()),
     _useState14 = _slicedToArray(_useState13, 2),
     isWindowFocused = _useState14[0],
     setWindowFocused = _useState14[1];
@@ -182,12 +204,23 @@ export var FrameUpdated = /*#__PURE__*/React.forwardRef(function (_ref2, iframeR
     };
   }, [threshold, mergedRef]);
   useEffect(function () {
+    var _doc$hasFocus2;
     // Initialize with current focus state
-    setWindowFocused(document.hasFocus());
+    // The below will be removed as part of FG cleanup
+    // eslint-disable-next-line @atlaskit/platform/no-direct-document-usage
+    setWindowFocused(fg('jpx-833-smart-links-graphql-provider') ? (_doc$hasFocus2 = doc === null || doc === void 0 ? void 0 : doc.hasFocus()) !== null && _doc$hasFocus2 !== void 0 ? _doc$hasFocus2 : false : document.hasFocus());
     var onBlur = function onBlur() {
       setWindowFocused(false);
-      if (document.activeElement === ref.current) {
-        onIframeFocus && onIframeFocus();
+      if (fg('jpx-833-smart-links-graphql-provider')) {
+        if ((doc === null || doc === void 0 ? void 0 : doc.activeElement) === ref.current) {
+          onIframeFocus && onIframeFocus();
+        }
+      } else {
+        // The below will be removed as part of FG cleanup
+        // eslint-disable-next-line @atlaskit/platform/no-direct-document-usage
+        if (document.activeElement === ref.current) {
+          onIframeFocus && onIframeFocus();
+        }
       }
     };
     var onFocus = function onFocus() {
@@ -199,7 +232,7 @@ export var FrameUpdated = /*#__PURE__*/React.forwardRef(function (_ref2, iframeR
       window.removeEventListener('blur', onBlur);
       window.removeEventListener('focus', onFocus);
     };
-  }, [ref, onIframeFocus]);
+  }, [ref, onIframeFocus, doc]);
   if (!url) {
     return null;
   }

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

@@ -15,7 +15,7 @@ import LinkWarningModal from './LinkWarningModal';
 import { useLinkWarningModal } from './LinkWarningModal/hooks/use-link-warning-modal';
 var PACKAGE_DATA = {
   packageName: "@atlaskit/smart-card",
-  packageVersion: "43.25.13",
+  packageVersion: "43.25.14",
   componentName: 'linkUrl'
 };
 var Anchor = withLinkClickedEvent('a');

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/smart-card",
-	"version": "43.25.14",
+	"version": "43.25.15",
 	"description": "Smart card component",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -33,6 +33,7 @@
 		"@atlaskit/avatar": "^25.8.0",
 		"@atlaskit/avatar-group": "^12.4.0",
 		"@atlaskit/badge": "^18.4.0",
+		"@atlaskit/browser-apis": "^0.0.1",
 		"@atlaskit/button": "^23.10.0",
 		"@atlaskit/checkbox": "^17.3.0",
 		"@atlaskit/css": "^0.19.0",
@@ -72,7 +73,7 @@
 		"@atlaskit/textfield": "^8.2.0",
 		"@atlaskit/theme": "^22.0.0",
 		"@atlaskit/tile": "^1.0.0",
-		"@atlaskit/tmp-editor-statsig": "^33.0.0",
+		"@atlaskit/tmp-editor-statsig": "^34.0.0",
 		"@atlaskit/tokens": "^11.0.0",
 		"@atlaskit/tooltip": "^20.14.0",
 		"@atlaskit/ufo": "^0.4.0",
@@ -106,7 +107,7 @@
 		"@atlassian/a11y-jest-testing": "^0.11.0",
 		"@atlassian/analytics-tooling": "workspace:^",
 		"@atlassian/feature-flags-test-utils": "^1.0.0",
-		"@atlassian/gemini": "^1.35.0",
+		"@atlassian/gemini": "^1.36.0",
 		"@atlassian/testing-library": "^0.4.0",
 		"@testing-library/dom": "^10.1.0",
 		"@testing-library/jest-dom": "^6.4.5",
@@ -230,6 +231,9 @@
 		},
 		"platform_sl_3p_auth_rovo_action_kill_switch": {
 			"type": "boolean"
+		},
+		"jpx-833-smart-links-graphql-provider": {
+			"type": "boolean"
 		}
 	},
 	"compassUnitTestMetricSourceId": "ari:cloud:compass:a436116f-02ce-4520-8fbb-7301462a1674:metric-source/c5751cc6-3513-4070-9deb-af31e86aed34/f74ef1bc-7240-4aac-9dc8-9dc43b502089"