@atlaskit/smart-card 45.13.3 → 45.13.5

package/dist/esm/view/EmbedCard/views/unauthorized-view/UnauthorizedCarouselView.js

@@ -75,6 +75,7 @@ var UnauthorizedCarouselView = function UnauthorizedCarouselView(_ref) {
   var items = useMemo(function () {
     if (!canAuthorize) {
       return [{
+        id: 'no-auth-available',
         title: intl.formatMessage(messages.unauthorised_account_name_no_provider),
         description: intl.formatMessage(messages.unauthorised_account_description_no_provider),
         image: /*#__PURE__*/React.createElement(NoAuthAvailableImage, null)
@@ -92,6 +93,7 @@ var UnauthorizedCarouselView = function UnauthorizedCarouselView(_ref) {
     // We only have special text for Google Drive and i18n select takes only one word (no space).
     var i18nSelectContext = (context === null || context === void 0 ? void 0 : context.text) === 'Google Drive' ? 'Google' : context === null || context === void 0 ? void 0 : context.text;
     var slides = [{
+      id: 'smart-link-benefit',
       title: intl.formatMessage(messages.connect_link_account_embed_carousel_sl_title),
       description: intl.formatMessage(messages.connect_link_account_embed_carousel_sl_description, {
         context: i18nSelectContext,
@@ -107,6 +109,7 @@ var UnauthorizedCarouselView = function UnauthorizedCarouselView(_ref) {
     // we show additional Rovo-specific teaser slides to encourage the user to connect their account.
     if (rovoOptions !== null && rovoOptions !== void 0 && rovoOptions.isRovoEnabled) {
       slides.push({
+        id: 'rovo-search-benefit',
         title: intl.formatMessage(messages.connect_link_account_embed_carousel_rovo_title),
         description: intl.formatMessage(messages.connect_link_account_embed_carousel_rovo_description, {
           context: providerName,
@@ -123,6 +126,7 @@ var UnauthorizedCarouselView = function UnauthorizedCarouselView(_ref) {
     }
     if (rovoOptions !== null && rovoOptions !== void 0 && rovoOptions.isRovoEnabled && rovoOptions !== null && rovoOptions !== void 0 && rovoOptions.isRovoLLMEnabled) {
       slides.push({
+        id: 'rovo-chat-benefit',
         title: intl.formatMessage(messages.connect_link_account_embed_carousel_rovochat_title),
         description: intl.formatMessage(messages.connect_link_account_embed_carousel_rovochat_description, {
           context: providerName
@@ -138,12 +142,22 @@ var UnauthorizedCarouselView = function UnauthorizedCarouselView(_ref) {
     }
     return slides;
   }, [canAuthorize, context, intl, product, providerName, providerIcon, rovoOptions]);
-  var handleOnAuthorizeClick = useCallback(function () {
+  var handleOnAuthorizeClick = useCallback(function (slideId) {
     if (onAuthorize) {
       fireEvent('track.applicationAccount.authStarted', {});
+      fireEvent('ui.button.clicked.carouselConnect', {
+        display: 'embed',
+        slideId: slideId
+      });
       onAuthorize();
     }
   }, [onAuthorize, fireEvent]);
+  var handleOnNextClick = useCallback(function (slideId) {
+    fireEvent('ui.button.clicked.carouselNext', {
+      display: 'embed',
+      slideId: slideId
+    });
+  }, [fireEvent]);
   var buttonLabel = context !== null && context !== void 0 && context.text ? intl.formatMessage(messages.connect_3p_account, {
     context: context.text
   }) : intl.formatMessage(messages.connect_link_account_card);
@@ -174,6 +188,7 @@ var UnauthorizedCarouselView = function UnauthorizedCarouselView(_ref) {
     icon: context === null || context === void 0 ? void 0 : context.icon,
     iconLabel: context === null || context === void 0 ? void 0 : context.text,
     items: items,
+    onNextClick: handleOnNextClick,
     onPrimaryButtonClick: canAuthorize ? handleOnAuthorizeClick : undefined,
     primaryButtonLabel: buttonLabel,
     testId: "".concat(testId, "-carousel")

package/dist/esm/view/FlexibleCard/components/common/atlaskit-icon/index.js

@@ -1,4 +1,5 @@
 import _extends from "@babel/runtime/helpers/extends";
+import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
 import React from 'react';
 import Loadable from 'react-loadable';
 import { IconTile } from '@atlaskit/icon';
@@ -35,8 +36,9 @@ var getDocumentIcon = function getDocumentIcon() {
 var getLiveDocumentIcon = function getLiveDocumentIcon() {
   return require('../../../../../common/ui/icons/live-document-icon').default;
 };
+var PRIORITY_ICONS = [IconType.PriorityBlocker, IconType.PriorityCritical, IconType.PriorityHigh, IconType.PriorityHighest, IconType.PriorityLow, IconType.PriorityLowest, IconType.PriorityMajor, IconType.PriorityMedium, IconType.PriorityMinor, IconType.PriorityTrivial];
 var isCoreIcon = function isCoreIcon(icon) {
-  return [IconType.Project, IconType.Template, IconType.Forbidden, IconType.Default, IconType.Error, IconType.Attachment, IconType.CheckItem, IconType.Component, IconType.Comment, IconType.View, IconType.React, IconType.Vote, IconType.PriorityUndefined, IconType.ProgrammingLanguage, IconType.Subscriber, IconType.SubTasksProgress].includes(icon);
+  return [IconType.Project, IconType.Template, IconType.Forbidden, IconType.Default, IconType.Error, IconType.Attachment, IconType.CheckItem, IconType.Component, IconType.Comment, IconType.View, IconType.React, IconType.Vote, IconType.PriorityUndefined, IconType.ProgrammingLanguage, IconType.Subscriber, IconType.SubTasksProgress].concat(_toConsumableArray(fg('platform_sl_priority_icon') ? PRIORITY_ICONS : [])).includes(icon);
 };
 var AtlaskitIcon = function AtlaskitIcon(_ref) {
   var icon = _ref.icon,
@@ -100,6 +102,13 @@ var AtlaskitIcon = function AtlaskitIcon(_ref) {
         });
       case SmartLinkSize.Large:
       case SmartLinkSize.XLarge:
+        if (PRIORITY_ICONS.includes(icon) && fg('platform_sl_priority_icon')) {
+          return /*#__PURE__*/React.createElement(ImportedIcon, {
+            label: label,
+            testId: testId,
+            color: color
+          });
+        }
         var appearance;
         if (icon === IconType.Error || icon === IconType.Forbidden) {
           appearance = 'redBold';

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

@@ -12,7 +12,7 @@ import LinkWarningModal from './LinkWarningModal';
 import { useLinkWarningModal } from './LinkWarningModal/hooks/use-link-warning-modal';
 var PACKAGE_DATA = {
   packageName: "@atlaskit/smart-card",
-  packageVersion: "45.13.2",
+  packageVersion: "45.13.4",
   componentName: 'linkUrl'
 };
 var LinkUrl = function LinkUrl(_ref) {

package/dist/types/common/analytics/generated/analytics.types.d.ts

@@ -3,7 +3,7 @@
  *
  * Generates Typescript types for analytics events from analytics.spec.yaml
  *
- * @codegen <<SignedSource::4e18b8952a94e4fc3afd62ef6213f7b1>>
+ * @codegen <<SignedSource::326efd393bebe329396aa4b676d0ff6d>>
  * @codegenCommand yarn workspace @atlassian/analytics-tooling run analytics:codegen smart-card
  */
 export type PackageMetaDataContextType = {
@@ -232,6 +232,14 @@ export type ButtonClickedConnectAccountAttributesType = {
     display: 'inline' | 'block' | 'embed' | 'embedPreview' | 'flexible' | 'hoverCardPreview' | 'url';
     definitionId?: string | null;
 };
+export type ButtonClickedCarouselNextAttributesType = {
+    display: 'inline' | 'block' | 'embed' | 'embedPreview' | 'flexible' | 'hoverCardPreview' | 'url';
+    slideId: string;
+};
+export type ButtonClickedCarouselConnectAttributesType = {
+    display: 'inline' | 'block' | 'embed' | 'embedPreview' | 'flexible' | 'hoverCardPreview' | 'url';
+    slideId: string;
+};
 export type SmartLinkClickedTryAnotherAccountAttributesType = {
     display: 'inline' | 'block' | 'embed' | 'embedPreview' | 'flexible' | 'hoverCardPreview' | 'url';
     definitionId?: string | null;
@@ -277,8 +285,8 @@ export type SmartLinkClickedSmartlinkClickAnalyticsWorkflowsAttributesType = {
     eventName: string;
     firstPartyIdentifier?: string | null;
     clickedAt: string;
-    isAuxClick?: boolean;
-    isContextMenu?: boolean;
+    isAuxClick?: boolean | null;
+    isContextMenu?: boolean | null;
 };
 export type AnalyticsEventAttributes = {
     /**
@@ -413,6 +421,14 @@ export type AnalyticsEventAttributes = {
     /**
      * fires an event that represents when a user clicks on the authentication call to action with no current authenticated account. (i.e. Connect to Preview). */
     'ui.button.clicked.connectAccount': ButtonClickedConnectAccountAttributesType;
+    /**
+     * Fires when a user clicks the "See next" button in a smart link carousel view. Used to measure engagement depth — how many users navigate past the first benefit slide.
+     *  */
+    'ui.button.clicked.carouselNext': ButtonClickedCarouselNextAttributesType;
+    /**
+     * Fires when a user clicks the connect account button from within a smart link carousel view. Captures which benefit slide the user was viewing when they decided to connect, enabling measurement of which slide is most persuasive.
+     *  */
+    'ui.button.clicked.carouselConnect': ButtonClickedCarouselConnectAttributesType;
     /**
      * fires an event that represents when a user clicks on the authentication call to action with a forbidden authenticated account. (i.e. Try another account). */
     'ui.smartLink.clicked.tryAnotherAccount': SmartLinkClickedTryAnotherAccountAttributesType;

package/dist/types/common/ui/icons/priority-blocker-icon.d.ts

@@ -1,6 +1,7 @@
 /**
  * @jsxRuntime classic
  * @jsx jsx
+ * Delete on cleanup of platform_sl_priority_icon
  */
 import type { FC } from 'react';
 export interface PriorityIconProps {

package/dist/types/common/ui/icons/priority-critical-icon.d.ts

@@ -1,6 +1,7 @@
 /**
  * @jsxRuntime classic
  * @jsx jsx
+ * Delete on cleanup of platform_sl_priority_icon
  */
 import type { FC } from 'react';
 export interface PriorityIconProps {

package/dist/types/common/ui/icons/priority-high-icon.d.ts

@@ -1,6 +1,7 @@
 /**
  * @jsxRuntime classic
  * @jsx jsx
+ * Delete on cleanup of platform_sl_priority_icon
  */
 import type { FC } from 'react';
 export interface PriorityIconProps {

package/dist/types/common/ui/icons/priority-highest-icon.d.ts

@@ -1,6 +1,7 @@
 /**
  * @jsxRuntime classic
  * @jsx jsx
+ * Delete on cleanup of platform_sl_priority_icon
  */
 import type { FC } from 'react';
 export interface PriorityIconProps {

package/dist/types/common/ui/icons/priority-low-icon.d.ts

@@ -1,6 +1,7 @@
 /**
  * @jsxRuntime classic
  * @jsx jsx
+ * Delete on cleanup of platform_sl_priority_icon
  */
 import type { FC } from 'react';
 export interface PriorityIconProps {

package/dist/types/common/ui/icons/priority-lowest-icon.d.ts

@@ -1,6 +1,7 @@
 /**
  * @jsxRuntime classic
  * @jsx jsx
+ * Delete on cleanup of platform_sl_priority_icon
  */
 import type { FC } from 'react';
 export interface PriorityIconProps {

package/dist/types/common/ui/icons/priority-major-icon.d.ts

@@ -1,6 +1,7 @@
 /**
  * @jsxRuntime classic
  * @jsx jsx
+ * Delete on cleanup of platform_sl_priority_icon
  */
 import type { FC } from 'react';
 export interface PriorityIconProps {

package/dist/types/common/ui/icons/priority-medium-icon.d.ts

@@ -1,6 +1,7 @@
 /**
  * @jsxRuntime classic
  * @jsx jsx
+ * Delete on cleanup of platform_sl_priority_icon
  */
 import type { FC } from 'react';
 export interface PriorityIconProps {

package/dist/types/common/ui/icons/priority-minor-icon.d.ts

@@ -1,6 +1,7 @@
 /**
  * @jsxRuntime classic
  * @jsx jsx
+ * Delete on cleanup of platform_sl_priority_icon
  */
 import type { FC } from 'react';
 export interface PriorityIconProps {

package/dist/types/common/ui/icons/priority-trivial-icon.d.ts

@@ -1,6 +1,7 @@
 /**
  * @jsxRuntime classic
  * @jsx jsx
+ * Delete on cleanup of platform_sl_priority_icon
  */
 import type { FC } from 'react';
 export interface PriorityIconProps {

package/dist/types/view/EmbedCard/components/carousel/index.d.ts

@@ -13,12 +13,14 @@ type CarouselProps = {
     initialSlideIndex?: number;
     /** Ordered list of teaser slides */
     items: CarouselItem[];
+    /** Called when the user clicks the "See next" navigation button */
+    onNextClick?: (slideId: string) => void;
     /** Called when the user clicks the primary button */
-    onPrimaryButtonClick?: () => void;
+    onPrimaryButtonClick?: (slideId: string) => void;
     /** Text for the auth button, e.g. "Connect to Figma" */
     primaryButtonLabel: string;
     /** testId prefix */
     testId?: string;
 };
-declare const Carousel: ({ icon, iconLabel, initialSlideIndex, items, onPrimaryButtonClick, primaryButtonLabel, testId, }: CarouselProps) => React.JSX.Element;
+declare const Carousel: ({ icon, iconLabel, initialSlideIndex, items, onNextClick, onPrimaryButtonClick, primaryButtonLabel, testId, }: CarouselProps) => React.JSX.Element;
 export default Carousel;

package/dist/types/view/EmbedCard/components/carousel/types.d.ts

@@ -15,6 +15,12 @@ export type CarouselItem = {
      * provider name (e.g. "Google Drive") and returns the final string.
      */
     description: string;
+    /**
+     * Stable semantic identifier for this slide — used in analytics to track
+     * which slide drove connect/navigation events, independent of slide order.
+     * e.g. 'smart-link-benefit', 'rovo-search-benefit', 'rovo-chat-benefit'
+     */
+    id: string;
     /** Large hero image — either a React element (e.g. SVG) or an image URL */
     image: ReactNode | string;
     /**

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/smart-card",
-	"version": "45.13.3",
+	"version": "45.13.5",
 	"description": "Smart card component",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -40,7 +40,7 @@
 		"@atlaskit/analytics-cross-product": "^2.1.0",
 		"@atlaskit/analytics-gas-types": "^6.0.0",
 		"@atlaskit/analytics-next": "^12.3.0",
-		"@atlaskit/avatar": "^26.3.0",
+		"@atlaskit/avatar": "^26.4.0",
 		"@atlaskit/avatar-group": "^13.2.0",
 		"@atlaskit/badge": "^19.1.0",
 		"@atlaskit/browser-apis": "^1.2.0",
@@ -70,7 +70,7 @@
 		"@atlaskit/lozenge": "^14.1.0",
 		"@atlaskit/menu": "^9.2.0",
 		"@atlaskit/modal-dialog": "^16.2.0",
-		"@atlaskit/motion": "^7.5.0",
+		"@atlaskit/motion": "^8.0.0",
 		"@atlaskit/object": "^2.2.0",
 		"@atlaskit/outbound-auth-flow-client": "^4.1.0",
 		"@atlaskit/platform-feature-flags": "^2.1.0",
@@ -88,7 +88,7 @@
 		"@atlaskit/textfield": "^9.1.0",
 		"@atlaskit/theme": "^26.1.0",
 		"@atlaskit/tile": "^2.3.0",
-		"@atlaskit/tmp-editor-statsig": "^135.0.0",
+		"@atlaskit/tmp-editor-statsig": "^135.2.0",
 		"@atlaskit/tokens": "^16.3.0",
 		"@atlaskit/tooltip": "^23.2.0",
 		"@atlaskit/ufo": "^1.0.0",
@@ -211,6 +211,9 @@
 		"jfp-magma-platform-lozenge-jump-fix": {
 			"type": "boolean"
 		},
+		"platform_sl_priority_icon": {
+			"type": "boolean"
+		},
 		"platform_sl_action_refactoring": {
 			"type": "boolean"
 		},