@atlaskit/smart-card 26.50.14 → 26.51.0

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

@@ -1,6 +1,6 @@
 import { LinkLozenge } from '../../extractors/common/lozenge/types';
 import { LinkPerson } from '@atlaskit/link-extractors';
-import { IconType, MediaType } from '../../constants';
+import { ActionName, IconType, MediaType } from '../../constants';
 import { InvokeRequestWithCardDetails } from '../hooks/use-invoke/types';
 import type { CardInnerAppearance } from '../../view/Card/types';
 import type { AnalyticsFacade } from '../analytics';
@@ -9,6 +9,10 @@ import type { AnalyticsFacade } from '../analytics';
  * underlying elements.
  */
 export type FlexibleUiDataContext = {
+    /**
+     * An object containing available action on the linked resource.
+     */
+    actions?: FlexibleUiActions;
     /**
      * An array containing data used to populate the AssignedToGroup element.
      * @see AvatarGroup
@@ -102,12 +106,6 @@ export type FlexibleUiDataContext = {
      * @see CreatedOn
      */
     createdOn?: string;
-    /**
-     * Contains data needed to show a preview action.
-     * @type PreviewActionData
-     * @see PreviewAction
-     */
-    previewAction?: PreviewActionData;
     /**
      * Contains data needed to show a view action.
      * @type ViewActionData
@@ -254,6 +252,9 @@ export type Media = {
     type: MediaType;
     url: string;
 };
+export type FlexibleUiActions = {
+    [ActionName.PreviewAction]?: PreviewActionData;
+};
 export type PreviewActionData = {
     downloadUrl?: string;
     linkIcon?: Icon;

package/dist/types/view/FlexibleCard/components/actions/index.d.ts

@@ -1,9 +1,9 @@
 /// <reference types="react" />
 import { ActionProps } from './action/types';
-import { PreviewActionProps } from './action/preview-action/types';
 import { ViewActionProps } from './action/view-action/types';
 import { DownloadActionProps } from './action/download-action/types';
 export { default as FollowAction } from './follow-action';
+export { default as PreviewAction } from './preview-action';
 /**
  * Creates a DeleteAction component. Accepts default ActionProps, but defaults
  * the icon to a cross icon.
@@ -16,12 +16,6 @@ export declare const DeleteAction: import("react").FC<ActionProps>;
  * @see Action
  */
 export declare const EditAction: import("react").FC<ActionProps>;
-/**
- * Creates a PreviewAction component. Accepts default PreviewActionProps, and defaults
- * to the text 'Preview' inside the button.
- * @see Action
- */
-export declare const PreviewAction: import("react").FC<PreviewActionProps>;
 /**
  * Creates a ViewAction component. Accepts default ViewActionProps, and defaults
  * to the text 'View' inside the button.

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

@@ -0,0 +1,4 @@
+import { type FC } from 'react';
+import type { PreviewActionProps } from './types';
+declare const PreviewAction: FC<PreviewActionProps>;
+export default PreviewAction;

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

@@ -0,0 +1,2 @@
+import { LinkActionProps } from '../types';
+export type PreviewActionProps = LinkActionProps;

package/dist/types/view/FlexibleCard/components/actions/types.d.ts

@@ -0,0 +1,7 @@
+import type { Optional } from '../../types';
+import type { ActionProps } from './action/types';
+/**
+ * Action based on link data.
+ * Action behaviour is determined by the availability of the link data.
+ */
+export type LinkActionProps = Optional<ActionProps, 'onClick'>;

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

@@ -79,12 +79,12 @@ export type FlexibleCardProps = {
      * Determine whether or not a preview card should show up when a user hovers
      * over the smartlink. Default value is false.
      */
-    showHoverPreview?: Boolean;
+    showHoverPreview?: boolean;
     /**
      * Determines whether to show an unauthorised view of the hover card
      * when a user hovers over a smartlink.
      */
-    showAuthTooltip?: Boolean;
+    showAuthTooltip?: boolean;
 };
 export type FlexibleUiOptions = {
     /**
@@ -146,3 +146,21 @@ export type ExtractFlexibleUiDataContextParams = Pick<FlexibleCardProps, 'id' |
     response?: JsonLd.Response;
     featureFlags?: Partial<LinkingPlatformFeatureFlags>;
 };
+/**
+ * Mark a specific props in the type as optional.
+ * FlexibleCard use this concept where base component has required props
+ * and the extended component provides these props. The props become an optional
+ * for the extended component but is still available for override/callback.
+ *
+ * For example: Action component require onClick callback to perform action
+ * but PreviewAction defines the onClick behaviour inside its component.
+ * PreviewAction still wants the onClick for a callback to executed after the
+ * action completes, but it is optional.
+ *
+ * Usage:
+ *   type ActionProps = { onClick: () => {}, content: string, icon?: React.ReactNode }
+ *   type PreviewActionProps = Optional<ActionProps, 'onClick'>
+ */
+export type Optional<T, K extends keyof T> = Omit<T, K> & {
+    [K in keyof T]?: T[K];
+};

package/dist/types-ts4.5/extractors/common/context/extractAccessContext.d.ts

@@ -1,14 +1,9 @@
 import { JsonLd } from 'json-ld-types';
 import { RequestAccessContextProps } from '../../../view/types';
 import { CreateUIAnalyticsEvent } from '@atlaskit/analytics-next';
-export declare const extractRequestAccessContext: ({ jsonLd, url, product, }: {
-    jsonLd: JsonLd.Meta.BaseMeta;
-    url: string;
-    product?: string | undefined;
-}) => RequestAccessContextProps;
 export declare const extractRequestAccessContextImproved: ({ jsonLd, url, product, createAnalyticsEvent, }: {
     jsonLd: JsonLd.Meta.BaseMeta;
     url: string;
     product: string;
-    createAnalyticsEvent: CreateUIAnalyticsEvent;
+    createAnalyticsEvent?: CreateUIAnalyticsEvent | undefined;
 }) => RequestAccessContextProps;

package/dist/types-ts4.5/extractors/common/context/index.d.ts

@@ -1 +1 @@
-export { extractRequestAccessContext } from './extractAccessContext';
+export { extractRequestAccessContextImproved } from './extractAccessContext';

package/dist/types-ts4.5/extractors/flexible/actions/index.d.ts

@@ -0,0 +1,5 @@
+import type { JsonLd } from 'json-ld-types';
+import type { FlexibleUiActions } from '../../../state/flexible-ui-context/types';
+import type { CardActionOptions } from '../../../view/Card/types';
+declare const extractActions: (response: JsonLd.Response, actionOptions?: CardActionOptions) => FlexibleUiActions | undefined;
+export default extractActions;

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

@@ -1,6 +1,6 @@
 import { LinkLozenge } from '../../extractors/common/lozenge/types';
 import { LinkPerson } from '@atlaskit/link-extractors';
-import { IconType, MediaType } from '../../constants';
+import { ActionName, IconType, MediaType } from '../../constants';
 import { InvokeRequestWithCardDetails } from '../hooks/use-invoke/types';
 import type { CardInnerAppearance } from '../../view/Card/types';
 import type { AnalyticsFacade } from '../analytics';
@@ -9,6 +9,10 @@ import type { AnalyticsFacade } from '../analytics';
  * underlying elements.
  */
 export type FlexibleUiDataContext = {
+    /**
+     * An object containing available action on the linked resource.
+     */
+    actions?: FlexibleUiActions;
     /**
      * An array containing data used to populate the AssignedToGroup element.
      * @see AvatarGroup
@@ -102,12 +106,6 @@ export type FlexibleUiDataContext = {
      * @see CreatedOn
      */
     createdOn?: string;
-    /**
-     * Contains data needed to show a preview action.
-     * @type PreviewActionData
-     * @see PreviewAction
-     */
-    previewAction?: PreviewActionData;
     /**
      * Contains data needed to show a view action.
      * @type ViewActionData
@@ -254,6 +252,9 @@ export type Media = {
     type: MediaType;
     url: string;
 };
+export type FlexibleUiActions = {
+    [ActionName.PreviewAction]?: PreviewActionData;
+};
 export type PreviewActionData = {
     downloadUrl?: string;
     linkIcon?: Icon;

package/dist/types-ts4.5/view/FlexibleCard/components/actions/index.d.ts

@@ -1,9 +1,9 @@
 /// <reference types="react" />
 import { ActionProps } from './action/types';
-import { PreviewActionProps } from './action/preview-action/types';
 import { ViewActionProps } from './action/view-action/types';
 import { DownloadActionProps } from './action/download-action/types';
 export { default as FollowAction } from './follow-action';
+export { default as PreviewAction } from './preview-action';
 /**
  * Creates a DeleteAction component. Accepts default ActionProps, but defaults
  * the icon to a cross icon.
@@ -16,12 +16,6 @@ export declare const DeleteAction: import("react").FC<ActionProps>;
  * @see Action
  */
 export declare const EditAction: import("react").FC<ActionProps>;
-/**
- * Creates a PreviewAction component. Accepts default PreviewActionProps, and defaults
- * to the text 'Preview' inside the button.
- * @see Action
- */
-export declare const PreviewAction: import("react").FC<PreviewActionProps>;
 /**
  * Creates a ViewAction component. Accepts default ViewActionProps, and defaults
  * to the text 'View' inside the button.

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

@@ -0,0 +1,4 @@
+import { type FC } from 'react';
+import type { PreviewActionProps } from './types';
+declare const PreviewAction: FC<PreviewActionProps>;
+export default PreviewAction;

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

@@ -0,0 +1,2 @@
+import { LinkActionProps } from '../types';
+export type PreviewActionProps = LinkActionProps;

package/dist/types-ts4.5/view/FlexibleCard/components/actions/types.d.ts

@@ -0,0 +1,7 @@
+import type { Optional } from '../../types';
+import type { ActionProps } from './action/types';
+/**
+ * Action based on link data.
+ * Action behaviour is determined by the availability of the link data.
+ */
+export type LinkActionProps = Optional<ActionProps, 'onClick'>;

package/dist/types-ts4.5/view/FlexibleCard/types.d.ts

@@ -79,12 +79,12 @@ export type FlexibleCardProps = {
      * Determine whether or not a preview card should show up when a user hovers
      * over the smartlink. Default value is false.
      */
-    showHoverPreview?: Boolean;
+    showHoverPreview?: boolean;
     /**
      * Determines whether to show an unauthorised view of the hover card
      * when a user hovers over a smartlink.
      */
-    showAuthTooltip?: Boolean;
+    showAuthTooltip?: boolean;
 };
 export type FlexibleUiOptions = {
     /**
@@ -146,3 +146,21 @@ export type ExtractFlexibleUiDataContextParams = Pick<FlexibleCardProps, 'id' |
     response?: JsonLd.Response;
     featureFlags?: Partial<LinkingPlatformFeatureFlags>;
 };
+/**
+ * Mark a specific props in the type as optional.
+ * FlexibleCard use this concept where base component has required props
+ * and the extended component provides these props. The props become an optional
+ * for the extended component but is still available for override/callback.
+ *
+ * For example: Action component require onClick callback to perform action
+ * but PreviewAction defines the onClick behaviour inside its component.
+ * PreviewAction still wants the onClick for a callback to executed after the
+ * action completes, but it is optional.
+ *
+ * Usage:
+ *   type ActionProps = { onClick: () => {}, content: string, icon?: React.ReactNode }
+ *   type PreviewActionProps = Optional<ActionProps, 'onClick'>
+ */
+export type Optional<T, K extends keyof T> = Omit<T, K> & {
+    [K in keyof T]?: T[K];
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/smart-card",
-  "version": "26.50.14",
+  "version": "26.51.0",
   "description": "Smart card component",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -51,7 +51,7 @@
     "@atlaskit/outbound-auth-flow-client": "^3.4.0",
     "@atlaskit/platform-feature-flags": "^0.2.1",
     "@atlaskit/popup": "^1.14.0",
-    "@atlaskit/primitives": "^5.2.0",
+    "@atlaskit/primitives": "^5.3.0",
     "@atlaskit/spinner": "^16.0.0",
     "@atlaskit/theme": "^12.7.0",
     "@atlaskit/tokens": "^1.42.0",

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

@@ -1,87 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
-var _react = _interopRequireDefault(require("react"));
-var _index = _interopRequireDefault(require("../index"));
-var _flexibleUiContext = require("../../../../../../state/flexible-ui-context");
-var _utils = require("../../../utils");
-var _useInvokeClientAction = _interopRequireDefault(require("../../../../../../state/hooks/use-invoke-client-action"));
-var _constants = require("../../../../../../constants");
-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; }
-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; }
-var PreviewAction = function PreviewAction(props) {
-  var appearance = props.appearance,
-    asDropDownItem = props.asDropDownItem,
-    testId = props.testId,
-    _onClick = props.onClick,
-    linkIcon = props.linkIcon,
-    src = props.src,
-    url = props.url,
-    title = props.title,
-    providerName = props.providerName,
-    downloadUrl = props.downloadUrl,
-    isSupportTheming = props.isSupportTheming;
-  var analytics = (0, _flexibleUiContext.useFlexibleUiAnalyticsContext)();
-  var invoke = (0, _useInvokeClientAction.default)({
-    analytics: analytics
-  });
-  if (src && url) {
-    var actionFn = /*#__PURE__*/function () {
-      var _ref = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee() {
-        return _regenerator.default.wrap(function _callee$(_context) {
-          while (1) switch (_context.prev = _context.next) {
-            case 0:
-              return _context.abrupt("return", (0, _utils.openEmbedModalWithFlexibleUiIcon)({
-                download: downloadUrl,
-                extensionKey: analytics === null || analytics === void 0 ? void 0 : analytics.extensionKey,
-                title: title,
-                providerName: providerName,
-                isSupportTheming: isSupportTheming,
-                analytics: analytics,
-                linkIcon: linkIcon,
-                src: src,
-                url: url
-              }));
-            case 1:
-            case "end":
-              return _context.stop();
-          }
-        }, _callee);
-      }));
-      return function actionFn() {
-        return _ref.apply(this, arguments);
-      };
-    }();
-    var action = _objectSpread(_objectSpread({}, props), {}, {
-      onClick: function onClick() {
-        invoke({
-          actionType: _constants.ActionName.PreviewAction,
-          actionFn: actionFn,
-          // These values have already been set in analytics context.
-          // We only pass these here for ufo experience.
-          display: analytics === null || analytics === void 0 ? void 0 : analytics.display,
-          extensionKey: analytics === null || analytics === void 0 ? void 0 : analytics.extensionKey
-        });
-        if (_onClick) {
-          _onClick();
-        }
-      }
-    });
-    return /*#__PURE__*/_react.default.createElement(_index.default, (0, _extends2.default)({}, action, {
-      appearance: appearance,
-      asDropDownItem: asDropDownItem,
-      testId: testId
-    }));
-  } else {
-    return null;
-  }
-};
-var _default = exports.default = PreviewAction;

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

@@ -1,63 +0,0 @@
-import _extends from "@babel/runtime/helpers/extends";
-import React from 'react';
-import Action from '../index';
-import { useFlexibleUiAnalyticsContext } from '../../../../../../state/flexible-ui-context';
-import { openEmbedModalWithFlexibleUiIcon } from '../../../utils';
-import useInvokeClientAction from '../../../../../../state/hooks/use-invoke-client-action';
-import { ActionName } from '../../../../../../constants';
-const PreviewAction = props => {
-  const {
-    appearance,
-    asDropDownItem,
-    testId,
-    onClick,
-    linkIcon,
-    src,
-    url,
-    title,
-    providerName,
-    downloadUrl,
-    isSupportTheming
-  } = props;
-  const analytics = useFlexibleUiAnalyticsContext();
-  const invoke = useInvokeClientAction({
-    analytics
-  });
-  if (src && url) {
-    const actionFn = async () => openEmbedModalWithFlexibleUiIcon({
-      download: downloadUrl,
-      extensionKey: analytics === null || analytics === void 0 ? void 0 : analytics.extensionKey,
-      title,
-      providerName,
-      isSupportTheming,
-      analytics,
-      linkIcon,
-      src,
-      url
-    });
-    const action = {
-      ...props,
-      onClick: () => {
-        invoke({
-          actionType: ActionName.PreviewAction,
-          actionFn,
-          // These values have already been set in analytics context.
-          // We only pass these here for ufo experience.
-          display: analytics === null || analytics === void 0 ? void 0 : analytics.display,
-          extensionKey: analytics === null || analytics === void 0 ? void 0 : analytics.extensionKey
-        });
-        if (onClick) {
-          onClick();
-        }
-      }
-    };
-    return /*#__PURE__*/React.createElement(Action, _extends({}, action, {
-      appearance: appearance,
-      asDropDownItem: asDropDownItem,
-      testId: testId
-    }));
-  } else {
-    return null;
-  }
-};
-export default PreviewAction;

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

@@ -1,80 +0,0 @@
-import _extends from "@babel/runtime/helpers/extends";
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
-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; }
-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; }
-import _regeneratorRuntime from "@babel/runtime/regenerator";
-import React from 'react';
-import Action from '../index';
-import { useFlexibleUiAnalyticsContext } from '../../../../../../state/flexible-ui-context';
-import { openEmbedModalWithFlexibleUiIcon } from '../../../utils';
-import useInvokeClientAction from '../../../../../../state/hooks/use-invoke-client-action';
-import { ActionName } from '../../../../../../constants';
-var PreviewAction = function PreviewAction(props) {
-  var appearance = props.appearance,
-    asDropDownItem = props.asDropDownItem,
-    testId = props.testId,
-    _onClick = props.onClick,
-    linkIcon = props.linkIcon,
-    src = props.src,
-    url = props.url,
-    title = props.title,
-    providerName = props.providerName,
-    downloadUrl = props.downloadUrl,
-    isSupportTheming = props.isSupportTheming;
-  var analytics = useFlexibleUiAnalyticsContext();
-  var invoke = useInvokeClientAction({
-    analytics: analytics
-  });
-  if (src && url) {
-    var actionFn = /*#__PURE__*/function () {
-      var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
-        return _regeneratorRuntime.wrap(function _callee$(_context) {
-          while (1) switch (_context.prev = _context.next) {
-            case 0:
-              return _context.abrupt("return", openEmbedModalWithFlexibleUiIcon({
-                download: downloadUrl,
-                extensionKey: analytics === null || analytics === void 0 ? void 0 : analytics.extensionKey,
-                title: title,
-                providerName: providerName,
-                isSupportTheming: isSupportTheming,
-                analytics: analytics,
-                linkIcon: linkIcon,
-                src: src,
-                url: url
-              }));
-            case 1:
-            case "end":
-              return _context.stop();
-          }
-        }, _callee);
-      }));
-      return function actionFn() {
-        return _ref.apply(this, arguments);
-      };
-    }();
-    var action = _objectSpread(_objectSpread({}, props), {}, {
-      onClick: function onClick() {
-        invoke({
-          actionType: ActionName.PreviewAction,
-          actionFn: actionFn,
-          // These values have already been set in analytics context.
-          // We only pass these here for ufo experience.
-          display: analytics === null || analytics === void 0 ? void 0 : analytics.display,
-          extensionKey: analytics === null || analytics === void 0 ? void 0 : analytics.extensionKey
-        });
-        if (_onClick) {
-          _onClick();
-        }
-      }
-    });
-    return /*#__PURE__*/React.createElement(Action, _extends({}, action, {
-      appearance: appearance,
-      asDropDownItem: asDropDownItem,
-      testId: testId
-    }));
-  } else {
-    return null;
-  }
-};
-export default PreviewAction;

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

