@yamada-ui/react 2.2.1-dev-20260428144932 → 2.2.1-dev-20260428151511

package/dist/cjs/components/carousel/use-carousel.cjs

@@ -6,6 +6,8 @@ const require_dom = require('../../utils/dom.cjs');
 const require_effect = require('../../utils/effect.cjs');
 const require_ref = require('../../utils/ref.cjs');
 const require_utils_index = require('../../utils/index.cjs');
+const require_props = require('../../core/components/props.cjs');
+require('../../core/index.cjs');
 const require_hooks_use_controllable_state_index = require('../../hooks/use-controllable-state/index.cjs');
 const require_i18n_provider = require('../../providers/i18n-provider/i18n-provider.cjs');
 require('../../providers/i18n-provider/index.cjs');
@@ -171,16 +173,15 @@ const useCarousel = ({ id, align = "center", autoplay = false, containScroll = f
 		skipSnaps,
 		slidesToScroll
 	]);
-	const getRootProps = (0, react.useCallback)(({ ref, ...props } = {}) => ({
+	const getRootProps = (0, react.useCallback)(({ ref, ...props } = {}) => require_props.mergeProps({
 		id,
 		"aria-roledescription": "carousel",
-		"data-orientation": orientation,
-		...rest,
-		...props,
-		ref: require_ref.mergeRefs(ref, rest.ref),
-		onMouseEnter: (0, require_utils_index.utils_exports.handlerAll)(props.onMouseEnter, onMouseEnter),
-		onMouseLeave: (0, require_utils_index.utils_exports.handlerAll)(props.onMouseLeave, onMouseLeave)
-	}), [
+		"data-orientation": orientation
+	}, rest, {
+		ref,
+		onMouseEnter,
+		onMouseLeave
+	}, props)(), [
 		id,
 		onMouseEnter,
 		onMouseLeave,

package/dist/cjs/components/carousel/use-carousel.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"use-carousel.cjs","names":["createContext","useI18n","useControllableState","useIds","useBoolean","snapCount","total","index","getRootProps: PropGetter<\"section\">","mergeRefs","getListProps: PropGetter","getItemProps: RequiredPropGetter<\"div\", { index: number }>","indexProp","getPrevTriggerProps: PropGetter<\"button\">","getNextTriggerProps: PropGetter<\"button\">","getIndicatorsProps: PropGetter"],"sources":["../../../../src/components/carousel/use-carousel.ts"],"sourcesContent":["\"use client\"\n\nimport type {\n  EmblaCarouselType,\n  EmblaOptionsType,\n  EmblaPluginType,\n} from \"embla-carousel\"\nimport type { KeyboardEvent, RefObject } from \"react\"\nimport type {\n  HTMLProps,\n  Orientation,\n  PropGetter,\n  RequiredPropGetter,\n} from \"../../core\"\nimport useEmblaCarousel from \"embla-carousel-react\"\nimport { useCallback, useEffect, useRef, useState } from \"react\"\nimport { useBoolean } from \"../../hooks/use-boolean\"\nimport { useControllableState } from \"../../hooks/use-controllable-state\"\nimport { useI18n } from \"../../providers/i18n-provider\"\nimport {\n  assignRef,\n  createContext,\n  dataAttr,\n  handlerAll,\n  isFunction,\n  mergeRefs,\n  runKeyAction,\n  useIds,\n  useUpdateEffect,\n} from \"../../utils\"\n\ntype EmblaOptions = Required<EmblaOptionsType>\nexport type CarouselAlign = EmblaOptions[\"align\"]\nexport type CarouselContainScroll = EmblaOptions[\"containScroll\"]\nexport type CarouselInViewThreshold = EmblaOptions[\"inViewThreshold\"]\nexport type CarouselWatchDrag = EmblaOptions[\"watchDrag\"]\nexport type CarouselWatchResize = EmblaOptions[\"watchResize\"]\nexport type CarouselWatchSlides = EmblaOptions[\"watchSlides\"]\nexport type CarouselControl = EmblaCarouselType\nexport type CarouselPlugin = EmblaPluginType\n\nexport interface CarouselContext extends Omit<\n  UseCarouselReturn,\n  \"getRootProps\"\n> {}\n\nconst [CarouselContext, useCarouselContext] = createContext<CarouselContext>({\n  name: \"CarouselContext\",\n})\n\nexport { CarouselContext, useCarouselContext }\n\nexport interface UseCarouselProps extends Omit<\n  HTMLProps<\"section\">,\n  \"onChange\"\n> {\n  /**\n   * The alignment of the carousel.\n   *\n   * @default 'center'\n   */\n  align?: CarouselAlign\n  /**\n   * If `true`, the carousel will be autoplay.\n   *\n   * @default false\n   */\n  autoplay?: boolean\n  /**\n   * Clear leading and trailing empty space that causes excessive scrolling.\n   * Use trimSnaps to only use snap points that trigger scrolling or keepSnaps to keep them.\n   *\n   * @default false\n   */\n  containScroll?: CarouselContainScroll\n  /**\n   * Ref of the resizable item callback.\n   */\n  controlRef?: RefObject<CarouselControl | null>\n  /**\n   * The initial index of the carousel slide.\n   *\n   * @default 0\n   */\n  defaultIndex?: number\n  /**\n   * The number for the autoplay interval of the carousel.\n   *\n   * @default 4000\n   */\n  delay?: number\n  /**\n   * If `true`, momentum scrolling will be enabled.\n   *\n   * @default false\n   */\n  dragFree?: boolean\n  /**\n   * If `true`, carousel can be scrolled with mouse and touch interactions.\n   *\n   * @default true\n   */\n  draggable?: boolean\n  /**\n   * Set scroll duration when triggered by any of the API methods.\n   * Higher numbers enables slower scrolling.\n   * Drag interactions are not affected because duration is then determined by the drag force.\n   *\n   * @default 25\n   */\n  duration?: number\n  /**\n   * The index of the carousel slide.\n   */\n  index?: number\n  /**\n   * Choose a fraction representing the percentage portion of a slide that needs to be visible in order to be considered in view.\n   *\n   * @default 0\n   */\n  inViewThreshold?: CarouselInViewThreshold\n  /**\n   * If `true`, infinite looping.\n   * Automatically falls back to false if slide content isn't enough to loop.\n   *\n   * @default true\n   */\n  loop?: boolean\n  /**\n   * The orientation of the carousel.\n   *\n   * @default 'horizontal'\n   */\n  orientation?: Orientation\n  /**\n   * Embla plugins to use.\n   */\n  plugins?: CarouselPlugin[]\n  /**\n   * If `true`, allow the carousel to skip scroll snaps if it's dragged vigorously.\n   * Note that this option will be ignored if the dragFree option is set to true.\n   *\n   * @default false\n   */\n  skipSnaps?: boolean\n  /**\n   * The number of slides that should be scrolled with next or previous buttons.\n   *\n   * @default 1\n   */\n  slidesToScroll?: number\n  /**\n   * If `true`, autoplay will pause when the mouse entries over.\n   *\n   * @default true\n   */\n  stopMouseEnterAutoplay?: boolean\n  /**\n   * Enables for scrolling the carousel with mouse and touch interactions.\n   * Set this to `false` to disable drag events or pass a custom callback to add your own drag logic.\n   *\n   * @default true\n   */\n  watchDrag?: CarouselWatchDrag\n  /**\n   * Embla automatically watches the container and slides for size changes and runs `reInit` when any size has changed.\n   * Set this to `false` to disable this behaviour or pass a custom callback to add your own resize logic.\n   *\n   * @default true\n   */\n  watchResize?: CarouselWatchResize\n  /**\n   * Embla automatically watches the container for added and/or removed slides and runs `reInit` if needed.\n   * Set this to `false` to disable this behaviour or pass a custom callback to add your own slides changed logic.\n   *\n   * @default true\n   */\n  watchSlides?: CarouselWatchSlides\n  /**\n   * The callback invoked when carousel slide selected.\n   */\n  onChange?: (index: number) => void\n  /**\n   * A callback that return the current scroll amount when the carousel is scrolled.\n   */\n  onScrollProgress?: (progress: number) => void\n}\n\nexport const useCarousel = ({\n  id,\n  align = \"center\",\n  autoplay = false,\n  containScroll = false,\n  controlRef,\n  defaultIndex = 0,\n  delay = 4000,\n  dragFree = false,\n  draggable = true,\n  duration = 25,\n  index: indexProp,\n  inViewThreshold = 0,\n  loop = true,\n  orientation = \"horizontal\",\n  plugins = [],\n  skipSnaps = false,\n  slidesToScroll = 1,\n  stopMouseEnterAutoplay = true,\n  watchDrag = draggable,\n  watchResize: watchResizeProp = true,\n  watchSlides = true,\n  onChange,\n  onScrollProgress,\n  ...rest\n}: UseCarouselProps = {}) => {\n  const { t } = useI18n(\"carousel\")\n  const [index, setIndex] = useControllableState({\n    defaultValue: defaultIndex,\n    value: indexProp,\n    onChange,\n  })\n  const [rootId, listId] = useIds()\n  const [hover, { off: onMouseLeave, on: onMouseEnter }] = useBoolean()\n  const timeoutId = useRef<NodeJS.Timeout | null>(null)\n  const indicatorMapRef = useRef<Map<number, HTMLButtonElement | null>>(\n    new Map(),\n  )\n  const listRef = useRef<HTMLDivElement>(null)\n  const horizontal = orientation === \"horizontal\"\n  const axis = horizontal ? \"x\" : \"y\"\n  const [snapCount, setSnapCount] = useState(0)\n  const [total, setTotal] = useState(0)\n  const watchResize = useCallback<Extract<CarouselWatchResize, Function>>(\n    (methods, entries) => {\n      const result = isFunction(watchResizeProp)\n        ? watchResizeProp(methods, entries)\n        : true\n      const snapCount = methods.scrollSnapList().length\n      const total = methods.slideNodes().length\n\n      setSnapCount(snapCount)\n      setTotal(total)\n\n      return result\n    },\n    [watchResizeProp],\n  )\n  const [carouselRef, carousel] = useEmblaCarousel(\n    {\n      align,\n      axis,\n      container: listRef.current,\n      containScroll,\n      dragFree,\n      duration,\n      inViewThreshold,\n      loop,\n      skipSnaps,\n      slidesToScroll,\n      startIndex: defaultIndex,\n      watchDrag,\n      watchResize,\n      watchSlides,\n    },\n    plugins,\n  )\n\n  id ??= rootId\n\n  const onInit = useCallback((methods: CarouselControl) => {\n    const snapCount = methods.scrollSnapList().length\n    const total = methods.slideNodes().length\n\n    setSnapCount(snapCount)\n    setTotal(total)\n  }, [])\n\n  const onScroll = useCallback(() => {\n    if (!carousel) return\n\n    const progress = Math.round(\n      Math.max(0, Math.min(1, carousel.scrollProgress())) * 100,\n    )\n\n    onScrollProgress?.(progress)\n  }, [carousel, onScrollProgress])\n\n  const onSelect = useCallback(() => {\n    if (!carousel) return\n\n    const index = carousel.selectedScrollSnap()\n\n    setIndex(index)\n  }, [carousel, setIndex])\n\n  const onFocusIndicator = useCallback(\n    (index: number) => {\n      const el = indicatorMapRef.current.get(index)\n\n      el?.focus()\n      carousel?.scrollTo(index)\n    },\n    [carousel],\n  )\n\n  const onKeyDown = useCallback(\n    (index: number) => (ev: KeyboardEvent<HTMLButtonElement>) => {\n      const lastIndex = snapCount - 1\n\n      runKeyAction(ev, {\n        ArrowDown: () => {\n          if (horizontal) return\n\n          index = index === lastIndex ? 0 : index + 1\n\n          onFocusIndicator(index)\n        },\n        ArrowLeft: () => {\n          if (!horizontal) return\n\n          index = index === 0 ? lastIndex : index - 1\n\n          onFocusIndicator(index)\n        },\n        ArrowRight: () => {\n          if (!horizontal) return\n\n          index = index === lastIndex ? 0 : index + 1\n\n          onFocusIndicator(index)\n        },\n        ArrowUp: () => {\n          if (horizontal) return\n\n          index = index === 0 ? lastIndex : index - 1\n\n          onFocusIndicator(index)\n        },\n        End: () => {\n          onFocusIndicator(lastIndex)\n        },\n        Home: () => {\n          onFocusIndicator(0)\n        },\n      })\n    },\n    [snapCount, horizontal, onFocusIndicator],\n  )\n\n  assignRef(controlRef, carousel)\n\n  useEffect(() => {\n    if (carousel) {\n      carousel.on(\"reInit\", onInit)\n      carousel.on(\"select\", onSelect)\n      carousel.on(\"scroll\", onScroll)\n\n      onScroll()\n\n      return () => {\n        carousel.off(\"reInit\", onInit)\n        carousel.off(\"select\", onSelect)\n        carousel.off(\"scroll\", onScroll)\n      }\n    }\n  }, [carousel, onInit, onScroll, onSelect])\n\n  useEffect(() => {\n    const stop = hover && stopMouseEnterAutoplay\n    const last = !carousel?.canScrollNext()\n\n    if (carousel && autoplay && !stop && !last) {\n      timeoutId.current = setInterval(() => {\n        carousel.scrollNext()\n      }, delay)\n    } else {\n      if (timeoutId.current) clearInterval(timeoutId.current)\n\n      timeoutId.current = null\n    }\n\n    return () => {\n      if (timeoutId.current) clearInterval(timeoutId.current)\n    }\n  }, [autoplay, carousel, delay, hover, stopMouseEnterAutoplay])\n\n  useUpdateEffect(() => {\n    if (!carousel) return\n\n    if (indexProp === undefined) return\n\n    carousel.scrollTo(indexProp)\n  }, [indexProp])\n\n  useUpdateEffect(() => {\n    if (!carousel) return\n\n    carousel.reInit()\n  }, [\n    carousel,\n    total,\n    align,\n    axis,\n    containScroll,\n    dragFree,\n    duration,\n    inViewThreshold,\n    loop,\n    skipSnaps,\n    slidesToScroll,\n  ])\n\n  const getRootProps: PropGetter<\"section\"> = useCallback(\n    ({ ref, ...props } = {}) => ({\n      id,\n      \"aria-roledescription\": \"carousel\",\n      \"data-orientation\": orientation,\n      ...rest,\n      ...props,\n      ref: mergeRefs(ref, rest.ref),\n      onMouseEnter: handlerAll(props.onMouseEnter, onMouseEnter),\n      onMouseLeave: handlerAll(props.onMouseLeave, onMouseLeave),\n    }),\n    [id, onMouseEnter, onMouseLeave, rest, orientation],\n  )\n\n  const getListProps: PropGetter = useCallback(\n    ({ ref, ...props } = {}) => ({\n      id: listId,\n      \"aria-live\": autoplay ? \"off\" : \"polite\",\n      \"data-orientation\": orientation,\n      ...props,\n      ref: mergeRefs(ref, listRef, carouselRef),\n    }),\n    [autoplay, listId, orientation, carouselRef],\n  )\n\n  const getItemProps: RequiredPropGetter<\"div\", { index: number }> =\n    useCallback(\n      ({ index: indexProp, ...props }) => {\n        const page = indexProp + 1\n        const selected = index === indexProp\n\n        return {\n          id: `${listId}-${indexProp}`,\n          \"aria-label\": t(\"{page} of {total}\", { page, total }),\n          \"aria-roledescription\": \"slide\",\n          \"data-index\": indexProp.toString(),\n          \"data-orientation\": orientation,\n          \"data-selected\": dataAttr(selected),\n          role: \"tabpanel\",\n          ...props,\n        }\n      },\n      [index, listId, total, orientation, t],\n    )\n\n  const getPrevTriggerProps: PropGetter<\"button\"> = useCallback(\n    (props = {}) => ({\n      \"aria-controls\": listId,\n      \"aria-label\": t(\"Go to previous slide\"),\n      \"data-orientation\": orientation,\n      disabled: !carousel?.canScrollPrev(),\n      ...props,\n      onClick: handlerAll(props.onClick, () => carousel?.scrollPrev()),\n    }),\n    [carousel, listId, orientation, t],\n  )\n\n  const getNextTriggerProps: PropGetter<\"button\"> = useCallback(\n    (props = {}) => ({\n      \"aria-controls\": listId,\n      \"aria-label\": t(\"Go to next slide\"),\n      \"data-orientation\": orientation,\n      disabled: !carousel?.canScrollNext(),\n      ...props,\n      onClick: handlerAll(props.onClick, () => carousel?.scrollNext()),\n    }),\n    [carousel, listId, orientation, t],\n  )\n\n  const getIndicatorsProps: PropGetter = useCallback(\n    (props = {}) => ({\n      \"aria-label\": t(\"Slides\"),\n      \"aria-orientation\": orientation,\n      role: \"tablist\",\n      ...props,\n    }),\n    [orientation, t],\n  )\n\n  const getIndicatorProps: RequiredPropGetter<\"button\", { index: number }> =\n    useCallback(\n      ({ ref, index: indexProp, ...props }) => {\n        const page = indexProp + 1\n        const selected = index === indexProp\n\n        return {\n          type: \"button\" as const,\n          \"aria-controls\": `${listId}-${indexProp}`,\n          \"aria-label\": t(\"Go to {page} slide\", { page }),\n          \"aria-selected\": selected,\n          \"data-index\": indexProp.toString(),\n          \"data-orientation\": orientation,\n          \"data-selected\": dataAttr(selected),\n          role: \"tab\",\n          tabIndex: selected ? 0 : -1,\n          ...props,\n          ref: mergeRefs(ref, (node) => {\n            indicatorMapRef.current.set(indexProp, node)\n          }),\n          onClick: handlerAll(props.onClick, () =>\n            carousel?.scrollTo(indexProp),\n          ),\n          onKeyDown: handlerAll(props.onKeyDown, onKeyDown(indexProp)),\n        }\n      },\n      [index, listId, t, orientation, onKeyDown, carousel],\n    )\n\n  return {\n    carousel,\n    index,\n    setIndex,\n    snapCount,\n    total,\n    getIndicatorProps,\n    getIndicatorsProps,\n    getItemProps,\n    getListProps,\n    getNextTriggerProps,\n    getPrevTriggerProps,\n    getRootProps,\n  }\n}\n\nexport type UseCarouselReturn = ReturnType<typeof useCarousel>\n"],"mappings":"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"}
+{"version":3,"file":"use-carousel.cjs","names":["createContext","useI18n","useControllableState","useIds","useBoolean","snapCount","total","index","getRootProps: PropGetter<\"section\">","mergeProps","getListProps: PropGetter","mergeRefs","getItemProps: RequiredPropGetter<\"div\", { index: number }>","indexProp","getPrevTriggerProps: PropGetter<\"button\">","getNextTriggerProps: PropGetter<\"button\">","getIndicatorsProps: PropGetter"],"sources":["../../../../src/components/carousel/use-carousel.ts"],"sourcesContent":["\"use client\"\n\nimport type {\n  EmblaCarouselType,\n  EmblaOptionsType,\n  EmblaPluginType,\n} from \"embla-carousel\"\nimport type { KeyboardEvent, RefObject } from \"react\"\nimport type {\n  HTMLProps,\n  Orientation,\n  PropGetter,\n  RequiredPropGetter,\n} from \"../../core\"\nimport useEmblaCarousel from \"embla-carousel-react\"\nimport { useCallback, useEffect, useRef, useState } from \"react\"\nimport { mergeProps } from \"../../core\"\nimport { useBoolean } from \"../../hooks/use-boolean\"\nimport { useControllableState } from \"../../hooks/use-controllable-state\"\nimport { useI18n } from \"../../providers/i18n-provider\"\nimport {\n  assignRef,\n  createContext,\n  dataAttr,\n  handlerAll,\n  isFunction,\n  mergeRefs,\n  runKeyAction,\n  useIds,\n  useUpdateEffect,\n} from \"../../utils\"\n\ntype EmblaOptions = Required<EmblaOptionsType>\nexport type CarouselAlign = EmblaOptions[\"align\"]\nexport type CarouselContainScroll = EmblaOptions[\"containScroll\"]\nexport type CarouselInViewThreshold = EmblaOptions[\"inViewThreshold\"]\nexport type CarouselWatchDrag = EmblaOptions[\"watchDrag\"]\nexport type CarouselWatchResize = EmblaOptions[\"watchResize\"]\nexport type CarouselWatchSlides = EmblaOptions[\"watchSlides\"]\nexport type CarouselControl = EmblaCarouselType\nexport type CarouselPlugin = EmblaPluginType\n\nexport interface CarouselContext extends Omit<\n  UseCarouselReturn,\n  \"getRootProps\"\n> {}\n\nconst [CarouselContext, useCarouselContext] = createContext<CarouselContext>({\n  name: \"CarouselContext\",\n})\n\nexport { CarouselContext, useCarouselContext }\n\nexport interface UseCarouselProps extends Omit<\n  HTMLProps<\"section\">,\n  \"onChange\"\n> {\n  /**\n   * The alignment of the carousel.\n   *\n   * @default 'center'\n   */\n  align?: CarouselAlign\n  /**\n   * If `true`, the carousel will be autoplay.\n   *\n   * @default false\n   */\n  autoplay?: boolean\n  /**\n   * Clear leading and trailing empty space that causes excessive scrolling.\n   * Use trimSnaps to only use snap points that trigger scrolling or keepSnaps to keep them.\n   *\n   * @default false\n   */\n  containScroll?: CarouselContainScroll\n  /**\n   * Ref of the resizable item callback.\n   */\n  controlRef?: RefObject<CarouselControl | null>\n  /**\n   * The initial index of the carousel slide.\n   *\n   * @default 0\n   */\n  defaultIndex?: number\n  /**\n   * The number for the autoplay interval of the carousel.\n   *\n   * @default 4000\n   */\n  delay?: number\n  /**\n   * If `true`, momentum scrolling will be enabled.\n   *\n   * @default false\n   */\n  dragFree?: boolean\n  /**\n   * If `true`, carousel can be scrolled with mouse and touch interactions.\n   *\n   * @default true\n   */\n  draggable?: boolean\n  /**\n   * Set scroll duration when triggered by any of the API methods.\n   * Higher numbers enables slower scrolling.\n   * Drag interactions are not affected because duration is then determined by the drag force.\n   *\n   * @default 25\n   */\n  duration?: number\n  /**\n   * The index of the carousel slide.\n   */\n  index?: number\n  /**\n   * Choose a fraction representing the percentage portion of a slide that needs to be visible in order to be considered in view.\n   *\n   * @default 0\n   */\n  inViewThreshold?: CarouselInViewThreshold\n  /**\n   * If `true`, infinite looping.\n   * Automatically falls back to false if slide content isn't enough to loop.\n   *\n   * @default true\n   */\n  loop?: boolean\n  /**\n   * The orientation of the carousel.\n   *\n   * @default 'horizontal'\n   */\n  orientation?: Orientation\n  /**\n   * Embla plugins to use.\n   */\n  plugins?: CarouselPlugin[]\n  /**\n   * If `true`, allow the carousel to skip scroll snaps if it's dragged vigorously.\n   * Note that this option will be ignored if the dragFree option is set to true.\n   *\n   * @default false\n   */\n  skipSnaps?: boolean\n  /**\n   * The number of slides that should be scrolled with next or previous buttons.\n   *\n   * @default 1\n   */\n  slidesToScroll?: number\n  /**\n   * If `true`, autoplay will pause when the mouse entries over.\n   *\n   * @default true\n   */\n  stopMouseEnterAutoplay?: boolean\n  /**\n   * Enables for scrolling the carousel with mouse and touch interactions.\n   * Set this to `false` to disable drag events or pass a custom callback to add your own drag logic.\n   *\n   * @default true\n   */\n  watchDrag?: CarouselWatchDrag\n  /**\n   * Embla automatically watches the container and slides for size changes and runs `reInit` when any size has changed.\n   * Set this to `false` to disable this behaviour or pass a custom callback to add your own resize logic.\n   *\n   * @default true\n   */\n  watchResize?: CarouselWatchResize\n  /**\n   * Embla automatically watches the container for added and/or removed slides and runs `reInit` if needed.\n   * Set this to `false` to disable this behaviour or pass a custom callback to add your own slides changed logic.\n   *\n   * @default true\n   */\n  watchSlides?: CarouselWatchSlides\n  /**\n   * The callback invoked when carousel slide selected.\n   */\n  onChange?: (index: number) => void\n  /**\n   * A callback that return the current scroll amount when the carousel is scrolled.\n   */\n  onScrollProgress?: (progress: number) => void\n}\n\nexport const useCarousel = ({\n  id,\n  align = \"center\",\n  autoplay = false,\n  containScroll = false,\n  controlRef,\n  defaultIndex = 0,\n  delay = 4000,\n  dragFree = false,\n  draggable = true,\n  duration = 25,\n  index: indexProp,\n  inViewThreshold = 0,\n  loop = true,\n  orientation = \"horizontal\",\n  plugins = [],\n  skipSnaps = false,\n  slidesToScroll = 1,\n  stopMouseEnterAutoplay = true,\n  watchDrag = draggable,\n  watchResize: watchResizeProp = true,\n  watchSlides = true,\n  onChange,\n  onScrollProgress,\n  ...rest\n}: UseCarouselProps = {}) => {\n  const { t } = useI18n(\"carousel\")\n  const [index, setIndex] = useControllableState({\n    defaultValue: defaultIndex,\n    value: indexProp,\n    onChange,\n  })\n  const [rootId, listId] = useIds()\n  const [hover, { off: onMouseLeave, on: onMouseEnter }] = useBoolean()\n  const timeoutId = useRef<NodeJS.Timeout | null>(null)\n  const indicatorMapRef = useRef<Map<number, HTMLButtonElement | null>>(\n    new Map(),\n  )\n  const listRef = useRef<HTMLDivElement>(null)\n  const horizontal = orientation === \"horizontal\"\n  const axis = horizontal ? \"x\" : \"y\"\n  const [snapCount, setSnapCount] = useState(0)\n  const [total, setTotal] = useState(0)\n  const watchResize = useCallback<Extract<CarouselWatchResize, Function>>(\n    (methods, entries) => {\n      const result = isFunction(watchResizeProp)\n        ? watchResizeProp(methods, entries)\n        : true\n      const snapCount = methods.scrollSnapList().length\n      const total = methods.slideNodes().length\n\n      setSnapCount(snapCount)\n      setTotal(total)\n\n      return result\n    },\n    [watchResizeProp],\n  )\n  const [carouselRef, carousel] = useEmblaCarousel(\n    {\n      align,\n      axis,\n      container: listRef.current,\n      containScroll,\n      dragFree,\n      duration,\n      inViewThreshold,\n      loop,\n      skipSnaps,\n      slidesToScroll,\n      startIndex: defaultIndex,\n      watchDrag,\n      watchResize,\n      watchSlides,\n    },\n    plugins,\n  )\n\n  id ??= rootId\n\n  const onInit = useCallback((methods: CarouselControl) => {\n    const snapCount = methods.scrollSnapList().length\n    const total = methods.slideNodes().length\n\n    setSnapCount(snapCount)\n    setTotal(total)\n  }, [])\n\n  const onScroll = useCallback(() => {\n    if (!carousel) return\n\n    const progress = Math.round(\n      Math.max(0, Math.min(1, carousel.scrollProgress())) * 100,\n    )\n\n    onScrollProgress?.(progress)\n  }, [carousel, onScrollProgress])\n\n  const onSelect = useCallback(() => {\n    if (!carousel) return\n\n    const index = carousel.selectedScrollSnap()\n\n    setIndex(index)\n  }, [carousel, setIndex])\n\n  const onFocusIndicator = useCallback(\n    (index: number) => {\n      const el = indicatorMapRef.current.get(index)\n\n      el?.focus()\n      carousel?.scrollTo(index)\n    },\n    [carousel],\n  )\n\n  const onKeyDown = useCallback(\n    (index: number) => (ev: KeyboardEvent<HTMLButtonElement>) => {\n      const lastIndex = snapCount - 1\n\n      runKeyAction(ev, {\n        ArrowDown: () => {\n          if (horizontal) return\n\n          index = index === lastIndex ? 0 : index + 1\n\n          onFocusIndicator(index)\n        },\n        ArrowLeft: () => {\n          if (!horizontal) return\n\n          index = index === 0 ? lastIndex : index - 1\n\n          onFocusIndicator(index)\n        },\n        ArrowRight: () => {\n          if (!horizontal) return\n\n          index = index === lastIndex ? 0 : index + 1\n\n          onFocusIndicator(index)\n        },\n        ArrowUp: () => {\n          if (horizontal) return\n\n          index = index === 0 ? lastIndex : index - 1\n\n          onFocusIndicator(index)\n        },\n        End: () => {\n          onFocusIndicator(lastIndex)\n        },\n        Home: () => {\n          onFocusIndicator(0)\n        },\n      })\n    },\n    [snapCount, horizontal, onFocusIndicator],\n  )\n\n  assignRef(controlRef, carousel)\n\n  useEffect(() => {\n    if (carousel) {\n      carousel.on(\"reInit\", onInit)\n      carousel.on(\"select\", onSelect)\n      carousel.on(\"scroll\", onScroll)\n\n      onScroll()\n\n      return () => {\n        carousel.off(\"reInit\", onInit)\n        carousel.off(\"select\", onSelect)\n        carousel.off(\"scroll\", onScroll)\n      }\n    }\n  }, [carousel, onInit, onScroll, onSelect])\n\n  useEffect(() => {\n    const stop = hover && stopMouseEnterAutoplay\n    const last = !carousel?.canScrollNext()\n\n    if (carousel && autoplay && !stop && !last) {\n      timeoutId.current = setInterval(() => {\n        carousel.scrollNext()\n      }, delay)\n    } else {\n      if (timeoutId.current) clearInterval(timeoutId.current)\n\n      timeoutId.current = null\n    }\n\n    return () => {\n      if (timeoutId.current) clearInterval(timeoutId.current)\n    }\n  }, [autoplay, carousel, delay, hover, stopMouseEnterAutoplay])\n\n  useUpdateEffect(() => {\n    if (!carousel) return\n\n    if (indexProp === undefined) return\n\n    carousel.scrollTo(indexProp)\n  }, [indexProp])\n\n  useUpdateEffect(() => {\n    if (!carousel) return\n\n    carousel.reInit()\n  }, [\n    carousel,\n    total,\n    align,\n    axis,\n    containScroll,\n    dragFree,\n    duration,\n    inViewThreshold,\n    loop,\n    skipSnaps,\n    slidesToScroll,\n  ])\n\n  const getRootProps: PropGetter<\"section\"> = useCallback(\n    ({ ref, ...props } = {}) =>\n      mergeProps(\n        {\n          id,\n          \"aria-roledescription\": \"carousel\",\n          \"data-orientation\": orientation,\n        },\n        rest,\n        {\n          ref,\n          onMouseEnter,\n          onMouseLeave,\n        },\n        props,\n      )(),\n    [id, onMouseEnter, onMouseLeave, rest, orientation],\n  )\n\n  const getListProps: PropGetter = useCallback(\n    ({ ref, ...props } = {}) => ({\n      id: listId,\n      \"aria-live\": autoplay ? \"off\" : \"polite\",\n      \"data-orientation\": orientation,\n      ...props,\n      ref: mergeRefs(ref, listRef, carouselRef),\n    }),\n    [autoplay, listId, orientation, carouselRef],\n  )\n\n  const getItemProps: RequiredPropGetter<\"div\", { index: number }> =\n    useCallback(\n      ({ index: indexProp, ...props }) => {\n        const page = indexProp + 1\n        const selected = index === indexProp\n\n        return {\n          id: `${listId}-${indexProp}`,\n          \"aria-label\": t(\"{page} of {total}\", { page, total }),\n          \"aria-roledescription\": \"slide\",\n          \"data-index\": indexProp.toString(),\n          \"data-orientation\": orientation,\n          \"data-selected\": dataAttr(selected),\n          role: \"tabpanel\",\n          ...props,\n        }\n      },\n      [index, listId, total, orientation, t],\n    )\n\n  const getPrevTriggerProps: PropGetter<\"button\"> = useCallback(\n    (props = {}) => ({\n      \"aria-controls\": listId,\n      \"aria-label\": t(\"Go to previous slide\"),\n      \"data-orientation\": orientation,\n      disabled: !carousel?.canScrollPrev(),\n      ...props,\n      onClick: handlerAll(props.onClick, () => carousel?.scrollPrev()),\n    }),\n    [carousel, listId, orientation, t],\n  )\n\n  const getNextTriggerProps: PropGetter<\"button\"> = useCallback(\n    (props = {}) => ({\n      \"aria-controls\": listId,\n      \"aria-label\": t(\"Go to next slide\"),\n      \"data-orientation\": orientation,\n      disabled: !carousel?.canScrollNext(),\n      ...props,\n      onClick: handlerAll(props.onClick, () => carousel?.scrollNext()),\n    }),\n    [carousel, listId, orientation, t],\n  )\n\n  const getIndicatorsProps: PropGetter = useCallback(\n    (props = {}) => ({\n      \"aria-label\": t(\"Slides\"),\n      \"aria-orientation\": orientation,\n      role: \"tablist\",\n      ...props,\n    }),\n    [orientation, t],\n  )\n\n  const getIndicatorProps: RequiredPropGetter<\"button\", { index: number }> =\n    useCallback(\n      ({ ref, index: indexProp, ...props }) => {\n        const page = indexProp + 1\n        const selected = index === indexProp\n\n        return {\n          type: \"button\" as const,\n          \"aria-controls\": `${listId}-${indexProp}`,\n          \"aria-label\": t(\"Go to {page} slide\", { page }),\n          \"aria-selected\": selected,\n          \"data-index\": indexProp.toString(),\n          \"data-orientation\": orientation,\n          \"data-selected\": dataAttr(selected),\n          role: \"tab\",\n          tabIndex: selected ? 0 : -1,\n          ...props,\n          ref: mergeRefs(ref, (node) => {\n            indicatorMapRef.current.set(indexProp, node)\n          }),\n          onClick: handlerAll(props.onClick, () =>\n            carousel?.scrollTo(indexProp),\n          ),\n          onKeyDown: handlerAll(props.onKeyDown, onKeyDown(indexProp)),\n        }\n      },\n      [index, listId, t, orientation, onKeyDown, carousel],\n    )\n\n  return {\n    carousel,\n    index,\n    setIndex,\n    snapCount,\n    total,\n    getIndicatorProps,\n    getIndicatorsProps,\n    getItemProps,\n    getListProps,\n    getNextTriggerProps,\n    getPrevTriggerProps,\n    getRootProps,\n  }\n}\n\nexport type UseCarouselReturn = ReturnType<typeof useCarousel>\n"],"mappings":"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"}

package/dist/cjs/components/tabs/use-tabs.cjs

@@ -6,6 +6,8 @@ const require_dom = require('../../utils/dom.cjs');
 const require_effect = require('../../utils/effect.cjs');
 const require_ref = require('../../utils/ref.cjs');
 const require_utils_index = require('../../utils/index.cjs');
+const require_props = require('../../core/components/props.cjs');
+require('../../core/index.cjs');
 const require_hooks_use_controllable_state_index = require('../../hooks/use-controllable-state/index.cjs');
 const require_hooks_use_descendants_index = require('../../hooks/use-descendants/index.cjs');
 let react = require("react");
@@ -63,12 +65,7 @@ const useTabs = ({ id, defaultIndex = 0, index: indexProp, manual = false, orien
 		setIndex(indexProp);
 		setFocusedIndex(indexProp);
 	}, [indexProp]);
-	const getRootProps = (0, react.useCallback)(({ ref, ...props } = {}) => ({
-		"data-orientation": orientation,
-		...rest,
-		...props,
-		ref: require_ref.mergeRefs(ref, rest.ref)
-	}), [orientation, rest]);
+	const getRootProps = (0, react.useCallback)(({ ref, ...props } = {}) => require_props.mergeProps({ "data-orientation": orientation }, rest, props, { ref })(), [orientation, rest]);
 	const getListProps = (0, react.useCallback)((props = {}) => ({
 		"aria-orientation": orientation,
 		role: "tablist",
@@ -116,7 +113,7 @@ const useTab = ({ id, disabled, index, ...rest }) => {
 	return {
 		index,
 		selected,
-		getRootProps: (0, react.useCallback)(({ ref, ...props } = {}) => ({
+		getRootProps: (0, react.useCallback)(({ ref, ...props } = {}) => require_props.mergeProps({
 			id,
 			type: "button",
 			"aria-controls": tabPanelId,
@@ -124,13 +121,11 @@ const useTab = ({ id, disabled, index, ...rest }) => {
 			"data-orientation": orientation,
 			disabled,
 			role: "tab",
-			tabIndex: selected ? 0 : -1,
-			...rest,
-			...props,
-			ref: require_ref.mergeRefs(ref, register),
+			tabIndex: selected ? 0 : -1
+		}, rest, props, { ref: require_ref.mergeRefs(ref, register) }, {
 			onClick: (0, require_utils_index.utils_exports.handlerAll)(props.onClick, rest.onClick, onClick),
 			onFocus: (0, require_utils_index.utils_exports.handlerAll)(props.onFocus, rest.onFocus, onFocus)
-		}), [
+		})({ mergeEvent: false }), [
 			disabled,
 			id,
 			onClick,
@@ -152,17 +147,14 @@ const useTabPanel = ({ id, "aria-labelledby": ariaLabelledbyProp, index, ...rest
 	return {
 		index,
 		selected,
-		getRootProps: (0, react.useCallback)(({ ref, "aria-labelledby": ariaLabelledby, ...props } = {}) => ({
+		getRootProps: (0, react.useCallback)(({ ref, "aria-labelledby": ariaLabelledby, ...props } = {}) => require_props.mergeProps({
 			id,
 			"aria-labelledby": (0, require_utils_index.utils_exports.cx)(ariaLabelledbyProp, ariaLabelledby, tabId),
 			"data-orientation": orientation,
 			hidden: !selected,
 			role: "tabpanel",
-			tabIndex: selected ? 0 : -1,
-			...rest,
-			...props,
-			ref: require_ref.mergeRefs(ref, register)
-		}), [
+			tabIndex: selected ? 0 : -1
+		}, rest, props, { ref: require_ref.mergeRefs(ref, register) })(), [
 			id,
 			ariaLabelledbyProp,
 			orientation,

package/dist/cjs/components/tabs/use-tabs.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"use-tabs.cjs","names":["createDescendants","createContext","useControllableState","getRootProps: PropGetter","mergeRefs","getListProps: PropGetter"],"sources":["../../../../src/components/tabs/use-tabs.ts"],"sourcesContent":["\"use client\"\n\nimport type { KeyboardEvent } from \"react\"\nimport type { HTMLProps, Orientation, PropGetter } from \"../../core\"\nimport { useCallback, useId, useState } from \"react\"\nimport { useControllableState } from \"../../hooks/use-controllable-state\"\nimport { createDescendants } from \"../../hooks/use-descendants\"\nimport {\n  createContext,\n  cx,\n  handlerAll,\n  isUndefined,\n  mergeRefs,\n  runKeyAction,\n  useUpdateEffect,\n} from \"../../utils\"\n\nconst {\n  DescendantsContext: TabDescendantsContext,\n  useDescendant: useTabDescendant,\n  useDescendants: useTabDescendants,\n} = createDescendants<HTMLButtonElement>()\n\nexport { TabDescendantsContext, useTabDescendant, useTabDescendants }\n\nconst {\n  DescendantsContext: TabPanelDescendantsContext,\n  useDescendant: useTabPanelDescendant,\n  useDescendants: useTabPanelDescendants,\n} = createDescendants<HTMLDivElement>()\n\nexport {\n  TabPanelDescendantsContext,\n  useTabPanelDescendant,\n  useTabPanelDescendants,\n}\n\ninterface TabsContext extends Omit<\n  UseTabsReturn,\n  \"getRootProps\" | \"tabDescendants\" | \"tabPanelDescendants\"\n> {}\n\nconst [TabsContext, useTabsContext] = createContext<TabsContext>({\n  name: \"TabsContext\",\n})\n\nexport { TabsContext, useTabsContext }\n\nexport interface UseTabsProps extends Omit<HTMLProps, \"onChange\"> {\n  /**\n   * The index of the selected tab.\n   */\n  defaultIndex?: number\n  /**\n   * The index of the selected tab.\n   */\n  index?: number\n  /**\n   * If `true`, the tabs will be manually activated and display its panel by pressing Space or Enter.\n   *\n   * If `false`, the tabs will be automatically activated and their panel is displayed when they receive focus.\n   *\n   * @default false\n   */\n  manual?: boolean\n  /**\n   * The orientation of the tabs.\n   *\n   * @default 'horizontal'\n   */\n  orientation?: Orientation\n  /**\n   * The callback invoked when the index changes.\n   */\n  onChange?: (index: number) => void\n}\n\nexport const useTabs = ({\n  id,\n  defaultIndex = 0,\n  index: indexProp,\n  manual = false,\n  orientation = \"horizontal\",\n  onChange,\n  ...rest\n}: UseTabsProps = {}) => {\n  const uuid = useId()\n  const tabDescendants = useTabDescendants()\n  const tabPanelDescendants = useTabPanelDescendants()\n  const [index, setIndex] = useControllableState({\n    defaultValue: defaultIndex,\n    value: indexProp,\n    onChange,\n  })\n  const [focusedIndex, setFocusedIndex] = useState<number>(index)\n  const horizontal = orientation === \"horizontal\"\n\n  id ??= uuid\n\n  const onFocusFirstTab = useCallback(() => {\n    const first = tabDescendants.enabledFirstValue()\n\n    if (first) first.node.focus()\n  }, [tabDescendants])\n\n  const onFocusLastTab = useCallback(() => {\n    const last = tabDescendants.enabledLastValue()\n\n    if (last) last.node.focus()\n  }, [tabDescendants])\n\n  const onFocusNextTab = useCallback(() => {\n    const next = tabDescendants.enabledNextValue(focusedIndex)\n\n    if (next) next.node.focus()\n  }, [tabDescendants, focusedIndex])\n\n  const onFocusPrevTab = useCallback(() => {\n    const prev = tabDescendants.enabledPrevValue(focusedIndex)\n\n    if (prev) prev.node.focus()\n  }, [tabDescendants, focusedIndex])\n\n  const onKeyDown = useCallback(\n    (ev: KeyboardEvent<HTMLDivElement>) => {\n      runKeyAction(ev, {\n        ArrowDown: !horizontal ? onFocusNextTab : undefined,\n        ArrowLeft: horizontal ? onFocusPrevTab : undefined,\n        ArrowRight: horizontal ? onFocusNextTab : undefined,\n        ArrowUp: !horizontal ? onFocusPrevTab : undefined,\n        End: onFocusLastTab,\n        Home: onFocusFirstTab,\n      })\n    },\n    [\n      horizontal,\n      onFocusNextTab,\n      onFocusPrevTab,\n      onFocusLastTab,\n      onFocusFirstTab,\n    ],\n  )\n\n  useUpdateEffect(() => {\n    if (isUndefined(indexProp)) return\n\n    setIndex(indexProp)\n    setFocusedIndex(indexProp)\n  }, [indexProp])\n\n  const getRootProps: PropGetter = useCallback(\n    ({ ref, ...props } = {}) => ({\n      \"data-orientation\": orientation,\n      ...rest,\n      ...props,\n      ref: mergeRefs(ref, rest.ref),\n    }),\n    [orientation, rest],\n  )\n\n  const getListProps: PropGetter = useCallback(\n    (props = {}) => ({\n      \"aria-orientation\": orientation,\n      role: \"tablist\",\n      ...props,\n      onKeyDown: handlerAll(props.onKeyDown, onKeyDown),\n    }),\n    [orientation, onKeyDown],\n  )\n\n  return {\n    id,\n    focusedIndex,\n    index,\n    manual,\n    orientation,\n    setFocusedIndex,\n    setIndex,\n    tabDescendants,\n    tabPanelDescendants,\n    getListProps,\n    getRootProps,\n  }\n}\n\nexport type UseTabsReturn = ReturnType<typeof useTabs>\n\nexport interface UseTabProps extends HTMLProps<\"button\"> {\n  /**\n   * The index of the tab.\n   */\n  index: number\n}\n\nexport const useTab = ({ id, disabled, index, ...rest }: UseTabProps) => {\n  const {\n    id: rootId,\n    index: selectedIndex,\n    manual,\n    orientation,\n    setFocusedIndex,\n    setIndex,\n  } = useTabsContext()\n  const { register } = useTabDescendant({ disabled })\n  const tabPanelId = `${rootId}-panel-${index}`\n  const selected = index === selectedIndex\n\n  id ??= `${rootId}-tab-${index}`\n\n  const onClick = useCallback(() => {\n    if (!disabled) setIndex(index)\n  }, [index, setIndex, disabled])\n\n  const onFocus = useCallback(() => {\n    if (disabled) return\n\n    setFocusedIndex(index)\n\n    if (!manual) setIndex(index)\n  }, [setFocusedIndex, index, manual, disabled, setIndex])\n\n  const getRootProps: PropGetter<\"button\"> = useCallback(\n    ({ ref, ...props } = {}) => ({\n      id,\n      type: \"button\",\n      \"aria-controls\": tabPanelId,\n      \"aria-selected\": selected,\n      \"data-orientation\": orientation,\n      disabled,\n      role: \"tab\",\n      tabIndex: selected ? 0 : -1,\n      ...rest,\n      ...props,\n      ref: mergeRefs(ref, register),\n      onClick: handlerAll(props.onClick, rest.onClick, onClick),\n      onFocus: handlerAll(props.onFocus, rest.onFocus, onFocus),\n    }),\n    [\n      disabled,\n      id,\n      onClick,\n      onFocus,\n      orientation,\n      register,\n      rest,\n      selected,\n      tabPanelId,\n    ],\n  )\n\n  return { index, selected, getRootProps }\n}\n\nexport type UseTabReturn = ReturnType<typeof useTab>\n\nexport interface UseTabPanelProps extends HTMLProps {\n  /**\n   * The index of the tab panel.\n   */\n  index: number\n}\n\nexport const useTabPanel = ({\n  id,\n  \"aria-labelledby\": ariaLabelledbyProp,\n  index,\n  ...rest\n}: UseTabPanelProps) => {\n  const { id: rootId, index: selectedIndex, orientation } = useTabsContext()\n  const { register } = useTabPanelDescendant()\n  const tabId = `${rootId}-tab-${index}`\n  const selected = index === selectedIndex\n\n  id ??= `${rootId}-panel-${index}`\n\n  const getRootProps: PropGetter = useCallback(\n    ({ ref, \"aria-labelledby\": ariaLabelledby, ...props } = {}) => ({\n      id,\n      \"aria-labelledby\": cx(ariaLabelledbyProp, ariaLabelledby, tabId),\n      \"data-orientation\": orientation,\n      hidden: !selected,\n      role: \"tabpanel\",\n      tabIndex: selected ? 0 : -1,\n      ...rest,\n      ...props,\n      ref: mergeRefs(ref, register),\n    }),\n    [id, ariaLabelledbyProp, orientation, register, rest, selected, tabId],\n  )\n\n  return { index, selected, getRootProps }\n}\n\nexport type UseTabPanelReturn = ReturnType<typeof useTabPanel>\n"],"mappings":"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"}
+{"version":3,"file":"use-tabs.cjs","names":["createDescendants","createContext","useControllableState","getRootProps: PropGetter","mergeProps","getListProps: PropGetter","mergeRefs"],"sources":["../../../../src/components/tabs/use-tabs.ts"],"sourcesContent":["\"use client\"\n\nimport type { KeyboardEvent } from \"react\"\nimport type { HTMLProps, Orientation, PropGetter } from \"../../core\"\nimport { useCallback, useId, useState } from \"react\"\nimport { mergeProps } from \"../../core\"\nimport { useControllableState } from \"../../hooks/use-controllable-state\"\nimport { createDescendants } from \"../../hooks/use-descendants\"\nimport {\n  createContext,\n  cx,\n  handlerAll,\n  isUndefined,\n  mergeRefs,\n  runKeyAction,\n  useUpdateEffect,\n} from \"../../utils\"\n\nconst {\n  DescendantsContext: TabDescendantsContext,\n  useDescendant: useTabDescendant,\n  useDescendants: useTabDescendants,\n} = createDescendants<HTMLButtonElement>()\n\nexport { TabDescendantsContext, useTabDescendant, useTabDescendants }\n\nconst {\n  DescendantsContext: TabPanelDescendantsContext,\n  useDescendant: useTabPanelDescendant,\n  useDescendants: useTabPanelDescendants,\n} = createDescendants<HTMLDivElement>()\n\nexport {\n  TabPanelDescendantsContext,\n  useTabPanelDescendant,\n  useTabPanelDescendants,\n}\n\ninterface TabsContext extends Omit<\n  UseTabsReturn,\n  \"getRootProps\" | \"tabDescendants\" | \"tabPanelDescendants\"\n> {}\n\nconst [TabsContext, useTabsContext] = createContext<TabsContext>({\n  name: \"TabsContext\",\n})\n\nexport { TabsContext, useTabsContext }\n\nexport interface UseTabsProps extends Omit<HTMLProps, \"onChange\"> {\n  /**\n   * The index of the selected tab.\n   */\n  defaultIndex?: number\n  /**\n   * The index of the selected tab.\n   */\n  index?: number\n  /**\n   * If `true`, the tabs will be manually activated and display its panel by pressing Space or Enter.\n   *\n   * If `false`, the tabs will be automatically activated and their panel is displayed when they receive focus.\n   *\n   * @default false\n   */\n  manual?: boolean\n  /**\n   * The orientation of the tabs.\n   *\n   * @default 'horizontal'\n   */\n  orientation?: Orientation\n  /**\n   * The callback invoked when the index changes.\n   */\n  onChange?: (index: number) => void\n}\n\nexport const useTabs = ({\n  id,\n  defaultIndex = 0,\n  index: indexProp,\n  manual = false,\n  orientation = \"horizontal\",\n  onChange,\n  ...rest\n}: UseTabsProps = {}) => {\n  const uuid = useId()\n  const tabDescendants = useTabDescendants()\n  const tabPanelDescendants = useTabPanelDescendants()\n  const [index, setIndex] = useControllableState({\n    defaultValue: defaultIndex,\n    value: indexProp,\n    onChange,\n  })\n  const [focusedIndex, setFocusedIndex] = useState<number>(index)\n  const horizontal = orientation === \"horizontal\"\n\n  id ??= uuid\n\n  const onFocusFirstTab = useCallback(() => {\n    const first = tabDescendants.enabledFirstValue()\n\n    if (first) first.node.focus()\n  }, [tabDescendants])\n\n  const onFocusLastTab = useCallback(() => {\n    const last = tabDescendants.enabledLastValue()\n\n    if (last) last.node.focus()\n  }, [tabDescendants])\n\n  const onFocusNextTab = useCallback(() => {\n    const next = tabDescendants.enabledNextValue(focusedIndex)\n\n    if (next) next.node.focus()\n  }, [tabDescendants, focusedIndex])\n\n  const onFocusPrevTab = useCallback(() => {\n    const prev = tabDescendants.enabledPrevValue(focusedIndex)\n\n    if (prev) prev.node.focus()\n  }, [tabDescendants, focusedIndex])\n\n  const onKeyDown = useCallback(\n    (ev: KeyboardEvent<HTMLDivElement>) => {\n      runKeyAction(ev, {\n        ArrowDown: !horizontal ? onFocusNextTab : undefined,\n        ArrowLeft: horizontal ? onFocusPrevTab : undefined,\n        ArrowRight: horizontal ? onFocusNextTab : undefined,\n        ArrowUp: !horizontal ? onFocusPrevTab : undefined,\n        End: onFocusLastTab,\n        Home: onFocusFirstTab,\n      })\n    },\n    [\n      horizontal,\n      onFocusNextTab,\n      onFocusPrevTab,\n      onFocusLastTab,\n      onFocusFirstTab,\n    ],\n  )\n\n  useUpdateEffect(() => {\n    if (isUndefined(indexProp)) return\n\n    setIndex(indexProp)\n    setFocusedIndex(indexProp)\n  }, [indexProp])\n\n  const getRootProps: PropGetter = useCallback(\n    ({ ref, ...props } = {}) =>\n      mergeProps({ \"data-orientation\": orientation }, rest, props, { ref })(),\n    [orientation, rest],\n  )\n\n  const getListProps: PropGetter = useCallback(\n    (props = {}) => ({\n      \"aria-orientation\": orientation,\n      role: \"tablist\",\n      ...props,\n      onKeyDown: handlerAll(props.onKeyDown, onKeyDown),\n    }),\n    [orientation, onKeyDown],\n  )\n\n  return {\n    id,\n    focusedIndex,\n    index,\n    manual,\n    orientation,\n    setFocusedIndex,\n    setIndex,\n    tabDescendants,\n    tabPanelDescendants,\n    getListProps,\n    getRootProps,\n  }\n}\n\nexport type UseTabsReturn = ReturnType<typeof useTabs>\n\nexport interface UseTabProps extends HTMLProps<\"button\"> {\n  /**\n   * The index of the tab.\n   */\n  index: number\n}\n\nexport const useTab = ({ id, disabled, index, ...rest }: UseTabProps) => {\n  const {\n    id: rootId,\n    index: selectedIndex,\n    manual,\n    orientation,\n    setFocusedIndex,\n    setIndex,\n  } = useTabsContext()\n  const { register } = useTabDescendant({ disabled })\n  const tabPanelId = `${rootId}-panel-${index}`\n  const selected = index === selectedIndex\n\n  id ??= `${rootId}-tab-${index}`\n\n  const onClick = useCallback(() => {\n    if (!disabled) setIndex(index)\n  }, [index, setIndex, disabled])\n\n  const onFocus = useCallback(() => {\n    if (disabled) return\n\n    setFocusedIndex(index)\n\n    if (!manual) setIndex(index)\n  }, [setFocusedIndex, index, manual, disabled, setIndex])\n\n  const getRootProps: PropGetter<\"button\"> = useCallback(\n    ({ ref, ...props } = {}) =>\n      mergeProps(\n        {\n          id,\n          type: \"button\",\n          \"aria-controls\": tabPanelId,\n          \"aria-selected\": selected,\n          \"data-orientation\": orientation,\n          disabled,\n          role: \"tab\",\n          tabIndex: selected ? 0 : -1,\n        },\n        rest,\n        props,\n        { ref: mergeRefs(ref, register) },\n        {\n          onClick: handlerAll(props.onClick, rest.onClick, onClick),\n          onFocus: handlerAll(props.onFocus, rest.onFocus, onFocus),\n        },\n      )({ mergeEvent: false }),\n    [\n      disabled,\n      id,\n      onClick,\n      onFocus,\n      orientation,\n      register,\n      rest,\n      selected,\n      tabPanelId,\n    ],\n  )\n\n  return { index, selected, getRootProps }\n}\n\nexport type UseTabReturn = ReturnType<typeof useTab>\n\nexport interface UseTabPanelProps extends HTMLProps {\n  /**\n   * The index of the tab panel.\n   */\n  index: number\n}\n\nexport const useTabPanel = ({\n  id,\n  \"aria-labelledby\": ariaLabelledbyProp,\n  index,\n  ...rest\n}: UseTabPanelProps) => {\n  const { id: rootId, index: selectedIndex, orientation } = useTabsContext()\n  const { register } = useTabPanelDescendant()\n  const tabId = `${rootId}-tab-${index}`\n  const selected = index === selectedIndex\n\n  id ??= `${rootId}-panel-${index}`\n\n  const getRootProps: PropGetter = useCallback(\n    ({ ref, \"aria-labelledby\": ariaLabelledby, ...props } = {}) =>\n      mergeProps(\n        {\n          id,\n          \"aria-labelledby\": cx(ariaLabelledbyProp, ariaLabelledby, tabId),\n          \"data-orientation\": orientation,\n          hidden: !selected,\n          role: \"tabpanel\",\n          tabIndex: selected ? 0 : -1,\n        },\n        rest,\n        props,\n        { ref: mergeRefs(ref, register) },\n      )(),\n    [id, ariaLabelledbyProp, orientation, register, rest, selected, tabId],\n  )\n\n  return { index, selected, getRootProps }\n}\n\nexport type UseTabPanelReturn = ReturnType<typeof useTabPanel>\n"],"mappings":";;;;;;;;;;;;;;;AAkBA,MAAM,EACJ,oBAAoB,uBACpB,eAAe,kBACf,gBAAgB,sBACdA,uDAAsC;AAI1C,MAAM,EACJ,oBAAoB,4BACpB,eAAe,uBACf,gBAAgB,2BACdA,uDAAmC;AAavC,MAAM,CAAC,aAAa,kBAAkBC,8BAA2B,EAC/D,MAAM,eACP,CAAC;AAiCF,MAAa,WAAW,EACtB,IACA,eAAe,GACf,OAAO,WACP,SAAS,OACT,cAAc,cACd,UACA,GAAG,SACa,EAAE,KAAK;CACvB,MAAM,yBAAc;CACpB,MAAM,iBAAiB,mBAAmB;CAC1C,MAAM,sBAAsB,wBAAwB;CACpD,MAAM,CAAC,OAAO,YAAYC,gEAAqB;EAC7C,cAAc;EACd,OAAO;EACP;EACD,CAAC;CACF,MAAM,CAAC,cAAc,uCAAoC,MAAM;CAC/D,MAAM,aAAa,gBAAgB;AAEnC,QAAO;CAEP,MAAM,+CAAoC;EACxC,MAAM,QAAQ,eAAe,mBAAmB;AAEhD,MAAI,MAAO,OAAM,KAAK,OAAO;IAC5B,CAAC,eAAe,CAAC;CAEpB,MAAM,8CAAmC;EACvC,MAAM,OAAO,eAAe,kBAAkB;AAE9C,MAAI,KAAM,MAAK,KAAK,OAAO;IAC1B,CAAC,eAAe,CAAC;CAEpB,MAAM,8CAAmC;EACvC,MAAM,OAAO,eAAe,iBAAiB,aAAa;AAE1D,MAAI,KAAM,MAAK,KAAK,OAAO;IAC1B,CAAC,gBAAgB,aAAa,CAAC;CAElC,MAAM,8CAAmC;EACvC,MAAM,OAAO,eAAe,iBAAiB,aAAa;AAE1D,MAAI,KAAM,MAAK,KAAK,OAAO;IAC1B,CAAC,gBAAgB,aAAa,CAAC;CAElC,MAAM,oCACH,OAAsC;AACrC,2BAAa,IAAI;GACf,WAAW,CAAC,aAAa,iBAAiB;GAC1C,WAAW,aAAa,iBAAiB;GACzC,YAAY,aAAa,iBAAiB;GAC1C,SAAS,CAAC,aAAa,iBAAiB;GACxC,KAAK;GACL,MAAM;GACP,CAAC;IAEJ;EACE;EACA;EACA;EACA;EACA;EACD,CACF;AAED,sCAAsB;AACpB,yDAAgB,UAAU,CAAE;AAE5B,WAAS,UAAU;AACnB,kBAAgB,UAAU;IACzB,CAAC,UAAU,CAAC;CAEf,MAAMC,uCACH,EAAE,KAAK,GAAG,UAAU,EAAE,KACrBC,yBAAW,EAAE,oBAAoB,aAAa,EAAE,MAAM,OAAO,EAAE,KAAK,CAAC,EAAE,EACzE,CAAC,aAAa,KAAK,CACpB;CAED,MAAMC,uCACH,QAAQ,EAAE,MAAM;EACf,oBAAoB;EACpB,MAAM;EACN,GAAG;EACH,6DAAsB,MAAM,WAAW,UAAU;EAClD,GACD,CAAC,aAAa,UAAU,CACzB;AAED,QAAO;EACL;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD;;AAYH,MAAa,UAAU,EAAE,IAAI,UAAU,OAAO,GAAG,WAAwB;CACvE,MAAM,EACJ,IAAI,QACJ,OAAO,eACP,QACA,aACA,iBACA,aACE,gBAAgB;CACpB,MAAM,EAAE,aAAa,iBAAiB,EAAE,UAAU,CAAC;CACnD,MAAM,aAAa,GAAG,OAAO,SAAS;CACtC,MAAM,WAAW,UAAU;AAE3B,QAAO,GAAG,OAAO,OAAO;CAExB,MAAM,uCAA4B;AAChC,MAAI,CAAC,SAAU,UAAS,MAAM;IAC7B;EAAC;EAAO;EAAU;EAAS,CAAC;CAE/B,MAAM,uCAA4B;AAChC,MAAI,SAAU;AAEd,kBAAgB,MAAM;AAEtB,MAAI,CAAC,OAAQ,UAAS,MAAM;IAC3B;EAAC;EAAiB;EAAO;EAAQ;EAAU;EAAS,CAAC;AAoCxD,QAAO;EAAE;EAAO;EAAU,sCAjCvB,EAAE,KAAK,GAAG,UAAU,EAAE,KACrBD,yBACE;GACE;GACA,MAAM;GACN,iBAAiB;GACjB,iBAAiB;GACjB,oBAAoB;GACpB;GACA,MAAM;GACN,UAAU,WAAW,IAAI;GAC1B,EACD,MACA,OACA,EAAE,KAAKE,sBAAU,KAAK,SAAS,EAAE,EACjC;GACE,2DAAoB,MAAM,SAAS,KAAK,SAAS,QAAQ;GACzD,2DAAoB,MAAM,SAAS,KAAK,SAAS,QAAQ;GAC1D,CACF,CAAC,EAAE,YAAY,OAAO,CAAC,EAC1B;GACE;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACD,CACF;EAEuC;;AAY1C,MAAa,eAAe,EAC1B,IACA,mBAAmB,oBACnB,OACA,GAAG,WACmB;CACtB,MAAM,EAAE,IAAI,QAAQ,OAAO,eAAe,gBAAgB,gBAAgB;CAC1E,MAAM,EAAE,aAAa,uBAAuB;CAC5C,MAAM,QAAQ,GAAG,OAAO,OAAO;CAC/B,MAAM,WAAW,UAAU;AAE3B,QAAO,GAAG,OAAO,SAAS;AAoB1B,QAAO;EAAE;EAAO;EAAU,sCAjBvB,EAAE,KAAK,mBAAmB,gBAAgB,GAAG,UAAU,EAAE,KACxDF,yBACE;GACE;GACA,6DAAsB,oBAAoB,gBAAgB,MAAM;GAChE,oBAAoB;GACpB,QAAQ,CAAC;GACT,MAAM;GACN,UAAU,WAAW,IAAI;GAC1B,EACD,MACA,OACA,EAAE,KAAKE,sBAAU,KAAK,SAAS,EAAE,CAClC,EAAE,EACL;GAAC;GAAI;GAAoB;GAAa;GAAU;GAAM;GAAU;GAAM,CACvE;EAEuC"}

package/dist/esm/components/carousel/use-carousel.js

@@ -5,6 +5,8 @@ import { runKeyAction, useIds } from "../../utils/dom.js";
 import { useUpdateEffect } from "../../utils/effect.js";
 import { assignRef, mergeRefs } from "../../utils/ref.js";
 import { utils_exports } from "../../utils/index.js";
+import { mergeProps } from "../../core/components/props.js";
+import "../../core/index.js";
 import { useControllableState } from "../../hooks/use-controllable-state/index.js";
 import { useI18n } from "../../providers/i18n-provider/i18n-provider.js";
 import "../../providers/i18n-provider/index.js";
@@ -169,16 +171,15 @@ const useCarousel = ({ id, align = "center", autoplay = false, containScroll = f
 		skipSnaps,
 		slidesToScroll
 	]);
-	const getRootProps = useCallback(({ ref, ...props } = {}) => ({
+	const getRootProps = useCallback(({ ref, ...props } = {}) => mergeProps({
 		id,
 		"aria-roledescription": "carousel",
-		"data-orientation": orientation,
-		...rest,
-		...props,
-		ref: mergeRefs(ref, rest.ref),
-		onMouseEnter: (0, utils_exports.handlerAll)(props.onMouseEnter, onMouseEnter),
-		onMouseLeave: (0, utils_exports.handlerAll)(props.onMouseLeave, onMouseLeave)
-	}), [
+		"data-orientation": orientation
+	}, rest, {
+		ref,
+		onMouseEnter,
+		onMouseLeave
+	}, props)(), [
 		id,
 		onMouseEnter,
 		onMouseLeave,

package/dist/esm/components/carousel/use-carousel.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-carousel.js","names":["createContext","snapCount","total","index","getRootProps: PropGetter<\"section\">","getListProps: PropGetter","getItemProps: RequiredPropGetter<\"div\", { index: number }>","indexProp","getPrevTriggerProps: PropGetter<\"button\">","getNextTriggerProps: PropGetter<\"button\">","getIndicatorsProps: PropGetter"],"sources":["../../../../src/components/carousel/use-carousel.ts"],"sourcesContent":["\"use client\"\n\nimport type {\n  EmblaCarouselType,\n  EmblaOptionsType,\n  EmblaPluginType,\n} from \"embla-carousel\"\nimport type { KeyboardEvent, RefObject } from \"react\"\nimport type {\n  HTMLProps,\n  Orientation,\n  PropGetter,\n  RequiredPropGetter,\n} from \"../../core\"\nimport useEmblaCarousel from \"embla-carousel-react\"\nimport { useCallback, useEffect, useRef, useState } from \"react\"\nimport { useBoolean } from \"../../hooks/use-boolean\"\nimport { useControllableState } from \"../../hooks/use-controllable-state\"\nimport { useI18n } from \"../../providers/i18n-provider\"\nimport {\n  assignRef,\n  createContext,\n  dataAttr,\n  handlerAll,\n  isFunction,\n  mergeRefs,\n  runKeyAction,\n  useIds,\n  useUpdateEffect,\n} from \"../../utils\"\n\ntype EmblaOptions = Required<EmblaOptionsType>\nexport type CarouselAlign = EmblaOptions[\"align\"]\nexport type CarouselContainScroll = EmblaOptions[\"containScroll\"]\nexport type CarouselInViewThreshold = EmblaOptions[\"inViewThreshold\"]\nexport type CarouselWatchDrag = EmblaOptions[\"watchDrag\"]\nexport type CarouselWatchResize = EmblaOptions[\"watchResize\"]\nexport type CarouselWatchSlides = EmblaOptions[\"watchSlides\"]\nexport type CarouselControl = EmblaCarouselType\nexport type CarouselPlugin = EmblaPluginType\n\nexport interface CarouselContext extends Omit<\n  UseCarouselReturn,\n  \"getRootProps\"\n> {}\n\nconst [CarouselContext, useCarouselContext] = createContext<CarouselContext>({\n  name: \"CarouselContext\",\n})\n\nexport { CarouselContext, useCarouselContext }\n\nexport interface UseCarouselProps extends Omit<\n  HTMLProps<\"section\">,\n  \"onChange\"\n> {\n  /**\n   * The alignment of the carousel.\n   *\n   * @default 'center'\n   */\n  align?: CarouselAlign\n  /**\n   * If `true`, the carousel will be autoplay.\n   *\n   * @default false\n   */\n  autoplay?: boolean\n  /**\n   * Clear leading and trailing empty space that causes excessive scrolling.\n   * Use trimSnaps to only use snap points that trigger scrolling or keepSnaps to keep them.\n   *\n   * @default false\n   */\n  containScroll?: CarouselContainScroll\n  /**\n   * Ref of the resizable item callback.\n   */\n  controlRef?: RefObject<CarouselControl | null>\n  /**\n   * The initial index of the carousel slide.\n   *\n   * @default 0\n   */\n  defaultIndex?: number\n  /**\n   * The number for the autoplay interval of the carousel.\n   *\n   * @default 4000\n   */\n  delay?: number\n  /**\n   * If `true`, momentum scrolling will be enabled.\n   *\n   * @default false\n   */\n  dragFree?: boolean\n  /**\n   * If `true`, carousel can be scrolled with mouse and touch interactions.\n   *\n   * @default true\n   */\n  draggable?: boolean\n  /**\n   * Set scroll duration when triggered by any of the API methods.\n   * Higher numbers enables slower scrolling.\n   * Drag interactions are not affected because duration is then determined by the drag force.\n   *\n   * @default 25\n   */\n  duration?: number\n  /**\n   * The index of the carousel slide.\n   */\n  index?: number\n  /**\n   * Choose a fraction representing the percentage portion of a slide that needs to be visible in order to be considered in view.\n   *\n   * @default 0\n   */\n  inViewThreshold?: CarouselInViewThreshold\n  /**\n   * If `true`, infinite looping.\n   * Automatically falls back to false if slide content isn't enough to loop.\n   *\n   * @default true\n   */\n  loop?: boolean\n  /**\n   * The orientation of the carousel.\n   *\n   * @default 'horizontal'\n   */\n  orientation?: Orientation\n  /**\n   * Embla plugins to use.\n   */\n  plugins?: CarouselPlugin[]\n  /**\n   * If `true`, allow the carousel to skip scroll snaps if it's dragged vigorously.\n   * Note that this option will be ignored if the dragFree option is set to true.\n   *\n   * @default false\n   */\n  skipSnaps?: boolean\n  /**\n   * The number of slides that should be scrolled with next or previous buttons.\n   *\n   * @default 1\n   */\n  slidesToScroll?: number\n  /**\n   * If `true`, autoplay will pause when the mouse entries over.\n   *\n   * @default true\n   */\n  stopMouseEnterAutoplay?: boolean\n  /**\n   * Enables for scrolling the carousel with mouse and touch interactions.\n   * Set this to `false` to disable drag events or pass a custom callback to add your own drag logic.\n   *\n   * @default true\n   */\n  watchDrag?: CarouselWatchDrag\n  /**\n   * Embla automatically watches the container and slides for size changes and runs `reInit` when any size has changed.\n   * Set this to `false` to disable this behaviour or pass a custom callback to add your own resize logic.\n   *\n   * @default true\n   */\n  watchResize?: CarouselWatchResize\n  /**\n   * Embla automatically watches the container for added and/or removed slides and runs `reInit` if needed.\n   * Set this to `false` to disable this behaviour or pass a custom callback to add your own slides changed logic.\n   *\n   * @default true\n   */\n  watchSlides?: CarouselWatchSlides\n  /**\n   * The callback invoked when carousel slide selected.\n   */\n  onChange?: (index: number) => void\n  /**\n   * A callback that return the current scroll amount when the carousel is scrolled.\n   */\n  onScrollProgress?: (progress: number) => void\n}\n\nexport const useCarousel = ({\n  id,\n  align = \"center\",\n  autoplay = false,\n  containScroll = false,\n  controlRef,\n  defaultIndex = 0,\n  delay = 4000,\n  dragFree = false,\n  draggable = true,\n  duration = 25,\n  index: indexProp,\n  inViewThreshold = 0,\n  loop = true,\n  orientation = \"horizontal\",\n  plugins = [],\n  skipSnaps = false,\n  slidesToScroll = 1,\n  stopMouseEnterAutoplay = true,\n  watchDrag = draggable,\n  watchResize: watchResizeProp = true,\n  watchSlides = true,\n  onChange,\n  onScrollProgress,\n  ...rest\n}: UseCarouselProps = {}) => {\n  const { t } = useI18n(\"carousel\")\n  const [index, setIndex] = useControllableState({\n    defaultValue: defaultIndex,\n    value: indexProp,\n    onChange,\n  })\n  const [rootId, listId] = useIds()\n  const [hover, { off: onMouseLeave, on: onMouseEnter }] = useBoolean()\n  const timeoutId = useRef<NodeJS.Timeout | null>(null)\n  const indicatorMapRef = useRef<Map<number, HTMLButtonElement | null>>(\n    new Map(),\n  )\n  const listRef = useRef<HTMLDivElement>(null)\n  const horizontal = orientation === \"horizontal\"\n  const axis = horizontal ? \"x\" : \"y\"\n  const [snapCount, setSnapCount] = useState(0)\n  const [total, setTotal] = useState(0)\n  const watchResize = useCallback<Extract<CarouselWatchResize, Function>>(\n    (methods, entries) => {\n      const result = isFunction(watchResizeProp)\n        ? watchResizeProp(methods, entries)\n        : true\n      const snapCount = methods.scrollSnapList().length\n      const total = methods.slideNodes().length\n\n      setSnapCount(snapCount)\n      setTotal(total)\n\n      return result\n    },\n    [watchResizeProp],\n  )\n  const [carouselRef, carousel] = useEmblaCarousel(\n    {\n      align,\n      axis,\n      container: listRef.current,\n      containScroll,\n      dragFree,\n      duration,\n      inViewThreshold,\n      loop,\n      skipSnaps,\n      slidesToScroll,\n      startIndex: defaultIndex,\n      watchDrag,\n      watchResize,\n      watchSlides,\n    },\n    plugins,\n  )\n\n  id ??= rootId\n\n  const onInit = useCallback((methods: CarouselControl) => {\n    const snapCount = methods.scrollSnapList().length\n    const total = methods.slideNodes().length\n\n    setSnapCount(snapCount)\n    setTotal(total)\n  }, [])\n\n  const onScroll = useCallback(() => {\n    if (!carousel) return\n\n    const progress = Math.round(\n      Math.max(0, Math.min(1, carousel.scrollProgress())) * 100,\n    )\n\n    onScrollProgress?.(progress)\n  }, [carousel, onScrollProgress])\n\n  const onSelect = useCallback(() => {\n    if (!carousel) return\n\n    const index = carousel.selectedScrollSnap()\n\n    setIndex(index)\n  }, [carousel, setIndex])\n\n  const onFocusIndicator = useCallback(\n    (index: number) => {\n      const el = indicatorMapRef.current.get(index)\n\n      el?.focus()\n      carousel?.scrollTo(index)\n    },\n    [carousel],\n  )\n\n  const onKeyDown = useCallback(\n    (index: number) => (ev: KeyboardEvent<HTMLButtonElement>) => {\n      const lastIndex = snapCount - 1\n\n      runKeyAction(ev, {\n        ArrowDown: () => {\n          if (horizontal) return\n\n          index = index === lastIndex ? 0 : index + 1\n\n          onFocusIndicator(index)\n        },\n        ArrowLeft: () => {\n          if (!horizontal) return\n\n          index = index === 0 ? lastIndex : index - 1\n\n          onFocusIndicator(index)\n        },\n        ArrowRight: () => {\n          if (!horizontal) return\n\n          index = index === lastIndex ? 0 : index + 1\n\n          onFocusIndicator(index)\n        },\n        ArrowUp: () => {\n          if (horizontal) return\n\n          index = index === 0 ? lastIndex : index - 1\n\n          onFocusIndicator(index)\n        },\n        End: () => {\n          onFocusIndicator(lastIndex)\n        },\n        Home: () => {\n          onFocusIndicator(0)\n        },\n      })\n    },\n    [snapCount, horizontal, onFocusIndicator],\n  )\n\n  assignRef(controlRef, carousel)\n\n  useEffect(() => {\n    if (carousel) {\n      carousel.on(\"reInit\", onInit)\n      carousel.on(\"select\", onSelect)\n      carousel.on(\"scroll\", onScroll)\n\n      onScroll()\n\n      return () => {\n        carousel.off(\"reInit\", onInit)\n        carousel.off(\"select\", onSelect)\n        carousel.off(\"scroll\", onScroll)\n      }\n    }\n  }, [carousel, onInit, onScroll, onSelect])\n\n  useEffect(() => {\n    const stop = hover && stopMouseEnterAutoplay\n    const last = !carousel?.canScrollNext()\n\n    if (carousel && autoplay && !stop && !last) {\n      timeoutId.current = setInterval(() => {\n        carousel.scrollNext()\n      }, delay)\n    } else {\n      if (timeoutId.current) clearInterval(timeoutId.current)\n\n      timeoutId.current = null\n    }\n\n    return () => {\n      if (timeoutId.current) clearInterval(timeoutId.current)\n    }\n  }, [autoplay, carousel, delay, hover, stopMouseEnterAutoplay])\n\n  useUpdateEffect(() => {\n    if (!carousel) return\n\n    if (indexProp === undefined) return\n\n    carousel.scrollTo(indexProp)\n  }, [indexProp])\n\n  useUpdateEffect(() => {\n    if (!carousel) return\n\n    carousel.reInit()\n  }, [\n    carousel,\n    total,\n    align,\n    axis,\n    containScroll,\n    dragFree,\n    duration,\n    inViewThreshold,\n    loop,\n    skipSnaps,\n    slidesToScroll,\n  ])\n\n  const getRootProps: PropGetter<\"section\"> = useCallback(\n    ({ ref, ...props } = {}) => ({\n      id,\n      \"aria-roledescription\": \"carousel\",\n      \"data-orientation\": orientation,\n      ...rest,\n      ...props,\n      ref: mergeRefs(ref, rest.ref),\n      onMouseEnter: handlerAll(props.onMouseEnter, onMouseEnter),\n      onMouseLeave: handlerAll(props.onMouseLeave, onMouseLeave),\n    }),\n    [id, onMouseEnter, onMouseLeave, rest, orientation],\n  )\n\n  const getListProps: PropGetter = useCallback(\n    ({ ref, ...props } = {}) => ({\n      id: listId,\n      \"aria-live\": autoplay ? \"off\" : \"polite\",\n      \"data-orientation\": orientation,\n      ...props,\n      ref: mergeRefs(ref, listRef, carouselRef),\n    }),\n    [autoplay, listId, orientation, carouselRef],\n  )\n\n  const getItemProps: RequiredPropGetter<\"div\", { index: number }> =\n    useCallback(\n      ({ index: indexProp, ...props }) => {\n        const page = indexProp + 1\n        const selected = index === indexProp\n\n        return {\n          id: `${listId}-${indexProp}`,\n          \"aria-label\": t(\"{page} of {total}\", { page, total }),\n          \"aria-roledescription\": \"slide\",\n          \"data-index\": indexProp.toString(),\n          \"data-orientation\": orientation,\n          \"data-selected\": dataAttr(selected),\n          role: \"tabpanel\",\n          ...props,\n        }\n      },\n      [index, listId, total, orientation, t],\n    )\n\n  const getPrevTriggerProps: PropGetter<\"button\"> = useCallback(\n    (props = {}) => ({\n      \"aria-controls\": listId,\n      \"aria-label\": t(\"Go to previous slide\"),\n      \"data-orientation\": orientation,\n      disabled: !carousel?.canScrollPrev(),\n      ...props,\n      onClick: handlerAll(props.onClick, () => carousel?.scrollPrev()),\n    }),\n    [carousel, listId, orientation, t],\n  )\n\n  const getNextTriggerProps: PropGetter<\"button\"> = useCallback(\n    (props = {}) => ({\n      \"aria-controls\": listId,\n      \"aria-label\": t(\"Go to next slide\"),\n      \"data-orientation\": orientation,\n      disabled: !carousel?.canScrollNext(),\n      ...props,\n      onClick: handlerAll(props.onClick, () => carousel?.scrollNext()),\n    }),\n    [carousel, listId, orientation, t],\n  )\n\n  const getIndicatorsProps: PropGetter = useCallback(\n    (props = {}) => ({\n      \"aria-label\": t(\"Slides\"),\n      \"aria-orientation\": orientation,\n      role: \"tablist\",\n      ...props,\n    }),\n    [orientation, t],\n  )\n\n  const getIndicatorProps: RequiredPropGetter<\"button\", { index: number }> =\n    useCallback(\n      ({ ref, index: indexProp, ...props }) => {\n        const page = indexProp + 1\n        const selected = index === indexProp\n\n        return {\n          type: \"button\" as const,\n          \"aria-controls\": `${listId}-${indexProp}`,\n          \"aria-label\": t(\"Go to {page} slide\", { page }),\n          \"aria-selected\": selected,\n          \"data-index\": indexProp.toString(),\n          \"data-orientation\": orientation,\n          \"data-selected\": dataAttr(selected),\n          role: \"tab\",\n          tabIndex: selected ? 0 : -1,\n          ...props,\n          ref: mergeRefs(ref, (node) => {\n            indicatorMapRef.current.set(indexProp, node)\n          }),\n          onClick: handlerAll(props.onClick, () =>\n            carousel?.scrollTo(indexProp),\n          ),\n          onKeyDown: handlerAll(props.onKeyDown, onKeyDown(indexProp)),\n        }\n      },\n      [index, listId, t, orientation, onKeyDown, carousel],\n    )\n\n  return {\n    carousel,\n    index,\n    setIndex,\n    snapCount,\n    total,\n    getIndicatorProps,\n    getIndicatorsProps,\n    getItemProps,\n    getListProps,\n    getNextTriggerProps,\n    getPrevTriggerProps,\n    getRootProps,\n  }\n}\n\nexport type UseCarouselReturn = ReturnType<typeof useCarousel>\n"],"mappings":";;;;;;;;;;;;;;;AA8CA,MAAM,CAAC,iBAAiB,sBAAsBA,gBAA+B,EAC3E,MAAM,mBACP,CAAC;AA4IF,MAAa,eAAe,EAC1B,IACA,QAAQ,UACR,WAAW,OACX,gBAAgB,OAChB,YACA,eAAe,GACf,QAAQ,KACR,WAAW,OACX,YAAY,MACZ,WAAW,IACX,OAAO,WACP,kBAAkB,GAClB,OAAO,MACP,cAAc,cACd,UAAU,EAAE,EACZ,YAAY,OACZ,iBAAiB,GACjB,yBAAyB,MACzB,YAAY,WACZ,aAAa,kBAAkB,MAC/B,cAAc,MACd,UACA,kBACA,GAAG,SACiB,EAAE,KAAK;CAC3B,MAAM,EAAE,MAAM,QAAQ,WAAW;CACjC,MAAM,CAAC,OAAO,YAAY,qBAAqB;EAC7C,cAAc;EACd,OAAO;EACP;EACD,CAAC;CACF,MAAM,CAAC,QAAQ,UAAU,QAAQ;CACjC,MAAM,CAAC,OAAO,EAAE,KAAK,cAAc,IAAI,kBAAkB,YAAY;CACrE,MAAM,YAAY,OAA8B,KAAK;CACrD,MAAM,kBAAkB,uBACtB,IAAI,KAAK,CACV;CACD,MAAM,UAAU,OAAuB,KAAK;CAC5C,MAAM,aAAa,gBAAgB;CACnC,MAAM,OAAO,aAAa,MAAM;CAChC,MAAM,CAAC,WAAW,gBAAgB,SAAS,EAAE;CAC7C,MAAM,CAAC,OAAO,YAAY,SAAS,EAAE;CACrC,MAAM,cAAc,aACjB,SAAS,YAAY;EACpB,MAAM,uCAAoB,gBAAgB,GACtC,gBAAgB,SAAS,QAAQ,GACjC;EACJ,MAAMC,cAAY,QAAQ,gBAAgB,CAAC;EAC3C,MAAMC,UAAQ,QAAQ,YAAY,CAAC;AAEnC,eAAaD,YAAU;AACvB,WAASC,QAAM;AAEf,SAAO;IAET,CAAC,gBAAgB,CAClB;CACD,MAAM,CAAC,aAAa,YAAY,iBAC9B;EACE;EACA;EACA,WAAW,QAAQ;EACnB;EACA;EACA;EACA;EACA;EACA;EACA;EACA,YAAY;EACZ;EACA;EACA;EACD,EACD,QACD;AAED,QAAO;CAEP,MAAM,SAAS,aAAa,YAA6B;EACvD,MAAMD,cAAY,QAAQ,gBAAgB,CAAC;EAC3C,MAAMC,UAAQ,QAAQ,YAAY,CAAC;AAEnC,eAAaD,YAAU;AACvB,WAASC,QAAM;IACd,EAAE,CAAC;CAEN,MAAM,WAAW,kBAAkB;AACjC,MAAI,CAAC,SAAU;EAEf,MAAM,WAAW,KAAK,MACpB,KAAK,IAAI,GAAG,KAAK,IAAI,GAAG,SAAS,gBAAgB,CAAC,CAAC,GAAG,IACvD;AAED,qBAAmB,SAAS;IAC3B,CAAC,UAAU,iBAAiB,CAAC;CAEhC,MAAM,WAAW,kBAAkB;AACjC,MAAI,CAAC,SAAU;AAIf,WAFc,SAAS,oBAAoB,CAE5B;IACd,CAAC,UAAU,SAAS,CAAC;CAExB,MAAM,mBAAmB,aACtB,YAAkB;AAGjB,EAFW,gBAAgB,QAAQ,IAAIC,QAAM,EAEzC,OAAO;AACX,YAAU,SAASA,QAAM;IAE3B,CAAC,SAAS,CACX;CAED,MAAM,YAAY,aACf,aAAmB,OAAyC;EAC3D,MAAM,YAAY,YAAY;AAE9B,eAAa,IAAI;GACf,iBAAiB;AACf,QAAI,WAAY;AAEhB,cAAQA,YAAU,YAAY,IAAIA,UAAQ;AAE1C,qBAAiBA,QAAM;;GAEzB,iBAAiB;AACf,QAAI,CAAC,WAAY;AAEjB,cAAQA,YAAU,IAAI,YAAYA,UAAQ;AAE1C,qBAAiBA,QAAM;;GAEzB,kBAAkB;AAChB,QAAI,CAAC,WAAY;AAEjB,cAAQA,YAAU,YAAY,IAAIA,UAAQ;AAE1C,qBAAiBA,QAAM;;GAEzB,eAAe;AACb,QAAI,WAAY;AAEhB,cAAQA,YAAU,IAAI,YAAYA,UAAQ;AAE1C,qBAAiBA,QAAM;;GAEzB,WAAW;AACT,qBAAiB,UAAU;;GAE7B,YAAY;AACV,qBAAiB,EAAE;;GAEtB,CAAC;IAEJ;EAAC;EAAW;EAAY;EAAiB,CAC1C;AAED,WAAU,YAAY,SAAS;AAE/B,iBAAgB;AACd,MAAI,UAAU;AACZ,YAAS,GAAG,UAAU,OAAO;AAC7B,YAAS,GAAG,UAAU,SAAS;AAC/B,YAAS,GAAG,UAAU,SAAS;AAE/B,aAAU;AAEV,gBAAa;AACX,aAAS,IAAI,UAAU,OAAO;AAC9B,aAAS,IAAI,UAAU,SAAS;AAChC,aAAS,IAAI,UAAU,SAAS;;;IAGnC;EAAC;EAAU;EAAQ;EAAU;EAAS,CAAC;AAE1C,iBAAgB;EACd,MAAM,OAAO,SAAS;EACtB,MAAM,OAAO,CAAC,UAAU,eAAe;AAEvC,MAAI,YAAY,YAAY,CAAC,QAAQ,CAAC,KACpC,WAAU,UAAU,kBAAkB;AACpC,YAAS,YAAY;KACpB,MAAM;OACJ;AACL,OAAI,UAAU,QAAS,eAAc,UAAU,QAAQ;AAEvD,aAAU,UAAU;;AAGtB,eAAa;AACX,OAAI,UAAU,QAAS,eAAc,UAAU,QAAQ;;IAExD;EAAC;EAAU;EAAU;EAAO;EAAO;EAAuB,CAAC;AAE9D,uBAAsB;AACpB,MAAI,CAAC,SAAU;AAEf,MAAI,cAAc,OAAW;AAE7B,WAAS,SAAS,UAAU;IAC3B,CAAC,UAAU,CAAC;AAEf,uBAAsB;AACpB,MAAI,CAAC,SAAU;AAEf,WAAS,QAAQ;IAChB;EACD;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;CAEF,MAAMC,eAAsC,aACzC,EAAE,KAAK,GAAG,UAAU,EAAE,MAAM;EAC3B;EACA,wBAAwB;EACxB,oBAAoB;EACpB,GAAG;EACH,GAAG;EACH,KAAK,UAAU,KAAK,KAAK,IAAI;EAC7B,4CAAyB,MAAM,cAAc,aAAa;EAC1D,4CAAyB,MAAM,cAAc,aAAa;EAC3D,GACD;EAAC;EAAI;EAAc;EAAc;EAAM;EAAY,CACpD;CAED,MAAMC,eAA2B,aAC9B,EAAE,KAAK,GAAG,UAAU,EAAE,MAAM;EAC3B,IAAI;EACJ,aAAa,WAAW,QAAQ;EAChC,oBAAoB;EACpB,GAAG;EACH,KAAK,UAAU,KAAK,SAAS,YAAY;EAC1C,GACD;EAAC;EAAU;EAAQ;EAAa;EAAY,CAC7C;CAED,MAAMC,eACJ,aACG,EAAE,OAAOC,aAAW,GAAG,YAAY;EAClC,MAAM,OAAOA,cAAY;EACzB,MAAM,WAAW,UAAUA;AAE3B,SAAO;GACL,IAAI,GAAG,OAAO,GAAGA;GACjB,cAAc,EAAE,qBAAqB;IAAE;IAAM;IAAO,CAAC;GACrD,wBAAwB;GACxB,cAAcA,YAAU,UAAU;GAClC,oBAAoB;GACpB,6CAA0B,SAAS;GACnC,MAAM;GACN,GAAG;GACJ;IAEH;EAAC;EAAO;EAAQ;EAAO;EAAa;EAAE,CACvC;CAEH,MAAMC,sBAA4C,aAC/C,QAAQ,EAAE,MAAM;EACf,iBAAiB;EACjB,cAAc,EAAE,uBAAuB;EACvC,oBAAoB;EACpB,UAAU,CAAC,UAAU,eAAe;EACpC,GAAG;EACH,uCAAoB,MAAM,eAAe,UAAU,YAAY,CAAC;EACjE,GACD;EAAC;EAAU;EAAQ;EAAa;EAAE,CACnC;CAED,MAAMC,sBAA4C,aAC/C,QAAQ,EAAE,MAAM;EACf,iBAAiB;EACjB,cAAc,EAAE,mBAAmB;EACnC,oBAAoB;EACpB,UAAU,CAAC,UAAU,eAAe;EACpC,GAAG;EACH,uCAAoB,MAAM,eAAe,UAAU,YAAY,CAAC;EACjE,GACD;EAAC;EAAU;EAAQ;EAAa;EAAE,CACnC;CAED,MAAMC,qBAAiC,aACpC,QAAQ,EAAE,MAAM;EACf,cAAc,EAAE,SAAS;EACzB,oBAAoB;EACpB,MAAM;EACN,GAAG;EACJ,GACD,CAAC,aAAa,EAAE,CACjB;AA+BD,QAAO;EACL;EACA;EACA;EACA;EACA;EACA,mBAlCA,aACG,EAAE,KAAK,OAAOH,aAAW,GAAG,YAAY;GACvC,MAAM,OAAOA,cAAY;GACzB,MAAM,WAAW,UAAUA;AAE3B,UAAO;IACL,MAAM;IACN,iBAAiB,GAAG,OAAO,GAAGA;IAC9B,cAAc,EAAE,sBAAsB,EAAE,MAAM,CAAC;IAC/C,iBAAiB;IACjB,cAAcA,YAAU,UAAU;IAClC,oBAAoB;IACpB,6CAA0B,SAAS;IACnC,MAAM;IACN,UAAU,WAAW,IAAI;IACzB,GAAG;IACH,KAAK,UAAU,MAAM,SAAS;AAC5B,qBAAgB,QAAQ,IAAIA,aAAW,KAAK;MAC5C;IACF,uCAAoB,MAAM,eACxB,UAAU,SAASA,YAAU,CAC9B;IACD,yCAAsB,MAAM,WAAW,UAAUA,YAAU,CAAC;IAC7D;KAEH;GAAC;GAAO;GAAQ;GAAG;GAAa;GAAW;GAAS,CACrD;EASD;EACA;EACA;EACA;EACA;EACA;EACD"}
+{"version":3,"file":"use-carousel.js","names":["createContext","snapCount","total","index","getRootProps: PropGetter<\"section\">","getListProps: PropGetter","getItemProps: RequiredPropGetter<\"div\", { index: number }>","indexProp","getPrevTriggerProps: PropGetter<\"button\">","getNextTriggerProps: PropGetter<\"button\">","getIndicatorsProps: PropGetter"],"sources":["../../../../src/components/carousel/use-carousel.ts"],"sourcesContent":["\"use client\"\n\nimport type {\n  EmblaCarouselType,\n  EmblaOptionsType,\n  EmblaPluginType,\n} from \"embla-carousel\"\nimport type { KeyboardEvent, RefObject } from \"react\"\nimport type {\n  HTMLProps,\n  Orientation,\n  PropGetter,\n  RequiredPropGetter,\n} from \"../../core\"\nimport useEmblaCarousel from \"embla-carousel-react\"\nimport { useCallback, useEffect, useRef, useState } from \"react\"\nimport { mergeProps } from \"../../core\"\nimport { useBoolean } from \"../../hooks/use-boolean\"\nimport { useControllableState } from \"../../hooks/use-controllable-state\"\nimport { useI18n } from \"../../providers/i18n-provider\"\nimport {\n  assignRef,\n  createContext,\n  dataAttr,\n  handlerAll,\n  isFunction,\n  mergeRefs,\n  runKeyAction,\n  useIds,\n  useUpdateEffect,\n} from \"../../utils\"\n\ntype EmblaOptions = Required<EmblaOptionsType>\nexport type CarouselAlign = EmblaOptions[\"align\"]\nexport type CarouselContainScroll = EmblaOptions[\"containScroll\"]\nexport type CarouselInViewThreshold = EmblaOptions[\"inViewThreshold\"]\nexport type CarouselWatchDrag = EmblaOptions[\"watchDrag\"]\nexport type CarouselWatchResize = EmblaOptions[\"watchResize\"]\nexport type CarouselWatchSlides = EmblaOptions[\"watchSlides\"]\nexport type CarouselControl = EmblaCarouselType\nexport type CarouselPlugin = EmblaPluginType\n\nexport interface CarouselContext extends Omit<\n  UseCarouselReturn,\n  \"getRootProps\"\n> {}\n\nconst [CarouselContext, useCarouselContext] = createContext<CarouselContext>({\n  name: \"CarouselContext\",\n})\n\nexport { CarouselContext, useCarouselContext }\n\nexport interface UseCarouselProps extends Omit<\n  HTMLProps<\"section\">,\n  \"onChange\"\n> {\n  /**\n   * The alignment of the carousel.\n   *\n   * @default 'center'\n   */\n  align?: CarouselAlign\n  /**\n   * If `true`, the carousel will be autoplay.\n   *\n   * @default false\n   */\n  autoplay?: boolean\n  /**\n   * Clear leading and trailing empty space that causes excessive scrolling.\n   * Use trimSnaps to only use snap points that trigger scrolling or keepSnaps to keep them.\n   *\n   * @default false\n   */\n  containScroll?: CarouselContainScroll\n  /**\n   * Ref of the resizable item callback.\n   */\n  controlRef?: RefObject<CarouselControl | null>\n  /**\n   * The initial index of the carousel slide.\n   *\n   * @default 0\n   */\n  defaultIndex?: number\n  /**\n   * The number for the autoplay interval of the carousel.\n   *\n   * @default 4000\n   */\n  delay?: number\n  /**\n   * If `true`, momentum scrolling will be enabled.\n   *\n   * @default false\n   */\n  dragFree?: boolean\n  /**\n   * If `true`, carousel can be scrolled with mouse and touch interactions.\n   *\n   * @default true\n   */\n  draggable?: boolean\n  /**\n   * Set scroll duration when triggered by any of the API methods.\n   * Higher numbers enables slower scrolling.\n   * Drag interactions are not affected because duration is then determined by the drag force.\n   *\n   * @default 25\n   */\n  duration?: number\n  /**\n   * The index of the carousel slide.\n   */\n  index?: number\n  /**\n   * Choose a fraction representing the percentage portion of a slide that needs to be visible in order to be considered in view.\n   *\n   * @default 0\n   */\n  inViewThreshold?: CarouselInViewThreshold\n  /**\n   * If `true`, infinite looping.\n   * Automatically falls back to false if slide content isn't enough to loop.\n   *\n   * @default true\n   */\n  loop?: boolean\n  /**\n   * The orientation of the carousel.\n   *\n   * @default 'horizontal'\n   */\n  orientation?: Orientation\n  /**\n   * Embla plugins to use.\n   */\n  plugins?: CarouselPlugin[]\n  /**\n   * If `true`, allow the carousel to skip scroll snaps if it's dragged vigorously.\n   * Note that this option will be ignored if the dragFree option is set to true.\n   *\n   * @default false\n   */\n  skipSnaps?: boolean\n  /**\n   * The number of slides that should be scrolled with next or previous buttons.\n   *\n   * @default 1\n   */\n  slidesToScroll?: number\n  /**\n   * If `true`, autoplay will pause when the mouse entries over.\n   *\n   * @default true\n   */\n  stopMouseEnterAutoplay?: boolean\n  /**\n   * Enables for scrolling the carousel with mouse and touch interactions.\n   * Set this to `false` to disable drag events or pass a custom callback to add your own drag logic.\n   *\n   * @default true\n   */\n  watchDrag?: CarouselWatchDrag\n  /**\n   * Embla automatically watches the container and slides for size changes and runs `reInit` when any size has changed.\n   * Set this to `false` to disable this behaviour or pass a custom callback to add your own resize logic.\n   *\n   * @default true\n   */\n  watchResize?: CarouselWatchResize\n  /**\n   * Embla automatically watches the container for added and/or removed slides and runs `reInit` if needed.\n   * Set this to `false` to disable this behaviour or pass a custom callback to add your own slides changed logic.\n   *\n   * @default true\n   */\n  watchSlides?: CarouselWatchSlides\n  /**\n   * The callback invoked when carousel slide selected.\n   */\n  onChange?: (index: number) => void\n  /**\n   * A callback that return the current scroll amount when the carousel is scrolled.\n   */\n  onScrollProgress?: (progress: number) => void\n}\n\nexport const useCarousel = ({\n  id,\n  align = \"center\",\n  autoplay = false,\n  containScroll = false,\n  controlRef,\n  defaultIndex = 0,\n  delay = 4000,\n  dragFree = false,\n  draggable = true,\n  duration = 25,\n  index: indexProp,\n  inViewThreshold = 0,\n  loop = true,\n  orientation = \"horizontal\",\n  plugins = [],\n  skipSnaps = false,\n  slidesToScroll = 1,\n  stopMouseEnterAutoplay = true,\n  watchDrag = draggable,\n  watchResize: watchResizeProp = true,\n  watchSlides = true,\n  onChange,\n  onScrollProgress,\n  ...rest\n}: UseCarouselProps = {}) => {\n  const { t } = useI18n(\"carousel\")\n  const [index, setIndex] = useControllableState({\n    defaultValue: defaultIndex,\n    value: indexProp,\n    onChange,\n  })\n  const [rootId, listId] = useIds()\n  const [hover, { off: onMouseLeave, on: onMouseEnter }] = useBoolean()\n  const timeoutId = useRef<NodeJS.Timeout | null>(null)\n  const indicatorMapRef = useRef<Map<number, HTMLButtonElement | null>>(\n    new Map(),\n  )\n  const listRef = useRef<HTMLDivElement>(null)\n  const horizontal = orientation === \"horizontal\"\n  const axis = horizontal ? \"x\" : \"y\"\n  const [snapCount, setSnapCount] = useState(0)\n  const [total, setTotal] = useState(0)\n  const watchResize = useCallback<Extract<CarouselWatchResize, Function>>(\n    (methods, entries) => {\n      const result = isFunction(watchResizeProp)\n        ? watchResizeProp(methods, entries)\n        : true\n      const snapCount = methods.scrollSnapList().length\n      const total = methods.slideNodes().length\n\n      setSnapCount(snapCount)\n      setTotal(total)\n\n      return result\n    },\n    [watchResizeProp],\n  )\n  const [carouselRef, carousel] = useEmblaCarousel(\n    {\n      align,\n      axis,\n      container: listRef.current,\n      containScroll,\n      dragFree,\n      duration,\n      inViewThreshold,\n      loop,\n      skipSnaps,\n      slidesToScroll,\n      startIndex: defaultIndex,\n      watchDrag,\n      watchResize,\n      watchSlides,\n    },\n    plugins,\n  )\n\n  id ??= rootId\n\n  const onInit = useCallback((methods: CarouselControl) => {\n    const snapCount = methods.scrollSnapList().length\n    const total = methods.slideNodes().length\n\n    setSnapCount(snapCount)\n    setTotal(total)\n  }, [])\n\n  const onScroll = useCallback(() => {\n    if (!carousel) return\n\n    const progress = Math.round(\n      Math.max(0, Math.min(1, carousel.scrollProgress())) * 100,\n    )\n\n    onScrollProgress?.(progress)\n  }, [carousel, onScrollProgress])\n\n  const onSelect = useCallback(() => {\n    if (!carousel) return\n\n    const index = carousel.selectedScrollSnap()\n\n    setIndex(index)\n  }, [carousel, setIndex])\n\n  const onFocusIndicator = useCallback(\n    (index: number) => {\n      const el = indicatorMapRef.current.get(index)\n\n      el?.focus()\n      carousel?.scrollTo(index)\n    },\n    [carousel],\n  )\n\n  const onKeyDown = useCallback(\n    (index: number) => (ev: KeyboardEvent<HTMLButtonElement>) => {\n      const lastIndex = snapCount - 1\n\n      runKeyAction(ev, {\n        ArrowDown: () => {\n          if (horizontal) return\n\n          index = index === lastIndex ? 0 : index + 1\n\n          onFocusIndicator(index)\n        },\n        ArrowLeft: () => {\n          if (!horizontal) return\n\n          index = index === 0 ? lastIndex : index - 1\n\n          onFocusIndicator(index)\n        },\n        ArrowRight: () => {\n          if (!horizontal) return\n\n          index = index === lastIndex ? 0 : index + 1\n\n          onFocusIndicator(index)\n        },\n        ArrowUp: () => {\n          if (horizontal) return\n\n          index = index === 0 ? lastIndex : index - 1\n\n          onFocusIndicator(index)\n        },\n        End: () => {\n          onFocusIndicator(lastIndex)\n        },\n        Home: () => {\n          onFocusIndicator(0)\n        },\n      })\n    },\n    [snapCount, horizontal, onFocusIndicator],\n  )\n\n  assignRef(controlRef, carousel)\n\n  useEffect(() => {\n    if (carousel) {\n      carousel.on(\"reInit\", onInit)\n      carousel.on(\"select\", onSelect)\n      carousel.on(\"scroll\", onScroll)\n\n      onScroll()\n\n      return () => {\n        carousel.off(\"reInit\", onInit)\n        carousel.off(\"select\", onSelect)\n        carousel.off(\"scroll\", onScroll)\n      }\n    }\n  }, [carousel, onInit, onScroll, onSelect])\n\n  useEffect(() => {\n    const stop = hover && stopMouseEnterAutoplay\n    const last = !carousel?.canScrollNext()\n\n    if (carousel && autoplay && !stop && !last) {\n      timeoutId.current = setInterval(() => {\n        carousel.scrollNext()\n      }, delay)\n    } else {\n      if (timeoutId.current) clearInterval(timeoutId.current)\n\n      timeoutId.current = null\n    }\n\n    return () => {\n      if (timeoutId.current) clearInterval(timeoutId.current)\n    }\n  }, [autoplay, carousel, delay, hover, stopMouseEnterAutoplay])\n\n  useUpdateEffect(() => {\n    if (!carousel) return\n\n    if (indexProp === undefined) return\n\n    carousel.scrollTo(indexProp)\n  }, [indexProp])\n\n  useUpdateEffect(() => {\n    if (!carousel) return\n\n    carousel.reInit()\n  }, [\n    carousel,\n    total,\n    align,\n    axis,\n    containScroll,\n    dragFree,\n    duration,\n    inViewThreshold,\n    loop,\n    skipSnaps,\n    slidesToScroll,\n  ])\n\n  const getRootProps: PropGetter<\"section\"> = useCallback(\n    ({ ref, ...props } = {}) =>\n      mergeProps(\n        {\n          id,\n          \"aria-roledescription\": \"carousel\",\n          \"data-orientation\": orientation,\n        },\n        rest,\n        {\n          ref,\n          onMouseEnter,\n          onMouseLeave,\n        },\n        props,\n      )(),\n    [id, onMouseEnter, onMouseLeave, rest, orientation],\n  )\n\n  const getListProps: PropGetter = useCallback(\n    ({ ref, ...props } = {}) => ({\n      id: listId,\n      \"aria-live\": autoplay ? \"off\" : \"polite\",\n      \"data-orientation\": orientation,\n      ...props,\n      ref: mergeRefs(ref, listRef, carouselRef),\n    }),\n    [autoplay, listId, orientation, carouselRef],\n  )\n\n  const getItemProps: RequiredPropGetter<\"div\", { index: number }> =\n    useCallback(\n      ({ index: indexProp, ...props }) => {\n        const page = indexProp + 1\n        const selected = index === indexProp\n\n        return {\n          id: `${listId}-${indexProp}`,\n          \"aria-label\": t(\"{page} of {total}\", { page, total }),\n          \"aria-roledescription\": \"slide\",\n          \"data-index\": indexProp.toString(),\n          \"data-orientation\": orientation,\n          \"data-selected\": dataAttr(selected),\n          role: \"tabpanel\",\n          ...props,\n        }\n      },\n      [index, listId, total, orientation, t],\n    )\n\n  const getPrevTriggerProps: PropGetter<\"button\"> = useCallback(\n    (props = {}) => ({\n      \"aria-controls\": listId,\n      \"aria-label\": t(\"Go to previous slide\"),\n      \"data-orientation\": orientation,\n      disabled: !carousel?.canScrollPrev(),\n      ...props,\n      onClick: handlerAll(props.onClick, () => carousel?.scrollPrev()),\n    }),\n    [carousel, listId, orientation, t],\n  )\n\n  const getNextTriggerProps: PropGetter<\"button\"> = useCallback(\n    (props = {}) => ({\n      \"aria-controls\": listId,\n      \"aria-label\": t(\"Go to next slide\"),\n      \"data-orientation\": orientation,\n      disabled: !carousel?.canScrollNext(),\n      ...props,\n      onClick: handlerAll(props.onClick, () => carousel?.scrollNext()),\n    }),\n    [carousel, listId, orientation, t],\n  )\n\n  const getIndicatorsProps: PropGetter = useCallback(\n    (props = {}) => ({\n      \"aria-label\": t(\"Slides\"),\n      \"aria-orientation\": orientation,\n      role: \"tablist\",\n      ...props,\n    }),\n    [orientation, t],\n  )\n\n  const getIndicatorProps: RequiredPropGetter<\"button\", { index: number }> =\n    useCallback(\n      ({ ref, index: indexProp, ...props }) => {\n        const page = indexProp + 1\n        const selected = index === indexProp\n\n        return {\n          type: \"button\" as const,\n          \"aria-controls\": `${listId}-${indexProp}`,\n          \"aria-label\": t(\"Go to {page} slide\", { page }),\n          \"aria-selected\": selected,\n          \"data-index\": indexProp.toString(),\n          \"data-orientation\": orientation,\n          \"data-selected\": dataAttr(selected),\n          role: \"tab\",\n          tabIndex: selected ? 0 : -1,\n          ...props,\n          ref: mergeRefs(ref, (node) => {\n            indicatorMapRef.current.set(indexProp, node)\n          }),\n          onClick: handlerAll(props.onClick, () =>\n            carousel?.scrollTo(indexProp),\n          ),\n          onKeyDown: handlerAll(props.onKeyDown, onKeyDown(indexProp)),\n        }\n      },\n      [index, listId, t, orientation, onKeyDown, carousel],\n    )\n\n  return {\n    carousel,\n    index,\n    setIndex,\n    snapCount,\n    total,\n    getIndicatorProps,\n    getIndicatorsProps,\n    getItemProps,\n    getListProps,\n    getNextTriggerProps,\n    getPrevTriggerProps,\n    getRootProps,\n  }\n}\n\nexport type UseCarouselReturn = ReturnType<typeof useCarousel>\n"],"mappings":"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"}

package/dist/esm/components/tabs/use-tabs.js

@@ -5,6 +5,8 @@ import { runKeyAction } from "../../utils/dom.js";
 import { useUpdateEffect } from "../../utils/effect.js";
 import { mergeRefs } from "../../utils/ref.js";
 import { utils_exports } from "../../utils/index.js";
+import { mergeProps } from "../../core/components/props.js";
+import "../../core/index.js";
 import { useControllableState } from "../../hooks/use-controllable-state/index.js";
 import { createDescendants } from "../../hooks/use-descendants/index.js";
 import { useCallback, useId, useState } from "react";
@@ -62,12 +64,7 @@ const useTabs = ({ id, defaultIndex = 0, index: indexProp, manual = false, orien
 		setIndex(indexProp);
 		setFocusedIndex(indexProp);
 	}, [indexProp]);
-	const getRootProps = useCallback(({ ref, ...props } = {}) => ({
-		"data-orientation": orientation,
-		...rest,
-		...props,
-		ref: mergeRefs(ref, rest.ref)
-	}), [orientation, rest]);
+	const getRootProps = useCallback(({ ref, ...props } = {}) => mergeProps({ "data-orientation": orientation }, rest, props, { ref })(), [orientation, rest]);
 	const getListProps = useCallback((props = {}) => ({
 		"aria-orientation": orientation,
 		role: "tablist",
@@ -115,7 +112,7 @@ const useTab = ({ id, disabled, index, ...rest }) => {
 	return {
 		index,
 		selected,
-		getRootProps: useCallback(({ ref, ...props } = {}) => ({
+		getRootProps: useCallback(({ ref, ...props } = {}) => mergeProps({
 			id,
 			type: "button",
 			"aria-controls": tabPanelId,
@@ -123,13 +120,11 @@ const useTab = ({ id, disabled, index, ...rest }) => {
 			"data-orientation": orientation,
 			disabled,
 			role: "tab",
-			tabIndex: selected ? 0 : -1,
-			...rest,
-			...props,
-			ref: mergeRefs(ref, register),
+			tabIndex: selected ? 0 : -1
+		}, rest, props, { ref: mergeRefs(ref, register) }, {
 			onClick: (0, utils_exports.handlerAll)(props.onClick, rest.onClick, onClick),
 			onFocus: (0, utils_exports.handlerAll)(props.onFocus, rest.onFocus, onFocus)
-		}), [
+		})({ mergeEvent: false }), [
 			disabled,
 			id,
 			onClick,
@@ -151,17 +146,14 @@ const useTabPanel = ({ id, "aria-labelledby": ariaLabelledbyProp, index, ...rest
 	return {
 		index,
 		selected,
-		getRootProps: useCallback(({ ref, "aria-labelledby": ariaLabelledby, ...props } = {}) => ({
+		getRootProps: useCallback(({ ref, "aria-labelledby": ariaLabelledby, ...props } = {}) => mergeProps({
 			id,
 			"aria-labelledby": (0, utils_exports.cx)(ariaLabelledbyProp, ariaLabelledby, tabId),
 			"data-orientation": orientation,
 			hidden: !selected,
 			role: "tabpanel",
-			tabIndex: selected ? 0 : -1,
-			...rest,
-			...props,
-			ref: mergeRefs(ref, register)
-		}), [
+			tabIndex: selected ? 0 : -1
+		}, rest, props, { ref: mergeRefs(ref, register) })(), [
 			id,
 			ariaLabelledbyProp,
 			orientation,

package/dist/esm/components/tabs/use-tabs.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-tabs.js","names":["createContext","getRootProps: PropGetter","getListProps: PropGetter"],"sources":["../../../../src/components/tabs/use-tabs.ts"],"sourcesContent":["\"use client\"\n\nimport type { KeyboardEvent } from \"react\"\nimport type { HTMLProps, Orientation, PropGetter } from \"../../core\"\nimport { useCallback, useId, useState } from \"react\"\nimport { useControllableState } from \"../../hooks/use-controllable-state\"\nimport { createDescendants } from \"../../hooks/use-descendants\"\nimport {\n  createContext,\n  cx,\n  handlerAll,\n  isUndefined,\n  mergeRefs,\n  runKeyAction,\n  useUpdateEffect,\n} from \"../../utils\"\n\nconst {\n  DescendantsContext: TabDescendantsContext,\n  useDescendant: useTabDescendant,\n  useDescendants: useTabDescendants,\n} = createDescendants<HTMLButtonElement>()\n\nexport { TabDescendantsContext, useTabDescendant, useTabDescendants }\n\nconst {\n  DescendantsContext: TabPanelDescendantsContext,\n  useDescendant: useTabPanelDescendant,\n  useDescendants: useTabPanelDescendants,\n} = createDescendants<HTMLDivElement>()\n\nexport {\n  TabPanelDescendantsContext,\n  useTabPanelDescendant,\n  useTabPanelDescendants,\n}\n\ninterface TabsContext extends Omit<\n  UseTabsReturn,\n  \"getRootProps\" | \"tabDescendants\" | \"tabPanelDescendants\"\n> {}\n\nconst [TabsContext, useTabsContext] = createContext<TabsContext>({\n  name: \"TabsContext\",\n})\n\nexport { TabsContext, useTabsContext }\n\nexport interface UseTabsProps extends Omit<HTMLProps, \"onChange\"> {\n  /**\n   * The index of the selected tab.\n   */\n  defaultIndex?: number\n  /**\n   * The index of the selected tab.\n   */\n  index?: number\n  /**\n   * If `true`, the tabs will be manually activated and display its panel by pressing Space or Enter.\n   *\n   * If `false`, the tabs will be automatically activated and their panel is displayed when they receive focus.\n   *\n   * @default false\n   */\n  manual?: boolean\n  /**\n   * The orientation of the tabs.\n   *\n   * @default 'horizontal'\n   */\n  orientation?: Orientation\n  /**\n   * The callback invoked when the index changes.\n   */\n  onChange?: (index: number) => void\n}\n\nexport const useTabs = ({\n  id,\n  defaultIndex = 0,\n  index: indexProp,\n  manual = false,\n  orientation = \"horizontal\",\n  onChange,\n  ...rest\n}: UseTabsProps = {}) => {\n  const uuid = useId()\n  const tabDescendants = useTabDescendants()\n  const tabPanelDescendants = useTabPanelDescendants()\n  const [index, setIndex] = useControllableState({\n    defaultValue: defaultIndex,\n    value: indexProp,\n    onChange,\n  })\n  const [focusedIndex, setFocusedIndex] = useState<number>(index)\n  const horizontal = orientation === \"horizontal\"\n\n  id ??= uuid\n\n  const onFocusFirstTab = useCallback(() => {\n    const first = tabDescendants.enabledFirstValue()\n\n    if (first) first.node.focus()\n  }, [tabDescendants])\n\n  const onFocusLastTab = useCallback(() => {\n    const last = tabDescendants.enabledLastValue()\n\n    if (last) last.node.focus()\n  }, [tabDescendants])\n\n  const onFocusNextTab = useCallback(() => {\n    const next = tabDescendants.enabledNextValue(focusedIndex)\n\n    if (next) next.node.focus()\n  }, [tabDescendants, focusedIndex])\n\n  const onFocusPrevTab = useCallback(() => {\n    const prev = tabDescendants.enabledPrevValue(focusedIndex)\n\n    if (prev) prev.node.focus()\n  }, [tabDescendants, focusedIndex])\n\n  const onKeyDown = useCallback(\n    (ev: KeyboardEvent<HTMLDivElement>) => {\n      runKeyAction(ev, {\n        ArrowDown: !horizontal ? onFocusNextTab : undefined,\n        ArrowLeft: horizontal ? onFocusPrevTab : undefined,\n        ArrowRight: horizontal ? onFocusNextTab : undefined,\n        ArrowUp: !horizontal ? onFocusPrevTab : undefined,\n        End: onFocusLastTab,\n        Home: onFocusFirstTab,\n      })\n    },\n    [\n      horizontal,\n      onFocusNextTab,\n      onFocusPrevTab,\n      onFocusLastTab,\n      onFocusFirstTab,\n    ],\n  )\n\n  useUpdateEffect(() => {\n    if (isUndefined(indexProp)) return\n\n    setIndex(indexProp)\n    setFocusedIndex(indexProp)\n  }, [indexProp])\n\n  const getRootProps: PropGetter = useCallback(\n    ({ ref, ...props } = {}) => ({\n      \"data-orientation\": orientation,\n      ...rest,\n      ...props,\n      ref: mergeRefs(ref, rest.ref),\n    }),\n    [orientation, rest],\n  )\n\n  const getListProps: PropGetter = useCallback(\n    (props = {}) => ({\n      \"aria-orientation\": orientation,\n      role: \"tablist\",\n      ...props,\n      onKeyDown: handlerAll(props.onKeyDown, onKeyDown),\n    }),\n    [orientation, onKeyDown],\n  )\n\n  return {\n    id,\n    focusedIndex,\n    index,\n    manual,\n    orientation,\n    setFocusedIndex,\n    setIndex,\n    tabDescendants,\n    tabPanelDescendants,\n    getListProps,\n    getRootProps,\n  }\n}\n\nexport type UseTabsReturn = ReturnType<typeof useTabs>\n\nexport interface UseTabProps extends HTMLProps<\"button\"> {\n  /**\n   * The index of the tab.\n   */\n  index: number\n}\n\nexport const useTab = ({ id, disabled, index, ...rest }: UseTabProps) => {\n  const {\n    id: rootId,\n    index: selectedIndex,\n    manual,\n    orientation,\n    setFocusedIndex,\n    setIndex,\n  } = useTabsContext()\n  const { register } = useTabDescendant({ disabled })\n  const tabPanelId = `${rootId}-panel-${index}`\n  const selected = index === selectedIndex\n\n  id ??= `${rootId}-tab-${index}`\n\n  const onClick = useCallback(() => {\n    if (!disabled) setIndex(index)\n  }, [index, setIndex, disabled])\n\n  const onFocus = useCallback(() => {\n    if (disabled) return\n\n    setFocusedIndex(index)\n\n    if (!manual) setIndex(index)\n  }, [setFocusedIndex, index, manual, disabled, setIndex])\n\n  const getRootProps: PropGetter<\"button\"> = useCallback(\n    ({ ref, ...props } = {}) => ({\n      id,\n      type: \"button\",\n      \"aria-controls\": tabPanelId,\n      \"aria-selected\": selected,\n      \"data-orientation\": orientation,\n      disabled,\n      role: \"tab\",\n      tabIndex: selected ? 0 : -1,\n      ...rest,\n      ...props,\n      ref: mergeRefs(ref, register),\n      onClick: handlerAll(props.onClick, rest.onClick, onClick),\n      onFocus: handlerAll(props.onFocus, rest.onFocus, onFocus),\n    }),\n    [\n      disabled,\n      id,\n      onClick,\n      onFocus,\n      orientation,\n      register,\n      rest,\n      selected,\n      tabPanelId,\n    ],\n  )\n\n  return { index, selected, getRootProps }\n}\n\nexport type UseTabReturn = ReturnType<typeof useTab>\n\nexport interface UseTabPanelProps extends HTMLProps {\n  /**\n   * The index of the tab panel.\n   */\n  index: number\n}\n\nexport const useTabPanel = ({\n  id,\n  \"aria-labelledby\": ariaLabelledbyProp,\n  index,\n  ...rest\n}: UseTabPanelProps) => {\n  const { id: rootId, index: selectedIndex, orientation } = useTabsContext()\n  const { register } = useTabPanelDescendant()\n  const tabId = `${rootId}-tab-${index}`\n  const selected = index === selectedIndex\n\n  id ??= `${rootId}-panel-${index}`\n\n  const getRootProps: PropGetter = useCallback(\n    ({ ref, \"aria-labelledby\": ariaLabelledby, ...props } = {}) => ({\n      id,\n      \"aria-labelledby\": cx(ariaLabelledbyProp, ariaLabelledby, tabId),\n      \"data-orientation\": orientation,\n      hidden: !selected,\n      role: \"tabpanel\",\n      tabIndex: selected ? 0 : -1,\n      ...rest,\n      ...props,\n      ref: mergeRefs(ref, register),\n    }),\n    [id, ariaLabelledbyProp, orientation, register, rest, selected, tabId],\n  )\n\n  return { index, selected, getRootProps }\n}\n\nexport type UseTabPanelReturn = ReturnType<typeof useTabPanel>\n"],"mappings":"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"}
+{"version":3,"file":"use-tabs.js","names":["createContext","getRootProps: PropGetter","getListProps: PropGetter"],"sources":["../../../../src/components/tabs/use-tabs.ts"],"sourcesContent":["\"use client\"\n\nimport type { KeyboardEvent } from \"react\"\nimport type { HTMLProps, Orientation, PropGetter } from \"../../core\"\nimport { useCallback, useId, useState } from \"react\"\nimport { mergeProps } from \"../../core\"\nimport { useControllableState } from \"../../hooks/use-controllable-state\"\nimport { createDescendants } from \"../../hooks/use-descendants\"\nimport {\n  createContext,\n  cx,\n  handlerAll,\n  isUndefined,\n  mergeRefs,\n  runKeyAction,\n  useUpdateEffect,\n} from \"../../utils\"\n\nconst {\n  DescendantsContext: TabDescendantsContext,\n  useDescendant: useTabDescendant,\n  useDescendants: useTabDescendants,\n} = createDescendants<HTMLButtonElement>()\n\nexport { TabDescendantsContext, useTabDescendant, useTabDescendants }\n\nconst {\n  DescendantsContext: TabPanelDescendantsContext,\n  useDescendant: useTabPanelDescendant,\n  useDescendants: useTabPanelDescendants,\n} = createDescendants<HTMLDivElement>()\n\nexport {\n  TabPanelDescendantsContext,\n  useTabPanelDescendant,\n  useTabPanelDescendants,\n}\n\ninterface TabsContext extends Omit<\n  UseTabsReturn,\n  \"getRootProps\" | \"tabDescendants\" | \"tabPanelDescendants\"\n> {}\n\nconst [TabsContext, useTabsContext] = createContext<TabsContext>({\n  name: \"TabsContext\",\n})\n\nexport { TabsContext, useTabsContext }\n\nexport interface UseTabsProps extends Omit<HTMLProps, \"onChange\"> {\n  /**\n   * The index of the selected tab.\n   */\n  defaultIndex?: number\n  /**\n   * The index of the selected tab.\n   */\n  index?: number\n  /**\n   * If `true`, the tabs will be manually activated and display its panel by pressing Space or Enter.\n   *\n   * If `false`, the tabs will be automatically activated and their panel is displayed when they receive focus.\n   *\n   * @default false\n   */\n  manual?: boolean\n  /**\n   * The orientation of the tabs.\n   *\n   * @default 'horizontal'\n   */\n  orientation?: Orientation\n  /**\n   * The callback invoked when the index changes.\n   */\n  onChange?: (index: number) => void\n}\n\nexport const useTabs = ({\n  id,\n  defaultIndex = 0,\n  index: indexProp,\n  manual = false,\n  orientation = \"horizontal\",\n  onChange,\n  ...rest\n}: UseTabsProps = {}) => {\n  const uuid = useId()\n  const tabDescendants = useTabDescendants()\n  const tabPanelDescendants = useTabPanelDescendants()\n  const [index, setIndex] = useControllableState({\n    defaultValue: defaultIndex,\n    value: indexProp,\n    onChange,\n  })\n  const [focusedIndex, setFocusedIndex] = useState<number>(index)\n  const horizontal = orientation === \"horizontal\"\n\n  id ??= uuid\n\n  const onFocusFirstTab = useCallback(() => {\n    const first = tabDescendants.enabledFirstValue()\n\n    if (first) first.node.focus()\n  }, [tabDescendants])\n\n  const onFocusLastTab = useCallback(() => {\n    const last = tabDescendants.enabledLastValue()\n\n    if (last) last.node.focus()\n  }, [tabDescendants])\n\n  const onFocusNextTab = useCallback(() => {\n    const next = tabDescendants.enabledNextValue(focusedIndex)\n\n    if (next) next.node.focus()\n  }, [tabDescendants, focusedIndex])\n\n  const onFocusPrevTab = useCallback(() => {\n    const prev = tabDescendants.enabledPrevValue(focusedIndex)\n\n    if (prev) prev.node.focus()\n  }, [tabDescendants, focusedIndex])\n\n  const onKeyDown = useCallback(\n    (ev: KeyboardEvent<HTMLDivElement>) => {\n      runKeyAction(ev, {\n        ArrowDown: !horizontal ? onFocusNextTab : undefined,\n        ArrowLeft: horizontal ? onFocusPrevTab : undefined,\n        ArrowRight: horizontal ? onFocusNextTab : undefined,\n        ArrowUp: !horizontal ? onFocusPrevTab : undefined,\n        End: onFocusLastTab,\n        Home: onFocusFirstTab,\n      })\n    },\n    [\n      horizontal,\n      onFocusNextTab,\n      onFocusPrevTab,\n      onFocusLastTab,\n      onFocusFirstTab,\n    ],\n  )\n\n  useUpdateEffect(() => {\n    if (isUndefined(indexProp)) return\n\n    setIndex(indexProp)\n    setFocusedIndex(indexProp)\n  }, [indexProp])\n\n  const getRootProps: PropGetter = useCallback(\n    ({ ref, ...props } = {}) =>\n      mergeProps({ \"data-orientation\": orientation }, rest, props, { ref })(),\n    [orientation, rest],\n  )\n\n  const getListProps: PropGetter = useCallback(\n    (props = {}) => ({\n      \"aria-orientation\": orientation,\n      role: \"tablist\",\n      ...props,\n      onKeyDown: handlerAll(props.onKeyDown, onKeyDown),\n    }),\n    [orientation, onKeyDown],\n  )\n\n  return {\n    id,\n    focusedIndex,\n    index,\n    manual,\n    orientation,\n    setFocusedIndex,\n    setIndex,\n    tabDescendants,\n    tabPanelDescendants,\n    getListProps,\n    getRootProps,\n  }\n}\n\nexport type UseTabsReturn = ReturnType<typeof useTabs>\n\nexport interface UseTabProps extends HTMLProps<\"button\"> {\n  /**\n   * The index of the tab.\n   */\n  index: number\n}\n\nexport const useTab = ({ id, disabled, index, ...rest }: UseTabProps) => {\n  const {\n    id: rootId,\n    index: selectedIndex,\n    manual,\n    orientation,\n    setFocusedIndex,\n    setIndex,\n  } = useTabsContext()\n  const { register } = useTabDescendant({ disabled })\n  const tabPanelId = `${rootId}-panel-${index}`\n  const selected = index === selectedIndex\n\n  id ??= `${rootId}-tab-${index}`\n\n  const onClick = useCallback(() => {\n    if (!disabled) setIndex(index)\n  }, [index, setIndex, disabled])\n\n  const onFocus = useCallback(() => {\n    if (disabled) return\n\n    setFocusedIndex(index)\n\n    if (!manual) setIndex(index)\n  }, [setFocusedIndex, index, manual, disabled, setIndex])\n\n  const getRootProps: PropGetter<\"button\"> = useCallback(\n    ({ ref, ...props } = {}) =>\n      mergeProps(\n        {\n          id,\n          type: \"button\",\n          \"aria-controls\": tabPanelId,\n          \"aria-selected\": selected,\n          \"data-orientation\": orientation,\n          disabled,\n          role: \"tab\",\n          tabIndex: selected ? 0 : -1,\n        },\n        rest,\n        props,\n        { ref: mergeRefs(ref, register) },\n        {\n          onClick: handlerAll(props.onClick, rest.onClick, onClick),\n          onFocus: handlerAll(props.onFocus, rest.onFocus, onFocus),\n        },\n      )({ mergeEvent: false }),\n    [\n      disabled,\n      id,\n      onClick,\n      onFocus,\n      orientation,\n      register,\n      rest,\n      selected,\n      tabPanelId,\n    ],\n  )\n\n  return { index, selected, getRootProps }\n}\n\nexport type UseTabReturn = ReturnType<typeof useTab>\n\nexport interface UseTabPanelProps extends HTMLProps {\n  /**\n   * The index of the tab panel.\n   */\n  index: number\n}\n\nexport const useTabPanel = ({\n  id,\n  \"aria-labelledby\": ariaLabelledbyProp,\n  index,\n  ...rest\n}: UseTabPanelProps) => {\n  const { id: rootId, index: selectedIndex, orientation } = useTabsContext()\n  const { register } = useTabPanelDescendant()\n  const tabId = `${rootId}-tab-${index}`\n  const selected = index === selectedIndex\n\n  id ??= `${rootId}-panel-${index}`\n\n  const getRootProps: PropGetter = useCallback(\n    ({ ref, \"aria-labelledby\": ariaLabelledby, ...props } = {}) =>\n      mergeProps(\n        {\n          id,\n          \"aria-labelledby\": cx(ariaLabelledbyProp, ariaLabelledby, tabId),\n          \"data-orientation\": orientation,\n          hidden: !selected,\n          role: \"tabpanel\",\n          tabIndex: selected ? 0 : -1,\n        },\n        rest,\n        props,\n        { ref: mergeRefs(ref, register) },\n      )(),\n    [id, ariaLabelledbyProp, orientation, register, rest, selected, tabId],\n  )\n\n  return { index, selected, getRootProps }\n}\n\nexport type UseTabPanelReturn = ReturnType<typeof useTabPanel>\n"],"mappings":";;;;;;;;;;;;;;AAkBA,MAAM,EACJ,oBAAoB,uBACpB,eAAe,kBACf,gBAAgB,sBACd,mBAAsC;AAI1C,MAAM,EACJ,oBAAoB,4BACpB,eAAe,uBACf,gBAAgB,2BACd,mBAAmC;AAavC,MAAM,CAAC,aAAa,kBAAkBA,gBAA2B,EAC/D,MAAM,eACP,CAAC;AAiCF,MAAa,WAAW,EACtB,IACA,eAAe,GACf,OAAO,WACP,SAAS,OACT,cAAc,cACd,UACA,GAAG,SACa,EAAE,KAAK;CACvB,MAAM,OAAO,OAAO;CACpB,MAAM,iBAAiB,mBAAmB;CAC1C,MAAM,sBAAsB,wBAAwB;CACpD,MAAM,CAAC,OAAO,YAAY,qBAAqB;EAC7C,cAAc;EACd,OAAO;EACP;EACD,CAAC;CACF,MAAM,CAAC,cAAc,mBAAmB,SAAiB,MAAM;CAC/D,MAAM,aAAa,gBAAgB;AAEnC,QAAO;CAEP,MAAM,kBAAkB,kBAAkB;EACxC,MAAM,QAAQ,eAAe,mBAAmB;AAEhD,MAAI,MAAO,OAAM,KAAK,OAAO;IAC5B,CAAC,eAAe,CAAC;CAEpB,MAAM,iBAAiB,kBAAkB;EACvC,MAAM,OAAO,eAAe,kBAAkB;AAE9C,MAAI,KAAM,MAAK,KAAK,OAAO;IAC1B,CAAC,eAAe,CAAC;CAEpB,MAAM,iBAAiB,kBAAkB;EACvC,MAAM,OAAO,eAAe,iBAAiB,aAAa;AAE1D,MAAI,KAAM,MAAK,KAAK,OAAO;IAC1B,CAAC,gBAAgB,aAAa,CAAC;CAElC,MAAM,iBAAiB,kBAAkB;EACvC,MAAM,OAAO,eAAe,iBAAiB,aAAa;AAE1D,MAAI,KAAM,MAAK,KAAK,OAAO;IAC1B,CAAC,gBAAgB,aAAa,CAAC;CAElC,MAAM,YAAY,aACf,OAAsC;AACrC,eAAa,IAAI;GACf,WAAW,CAAC,aAAa,iBAAiB;GAC1C,WAAW,aAAa,iBAAiB;GACzC,YAAY,aAAa,iBAAiB;GAC1C,SAAS,CAAC,aAAa,iBAAiB;GACxC,KAAK;GACL,MAAM;GACP,CAAC;IAEJ;EACE;EACA;EACA;EACA;EACA;EACD,CACF;AAED,uBAAsB;AACpB,qCAAgB,UAAU,CAAE;AAE5B,WAAS,UAAU;AACnB,kBAAgB,UAAU;IACzB,CAAC,UAAU,CAAC;CAEf,MAAMC,eAA2B,aAC9B,EAAE,KAAK,GAAG,UAAU,EAAE,KACrB,WAAW,EAAE,oBAAoB,aAAa,EAAE,MAAM,OAAO,EAAE,KAAK,CAAC,EAAE,EACzE,CAAC,aAAa,KAAK,CACpB;CAED,MAAMC,eAA2B,aAC9B,QAAQ,EAAE,MAAM;EACf,oBAAoB;EACpB,MAAM;EACN,GAAG;EACH,yCAAsB,MAAM,WAAW,UAAU;EAClD,GACD,CAAC,aAAa,UAAU,CACzB;AAED,QAAO;EACL;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD;;AAYH,MAAa,UAAU,EAAE,IAAI,UAAU,OAAO,GAAG,WAAwB;CACvE,MAAM,EACJ,IAAI,QACJ,OAAO,eACP,QACA,aACA,iBACA,aACE,gBAAgB;CACpB,MAAM,EAAE,aAAa,iBAAiB,EAAE,UAAU,CAAC;CACnD,MAAM,aAAa,GAAG,OAAO,SAAS;CACtC,MAAM,WAAW,UAAU;AAE3B,QAAO,GAAG,OAAO,OAAO;CAExB,MAAM,UAAU,kBAAkB;AAChC,MAAI,CAAC,SAAU,UAAS,MAAM;IAC7B;EAAC;EAAO;EAAU;EAAS,CAAC;CAE/B,MAAM,UAAU,kBAAkB;AAChC,MAAI,SAAU;AAEd,kBAAgB,MAAM;AAEtB,MAAI,CAAC,OAAQ,UAAS,MAAM;IAC3B;EAAC;EAAiB;EAAO;EAAQ;EAAU;EAAS,CAAC;AAoCxD,QAAO;EAAE;EAAO;EAAU,cAlCiB,aACxC,EAAE,KAAK,GAAG,UAAU,EAAE,KACrB,WACE;GACE;GACA,MAAM;GACN,iBAAiB;GACjB,iBAAiB;GACjB,oBAAoB;GACpB;GACA,MAAM;GACN,UAAU,WAAW,IAAI;GAC1B,EACD,MACA,OACA,EAAE,KAAK,UAAU,KAAK,SAAS,EAAE,EACjC;GACE,uCAAoB,MAAM,SAAS,KAAK,SAAS,QAAQ;GACzD,uCAAoB,MAAM,SAAS,KAAK,SAAS,QAAQ;GAC1D,CACF,CAAC,EAAE,YAAY,OAAO,CAAC,EAC1B;GACE;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACD,CACF;EAEuC;;AAY1C,MAAa,eAAe,EAC1B,IACA,mBAAmB,oBACnB,OACA,GAAG,WACmB;CACtB,MAAM,EAAE,IAAI,QAAQ,OAAO,eAAe,gBAAgB,gBAAgB;CAC1E,MAAM,EAAE,aAAa,uBAAuB;CAC5C,MAAM,QAAQ,GAAG,OAAO,OAAO;CAC/B,MAAM,WAAW,UAAU;AAE3B,QAAO,GAAG,OAAO,SAAS;AAoB1B,QAAO;EAAE;EAAO;EAAU,cAlBO,aAC9B,EAAE,KAAK,mBAAmB,gBAAgB,GAAG,UAAU,EAAE,KACxD,WACE;GACE;GACA,yCAAsB,oBAAoB,gBAAgB,MAAM;GAChE,oBAAoB;GACpB,QAAQ,CAAC;GACT,MAAM;GACN,UAAU,WAAW,IAAI;GAC1B,EACD,MACA,OACA,EAAE,KAAK,UAAU,KAAK,SAAS,EAAE,CAClC,EAAE,EACL;GAAC;GAAI;GAAoB;GAAa;GAAU;GAAM;GAAU;GAAM,CACvE;EAEuC"}

package/dist/types/components/accordion/accordion.d.ts

@@ -9,7 +9,7 @@ import "../collapse/index.js";
 import "../../index.js";
 import { AccordionStyle } from "./accordion.style.js";
 import { UseAccordionItemProps, UseAccordionProps } from "./use-accordion.js";
-import * as react99 from "react";
+import * as react469 from "react";
 
 //#region src/components/accordion/accordion.d.ts
 interface AccordionCallBackProps {
@@ -33,7 +33,7 @@ interface AccordionRootProps extends Omit<HTMLStyledProps, "onChange">, ThemePro
    */
   items?: AccordionItem[];
 }
-declare const AccordionPropsContext: react99.Context<Partial<AccordionRootProps> | undefined>, useAccordionPropsContext: () => Partial<AccordionRootProps> | undefined;
+declare const AccordionPropsContext: react469.Context<Partial<AccordionRootProps> | undefined>, useAccordionPropsContext: () => Partial<AccordionRootProps> | undefined;
 /**
  * `Accordion` is a component for a list that displays information in an expandable or collapsible manner.
  *

package/dist/types/components/accordion/accordion.style.d.ts

@@ -3,7 +3,7 @@ import { CSSModifierObject, CSSPropObject, CSSSlotObject } from "../../core/css/
 import "../../index.js";
 
 //#region src/components/accordion/accordion.style.d.ts
-declare const accordionStyle: ComponentSlotStyle<"button" | "panel" | "icon" | "root" | "item", CSSPropObject<CSSSlotObject<"button" | "panel" | "icon" | "root" | "item">>, CSSModifierObject<CSSSlotObject<"button" | "panel" | "icon" | "root" | "item">>, {
+declare const accordionStyle: ComponentSlotStyle<"button" | "panel" | "icon" | "item" | "root", CSSPropObject<CSSSlotObject<"button" | "panel" | "icon" | "item" | "root">>, CSSModifierObject<CSSSlotObject<"button" | "panel" | "icon" | "item" | "root">>, {
   panel: {
     button: {
       rounded: "l2";