@atlaskit/smart-card 45.6.7 → 45.6.9

package/dist/es2019/view/EmbedCard/components/carousel/index.js

@@ -0,0 +1,101 @@
+/* index.tsx generated by @compiled/babel-plugin v0.39.1 */
+import "./index.compiled.css";
+import { ax, ix } from "@compiled/react/runtime";
+import React, { useCallback, useEffect, useRef, useState } from 'react';
+import { Box } from '@atlaskit/primitives/compiled';
+import CarouselSlide from './CarouselSlide';
+const styles = {
+  carousel: "_1reo15vq _18m915vq _1e0c1txw _1bsb1osq _4t3i1osq _kqswh2mm"
+};
+
+// Slide enters from the right: translates from 40px right + fades in
+const slideInFromRight = null;
+const slideWrapperMap = {
+  static: "_1bsb1osq _4t3i1osq",
+  animated: "_1bsb1osq _4t3i1osq _j7hql61g _5sagjx92 _1pglafbj _1o511hrf _bl8aglyw _2hwzhgkh"
+};
+/**
+ * Derives layout size bucket from pixel dimensions.
+ * Used instead of CSS @container queries (which are blocked by the linter)
+ * to control which elements are shown at different card sizes.
+ */
+const getSize = (width, height) => {
+  if (width < 200 || height < 100) {
+    return 'minimal';
+  }
+  if (width < 400 || height < 140) {
+    return 'compact';
+  }
+  return 'full';
+};
+const Carousel = ({
+  icon,
+  iconLabel,
+  items,
+  onPrimaryButtonClick,
+  primaryButtonLabel,
+  testId = 'embed-card-teaser-carousel'
+}) => {
+  const [activeIndex, setActiveIndex] = useState(0);
+  const [size, setSize] = useState('full');
+
+  // Tracks whether the user has navigated at least once.
+  // The first slide is rendered statically (no animation) to avoid any
+  // CSS animation running during SSR or on the initial paint.
+  const hasNavigated = useRef(false);
+  const containerRef = useRef(null);
+
+  // Observe the carousel container's size and update the layout bucket.
+  useEffect(() => {
+    const el = containerRef.current;
+    if (!el) {
+      return;
+    }
+    const observer = new ResizeObserver(([entry]) => {
+      const {
+        width,
+        height
+      } = entry.contentRect;
+      setSize(getSize(width, height));
+    });
+    observer.observe(el);
+    return () => observer.disconnect();
+  }, []);
+  const goNext = useCallback(() => {
+    hasNavigated.current = true;
+    setActiveIndex(current => (current + 1) % items.length);
+  }, [items.length]);
+  const goTo = useCallback(index => {
+    if (index === activeIndex) {
+      return;
+    }
+    hasNavigated.current = true;
+    setActiveIndex(index);
+  }, [activeIndex]);
+  const currentSlide = items[activeIndex];
+  const isLastSlide = activeIndex === items.length - 1;
+  return /*#__PURE__*/React.createElement(Box, {
+    ref: containerRef,
+    xcss: styles.carousel,
+    testId: testId
+  }, /*#__PURE__*/React.createElement(Box, {
+    key: activeIndex,
+    xcss: slideWrapperMap[hasNavigated.current ? 'animated' : 'static'],
+    "aria-live": "polite"
+  }, /*#__PURE__*/React.createElement(CarouselSlide, {
+    primaryButtonLabel: primaryButtonLabel,
+    description: currentSlide.description,
+    icon: icon,
+    iconLabel: iconLabel,
+    image: currentSlide.image,
+    title: currentSlide.title,
+    onPrimaryButtonClick: onPrimaryButtonClick,
+    onDotClick: goTo,
+    onNextClick: !isLastSlide ? goNext : undefined,
+    size: size,
+    slideIndex: activeIndex,
+    testId: `${testId}-slide`,
+    totalSlides: items.length
+  })));
+};
+export default Carousel;

package/dist/es2019/view/EmbedCard/components/carousel/types.js

@@ -0,0 +1 @@
+export {};

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

