@atlaskit/smart-card 45.13.3 → 45.13.4

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 CHANGED
@@ -1,5 +1,13 @@
1
1
  # @atlaskit/smart-card
2
2
 
3
+ ## 45.13.4
4
+
5
+ ### Patch Changes
6
+
7
+ - [`a49234e409f3c`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/a49234e409f3c) -
8
+ Add analytics events on embed carousel unauth view
9
+ - Updated dependencies
10
+
3
11
  ## 45.13.3
4
12
 
5
13
  ### Patch Changes
@@ -725,6 +725,41 @@ events:
725
725
  required: false
726
726
  type: string
727
727
  description: The definitionId of the Smart Link resolver invoked.
728
+ - button clicked (carouselNext):
729
+ type: ui
730
+ description: >
731
+ Fires when a user clicks the "See next" button in a smart link carousel view.
732
+ Used to measure engagement depth — how many users navigate past the first benefit slide.
733
+ attributes:
734
+ <<: [*PackageMetaDataContext, *CommonContext]
735
+ display:
736
+ required: true
737
+ type: ['inline', 'block', 'embed', 'embedPreview', 'flexible', 'hoverCardPreview', 'url']
738
+ description: The card display type from which the carousel is rendered.
739
+ slideId:
740
+ required: true
741
+ type: string
742
+ description: >
743
+ Stable semantic identifier for the slide (e.g. 'smart-link-benefit', 'rovo-search-benefit').
744
+ Used instead of slideIndex so analytics remain accurate if slide order changes.
745
+ - button clicked (carouselConnect):
746
+ type: ui
747
+ description: >
748
+ Fires when a user clicks the connect account button from within a smart link carousel view.
749
+ Captures which benefit slide the user was viewing when they decided to connect,
750
+ enabling measurement of which slide is most persuasive.
751
+ attributes:
752
+ <<: [*PackageMetaDataContext, *CommonContext]
753
+ display:
754
+ required: true
755
+ type: ['inline', 'block', 'embed', 'embedPreview', 'flexible', 'hoverCardPreview', 'url']
756
+ description: The card display type from which the carousel is rendered.
757
+ slideId:
758
+ required: true
759
+ type: string
760
+ description: >
761
+ Stable semantic identifier for the slide (e.g. 'smart-link-benefit', 'rovo-search-benefit').
762
+ Used instead of slideIndex so analytics remain accurate if slide order changes.
728
763
  - smartLink clicked (tryAnotherAccount):
729
764
  type: ui
730
765
  description:
@@ -11,7 +11,7 @@ var ANALYTICS_CHANNEL = exports.ANALYTICS_CHANNEL = 'media';
11
11
  var context = exports.context = {
12
12
  componentName: 'smart-cards',
13
13
  packageName: "@atlaskit/smart-card" || '',
14
- packageVersion: "45.13.2" || ''
14
+ packageVersion: "45.13.3" || ''
15
15
  };
