@atlaskit/smart-card 23.14.2 → 23.14.3

package/dist/esm/view/EmbedCard/views/ResolvedView.js

@@ -5,6 +5,7 @@ import LinkGlyph from '@atlaskit/icon/glyph/link';
 import { ExpandedFrame } from '../components/ExpandedFrame';
 import { ImageIcon } from '../components/ImageIcon';
 import { Frame } from '../components/Frame';
+import { useThemeObserver } from '@atlaskit/tokens';
 export var EmbedCardResolvedView = /*#__PURE__*/React.forwardRef(function (_ref, embedIframeRef) {
   var link = _ref.link,
     context = _ref.context,
@@ -18,7 +19,8 @@ export var EmbedCardResolvedView = /*#__PURE__*/React.forwardRef(function (_ref,
     testId = _ref$testId === void 0 ? 'embed-card-resolved-view' : _ref$testId,
     inheritDimensions = _ref.inheritDimensions,
     onIframeDwell = _ref.onIframeDwell,
-    onIframeFocus = _ref.onIframeFocus;
+    onIframeFocus = _ref.onIframeFocus,
+    isSupportTheming = _ref.isSupportTheming;
   var iconFromContext = context === null || context === void 0 ? void 0 : context.icon;
   var src = typeof iconFromContext === 'string' ? iconFromContext : undefined;
   var text = title || (context === null || context === void 0 ? void 0 : context.text);
@@ -38,6 +40,12 @@ export var EmbedCardResolvedView = /*#__PURE__*/React.forwardRef(function (_ref,
       default: linkGlyph
     });
   }, [src, linkGlyph, iconFromContext]);
+  var _useThemeObserver = useThemeObserver(),
+    colorMode = _useThemeObserver.colorMode;
+  var previewUrl = preview === null || preview === void 0 ? void 0 : preview.src;
+  if (previewUrl && isSupportTheming && colorMode) {
+    previewUrl = "".concat(previewUrl).concat(previewUrl.includes('?') ? '&' : '?', "themeMode=").concat(colorMode);
+  }
   return jsx(ExpandedFrame, {
     isSelected: isSelected,
     isFrameVisible: isFrameVisible,
@@ -48,7 +56,7 @@ export var EmbedCardResolvedView = /*#__PURE__*/React.forwardRef(function (_ref,
     onClick: onClick,
     inheritDimensions: inheritDimensions
   }, jsx(Frame, {
-    url: preview === null || preview === void 0 ? void 0 : preview.src,
+    url: previewUrl,
     isTrusted: isTrusted,
     testId: testId,
     ref: embedIframeRef,

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

@@ -7,6 +7,7 @@ import EmbedContent from './components/embed-content';
 import { EmbedModalSize } from './types';
 import withErrorBoundary from './components/error-boundary';
 import withAnalytics from './components/analytics';
+import { useThemeObserver } from '@atlaskit/tokens';
 var toSize = function toSize(width) {
   return width === MAX_MODAL_SIZE ? EmbedModalSize.Large : EmbedModalSize.Small;
 };
@@ -32,7 +33,8 @@ var EmbedModal = function EmbedModal(_ref) {
     _ref$testId = _ref.testId,
     testId = _ref$testId === void 0 ? 'smart-embed-preview-modal' : _ref$testId,
     title = _ref.title,
-    url = _ref.url;
+    url = _ref.url,
+    isSupportTheming = _ref.isSupportTheming;
   var defaultWidth = toWidth(size);
   var _useState = useState(showModal),
     _useState2 = _slicedToArray(_useState, 2),
@@ -72,6 +74,12 @@ var EmbedModal = function EmbedModal(_ref) {
       });
     }
   }, [onResize, width]);
+  var _useThemeObserver = useThemeObserver(),
+    colorMode = _useThemeObserver.colorMode;
+  var previewUrl = src;
+  if (previewUrl && isSupportTheming && colorMode) {
+    previewUrl = "".concat(previewUrl).concat(previewUrl.includes('?') ? '&' : '?', "themeMode=").concat(colorMode);
+  }
   return /*#__PURE__*/React.createElement(ModalTransition, null, isOpen && /*#__PURE__*/React.createElement(ModalDialog, {
     height: "100%",
     onClose: handleOnClose,
@@ -93,7 +101,7 @@ var EmbedModal = function EmbedModal(_ref) {
   }), /*#__PURE__*/React.createElement(ModalBody, null, /*#__PURE__*/React.createElement(EmbedContent, {
     isTrusted: isTrusted,
     name: iframeName,
-    src: src,
+    src: previewUrl,
     testId: testId
   }))));
 };

package/dist/esm/view/FlexibleCard/components/actions/action/preview-action/index.js

@@ -23,7 +23,8 @@ var PreviewAction = function PreviewAction(props) {
     url = props.url,
     title = props.title,
     providerName = props.providerName,
-    downloadUrl = props.downloadUrl;
+    downloadUrl = props.downloadUrl,
+    isSupportTheming = props.isSupportTheming;
   var defaultAnalytics = useSmartLinkAnalytics(url, function () {});
   var analytics = useFlexibleUiAnalyticsContext() || defaultAnalytics;
   var EmbedIcon = {
@@ -44,7 +45,8 @@ var PreviewAction = function PreviewAction(props) {
         title: title,
         url: url,
         analytics: analytics,
-        origin: 'smartLinkCard'
+        origin: 'smartLinkCard',
+        isSupportTheming: isSupportTheming
       });
     };
     var action = _objectSpread(_objectSpread({}, props), {}, {

package/dist/types/extractors/block/index.d.ts

@@ -4,6 +4,6 @@ import { LinkPerson } from '@atlaskit/linking-common/extractors';
 import { ExtractBlockOpts } from './types';
 import { BlockCardResolvedViewProps } from '../../view/BlockCard';
 import { ActionProps } from '../../view/BlockCard/components/Action';
-export declare const extractBlockActions: (props: BlockCardResolvedViewProps, jsonLd: JsonLd.Data.BaseData, opts?: ExtractBlockOpts | undefined, platform?: JsonLd.Primitives.Platforms | undefined) => ActionProps[];
+export declare const extractBlockActions: (props: BlockCardResolvedViewProps, jsonLd: JsonLd.Data.BaseData, opts?: ExtractBlockOpts | undefined, platform?: JsonLd.Primitives.Platforms | undefined, meta?: JsonLd.Meta.BaseMeta | undefined) => ActionProps[];
 export declare const extractBlockUsers: (jsonLd: JsonLd.Data.BaseData) => LinkPerson[] | undefined;
 export declare const extractBlockProps: (jsonLd: JsonLd.Data.BaseData, meta?: JsonLd.Meta.BaseMeta | undefined, opts?: ExtractBlockOpts | undefined, renderers?: CardProviderRenderers | undefined, platform?: JsonLd.Primitives.Platforms | undefined) => BlockCardResolvedViewProps;

package/dist/types/extractors/common/actions/extractPreviewAction.d.ts

@@ -2,8 +2,9 @@ import { JsonLd } from 'json-ld-types';
 import { CardPlatform } from '../../../view/Card/types';
 import { BlockCardResolvedViewProps } from '../../../view/BlockCard';
 import { ExtractBlockOpts } from '../../block/types';
-export declare const extractPreviewAction: ({ extensionKey, viewProps, jsonLd, handleInvoke, testId, platform, origin, source, analytics, }: ExtractBlockOpts & {
+export declare const extractPreviewAction: ({ extensionKey, viewProps, jsonLd, handleInvoke, testId, platform, origin, source, analytics, meta, }: ExtractBlockOpts & {
     viewProps: BlockCardResolvedViewProps;
     jsonLd: JsonLd.Data.BaseData;
     platform?: JsonLd.Primitives.Platforms | undefined;
+    meta?: JsonLd.Meta.BaseMeta | undefined;
 }) => import("../../../view/BlockCard/components/Action").ActionProps | undefined;

package/dist/types/extractors/common/meta/extractIsSupportTheming.d.ts

@@ -0,0 +1,2 @@
+import { JsonLd } from 'json-ld-types';
+export declare const extractIsSupportTheming: (meta?: JsonLd.Meta.BaseMeta | undefined) => boolean;

package/dist/types/extractors/constants.d.ts

@@ -10,3 +10,4 @@ export declare const JIRA_SERVICE_REQUEST = "JiraServiceRequest";
 export declare const JIRA_CHANGE = "JiraChange";
 export declare const JIRA_PROBLEM = "JiraProblem";
 export declare const JIRA_CUSTOM_TASK_TYPE = "JiraCustomTaskType";
+export declare const PROVIDER_KEYS_WITH_THEMING: string[];

package/dist/types/state/flexible-ui-context/types.d.ts

@@ -193,6 +193,7 @@ export declare type PreviewActionData = {
     src?: string;
     title?: string;
     url?: string;
+    isSupportTheming?: boolean;
 };
 export declare type ViewActionData = {
     viewUrl?: string;

package/dist/types/view/BlockCard/actions/PreviewAction.d.ts

@@ -25,6 +25,7 @@ declare type PreviewInfo = {
     onOpenFailed?: (error: Error, errorInfo: ErrorInfo) => void;
     analytics: AnalyticsFacade;
     origin?: AnalyticsOrigin;
+    isSupportTheming?: boolean;
 };
 declare const _default: ({ details, ...rest }: PreviewInfo) => ActionProps;
 export default _default;

package/dist/types/view/BlockCard/views/ResolvedView.d.ts

@@ -28,7 +28,9 @@ export interface ResolvedViewProps {
     showActions?: boolean;
     titlePrefix?: React.ReactNode;
     isTrusted?: boolean;
+    /** It determines whether a link source supports different design theme modes */
+    isSupportTheming?: boolean;
 }
 export declare const blockCardResolvedViewClassName = "block-card-resolved-view";
 export declare const blockCardResolvedViewByClassName = "block-card-resolved-view-by";
-export declare const ResolvedView: ({ icon, actions, thumbnail, context, title, titleTextColor, titlePrefix, isSelected, users, handleAvatarClick, handleMoreAvatarsClick, onClick, link, byline, lozenge, details, testId, showActions, }: ResolvedViewProps) => jsx.JSX.Element;
+export declare const ResolvedView: ({ icon, actions, thumbnail, context, title, titleTextColor, titlePrefix, isSelected, users, handleAvatarClick, handleMoreAvatarsClick, onClick, link, byline, lozenge, details, testId, showActions, isSupportTheming, }: ResolvedViewProps) => jsx.JSX.Element;

package/dist/types/view/EmbedCard/views/ResolvedView.d.ts

@@ -22,6 +22,7 @@ export interface EmbedCardResolvedViewProps {
     onClick?: (evt: React.MouseEvent) => void;
     /** For testing purposes only. */
     testId?: string;
+    isSupportTheming?: boolean;
     inheritDimensions?: boolean;
     /** Optional callback for when user dwells cursor over iframe - for analytics **/
     onIframeDwell?: (dwellTime: number, dwellPercentVisible: number) => void;

package/dist/types/view/EmbedModal/index.d.ts

@@ -5,6 +5,7 @@ declare const _default: React.FC<{
     icon?: import("../common/Icon").IconProps | undefined;
     iframeName: string;
     isTrusted?: boolean | undefined;
+    isSupportTheming?: boolean | undefined;
     onClose: (context: import("./types").EmbedModalContext) => void;
     onDownloadActionClick?: (() => void) | undefined;
     onOpen?: ((context: import("./types").EmbedModalContext) => void) | undefined;

package/dist/types/view/EmbedModal/types.d.ts

@@ -14,6 +14,7 @@ export declare type EmbedModalProps = {
     icon?: IconProps;
     iframeName: string;
     isTrusted?: boolean;
+    isSupportTheming?: boolean;
     onClose: (context: EmbedModalContext) => void;
     onDownloadActionClick?: () => void;
     onOpen?: (context: EmbedModalContext) => void;

package/dist/types/view/FlexibleCard/components/actions/action/preview-action/types.d.ts

@@ -9,6 +9,7 @@ export declare type FlexibleEmbedProps = {
     src?: string;
     title?: string;
     url: string;
+    isSupportTheming?: boolean;
 };
 export interface PreviewFunctionProps extends EmbedModalProps {
     popupMountPointId: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/smart-card",
-  "version": "23.14.2",
+  "version": "23.14.3",
   "description": "Smart card component",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"