@@ -1,4 +0,0 @@
-import React from 'react';
-import { PreviewActionProps } from './types';
-declare const PreviewAction: React.FC<PreviewActionProps>;
-export default PreviewAction;

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

@@ -1,12 +0,0 @@
-import { Icon } from '../../../../../../state/flexible-ui-context/types';
-import { ActionProps } from '../types';
-export type PreviewActionProps = ActionProps & FlexibleEmbedProps;
-export type FlexibleEmbedProps = {
-    downloadUrl?: string;
-    linkIcon?: Icon;
-    providerName?: string;
-    src?: string;
-    title?: string;
-    url: string;
-    isSupportTheming?: boolean;
-};

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

@@ -1,4 +0,0 @@
-import React from 'react';
-import { PreviewActionProps } from './types';
-declare const PreviewAction: React.FC<PreviewActionProps>;
-export default PreviewAction;

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

@@ -1,12 +0,0 @@
-import { Icon } from '../../../../../../state/flexible-ui-context/types';
-import { ActionProps } from '../types';
-export type PreviewActionProps = ActionProps & FlexibleEmbedProps;
-export type FlexibleEmbedProps = {
-    downloadUrl?: string;
-    linkIcon?: Icon;
-    providerName?: string;
-    src?: string;
-    title?: string;
-    url: string;
-    isSupportTheming?: boolean;
-};