16
16
  var TrackQuickActionType = exports.TrackQuickActionType = /*#__PURE__*/function (TrackQuickActionType) {
17
17
  TrackQuickActionType["StatusUpdate"] = "StatusUpdate";
@@ -42,6 +42,7 @@ var Carousel = function Carousel(_ref) {
42
42
  _ref$initialSlideInde = _ref.initialSlideIndex,
43
43
  initialSlideIndex = _ref$initialSlideInde === void 0 ? 0 : _ref$initialSlideInde,
44
44
  items = _ref.items,
45
+ onNextClick = _ref.onNextClick,
45
46
  onPrimaryButtonClick = _ref.onPrimaryButtonClick,
46
47
  primaryButtonLabel = _ref.primaryButtonLabel,
47
48
  _ref$testId = _ref.testId,
@@ -82,10 +83,11 @@ var Carousel = function Carousel(_ref) {
82
83
  }, []);
83
84
  var goNext = (0, _react.useCallback)(function () {
84
85
  hasNavigated.current = true;
86
+ onNextClick === null || onNextClick === void 0 || onNextClick(items[activeIndex].id);
85
87
  setActiveIndex(function (current) {
86
88
  return (current + 1) % items.length;
87
89
  });
88
- }, [items.length]);
90
+ }, [items, activeIndex, onNextClick]);
89
91
  var goPrev = (0, _react.useCallback)(function () {
90
92
  hasNavigated.current = true;
91
93
  setActiveIndex(function (current) {
@@ -99,6 +101,9 @@ var Carousel = function Carousel(_ref) {
99
101
  hasNavigated.current = true;
100
102
  setActiveIndex(index);
101
103
  }, [activeIndex]);
104
+ var handlePrimaryButtonClick = (0, _react.useCallback)(function () {
105
+ onPrimaryButtonClick === null || onPrimaryButtonClick === void 0 || onPrimaryButtonClick(items[activeIndex].id);
106
+ }, [onPrimaryButtonClick, items, activeIndex]);
102
107
  var currentSlide = items[activeIndex];
103
108
  var isFirstSlide = activeIndex === 0;
104
109
  var isLastSlide = activeIndex === items.length - 1;
@@ -117,7 +122,7 @@ var Carousel = function Carousel(_ref) {
117
122
  iconLabel: iconLabel,
118
123
  image: currentSlide.image,
119
124
  title: currentSlide.title,
120
- onPrimaryButtonClick: onPrimaryButtonClick,
125
+ onPrimaryButtonClick: onPrimaryButtonClick ? handlePrimaryButtonClick : undefined,
121
126
  onBackClick: !isFirstSlide ? goPrev : undefined,
122
127
  onDotClick: goTo,
123
128
  onNextClick: !isLastSlide ? goNext : undefined,
@@ -84,6 +84,7 @@ var UnauthorizedCarouselView = function UnauthorizedCarouselView(_ref) {
84
84
  var items = (0, _react.useMemo)(function () {
85
85
  if (!canAuthorize) {
86
86
  return [{
87
+ id: 'no-auth-available',
87
88
  title: intl.formatMessage(_messages.messages.unauthorised_account_name_no_provider),
88
89
  description: intl.formatMessage(_messages.messages.unauthorised_account_description_no_provider),
89
90
  image: /*#__PURE__*/_react.default.createElement(_NoAuthAvailableImage.default, null)
@@ -101,6 +102,7 @@ var UnauthorizedCarouselView = function UnauthorizedCarouselView(_ref) {
101
102
  // We only have special text for Google Drive and i18n select takes only one word (no space).
102
103
  var i18nSelectContext = (context === null || context === void 0 ? void 0 : context.text) === 'Google Drive' ? 'Google' : context === null || context === void 0 ? void 0 : context.text;
103
104
  var slides = [{
105
+ id: 'smart-link-benefit',
104
106
  title: intl.formatMessage(_messages.messages.connect_link_account_embed_carousel_sl_title),
105
107
  description: intl.formatMessage(_messages.messages.connect_link_account_embed_carousel_sl_description, {
106
108
  context: i18nSelectContext,
@@ -116,6 +118,7 @@ var UnauthorizedCarouselView = function UnauthorizedCarouselView(_ref) {
116
118
  // we show additional Rovo-specific teaser slides to encourage the user to connect their account.
117
119
  if (rovoOptions !== null && rovoOptions !== void 0 && rovoOptions.isRovoEnabled) {
118
120
  slides.push({
121
+ id: 'rovo-search-benefit',
119
122
  title: intl.formatMessage(_messages.messages.connect_link_account_embed_carousel_rovo_title),
120
123
  description: intl.formatMessage(_messages.messages.connect_link_account_embed_carousel_rovo_description, {
121
124
  context: providerName,
@@ -132,6 +135,7 @@ var UnauthorizedCarouselView = function UnauthorizedCarouselView(_ref) {
132
135
  }
133
136
  if (rovoOptions !== null && rovoOptions !== void 0 && rovoOptions.isRovoEnabled && rovoOptions !== null && rovoOptions !== void 0 && rovoOptions.isRovoLLMEnabled) {
134
137
  slides.push({
138
+ id: 'rovo-chat-benefit',
135
139
  title: intl.formatMessage(_messages.messages.connect_link_account_embed_carousel_rovochat_title),
136
140
  description: intl.formatMessage(_messages.messages.connect_link_account_embed_carousel_rovochat_description, {
137
141
  context: providerName
@@ -147,12 +151,22 @@ var UnauthorizedCarouselView = function UnauthorizedCarouselView(_ref) {
147
151
  }
148
152
  return slides;
149
153
  }, [canAuthorize, context, intl, product, providerName, providerIcon, rovoOptions]);
150
- var handleOnAuthorizeClick = (0, _react.useCallback)(function () {
154
+ var handleOnAuthorizeClick = (0, _react.useCallback)(function (slideId) {
151
155
  if (onAuthorize) {
152
156
  fireEvent('track.applicationAccount.authStarted', {});
157
+ fireEvent('ui.button.clicked.carouselConnect', {
158
+ display: 'embed',
159
+ slideId: slideId
160
+ });
153
161
  onAuthorize();
154
162
  }
155
163
  }, [onAuthorize, fireEvent]);
164
+ var handleOnNextClick = (0, _react.useCallback)(function (slideId) {
165
+ fireEvent('ui.button.clicked.carouselNext', {
166
+ display: 'embed',
167
+ slideId: slideId
168
+ });
169
+ }, [fireEvent]);
156
170
  var buttonLabel = context !== null && context !== void 0 && context.text ? intl.formatMessage(_messages.messages.connect_3p_account, {
157
171
  context: context.text
158
172
  }) : intl.formatMessage(_messages.messages.connect_link_account_card);
@@ -183,6 +197,7 @@ var UnauthorizedCarouselView = function UnauthorizedCarouselView(_ref) {
183
197
  icon: context === null || context === void 0 ? void 0 : context.icon,
184
198
  iconLabel: context === null || context === void 0 ? void 0 : context.text,
185
199
  items: items,
200
+ onNextClick: handleOnNextClick,
186
201
  onPrimaryButtonClick: canAuthorize ? handleOnAuthorizeClick : undefined,
187
202
  primaryButtonLabel: buttonLabel,
188
203
  testId: "".concat(testId, "-carousel")
@@ -19,7 +19,7 @@ var _excluded = ["href", "children", "checkSafety", "onClick", "testId", "isLink
19
19
  _excluded2 = ["isLinkSafe", "showSafetyWarningModal"];
20
20
  var PACKAGE_DATA = {
21
21
  packageName: "@atlaskit/smart-card",
22
- packageVersion: "45.13.2",
22
+ packageVersion: "45.13.3",
23
23
  componentName: 'linkUrl'
24
24
  };
25
25
  var LinkUrl = function LinkUrl(_ref) {
@@ -2,7 +2,7 @@ export const ANALYTICS_CHANNEL = 'media';
2
2
  export const context = {
3
3
  componentName: 'smart-cards',
4
4
  packageName: "@atlaskit/smart-card" || '',
5
- packageVersion: "45.13.2" || ''
5
+ packageVersion: "45.13.3" || ''
6
6
  };
7
7
  export let TrackQuickActionType = /*#__PURE__*/function (TrackQuickActionType) {
8
8
  TrackQuickActionType["StatusUpdate"] = "StatusUpdate";
@@ -31,6 +31,7 @@ const Carousel = ({
31
31
  iconLabel,
32
32
  initialSlideIndex = 0,
33
33
  items,
34
+ onNextClick,
34
35
  onPrimaryButtonClick,
35
36
  primaryButtonLabel,
36
37
  testId = 'embed-card-teaser-carousel'
@@ -62,8 +63,9 @@ const Carousel = ({
62
63
  }, []);
63
64
  const goNext = useCallback(() => {
64
65
  hasNavigated.current = true;
66
+ onNextClick === null || onNextClick === void 0 ? void 0 : onNextClick(items[activeIndex].id);
65
67
  setActiveIndex(current => (current + 1) % items.length);
66
- }, [items.length]);
68
+ }, [items, activeIndex, onNextClick]);
67
69
  const goPrev = useCallback(() => {
68
70
  hasNavigated.current = true;
69
71
  setActiveIndex(current => Math.max(0, current - 1));
@@ -75,6 +77,9 @@ const Carousel = ({
75
77
  hasNavigated.current = true;
76
78
  setActiveIndex(index);
77
79
  }, [activeIndex]);
80
+ const handlePrimaryButtonClick = useCallback(() => {
81
+ onPrimaryButtonClick === null || onPrimaryButtonClick === void 0 ? void 0 : onPrimaryButtonClick(items[activeIndex].id);
82
+ }, [onPrimaryButtonClick, items, activeIndex]);
78
83
  const currentSlide = items[activeIndex];
79
84
  const isFirstSlide = activeIndex === 0;
80
85
  const isLastSlide = activeIndex === items.length - 1;
@@ -93,7 +98,7 @@ const Carousel = ({
93
98
  iconLabel: iconLabel,
94
99
  image: currentSlide.image,
95
100
  title: currentSlide.title,
96
- onPrimaryButtonClick: onPrimaryButtonClick,
101
+ onPrimaryButtonClick: onPrimaryButtonClick ? handlePrimaryButtonClick : undefined,
97
102
  onBackClick: !isFirstSlide ? goPrev : undefined,
98
103
  onDotClick: goTo,
99
104
  onNextClick: !isLastSlide ? goNext : undefined,
@@ -77,6 +77,7 @@ const UnauthorizedCarouselView = ({
77
77
  const items = useMemo(() => {
78
78
  if (!canAuthorize) {
79
79
  return [{
80
+ id: 'no-auth-available',
80
81
  title: intl.formatMessage(messages.unauthorised_account_name_no_provider),
81
82
  description: intl.formatMessage(messages.unauthorised_account_description_no_provider),
82
83
  image: /*#__PURE__*/React.createElement(NoAuthAvailableImage, null)
@@ -94,6 +95,7 @@ const UnauthorizedCarouselView = ({
94
95
  // We only have special text for Google Drive and i18n select takes only one word (no space).
95
96
  const i18nSelectContext = (context === null || context === void 0 ? void 0 : context.text) === 'Google Drive' ? 'Google' : context === null || context === void 0 ? void 0 : context.text;
96
97
  const slides = [{
98
+ id: 'smart-link-benefit',
97
99
  title: intl.formatMessage(messages.connect_link_account_embed_carousel_sl_title),
98
100
  description: intl.formatMessage(messages.connect_link_account_embed_carousel_sl_description, {
99
101
  context: i18nSelectContext,
@@ -109,6 +111,7 @@ const UnauthorizedCarouselView = ({
109
111
  // we show additional Rovo-specific teaser slides to encourage the user to connect their account.
110
112
  if (rovoOptions !== null && rovoOptions !== void 0 && rovoOptions.isRovoEnabled) {
111
113
  slides.push({
114
+ id: 'rovo-search-benefit',
112
115
  title: intl.formatMessage(messages.connect_link_account_embed_carousel_rovo_title),
113
116
  description: intl.formatMessage(messages.connect_link_account_embed_carousel_rovo_description, {
114
117
  context: providerName,
@@ -125,6 +128,7 @@ const UnauthorizedCarouselView = ({
125
128
  }
126
129
  if (rovoOptions !== null && rovoOptions !== void 0 && rovoOptions.isRovoEnabled && rovoOptions !== null && rovoOptions !== void 0 && rovoOptions.isRovoLLMEnabled) {
127
130
  slides.push({
131
+ id: 'rovo-chat-benefit',
128
132
  title: intl.formatMessage(messages.connect_link_account_embed_carousel_rovochat_title),
129
133
  description: intl.formatMessage(messages.connect_link_account_embed_carousel_rovochat_description, {
130
134
  context: providerName
@@ -140,12 +144,22 @@ const UnauthorizedCarouselView = ({
140
144
  }
141
145
  return slides;
142
146
  }, [canAuthorize, context, intl, product, providerName, providerIcon, rovoOptions]);
143
- const handleOnAuthorizeClick = useCallback(() => {
147
+ const handleOnAuthorizeClick = useCallback(slideId => {
144
148
  if (onAuthorize) {
145
149
  fireEvent('track.applicationAccount.authStarted', {});
150
+ fireEvent('ui.button.clicked.carouselConnect', {
151
+ display: 'embed',
152
+ slideId
153
+ });
146
154
  onAuthorize();
147
155
  }
148
156
  }, [onAuthorize, fireEvent]);
157
+ const handleOnNextClick = useCallback(slideId => {
158
+ fireEvent('ui.button.clicked.carouselNext', {
159
+ display: 'embed',
160
+ slideId
161
+ });
162
+ }, [fireEvent]);
149
163
  const buttonLabel = context !== null && context !== void 0 && context.text ? intl.formatMessage(messages.connect_3p_account, {
150
164
  context: context.text
151
165
  }) : intl.formatMessage(messages.connect_link_account_card);
@@ -176,6 +190,7 @@ const UnauthorizedCarouselView = ({
176
190
  icon: context === null || context === void 0 ? void 0 : context.icon,
177
191
  iconLabel: context === null || context === void 0 ? void 0 : context.text,
178
192
  items: items,
193
+ onNextClick: handleOnNextClick,
179
194
  onPrimaryButtonClick: canAuthorize ? handleOnAuthorizeClick : undefined,
180
195
  primaryButtonLabel: buttonLabel,
181
196
  testId: `${testId}-carousel`
@@ -9,7 +9,7 @@ import LinkWarningModal from './LinkWarningModal';
9
9
  import { useLinkWarningModal } from './LinkWarningModal/hooks/use-link-warning-modal';
10
10
  const PACKAGE_DATA = {
11
11
  packageName: "@atlaskit/smart-card",
12
- packageVersion: "45.13.2",
12
+ packageVersion: "45.13.3",
13
13
  componentName: 'linkUrl'
14
14
  };
15
15
  const LinkUrl = ({
@@ -4,7 +4,7 @@ export var ANALYTICS_CHANNEL = 'media';
4
4
  export var context = {
5
5
  componentName: 'smart-cards',
6
6
  packageName: "@atlaskit/smart-card" || '',
7
- packageVersion: "45.13.2" || ''
7
+ packageVersion: "45.13.3" || ''
8
8
  };
9
9
  export var TrackQuickActionType = /*#__PURE__*/function (TrackQuickActionType) {
10
10
  TrackQuickActionType["StatusUpdate"] = "StatusUpdate";
@@ -33,6 +33,7 @@ var Carousel = function Carousel(_ref) {
33
33
  _ref$initialSlideInde = _ref.initialSlideIndex,
34
34
  initialSlideIndex = _ref$initialSlideInde === void 0 ? 0 : _ref$initialSlideInde,
35
35
  items = _ref.items,
36
+ onNextClick = _ref.onNextClick,
36
37
  onPrimaryButtonClick = _ref.onPrimaryButtonClick,
37
38
  primaryButtonLabel = _ref.primaryButtonLabel,
38
39
  _ref$testId = _ref.testId,
@@ -73,10 +74,11 @@ var Carousel = function Carousel(_ref) {
73
74
  }, []);
74
75
  var goNext = useCallback(function () {
75
76
  hasNavigated.current = true;
77
+ onNextClick === null || onNextClick === void 0 || onNextClick(items[activeIndex].id);
76
78
  setActiveIndex(function (current) {
77
79
  return (current + 1) % items.length;
78
80
  });
79
- }, [items.length]);
81
+ }, [items, activeIndex, onNextClick]);
80
82
  var goPrev = useCallback(function () {
81
83
  hasNavigated.current = true;
82
84
  setActiveIndex(function (current) {
@@ -90,6 +92,9 @@ var Carousel = function Carousel(_ref) {
90
92
  hasNavigated.current = true;
91
93
  setActiveIndex(index);
92
94
  }, [activeIndex]);
95
+ var handlePrimaryButtonClick = useCallback(function () {
96
+ onPrimaryButtonClick === null || onPrimaryButtonClick === void 0 || onPrimaryButtonClick(items[activeIndex].id);
97
+ }, [onPrimaryButtonClick, items, activeIndex]);
93
98
  var currentSlide = items[activeIndex];
94
99
  var isFirstSlide = activeIndex === 0;
95
100
  var isLastSlide = activeIndex === items.length - 1;
@@ -108,7 +113,7 @@ var Carousel = function Carousel(_ref) {
108
113
  iconLabel: iconLabel,
109
114
  image: currentSlide.image,
110
115
  title: currentSlide.title,
111
- onPrimaryButtonClick: onPrimaryButtonClick,
116
+ onPrimaryButtonClick: onPrimaryButtonClick ? handlePrimaryButtonClick : undefined,
112
117
  onBackClick: !isFirstSlide ? goPrev : undefined,
113
118
  onDotClick: goTo,
114
119
  onNextClick: !isLastSlide ? goNext : undefined,
@@ -75,6 +75,7 @@ var UnauthorizedCarouselView = function UnauthorizedCarouselView(_ref) {
75
75
  var items = useMemo(function () {
76
76
  if (!canAuthorize) {
77
77
  return [{
78
+ id: 'no-auth-available',
78
79
  title: intl.formatMessage(messages.unauthorised_account_name_no_provider),
79
80
  description: intl.formatMessage(messages.unauthorised_account_description_no_provider),
80
81
  image: /*#__PURE__*/React.createElement(NoAuthAvailableImage, null)
@@ -92,6 +93,7 @@ var UnauthorizedCarouselView = function UnauthorizedCarouselView(_ref) {
92
93
  // We only have special text for Google Drive and i18n select takes only one word (no space).
93
94
  var i18nSelectContext = (context === null || context === void 0 ? void 0 : context.text) === 'Google Drive' ? 'Google' : context === null || context === void 0 ? void 0 : context.text;
94
95
  var slides = [{
96
+ id: 'smart-link-benefit',
95
97
  title: intl.formatMessage(messages.connect_link_account_embed_carousel_sl_title),
96
98
  description: intl.formatMessage(messages.connect_link_account_embed_carousel_sl_description, {
97
99
  context: i18nSelectContext,
@@ -107,6 +109,7 @@ var UnauthorizedCarouselView = function UnauthorizedCarouselView(_ref) {
107
109
  // we show additional Rovo-specific teaser slides to encourage the user to connect their account.
108
110
  if (rovoOptions !== null && rovoOptions !== void 0 && rovoOptions.isRovoEnabled) {
109
111
  slides.push({
112
+ id: 'rovo-search-benefit',
110
113
  title: intl.formatMessage(messages.connect_link_account_embed_carousel_rovo_title),
111
114
  description: intl.formatMessage(messages.connect_link_account_embed_carousel_rovo_description, {
112
115
  context: providerName,
@@ -123,6 +126,7 @@ var UnauthorizedCarouselView = function UnauthorizedCarouselView(_ref) {
123
126
  }
124
127
  if (rovoOptions !== null && rovoOptions !== void 0 && rovoOptions.isRovoEnabled && rovoOptions !== null && rovoOptions !== void 0 && rovoOptions.isRovoLLMEnabled) {
125
128
  slides.push({
129
+ id: 'rovo-chat-benefit',
126
130
  title: intl.formatMessage(messages.connect_link_account_embed_carousel_rovochat_title),
127
131
  description: intl.formatMessage(messages.connect_link_account_embed_carousel_rovochat_description, {
128
132
  context: providerName
@@ -138,12 +142,22 @@ var UnauthorizedCarouselView = function UnauthorizedCarouselView(_ref) {
138
142
  }
139
143
  return slides;
140
144
  }, [canAuthorize, context, intl, product, providerName, providerIcon, rovoOptions]);
141
- var handleOnAuthorizeClick = useCallback(function () {
145
+ var handleOnAuthorizeClick = useCallback(function (slideId) {
142
146
  if (onAuthorize) {
143
147
  fireEvent('track.applicationAccount.authStarted', {});
148
+ fireEvent('ui.button.clicked.carouselConnect', {
149
+ display: 'embed',
150
+ slideId: slideId
151
+ });
144
152
  onAuthorize();
145
153
  }
146
154
  }, [onAuthorize, fireEvent]);
155
+ var handleOnNextClick = useCallback(function (slideId) {
156
+ fireEvent('ui.button.clicked.carouselNext', {
157
+ display: 'embed',
158
+ slideId: slideId
159
+ });
160
+ }, [fireEvent]);
147
161
  var buttonLabel = context !== null && context !== void 0 && context.text ? intl.formatMessage(messages.connect_3p_account, {
148
162
  context: context.text
149
163
  }) : intl.formatMessage(messages.connect_link_account_card);
@@ -174,6 +188,7 @@ var UnauthorizedCarouselView = function UnauthorizedCarouselView(_ref) {
174
188
  icon: context === null || context === void 0 ? void 0 : context.icon,
175
189
  iconLabel: context === null || context === void 0 ? void 0 : context.text,
176
190
  items: items,
191
+ onNextClick: handleOnNextClick,
177
192
  onPrimaryButtonClick: canAuthorize ? handleOnAuthorizeClick : undefined,
178
193
  primaryButtonLabel: buttonLabel,
179
194
  testId: "".concat(testId, "-carousel")
@@ -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.13.2",
15
+ packageVersion: "45.13.3",
16
16
  componentName: 'linkUrl'
17
17
  };
18
18
  var LinkUrl = function LinkUrl(_ref) {
@@ -3,7 +3,7 @@
3
3
  *
4
4
  * Generates Typescript types for analytics events from analytics.spec.yaml
5
5
  *
6
- * @codegen <<SignedSource::4e18b8952a94e4fc3afd62ef6213f7b1>>
6
+ * @codegen <<SignedSource::326efd393bebe329396aa4b676d0ff6d>>
7
7
  * @codegenCommand yarn workspace @atlassian/analytics-tooling run analytics:codegen smart-card
8
8
  */
9
9
  export type PackageMetaDataContextType = {
@@ -232,6 +232,14 @@ export type ButtonClickedConnectAccountAttributesType = {
232
232
  display: 'inline' | 'block' | 'embed' | 'embedPreview' | 'flexible' | 'hoverCardPreview' | 'url';
233
233
  definitionId?: string | null;
234
234
  };
235
+ export type ButtonClickedCarouselNextAttributesType = {
236
+ display: 'inline' | 'block' | 'embed' | 'embedPreview' | 'flexible' | 'hoverCardPreview' | 'url';
237
+ slideId: string;
238
+ };
239
+ export type ButtonClickedCarouselConnectAttributesType = {
240
+ display: 'inline' | 'block' | 'embed' | 'embedPreview' | 'flexible' | 'hoverCardPreview' | 'url';
241
+ slideId: string;
242
+ };
235
243
  export type SmartLinkClickedTryAnotherAccountAttributesType = {
236
244
  display: 'inline' | 'block' | 'embed' | 'embedPreview' | 'flexible' | 'hoverCardPreview' | 'url';
237
245
  definitionId?: string | null;
@@ -277,8 +285,8 @@ export type SmartLinkClickedSmartlinkClickAnalyticsWorkflowsAttributesType = {
277
285
  eventName: string;
278
286
  firstPartyIdentifier?: string | null;
279
287
  clickedAt: string;
280
- isAuxClick?: boolean;
281
- isContextMenu?: boolean;
288
+ isAuxClick?: boolean | null;
289
+ isContextMenu?: boolean | null;
282
290
  };
283
291
  export type AnalyticsEventAttributes = {
284
292
  /**
@@ -413,6 +421,14 @@ export type AnalyticsEventAttributes = {
413
421
  /**
414
422
  * 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). */
415
423
  'ui.button.clicked.connectAccount': ButtonClickedConnectAccountAttributesType;
424
+ /**
425
+ * 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.
426
+ * */
427
+ 'ui.button.clicked.carouselNext': ButtonClickedCarouselNextAttributesType;
428
+ /**
429
+ * 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.
430
+ * */
431
+ 'ui.button.clicked.carouselConnect': ButtonClickedCarouselConnectAttributesType;
416
432
  /**
417
433
  * 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). */
418
434
  'ui.smartLink.clicked.tryAnotherAccount': SmartLinkClickedTryAnotherAccountAttributesType;
@@ -13,12 +13,14 @@ type CarouselProps = {
13
13
  initialSlideIndex?: number;
14
14
  /** Ordered list of teaser slides */
15
15
  items: CarouselItem[];
16
+ /** Called when the user clicks the "See next" navigation button */
17
+ onNextClick?: (slideId: string) => void;
16
18
  /** Called when the user clicks the primary button */
17
- onPrimaryButtonClick?: () => void;
19
+ onPrimaryButtonClick?: (slideId: string) => void;
18
20
  /** Text for the auth button, e.g. "Connect to Figma" */
19
21
  primaryButtonLabel: string;
20
22
  /** testId prefix */
21
23
  testId?: string;
22
24
  };
23
- declare const Carousel: ({ icon, iconLabel, initialSlideIndex, items, onPrimaryButtonClick, primaryButtonLabel, testId, }: CarouselProps) => React.JSX.Element;
25
+ declare const Carousel: ({ icon, iconLabel, initialSlideIndex, items, onNextClick, onPrimaryButtonClick, primaryButtonLabel, testId, }: CarouselProps) => React.JSX.Element;
24
26
  export default Carousel;
@@ -15,6 +15,12 @@ export type CarouselItem = {
15
15
  * provider name (e.g. "Google Drive") and returns the final string.
16
16
  */
17
17
  description: string;
18
+ /**
19
+ * Stable semantic identifier for this slide — used in analytics to track
20
+ * which slide drove connect/navigation events, independent of slide order.
21
+ * e.g. 'smart-link-benefit', 'rovo-search-benefit', 'rovo-chat-benefit'
22
+ */
23
+ id: string;
18
24
  /** Large hero image — either a React element (e.g. SVG) or an image URL */
19
25
  image: ReactNode | string;
20
26
  /**
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/smart-card",
3
- "version": "45.13.3",
3
+ "version": "45.13.4",
4
4
  "description": "Smart card component",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
@@ -40,7 +40,7 @@
40
40
  "@atlaskit/analytics-cross-product": "^2.1.0",
41
41
  "@atlaskit/analytics-gas-types": "^6.0.0",
42
42
  "@atlaskit/analytics-next": "^12.3.0",
43
- "@atlaskit/avatar": "^26.3.0",
43
+ "@atlaskit/avatar": "^26.4.0",
44
44
  "@atlaskit/avatar-group": "^13.2.0",
45
45
  "@atlaskit/badge": "^19.1.0",
46
46
  "@atlaskit/browser-apis": "^1.2.0",
@@ -88,7 +88,7 @@
88
88
  "@atlaskit/textfield": "^9.1.0",
89
89
  "@atlaskit/theme": "^26.1.0",
90
90
  "@atlaskit/tile": "^2.3.0",
91
- "@atlaskit/tmp-editor-statsig": "^135.0.0",
91
+ "@atlaskit/tmp-editor-statsig": "^135.2.0",
92
92
  "@atlaskit/tokens": "^16.3.0",
93
93
  "@atlaskit/tooltip": "^23.2.0",
94
94
  "@atlaskit/ufo": "^1.0.0",