@atlaskit/smart-card 45.22.6 → 45.23.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +15 -0
- package/dist/cjs/entry-points/hover.js +21 -0
- package/dist/cjs/hoverCard.js +2 -2
- package/dist/cjs/state/hooks/use-resolve/index.js +7 -5
- package/dist/cjs/state/hooks/use-response/index.js +17 -5
- package/dist/cjs/utils/analytics/analytics.js +1 -1
- package/dist/cjs/view/CardWithUrl/component-lazy/LazyIntersectionObserverCard.js +1 -1
- package/dist/cjs/view/FlexibleCard/components/container/hover-card-control/index.js +1 -1
- package/dist/cjs/view/HoverCard/index.js +58 -14
- package/dist/cjs/view/InlineCard/ErroredView/index.js +1 -1
- package/dist/cjs/view/InlineCard/ForbiddenView/index.js +1 -1
- package/dist/cjs/view/InlineCard/ResolvedView/InlineCardResolvedViewFunctional.js +1 -1
- package/dist/cjs/view/InlineCard/ResolvedView/index.js +1 -1
- package/dist/cjs/view/InlineCard/UnauthorisedView/index.js +1 -1
- package/dist/cjs/view/LinkUrl/index.js +1 -1
- package/dist/es2019/entry-points/hover.js +9 -0
- package/dist/es2019/hoverCard.js +1 -3
- package/dist/es2019/state/hooks/use-resolve/index.js +7 -4
- package/dist/es2019/state/hooks/use-response/index.js +17 -5
- package/dist/es2019/utils/analytics/analytics.js +1 -1
- package/dist/es2019/view/CardWithUrl/component-lazy/LazyIntersectionObserverCard.js +1 -1
- package/dist/es2019/view/FlexibleCard/components/container/hover-card-control/index.js +1 -1
- package/dist/es2019/view/HoverCard/index.js +52 -7
- package/dist/es2019/view/InlineCard/ErroredView/index.js +1 -1
- package/dist/es2019/view/InlineCard/ForbiddenView/index.js +1 -1
- package/dist/es2019/view/InlineCard/ResolvedView/InlineCardResolvedViewFunctional.js +1 -1
- package/dist/es2019/view/InlineCard/ResolvedView/index.js +1 -1
- package/dist/es2019/view/InlineCard/UnauthorisedView/index.js +1 -1
- package/dist/es2019/view/LinkUrl/index.js +1 -1
- package/dist/esm/entry-points/hover.js +13 -0
- package/dist/esm/hoverCard.js +1 -3
- package/dist/esm/state/hooks/use-resolve/index.js +7 -5
- package/dist/esm/state/hooks/use-response/index.js +17 -5
- package/dist/esm/utils/analytics/analytics.js +1 -1
- package/dist/esm/view/CardWithUrl/component-lazy/LazyIntersectionObserverCard.js +1 -1
- package/dist/esm/view/FlexibleCard/components/container/hover-card-control/index.js +1 -1
- package/dist/esm/view/HoverCard/index.js +51 -7
- package/dist/esm/view/InlineCard/ErroredView/index.js +1 -1
- package/dist/esm/view/InlineCard/ForbiddenView/index.js +1 -1
- package/dist/esm/view/InlineCard/ResolvedView/InlineCardResolvedViewFunctional.js +1 -1
- package/dist/esm/view/InlineCard/ResolvedView/index.js +1 -1
- package/dist/esm/view/InlineCard/UnauthorisedView/index.js +1 -1
- package/dist/esm/view/LinkUrl/index.js +1 -1
- package/dist/types/entry-points/hover.d.ts +7 -0
- package/dist/types/hoverCard.d.ts +1 -3
- package/dist/types/view/HoverCard/components/ContentContainer.d.ts +10 -1
- package/dist/types/view/HoverCard/components/HoverCardComponent.d.ts +8 -1
- package/dist/types/view/HoverCard/components/HoverCardContent.d.ts +22 -2
- package/dist/types/view/HoverCard/components/ImagePreview.d.ts +5 -1
- package/dist/types/view/HoverCard/index.d.ts +8 -6
- package/dist/types/view/HoverCard/types.d.ts +22 -6
- package/hover/package.json +4 -4
- package/package.json +4 -4
- package/dist/cjs/view/HoverCard/HoverCard.js +0 -63
- package/dist/cjs/view/HoverCard/StandaloneHoverCard.js +0 -15
- package/dist/es2019/view/HoverCard/HoverCard.js +0 -55
- package/dist/es2019/view/HoverCard/StandaloneHoverCard.js +0 -6
- package/dist/esm/view/HoverCard/HoverCard.js +0 -54
- package/dist/esm/view/HoverCard/StandaloneHoverCard.js +0 -8
- package/dist/types/view/HoverCard/HoverCard.d.ts +0 -10
- package/dist/types/view/HoverCard/StandaloneHoverCard.d.ts +0 -6
|
@@ -74,12 +74,24 @@ var useResponse = function useResponse() {
|
|
|
74
74
|
}
|
|
75
75
|
}, [getState, setMetadataStatus, dispatch]);
|
|
76
76
|
var handleResolvedLinkSuccess = useCallback(function (resourceUrl, response, isReloading, isMetadataRequest) {
|
|
77
|
+
var _getState$resourceUrl;
|
|
77
78
|
var metadataStatus = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : 'resolved';
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
79
|
+
/**
|
|
80
|
+
* Metadata status scenarios:
|
|
81
|
+
* - Gate off, or a non-resolved response: use `resolved`, preserving legacy behavior and
|
|
82
|
+
* avoiding a gate exposure when the result would not affect the status.
|
|
83
|
+
* - Gate on with full metadata: use the provided/default `resolved` status.
|
|
84
|
+
* - Gate on with reduced inline metadata: use the provided `pending` status so block or
|
|
85
|
+
* hover rendering knows to request the full metadata later.
|
|
86
|
+
* - Reduced inline metadata arriving after full metadata: keep the existing `resolved`
|
|
87
|
+
* status so an out-of-order response cannot trigger another full request.
|
|
88
|
+
* - Explicit reload: allow `pending` even after full metadata, because the caller is
|
|
89
|
+
* intentionally replacing the existing data.
|
|
90
|
+
*/
|
|
81
91
|
var shouldUseProvidedMetadataStatus = getStatus(response) === 'resolved' && fg('platform_smartlink_inline_resolve_optimization');
|
|
82
|
-
|
|
92
|
+
var shouldPreserveResolvedMetadata = shouldUseProvidedMetadataStatus && metadataStatus === 'pending' && !isReloading && ((_getState$resourceUrl = getState()[resourceUrl]) === null || _getState$resourceUrl === void 0 ? void 0 : _getState$resourceUrl.metadataStatus) === 'resolved';
|
|
93
|
+
var nextMetadataStatus = shouldUseProvidedMetadataStatus && !shouldPreserveResolvedMetadata ? metadataStatus : 'resolved';
|
|
94
|
+
setMetadataStatus(resourceUrl, nextMetadataStatus);
|
|
83
95
|
// Dispatch Analytics and resolved card action - including unauthorized states.
|
|
84
96
|
if (isReloading) {
|
|
85
97
|
dispatch(cardAction(ACTION_RELOADING, {
|
|
@@ -90,7 +102,7 @@ var useResponse = function useResponse() {
|
|
|
90
102
|
url: resourceUrl
|
|
91
103
|
}, response, undefined, undefined, isMetadataRequest));
|
|
92
104
|
}
|
|
93
|
-
}, [setMetadataStatus, dispatch]);
|
|
105
|
+
}, [getState, setMetadataStatus, dispatch]);
|
|
94
106
|
var handleResolvedLinkResponse = useCallback(function (resourceUrl, response) {
|
|
95
107
|
var isReloading = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
|
|
96
108
|
var isMetadataRequest = arguments.length > 3 ? arguments[3] : undefined;
|
|
@@ -3,7 +3,7 @@ export var ANALYTICS_CHANNEL = 'media';
|
|
|
3
3
|
export var context = {
|
|
4
4
|
componentName: 'smart-cards',
|
|
5
5
|
packageName: "@atlaskit/smart-card" || '',
|
|
6
|
-
packageVersion: "45.22.
|
|
6
|
+
packageVersion: "45.22.6" || ''
|
|
7
7
|
};
|
|
8
8
|
export var TrackQuickActionType = /*#__PURE__*/function (TrackQuickActionType) {
|
|
9
9
|
TrackQuickActionType["StatusUpdate"] = "StatusUpdate";
|
|
@@ -23,7 +23,7 @@ export var LazyIntersectionObserverCard = function LazyIntersectionObserverCard(
|
|
|
23
23
|
onErrorCallback = props.onError,
|
|
24
24
|
ui = props.ui,
|
|
25
25
|
url = props.url;
|
|
26
|
-
var prefetch = usePrefetch(url);
|
|
26
|
+
var prefetch = usePrefetch(url, appearance);
|
|
27
27
|
var ComponentObserver = appearance === 'inline' ? 'span' : 'div';
|
|
28
28
|
var _useSmartLinkSeenEven = useSmartLinkSeenEvent({
|
|
29
29
|
appearance: appearance,
|
|
@@ -2,7 +2,7 @@ import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
|
|
|
2
2
|
import React, { useCallback, useEffect, useRef, useState } from 'react';
|
|
3
3
|
import { ElementName } from '../../../../../constants';
|
|
4
4
|
import { noop } from '../../../../../utils/noop';
|
|
5
|
-
import { HoverCard } from '../../../../HoverCard
|
|
5
|
+
import { HoverCard } from '../../../../HoverCard';
|
|
6
6
|
var FLEXIBLE_HOVER_CARD_CAN_OPEN_DELAY = 100;
|
|
7
7
|
var HoverCardControl = function HoverCardControl(_ref) {
|
|
8
8
|
var children = _ref.children,
|
|
@@ -1,10 +1,54 @@
|
|
|
1
|
-
|
|
1
|
+
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
2
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
3
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
4
|
+
import React, { useCallback } from 'react';
|
|
5
|
+
import { ErrorBoundary } from 'react-error-boundary';
|
|
6
|
+
import { di } from 'react-magnetic-di';
|
|
7
|
+
import withAnalyticsEvents from '@atlaskit/analytics-next/withAnalyticsEvents';
|
|
8
|
+
import { useAnalyticsEvents } from '../../common/analytics/generated/use-analytics-events';
|
|
9
|
+
import { CardDisplay } from '../../constants';
|
|
10
|
+
import { failUfoExperience } from '../../state/analytics/failUfoExperience';
|
|
11
|
+
import { startUfoExperience } from '../../state/analytics/startUfoExperience';
|
|
12
|
+
import { SmartLinkModalProvider } from '../../state/modal/SmartLinkModalProvider';
|
|
13
|
+
import { useSmartLinkAnalyticsContext } from '../../utils/analytics/useSmartLinkAnalyticsContext';
|
|
14
|
+
import { HOVER_CARD_SOURCE, HoverCardComponent } from './components/HoverCardComponent';
|
|
15
|
+
var HoverCardWithErrorBoundary = function HoverCardWithErrorBoundary(props) {
|
|
16
|
+
var _useAnalyticsEvents = useAnalyticsEvents(),
|
|
17
|
+
fireEvent = _useAnalyticsEvents.fireEvent;
|
|
18
|
+
var url = props.url,
|
|
19
|
+
id = props.id,
|
|
20
|
+
children = props.children;
|
|
21
|
+
var analyticsContext = useSmartLinkAnalyticsContext({
|
|
22
|
+
display: CardDisplay.HoverCardPreview,
|
|
23
|
+
id: id,
|
|
24
|
+
source: HOVER_CARD_SOURCE,
|
|
25
|
+
url: url
|
|
26
|
+
});
|
|
27
|
+
var onError = useCallback(function (error, info) {
|
|
28
|
+
startUfoExperience('smart-link-rendered', id || 'NULL');
|
|
29
|
+
failUfoExperience('smart-link-rendered', id || 'NULL');
|
|
30
|
+
failUfoExperience('smart-link-authenticated', id || 'NULL');
|
|
31
|
+
fireEvent('ui.smartLink.renderFailed', _objectSpread(_objectSpread({}, analyticsContext === null || analyticsContext === void 0 ? void 0 : analyticsContext.attributes), {}, {
|
|
32
|
+
display: CardDisplay.HoverCardPreview,
|
|
33
|
+
id: id !== null && id !== void 0 ? id : null,
|
|
34
|
+
error: error,
|
|
35
|
+
errorInfo: info
|
|
36
|
+
}));
|
|
37
|
+
}, [analyticsContext, id, fireEvent]);
|
|
38
|
+
return /*#__PURE__*/React.createElement(ErrorBoundary, {
|
|
39
|
+
fallback: children,
|
|
40
|
+
onError: onError
|
|
41
|
+
}, /*#__PURE__*/React.createElement(SmartLinkModalProvider, null, /*#__PURE__*/React.createElement(HoverCardComponent, props, children)));
|
|
42
|
+
};
|
|
43
|
+
var HoverCardWithoutAnalyticsContext = withAnalyticsEvents()(HoverCardWithErrorBoundary);
|
|
2
44
|
|
|
3
45
|
/**
|
|
4
|
-
*
|
|
46
|
+
* A hover preview component using within smart links,
|
|
47
|
+
* e.g. inline card's hover preview and auth tooltip, flexible card's hover preview.
|
|
48
|
+
*
|
|
49
|
+
* This component contains additional props that smart-card internal components
|
|
50
|
+
* use to configure hover preview behaviour.
|
|
5
51
|
*/
|
|
6
|
-
export
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
*/
|
|
10
|
-
export { StandaloneHoverCard } from './StandaloneHoverCard';
|
|
52
|
+
export var HoverCard = function HoverCard(props) {
|
|
53
|
+
return /*#__PURE__*/React.createElement(HoverCardWithoutAnalyticsContext, props);
|
|
54
|
+
};
|
|
@@ -4,7 +4,7 @@ import React from 'react';
|
|
|
4
4
|
import { FormattedMessage } from 'react-intl';
|
|
5
5
|
import ErrorIcon from '@atlaskit/icon/core/status-error';
|
|
6
6
|
import { messages } from '../../../messages';
|
|
7
|
-
import { HoverCard } from '../../HoverCard
|
|
7
|
+
import { HoverCard } from '../../HoverCard';
|
|
8
8
|
import { Frame } from '../Frame';
|
|
9
9
|
import { IconAndTitleLayout } from '../IconAndTitleLayout';
|
|
10
10
|
import { ActionButton } from '../common/action-button';
|
|
@@ -8,7 +8,7 @@ import { FormattedMessage } from 'react-intl';
|
|
|
8
8
|
import LockLockedIcon from '@atlaskit/icon/core/lock-locked';
|
|
9
9
|
import { Pressable } from '@atlaskit/primitives/compiled';
|
|
10
10
|
import { messages } from '../../../messages';
|
|
11
|
-
import { HoverCard } from '../../HoverCard
|
|
11
|
+
import { HoverCard } from '../../HoverCard';
|
|
12
12
|
import { Frame } from '../Frame';
|
|
13
13
|
import { IconAndTitleLayout } from '../IconAndTitleLayout';
|
|
14
14
|
import { ActionButton } from '../common/action-button';
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import useInlineTailoredAction from '../../../state/hooks/use-inline-tailored-actions';
|
|
3
|
-
import { HoverCard } from '../../HoverCard
|
|
3
|
+
import { HoverCard } from '../../HoverCard';
|
|
4
4
|
import { Frame } from '../Frame';
|
|
5
5
|
import { IconAndTitleLayout } from '../IconAndTitleLayout';
|
|
6
6
|
import { InlineRovoActionButton } from '../common/rovo-actions-cta';
|
|
@@ -9,7 +9,7 @@ function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.
|
|
|
9
9
|
import React from 'react';
|
|
10
10
|
import { componentWithFG } from '@atlaskit/platform-feature-flags-react/component-with-fg';
|
|
11
11
|
import { fg } from '@atlaskit/platform-feature-flags/fg';
|
|
12
|
-
import { HoverCard } from '../../HoverCard
|
|
12
|
+
import { HoverCard } from '../../HoverCard';
|
|
13
13
|
import { Frame } from '../Frame';
|
|
14
14
|
import { IconAndTitleLayout } from '../IconAndTitleLayout';
|
|
15
15
|
import InlineLozenge from '../common/inline-lozenge';
|
|
@@ -13,7 +13,7 @@ import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
|
|
|
13
13
|
import { useAnalyticsEvents } from '../../../common/analytics/generated/use-analytics-events';
|
|
14
14
|
import { messages } from '../../../messages';
|
|
15
15
|
import { getCachedProviderPctMapAndRefresh } from '../../../state/services/personalization/getCachedProviderPctMapAndRefresh';
|
|
16
|
-
import { HoverCard } from '../../HoverCard
|
|
16
|
+
import { HoverCard } from '../../HoverCard';
|
|
17
17
|
import { Frame } from '../Frame';
|
|
18
18
|
import { IconAndTitleLayout } from '../IconAndTitleLayout';
|
|
19
19
|
import { ActionButton } from '../common/action-button';
|
|
@@ -12,7 +12,7 @@ import LinkWarningModal from './LinkWarningModal';
|
|
|
12
12
|
import { useLinkWarningModal } from './LinkWarningModal/hooks/use-link-warning-modal';
|
|
13
13
|
var PACKAGE_DATA = {
|
|
14
14
|
packageName: "@atlaskit/smart-card",
|
|
15
|
-
packageVersion: "45.22.
|
|
15
|
+
packageVersion: "45.22.6",
|
|
16
16
|
componentName: 'linkUrl'
|
|
17
17
|
};
|
|
18
18
|
var LinkUrl = function LinkUrl(_ref) {
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { type HoverCardProps } from '../view/HoverCard/types';
|
|
3
|
+
export declare const HoverCard: (props: HoverCardProps) => React.JSX.Element;
|
|
4
|
+
/**
|
|
5
|
+
* @deprecated Use `import { HoverCard } from '@atlaskit/smart-card/hover'` instead.
|
|
6
|
+
*/
|
|
7
|
+
export declare const StandaloneHoverCard: (props: HoverCardProps) => React.JSX.Element;
|
|
@@ -1,9 +1,7 @@
|
|
|
1
|
-
/** @deprecated Use @atlaskit/smart-card/hover */
|
|
2
1
|
/**
|
|
3
2
|
* @deprecated Use `import { HoverCard } from '@atlaskit/smart-card/hover'` instead.
|
|
4
3
|
*/
|
|
5
|
-
export {
|
|
6
|
-
/** @deprecated Use @atlaskit/smart-card/hover/types */
|
|
4
|
+
export { HoverCard } from './entry-points/hover';
|
|
7
5
|
/**
|
|
8
6
|
* @deprecated Use `import type { HoverCardProps } from '@atlaskit/smart-card/hover/types'` instead.
|
|
9
7
|
*/
|
|
@@ -1,3 +1,12 @@
|
|
|
1
|
-
|
|
1
|
+
type ContentContainerWidthAppearance = 'default' | 'slim';
|
|
2
|
+
type ContentContainerProps = React.HTMLAttributes<HTMLDivElement> & {
|
|
3
|
+
isAIEnabled?: boolean;
|
|
4
|
+
testId?: string;
|
|
5
|
+
url: string;
|
|
6
|
+
/**
|
|
7
|
+
* Visual width preset for the hover card shell. Omit or `undefined` uses `'default'`.
|
|
8
|
+
*/
|
|
9
|
+
widthAppearance?: ContentContainerWidthAppearance;
|
|
10
|
+
};
|
|
2
11
|
declare const ContentContainer: ({ children, widthAppearance, isAIEnabled, testId, url, ...props }: ContentContainerProps) => JSX.Element;
|
|
3
12
|
export default ContentContainer;
|
|
@@ -1,4 +1,11 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import {
|
|
2
|
+
import type { AnalyticsHandler } from '../../../utils/types.ts';
|
|
3
|
+
import { type HoverCardProps } from '../types';
|
|
3
4
|
export declare const HOVER_CARD_SOURCE = "smartLinkPreviewHoverCard";
|
|
5
|
+
interface HoverCardComponentProps extends HoverCardProps {
|
|
6
|
+
analyticsHandler?: AnalyticsHandler;
|
|
7
|
+
canOpen?: boolean;
|
|
8
|
+
closeOnChildClick?: boolean;
|
|
9
|
+
}
|
|
4
10
|
export declare const HoverCardComponent: ({ children, url, id, canOpen, closeOnChildClick, actionOptions, allowEventPropagation, zIndex, noFadeDelay, hoverPreviewOptions, role, shouldRenderToParent, label, titleId, onVisibilityChange, }: HoverCardComponentProps) => React.JSX.Element;
|
|
11
|
+
export {};
|
|
@@ -1,5 +1,25 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import {
|
|
1
|
+
import React, { type MouseEventHandler } from 'react';
|
|
2
|
+
import type { CardProviderRenderers } from '@atlaskit/link-provider/types';
|
|
3
|
+
import { type ActionName } from '../../../constants';
|
|
4
|
+
import type { CardState } from '@atlaskit/linking-common/store';
|
|
5
|
+
import type { InternalCardActionOptions } from '../../Card/types.ts';
|
|
6
|
+
import { type HoverPreviewOptions } from '../types';
|
|
3
7
|
export declare const hoverCardClassName = "smart-links-hover-preview";
|
|
8
|
+
type HoverCardContentProps = {
|
|
9
|
+
actionOptions?: InternalCardActionOptions;
|
|
10
|
+
cardState: CardState;
|
|
11
|
+
hoverPreviewOptions?: HoverPreviewOptions;
|
|
12
|
+
id?: string;
|
|
13
|
+
onActionClick: (actionId: string | ActionName) => void;
|
|
14
|
+
/**
|
|
15
|
+
* Closes the hover card popup (e.g. secondary actions like "Maybe later").
|
|
16
|
+
*/
|
|
17
|
+
onDismiss?: () => void;
|
|
18
|
+
onMouseEnter?: MouseEventHandler;
|
|
19
|
+
onMouseLeave?: MouseEventHandler;
|
|
20
|
+
onResolve: () => void;
|
|
21
|
+
renderers?: CardProviderRenderers;
|
|
22
|
+
url: string;
|
|
23
|
+
};
|
|
4
24
|
declare const _default_1: React.FC<HoverCardContentProps>;
|
|
5
25
|
export default _default_1;
|
|
@@ -1,4 +1,8 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import {
|
|
2
|
+
import type { SmartLinkResponse } from '@atlaskit/linking-types/smart-link';
|
|
3
|
+
type ImagePreviewProps = {
|
|
4
|
+
fallbackElementHeight: number;
|
|
5
|
+
response?: SmartLinkResponse;
|
|
6
|
+
};
|
|
3
7
|
declare const ImagePreview: ({ fallbackElementHeight, response, }: ImagePreviewProps) => React.JSX.Element | null;
|
|
4
8
|
export default ImagePreview;
|
|
@@ -1,8 +1,10 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { type HoverCardProps } from './types';
|
|
1
3
|
/**
|
|
2
|
-
*
|
|
4
|
+
* A hover preview component using within smart links,
|
|
5
|
+
* e.g. inline card's hover preview and auth tooltip, flexible card's hover preview.
|
|
6
|
+
*
|
|
7
|
+
* This component contains additional props that smart-card internal components
|
|
8
|
+
* use to configure hover preview behaviour.
|
|
3
9
|
*/
|
|
4
|
-
export
|
|
5
|
-
/**
|
|
6
|
-
* @deprecated Use `import { StandaloneHoverCard } from '@atlaskit/smart-card/hover'` instead.
|
|
7
|
-
*/
|
|
8
|
-
export { StandaloneHoverCard } from './StandaloneHoverCard';
|
|
10
|
+
export declare const HoverCard: (props: HoverCardProps) => React.JSX.Element;
|
|
@@ -42,6 +42,10 @@ export interface HoverCardProps extends WithAnalyticsEventsProps {
|
|
|
42
42
|
* Usage of either this, or the `titleId` attribute is strongly recommended.
|
|
43
43
|
*/
|
|
44
44
|
label?: string;
|
|
45
|
+
/**
|
|
46
|
+
* @deprecated To be removed - Suspend hover card UI delays (fade-in, fade-out) for VR testing purposes.
|
|
47
|
+
*/
|
|
48
|
+
noFadeDelay?: boolean;
|
|
45
49
|
/**
|
|
46
50
|
* Callback function that is called when the hover card is visible or hidden.
|
|
47
51
|
*/
|
|
@@ -72,23 +76,26 @@ export interface HoverCardProps extends WithAnalyticsEventsProps {
|
|
|
72
76
|
zIndex?: number;
|
|
73
77
|
}
|
|
74
78
|
/**
|
|
75
|
-
*
|
|
76
|
-
* hover preview behaviour. The prop contains here are suitable for unsafe
|
|
77
|
-
* or experiment props that will not be or are yet ready to be available on
|
|
78
|
-
* standalone hover card.
|
|
79
|
+
* @deprecated To be removed - internal component prop
|
|
79
80
|
*/
|
|
80
81
|
export interface HoverCardInternalProps extends HoverCardProps {
|
|
81
|
-
actionOptions?:
|
|
82
|
+
actionOptions?: CardActionOptions;
|
|
82
83
|
/**
|
|
83
84
|
* Suspend hover card UI delays (fade-in, fade-out) for VR testing purposes.
|
|
84
85
|
*/
|
|
85
86
|
noFadeDelay?: boolean;
|
|
86
87
|
}
|
|
87
|
-
|
|
88
|
+
/**
|
|
89
|
+
* @deprecated To be removed - internal component prop
|
|
90
|
+
*/
|
|
91
|
+
export interface HoverCardComponentProps extends HoverCardProps {
|
|
88
92
|
analyticsHandler?: AnalyticsHandler;
|
|
89
93
|
canOpen?: boolean;
|
|
90
94
|
closeOnChildClick?: boolean;
|
|
91
95
|
}
|
|
96
|
+
/**
|
|
97
|
+
* @deprecated To be removed - internal component prop
|
|
98
|
+
*/
|
|
92
99
|
export type HoverCardContentProps = {
|
|
93
100
|
actionOptions?: InternalCardActionOptions;
|
|
94
101
|
cardState: CardState;
|
|
@@ -105,7 +112,13 @@ export type HoverCardContentProps = {
|
|
|
105
112
|
renderers?: CardProviderRenderers;
|
|
106
113
|
url: string;
|
|
107
114
|
};
|
|
115
|
+
/**
|
|
116
|
+
* @deprecated To be removed - internal component type
|
|
117
|
+
*/
|
|
108
118
|
export type ContentContainerWidthAppearance = 'default' | 'slim';
|
|
119
|
+
/**
|
|
120
|
+
* @deprecated To be removed - internal component prop
|
|
121
|
+
*/
|
|
109
122
|
export type ContentContainerProps = React.HTMLAttributes<HTMLDivElement> & {
|
|
110
123
|
isAIEnabled?: boolean;
|
|
111
124
|
testId?: string;
|
|
@@ -115,6 +128,9 @@ export type ContentContainerProps = React.HTMLAttributes<HTMLDivElement> & {
|
|
|
115
128
|
*/
|
|
116
129
|
widthAppearance?: ContentContainerWidthAppearance;
|
|
117
130
|
};
|
|
131
|
+
/**
|
|
132
|
+
* @deprecated To be removed - internal component prop
|
|
133
|
+
*/
|
|
118
134
|
export type ImagePreviewProps = {
|
|
119
135
|
fallbackElementHeight: number;
|
|
120
136
|
response?: SmartLinkResponse;
|
package/hover/package.json
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/smart-card/hover",
|
|
3
|
-
"main": "../dist/cjs/
|
|
4
|
-
"module": "../dist/esm/
|
|
5
|
-
"module:es2019": "../dist/es2019/
|
|
3
|
+
"main": "../dist/cjs/entry-points/hover.js",
|
|
4
|
+
"module": "../dist/esm/entry-points/hover.js",
|
|
5
|
+
"module:es2019": "../dist/es2019/entry-points/hover.js",
|
|
6
6
|
"sideEffects": [
|
|
7
7
|
"**/*.compiled.css"
|
|
8
8
|
],
|
|
9
|
-
"types": "../dist/types/
|
|
9
|
+
"types": "../dist/types/entry-points/hover.d.ts"
|
|
10
10
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/smart-card",
|
|
3
|
-
"version": "45.
|
|
3
|
+
"version": "45.23.0",
|
|
4
4
|
"description": "Smart card component",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"registry": "https://registry.npmjs.org/"
|
|
@@ -54,9 +54,9 @@
|
|
|
54
54
|
"@atlaskit/form": "^17.2.0",
|
|
55
55
|
"@atlaskit/frontend-utilities": "^4.5.0",
|
|
56
56
|
"@atlaskit/heading": "^7.2.0",
|
|
57
|
-
"@atlaskit/icon": "^37.
|
|
57
|
+
"@atlaskit/icon": "^37.7.0",
|
|
58
58
|
"@atlaskit/icon-file-type": "^8.3.0",
|
|
59
|
-
"@atlaskit/icon-lab": "^7.
|
|
59
|
+
"@atlaskit/icon-lab": "^7.9.0",
|
|
60
60
|
"@atlaskit/image": "^5.2.0",
|
|
61
61
|
"@atlaskit/json-ld-types": "^2.0.0",
|
|
62
62
|
"@atlaskit/link": "^5.1.0",
|
|
@@ -80,7 +80,7 @@
|
|
|
80
80
|
"@atlaskit/primitives": "^22.5.0",
|
|
81
81
|
"@atlaskit/react-compiler-gating": "^0.2.0",
|
|
82
82
|
"@atlaskit/react-ufo": "^7.10.0",
|
|
83
|
-
"@atlaskit/rovo-triggers": "^
|
|
83
|
+
"@atlaskit/rovo-triggers": "^11.0.0",
|
|
84
84
|
"@atlaskit/section-message": "^10.2.0",
|
|
85
85
|
"@atlaskit/select": "^22.11.0",
|
|
86
86
|
"@atlaskit/spinner": "^20.4.0",
|
|
@@ -1,63 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
5
|
-
Object.defineProperty(exports, "__esModule", {
|
|
6
|
-
value: true
|
|
7
|
-
});
|
|
8
|
-
exports.HoverCard = void 0;
|
|
9
|
-
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
10
|
-
var _react = _interopRequireWildcard(require("react"));
|
|
11
|
-
var _reactErrorBoundary = require("react-error-boundary");
|
|
12
|
-
var _reactMagneticDi = require("react-magnetic-di");
|
|
13
|
-
var _withAnalyticsEvents = _interopRequireDefault(require("@atlaskit/analytics-next/withAnalyticsEvents"));
|
|
14
|
-
var _useAnalyticsEvents2 = require("../../common/analytics/generated/use-analytics-events");
|
|
15
|
-
var _constants = require("../../constants");
|
|
16
|
-
var _failUfoExperience = require("../../state/analytics/failUfoExperience");
|
|
17
|
-
var _startUfoExperience = require("../../state/analytics/startUfoExperience");
|
|
18
|
-
var _SmartLinkModalProvider = require("../../state/modal/SmartLinkModalProvider");
|
|
19
|
-
var _useSmartLinkAnalyticsContext = require("../../utils/analytics/useSmartLinkAnalyticsContext");
|
|
20
|
-
var _HoverCardComponent = require("./components/HoverCardComponent");
|
|
21
|
-
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
|
|
22
|
-
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
23
|
-
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
24
|
-
var HoverCardWithErrorBoundary = function HoverCardWithErrorBoundary(props) {
|
|
25
|
-
var _useAnalyticsEvents = (0, _useAnalyticsEvents2.useAnalyticsEvents)(),
|
|
26
|
-
fireEvent = _useAnalyticsEvents.fireEvent;
|
|
27
|
-
var url = props.url,
|
|
28
|
-
id = props.id,
|
|
29
|
-
children = props.children;
|
|
30
|
-
var analyticsContext = (0, _useSmartLinkAnalyticsContext.useSmartLinkAnalyticsContext)({
|
|
31
|
-
display: _constants.CardDisplay.HoverCardPreview,
|
|
32
|
-
id: id,
|
|
33
|
-
source: _HoverCardComponent.HOVER_CARD_SOURCE,
|
|
34
|
-
url: url
|
|
35
|
-
});
|
|
36
|
-
var onError = (0, _react.useCallback)(function (error, info) {
|
|
37
|
-
(0, _startUfoExperience.startUfoExperience)('smart-link-rendered', id || 'NULL');
|
|
38
|
-
(0, _failUfoExperience.failUfoExperience)('smart-link-rendered', id || 'NULL');
|
|
39
|
-
(0, _failUfoExperience.failUfoExperience)('smart-link-authenticated', id || 'NULL');
|
|
40
|
-
fireEvent('ui.smartLink.renderFailed', _objectSpread(_objectSpread({}, analyticsContext === null || analyticsContext === void 0 ? void 0 : analyticsContext.attributes), {}, {
|
|
41
|
-
display: _constants.CardDisplay.HoverCardPreview,
|
|
42
|
-
id: id !== null && id !== void 0 ? id : null,
|
|
43
|
-
error: error,
|
|
44
|
-
errorInfo: info
|
|
45
|
-
}));
|
|
46
|
-
}, [analyticsContext, id, fireEvent]);
|
|
47
|
-
return /*#__PURE__*/_react.default.createElement(_reactErrorBoundary.ErrorBoundary, {
|
|
48
|
-
fallback: children,
|
|
49
|
-
onError: onError
|
|
50
|
-
}, /*#__PURE__*/_react.default.createElement(_SmartLinkModalProvider.SmartLinkModalProvider, null, /*#__PURE__*/_react.default.createElement(_HoverCardComponent.HoverCardComponent, props, children)));
|
|
51
|
-
};
|
|
52
|
-
var HoverCardWithoutAnalyticsContext = (0, _withAnalyticsEvents.default)()(HoverCardWithErrorBoundary);
|
|
53
|
-
|
|
54
|
-
/**
|
|
55
|
-
* A hover preview component using within smart links,
|
|
56
|
-
* e.g. inline card's hover preview and auth tooltip, flexible card's hover preview.
|
|
57
|
-
*
|
|
58
|
-
* This component contains additional props that smart-card internal components
|
|
59
|
-
* use to configure hover preview behaviour.
|
|
60
|
-
*/
|
|
61
|
-
var HoverCard = exports.HoverCard = function HoverCard(props) {
|
|
62
|
-
return /*#__PURE__*/_react.default.createElement(HoverCardWithoutAnalyticsContext, props);
|
|
63
|
-
};
|
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
Object.defineProperty(exports, "__esModule", {
|
|
5
|
-
value: true
|
|
6
|
-
});
|
|
7
|
-
exports.StandaloneHoverCard = void 0;
|
|
8
|
-
var _react = _interopRequireDefault(require("react"));
|
|
9
|
-
var _HoverCard = require("./HoverCard");
|
|
10
|
-
/**
|
|
11
|
-
* A standalone hover preview component
|
|
12
|
-
*/
|
|
13
|
-
var StandaloneHoverCard = exports.StandaloneHoverCard = function StandaloneHoverCard(props) {
|
|
14
|
-
return /*#__PURE__*/_react.default.createElement(_HoverCard.HoverCard, props);
|
|
15
|
-
};
|
|
@@ -1,55 +0,0 @@
|
|
|
1
|
-
import React, { useCallback } from 'react';
|
|
2
|
-
import { ErrorBoundary } from 'react-error-boundary';
|
|
3
|
-
import { di } from 'react-magnetic-di';
|
|
4
|
-
import withAnalyticsEvents from '@atlaskit/analytics-next/withAnalyticsEvents';
|
|
5
|
-
import { useAnalyticsEvents } from '../../common/analytics/generated/use-analytics-events';
|
|
6
|
-
import { CardDisplay } from '../../constants';
|
|
7
|
-
import { failUfoExperience } from '../../state/analytics/failUfoExperience';
|
|
8
|
-
import { startUfoExperience } from '../../state/analytics/startUfoExperience';
|
|
9
|
-
import { SmartLinkModalProvider } from '../../state/modal/SmartLinkModalProvider';
|
|
10
|
-
import { useSmartLinkAnalyticsContext } from '../../utils/analytics/useSmartLinkAnalyticsContext';
|
|
11
|
-
import { HOVER_CARD_SOURCE, HoverCardComponent } from './components/HoverCardComponent';
|
|
12
|
-
const HoverCardWithErrorBoundary = props => {
|
|
13
|
-
const {
|
|
14
|
-
fireEvent
|
|
15
|
-
} = useAnalyticsEvents();
|
|
16
|
-
const {
|
|
17
|
-
url,
|
|
18
|
-
id,
|
|
19
|
-
children
|
|
20
|
-
} = props;
|
|
21
|
-
const analyticsContext = useSmartLinkAnalyticsContext({
|
|
22
|
-
display: CardDisplay.HoverCardPreview,
|
|
23
|
-
id,
|
|
24
|
-
source: HOVER_CARD_SOURCE,
|
|
25
|
-
url
|
|
26
|
-
});
|
|
27
|
-
const onError = useCallback((error, info) => {
|
|
28
|
-
startUfoExperience('smart-link-rendered', id || 'NULL');
|
|
29
|
-
failUfoExperience('smart-link-rendered', id || 'NULL');
|
|
30
|
-
failUfoExperience('smart-link-authenticated', id || 'NULL');
|
|
31
|
-
fireEvent('ui.smartLink.renderFailed', {
|
|
32
|
-
...(analyticsContext === null || analyticsContext === void 0 ? void 0 : analyticsContext.attributes),
|
|
33
|
-
display: CardDisplay.HoverCardPreview,
|
|
34
|
-
id: id !== null && id !== void 0 ? id : null,
|
|
35
|
-
error: error,
|
|
36
|
-
errorInfo: info
|
|
37
|
-
});
|
|
38
|
-
}, [analyticsContext, id, fireEvent]);
|
|
39
|
-
return /*#__PURE__*/React.createElement(ErrorBoundary, {
|
|
40
|
-
fallback: children,
|
|
41
|
-
onError: onError
|
|
42
|
-
}, /*#__PURE__*/React.createElement(SmartLinkModalProvider, null, /*#__PURE__*/React.createElement(HoverCardComponent, props, children)));
|
|
43
|
-
};
|
|
44
|
-
const HoverCardWithoutAnalyticsContext = withAnalyticsEvents()(HoverCardWithErrorBoundary);
|
|
45
|
-
|
|
46
|
-
/**
|
|
47
|
-
* A hover preview component using within smart links,
|
|
48
|
-
* e.g. inline card's hover preview and auth tooltip, flexible card's hover preview.
|
|
49
|
-
*
|
|
50
|
-
* This component contains additional props that smart-card internal components
|
|
51
|
-
* use to configure hover preview behaviour.
|
|
52
|
-
*/
|
|
53
|
-
export const HoverCard = props => {
|
|
54
|
-
return /*#__PURE__*/React.createElement(HoverCardWithoutAnalyticsContext, props);
|
|
55
|
-
};
|
|
@@ -1,54 +0,0 @@
|
|
|
1
|
-
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
2
|
-
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
3
|
-
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
4
|
-
import React, { useCallback } from 'react';
|
|
5
|
-
import { ErrorBoundary } from 'react-error-boundary';
|
|
6
|
-
import { di } from 'react-magnetic-di';
|
|
7
|
-
import withAnalyticsEvents from '@atlaskit/analytics-next/withAnalyticsEvents';
|
|
8
|
-
import { useAnalyticsEvents } from '../../common/analytics/generated/use-analytics-events';
|
|
9
|
-
import { CardDisplay } from '../../constants';
|
|
10
|
-
import { failUfoExperience } from '../../state/analytics/failUfoExperience';
|
|
11
|
-
import { startUfoExperience } from '../../state/analytics/startUfoExperience';
|
|
12
|
-
import { SmartLinkModalProvider } from '../../state/modal/SmartLinkModalProvider';
|
|
13
|
-
import { useSmartLinkAnalyticsContext } from '../../utils/analytics/useSmartLinkAnalyticsContext';
|
|
14
|
-
import { HOVER_CARD_SOURCE, HoverCardComponent } from './components/HoverCardComponent';
|
|
15
|
-
var HoverCardWithErrorBoundary = function HoverCardWithErrorBoundary(props) {
|
|
16
|
-
var _useAnalyticsEvents = useAnalyticsEvents(),
|
|
17
|
-
fireEvent = _useAnalyticsEvents.fireEvent;
|
|
18
|
-
var url = props.url,
|
|
19
|
-
id = props.id,
|
|
20
|
-
children = props.children;
|
|
21
|
-
var analyticsContext = useSmartLinkAnalyticsContext({
|
|
22
|
-
display: CardDisplay.HoverCardPreview,
|
|
23
|
-
id: id,
|
|
24
|
-
source: HOVER_CARD_SOURCE,
|
|
25
|
-
url: url
|
|
26
|
-
});
|
|
27
|
-
var onError = useCallback(function (error, info) {
|
|
28
|
-
startUfoExperience('smart-link-rendered', id || 'NULL');
|
|
29
|
-
failUfoExperience('smart-link-rendered', id || 'NULL');
|
|
30
|
-
failUfoExperience('smart-link-authenticated', id || 'NULL');
|
|
31
|
-
fireEvent('ui.smartLink.renderFailed', _objectSpread(_objectSpread({}, analyticsContext === null || analyticsContext === void 0 ? void 0 : analyticsContext.attributes), {}, {
|
|
32
|
-
display: CardDisplay.HoverCardPreview,
|
|
33
|
-
id: id !== null && id !== void 0 ? id : null,
|
|
34
|
-
error: error,
|
|
35
|
-
errorInfo: info
|
|
36
|
-
}));
|
|
37
|
-
}, [analyticsContext, id, fireEvent]);
|
|
38
|
-
return /*#__PURE__*/React.createElement(ErrorBoundary, {
|
|
39
|
-
fallback: children,
|
|
40
|
-
onError: onError
|
|
41
|
-
}, /*#__PURE__*/React.createElement(SmartLinkModalProvider, null, /*#__PURE__*/React.createElement(HoverCardComponent, props, children)));
|
|
42
|
-
};
|
|
43
|
-
var HoverCardWithoutAnalyticsContext = withAnalyticsEvents()(HoverCardWithErrorBoundary);
|
|
44
|
-
|
|
45
|
-
/**
|
|
46
|
-
* A hover preview component using within smart links,
|
|
47
|
-
* e.g. inline card's hover preview and auth tooltip, flexible card's hover preview.
|
|
48
|
-
*
|
|
49
|
-
* This component contains additional props that smart-card internal components
|
|
50
|
-
* use to configure hover preview behaviour.
|
|
51
|
-
*/
|
|
52
|
-
export var HoverCard = function HoverCard(props) {
|
|
53
|
-
return /*#__PURE__*/React.createElement(HoverCardWithoutAnalyticsContext, props);
|
|
54
|
-
};
|