@atlaskit/smart-card 40.20.1 → 40.20.3

package/CHANGELOG.md

@@ -1,5 +1,19 @@
 # @atlaskit/smart-card
 
+## 40.20.3
+
+### Patch Changes
+
+- [`6012c22dec4c0`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/6012c22dec4c0) -
+  Follow-up on the revert for PR #20864 to prevent Confluence SSR issue
+
+## 40.20.2
+
+### Patch Changes
+
+- [`3f4271f8a0790`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/3f4271f8a0790) -
+  Replace LP-CC-EMBED iframe with embedded confluence iframe
+
 ## 40.20.1
 
 ### Patch Changes

package/dist/cjs/hooks/useConfluencePageData.js

@@ -0,0 +1,103 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.userType = exports.useConfluencePageData = exports.EMBEDDED_CONFLUENCE_MODE = exports.CONFLUENCE_EXTENSION_KEYS = void 0;
+var _react = require("react");
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
+var _tokens = require("@atlaskit/tokens");
+var userType = exports.userType = /*#__PURE__*/function (userType) {
+  userType["ATLASSIAN_ACCOUNT"] = "atlassianAccount";
+  userType["HASHED_EMAIL"] = "hashedEmail";
+  userType["LOOM"] = "loom";
+  userType["TRELLO"] = "trello";
+  userType["OPSGENIE"] = "opsgenie";
+  userType["JA_USER_ID"] = "jiraAlign";
+  userType["HALP"] = "halp";
+  return userType;
+}({});
+var EMBEDDED_CONFLUENCE_MODE = exports.EMBEDDED_CONFLUENCE_MODE = /*#__PURE__*/function (EMBEDDED_CONFLUENCE_MODE) {
+  EMBEDDED_CONFLUENCE_MODE["VIEW_MODE"] = "view";
+  EMBEDDED_CONFLUENCE_MODE["EDIT_MODE"] = "edit";
+  return EMBEDDED_CONFLUENCE_MODE;
+}({});
+var CONFLUENCE_EXTENSION_KEYS = exports.CONFLUENCE_EXTENSION_KEYS = /*#__PURE__*/function (CONFLUENCE_EXTENSION_KEYS) {
+  CONFLUENCE_EXTENSION_KEYS["PAGE"] = "integration-confluence-object-provider";
+  CONFLUENCE_EXTENSION_KEYS["CANVAS"] = "canvas-native-object-provider";
+  return CONFLUENCE_EXTENSION_KEYS;
+}({});
+var useConfluencePageData = exports.useConfluencePageData = function useConfluencePageData(url, extensionKey) {
+  var parsedData = (0, _react.useMemo)(function () {
+    if (!(0, _platformFeatureFlags.fg)('platform_deprecate_lp_cc_embed')) {
+      return undefined;
+    }
+    if (!url || typeof url !== 'string' || !url.startsWith('http://') && !url.startsWith('https://') || !extensionKey || !Object.values(CONFLUENCE_EXTENSION_KEYS).find(function (key) {
+      return key === extensionKey;
+    })) {
+      return undefined;
+    }
+    var urlObj;
+    try {
+      urlObj = new URL(url);
+    } catch (_unused) {
+      return undefined;
+    }
+    var _urlObj = urlObj,
+      searchParams = _urlObj.searchParams,
+      hash = _urlObj.hash;
+    var hostname = (searchParams === null || searchParams === void 0 ? void 0 : searchParams.get('hostname')) || '';
+    var contentId = (searchParams === null || searchParams === void 0 ? void 0 : searchParams.get('contentId')) || '';
+    var spaceKey = (searchParams === null || searchParams === void 0 ? void 0 : searchParams.get('spaceKey')) || '';
+
+    // Early return for invalid URLs
+    if (!contentId || !hostname) {
+      return undefined;
+    }
+    var themeState = (searchParams === null || searchParams === void 0 ? void 0 : searchParams.get('themeState')) || '';
+    var themeMode = searchParams === null || searchParams === void 0 ? void 0 : searchParams.get('themeMode');
+    var enableInlineComments = (searchParams === null || searchParams === void 0 ? void 0 : searchParams.get('enableInlineComments')) === 'true';
+    var enablePageComments = (searchParams === null || searchParams === void 0 ? void 0 : searchParams.get('enablePageComments')) === 'true';
+    var userId = (searchParams === null || searchParams === void 0 ? void 0 : searchParams.get('userId')) || '';
+    var userIdType = (searchParams === null || searchParams === void 0 ? void 0 : searchParams.get('userInfo')) || undefined;
+    var parentProduct = (searchParams === null || searchParams === void 0 ? void 0 : searchParams.get('parentProduct')) || '';
+    var inlineComments = enableInlineComments ? ['inline-comments'] : [];
+    var pageComments = enablePageComments ? ['page-comments'] : [];
+
+    // Calculate theme state object here
+    var calculatedThemeStateObject;
+    if (themeState) {
+      calculatedThemeStateObject = (0, _tokens.themeStringToObject)(decodeURIComponent(themeState));
+    } else if (themeMode) {
+      calculatedThemeStateObject = {
+        colorMode: themeMode
+      };
+    }
+    return {
+      hostname: hostname,
+      spaceKey: spaceKey,
+      contentId: contentId,
+      parentProduct: parentProduct,
+      userId: userId,
+      userIdType: userIdType,
+      hash: hash || '',
+      enableInlineComments: enableInlineComments,
+      enablePageComments: enablePageComments,
+      themeStateObject: calculatedThemeStateObject,
+      allowedFeatures: {
+        edit: ['delete-draft'],
+        view: ['byline-contributors', 'byline-extensions', 'page-reactions'].concat(pageComments, inlineComments)
+      },
+      mode: EMBEDDED_CONFLUENCE_MODE.VIEW_MODE,
+      locale: 'en'
+    };
+  }, [url, extensionKey]);
+
+  // Handle theme side effect - only when theme object changes
+  (0, _react.useEffect)(function () {
+    if (parsedData !== null && parsedData !== void 0 && parsedData.themeStateObject) {
+      (0, _tokens.setGlobalTheme)(parsedData.themeStateObject);
+    }
+  }, [parsedData === null || parsedData === void 0 ? void 0 : parsedData.themeStateObject]);
+  return parsedData;
+};

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: "40.20.0"
+  packageVersion: "0.0.0-development"
 };
 var TrackQuickActionType = exports.TrackQuickActionType = /*#__PURE__*/function (TrackQuickActionType) {
   TrackQuickActionType["StatusUpdate"] = "StatusUpdate";

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

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

package/dist/es2019/hooks/useConfluencePageData.js

@@ -0,0 +1,96 @@
+import { useEffect, useMemo } from 'react';
+import { fg } from '@atlaskit/platform-feature-flags';
+import { setGlobalTheme, themeStringToObject } from '@atlaskit/tokens';
+export let userType = /*#__PURE__*/function (userType) {
+  userType["ATLASSIAN_ACCOUNT"] = "atlassianAccount";
+  userType["HASHED_EMAIL"] = "hashedEmail";
+  userType["LOOM"] = "loom";
+  userType["TRELLO"] = "trello";
+  userType["OPSGENIE"] = "opsgenie";
+  userType["JA_USER_ID"] = "jiraAlign";
+  userType["HALP"] = "halp";
+  return userType;
+}({});
+export let EMBEDDED_CONFLUENCE_MODE = /*#__PURE__*/function (EMBEDDED_CONFLUENCE_MODE) {
+  EMBEDDED_CONFLUENCE_MODE["VIEW_MODE"] = "view";
+  EMBEDDED_CONFLUENCE_MODE["EDIT_MODE"] = "edit";
+  return EMBEDDED_CONFLUENCE_MODE;
+}({});
+export let CONFLUENCE_EXTENSION_KEYS = /*#__PURE__*/function (CONFLUENCE_EXTENSION_KEYS) {
+  CONFLUENCE_EXTENSION_KEYS["PAGE"] = "integration-confluence-object-provider";
+  CONFLUENCE_EXTENSION_KEYS["CANVAS"] = "canvas-native-object-provider";
+  return CONFLUENCE_EXTENSION_KEYS;
+}({});
+export const useConfluencePageData = (url, extensionKey) => {
+  const parsedData = useMemo(() => {
+    if (!fg('platform_deprecate_lp_cc_embed')) {
+      return undefined;
+    }
+    if (!url || typeof url !== 'string' || !url.startsWith('http://') && !url.startsWith('https://') || !extensionKey || !Object.values(CONFLUENCE_EXTENSION_KEYS).find(key => key === extensionKey)) {
+      return undefined;
+    }
+    let urlObj;
+    try {
+      urlObj = new URL(url);
+    } catch {
+      return undefined;
+    }
+    const {
+      searchParams,
+      hash
+    } = urlObj;
+    const hostname = (searchParams === null || searchParams === void 0 ? void 0 : searchParams.get('hostname')) || '';
+    const contentId = (searchParams === null || searchParams === void 0 ? void 0 : searchParams.get('contentId')) || '';
+    const spaceKey = (searchParams === null || searchParams === void 0 ? void 0 : searchParams.get('spaceKey')) || '';
+
+    // Early return for invalid URLs
+    if (!contentId || !hostname) {
+      return undefined;
+    }
+    const themeState = (searchParams === null || searchParams === void 0 ? void 0 : searchParams.get('themeState')) || '';
+    const themeMode = searchParams === null || searchParams === void 0 ? void 0 : searchParams.get('themeMode');
+    const enableInlineComments = (searchParams === null || searchParams === void 0 ? void 0 : searchParams.get('enableInlineComments')) === 'true';
+    const enablePageComments = (searchParams === null || searchParams === void 0 ? void 0 : searchParams.get('enablePageComments')) === 'true';
+    const userId = (searchParams === null || searchParams === void 0 ? void 0 : searchParams.get('userId')) || '';
+    const userIdType = (searchParams === null || searchParams === void 0 ? void 0 : searchParams.get('userInfo')) || undefined;
+    const parentProduct = (searchParams === null || searchParams === void 0 ? void 0 : searchParams.get('parentProduct')) || '';
+    const inlineComments = enableInlineComments ? ['inline-comments'] : [];
+    const pageComments = enablePageComments ? ['page-comments'] : [];
+
+    // Calculate theme state object here
+    let calculatedThemeStateObject;
+    if (themeState) {
+      calculatedThemeStateObject = themeStringToObject(decodeURIComponent(themeState));
+    } else if (themeMode) {
+      calculatedThemeStateObject = {
+        colorMode: themeMode
+      };
+    }
+    return {
+      hostname,
+      spaceKey,
+      contentId,
+      parentProduct,
+      userId,
+      userIdType,
+      hash: hash || '',
+      enableInlineComments,
+      enablePageComments,
+      themeStateObject: calculatedThemeStateObject,
+      allowedFeatures: {
+        edit: ['delete-draft'],
+        view: ['byline-contributors', 'byline-extensions', 'page-reactions', ...pageComments, ...inlineComments]
+      },
+      mode: EMBEDDED_CONFLUENCE_MODE.VIEW_MODE,
+      locale: 'en'
+    };
+  }, [url, extensionKey]);
+
+  // Handle theme side effect - only when theme object changes
+  useEffect(() => {
+    if (parsedData !== null && parsedData !== void 0 && parsedData.themeStateObject) {
+      setGlobalTheme(parsedData.themeStateObject);
+    }
+  }, [parsedData === null || parsedData === void 0 ? void 0 : parsedData.themeStateObject]);
+  return parsedData;
+};

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: "40.20.0"
+  packageVersion: "0.0.0-development"
 };
 export let TrackQuickActionType = /*#__PURE__*/function (TrackQuickActionType) {
   TrackQuickActionType["StatusUpdate"] = "StatusUpdate";

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

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

package/dist/esm/hooks/useConfluencePageData.js

@@ -0,0 +1,97 @@
+import { useEffect, useMemo } from 'react';
+import { fg } from '@atlaskit/platform-feature-flags';
+import { setGlobalTheme, themeStringToObject } from '@atlaskit/tokens';
+export var userType = /*#__PURE__*/function (userType) {
+  userType["ATLASSIAN_ACCOUNT"] = "atlassianAccount";
+  userType["HASHED_EMAIL"] = "hashedEmail";
+  userType["LOOM"] = "loom";
+  userType["TRELLO"] = "trello";
+  userType["OPSGENIE"] = "opsgenie";
+  userType["JA_USER_ID"] = "jiraAlign";
+  userType["HALP"] = "halp";
+  return userType;
+}({});
+export var EMBEDDED_CONFLUENCE_MODE = /*#__PURE__*/function (EMBEDDED_CONFLUENCE_MODE) {
+  EMBEDDED_CONFLUENCE_MODE["VIEW_MODE"] = "view";
+  EMBEDDED_CONFLUENCE_MODE["EDIT_MODE"] = "edit";
+  return EMBEDDED_CONFLUENCE_MODE;
+}({});
+export var CONFLUENCE_EXTENSION_KEYS = /*#__PURE__*/function (CONFLUENCE_EXTENSION_KEYS) {
+  CONFLUENCE_EXTENSION_KEYS["PAGE"] = "integration-confluence-object-provider";
+  CONFLUENCE_EXTENSION_KEYS["CANVAS"] = "canvas-native-object-provider";
+  return CONFLUENCE_EXTENSION_KEYS;
+}({});
+export var useConfluencePageData = function useConfluencePageData(url, extensionKey) {
+  var parsedData = useMemo(function () {
+    if (!fg('platform_deprecate_lp_cc_embed')) {
+      return undefined;
+    }
+    if (!url || typeof url !== 'string' || !url.startsWith('http://') && !url.startsWith('https://') || !extensionKey || !Object.values(CONFLUENCE_EXTENSION_KEYS).find(function (key) {
+      return key === extensionKey;
+    })) {
+      return undefined;
+    }
+    var urlObj;
+    try {
+      urlObj = new URL(url);
+    } catch (_unused) {
+      return undefined;
+    }
+    var _urlObj = urlObj,
+      searchParams = _urlObj.searchParams,
+      hash = _urlObj.hash;
+    var hostname = (searchParams === null || searchParams === void 0 ? void 0 : searchParams.get('hostname')) || '';
+    var contentId = (searchParams === null || searchParams === void 0 ? void 0 : searchParams.get('contentId')) || '';
+    var spaceKey = (searchParams === null || searchParams === void 0 ? void 0 : searchParams.get('spaceKey')) || '';
+
+    // Early return for invalid URLs
+    if (!contentId || !hostname) {
+      return undefined;
+    }
+    var themeState = (searchParams === null || searchParams === void 0 ? void 0 : searchParams.get('themeState')) || '';
+    var themeMode = searchParams === null || searchParams === void 0 ? void 0 : searchParams.get('themeMode');
+    var enableInlineComments = (searchParams === null || searchParams === void 0 ? void 0 : searchParams.get('enableInlineComments')) === 'true';
+    var enablePageComments = (searchParams === null || searchParams === void 0 ? void 0 : searchParams.get('enablePageComments')) === 'true';
+    var userId = (searchParams === null || searchParams === void 0 ? void 0 : searchParams.get('userId')) || '';
+    var userIdType = (searchParams === null || searchParams === void 0 ? void 0 : searchParams.get('userInfo')) || undefined;
+    var parentProduct = (searchParams === null || searchParams === void 0 ? void 0 : searchParams.get('parentProduct')) || '';
+    var inlineComments = enableInlineComments ? ['inline-comments'] : [];
+    var pageComments = enablePageComments ? ['page-comments'] : [];
+
+    // Calculate theme state object here
+    var calculatedThemeStateObject;
+    if (themeState) {
+      calculatedThemeStateObject = themeStringToObject(decodeURIComponent(themeState));
+    } else if (themeMode) {
+      calculatedThemeStateObject = {
+        colorMode: themeMode
+      };
+    }
+    return {
+      hostname: hostname,
+      spaceKey: spaceKey,
+      contentId: contentId,
+      parentProduct: parentProduct,
+      userId: userId,
+      userIdType: userIdType,
+      hash: hash || '',
+      enableInlineComments: enableInlineComments,
+      enablePageComments: enablePageComments,
+      themeStateObject: calculatedThemeStateObject,
+      allowedFeatures: {
+        edit: ['delete-draft'],
+        view: ['byline-contributors', 'byline-extensions', 'page-reactions'].concat(pageComments, inlineComments)
+      },
+      mode: EMBEDDED_CONFLUENCE_MODE.VIEW_MODE,
+      locale: 'en'
+    };
+  }, [url, extensionKey]);
+
+  // Handle theme side effect - only when theme object changes
+  useEffect(function () {
+    if (parsedData !== null && parsedData !== void 0 && parsedData.themeStateObject) {
+      setGlobalTheme(parsedData.themeStateObject);
+    }
+  }, [parsedData === null || parsedData === void 0 ? void 0 : parsedData.themeStateObject]);
+  return parsedData;
+};

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: "40.20.0"
+  packageVersion: "0.0.0-development"
 };
 export var TrackQuickActionType = /*#__PURE__*/function (TrackQuickActionType) {
   TrackQuickActionType["StatusUpdate"] = "StatusUpdate";

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

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

package/dist/types/hooks/useConfluencePageData.d.ts

@@ -0,0 +1,39 @@
+export declare enum userType {
+    ATLASSIAN_ACCOUNT = "atlassianAccount",
+    HASHED_EMAIL = "hashedEmail",
+    LOOM = "loom",
+    TRELLO = "trello",
+    OPSGENIE = "opsgenie",
+    JA_USER_ID = "jiraAlign",
+    HALP = "halp"
+}
+export type PageAllowedFeatures = {
+    edit: string[];
+    view: string[];
+};
+export declare enum EMBEDDED_CONFLUENCE_MODE {
+    VIEW_MODE = "view",
+    EDIT_MODE = "edit"
+}
+export declare enum CONFLUENCE_EXTENSION_KEYS {
+    PAGE = "integration-confluence-object-provider",
+    CANVAS = "canvas-native-object-provider"
+}
+export declare const useConfluencePageData: (url: string, extensionKey: string) => {
+    hostname: string;
+    spaceKey: string;
+    contentId: string;
+    parentProduct: string;
+    userId: string;
+    userIdType: userType;
+    hash: string;
+    enableInlineComments: boolean;
+    enablePageComments: boolean;
+    themeStateObject: Partial<import("@atlaskit/tokens").ThemeState> | undefined;
+    allowedFeatures: {
+        edit: string[];
+        view: string[];
+    };
+    mode: EMBEDDED_CONFLUENCE_MODE;
+    locale: string;
+} | undefined;

package/dist/types-ts4.5/hooks/useConfluencePageData.d.ts

@@ -0,0 +1,39 @@
+export declare enum userType {
+    ATLASSIAN_ACCOUNT = "atlassianAccount",
+    HASHED_EMAIL = "hashedEmail",
+    LOOM = "loom",
+    TRELLO = "trello",
+    OPSGENIE = "opsgenie",
+    JA_USER_ID = "jiraAlign",
+    HALP = "halp"
+}
+export type PageAllowedFeatures = {
+    edit: string[];
+    view: string[];
+};
+export declare enum EMBEDDED_CONFLUENCE_MODE {
+    VIEW_MODE = "view",
+    EDIT_MODE = "edit"
+}
+export declare enum CONFLUENCE_EXTENSION_KEYS {
+    PAGE = "integration-confluence-object-provider",
+    CANVAS = "canvas-native-object-provider"
+}
+export declare const useConfluencePageData: (url: string, extensionKey: string) => {
+    hostname: string;
+    spaceKey: string;
+    contentId: string;
+    parentProduct: string;
+    userId: string;
+    userIdType: userType;
+    hash: string;
+    enableInlineComments: boolean;
+    enablePageComments: boolean;
+    themeStateObject: Partial<import("@atlaskit/tokens").ThemeState> | undefined;
+    allowedFeatures: {
+        edit: string[];
+        view: string[];
+    };
+    mode: EMBEDDED_CONFLUENCE_MODE;
+    locale: string;
+} | undefined;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/smart-card",
-	"version": "40.20.1",
+	"version": "40.20.3",
 	"description": "Smart card component",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -223,6 +223,9 @@
 		"ptc-enable-embed-team-smart-links": {
 			"type": "boolean"
 		},
+		"platform_deprecate_lp_cc_embed": {
+			"type": "boolean"
+		},
 		"navx-1483-a11y-close-button-in-modal-updates": {
 			"type": "boolean"
 		},