@fluentui/react-carousel 9.5.0 → 9.6.0

package/CHANGELOG.md

@@ -1,12 +1,25 @@
 # Change Log - @fluentui/react-carousel
 
-This log was last generated on Tue, 18 Feb 2025 11:25:58 GMT and should not be manually modified.
+This log was last generated on Fri, 21 Feb 2025 14:30:46 GMT and should not be manually modified.
 
 <!-- Start content -->
 
+## [9.6.0](https://github.com/microsoft/fluentui/tree/@fluentui/react-carousel_v9.6.0)
+
+Fri, 21 Feb 2025 14:30:46 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-carousel_v9.5.0..@fluentui/react-carousel_v9.6.0)
+
+### Minor changes
+
+- feat: Implement props to control animation duration and autoplay interval ([PR #33820](https://github.com/microsoft/fluentui/pull/33820) by mifraser@microsoft.com)
+- Bump @fluentui/react-aria to v9.14.0 ([PR #33876](https://github.com/microsoft/fluentui/pull/33876) by beachball)
+- Bump @fluentui/react-button to v9.4.0 ([PR #33876](https://github.com/microsoft/fluentui/pull/33876) by beachball)
+- Bump @fluentui/react-tooltip to v9.6.0 ([PR #33876](https://github.com/microsoft/fluentui/pull/33876) by beachball)
+- Bump @fluentui/react-tabster to v9.24.0 ([PR #33876](https://github.com/microsoft/fluentui/pull/33876) by beachball)
+
 ## [9.5.0](https://github.com/microsoft/fluentui/tree/@fluentui/react-carousel_v9.5.0)
 
-Tue, 18 Feb 2025 11:25:58 GMT 
+Tue, 18 Feb 2025 11:26:27 GMT 
 [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-carousel_v9.4.7..@fluentui/react-carousel_v9.5.0)
 
 ### Minor changes

package/dist/index.d.ts

@@ -163,7 +163,10 @@ export declare type CarouselIndexChangeData = (EventData<'click', React_2.MouseE
 /**
  * List of integrated motion types
  */
-declare type CarouselMotion = 'slide' | 'fade';
+declare type CarouselMotion = 'slide' | {
+    kind: 'slide';
+    duration?: number;
+} | 'fade';
 
 /**
  * Used to jump to a card based on index, using arrow navigation via Tabster.
@@ -357,8 +360,15 @@ export declare type CarouselProps = ComponentProps<CarouselSlots> & {
      */
     whitespace?: boolean;
     /**
-     * Sets motion to fade in/out style with minimal movement
-     * Defaults: false
+     * Sets motion type as either 'slide' or 'fade'
+     * Defaults: 'slide'
+     *
+     * Users can also pass 'slide' & duration via CarouselMotion object to control carousel speed.
+     * Drag interactions are not affected because duration is then determined by the drag force.
+     *
+     * Note: Duration is not in milliseconds because Carousel uses an
+     * attraction physics simulation when scrolling instead of easings.
+     * Only values between 20-60 are recommended, 25 is the default.
      */
     motion?: CarouselMotion;
     /**
@@ -366,6 +376,13 @@ export declare type CarouselProps = ComponentProps<CarouselSlots> & {
      * Defaults to: undefined
      */
     announcement?: CarouselAnnouncerFunction;
+    /**
+     * Choose a delay between autoplay transitions in milliseconds.
+     * Only active if Autoplay is enabled via CarouselAutoplayButton
+     *
+     * Defaults: 4000
+     */
+    autoplayInterval?: number;
 };
 
 export declare const CarouselProvider: Provider<CarouselContextValue | undefined> & FC<ProviderProps<CarouselContextValue | undefined>>;

package/lib/components/Carousel/Carousel.types.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/Carousel/Carousel.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, EventHandler, Slot } from '@fluentui/react-utilities';\nimport type { CarouselContextValue, CarouselIndexChangeData } from '../CarouselContext.types';\n\nexport type CarouselSlots = {\n  root: Slot<'div'>;\n};\n\n/**\n * Children function replacement, passes through updated context index and carousel information for localization\n */\nexport type CarouselAnnouncerFunction = (index: number, totalSlides: number, slideGroupList: number[][]) => string;\n\n/**\n * List of integrated motion types\n */\nexport type CarouselMotion = 'slide' | 'fade';\n\n/**\n * Carousel Props\n */\nexport type CarouselProps = ComponentProps<CarouselSlots> & {\n  /**\n   * The initial page to display in uncontrolled mode.\n   */\n  defaultActiveIndex?: number;\n\n  /**\n   * The alignment of the carousel.\n   */\n  align?: 'center' | 'start' | 'end';\n\n  /**\n   * The value of the currently active page.\n   */\n  activeIndex?: number;\n\n  /**\n   * Callback to notify a page change.\n   */\n  onActiveIndexChange?: EventHandler<CarouselIndexChangeData>;\n\n  /**\n   * Circular enables the carousel to loop back around on navigation past trailing index.\n   */\n  circular?: boolean;\n\n  /**\n   * Controls the number of carousel cards per navigation element, will default to 'auto'\n   * Recommended to set to '1' when using full page carousel cards.\n   */\n  groupSize?: number | 'auto';\n\n  /**\n   * Enables drag to scroll on carousel items.\n   * Defaults to: False\n   */\n  draggable?: boolean;\n\n  /**\n   * Adds whitespace to start/end so that 'align' prop is always respected for current index\n   * Defaults to: False\n   */\n  whitespace?: boolean;\n\n  /**\n   * Sets motion to fade in/out style with minimal movement\n   * Defaults: false\n   */\n  motion?: CarouselMotion;\n\n  /**\n   * Localizes the string used to announce carousel page changes\n   * Defaults to: undefined\n   */\n  announcement?: CarouselAnnouncerFunction;\n};\n\n/**\n * State used in rendering Carousel\n */\nexport type CarouselState = ComponentState<CarouselSlots> & CarouselContextValue;\n\nexport interface CarouselVisibilityEventDetail {\n  isVisible: boolean;\n}\n\nexport type CarouselVisibilityChangeEvent = CustomEvent<CarouselVisibilityEventDetail>;\n\n/**\n * @internal\n */\nexport interface CarouselUpdateData {\n  /**\n   * The current carousel index, a change in index will not trigger the callback (use context index instead).\n   */\n  activeIndex: number;\n  /**\n   * The total number of slides to be navigated, accounts for grouping.\n   */\n  navItemsCount: number;\n  /**\n   * A breakdown of the card indexes contained within each slide index.\n   */\n  groupIndexList: number[][];\n  /**\n   * An array of the card DOM elements after render\n   */\n  slideNodes: HTMLElement[];\n}\n"],"names":[],"rangeMappings":";;","mappings":"AAwFA;;CAEC,GACD,WAiBC"}
+{"version":3,"sources":["../src/components/Carousel/Carousel.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, EventHandler, Slot } from '@fluentui/react-utilities';\nimport type { CarouselContextValue, CarouselIndexChangeData } from '../CarouselContext.types';\n\nexport type CarouselSlots = {\n  root: Slot<'div'>;\n};\n\n/**\n * Children function replacement, passes through updated context index and carousel information for localization\n */\nexport type CarouselAnnouncerFunction = (index: number, totalSlides: number, slideGroupList: number[][]) => string;\n\n/**\n * List of integrated motion types\n */\nexport type CarouselMotion = 'slide' | { kind: 'slide'; duration?: number } | 'fade';\n\n/**\n * Carousel Props\n */\nexport type CarouselProps = ComponentProps<CarouselSlots> & {\n  /**\n   * The initial page to display in uncontrolled mode.\n   */\n  defaultActiveIndex?: number;\n\n  /**\n   * The alignment of the carousel.\n   */\n  align?: 'center' | 'start' | 'end';\n\n  /**\n   * The value of the currently active page.\n   */\n  activeIndex?: number;\n\n  /**\n   * Callback to notify a page change.\n   */\n  onActiveIndexChange?: EventHandler<CarouselIndexChangeData>;\n\n  /**\n   * Circular enables the carousel to loop back around on navigation past trailing index.\n   */\n  circular?: boolean;\n\n  /**\n   * Controls the number of carousel cards per navigation element, will default to 'auto'\n   * Recommended to set to '1' when using full page carousel cards.\n   */\n  groupSize?: number | 'auto';\n\n  /**\n   * Enables drag to scroll on carousel items.\n   * Defaults to: False\n   */\n  draggable?: boolean;\n\n  /**\n   * Adds whitespace to start/end so that 'align' prop is always respected for current index\n   * Defaults to: False\n   */\n  whitespace?: boolean;\n\n  /**\n   * Sets motion type as either 'slide' or 'fade'\n   * Defaults: 'slide'\n   *\n   * Users can also pass 'slide' & duration via CarouselMotion object to control carousel speed.\n   * Drag interactions are not affected because duration is then determined by the drag force.\n   *\n   * Note: Duration is not in milliseconds because Carousel uses an\n   * attraction physics simulation when scrolling instead of easings.\n   * Only values between 20-60 are recommended, 25 is the default.\n   */\n  motion?: CarouselMotion;\n\n  /**\n   * Localizes the string used to announce carousel page changes\n   * Defaults to: undefined\n   */\n  announcement?: CarouselAnnouncerFunction;\n\n  /**\n   * Choose a delay between autoplay transitions in milliseconds.\n   * Only active if Autoplay is enabled via CarouselAutoplayButton\n   *\n   * Defaults: 4000\n   */\n  autoplayInterval?: number;\n};\n\n/**\n * State used in rendering Carousel\n */\nexport type CarouselState = ComponentState<CarouselSlots> & CarouselContextValue;\n\nexport interface CarouselVisibilityEventDetail {\n  isVisible: boolean;\n}\n\nexport type CarouselVisibilityChangeEvent = CustomEvent<CarouselVisibilityEventDetail>;\n\n/**\n * @internal\n */\nexport interface CarouselUpdateData {\n  /**\n   * The current carousel index, a change in index will not trigger the callback (use context index instead).\n   */\n  activeIndex: number;\n  /**\n   * The total number of slides to be navigated, accounts for grouping.\n   */\n  navItemsCount: number;\n  /**\n   * A breakdown of the card indexes contained within each slide index.\n   */\n  groupIndexList: number[][];\n  /**\n   * An array of the card DOM elements after render\n   */\n  slideNodes: HTMLElement[];\n}\n"],"names":[],"rangeMappings":";;","mappings":"AAuGA;;CAEC,GACD,WAiBC"}

package/lib/components/Carousel/useCarousel.js

@@ -13,7 +13,7 @@ import { useAnnounce } from '@fluentui/react-shared-contexts';
  * @param ref - reference to root HTMLDivElement of Carousel
  */ export function useCarousel_unstable(props, ref) {
     'use no memo';
-    const { align = 'center', circular = false, onActiveIndexChange, groupSize = 'auto', draggable = false, whitespace = false, announcement, motion = 'slide' } = props;
+    const { align = 'center', circular = false, onActiveIndexChange, groupSize = 'auto', draggable = false, whitespace = false, announcement, motion = 'slide', autoplayInterval = 4000 } = props;
     const { dir } = useFluent();
     const { activeIndex, carouselApi, containerRef, viewportRef, subscribeForValues, enableAutoplay, resetAutoplay } = useEmblaCarousel({
         align,
@@ -26,7 +26,8 @@ import { useAnnounce } from '@fluentui/react-shared-contexts';
         containScroll: whitespace ? false : 'keepSnaps',
         motion,
         onDragIndexChange: onActiveIndexChange,
-        onAutoplayIndexChange: onActiveIndexChange
+        onAutoplayIndexChange: onActiveIndexChange,
+        autoplayInterval
     });
     const selectPageByElement = useEventCallback((event, element, jump)=>{
         const foundIndex = carouselApi.scrollToElement(element, jump);

package/lib/components/Carousel/useCarousel.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/Carousel/useCarousel.ts"],"sourcesContent":["import { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport {\n  getIntrinsicElementProps,\n  slot,\n  useEventCallback,\n  useIsomorphicLayoutEffect,\n  useMergedRefs,\n} from '@fluentui/react-utilities';\nimport * as React from 'react';\n\nimport type { CarouselProps, CarouselState } from './Carousel.types';\nimport type { CarouselContextValue } from '../CarouselContext.types';\nimport { useEmblaCarousel } from '../useEmblaCarousel';\nimport { useAnnounce } from '@fluentui/react-shared-contexts';\n\n/**\n * Create the state required to render Carousel.\n *\n * The returned state can be modified with hooks such as useCarouselStyles_unstable,\n * before being passed to renderCarousel_unstable.\n *\n * @param props - props from this instance of Carousel\n * @param ref - reference to root HTMLDivElement of Carousel\n */\nexport function useCarousel_unstable(props: CarouselProps, ref: React.Ref<HTMLDivElement>): CarouselState {\n  'use no memo';\n\n  const {\n    align = 'center',\n    circular = false,\n    onActiveIndexChange,\n    groupSize = 'auto',\n    draggable = false,\n    whitespace = false,\n    announcement,\n    motion = 'slide',\n  } = props;\n\n  const { dir } = useFluent();\n  const { activeIndex, carouselApi, containerRef, viewportRef, subscribeForValues, enableAutoplay, resetAutoplay } =\n    useEmblaCarousel({\n      align,\n      direction: dir,\n      loop: circular,\n      slidesToScroll: groupSize,\n      defaultActiveIndex: props.defaultActiveIndex,\n      activeIndex: props.activeIndex,\n      watchDrag: draggable,\n      containScroll: whitespace ? false : 'keepSnaps',\n      motion,\n      onDragIndexChange: onActiveIndexChange,\n      onAutoplayIndexChange: onActiveIndexChange,\n    });\n\n  const selectPageByElement: CarouselContextValue['selectPageByElement'] = useEventCallback((event, element, jump) => {\n    const foundIndex = carouselApi.scrollToElement(element, jump);\n    onActiveIndexChange?.(event, { event, type: 'focus', index: foundIndex });\n\n    return foundIndex;\n  });\n\n  const selectPageByIndex: CarouselContextValue['selectPageByIndex'] = useEventCallback((event, index, jump) => {\n    carouselApi.scrollToIndex(index, jump);\n\n    onActiveIndexChange?.(event, { event, type: 'click', index });\n  });\n\n  const selectPageByDirection: CarouselContextValue['selectPageByDirection'] = useEventCallback((event, direction) => {\n    const nextPageIndex = carouselApi.scrollInDirection(direction);\n    onActiveIndexChange?.(event, { event, type: 'click', index: nextPageIndex });\n\n    return nextPageIndex;\n  });\n\n  const mergedContainerRef = useMergedRefs(ref, containerRef);\n\n  // Announce carousel updates\n  const announcementTextRef = React.useRef<string>('');\n  const totalNavLength = React.useRef<number>(0);\n  const navGroupRef = React.useRef<number[][]>([]);\n\n  const { announce } = useAnnounce();\n\n  const updateAnnouncement = useEventCallback(() => {\n    if (totalNavLength.current <= 0 || !announcement) {\n      // Ignore announcements until slides discovered\n      return;\n    }\n\n    const announcementText = announcement(activeIndex, totalNavLength.current, navGroupRef.current);\n\n    if (announcementText !== announcementTextRef.current) {\n      announcementTextRef.current = announcementText;\n      announce(announcementText, { polite: true });\n    }\n  });\n\n  useIsomorphicLayoutEffect(() => {\n    // Subscribe to any non-index carousel state changes\n    return subscribeForValues(data => {\n      if (totalNavLength.current <= 0 && data.navItemsCount > 0 && announcement) {\n        const announcementText = announcement(data.activeIndex, data.navItemsCount, data.groupIndexList);\n        // Initialize our string to prevent updateAnnouncement from reading an initial load\n        announcementTextRef.current = announcementText;\n      }\n      totalNavLength.current = data.navItemsCount;\n      navGroupRef.current = data.groupIndexList;\n      updateAnnouncement();\n    });\n  }, [subscribeForValues, updateAnnouncement, announcement]);\n\n  useIsomorphicLayoutEffect(() => {\n    updateAnnouncement();\n  }, [activeIndex, updateAnnouncement]);\n\n  return {\n    components: {\n      root: 'div',\n    },\n    root: slot.always(\n      getIntrinsicElementProps('div', {\n        ref: mergedContainerRef,\n        role: 'region',\n        ...props,\n      }),\n      { elementType: 'div' },\n    ),\n\n    activeIndex,\n    circular,\n    containerRef: mergedContainerRef,\n    viewportRef,\n    selectPageByElement,\n    selectPageByDirection,\n    selectPageByIndex,\n    subscribeForValues,\n    enableAutoplay,\n    resetAutoplay,\n  };\n}\n"],"names":["useFluent_unstable","useFluent","getIntrinsicElementProps","slot","useEventCallback","useIsomorphicLayoutEffect","useMergedRefs","React","useEmblaCarousel","useAnnounce","useCarousel_unstable","props","ref","align","circular","onActiveIndexChange","groupSize","draggable","whitespace","announcement","motion","dir","activeIndex","carouselApi","containerRef","viewportRef","subscribeForValues","enableAutoplay","resetAutoplay","direction","loop","slidesToScroll","defaultActiveIndex","watchDrag","containScroll","onDragIndexChange","onAutoplayIndexChange","selectPageByElement","event","element","jump","foundIndex","scrollToElement","type","index","selectPageByIndex","scrollToIndex","selectPageByDirection","nextPageIndex","scrollInDirection","mergedContainerRef","announcementTextRef","useRef","totalNavLength","navGroupRef","announce","updateAnnouncement","current","announcementText","polite","data","navItemsCount","groupIndexList","components","root","always","role","elementType"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
+{"version":3,"sources":["../src/components/Carousel/useCarousel.ts"],"sourcesContent":["import { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport {\n  getIntrinsicElementProps,\n  slot,\n  useEventCallback,\n  useIsomorphicLayoutEffect,\n  useMergedRefs,\n} from '@fluentui/react-utilities';\nimport * as React from 'react';\n\nimport type { CarouselProps, CarouselState } from './Carousel.types';\nimport type { CarouselContextValue } from '../CarouselContext.types';\nimport { useEmblaCarousel } from '../useEmblaCarousel';\nimport { useAnnounce } from '@fluentui/react-shared-contexts';\n\n/**\n * Create the state required to render Carousel.\n *\n * The returned state can be modified with hooks such as useCarouselStyles_unstable,\n * before being passed to renderCarousel_unstable.\n *\n * @param props - props from this instance of Carousel\n * @param ref - reference to root HTMLDivElement of Carousel\n */\nexport function useCarousel_unstable(props: CarouselProps, ref: React.Ref<HTMLDivElement>): CarouselState {\n  'use no memo';\n\n  const {\n    align = 'center',\n    circular = false,\n    onActiveIndexChange,\n    groupSize = 'auto',\n    draggable = false,\n    whitespace = false,\n    announcement,\n    motion = 'slide',\n    autoplayInterval = 4000,\n  } = props;\n\n  const { dir } = useFluent();\n  const { activeIndex, carouselApi, containerRef, viewportRef, subscribeForValues, enableAutoplay, resetAutoplay } =\n    useEmblaCarousel({\n      align,\n      direction: dir,\n      loop: circular,\n      slidesToScroll: groupSize,\n      defaultActiveIndex: props.defaultActiveIndex,\n      activeIndex: props.activeIndex,\n      watchDrag: draggable,\n      containScroll: whitespace ? false : 'keepSnaps',\n      motion,\n      onDragIndexChange: onActiveIndexChange,\n      onAutoplayIndexChange: onActiveIndexChange,\n      autoplayInterval,\n    });\n\n  const selectPageByElement: CarouselContextValue['selectPageByElement'] = useEventCallback((event, element, jump) => {\n    const foundIndex = carouselApi.scrollToElement(element, jump);\n    onActiveIndexChange?.(event, { event, type: 'focus', index: foundIndex });\n\n    return foundIndex;\n  });\n\n  const selectPageByIndex: CarouselContextValue['selectPageByIndex'] = useEventCallback((event, index, jump) => {\n    carouselApi.scrollToIndex(index, jump);\n\n    onActiveIndexChange?.(event, { event, type: 'click', index });\n  });\n\n  const selectPageByDirection: CarouselContextValue['selectPageByDirection'] = useEventCallback((event, direction) => {\n    const nextPageIndex = carouselApi.scrollInDirection(direction);\n    onActiveIndexChange?.(event, { event, type: 'click', index: nextPageIndex });\n\n    return nextPageIndex;\n  });\n\n  const mergedContainerRef = useMergedRefs(ref, containerRef);\n\n  // Announce carousel updates\n  const announcementTextRef = React.useRef<string>('');\n  const totalNavLength = React.useRef<number>(0);\n  const navGroupRef = React.useRef<number[][]>([]);\n\n  const { announce } = useAnnounce();\n\n  const updateAnnouncement = useEventCallback(() => {\n    if (totalNavLength.current <= 0 || !announcement) {\n      // Ignore announcements until slides discovered\n      return;\n    }\n\n    const announcementText = announcement(activeIndex, totalNavLength.current, navGroupRef.current);\n\n    if (announcementText !== announcementTextRef.current) {\n      announcementTextRef.current = announcementText;\n      announce(announcementText, { polite: true });\n    }\n  });\n\n  useIsomorphicLayoutEffect(() => {\n    // Subscribe to any non-index carousel state changes\n    return subscribeForValues(data => {\n      if (totalNavLength.current <= 0 && data.navItemsCount > 0 && announcement) {\n        const announcementText = announcement(data.activeIndex, data.navItemsCount, data.groupIndexList);\n        // Initialize our string to prevent updateAnnouncement from reading an initial load\n        announcementTextRef.current = announcementText;\n      }\n      totalNavLength.current = data.navItemsCount;\n      navGroupRef.current = data.groupIndexList;\n      updateAnnouncement();\n    });\n  }, [subscribeForValues, updateAnnouncement, announcement]);\n\n  useIsomorphicLayoutEffect(() => {\n    updateAnnouncement();\n  }, [activeIndex, updateAnnouncement]);\n\n  return {\n    components: {\n      root: 'div',\n    },\n    root: slot.always(\n      getIntrinsicElementProps('div', {\n        ref: mergedContainerRef,\n        role: 'region',\n        ...props,\n      }),\n      { elementType: 'div' },\n    ),\n\n    activeIndex,\n    circular,\n    containerRef: mergedContainerRef,\n    viewportRef,\n    selectPageByElement,\n    selectPageByDirection,\n    selectPageByIndex,\n    subscribeForValues,\n    enableAutoplay,\n    resetAutoplay,\n  };\n}\n"],"names":["useFluent_unstable","useFluent","getIntrinsicElementProps","slot","useEventCallback","useIsomorphicLayoutEffect","useMergedRefs","React","useEmblaCarousel","useAnnounce","useCarousel_unstable","props","ref","align","circular","onActiveIndexChange","groupSize","draggable","whitespace","announcement","motion","autoplayInterval","dir","activeIndex","carouselApi","containerRef","viewportRef","subscribeForValues","enableAutoplay","resetAutoplay","direction","loop","slidesToScroll","defaultActiveIndex","watchDrag","containScroll","onDragIndexChange","onAutoplayIndexChange","selectPageByElement","event","element","jump","foundIndex","scrollToElement","type","index","selectPageByIndex","scrollToIndex","selectPageByDirection","nextPageIndex","scrollInDirection","mergedContainerRef","announcementTextRef","useRef","totalNavLength","navGroupRef","announce","updateAnnouncement","current","announcementText","polite","data","navItemsCount","groupIndexList","components","root","always","role","elementType"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}

package/lib/components/useEmblaCarousel.js

@@ -28,7 +28,11 @@ export function setTabsterDefault(element, isDefault) {
     }
 }
 export function useEmblaCarousel(options) {
-    const { align, direction, loop, slidesToScroll, watchDrag, containScroll, motion, onDragIndexChange, onAutoplayIndexChange } = options;
+    const { align, autoplayInterval, direction, loop, slidesToScroll, watchDrag, containScroll, motion, onDragIndexChange, onAutoplayIndexChange } = options;
+    var _motion_kind;
+    const motionType = typeof motion === 'string' ? motion : (_motion_kind = motion === null || motion === void 0 ? void 0 : motion.kind) !== null && _motion_kind !== void 0 ? _motion_kind : 'slide';
+    var _motion_duration;
+    const motionDuration = typeof motion === 'string' ? 25 : (_motion_duration = motion === null || motion === void 0 ? void 0 : motion.duration) !== null && _motion_duration !== void 0 ? _motion_duration : 25;
     const [activeIndex, setActiveIndex] = useControllableState({
         defaultState: options.defaultActiveIndex,
         state: options.activeIndex,
@@ -48,7 +52,8 @@ export function useEmblaCarousel(options) {
         slidesToScroll,
         startIndex: activeIndex,
         watchDrag,
-        containScroll
+        containScroll,
+        duration: motionDuration
     });
     const emblaApi = React.useRef(null);
     const autoplayRef = React.useRef(false);
@@ -60,12 +65,13 @@ export function useEmblaCarousel(options) {
         const plugins = [];
         plugins.push(Autoplay({
             playOnInit: autoplayRef.current,
+            delay: autoplayInterval,
             /* stopOnInteraction: false causes autoplay to restart on interaction end*/ /* we'll handle this logic to ensure autoplay state is respected */ stopOnInteraction: true,
             stopOnFocusIn: false,
             stopOnMouseEnter: false
         }));
         // Optionally add Fade plugin
-        if (motion === 'fade') {
+        if (motionType === 'fade') {
             plugins.push(Fade());
         }
         if (watchDrag) {
@@ -75,9 +81,10 @@ export function useEmblaCarousel(options) {
         }
         return plugins;
     }, [
-        motion,
+        motionType,
         onDragEvent,
-        watchDrag
+        watchDrag,
+        autoplayInterval
     ]);
     /* This function enables autoplay to pause/play without affecting underlying state
    * Useful for pausing on focus etc. without having to reinitialize or set autoplay to off
@@ -246,7 +253,8 @@ export function useEmblaCarousel(options) {
             loop,
             slidesToScroll,
             watchDrag,
-            containScroll
+            containScroll,
+            duration: motionDuration
         };
         (_emblaApi_current = emblaApi.current) === null || _emblaApi_current === void 0 ? void 0 : _emblaApi_current.reInit({
             ...DEFAULT_EMBLA_OPTIONS,
@@ -259,7 +267,8 @@ export function useEmblaCarousel(options) {
         getPlugins,
         loop,
         slidesToScroll,
-        watchDrag
+        watchDrag,
+        motionDuration
     ]);
     React.useEffect(()=>{
         var _emblaApi_current, _emblaApi_current_slideNodes, _emblaApi_current1;

package/lib/components/useEmblaCarousel.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/useEmblaCarousel.ts"],"sourcesContent":["import { type EventHandler, useControllableState, useEventCallback } from '@fluentui/react-utilities';\nimport EmblaCarousel, { EmblaPluginType, type EmblaCarouselType, type EmblaOptionsType } from 'embla-carousel';\nimport * as React from 'react';\n\nimport { carouselCardClassNames } from './CarouselCard/useCarouselCardStyles.styles';\nimport { carouselSliderClassNames } from './CarouselSlider/useCarouselSliderStyles.styles';\nimport { CarouselMotion, CarouselUpdateData, CarouselVisibilityEventDetail } from '../Carousel';\nimport Autoplay from 'embla-carousel-autoplay';\nimport Fade from 'embla-carousel-fade';\nimport { pointerEventPlugin } from './pointerEvents';\nimport type { CarouselIndexChangeData } from './CarouselContext.types';\n\ntype EmblaEventHandler = Parameters<EmblaCarouselType['on']>[1];\n\nconst sliderClassname = `.${carouselSliderClassNames.root}`;\n\nconst DEFAULT_EMBLA_OPTIONS: EmblaOptionsType = {\n  containScroll: 'trimSnaps',\n  inViewThreshold: 0.99,\n  watchDrag: false,\n  skipSnaps: true,\n\n  container: sliderClassname,\n  slides: `.${carouselCardClassNames.root}`,\n};\n\nexport const EMBLA_VISIBILITY_EVENT = 'embla:visibilitychange';\n\nexport function setTabsterDefault(element: Element, isDefault: boolean) {\n  const tabsterAttr = element.getAttribute('data-tabster');\n\n  if (tabsterAttr) {\n    const tabsterAttributes = JSON.parse(tabsterAttr);\n    if (tabsterAttributes.focusable) {\n      // If tabster.focusable isn't present, we will ignore.\n      tabsterAttributes.focusable.isDefault = isDefault;\n      element.setAttribute('data-tabster', JSON.stringify(tabsterAttributes));\n    }\n  }\n}\n\nexport function useEmblaCarousel(\n  options: Pick<EmblaOptionsType, 'align' | 'direction' | 'loop' | 'slidesToScroll' | 'watchDrag' | 'containScroll'> & {\n    defaultActiveIndex: number | undefined;\n    activeIndex: number | undefined;\n    motion?: CarouselMotion;\n    onDragIndexChange?: EventHandler<CarouselIndexChangeData>;\n    onAutoplayIndexChange?: EventHandler<CarouselIndexChangeData>;\n  },\n) {\n  const {\n    align,\n    direction,\n    loop,\n    slidesToScroll,\n    watchDrag,\n    containScroll,\n    motion,\n    onDragIndexChange,\n    onAutoplayIndexChange,\n  } = options;\n  const [activeIndex, setActiveIndex] = useControllableState({\n    defaultState: options.defaultActiveIndex,\n    state: options.activeIndex,\n    initialState: 0,\n  });\n\n  const onDragEvent = useEventCallback((event: PointerEvent | MouseEvent, index: number) => {\n    onDragIndexChange?.(event, { event, type: 'drag', index });\n  });\n\n  const emblaOptions = React.useRef<EmblaOptionsType>({\n    align,\n    direction,\n    loop,\n    slidesToScroll,\n    startIndex: activeIndex,\n    watchDrag,\n    containScroll,\n  });\n\n  const emblaApi = React.useRef<EmblaCarouselType | null>(null);\n  const autoplayRef = React.useRef<boolean>(false);\n\n  const resetAutoplay = React.useCallback(() => {\n    emblaApi.current?.plugins().autoplay?.reset();\n  }, []);\n\n  const getPlugins = React.useCallback(() => {\n    const plugins: EmblaPluginType[] = [];\n\n    plugins.push(\n      Autoplay({\n        playOnInit: autoplayRef.current,\n        /* stopOnInteraction: false causes autoplay to restart on interaction end*/\n        /* we'll handle this logic to ensure autoplay state is respected */\n        stopOnInteraction: true,\n        stopOnFocusIn: false, // We'll handle this one manually to prevent conflicts with tabster\n        stopOnMouseEnter: false, // We will handle this manually to align functionality\n      }),\n    );\n\n    // Optionally add Fade plugin\n    if (motion === 'fade') {\n      plugins.push(Fade());\n    }\n\n    if (watchDrag) {\n      plugins.push(\n        pointerEventPlugin({\n          onSelectViaDrag: onDragEvent,\n        }),\n      );\n    }\n\n    return plugins;\n  }, [motion, onDragEvent, watchDrag]);\n\n  /* This function enables autoplay to pause/play without affecting underlying state\n   * Useful for pausing on focus etc. without having to reinitialize or set autoplay to off\n   */\n  const enableAutoplay = React.useCallback(\n    (autoplay: boolean, temporary?: boolean) => {\n      if (!temporary) {\n        autoplayRef.current = autoplay;\n      }\n\n      if (autoplay && autoplayRef.current) {\n        // Autoplay should only enable in the case where underlying state is true, temporary should not override\n        emblaApi.current?.plugins().autoplay?.play();\n        // Reset after play to ensure timing and any focus/mouse pause state is reset.\n        resetAutoplay();\n      } else if (!autoplay) {\n        emblaApi.current?.plugins().autoplay?.stop();\n      }\n    },\n    [resetAutoplay],\n  );\n\n  // Listeners contains callbacks for UI elements that may require state update based on embla changes\n  const listeners = React.useRef(new Set<(data: CarouselUpdateData) => void>());\n  const subscribeForValues = React.useCallback((listener: (data: CarouselUpdateData) => void) => {\n    listeners.current.add(listener);\n\n    return () => {\n      listeners.current.delete(listener);\n    };\n  }, []);\n\n  const updateIndex = () => {\n    const newIndex = emblaApi.current?.selectedScrollSnap() ?? 0;\n    const slides = emblaApi.current?.slideNodes();\n    const slideRegistry = emblaApi.current?.internalEngine().slideRegistry;\n    const actualIndex = slideRegistry?.[newIndex]?.[0] ?? 0;\n\n    // We set the first card in the current group as the default tabster index for focus capture\n    slides?.forEach((slide, slideIndex) => {\n      setTabsterDefault(slide, slideIndex === actualIndex);\n    });\n    setActiveIndex(newIndex);\n  };\n\n  const handleReinit = useEventCallback(() => {\n    const nodes: HTMLElement[] = emblaApi.current?.slideNodes() ?? [];\n    const groupIndexList: number[][] = emblaApi.current?.internalEngine().slideRegistry ?? [];\n    const navItemsCount = groupIndexList.length > 0 ? groupIndexList.length : nodes.length;\n    const data: CarouselUpdateData = {\n      navItemsCount,\n      activeIndex: emblaApi.current?.selectedScrollSnap() ?? 0,\n      groupIndexList,\n      slideNodes: nodes,\n    };\n\n    updateIndex();\n    emblaApi.current?.scrollTo(activeIndex, false);\n    for (const listener of listeners.current) {\n      listener(data);\n    }\n  });\n\n  const handleIndexChange: EmblaEventHandler = useEventCallback((_, eventType) => {\n    const newIndex = emblaApi.current?.selectedScrollSnap() ?? 0;\n    updateIndex();\n    if (eventType === 'autoplay:select') {\n      const noopEvent = new Event('autoplay');\n      onAutoplayIndexChange?.(noopEvent, { event: noopEvent, type: 'autoplay', index: newIndex });\n    }\n  });\n\n  const viewportRef: React.RefObject<HTMLDivElement> = React.useRef(null);\n  const containerRef: React.RefObject<HTMLDivElement> = React.useMemo(() => {\n    let currentElement: HTMLDivElement | null = null;\n\n    const handleVisibilityChange = () => {\n      const cardElements = emblaApi.current?.slideNodes();\n      const visibleIndexes = emblaApi.current?.slidesInView() ?? [];\n\n      cardElements?.forEach((cardElement, index) => {\n        cardElement.dispatchEvent(\n          new CustomEvent<CarouselVisibilityEventDetail>(EMBLA_VISIBILITY_EVENT, {\n            bubbles: false,\n            detail: { isVisible: visibleIndexes.includes(index) },\n          }),\n        );\n      });\n    };\n\n    // Get plugins using autoplayRef to prevent state change recreating EmblaCarousel\n    const plugins = getPlugins();\n\n    return {\n      set current(newElement: HTMLDivElement | null) {\n        if (currentElement) {\n          emblaApi.current?.off('slidesInView', handleVisibilityChange);\n          emblaApi.current?.off('select', handleIndexChange);\n          emblaApi.current?.off('reInit', handleReinit);\n          emblaApi.current?.off('autoplay:select', handleIndexChange);\n          emblaApi.current?.destroy();\n        }\n\n        // Use direct viewport if available, else fallback to container (includes Carousel controls).\n        currentElement = viewportRef.current ?? newElement;\n        if (currentElement) {\n          emblaApi.current = EmblaCarousel(\n            currentElement,\n            {\n              ...DEFAULT_EMBLA_OPTIONS,\n              ...emblaOptions.current,\n            },\n            plugins,\n          );\n\n          emblaApi.current?.on('reInit', handleReinit);\n          emblaApi.current?.on('slidesInView', handleVisibilityChange);\n          emblaApi.current?.on('select', handleIndexChange);\n          emblaApi.current?.on('autoplay:select', handleIndexChange);\n        }\n      },\n    };\n  }, [getPlugins, handleIndexChange, handleReinit]);\n\n  const carouselApi = React.useMemo(\n    () => ({\n      scrollToElement: (element: HTMLElement, jump?: boolean) => {\n        const cardElements = emblaApi.current?.slideNodes();\n        const groupIndexList = emblaApi.current?.internalEngine().slideRegistry ?? [];\n        const cardIndex = cardElements?.indexOf(element) ?? 0;\n        const groupIndex = groupIndexList.findIndex(group => {\n          return group.includes(cardIndex);\n        });\n        const indexFocus = groupIndex ?? cardIndex;\n        emblaApi.current?.scrollTo(indexFocus, jump);\n\n        return indexFocus;\n      },\n      scrollToIndex: (index: number, jump?: boolean) => {\n        emblaApi.current?.scrollTo(index, jump);\n      },\n      scrollInDirection: (dir: 'prev' | 'next') => {\n        if (dir === 'prev') {\n          emblaApi.current?.scrollPrev();\n        } else {\n          emblaApi.current?.scrollNext();\n        }\n\n        return emblaApi.current?.selectedScrollSnap() ?? 0;\n      },\n    }),\n    [],\n  );\n\n  React.useEffect(() => {\n    const plugins = getPlugins();\n\n    emblaOptions.current = {\n      startIndex: emblaOptions.current.startIndex,\n      align,\n      direction,\n      loop,\n      slidesToScroll,\n      watchDrag,\n      containScroll,\n    };\n\n    emblaApi.current?.reInit(\n      {\n        ...DEFAULT_EMBLA_OPTIONS,\n        ...emblaOptions.current,\n      },\n      plugins,\n    );\n  }, [align, containScroll, direction, getPlugins, loop, slidesToScroll, watchDrag]);\n\n  React.useEffect(() => {\n    // Scroll to controlled values on update\n    // If active index is out of bounds, re-init will handle instead\n    const currentActiveIndex = emblaApi.current?.selectedScrollSnap() ?? 0;\n    const slideLength = emblaApi.current?.slideNodes()?.length ?? 0;\n    emblaOptions.current.startIndex = activeIndex;\n    if (activeIndex < slideLength && activeIndex !== currentActiveIndex) {\n      emblaApi.current?.scrollTo(activeIndex);\n    }\n  }, [activeIndex]);\n\n  return {\n    activeIndex,\n    carouselApi,\n    viewportRef,\n    containerRef,\n    subscribeForValues,\n    enableAutoplay,\n    resetAutoplay,\n  };\n}\n"],"names":["useControllableState","useEventCallback","EmblaCarousel","React","carouselCardClassNames","carouselSliderClassNames","Autoplay","Fade","pointerEventPlugin","sliderClassname","root","DEFAULT_EMBLA_OPTIONS","containScroll","inViewThreshold","watchDrag","skipSnaps","container","slides","EMBLA_VISIBILITY_EVENT","setTabsterDefault","element","isDefault","tabsterAttr","getAttribute","tabsterAttributes","JSON","parse","focusable","setAttribute","stringify","useEmblaCarousel","options","align","direction","loop","slidesToScroll","motion","onDragIndexChange","onAutoplayIndexChange","activeIndex","setActiveIndex","defaultState","defaultActiveIndex","state","initialState","onDragEvent","event","index","type","emblaOptions","useRef","startIndex","emblaApi","autoplayRef","resetAutoplay","useCallback","current","plugins","autoplay","reset","getPlugins","push","playOnInit","stopOnInteraction","stopOnFocusIn","stopOnMouseEnter","onSelectViaDrag","enableAutoplay","temporary","play","stop","listeners","Set","subscribeForValues","listener","add","delete","updateIndex","slideRegistry","newIndex","selectedScrollSnap","slideNodes","internalEngine","actualIndex","forEach","slide","slideIndex","handleReinit","nodes","groupIndexList","navItemsCount","length","data","scrollTo","handleIndexChange","_","eventType","noopEvent","Event","viewportRef","containerRef","useMemo","currentElement","handleVisibilityChange","cardElements","visibleIndexes","slidesInView","cardElement","dispatchEvent","CustomEvent","bubbles","detail","isVisible","includes","newElement","off","destroy","on","carouselApi","scrollToElement","jump","cardIndex","indexOf","groupIndex","findIndex","group","indexFocus","scrollToIndex","scrollInDirection","dir","scrollPrev","scrollNext","useEffect","reInit","currentActiveIndex","slideLength"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
+{"version":3,"sources":["../src/components/useEmblaCarousel.ts"],"sourcesContent":["import { type EventHandler, useControllableState, useEventCallback } from '@fluentui/react-utilities';\nimport EmblaCarousel, { EmblaPluginType, type EmblaCarouselType, type EmblaOptionsType } from 'embla-carousel';\nimport * as React from 'react';\n\nimport { carouselCardClassNames } from './CarouselCard/useCarouselCardStyles.styles';\nimport { carouselSliderClassNames } from './CarouselSlider/useCarouselSliderStyles.styles';\nimport { CarouselMotion, CarouselUpdateData, CarouselVisibilityEventDetail } from '../Carousel';\nimport Autoplay from 'embla-carousel-autoplay';\nimport Fade from 'embla-carousel-fade';\nimport { pointerEventPlugin } from './pointerEvents';\nimport type { CarouselIndexChangeData } from './CarouselContext.types';\n\ntype EmblaEventHandler = Parameters<EmblaCarouselType['on']>[1];\n\nconst sliderClassname = `.${carouselSliderClassNames.root}`;\n\nconst DEFAULT_EMBLA_OPTIONS: EmblaOptionsType = {\n  containScroll: 'trimSnaps',\n  inViewThreshold: 0.99,\n  watchDrag: false,\n  skipSnaps: true,\n\n  container: sliderClassname,\n  slides: `.${carouselCardClassNames.root}`,\n};\n\nexport const EMBLA_VISIBILITY_EVENT = 'embla:visibilitychange';\n\nexport function setTabsterDefault(element: Element, isDefault: boolean) {\n  const tabsterAttr = element.getAttribute('data-tabster');\n\n  if (tabsterAttr) {\n    const tabsterAttributes = JSON.parse(tabsterAttr);\n    if (tabsterAttributes.focusable) {\n      // If tabster.focusable isn't present, we will ignore.\n      tabsterAttributes.focusable.isDefault = isDefault;\n      element.setAttribute('data-tabster', JSON.stringify(tabsterAttributes));\n    }\n  }\n}\n\nexport function useEmblaCarousel(\n  options: Pick<EmblaOptionsType, 'align' | 'direction' | 'loop' | 'slidesToScroll' | 'watchDrag' | 'containScroll'> & {\n    defaultActiveIndex: number | undefined;\n    activeIndex: number | undefined;\n    motion?: CarouselMotion;\n    onDragIndexChange?: EventHandler<CarouselIndexChangeData>;\n    onAutoplayIndexChange?: EventHandler<CarouselIndexChangeData>;\n    autoplayInterval?: number;\n  },\n) {\n  const {\n    align,\n    autoplayInterval,\n    direction,\n    loop,\n    slidesToScroll,\n    watchDrag,\n    containScroll,\n    motion,\n    onDragIndexChange,\n    onAutoplayIndexChange,\n  } = options;\n\n  const motionType = typeof motion === 'string' ? motion : motion?.kind ?? 'slide';\n  const motionDuration = typeof motion === 'string' ? 25 : motion?.duration ?? 25;\n\n  const [activeIndex, setActiveIndex] = useControllableState({\n    defaultState: options.defaultActiveIndex,\n    state: options.activeIndex,\n    initialState: 0,\n  });\n\n  const onDragEvent = useEventCallback((event: PointerEvent | MouseEvent, index: number) => {\n    onDragIndexChange?.(event, { event, type: 'drag', index });\n  });\n\n  const emblaOptions = React.useRef<EmblaOptionsType>({\n    align,\n    direction,\n    loop,\n    slidesToScroll,\n    startIndex: activeIndex,\n    watchDrag,\n    containScroll,\n    duration: motionDuration,\n  });\n\n  const emblaApi = React.useRef<EmblaCarouselType | null>(null);\n  const autoplayRef = React.useRef<boolean>(false);\n\n  const resetAutoplay = React.useCallback(() => {\n    emblaApi.current?.plugins().autoplay?.reset();\n  }, []);\n\n  const getPlugins = React.useCallback(() => {\n    const plugins: EmblaPluginType[] = [];\n\n    plugins.push(\n      Autoplay({\n        playOnInit: autoplayRef.current,\n        delay: autoplayInterval,\n        /* stopOnInteraction: false causes autoplay to restart on interaction end*/\n        /* we'll handle this logic to ensure autoplay state is respected */\n        stopOnInteraction: true,\n        stopOnFocusIn: false, // We'll handle this one manually to prevent conflicts with tabster\n        stopOnMouseEnter: false, // We will handle this manually to align functionality\n      }),\n    );\n\n    // Optionally add Fade plugin\n    if (motionType === 'fade') {\n      plugins.push(Fade());\n    }\n\n    if (watchDrag) {\n      plugins.push(\n        pointerEventPlugin({\n          onSelectViaDrag: onDragEvent,\n        }),\n      );\n    }\n\n    return plugins;\n  }, [motionType, onDragEvent, watchDrag, autoplayInterval]);\n\n  /* This function enables autoplay to pause/play without affecting underlying state\n   * Useful for pausing on focus etc. without having to reinitialize or set autoplay to off\n   */\n  const enableAutoplay = React.useCallback(\n    (autoplay: boolean, temporary?: boolean) => {\n      if (!temporary) {\n        autoplayRef.current = autoplay;\n      }\n\n      if (autoplay && autoplayRef.current) {\n        // Autoplay should only enable in the case where underlying state is true, temporary should not override\n        emblaApi.current?.plugins().autoplay?.play();\n        // Reset after play to ensure timing and any focus/mouse pause state is reset.\n        resetAutoplay();\n      } else if (!autoplay) {\n        emblaApi.current?.plugins().autoplay?.stop();\n      }\n    },\n    [resetAutoplay],\n  );\n\n  // Listeners contains callbacks for UI elements that may require state update based on embla changes\n  const listeners = React.useRef(new Set<(data: CarouselUpdateData) => void>());\n  const subscribeForValues = React.useCallback((listener: (data: CarouselUpdateData) => void) => {\n    listeners.current.add(listener);\n\n    return () => {\n      listeners.current.delete(listener);\n    };\n  }, []);\n\n  const updateIndex = () => {\n    const newIndex = emblaApi.current?.selectedScrollSnap() ?? 0;\n    const slides = emblaApi.current?.slideNodes();\n    const slideRegistry = emblaApi.current?.internalEngine().slideRegistry;\n    const actualIndex = slideRegistry?.[newIndex]?.[0] ?? 0;\n\n    // We set the first card in the current group as the default tabster index for focus capture\n    slides?.forEach((slide, slideIndex) => {\n      setTabsterDefault(slide, slideIndex === actualIndex);\n    });\n    setActiveIndex(newIndex);\n  };\n\n  const handleReinit = useEventCallback(() => {\n    const nodes: HTMLElement[] = emblaApi.current?.slideNodes() ?? [];\n    const groupIndexList: number[][] = emblaApi.current?.internalEngine().slideRegistry ?? [];\n    const navItemsCount = groupIndexList.length > 0 ? groupIndexList.length : nodes.length;\n    const data: CarouselUpdateData = {\n      navItemsCount,\n      activeIndex: emblaApi.current?.selectedScrollSnap() ?? 0,\n      groupIndexList,\n      slideNodes: nodes,\n    };\n\n    updateIndex();\n    emblaApi.current?.scrollTo(activeIndex, false);\n    for (const listener of listeners.current) {\n      listener(data);\n    }\n  });\n\n  const handleIndexChange: EmblaEventHandler = useEventCallback((_, eventType) => {\n    const newIndex = emblaApi.current?.selectedScrollSnap() ?? 0;\n    updateIndex();\n    if (eventType === 'autoplay:select') {\n      const noopEvent = new Event('autoplay');\n      onAutoplayIndexChange?.(noopEvent, { event: noopEvent, type: 'autoplay', index: newIndex });\n    }\n  });\n\n  const viewportRef: React.RefObject<HTMLDivElement> = React.useRef(null);\n  const containerRef: React.RefObject<HTMLDivElement> = React.useMemo(() => {\n    let currentElement: HTMLDivElement | null = null;\n\n    const handleVisibilityChange = () => {\n      const cardElements = emblaApi.current?.slideNodes();\n      const visibleIndexes = emblaApi.current?.slidesInView() ?? [];\n\n      cardElements?.forEach((cardElement, index) => {\n        cardElement.dispatchEvent(\n          new CustomEvent<CarouselVisibilityEventDetail>(EMBLA_VISIBILITY_EVENT, {\n            bubbles: false,\n            detail: { isVisible: visibleIndexes.includes(index) },\n          }),\n        );\n      });\n    };\n\n    // Get plugins using autoplayRef to prevent state change recreating EmblaCarousel\n    const plugins = getPlugins();\n\n    return {\n      set current(newElement: HTMLDivElement | null) {\n        if (currentElement) {\n          emblaApi.current?.off('slidesInView', handleVisibilityChange);\n          emblaApi.current?.off('select', handleIndexChange);\n          emblaApi.current?.off('reInit', handleReinit);\n          emblaApi.current?.off('autoplay:select', handleIndexChange);\n          emblaApi.current?.destroy();\n        }\n\n        // Use direct viewport if available, else fallback to container (includes Carousel controls).\n        currentElement = viewportRef.current ?? newElement;\n        if (currentElement) {\n          emblaApi.current = EmblaCarousel(\n            currentElement,\n            {\n              ...DEFAULT_EMBLA_OPTIONS,\n              ...emblaOptions.current,\n            },\n            plugins,\n          );\n\n          emblaApi.current?.on('reInit', handleReinit);\n          emblaApi.current?.on('slidesInView', handleVisibilityChange);\n          emblaApi.current?.on('select', handleIndexChange);\n          emblaApi.current?.on('autoplay:select', handleIndexChange);\n        }\n      },\n    };\n  }, [getPlugins, handleIndexChange, handleReinit]);\n\n  const carouselApi = React.useMemo(\n    () => ({\n      scrollToElement: (element: HTMLElement, jump?: boolean) => {\n        const cardElements = emblaApi.current?.slideNodes();\n        const groupIndexList = emblaApi.current?.internalEngine().slideRegistry ?? [];\n        const cardIndex = cardElements?.indexOf(element) ?? 0;\n        const groupIndex = groupIndexList.findIndex(group => {\n          return group.includes(cardIndex);\n        });\n        const indexFocus = groupIndex ?? cardIndex;\n        emblaApi.current?.scrollTo(indexFocus, jump);\n\n        return indexFocus;\n      },\n      scrollToIndex: (index: number, jump?: boolean) => {\n        emblaApi.current?.scrollTo(index, jump);\n      },\n      scrollInDirection: (dir: 'prev' | 'next') => {\n        if (dir === 'prev') {\n          emblaApi.current?.scrollPrev();\n        } else {\n          emblaApi.current?.scrollNext();\n        }\n\n        return emblaApi.current?.selectedScrollSnap() ?? 0;\n      },\n    }),\n    [],\n  );\n\n  React.useEffect(() => {\n    const plugins = getPlugins();\n\n    emblaOptions.current = {\n      startIndex: emblaOptions.current.startIndex,\n      align,\n      direction,\n      loop,\n      slidesToScroll,\n      watchDrag,\n      containScroll,\n      duration: motionDuration,\n    };\n\n    emblaApi.current?.reInit(\n      {\n        ...DEFAULT_EMBLA_OPTIONS,\n        ...emblaOptions.current,\n      },\n      plugins,\n    );\n  }, [align, containScroll, direction, getPlugins, loop, slidesToScroll, watchDrag, motionDuration]);\n\n  React.useEffect(() => {\n    // Scroll to controlled values on update\n    // If active index is out of bounds, re-init will handle instead\n    const currentActiveIndex = emblaApi.current?.selectedScrollSnap() ?? 0;\n    const slideLength = emblaApi.current?.slideNodes()?.length ?? 0;\n    emblaOptions.current.startIndex = activeIndex;\n    if (activeIndex < slideLength && activeIndex !== currentActiveIndex) {\n      emblaApi.current?.scrollTo(activeIndex);\n    }\n  }, [activeIndex]);\n\n  return {\n    activeIndex,\n    carouselApi,\n    viewportRef,\n    containerRef,\n    subscribeForValues,\n    enableAutoplay,\n    resetAutoplay,\n  };\n}\n"],"names":["useControllableState","useEventCallback","EmblaCarousel","React","carouselCardClassNames","carouselSliderClassNames","Autoplay","Fade","pointerEventPlugin","sliderClassname","root","DEFAULT_EMBLA_OPTIONS","containScroll","inViewThreshold","watchDrag","skipSnaps","container","slides","EMBLA_VISIBILITY_EVENT","setTabsterDefault","element","isDefault","tabsterAttr","getAttribute","tabsterAttributes","JSON","parse","focusable","setAttribute","stringify","useEmblaCarousel","options","align","autoplayInterval","direction","loop","slidesToScroll","motion","onDragIndexChange","onAutoplayIndexChange","motionType","kind","motionDuration","duration","activeIndex","setActiveIndex","defaultState","defaultActiveIndex","state","initialState","onDragEvent","event","index","type","emblaOptions","useRef","startIndex","emblaApi","autoplayRef","resetAutoplay","useCallback","current","plugins","autoplay","reset","getPlugins","push","playOnInit","delay","stopOnInteraction","stopOnFocusIn","stopOnMouseEnter","onSelectViaDrag","enableAutoplay","temporary","play","stop","listeners","Set","subscribeForValues","listener","add","delete","updateIndex","slideRegistry","newIndex","selectedScrollSnap","slideNodes","internalEngine","actualIndex","forEach","slide","slideIndex","handleReinit","nodes","groupIndexList","navItemsCount","length","data","scrollTo","handleIndexChange","_","eventType","noopEvent","Event","viewportRef","containerRef","useMemo","currentElement","handleVisibilityChange","cardElements","visibleIndexes","slidesInView","cardElement","dispatchEvent","CustomEvent","bubbles","detail","isVisible","includes","newElement","off","destroy","on","carouselApi","scrollToElement","jump","cardIndex","indexOf","groupIndex","findIndex","group","indexFocus","scrollToIndex","scrollInDirection","dir","scrollPrev","scrollNext","useEffect","reInit","currentActiveIndex","slideLength"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}

package/lib-commonjs/components/Carousel/Carousel.types.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/Carousel/Carousel.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, EventHandler, Slot } from '@fluentui/react-utilities';\nimport type { CarouselContextValue, CarouselIndexChangeData } from '../CarouselContext.types';\n\nexport type CarouselSlots = {\n  root: Slot<'div'>;\n};\n\n/**\n * Children function replacement, passes through updated context index and carousel information for localization\n */\nexport type CarouselAnnouncerFunction = (index: number, totalSlides: number, slideGroupList: number[][]) => string;\n\n/**\n * List of integrated motion types\n */\nexport type CarouselMotion = 'slide' | 'fade';\n\n/**\n * Carousel Props\n */\nexport type CarouselProps = ComponentProps<CarouselSlots> & {\n  /**\n   * The initial page to display in uncontrolled mode.\n   */\n  defaultActiveIndex?: number;\n\n  /**\n   * The alignment of the carousel.\n   */\n  align?: 'center' | 'start' | 'end';\n\n  /**\n   * The value of the currently active page.\n   */\n  activeIndex?: number;\n\n  /**\n   * Callback to notify a page change.\n   */\n  onActiveIndexChange?: EventHandler<CarouselIndexChangeData>;\n\n  /**\n   * Circular enables the carousel to loop back around on navigation past trailing index.\n   */\n  circular?: boolean;\n\n  /**\n   * Controls the number of carousel cards per navigation element, will default to 'auto'\n   * Recommended to set to '1' when using full page carousel cards.\n   */\n  groupSize?: number | 'auto';\n\n  /**\n   * Enables drag to scroll on carousel items.\n   * Defaults to: False\n   */\n  draggable?: boolean;\n\n  /**\n   * Adds whitespace to start/end so that 'align' prop is always respected for current index\n   * Defaults to: False\n   */\n  whitespace?: boolean;\n\n  /**\n   * Sets motion to fade in/out style with minimal movement\n   * Defaults: false\n   */\n  motion?: CarouselMotion;\n\n  /**\n   * Localizes the string used to announce carousel page changes\n   * Defaults to: undefined\n   */\n  announcement?: CarouselAnnouncerFunction;\n};\n\n/**\n * State used in rendering Carousel\n */\nexport type CarouselState = ComponentState<CarouselSlots> & CarouselContextValue;\n\nexport interface CarouselVisibilityEventDetail {\n  isVisible: boolean;\n}\n\nexport type CarouselVisibilityChangeEvent = CustomEvent<CarouselVisibilityEventDetail>;\n\n/**\n * @internal\n */\nexport interface CarouselUpdateData {\n  /**\n   * The current carousel index, a change in index will not trigger the callback (use context index instead).\n   */\n  activeIndex: number;\n  /**\n   * The total number of slides to be navigated, accounts for grouping.\n   */\n  navItemsCount: number;\n  /**\n   * A breakdown of the card indexes contained within each slide index.\n   */\n  groupIndexList: number[][];\n  /**\n   * An array of the card DOM elements after render\n   */\n  slideNodes: HTMLElement[];\n}\n"],"names":[],"rangeMappings":";;","mappings":"AAwFA;;CAEC"}
+{"version":3,"sources":["../src/components/Carousel/Carousel.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, EventHandler, Slot } from '@fluentui/react-utilities';\nimport type { CarouselContextValue, CarouselIndexChangeData } from '../CarouselContext.types';\n\nexport type CarouselSlots = {\n  root: Slot<'div'>;\n};\n\n/**\n * Children function replacement, passes through updated context index and carousel information for localization\n */\nexport type CarouselAnnouncerFunction = (index: number, totalSlides: number, slideGroupList: number[][]) => string;\n\n/**\n * List of integrated motion types\n */\nexport type CarouselMotion = 'slide' | { kind: 'slide'; duration?: number } | 'fade';\n\n/**\n * Carousel Props\n */\nexport type CarouselProps = ComponentProps<CarouselSlots> & {\n  /**\n   * The initial page to display in uncontrolled mode.\n   */\n  defaultActiveIndex?: number;\n\n  /**\n   * The alignment of the carousel.\n   */\n  align?: 'center' | 'start' | 'end';\n\n  /**\n   * The value of the currently active page.\n   */\n  activeIndex?: number;\n\n  /**\n   * Callback to notify a page change.\n   */\n  onActiveIndexChange?: EventHandler<CarouselIndexChangeData>;\n\n  /**\n   * Circular enables the carousel to loop back around on navigation past trailing index.\n   */\n  circular?: boolean;\n\n  /**\n   * Controls the number of carousel cards per navigation element, will default to 'auto'\n   * Recommended to set to '1' when using full page carousel cards.\n   */\n  groupSize?: number | 'auto';\n\n  /**\n   * Enables drag to scroll on carousel items.\n   * Defaults to: False\n   */\n  draggable?: boolean;\n\n  /**\n   * Adds whitespace to start/end so that 'align' prop is always respected for current index\n   * Defaults to: False\n   */\n  whitespace?: boolean;\n\n  /**\n   * Sets motion type as either 'slide' or 'fade'\n   * Defaults: 'slide'\n   *\n   * Users can also pass 'slide' & duration via CarouselMotion object to control carousel speed.\n   * Drag interactions are not affected because duration is then determined by the drag force.\n   *\n   * Note: Duration is not in milliseconds because Carousel uses an\n   * attraction physics simulation when scrolling instead of easings.\n   * Only values between 20-60 are recommended, 25 is the default.\n   */\n  motion?: CarouselMotion;\n\n  /**\n   * Localizes the string used to announce carousel page changes\n   * Defaults to: undefined\n   */\n  announcement?: CarouselAnnouncerFunction;\n\n  /**\n   * Choose a delay between autoplay transitions in milliseconds.\n   * Only active if Autoplay is enabled via CarouselAutoplayButton\n   *\n   * Defaults: 4000\n   */\n  autoplayInterval?: number;\n};\n\n/**\n * State used in rendering Carousel\n */\nexport type CarouselState = ComponentState<CarouselSlots> & CarouselContextValue;\n\nexport interface CarouselVisibilityEventDetail {\n  isVisible: boolean;\n}\n\nexport type CarouselVisibilityChangeEvent = CustomEvent<CarouselVisibilityEventDetail>;\n\n/**\n * @internal\n */\nexport interface CarouselUpdateData {\n  /**\n   * The current carousel index, a change in index will not trigger the callback (use context index instead).\n   */\n  activeIndex: number;\n  /**\n   * The total number of slides to be navigated, accounts for grouping.\n   */\n  navItemsCount: number;\n  /**\n   * A breakdown of the card indexes contained within each slide index.\n   */\n  groupIndexList: number[][];\n  /**\n   * An array of the card DOM elements after render\n   */\n  slideNodes: HTMLElement[];\n}\n"],"names":[],"rangeMappings":";;","mappings":"AAuGA;;CAEC"}

package/lib-commonjs/components/Carousel/useCarousel.js

@@ -15,7 +15,7 @@ const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
 const _useEmblaCarousel = require("../useEmblaCarousel");
 function useCarousel_unstable(props, ref) {
     'use no memo';
-    const { align = 'center', circular = false, onActiveIndexChange, groupSize = 'auto', draggable = false, whitespace = false, announcement, motion = 'slide' } = props;
+    const { align = 'center', circular = false, onActiveIndexChange, groupSize = 'auto', draggable = false, whitespace = false, announcement, motion = 'slide', autoplayInterval = 4000 } = props;
     const { dir } = (0, _reactsharedcontexts.useFluent_unstable)();
     const { activeIndex, carouselApi, containerRef, viewportRef, subscribeForValues, enableAutoplay, resetAutoplay } = (0, _useEmblaCarousel.useEmblaCarousel)({
         align,
@@ -28,7 +28,8 @@ function useCarousel_unstable(props, ref) {
         containScroll: whitespace ? false : 'keepSnaps',
         motion,
         onDragIndexChange: onActiveIndexChange,
-        onAutoplayIndexChange: onActiveIndexChange
+        onAutoplayIndexChange: onActiveIndexChange,
+        autoplayInterval
     });
     const selectPageByElement = (0, _reactutilities.useEventCallback)((event, element, jump)=>{
         const foundIndex = carouselApi.scrollToElement(element, jump);

package/lib-commonjs/components/Carousel/useCarousel.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/Carousel/useCarousel.ts"],"sourcesContent":["import { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport {\n  getIntrinsicElementProps,\n  slot,\n  useEventCallback,\n  useIsomorphicLayoutEffect,\n  useMergedRefs,\n} from '@fluentui/react-utilities';\nimport * as React from 'react';\n\nimport type { CarouselProps, CarouselState } from './Carousel.types';\nimport type { CarouselContextValue } from '../CarouselContext.types';\nimport { useEmblaCarousel } from '../useEmblaCarousel';\nimport { useAnnounce } from '@fluentui/react-shared-contexts';\n\n/**\n * Create the state required to render Carousel.\n *\n * The returned state can be modified with hooks such as useCarouselStyles_unstable,\n * before being passed to renderCarousel_unstable.\n *\n * @param props - props from this instance of Carousel\n * @param ref - reference to root HTMLDivElement of Carousel\n */\nexport function useCarousel_unstable(props: CarouselProps, ref: React.Ref<HTMLDivElement>): CarouselState {\n  'use no memo';\n\n  const {\n    align = 'center',\n    circular = false,\n    onActiveIndexChange,\n    groupSize = 'auto',\n    draggable = false,\n    whitespace = false,\n    announcement,\n    motion = 'slide',\n  } = props;\n\n  const { dir } = useFluent();\n  const { activeIndex, carouselApi, containerRef, viewportRef, subscribeForValues, enableAutoplay, resetAutoplay } =\n    useEmblaCarousel({\n      align,\n      direction: dir,\n      loop: circular,\n      slidesToScroll: groupSize,\n      defaultActiveIndex: props.defaultActiveIndex,\n      activeIndex: props.activeIndex,\n      watchDrag: draggable,\n      containScroll: whitespace ? false : 'keepSnaps',\n      motion,\n      onDragIndexChange: onActiveIndexChange,\n      onAutoplayIndexChange: onActiveIndexChange,\n    });\n\n  const selectPageByElement: CarouselContextValue['selectPageByElement'] = useEventCallback((event, element, jump) => {\n    const foundIndex = carouselApi.scrollToElement(element, jump);\n    onActiveIndexChange?.(event, { event, type: 'focus', index: foundIndex });\n\n    return foundIndex;\n  });\n\n  const selectPageByIndex: CarouselContextValue['selectPageByIndex'] = useEventCallback((event, index, jump) => {\n    carouselApi.scrollToIndex(index, jump);\n\n    onActiveIndexChange?.(event, { event, type: 'click', index });\n  });\n\n  const selectPageByDirection: CarouselContextValue['selectPageByDirection'] = useEventCallback((event, direction) => {\n    const nextPageIndex = carouselApi.scrollInDirection(direction);\n    onActiveIndexChange?.(event, { event, type: 'click', index: nextPageIndex });\n\n    return nextPageIndex;\n  });\n\n  const mergedContainerRef = useMergedRefs(ref, containerRef);\n\n  // Announce carousel updates\n  const announcementTextRef = React.useRef<string>('');\n  const totalNavLength = React.useRef<number>(0);\n  const navGroupRef = React.useRef<number[][]>([]);\n\n  const { announce } = useAnnounce();\n\n  const updateAnnouncement = useEventCallback(() => {\n    if (totalNavLength.current <= 0 || !announcement) {\n      // Ignore announcements until slides discovered\n      return;\n    }\n\n    const announcementText = announcement(activeIndex, totalNavLength.current, navGroupRef.current);\n\n    if (announcementText !== announcementTextRef.current) {\n      announcementTextRef.current = announcementText;\n      announce(announcementText, { polite: true });\n    }\n  });\n\n  useIsomorphicLayoutEffect(() => {\n    // Subscribe to any non-index carousel state changes\n    return subscribeForValues(data => {\n      if (totalNavLength.current <= 0 && data.navItemsCount > 0 && announcement) {\n        const announcementText = announcement(data.activeIndex, data.navItemsCount, data.groupIndexList);\n        // Initialize our string to prevent updateAnnouncement from reading an initial load\n        announcementTextRef.current = announcementText;\n      }\n      totalNavLength.current = data.navItemsCount;\n      navGroupRef.current = data.groupIndexList;\n      updateAnnouncement();\n    });\n  }, [subscribeForValues, updateAnnouncement, announcement]);\n\n  useIsomorphicLayoutEffect(() => {\n    updateAnnouncement();\n  }, [activeIndex, updateAnnouncement]);\n\n  return {\n    components: {\n      root: 'div',\n    },\n    root: slot.always(\n      getIntrinsicElementProps('div', {\n        ref: mergedContainerRef,\n        role: 'region',\n        ...props,\n      }),\n      { elementType: 'div' },\n    ),\n\n    activeIndex,\n    circular,\n    containerRef: mergedContainerRef,\n    viewportRef,\n    selectPageByElement,\n    selectPageByDirection,\n    selectPageByIndex,\n    subscribeForValues,\n    enableAutoplay,\n    resetAutoplay,\n  };\n}\n"],"names":["useCarousel_unstable","props","ref","align","circular","onActiveIndexChange","groupSize","draggable","whitespace","announcement","motion","dir","useFluent","activeIndex","carouselApi","containerRef","viewportRef","subscribeForValues","enableAutoplay","resetAutoplay","useEmblaCarousel","direction","loop","slidesToScroll","defaultActiveIndex","watchDrag","containScroll","onDragIndexChange","onAutoplayIndexChange","selectPageByElement","useEventCallback","event","element","jump","foundIndex","scrollToElement","type","index","selectPageByIndex","scrollToIndex","selectPageByDirection","nextPageIndex","scrollInDirection","mergedContainerRef","useMergedRefs","announcementTextRef","React","useRef","totalNavLength","navGroupRef","announce","useAnnounce","updateAnnouncement","current","announcementText","polite","useIsomorphicLayoutEffect","data","navItemsCount","groupIndexList","components","root","slot","always","getIntrinsicElementProps","role","elementType"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
+{"version":3,"sources":["../src/components/Carousel/useCarousel.ts"],"sourcesContent":["import { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport {\n  getIntrinsicElementProps,\n  slot,\n  useEventCallback,\n  useIsomorphicLayoutEffect,\n  useMergedRefs,\n} from '@fluentui/react-utilities';\nimport * as React from 'react';\n\nimport type { CarouselProps, CarouselState } from './Carousel.types';\nimport type { CarouselContextValue } from '../CarouselContext.types';\nimport { useEmblaCarousel } from '../useEmblaCarousel';\nimport { useAnnounce } from '@fluentui/react-shared-contexts';\n\n/**\n * Create the state required to render Carousel.\n *\n * The returned state can be modified with hooks such as useCarouselStyles_unstable,\n * before being passed to renderCarousel_unstable.\n *\n * @param props - props from this instance of Carousel\n * @param ref - reference to root HTMLDivElement of Carousel\n */\nexport function useCarousel_unstable(props: CarouselProps, ref: React.Ref<HTMLDivElement>): CarouselState {\n  'use no memo';\n\n  const {\n    align = 'center',\n    circular = false,\n    onActiveIndexChange,\n    groupSize = 'auto',\n    draggable = false,\n    whitespace = false,\n    announcement,\n    motion = 'slide',\n    autoplayInterval = 4000,\n  } = props;\n\n  const { dir } = useFluent();\n  const { activeIndex, carouselApi, containerRef, viewportRef, subscribeForValues, enableAutoplay, resetAutoplay } =\n    useEmblaCarousel({\n      align,\n      direction: dir,\n      loop: circular,\n      slidesToScroll: groupSize,\n      defaultActiveIndex: props.defaultActiveIndex,\n      activeIndex: props.activeIndex,\n      watchDrag: draggable,\n      containScroll: whitespace ? false : 'keepSnaps',\n      motion,\n      onDragIndexChange: onActiveIndexChange,\n      onAutoplayIndexChange: onActiveIndexChange,\n      autoplayInterval,\n    });\n\n  const selectPageByElement: CarouselContextValue['selectPageByElement'] = useEventCallback((event, element, jump) => {\n    const foundIndex = carouselApi.scrollToElement(element, jump);\n    onActiveIndexChange?.(event, { event, type: 'focus', index: foundIndex });\n\n    return foundIndex;\n  });\n\n  const selectPageByIndex: CarouselContextValue['selectPageByIndex'] = useEventCallback((event, index, jump) => {\n    carouselApi.scrollToIndex(index, jump);\n\n    onActiveIndexChange?.(event, { event, type: 'click', index });\n  });\n\n  const selectPageByDirection: CarouselContextValue['selectPageByDirection'] = useEventCallback((event, direction) => {\n    const nextPageIndex = carouselApi.scrollInDirection(direction);\n    onActiveIndexChange?.(event, { event, type: 'click', index: nextPageIndex });\n\n    return nextPageIndex;\n  });\n\n  const mergedContainerRef = useMergedRefs(ref, containerRef);\n\n  // Announce carousel updates\n  const announcementTextRef = React.useRef<string>('');\n  const totalNavLength = React.useRef<number>(0);\n  const navGroupRef = React.useRef<number[][]>([]);\n\n  const { announce } = useAnnounce();\n\n  const updateAnnouncement = useEventCallback(() => {\n    if (totalNavLength.current <= 0 || !announcement) {\n      // Ignore announcements until slides discovered\n      return;\n    }\n\n    const announcementText = announcement(activeIndex, totalNavLength.current, navGroupRef.current);\n\n    if (announcementText !== announcementTextRef.current) {\n      announcementTextRef.current = announcementText;\n      announce(announcementText, { polite: true });\n    }\n  });\n\n  useIsomorphicLayoutEffect(() => {\n    // Subscribe to any non-index carousel state changes\n    return subscribeForValues(data => {\n      if (totalNavLength.current <= 0 && data.navItemsCount > 0 && announcement) {\n        const announcementText = announcement(data.activeIndex, data.navItemsCount, data.groupIndexList);\n        // Initialize our string to prevent updateAnnouncement from reading an initial load\n        announcementTextRef.current = announcementText;\n      }\n      totalNavLength.current = data.navItemsCount;\n      navGroupRef.current = data.groupIndexList;\n      updateAnnouncement();\n    });\n  }, [subscribeForValues, updateAnnouncement, announcement]);\n\n  useIsomorphicLayoutEffect(() => {\n    updateAnnouncement();\n  }, [activeIndex, updateAnnouncement]);\n\n  return {\n    components: {\n      root: 'div',\n    },\n    root: slot.always(\n      getIntrinsicElementProps('div', {\n        ref: mergedContainerRef,\n        role: 'region',\n        ...props,\n      }),\n      { elementType: 'div' },\n    ),\n\n    activeIndex,\n    circular,\n    containerRef: mergedContainerRef,\n    viewportRef,\n    selectPageByElement,\n    selectPageByDirection,\n    selectPageByIndex,\n    subscribeForValues,\n    enableAutoplay,\n    resetAutoplay,\n  };\n}\n"],"names":["useCarousel_unstable","props","ref","align","circular","onActiveIndexChange","groupSize","draggable","whitespace","announcement","motion","autoplayInterval","dir","useFluent","activeIndex","carouselApi","containerRef","viewportRef","subscribeForValues","enableAutoplay","resetAutoplay","useEmblaCarousel","direction","loop","slidesToScroll","defaultActiveIndex","watchDrag","containScroll","onDragIndexChange","onAutoplayIndexChange","selectPageByElement","useEventCallback","event","element","jump","foundIndex","scrollToElement","type","index","selectPageByIndex","scrollToIndex","selectPageByDirection","nextPageIndex","scrollInDirection","mergedContainerRef","useMergedRefs","announcementTextRef","React","useRef","totalNavLength","navGroupRef","announce","useAnnounce","updateAnnouncement","current","announcementText","polite","useIsomorphicLayoutEffect","data","navItemsCount","groupIndexList","components","root","slot","always","getIntrinsicElementProps","role","elementType"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}

package/lib-commonjs/components/useEmblaCarousel.js

@@ -51,7 +51,11 @@ function setTabsterDefault(element, isDefault) {
     }
 }
 function useEmblaCarousel(options) {
-    const { align, direction, loop, slidesToScroll, watchDrag, containScroll, motion, onDragIndexChange, onAutoplayIndexChange } = options;
+    const { align, autoplayInterval, direction, loop, slidesToScroll, watchDrag, containScroll, motion, onDragIndexChange, onAutoplayIndexChange } = options;
+    var _motion_kind;
+    const motionType = typeof motion === 'string' ? motion : (_motion_kind = motion === null || motion === void 0 ? void 0 : motion.kind) !== null && _motion_kind !== void 0 ? _motion_kind : 'slide';
+    var _motion_duration;
+    const motionDuration = typeof motion === 'string' ? 25 : (_motion_duration = motion === null || motion === void 0 ? void 0 : motion.duration) !== null && _motion_duration !== void 0 ? _motion_duration : 25;
     const [activeIndex, setActiveIndex] = (0, _reactutilities.useControllableState)({
         defaultState: options.defaultActiveIndex,
         state: options.activeIndex,
@@ -71,7 +75,8 @@ function useEmblaCarousel(options) {
         slidesToScroll,
         startIndex: activeIndex,
         watchDrag,
-        containScroll
+        containScroll,
+        duration: motionDuration
     });
     const emblaApi = _react.useRef(null);
     const autoplayRef = _react.useRef(false);
@@ -83,12 +88,13 @@ function useEmblaCarousel(options) {
         const plugins = [];
         plugins.push((0, _emblacarouselautoplay.default)({
             playOnInit: autoplayRef.current,
+            delay: autoplayInterval,
             /* stopOnInteraction: false causes autoplay to restart on interaction end*/ /* we'll handle this logic to ensure autoplay state is respected */ stopOnInteraction: true,
             stopOnFocusIn: false,
             stopOnMouseEnter: false
         }));
         // Optionally add Fade plugin
-        if (motion === 'fade') {
+        if (motionType === 'fade') {
             plugins.push((0, _emblacarouselfade.default)());
         }
         if (watchDrag) {
@@ -98,9 +104,10 @@ function useEmblaCarousel(options) {
         }
         return plugins;
     }, [
-        motion,
+        motionType,
         onDragEvent,
-        watchDrag
+        watchDrag,
+        autoplayInterval
     ]);
     /* This function enables autoplay to pause/play without affecting underlying state
    * Useful for pausing on focus etc. without having to reinitialize or set autoplay to off
@@ -268,7 +275,8 @@ function useEmblaCarousel(options) {
             loop,
             slidesToScroll,
             watchDrag,
-            containScroll
+            containScroll,
+            duration: motionDuration
         };
         (_emblaApi_current = emblaApi.current) === null || _emblaApi_current === void 0 ? void 0 : _emblaApi_current.reInit({
             ...DEFAULT_EMBLA_OPTIONS,
@@ -281,7 +289,8 @@ function useEmblaCarousel(options) {
         getPlugins,
         loop,
         slidesToScroll,
-        watchDrag
+        watchDrag,
+        motionDuration
     ]);
     _react.useEffect(()=>{
         var _emblaApi_current, _emblaApi_current_slideNodes, _emblaApi_current1;

package/lib-commonjs/components/useEmblaCarousel.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/useEmblaCarousel.ts"],"sourcesContent":["import { type EventHandler, useControllableState, useEventCallback } from '@fluentui/react-utilities';\nimport EmblaCarousel, { EmblaPluginType, type EmblaCarouselType, type EmblaOptionsType } from 'embla-carousel';\nimport * as React from 'react';\n\nimport { carouselCardClassNames } from './CarouselCard/useCarouselCardStyles.styles';\nimport { carouselSliderClassNames } from './CarouselSlider/useCarouselSliderStyles.styles';\nimport { CarouselMotion, CarouselUpdateData, CarouselVisibilityEventDetail } from '../Carousel';\nimport Autoplay from 'embla-carousel-autoplay';\nimport Fade from 'embla-carousel-fade';\nimport { pointerEventPlugin } from './pointerEvents';\nimport type { CarouselIndexChangeData } from './CarouselContext.types';\n\ntype EmblaEventHandler = Parameters<EmblaCarouselType['on']>[1];\n\nconst sliderClassname = `.${carouselSliderClassNames.root}`;\n\nconst DEFAULT_EMBLA_OPTIONS: EmblaOptionsType = {\n  containScroll: 'trimSnaps',\n  inViewThreshold: 0.99,\n  watchDrag: false,\n  skipSnaps: true,\n\n  container: sliderClassname,\n  slides: `.${carouselCardClassNames.root}`,\n};\n\nexport const EMBLA_VISIBILITY_EVENT = 'embla:visibilitychange';\n\nexport function setTabsterDefault(element: Element, isDefault: boolean) {\n  const tabsterAttr = element.getAttribute('data-tabster');\n\n  if (tabsterAttr) {\n    const tabsterAttributes = JSON.parse(tabsterAttr);\n    if (tabsterAttributes.focusable) {\n      // If tabster.focusable isn't present, we will ignore.\n      tabsterAttributes.focusable.isDefault = isDefault;\n      element.setAttribute('data-tabster', JSON.stringify(tabsterAttributes));\n    }\n  }\n}\n\nexport function useEmblaCarousel(\n  options: Pick<EmblaOptionsType, 'align' | 'direction' | 'loop' | 'slidesToScroll' | 'watchDrag' | 'containScroll'> & {\n    defaultActiveIndex: number | undefined;\n    activeIndex: number | undefined;\n    motion?: CarouselMotion;\n    onDragIndexChange?: EventHandler<CarouselIndexChangeData>;\n    onAutoplayIndexChange?: EventHandler<CarouselIndexChangeData>;\n  },\n) {\n  const {\n    align,\n    direction,\n    loop,\n    slidesToScroll,\n    watchDrag,\n    containScroll,\n    motion,\n    onDragIndexChange,\n    onAutoplayIndexChange,\n  } = options;\n  const [activeIndex, setActiveIndex] = useControllableState({\n    defaultState: options.defaultActiveIndex,\n    state: options.activeIndex,\n    initialState: 0,\n  });\n\n  const onDragEvent = useEventCallback((event: PointerEvent | MouseEvent, index: number) => {\n    onDragIndexChange?.(event, { event, type: 'drag', index });\n  });\n\n  const emblaOptions = React.useRef<EmblaOptionsType>({\n    align,\n    direction,\n    loop,\n    slidesToScroll,\n    startIndex: activeIndex,\n    watchDrag,\n    containScroll,\n  });\n\n  const emblaApi = React.useRef<EmblaCarouselType | null>(null);\n  const autoplayRef = React.useRef<boolean>(false);\n\n  const resetAutoplay = React.useCallback(() => {\n    emblaApi.current?.plugins().autoplay?.reset();\n  }, []);\n\n  const getPlugins = React.useCallback(() => {\n    const plugins: EmblaPluginType[] = [];\n\n    plugins.push(\n      Autoplay({\n        playOnInit: autoplayRef.current,\n        /* stopOnInteraction: false causes autoplay to restart on interaction end*/\n        /* we'll handle this logic to ensure autoplay state is respected */\n        stopOnInteraction: true,\n        stopOnFocusIn: false, // We'll handle this one manually to prevent conflicts with tabster\n        stopOnMouseEnter: false, // We will handle this manually to align functionality\n      }),\n    );\n\n    // Optionally add Fade plugin\n    if (motion === 'fade') {\n      plugins.push(Fade());\n    }\n\n    if (watchDrag) {\n      plugins.push(\n        pointerEventPlugin({\n          onSelectViaDrag: onDragEvent,\n        }),\n      );\n    }\n\n    return plugins;\n  }, [motion, onDragEvent, watchDrag]);\n\n  /* This function enables autoplay to pause/play without affecting underlying state\n   * Useful for pausing on focus etc. without having to reinitialize or set autoplay to off\n   */\n  const enableAutoplay = React.useCallback(\n    (autoplay: boolean, temporary?: boolean) => {\n      if (!temporary) {\n        autoplayRef.current = autoplay;\n      }\n\n      if (autoplay && autoplayRef.current) {\n        // Autoplay should only enable in the case where underlying state is true, temporary should not override\n        emblaApi.current?.plugins().autoplay?.play();\n        // Reset after play to ensure timing and any focus/mouse pause state is reset.\n        resetAutoplay();\n      } else if (!autoplay) {\n        emblaApi.current?.plugins().autoplay?.stop();\n      }\n    },\n    [resetAutoplay],\n  );\n\n  // Listeners contains callbacks for UI elements that may require state update based on embla changes\n  const listeners = React.useRef(new Set<(data: CarouselUpdateData) => void>());\n  const subscribeForValues = React.useCallback((listener: (data: CarouselUpdateData) => void) => {\n    listeners.current.add(listener);\n\n    return () => {\n      listeners.current.delete(listener);\n    };\n  }, []);\n\n  const updateIndex = () => {\n    const newIndex = emblaApi.current?.selectedScrollSnap() ?? 0;\n    const slides = emblaApi.current?.slideNodes();\n    const slideRegistry = emblaApi.current?.internalEngine().slideRegistry;\n    const actualIndex = slideRegistry?.[newIndex]?.[0] ?? 0;\n\n    // We set the first card in the current group as the default tabster index for focus capture\n    slides?.forEach((slide, slideIndex) => {\n      setTabsterDefault(slide, slideIndex === actualIndex);\n    });\n    setActiveIndex(newIndex);\n  };\n\n  const handleReinit = useEventCallback(() => {\n    const nodes: HTMLElement[] = emblaApi.current?.slideNodes() ?? [];\n    const groupIndexList: number[][] = emblaApi.current?.internalEngine().slideRegistry ?? [];\n    const navItemsCount = groupIndexList.length > 0 ? groupIndexList.length : nodes.length;\n    const data: CarouselUpdateData = {\n      navItemsCount,\n      activeIndex: emblaApi.current?.selectedScrollSnap() ?? 0,\n      groupIndexList,\n      slideNodes: nodes,\n    };\n\n    updateIndex();\n    emblaApi.current?.scrollTo(activeIndex, false);\n    for (const listener of listeners.current) {\n      listener(data);\n    }\n  });\n\n  const handleIndexChange: EmblaEventHandler = useEventCallback((_, eventType) => {\n    const newIndex = emblaApi.current?.selectedScrollSnap() ?? 0;\n    updateIndex();\n    if (eventType === 'autoplay:select') {\n      const noopEvent = new Event('autoplay');\n      onAutoplayIndexChange?.(noopEvent, { event: noopEvent, type: 'autoplay', index: newIndex });\n    }\n  });\n\n  const viewportRef: React.RefObject<HTMLDivElement> = React.useRef(null);\n  const containerRef: React.RefObject<HTMLDivElement> = React.useMemo(() => {\n    let currentElement: HTMLDivElement | null = null;\n\n    const handleVisibilityChange = () => {\n      const cardElements = emblaApi.current?.slideNodes();\n      const visibleIndexes = emblaApi.current?.slidesInView() ?? [];\n\n      cardElements?.forEach((cardElement, index) => {\n        cardElement.dispatchEvent(\n          new CustomEvent<CarouselVisibilityEventDetail>(EMBLA_VISIBILITY_EVENT, {\n            bubbles: false,\n            detail: { isVisible: visibleIndexes.includes(index) },\n          }),\n        );\n      });\n    };\n\n    // Get plugins using autoplayRef to prevent state change recreating EmblaCarousel\n    const plugins = getPlugins();\n\n    return {\n      set current(newElement: HTMLDivElement | null) {\n        if (currentElement) {\n          emblaApi.current?.off('slidesInView', handleVisibilityChange);\n          emblaApi.current?.off('select', handleIndexChange);\n          emblaApi.current?.off('reInit', handleReinit);\n          emblaApi.current?.off('autoplay:select', handleIndexChange);\n          emblaApi.current?.destroy();\n        }\n\n        // Use direct viewport if available, else fallback to container (includes Carousel controls).\n        currentElement = viewportRef.current ?? newElement;\n        if (currentElement) {\n          emblaApi.current = EmblaCarousel(\n            currentElement,\n            {\n              ...DEFAULT_EMBLA_OPTIONS,\n              ...emblaOptions.current,\n            },\n            plugins,\n          );\n\n          emblaApi.current?.on('reInit', handleReinit);\n          emblaApi.current?.on('slidesInView', handleVisibilityChange);\n          emblaApi.current?.on('select', handleIndexChange);\n          emblaApi.current?.on('autoplay:select', handleIndexChange);\n        }\n      },\n    };\n  }, [getPlugins, handleIndexChange, handleReinit]);\n\n  const carouselApi = React.useMemo(\n    () => ({\n      scrollToElement: (element: HTMLElement, jump?: boolean) => {\n        const cardElements = emblaApi.current?.slideNodes();\n        const groupIndexList = emblaApi.current?.internalEngine().slideRegistry ?? [];\n        const cardIndex = cardElements?.indexOf(element) ?? 0;\n        const groupIndex = groupIndexList.findIndex(group => {\n          return group.includes(cardIndex);\n        });\n        const indexFocus = groupIndex ?? cardIndex;\n        emblaApi.current?.scrollTo(indexFocus, jump);\n\n        return indexFocus;\n      },\n      scrollToIndex: (index: number, jump?: boolean) => {\n        emblaApi.current?.scrollTo(index, jump);\n      },\n      scrollInDirection: (dir: 'prev' | 'next') => {\n        if (dir === 'prev') {\n          emblaApi.current?.scrollPrev();\n        } else {\n          emblaApi.current?.scrollNext();\n        }\n\n        return emblaApi.current?.selectedScrollSnap() ?? 0;\n      },\n    }),\n    [],\n  );\n\n  React.useEffect(() => {\n    const plugins = getPlugins();\n\n    emblaOptions.current = {\n      startIndex: emblaOptions.current.startIndex,\n      align,\n      direction,\n      loop,\n      slidesToScroll,\n      watchDrag,\n      containScroll,\n    };\n\n    emblaApi.current?.reInit(\n      {\n        ...DEFAULT_EMBLA_OPTIONS,\n        ...emblaOptions.current,\n      },\n      plugins,\n    );\n  }, [align, containScroll, direction, getPlugins, loop, slidesToScroll, watchDrag]);\n\n  React.useEffect(() => {\n    // Scroll to controlled values on update\n    // If active index is out of bounds, re-init will handle instead\n    const currentActiveIndex = emblaApi.current?.selectedScrollSnap() ?? 0;\n    const slideLength = emblaApi.current?.slideNodes()?.length ?? 0;\n    emblaOptions.current.startIndex = activeIndex;\n    if (activeIndex < slideLength && activeIndex !== currentActiveIndex) {\n      emblaApi.current?.scrollTo(activeIndex);\n    }\n  }, [activeIndex]);\n\n  return {\n    activeIndex,\n    carouselApi,\n    viewportRef,\n    containerRef,\n    subscribeForValues,\n    enableAutoplay,\n    resetAutoplay,\n  };\n}\n"],"names":["EMBLA_VISIBILITY_EVENT","setTabsterDefault","useEmblaCarousel","sliderClassname","carouselSliderClassNames","root","DEFAULT_EMBLA_OPTIONS","containScroll","inViewThreshold","watchDrag","skipSnaps","container","slides","carouselCardClassNames","element","isDefault","tabsterAttr","getAttribute","tabsterAttributes","JSON","parse","focusable","setAttribute","stringify","options","align","direction","loop","slidesToScroll","motion","onDragIndexChange","onAutoplayIndexChange","activeIndex","setActiveIndex","useControllableState","defaultState","defaultActiveIndex","state","initialState","onDragEvent","useEventCallback","event","index","type","emblaOptions","React","useRef","startIndex","emblaApi","autoplayRef","resetAutoplay","useCallback","current","plugins","autoplay","reset","getPlugins","push","Autoplay","playOnInit","stopOnInteraction","stopOnFocusIn","stopOnMouseEnter","Fade","pointerEventPlugin","onSelectViaDrag","enableAutoplay","temporary","play","stop","listeners","Set","subscribeForValues","listener","add","delete","updateIndex","slideRegistry","newIndex","selectedScrollSnap","slideNodes","internalEngine","actualIndex","forEach","slide","slideIndex","handleReinit","nodes","groupIndexList","navItemsCount","length","data","scrollTo","handleIndexChange","_","eventType","noopEvent","Event","viewportRef","containerRef","useMemo","currentElement","handleVisibilityChange","cardElements","visibleIndexes","slidesInView","cardElement","dispatchEvent","CustomEvent","bubbles","detail","isVisible","includes","newElement","off","destroy","EmblaCarousel","on","carouselApi","scrollToElement","jump","cardIndex","indexOf","groupIndex","findIndex","group","indexFocus","scrollToIndex","scrollInDirection","dir","scrollPrev","scrollNext","useEffect","reInit","currentActiveIndex","slideLength"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
+{"version":3,"sources":["../src/components/useEmblaCarousel.ts"],"sourcesContent":["import { type EventHandler, useControllableState, useEventCallback } from '@fluentui/react-utilities';\nimport EmblaCarousel, { EmblaPluginType, type EmblaCarouselType, type EmblaOptionsType } from 'embla-carousel';\nimport * as React from 'react';\n\nimport { carouselCardClassNames } from './CarouselCard/useCarouselCardStyles.styles';\nimport { carouselSliderClassNames } from './CarouselSlider/useCarouselSliderStyles.styles';\nimport { CarouselMotion, CarouselUpdateData, CarouselVisibilityEventDetail } from '../Carousel';\nimport Autoplay from 'embla-carousel-autoplay';\nimport Fade from 'embla-carousel-fade';\nimport { pointerEventPlugin } from './pointerEvents';\nimport type { CarouselIndexChangeData } from './CarouselContext.types';\n\ntype EmblaEventHandler = Parameters<EmblaCarouselType['on']>[1];\n\nconst sliderClassname = `.${carouselSliderClassNames.root}`;\n\nconst DEFAULT_EMBLA_OPTIONS: EmblaOptionsType = {\n  containScroll: 'trimSnaps',\n  inViewThreshold: 0.99,\n  watchDrag: false,\n  skipSnaps: true,\n\n  container: sliderClassname,\n  slides: `.${carouselCardClassNames.root}`,\n};\n\nexport const EMBLA_VISIBILITY_EVENT = 'embla:visibilitychange';\n\nexport function setTabsterDefault(element: Element, isDefault: boolean) {\n  const tabsterAttr = element.getAttribute('data-tabster');\n\n  if (tabsterAttr) {\n    const tabsterAttributes = JSON.parse(tabsterAttr);\n    if (tabsterAttributes.focusable) {\n      // If tabster.focusable isn't present, we will ignore.\n      tabsterAttributes.focusable.isDefault = isDefault;\n      element.setAttribute('data-tabster', JSON.stringify(tabsterAttributes));\n    }\n  }\n}\n\nexport function useEmblaCarousel(\n  options: Pick<EmblaOptionsType, 'align' | 'direction' | 'loop' | 'slidesToScroll' | 'watchDrag' | 'containScroll'> & {\n    defaultActiveIndex: number | undefined;\n    activeIndex: number | undefined;\n    motion?: CarouselMotion;\n    onDragIndexChange?: EventHandler<CarouselIndexChangeData>;\n    onAutoplayIndexChange?: EventHandler<CarouselIndexChangeData>;\n    autoplayInterval?: number;\n  },\n) {\n  const {\n    align,\n    autoplayInterval,\n    direction,\n    loop,\n    slidesToScroll,\n    watchDrag,\n    containScroll,\n    motion,\n    onDragIndexChange,\n    onAutoplayIndexChange,\n  } = options;\n\n  const motionType = typeof motion === 'string' ? motion : motion?.kind ?? 'slide';\n  const motionDuration = typeof motion === 'string' ? 25 : motion?.duration ?? 25;\n\n  const [activeIndex, setActiveIndex] = useControllableState({\n    defaultState: options.defaultActiveIndex,\n    state: options.activeIndex,\n    initialState: 0,\n  });\n\n  const onDragEvent = useEventCallback((event: PointerEvent | MouseEvent, index: number) => {\n    onDragIndexChange?.(event, { event, type: 'drag', index });\n  });\n\n  const emblaOptions = React.useRef<EmblaOptionsType>({\n    align,\n    direction,\n    loop,\n    slidesToScroll,\n    startIndex: activeIndex,\n    watchDrag,\n    containScroll,\n    duration: motionDuration,\n  });\n\n  const emblaApi = React.useRef<EmblaCarouselType | null>(null);\n  const autoplayRef = React.useRef<boolean>(false);\n\n  const resetAutoplay = React.useCallback(() => {\n    emblaApi.current?.plugins().autoplay?.reset();\n  }, []);\n\n  const getPlugins = React.useCallback(() => {\n    const plugins: EmblaPluginType[] = [];\n\n    plugins.push(\n      Autoplay({\n        playOnInit: autoplayRef.current,\n        delay: autoplayInterval,\n        /* stopOnInteraction: false causes autoplay to restart on interaction end*/\n        /* we'll handle this logic to ensure autoplay state is respected */\n        stopOnInteraction: true,\n        stopOnFocusIn: false, // We'll handle this one manually to prevent conflicts with tabster\n        stopOnMouseEnter: false, // We will handle this manually to align functionality\n      }),\n    );\n\n    // Optionally add Fade plugin\n    if (motionType === 'fade') {\n      plugins.push(Fade());\n    }\n\n    if (watchDrag) {\n      plugins.push(\n        pointerEventPlugin({\n          onSelectViaDrag: onDragEvent,\n        }),\n      );\n    }\n\n    return plugins;\n  }, [motionType, onDragEvent, watchDrag, autoplayInterval]);\n\n  /* This function enables autoplay to pause/play without affecting underlying state\n   * Useful for pausing on focus etc. without having to reinitialize or set autoplay to off\n   */\n  const enableAutoplay = React.useCallback(\n    (autoplay: boolean, temporary?: boolean) => {\n      if (!temporary) {\n        autoplayRef.current = autoplay;\n      }\n\n      if (autoplay && autoplayRef.current) {\n        // Autoplay should only enable in the case where underlying state is true, temporary should not override\n        emblaApi.current?.plugins().autoplay?.play();\n        // Reset after play to ensure timing and any focus/mouse pause state is reset.\n        resetAutoplay();\n      } else if (!autoplay) {\n        emblaApi.current?.plugins().autoplay?.stop();\n      }\n    },\n    [resetAutoplay],\n  );\n\n  // Listeners contains callbacks for UI elements that may require state update based on embla changes\n  const listeners = React.useRef(new Set<(data: CarouselUpdateData) => void>());\n  const subscribeForValues = React.useCallback((listener: (data: CarouselUpdateData) => void) => {\n    listeners.current.add(listener);\n\n    return () => {\n      listeners.current.delete(listener);\n    };\n  }, []);\n\n  const updateIndex = () => {\n    const newIndex = emblaApi.current?.selectedScrollSnap() ?? 0;\n    const slides = emblaApi.current?.slideNodes();\n    const slideRegistry = emblaApi.current?.internalEngine().slideRegistry;\n    const actualIndex = slideRegistry?.[newIndex]?.[0] ?? 0;\n\n    // We set the first card in the current group as the default tabster index for focus capture\n    slides?.forEach((slide, slideIndex) => {\n      setTabsterDefault(slide, slideIndex === actualIndex);\n    });\n    setActiveIndex(newIndex);\n  };\n\n  const handleReinit = useEventCallback(() => {\n    const nodes: HTMLElement[] = emblaApi.current?.slideNodes() ?? [];\n    const groupIndexList: number[][] = emblaApi.current?.internalEngine().slideRegistry ?? [];\n    const navItemsCount = groupIndexList.length > 0 ? groupIndexList.length : nodes.length;\n    const data: CarouselUpdateData = {\n      navItemsCount,\n      activeIndex: emblaApi.current?.selectedScrollSnap() ?? 0,\n      groupIndexList,\n      slideNodes: nodes,\n    };\n\n    updateIndex();\n    emblaApi.current?.scrollTo(activeIndex, false);\n    for (const listener of listeners.current) {\n      listener(data);\n    }\n  });\n\n  const handleIndexChange: EmblaEventHandler = useEventCallback((_, eventType) => {\n    const newIndex = emblaApi.current?.selectedScrollSnap() ?? 0;\n    updateIndex();\n    if (eventType === 'autoplay:select') {\n      const noopEvent = new Event('autoplay');\n      onAutoplayIndexChange?.(noopEvent, { event: noopEvent, type: 'autoplay', index: newIndex });\n    }\n  });\n\n  const viewportRef: React.RefObject<HTMLDivElement> = React.useRef(null);\n  const containerRef: React.RefObject<HTMLDivElement> = React.useMemo(() => {\n    let currentElement: HTMLDivElement | null = null;\n\n    const handleVisibilityChange = () => {\n      const cardElements = emblaApi.current?.slideNodes();\n      const visibleIndexes = emblaApi.current?.slidesInView() ?? [];\n\n      cardElements?.forEach((cardElement, index) => {\n        cardElement.dispatchEvent(\n          new CustomEvent<CarouselVisibilityEventDetail>(EMBLA_VISIBILITY_EVENT, {\n            bubbles: false,\n            detail: { isVisible: visibleIndexes.includes(index) },\n          }),\n        );\n      });\n    };\n\n    // Get plugins using autoplayRef to prevent state change recreating EmblaCarousel\n    const plugins = getPlugins();\n\n    return {\n      set current(newElement: HTMLDivElement | null) {\n        if (currentElement) {\n          emblaApi.current?.off('slidesInView', handleVisibilityChange);\n          emblaApi.current?.off('select', handleIndexChange);\n          emblaApi.current?.off('reInit', handleReinit);\n          emblaApi.current?.off('autoplay:select', handleIndexChange);\n          emblaApi.current?.destroy();\n        }\n\n        // Use direct viewport if available, else fallback to container (includes Carousel controls).\n        currentElement = viewportRef.current ?? newElement;\n        if (currentElement) {\n          emblaApi.current = EmblaCarousel(\n            currentElement,\n            {\n              ...DEFAULT_EMBLA_OPTIONS,\n              ...emblaOptions.current,\n            },\n            plugins,\n          );\n\n          emblaApi.current?.on('reInit', handleReinit);\n          emblaApi.current?.on('slidesInView', handleVisibilityChange);\n          emblaApi.current?.on('select', handleIndexChange);\n          emblaApi.current?.on('autoplay:select', handleIndexChange);\n        }\n      },\n    };\n  }, [getPlugins, handleIndexChange, handleReinit]);\n\n  const carouselApi = React.useMemo(\n    () => ({\n      scrollToElement: (element: HTMLElement, jump?: boolean) => {\n        const cardElements = emblaApi.current?.slideNodes();\n        const groupIndexList = emblaApi.current?.internalEngine().slideRegistry ?? [];\n        const cardIndex = cardElements?.indexOf(element) ?? 0;\n        const groupIndex = groupIndexList.findIndex(group => {\n          return group.includes(cardIndex);\n        });\n        const indexFocus = groupIndex ?? cardIndex;\n        emblaApi.current?.scrollTo(indexFocus, jump);\n\n        return indexFocus;\n      },\n      scrollToIndex: (index: number, jump?: boolean) => {\n        emblaApi.current?.scrollTo(index, jump);\n      },\n      scrollInDirection: (dir: 'prev' | 'next') => {\n        if (dir === 'prev') {\n          emblaApi.current?.scrollPrev();\n        } else {\n          emblaApi.current?.scrollNext();\n        }\n\n        return emblaApi.current?.selectedScrollSnap() ?? 0;\n      },\n    }),\n    [],\n  );\n\n  React.useEffect(() => {\n    const plugins = getPlugins();\n\n    emblaOptions.current = {\n      startIndex: emblaOptions.current.startIndex,\n      align,\n      direction,\n      loop,\n      slidesToScroll,\n      watchDrag,\n      containScroll,\n      duration: motionDuration,\n    };\n\n    emblaApi.current?.reInit(\n      {\n        ...DEFAULT_EMBLA_OPTIONS,\n        ...emblaOptions.current,\n      },\n      plugins,\n    );\n  }, [align, containScroll, direction, getPlugins, loop, slidesToScroll, watchDrag, motionDuration]);\n\n  React.useEffect(() => {\n    // Scroll to controlled values on update\n    // If active index is out of bounds, re-init will handle instead\n    const currentActiveIndex = emblaApi.current?.selectedScrollSnap() ?? 0;\n    const slideLength = emblaApi.current?.slideNodes()?.length ?? 0;\n    emblaOptions.current.startIndex = activeIndex;\n    if (activeIndex < slideLength && activeIndex !== currentActiveIndex) {\n      emblaApi.current?.scrollTo(activeIndex);\n    }\n  }, [activeIndex]);\n\n  return {\n    activeIndex,\n    carouselApi,\n    viewportRef,\n    containerRef,\n    subscribeForValues,\n    enableAutoplay,\n    resetAutoplay,\n  };\n}\n"],"names":["EMBLA_VISIBILITY_EVENT","setTabsterDefault","useEmblaCarousel","sliderClassname","carouselSliderClassNames","root","DEFAULT_EMBLA_OPTIONS","containScroll","inViewThreshold","watchDrag","skipSnaps","container","slides","carouselCardClassNames","element","isDefault","tabsterAttr","getAttribute","tabsterAttributes","JSON","parse","focusable","setAttribute","stringify","options","align","autoplayInterval","direction","loop","slidesToScroll","motion","onDragIndexChange","onAutoplayIndexChange","motionType","kind","motionDuration","duration","activeIndex","setActiveIndex","useControllableState","defaultState","defaultActiveIndex","state","initialState","onDragEvent","useEventCallback","event","index","type","emblaOptions","React","useRef","startIndex","emblaApi","autoplayRef","resetAutoplay","useCallback","current","plugins","autoplay","reset","getPlugins","push","Autoplay","playOnInit","delay","stopOnInteraction","stopOnFocusIn","stopOnMouseEnter","Fade","pointerEventPlugin","onSelectViaDrag","enableAutoplay","temporary","play","stop","listeners","Set","subscribeForValues","listener","add","delete","updateIndex","slideRegistry","newIndex","selectedScrollSnap","slideNodes","internalEngine","actualIndex","forEach","slide","slideIndex","handleReinit","nodes","groupIndexList","navItemsCount","length","data","scrollTo","handleIndexChange","_","eventType","noopEvent","Event","viewportRef","containerRef","useMemo","currentElement","handleVisibilityChange","cardElements","visibleIndexes","slidesInView","cardElement","dispatchEvent","CustomEvent","bubbles","detail","isVisible","includes","newElement","off","destroy","EmblaCarousel","on","carouselApi","scrollToElement","jump","cardIndex","indexOf","groupIndex","findIndex","group","indexFocus","scrollToIndex","scrollInDirection","dir","scrollPrev","scrollNext","useEffect","reInit","currentActiveIndex","slideLength"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fluentui/react-carousel",
-  "version": "9.5.0",
+  "version": "9.6.0",
   "description": "A composable carousel component that enables pagination with minimal rerenders",
   "main": "lib-commonjs/index.js",
   "module": "lib/index.js",
@@ -25,14 +25,14 @@
     "@fluentui/scripts-cypress": "*"
   },
   "dependencies": {
-    "@fluentui/react-aria": "^9.13.14",
-    "@fluentui/react-button": "^9.3.102",
+    "@fluentui/react-aria": "^9.14.0",
+    "@fluentui/react-button": "^9.4.0",
     "@fluentui/react-context-selector": "^9.1.72",
     "@fluentui/react-icons": "^2.0.245",
-    "@fluentui/react-tooltip": "^9.5.5",
+    "@fluentui/react-tooltip": "^9.6.0",
     "@fluentui/react-jsx-runtime": "^9.0.50",
     "@fluentui/react-shared-contexts": "^9.21.2",
-    "@fluentui/react-tabster": "^9.23.3",
+    "@fluentui/react-tabster": "^9.24.0",
     "@fluentui/react-theme": "^9.1.24",
     "@fluentui/react-utilities": "^9.18.20",
     "@griffel/react": "^1.5.22",