@@ -9,7 +9,7 @@ import LinkWarningModal from './LinkWarningModal';
 import { useLinkWarningModal } from './LinkWarningModal/hooks/use-link-warning-modal';
 const PACKAGE_DATA = {
   packageName: "@atlaskit/smart-card",
-  packageVersion: "45.6.6",
+  packageVersion: "45.6.8",
   componentName: 'linkUrl'
 };
 const LinkUrl = ({

package/dist/esm/messages.js

@@ -160,6 +160,51 @@ export var messages = defineMessages({
     defaultMessage: 'To show a preview of this link, connect your {context} account.',
     description: 'Shown when a user does not have access to a link, but can connect their external account to view the link on card view. Displayed in byline.'
   },
+  connect_link_account_embed_teaser_dot_label: {
+    id: 'fabric.linking.connect_link_account_embed_teaser_dot_label.non-final',
+    defaultMessage: 'Go to slide {index} of {total}',
+    description: 'Accessible label for a dot indicator button in the teaser carousel, describing which slide it navigates to'
+  },
+  connect_link_account_embed_teaser_dot_row_label: {
+    id: 'fabric.linking.connect_link_account_embed_teaser_dot_row_label.non-final',
+    defaultMessage: 'Slides',
+    description: 'Accessible label for the group of dot indicator buttons in the teaser carousel'
+  },
+  connect_link_account_embed_teaser_button_next: {
+    id: 'fabric.linking.connect_link_account_embed_teaser_button_next.non-final',
+    defaultMessage: 'Next',
+    description: 'A button to view next teaser on benefit of connecting account on Smart Link embed'
+  },
+  connect_link_account_embed_teaser_slide_1_description: {
+    id: 'fabric.linking.connect_link_account_embed_teaser_slide_1_description.non-final',
+    defaultMessage: 'Connect your account to preview {context} files and documents directly inside Atlassian. No more context switching.',
+    description: 'A description on a teaser slide 1 on benefit of connecting account on Smart Link embed'
+  },
+  connect_link_account_embed_teaser_slide_1_title: {
+    id: 'fabric.linking.connect_link_account_embed_teaser_slide_1_title.non-final',
+    defaultMessage: 'See your {context} work without leaving Atlassian',
+    description: 'A title on a teaser slide 1 on benefit of connecting account on Smart Link embed'
+  },
+  connect_link_account_embed_teaser_slide_2_title: {
+    id: 'fabric.linking.connect_link_account_embed_teaser_slide_2_title.non-final',
+    defaultMessage: 'Search once, find it everywhere',
+    description: 'A title on a teaser slide 2 on benefit of connecting account on Smart Link embed'
+  },
+  connect_link_account_embed_teaser_slide_2_description: {
+    id: 'fabric.linking.connect_link_account_embed_teaser_slide_2_description.non-final',
+    defaultMessage: 'Search relevant {context} files alongside your Confluence pages and Jira issues, always respecting your {context} permissions.',
+    description: 'A description on a teaser slide 2 on benefit of connecting account on Smart Link embed'
+  },
+  connect_link_account_embed_teaser_slide_3_title: {
+    id: 'fabric.linking.connect_link_account_embed_teaser_slide_3_title.non-final',
+    defaultMessage: 'Get help from Rovo',
+    description: 'A title on a teaser slide 3 on benefit of connecting account on Smart Link embed'
+  },
+  connect_link_account_embed_teaser_slide_3_description: {
+    id: 'fabric.linking.connect_link_account_embed_teaser_slide_3_description.non-final',
+    defaultMessage: "Rovo uses your {context} content to answer questions, summarise docs, and draft updates using the work you've already done.",
+    description: 'A description on a teaser slide 3 on benefit of connecting account on Smart Link embed'
+  },
   connect_link_account_success_flag_description: {
     id: 'fabric.linking.connect_link_account_success_flag_description',
     defaultMessage: 'Shared links now display rich previews.',

package/dist/esm/utils/analytics/analytics.js

@@ -4,7 +4,7 @@ export var ANALYTICS_CHANNEL = 'media';
 export var context = {
   componentName: 'smart-cards',
   packageName: "@atlaskit/smart-card" || '',
-  packageVersion: "45.6.6" || ''
+  packageVersion: "45.6.8" || ''
 };
 export var TrackQuickActionType = /*#__PURE__*/function (TrackQuickActionType) {
   TrackQuickActionType["StatusUpdate"] = "StatusUpdate";

package/dist/esm/view/EmbedCard/components/carousel/CarouselSlide.compiled.css

@@ -0,0 +1,52 @@
+
+._2rko1rr0{border-radius:var(--ds-radius-full,9999px)}
+._zulp1ejb{gap:var(--ds-space-300,24px)}
+._zulpu2gc{gap:var(--ds-space-100,8px)}
+._zulpze3t{gap:var(--ds-space-0,0)}._16jlkb7n{flex-grow:1}
+._18m91wug{overflow-y:auto}
+._19bv1jfw{padding-left:var(--ds-space-500,40px)}
+._19bvpxbi{padding-left:var(--ds-space-200,1pc)}
+._19bvze3t{padding-left:var(--ds-space-0,0)}
+._1bah1h6o{justify-content:center}
+._1bsb1osq{width:100%}
+._1bsb1tcg{width:24px}
+._1bsb7vkz{width:1pc}
+._1bsbi2wt{width:6px}
+._1e0c1txw{display:flex}
+._1e0c1ule{display:block}
+._1n261g80{flex-wrap:wrap}
+._1o9zidpf{flex-shrink:0}
+._1o9zkb7n{flex-shrink:1}
+._1oecfnf5{transition-duration:.2s}
+._1reo1wug{overflow-x:auto}
+._2lx21bp4{flex-direction:column}
+._2lx2vrvc{flex-direction:row}
+._4cvr1fhb{align-items:stretch}
+._4cvr1h6o{align-items:center}
+._4cvr1y6m{align-items:flex-start}
+._4t3i1osq{height:100%}
+._4t3i1tcg{height:24px}
+._4t3i7vkz{height:1pc}
+._4t3ii2wt{height:6px}
+._5ral1f51{object-fit:contain}
+._6fl45ucs{transition-timing-function:ease}
+._bfhk1dy8{background-color:var(--ds-background-accent-blue-subtler,#cfe1fd)}
+._bfhki8nm{background-color:var(--ds-background-neutral,#0515240f)}
+._bfhkjmqp{background-color:var(--ds-background-selected-bold,#1868db)}
+._bfhksm61{background-color:var(--ds-background-neutral-subtle,#00000000)}
+._c71l1wdt{max-height:220px}
+._ca0q1jfw{padding-top:var(--ds-space-500,40px)}
+._ca0qpxbi{padding-top:var(--ds-space-200,1pc)}
+._ca0qze3t{padding-top:var(--ds-space-0,0)}
+._i0dlghg7{flex-basis:240px}
+._i0dluuw1{flex-basis:200px}
+._k8m01k61{transition-property:background-color}
+._lcxvglyw{pointer-events:none}
+._n3td1jfw{padding-bottom:var(--ds-space-500,40px)}
+._n3tdpxbi{padding-bottom:var(--ds-space-200,1pc)}
+._n3tdze3t{padding-bottom:var(--ds-space-0,0)}
+._rsufaqso{object-position:center center}
+._u5f31jfw{padding-right:var(--ds-space-500,40px)}
+._u5f3pxbi{padding-right:var(--ds-space-200,1pc)}
+._u5f3ze3t{padding-right:var(--ds-space-0,0)}
+._vchhusvi{box-sizing:border-box}

package/dist/esm/view/EmbedCard/components/carousel/CarouselSlide.js

@@ -0,0 +1,117 @@
+/* CarouselSlide.tsx generated by @compiled/babel-plugin v0.39.1 */
+import "./CarouselSlide.compiled.css";
+import { ax, ix } from "@compiled/react/runtime";
+import React from 'react';
+import { useIntl } from 'react-intl';
+import Button from '@atlaskit/button/new';
+import { cx } from '@atlaskit/css';
+import Heading from '@atlaskit/heading';
+import Image from '@atlaskit/image';
+import { Box, Pressable, Text } from '@atlaskit/primitives/compiled';
+import { messages } from '../../../../messages';
+var styles = {
+  columnImage: "_16jlkb7n _1o9zkb7n _i0dlghg7 _1e0c1txw _4cvr1h6o _1bah1h6o _ca0qpxbi _u5f3pxbi _n3tdpxbi _19bvpxbi _bfhk1dy8",
+  columnContent: "_zulp1ejb _16jlkb7n _1o9zkb7n _i0dluuw1 _1e0c1txw _2lx21bp4 _ca0q1jfw _u5f31jfw _n3td1jfw _19bv1jfw _4cvr1y6m _1bah1h6o",
+  columnContentCompact: "_ca0qpxbi _u5f3pxbi _n3tdpxbi _19bvpxbi",
+  dot: "_2rko1rr0 _1bsbi2wt _4t3ii2wt _bfhki8nm _1oecfnf5 _k8m01k61 _6fl45ucs _lcxvglyw",
+  dotActive: "_bfhkjmqp",
+  dotPassable: "_2rko1rr0 _1e0c1txw _4cvr1h6o _1bah1h6o _1bsb7vkz _4t3i7vkz _bfhksm61 _ca0qze3t _u5f3ze3t _n3tdze3t _19bvze3t",
+  icon: "_1o9zidpf _1bsb1tcg _4t3i1tcg _1e0c1txw _4cvr1h6o _1bah1h6o",
+  iconImage: "_1bsb1osq _4t3i1osq _5ral1f51",
+  image: "_1bsb1osq _c71l1wdt _5ral1f51 _rsufaqso _1e0c1ule",
+  rowButton: "_zulpu2gc _1e0c1txw _2lx2vrvc _1n261g80 _4cvr1h6o",
+  rowButtonCompact: "_1bsb1osq",
+  rowDot: "_zulpze3t _1e0c1txw _2lx2vrvc _4cvr1h6o",
+  rowIcon: "_zulpu2gc _1e0c1txw _4cvr1h6o",
+  slide: "_1reo1wug _18m91wug _1e0c1txw _1n261g80 _1bsb1osq _4t3i1osq _4cvr1fhb _vchhusvi"
+};
+var CarouselSlide = function CarouselSlide(_ref) {
+  var icon = _ref.icon,
+    iconLabel = _ref.iconLabel,
+    title = _ref.title,
+    description = _ref.description,
+    image = _ref.image,
+    primaryButtonLabel = _ref.primaryButtonLabel,
+    onPrimaryButtonClick = _ref.onPrimaryButtonClick,
+    onDotClick = _ref.onDotClick,
+    onNextClick = _ref.onNextClick,
+    slideIndex = _ref.slideIndex,
+    totalSlides = _ref.totalSlides,
+    size = _ref.size,
+    _ref$testId = _ref.testId,
+    testId = _ref$testId === void 0 ? 'embed-card-teaser-slide' : _ref$testId;
+  var _useIntl = useIntl(),
+    formatMessage = _useIntl.formatMessage;
+  var isCompact = size !== 'full';
+  var showNavigation = totalSlides > 1;
+  var renderedIcon = icon == null ? null : typeof icon === 'string' ? /*#__PURE__*/React.createElement(Box, {
+    xcss: styles.icon
+  }, /*#__PURE__*/React.createElement(Image, {
+    src: icon,
+    alt: iconLabel,
+    className: ax([styles.iconImage])
+  })) : /*#__PURE__*/React.createElement(Box, {
+    xcss: styles.icon
+  }, icon);
+  var renderedImage = image == null ? null : typeof image === 'string' ? /*#__PURE__*/React.createElement(Image, {
+    src: image,
+    alt: title,
+    className: ax([styles.image])
+  }) : image;
+  return /*#__PURE__*/React.createElement(Box, {
+    xcss: styles.slide,
+    testId: testId
+  }, /*#__PURE__*/React.createElement(Box, {
+    xcss: cx(styles.columnContent, isCompact && styles.columnContentCompact)
+  }, isCompact && /*#__PURE__*/React.createElement(Box, {
+    xcss: cx(styles.rowButton, styles.rowButtonCompact)
+  }, /*#__PURE__*/React.createElement(Button, {
+    appearance: "primary",
+    onClick: onPrimaryButtonClick,
+    shouldFitContainer: true,
+    testId: "".concat(testId, "-connect-compact")
+  }, primaryButtonLabel)), renderedIcon && /*#__PURE__*/React.createElement(Box, {
+    xcss: styles.rowIcon
+  }, renderedIcon), /*#__PURE__*/React.createElement(Box, null, /*#__PURE__*/React.createElement(Heading, {
+    size: "medium",
+    testId: "".concat(testId, "-title")
+  }, title)), /*#__PURE__*/React.createElement(Box, null, /*#__PURE__*/React.createElement(Text, {
+    testId: "".concat(testId, "-description")
+  }, description)), /*#__PURE__*/React.createElement(Box, {
+    xcss: styles.rowButton
+  }, !isCompact && /*#__PURE__*/React.createElement(Button, {
+    appearance: "primary",
+    onClick: onPrimaryButtonClick,
+    testId: "".concat(testId, "-connect")
+  }, primaryButtonLabel), showNavigation && onNextClick && /*#__PURE__*/React.createElement(Button, {
+    appearance: "subtle",
+    onClick: onNextClick,
+    testId: "".concat(testId, "-next")
+  }, formatMessage(messages.connect_link_account_embed_teaser_button_next)), showNavigation && /*#__PURE__*/React.createElement(Box, {
+    xcss: styles.rowDot,
+    role: "group",
+    "aria-label": formatMessage(messages.connect_link_account_embed_teaser_dot_row_label)
+  }, Array.from({
+    length: totalSlides
+  }, function (_, i) {
+    return /*#__PURE__*/React.createElement(Pressable, {
+      key: i,
+      xcss: styles.dotPassable,
+      onClick: function onClick() {
+        return onDotClick === null || onDotClick === void 0 ? void 0 : onDotClick(i);
+      },
+      "aria-label": formatMessage(messages.connect_link_account_embed_teaser_dot_label, {
+        index: i + 1,
+        total: totalSlides
+      }),
+      "aria-current": i === slideIndex ? 'true' : undefined,
+      testId: "".concat(testId, "-dot-").concat(i)
+    }, /*#__PURE__*/React.createElement(Box, {
+      xcss: cx(styles.dot, i === slideIndex && styles.dotActive)
+    }));
+  })))), !isCompact && /*#__PURE__*/React.createElement(Box, {
+    xcss: styles.columnImage,
+    testId: "".concat(testId, "-image-panel")
+  }, renderedImage));
+};
+export default CarouselSlide;

package/dist/esm/view/EmbedCard/components/carousel/index.compiled.css

@@ -0,0 +1,12 @@
+._18m915vq{overflow-y:hidden}
+._1bsb1osq{width:100%}
+._1e0c1txw{display:flex}
+._1o511hrf{animation-fill-mode:both}
+._1pglafbj{animation-timing-function:cubic-bezier(.25,.46,.45,.94)}
+._1reo15vq{overflow-x:hidden}
+._4t3i1osq{height:100%}
+._5sagjx92{animation-duration:.28s}
+._j7hql61g{animation-name:kjqoltm}
+._kqswh2mm{position:relative}
+@keyframes kjqoltm{0%{opacity:0;transform:translateX(40px)}to{opacity:1;transform:translateX(0)}}
+@media (prefers-reduced-motion:reduce){._bl8aglyw{animation-name:none}._2hwzhgkh{animation-duration:.01ms}}

package/dist/esm/view/EmbedCard/components/carousel/index.js

@@ -0,0 +1,113 @@
+/* index.tsx generated by @compiled/babel-plugin v0.39.1 */
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import "./index.compiled.css";
+import { ax, ix } from "@compiled/react/runtime";
+import React, { useCallback, useEffect, useRef, useState } from 'react';
+import { Box } from '@atlaskit/primitives/compiled';
+import CarouselSlide from './CarouselSlide';
+var styles = {
+  carousel: "_1reo15vq _18m915vq _1e0c1txw _1bsb1osq _4t3i1osq _kqswh2mm"
+};
+
+// Slide enters from the right: translates from 40px right + fades in
+var slideInFromRight = null;
+var slideWrapperMap = {
+  static: "_1bsb1osq _4t3i1osq",
+  animated: "_1bsb1osq _4t3i1osq _j7hql61g _5sagjx92 _1pglafbj _1o511hrf _bl8aglyw _2hwzhgkh"
+};
+/**
+ * Derives layout size bucket from pixel dimensions.
+ * Used instead of CSS @container queries (which are blocked by the linter)
+ * to control which elements are shown at different card sizes.
+ */
+var getSize = function getSize(width, height) {
+  if (width < 200 || height < 100) {
+    return 'minimal';
+  }
+  if (width < 400 || height < 140) {
+    return 'compact';
+  }
+  return 'full';
+};
+var Carousel = function Carousel(_ref) {
+  var icon = _ref.icon,
+    iconLabel = _ref.iconLabel,
+    items = _ref.items,
+    onPrimaryButtonClick = _ref.onPrimaryButtonClick,
+    primaryButtonLabel = _ref.primaryButtonLabel,
+    _ref$testId = _ref.testId,
+    testId = _ref$testId === void 0 ? 'embed-card-teaser-carousel' : _ref$testId;
+  var _useState = useState(0),
+    _useState2 = _slicedToArray(_useState, 2),
+    activeIndex = _useState2[0],
+    setActiveIndex = _useState2[1];
+  var _useState3 = useState('full'),
+    _useState4 = _slicedToArray(_useState3, 2),
+    size = _useState4[0],
+    setSize = _useState4[1];
+
+  // Tracks whether the user has navigated at least once.
+  // The first slide is rendered statically (no animation) to avoid any
+  // CSS animation running during SSR or on the initial paint.
+  var hasNavigated = useRef(false);
+  var containerRef = useRef(null);
+
+  // Observe the carousel container's size and update the layout bucket.
+  useEffect(function () {
+    var el = containerRef.current;
+    if (!el) {
+      return;
+    }
+    var observer = new ResizeObserver(function (_ref2) {
+      var _ref3 = _slicedToArray(_ref2, 1),
+        entry = _ref3[0];
+      var _entry$contentRect = entry.contentRect,
+        width = _entry$contentRect.width,
+        height = _entry$contentRect.height;
+      setSize(getSize(width, height));
+    });
+    observer.observe(el);
+    return function () {
+      return observer.disconnect();
+    };
+  }, []);
+  var goNext = useCallback(function () {
+    hasNavigated.current = true;
+    setActiveIndex(function (current) {
+      return (current + 1) % items.length;
+    });
+  }, [items.length]);
+  var goTo = useCallback(function (index) {
+    if (index === activeIndex) {
+      return;
+    }
+    hasNavigated.current = true;
+    setActiveIndex(index);
+  }, [activeIndex]);
+  var currentSlide = items[activeIndex];
+  var isLastSlide = activeIndex === items.length - 1;
+  return /*#__PURE__*/React.createElement(Box, {
+    ref: containerRef,
+    xcss: styles.carousel,
+    testId: testId
+  }, /*#__PURE__*/React.createElement(Box, {
+    key: activeIndex,
+    xcss: slideWrapperMap[hasNavigated.current ? 'animated' : 'static'],
+    "aria-live": "polite"
+  }, /*#__PURE__*/React.createElement(CarouselSlide, {
+    primaryButtonLabel: primaryButtonLabel,
+    description: currentSlide.description,
+    icon: icon,
+    iconLabel: iconLabel,
+    image: currentSlide.image,
+    title: currentSlide.title,
+    onPrimaryButtonClick: onPrimaryButtonClick,
+    onDotClick: goTo,
+    onNextClick: !isLastSlide ? goNext : undefined,
+    size: size,
+    slideIndex: activeIndex,
+    testId: "".concat(testId, "-slide"),
+    totalSlides: items.length
+  })));
+};
+export default Carousel;

package/dist/esm/view/EmbedCard/components/carousel/types.js

@@ -0,0 +1 @@
+export {};

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.6.6",
+  packageVersion: "45.6.8",
   componentName: 'linkUrl'
 };
 var LinkUrl = function LinkUrl(_ref) {

package/dist/types/messages.d.ts

@@ -1,7 +1,7 @@
 import { type MessageDescriptor } from 'react-intl';
 export type RequestAccessMessageKey = 'click_to_join' | 'click_to_join_description' | 'forbidden_description' | 'request_access' | 'request_access_description' | 'request_access_pending' | 'request_access_pending_title' | 'request_access_pending_description' | 'request_denied_description' | 'default_no_access_title' | 'direct_access_title' | 'direct_access_description' | 'direct_access' | 'access_exists_description' | 'not_found_description' | 'not_found_title';
 export type RovoChatActionMessageKey = 'rovo_prompt_context_generic' | 'rovo_prompt_context_generic_plural' | 'rovo_prompt_context_confluence_page' | 'rovo_prompt_context_confluence_page_short' | 'rovo_prompt_context_jira_work_item' | 'rovo_prompt_context_jira_work_item_short' | 'rovo_prompt_button_recommend_other_sources' | 'rovo_prompt_message_recommend_other_sources' | 'rovo_prompt_button_show_other_mentions' | 'rovo_prompt_message_show_other_mentions' | 'rovo_prompt_button_suggest_improvement' | 'rovo_prompt_message_suggest_improvement' | 'rovo_prompt_message_summarize' | 'rovo_prompt_button_ask_rovo_anything' | 'rovo_prompt_message_ask_rovo_anything' | 'rovo_prompt_button_highlight_relevant_content' | 'rovo_prompt_message_highlight_relevant_content' | 'rovo_prompt_button_identify_key_trends' | 'rovo_prompt_message_identify_key_trends' | 'rovo_prompt_button_identify_key_points' | 'rovo_prompt_message_identify_key_points' | 'rovo_prompt_button_find_open_questions' | 'rovo_prompt_message_find_open_questions' | 'rovo_prompt_button_key_highlights' | 'rovo_prompt_message_key_highlights' | 'rovo_prompt_message_summarize_document' | 'rovo_prompt_message_summarize_presentation' | 'rovo_prompt_button_explain_code' | 'rovo_prompt_message_explain_code' | 'rovo_prompt_button_catch_up' | 'rovo_prompt_message_catch_up' | 'rovo_prompt_button_salesforce_prep' | 'rovo_prompt_message_salesforce_prep';
-export type MessageKey = 'assigned_to' | 'ai_summarize' | 'change_status' | 'ai_summarized_abbreviation' | 'ai_summarized_info' | 'ai_summarized_info_short' | 'ai_summary_error_generic_rebrand' | 'ai_summary_error_acceptable_use_violation' | 'ai_summary_error_hipaa_content_detected' | 'ai_summary_error_exceeding_context_length_error' | 'ai_summary_action_rebrand' | 'ai_summary_action_description' | 'ai_summary_action_description_rebrand' | 'automation_action_title' | 'automation_action_tooltip' | 'automation_action_icon_label' | 'automation_action_confluence_page_modal_title' | 'automation_action_confluence_page_modal_description' | 'copy_summary_action' | 'copy_summary_action_description' | 'copied_summary_action_description' | 'beta' | 'cannot_find_link' | 'compass_applied_components_count' | 'connect_link_account_card' | 'connect_link_account_card_name' | 'connect_link_account_card_description' | 'connect_link_account_success_flag_description' | 'connect_link_account_success_flag_title' | 'connect_link_account_success_flag_title_default' | 'connect_unauthorised_account_action' | 'connect_inline_social_proof' | 'social_proof_inline_cta_tag_high_with_context' | 'social_proof_inline_cta_tag_high_no_context' | 'social_proof_inline_cta_tag_low_with_context' | 'social_proof_inline_cta_tag_low_no_context' | 'connect_unauthorised_account_description' | 'connect_unauthorised_account_description_no_provider' | 'continue' | 'copy_url_to_clipboard' | 'copied_url_to_clipboard' | 'could_not_load_link' | 'download' | 'download_description' | 'download_file' | 'follow' | 'follow_project_description' | 'follow_project_descriptionGalaxia' | 'follow_project' | 'follow_goal' | 'follow_goal_description' | 'follow_project_error' | 'follow_project_errorGalaxia' | 'follow_goal_error' | 'go_back' | 'invalid_permissions' | 'invalid_permissions_description' | 'join_to_view' | 'connect_link_account' | 'created_by' | 'created_on_relative' | 'created_on_absolute' | 'check_this_link' | 'delete' | 'edit' | 'learn_more_about_smart_links' | 'learn_more_about_connecting_account' | 'loading' | 'link_safety_warning_message' | 'modified_by' | 'modified_on_relative' | 'modified_on_absolute' | 'more_actions' | 'not_found_title' | 'not_found_description' | 'open_issue_in_jira' | 'open_link_in_a_new_tab' | 'owned_by' | 'owned_by_override' | 'preview_description' | 'preview_improved' | 'preview_modal' | 'preview_panel' | 'preview_close' | 'preview_max_size' | 'preview_min_size' | 'priority_blocker' | 'priority_critical' | 'priority_high' | 'priority_highest' | 'priority_low' | 'priority_lowest' | 'priority_major' | 'priority_medium' | 'priority_minor' | 'priority_trivial' | 'priority_undefined' | 'forbidden_access' | 'pending_request' | 'read_time' | 'restricted_link' | 'request_access_to_view' | 'request_denied' | 'sent_on_relative' | 'sent_on_absolute' | 'status_change_load_error' | 'status_change_permission_error' | 'status_change_update_error' | 'try_again' | 'try_another_account' | 'unauthorised_account_description' | 'unauthorised_account_description_no_provider' | 'unauthorised_account_name' | 'unauthorised_account_name_no_provider' | 'rovo_actions_explore' | 'unassigned' | 'unfollow' | 'unfollow_project_description' | 'unfollow_project_descriptionGalaxia' | 'unfollow_project' | 'unfollow_project_error' | 'unfollow_project_errorGalaxia' | 'unfollow_goal' | 'unfollow_goal_description' | 'unfollow_goal_error' | 'user_attributes' | 'view' | 'viewIn' | 'viewInProvider' | 'viewOriginal' | 'actions' | 'add_account' | 'cancel' | 'close' | 'connect_to' | 'connect_account_description' | 'retry' | 'save' | 'unlink_account' | RequestAccessMessageKey | 'related' | 'generic_error_message' | 'related_links_modal_error_title' | 'related_links_modal_error_description' | 'related_links_modal_unavailable_title' | 'related_links_modal_unavailable_description' | 'related_links_modal_title' | 'related_links_view_related_urls' | 'related_links_view_related_links' | 'related_links_found_in' | 'related_links_includes_links_to' | 'related_links_not_found' | 'join_to_viewIssueTermRefresh' | 'open_issue_in_jiraIssueTermRefresh' | 'request_access_to_viewIssueTermRefresh' | 'team_members_count' | 'status_change_permission_errorIssueTermRefresh' | 'connect_unauthorised_account_description_appify' | 'connect_unauthorised_account_description_no_provider_appify' | 'learn_more_about_connecting_account_experiment_shorter' | 'learn_more_about_connecting_account_appify' | 'rovo_summary_loading' | 'ai_disclaimer' | 'rovo_unauthorised_title' | 'rovo_unauthorised_title_no_provider' | 'rovo_unauthorised_feature_clear_link_names' | 'rovo_unauthorised_feature_understand_linked_docs' | 'rovo_unauthorised_feature_go_deeper_smart_suggestions' | 'rovo_unauthorised_connect_account' | 'rovo_unauthorised_not_now' | 'rovo_chat_action_section_header' | 'rovo_prompt_button_summarize_this' | 'rovo_prompt_button_ask_a_specific_question' | 'rovo_prompt_button_show_me_whats_relevant' | RovoChatActionMessageKey | 'pre_auth_block_social_proof_not_low' | 'pre_auth_block_social_proof_low';
+export type MessageKey = 'assigned_to' | 'ai_summarize' | 'change_status' | 'ai_summarized_abbreviation' | 'ai_summarized_info' | 'ai_summarized_info_short' | 'ai_summary_error_generic_rebrand' | 'ai_summary_error_acceptable_use_violation' | 'ai_summary_error_hipaa_content_detected' | 'ai_summary_error_exceeding_context_length_error' | 'ai_summary_action_rebrand' | 'ai_summary_action_description' | 'ai_summary_action_description_rebrand' | 'automation_action_title' | 'automation_action_tooltip' | 'automation_action_icon_label' | 'automation_action_confluence_page_modal_title' | 'automation_action_confluence_page_modal_description' | 'copy_summary_action' | 'copy_summary_action_description' | 'copied_summary_action_description' | 'beta' | 'cannot_find_link' | 'compass_applied_components_count' | 'connect_link_account_card' | 'connect_link_account_card_name' | 'connect_link_account_card_description' | 'connect_link_account_embed_teaser_button_next' | 'connect_link_account_embed_teaser_dot_label' | 'connect_link_account_embed_teaser_dot_row_label' | 'connect_link_account_embed_teaser_slide_1_description' | 'connect_link_account_embed_teaser_slide_1_title' | 'connect_link_account_embed_teaser_slide_2_description' | 'connect_link_account_embed_teaser_slide_2_title' | 'connect_link_account_embed_teaser_slide_3_description' | 'connect_link_account_embed_teaser_slide_3_title' | 'connect_link_account_success_flag_description' | 'connect_link_account_success_flag_title' | 'connect_link_account_success_flag_title_default' | 'connect_unauthorised_account_action' | 'connect_inline_social_proof' | 'social_proof_inline_cta_tag_high_with_context' | 'social_proof_inline_cta_tag_high_no_context' | 'social_proof_inline_cta_tag_low_with_context' | 'social_proof_inline_cta_tag_low_no_context' | 'connect_unauthorised_account_description' | 'connect_unauthorised_account_description_no_provider' | 'continue' | 'copy_url_to_clipboard' | 'copied_url_to_clipboard' | 'could_not_load_link' | 'download' | 'download_description' | 'download_file' | 'follow' | 'follow_project_description' | 'follow_project_descriptionGalaxia' | 'follow_project' | 'follow_goal' | 'follow_goal_description' | 'follow_project_error' | 'follow_project_errorGalaxia' | 'follow_goal_error' | 'go_back' | 'invalid_permissions' | 'invalid_permissions_description' | 'join_to_view' | 'connect_link_account' | 'created_by' | 'created_on_relative' | 'created_on_absolute' | 'check_this_link' | 'delete' | 'edit' | 'learn_more_about_smart_links' | 'learn_more_about_connecting_account' | 'loading' | 'link_safety_warning_message' | 'modified_by' | 'modified_on_relative' | 'modified_on_absolute' | 'more_actions' | 'not_found_title' | 'not_found_description' | 'open_issue_in_jira' | 'open_link_in_a_new_tab' | 'owned_by' | 'owned_by_override' | 'preview_description' | 'preview_improved' | 'preview_modal' | 'preview_panel' | 'preview_close' | 'preview_max_size' | 'preview_min_size' | 'priority_blocker' | 'priority_critical' | 'priority_high' | 'priority_highest' | 'priority_low' | 'priority_lowest' | 'priority_major' | 'priority_medium' | 'priority_minor' | 'priority_trivial' | 'priority_undefined' | 'forbidden_access' | 'pending_request' | 'read_time' | 'restricted_link' | 'request_access_to_view' | 'request_denied' | 'sent_on_relative' | 'sent_on_absolute' | 'status_change_load_error' | 'status_change_permission_error' | 'status_change_update_error' | 'try_again' | 'try_another_account' | 'unauthorised_account_description' | 'unauthorised_account_description_no_provider' | 'unauthorised_account_name' | 'unauthorised_account_name_no_provider' | 'rovo_actions_explore' | 'unassigned' | 'unfollow' | 'unfollow_project_description' | 'unfollow_project_descriptionGalaxia' | 'unfollow_project' | 'unfollow_project_error' | 'unfollow_project_errorGalaxia' | 'unfollow_goal' | 'unfollow_goal_description' | 'unfollow_goal_error' | 'user_attributes' | 'view' | 'viewIn' | 'viewInProvider' | 'viewOriginal' | 'actions' | 'add_account' | 'cancel' | 'close' | 'connect_to' | 'connect_account_description' | 'retry' | 'save' | 'unlink_account' | RequestAccessMessageKey | 'related' | 'generic_error_message' | 'related_links_modal_error_title' | 'related_links_modal_error_description' | 'related_links_modal_unavailable_title' | 'related_links_modal_unavailable_description' | 'related_links_modal_title' | 'related_links_view_related_urls' | 'related_links_view_related_links' | 'related_links_found_in' | 'related_links_includes_links_to' | 'related_links_not_found' | 'join_to_viewIssueTermRefresh' | 'open_issue_in_jiraIssueTermRefresh' | 'request_access_to_viewIssueTermRefresh' | 'team_members_count' | 'status_change_permission_errorIssueTermRefresh' | 'connect_unauthorised_account_description_appify' | 'connect_unauthorised_account_description_no_provider_appify' | 'learn_more_about_connecting_account_experiment_shorter' | 'learn_more_about_connecting_account_appify' | 'rovo_summary_loading' | 'ai_disclaimer' | 'rovo_unauthorised_title' | 'rovo_unauthorised_title_no_provider' | 'rovo_unauthorised_feature_clear_link_names' | 'rovo_unauthorised_feature_understand_linked_docs' | 'rovo_unauthorised_feature_go_deeper_smart_suggestions' | 'rovo_unauthorised_connect_account' | 'rovo_unauthorised_not_now' | 'rovo_chat_action_section_header' | 'rovo_prompt_button_summarize_this' | 'rovo_prompt_button_ask_a_specific_question' | 'rovo_prompt_button_show_me_whats_relevant' | RovoChatActionMessageKey | 'pre_auth_block_social_proof_not_low' | 'pre_auth_block_social_proof_low';
 type Messages = {
     [K in MessageKey]: MessageDescriptor;
 };

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

@@ -0,0 +1,39 @@
+/**
+ * @jsxRuntime classic
+ * @jsx jsx
+ */
+import React from 'react';
+import type { CarouselSize } from './types';
+type CarouselSlideProps = {
+    /** Resolved description string (already injected with provider name) */
+    description: string;
+    /** Provider icon — a React element or an image URL */
+    icon?: React.ReactNode | string;
+    /** Alt for the icon, e.g. "Figma" */
+    iconLabel?: string;
+    /** Large hero image — a React element (e.g. SVG/img) or a URL string */
+    image: React.ReactNode | string;
+    /** Called when the user clicks a dot indicator to jump to that slide index */
+    onDotClick?: (index: number) => void;
+    /** Called when the user clicks the secondary "See next" button; omit on last slide */
+    onNextClick?: () => void;
+    /** Called when the user clicks the primary connect button */
+    onPrimaryButtonClick?: () => void;
+    /** Text label for the connect button (e.g. "Connect to Figma") */
+    primaryButtonLabel: string;
+    /**
+     * Layout size bucket derived from the carousel container's measured dimensions.
+     * Controls which elements are shown at different card sizes.
+     */
+    size: CarouselSize;
+    /** 0-based index of this slide */
+    slideIndex: number;
+    /** testId prefix */
+    testId?: string;
+    /** Resolved title string (already injected with provider name) */
+    title: string;
+    /** Total number of slides (for the dot indicators) */
+    totalSlides: number;
+};
+declare const CarouselSlide: ({ icon, iconLabel, title, description, image, primaryButtonLabel, onPrimaryButtonClick, onDotClick, onNextClick, slideIndex, totalSlides, size, testId, }: CarouselSlideProps) => React.JSX.Element;
+export default CarouselSlide;

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

@@ -0,0 +1,22 @@
+/**
+ * @jsxRuntime classic
+ * @jsx jsx
+ */
+import React from 'react';
+import type { CarouselItem } from './types';
+type CarouselProps = {
+    /** Provider icon element or URL — passed through to each slide */
+    icon?: React.ReactNode | string;
+    /** Alt for the icon, e.g. "Figma" */
+    iconLabel?: string;
+    /** Ordered list of teaser slides */
+    items: CarouselItem[];
+    /** Called when the user clicks the primary button */
+    onPrimaryButtonClick?: () => void;
+    /** Text for the auth button, e.g. "Connect to Figma" */
+    primaryButtonLabel: string;
+    /** testId prefix */
+    testId?: string;
+};
+declare const Carousel: ({ icon, iconLabel, items, onPrimaryButtonClick, primaryButtonLabel, testId, }: CarouselProps) => React.JSX.Element;
+export default Carousel;

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

@@ -0,0 +1,26 @@
+import type { ReactNode } from 'react';
+/**
+ * Layout size bucket derived from the carousel container's pixel dimensions
+ * via ResizeObserver (replaces CSS @container queries which are lint-blocked).
+ *
+ *  full    — wide (> 400px) AND tall (> 140px): two-column layout with image panel
+ *  compact — medium width/height: image hidden, button moves above title
+ *  minimal — very small: description + dots hidden, button only
+ */
+export type CarouselSize = 'full' | 'compact' | 'minimal';
+export type CarouselItem = {
+    /**
+     * Body text describing the benefit.
+     * Pass a plain string for static copy, or a function that receives the
+     * provider name (e.g. "Google Drive") and returns the final string.
+     */
+    description: string;
+    /** Large hero image — either a React element (e.g. SVG) or an image URL */
+    image: ReactNode | string;
+    /**
+     * Title of the teaser slide.
+     * Pass a plain string for static copy, or a function that receives the
+     * provider name (e.g. "Google Drive") and returns the final string.
+     */
+    title: string;
+};

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/smart-card",
-	"version": "45.6.7",
+	"version": "45.6.9",
 	"description": "Smart card component",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -35,7 +35,7 @@
 		"ak-postbuild": "ls -d dist/* | xargs -n 1 copyfiles -u 1 -V src/**/*.{svg,png}"
 	},
 	"dependencies": {
-		"@atlaskit/adf-utils": "^20.1.0",
+		"@atlaskit/adf-utils": "^20.2.0",
 		"@atlaskit/afm-i18n-platform-linking-platform-smart-card": "2.6.0",
 		"@atlaskit/analytics-cross-product": "^2.0.0",
 		"@atlaskit/analytics-gas-types": "^6.0.0",
@@ -79,7 +79,7 @@
 		"@atlaskit/primitives": "^20.3.0",
 		"@atlaskit/react-compiler-gating": "^0.2.0",
 		"@atlaskit/react-ufo": "^7.3.0",
-		"@atlaskit/rovo-triggers": "^9.6.0",
+		"@atlaskit/rovo-triggers": "^9.7.0",
 		"@atlaskit/section-message": "^9.2.0",
 		"@atlaskit/select": "^22.3.0",
 		"@atlaskit/spinner": "^20.1.0",
@@ -88,7 +88,7 @@
 		"@atlaskit/textfield": "^9.1.0",
 		"@atlaskit/theme": "^26.1.0",
 		"@atlaskit/tile": "^2.1.0",
-		"@atlaskit/tmp-editor-statsig": "^119.0.0",
+		"@atlaskit/tmp-editor-statsig": "^120.0.0",
 		"@atlaskit/tokens": "^15.3.0",
 		"@atlaskit/tooltip": "^23.1.0",
 		"@atlaskit/ufo": "^1.0.0",