@alto-avios/alto-ui 3.8.0 → 4.0.0

package/dist/IconButton.module-4obqG6tY.js

@@ -0,0 +1,1050 @@
+import * as React from "react";
+import { createContext, forwardRef, Fragment, useContext, useState, useId, useCallback, useRef, useEffect, useMemo, useLayoutEffect } from "react";
+import { jsx } from "react/jsx-runtime";
+import './assets/IconButton.css';function useAriaBusyScroll(host) {
+  useEffect(() => {
+    if (!host)
+      return;
+    function onscroll() {
+      if (!host)
+        return;
+      host.setAttribute("aria-busy", "true");
+      host.addEventListener("scrollend", onscrollend, { once: true });
+    }
+    function onscrollend() {
+      if (!host)
+        return;
+      host.setAttribute("aria-busy", "false");
+      host.addEventListener("scroll", onscroll, { once: true });
+    }
+    host.addEventListener("scroll", onscroll, { once: true });
+    host.addEventListener("scrollend", onscrollend);
+    return () => {
+      host.removeEventListener("scroll", onscroll);
+      host.removeEventListener("scrollend", onscrollend);
+    };
+  }, [host]);
+}
+function useMouseDrag(host) {
+  const dragging = useRef(false);
+  const handleDragging = useCallback(
+    (event) => {
+      if (!host)
+        return;
+      if (!dragging.current) {
+        host.style.setProperty("scroll-snap-type", "none");
+        dragging.current = true;
+      }
+      host.scrollBy({
+        left: -event.movementX,
+        top: -event.movementY,
+        behavior: "instant"
+      });
+    },
+    [host]
+  );
+  const handleDragEnd = useCallback(() => {
+    if (!host)
+      return;
+    document.removeEventListener("pointermove", handleDragging, {
+      capture: true
+    });
+    const startLeft = host.scrollLeft;
+    const startTop = host.scrollTop;
+    host.style.removeProperty("scroll-snap-type");
+    host.style.setProperty("overflow", "hidden");
+    const finalLeft = host.scrollLeft;
+    const finalTop = host.scrollTop;
+    host.style.removeProperty("overflow");
+    host.style.setProperty("scroll-snap-type", "none");
+    host.scrollTo({ left: startLeft, top: startTop, behavior: "instant" });
+    requestAnimationFrame(async () => {
+      if (startLeft !== finalLeft || startTop !== finalTop) {
+        host.scrollTo({
+          left: finalLeft,
+          top: finalTop,
+          behavior: "smooth"
+        });
+        await waitForEvent(host, "scrollend");
+      }
+      host.style.removeProperty("scroll-snap-type");
+    });
+    dragging.current = false;
+  }, [handleDragging, host]);
+  const handleDragStart = useCallback(
+    (event) => {
+      if (!host)
+        return;
+      let canDrag = event.button === 0;
+      if (canDrag) {
+        event.preventDefault();
+        document.addEventListener("pointermove", handleDragging, {
+          capture: true,
+          passive: true
+        });
+        document.addEventListener("pointerup", handleDragEnd, {
+          capture: true,
+          once: true
+        });
+      }
+    },
+    [handleDragEnd, handleDragging, host]
+  );
+  useEffect(() => {
+    return () => {
+      document.removeEventListener("pointermove", handleDragging, {
+        capture: true
+      });
+      document.removeEventListener("pointerup", handleDragEnd, {
+        capture: true
+      });
+    };
+  }, [handleDragEnd, handleDragging]);
+  return {
+    isDraggingRef: dragging,
+    scrollerProps: {
+      onMouseDown: handleDragStart
+    }
+  };
+}
+function waitForEvent(el, eventName) {
+  return new Promise((resolve) => {
+    function done(event) {
+      if (event.target === el) {
+        el.removeEventListener(eventName, done);
+        resolve();
+      }
+    }
+    el.addEventListener(eventName, done);
+  });
+}
+function useCallbackRef(callback) {
+  const callbackRef = useRef(callback);
+  useEffect(() => {
+    callbackRef.current = callback;
+  });
+  return useMemo(() => (...args) => {
+    var _a;
+    return (_a = callbackRef.current) == null ? void 0 : _a.call(callbackRef, ...args);
+  }, []);
+}
+var QUERY = "(prefers-reduced-motion: no-preference)";
+function usePrefersReducedMotion() {
+  const [prefersReducedMotion, setPrefersReducedMotion] = useState(false);
+  useEffect(() => {
+    const mediaQueryList = window.matchMedia(QUERY);
+    setPrefersReducedMotion(!window.matchMedia(QUERY).matches);
+    const listener = (event) => {
+      setPrefersReducedMotion(!event.matches);
+    };
+    mediaQueryList.addEventListener("change", listener);
+    return () => {
+      mediaQueryList.removeEventListener("change", listener);
+    };
+  }, []);
+  return prefersReducedMotion;
+}
+function assignRef(ref, value) {
+  if (typeof ref === "function") {
+    ref(value);
+  } else if (typeof ref === "object" && ref !== null && "current" in ref) {
+    ref.current = value;
+  }
+}
+function mergeRefs(...refs) {
+  return (node) => {
+    refs.forEach((ref) => assignRef(ref, node));
+  };
+}
+function useMergedRef(...refs) {
+  return useCallback(mergeRefs(...refs), refs);
+}
+function mergeProps(...args) {
+  let result = { ...args[0] };
+  for (let i = 1; i < args.length; i++) {
+    let props = args[i];
+    for (let key in props) {
+      let a = result[key];
+      let b = props[key];
+      if (typeof a === "function" && typeof b === "function" && // This is a lot faster than a regex.
+      key[0] === "o" && key[1] === "n" && key.charCodeAt(2) >= /* 'A' */
+      65 && key.charCodeAt(2) <= /* 'Z' */
+      90) {
+        result[key] = chain(a, b);
+      } else if (key === "className" && typeof a === "string" && typeof b === "string") {
+        result[key] = [a, b].join();
+      } else {
+        result[key] = b !== void 0 ? b : a;
+      }
+    }
+  }
+  return result;
+}
+function chain(...callbacks) {
+  return (...args) => {
+    for (let callback of callbacks) {
+      if (typeof callback === "function") {
+        callback(...args);
+      }
+    }
+  };
+}
+function noop() {
+}
+function clamp(min, value, max) {
+  if (value < min) {
+    return min;
+  }
+  if (value > max) {
+    return max;
+  }
+  return value;
+}
+function useCarouselState({
+  itemsPerPage = 1,
+  scrollBy = "page",
+  loop = false,
+  initialPages = [],
+  isDraggingRef,
+  mouseDragging,
+  onActivePageIndexChange: propChangeHandler
+}, host) {
+  const onActivePageIndexChange = useCallbackRef(propChangeHandler);
+  const [activePageIndex, setActivePageIndex] = useState(0);
+  const [pages, setPages] = useState(initialPages);
+  const prefersReducedMotion = usePrefersReducedMotion();
+  const getItems = useCallback(
+    ({ includeClones } = { includeClones: false }) => {
+      if (!host)
+        return [];
+      let allChildren = Array.from(host.children);
+      if (includeClones)
+        return allChildren;
+      return allChildren.filter((child) => !child.hasAttribute("data-clone"));
+    },
+    [host]
+  );
+  const scrollToItem = useCallback(
+    (slide, behavior = "smooth") => {
+      if (!host)
+        return;
+      const scrollContainerRect = host.getBoundingClientRect();
+      const nextSlideRect = slide.getBoundingClientRect();
+      const nextLeft = nextSlideRect.left - scrollContainerRect.left;
+      const nextTop = nextSlideRect.top - scrollContainerRect.top;
+      host.scrollTo({
+        left: nextLeft + host.scrollLeft,
+        top: nextTop + host.scrollTop,
+        behavior: prefersReducedMotion ? "instant" : behavior
+      });
+    },
+    [prefersReducedMotion, host]
+  );
+  const scrollToPage = useCallback(
+    (index, behavior) => {
+      const items = getItems();
+      const page = pages[index];
+      const itemIndex = page == null ? void 0 : page[0];
+      if (items[itemIndex]) {
+        scrollToItem(items[itemIndex], behavior);
+      }
+    },
+    [getItems, pages, scrollToItem]
+  );
+  const updateSnaps = useCallback(() => {
+    const actualItemsPerPage = Math.floor(itemsPerPage);
+    getItems({ includeClones: true }).forEach((item, index) => {
+      const shouldSnap = scrollBy === "item" || (index + actualItemsPerPage) % actualItemsPerPage === 0;
+      if (shouldSnap) {
+        item.style.setProperty("scroll-snap-align", "start");
+      } else {
+        item.style.removeProperty("scroll-snap-align");
+      }
+    });
+  }, [getItems, itemsPerPage, scrollBy]);
+  const calculatePages = useCallback(() => {
+    const items = getItems();
+    const actualItemsPerPage = Math.floor(itemsPerPage);
+    let newPages = items.reduce((acc, _, i) => {
+      const currPage = acc.at(-1);
+      if (currPage && currPage.length < actualItemsPerPage) {
+        currPage.push(i);
+      } else {
+        acc.push([i]);
+      }
+      return acc;
+    }, []);
+    if (newPages.length >= 2) {
+      let deficit = actualItemsPerPage - newPages.at(-1).length;
+      if (deficit > 0) {
+        const fill = [...newPages.at(-2)].splice(actualItemsPerPage - deficit);
+        newPages.at(-1).unshift(...fill);
+      }
+    }
+    setPages(newPages);
+    setActivePageIndex((prev2) => {
+      const index = clamp(0, prev2, newPages.length - 1);
+      if (index !== prev2) {
+        onActivePageIndexChange == null ? void 0 : onActivePageIndexChange({ index });
+      }
+      return index;
+    });
+  }, [getItems, itemsPerPage, onActivePageIndexChange]);
+  const scrollToPageIndex = useCallback(
+    (index) => {
+      const items = getItems();
+      const itemsWithClones = getItems({ includeClones: true });
+      const pagesWithClones = [pages.at(-1), ...pages, pages[0]];
+      if (!items.length)
+        return -1;
+      let nextItem, nextPageIndex, nextPage;
+      if (loop === "infinite") {
+        let nextIndex = clamp(-1, index, pagesWithClones.length);
+        if (nextIndex < 0) {
+          nextItem = itemsWithClones[0];
+          nextPageIndex = pages.length - 1;
+          nextPage = pages[nextPageIndex];
+        } else if (nextIndex >= pages.length) {
+          nextItem = itemsWithClones.at(-1 * itemsPerPage);
+          nextPageIndex = 0;
+          nextPage = pages[0];
+        } else {
+          nextPageIndex = nextIndex;
+          nextPage = pages[nextIndex];
+          nextItem = items[nextPage[0]];
+        }
+      } else if (loop === "native") {
+        nextPageIndex = index > pages.length - 1 ? 0 : index < 0 ? pages.length - 1 : index;
+        nextPage = pages[nextPageIndex];
+        let itemIndex = nextPage[0];
+        nextItem = items[itemIndex];
+      } else {
+        nextPageIndex = clamp(0, index, pages.length - 1);
+        nextPage = pages[nextPageIndex];
+        let itemIndex = nextPage[0];
+        nextItem = items[itemIndex];
+      }
+      scrollToItem(nextItem);
+      return nextPageIndex;
+    },
+    [getItems, itemsPerPage, loop, pages, scrollToItem]
+  );
+  const next = useCallback(() => {
+    return scrollToPageIndex(activePageIndex + 1);
+  }, [activePageIndex, scrollToPageIndex]);
+  const prev = useCallback(() => {
+    return scrollToPageIndex(activePageIndex - 1);
+  }, [activePageIndex, scrollToPageIndex]);
+  useEffect(() => {
+    if (!host || pages.length === 0)
+      return;
+    getItems({ includeClones: true }).forEach((item) => {
+      if (item.hasAttribute("data-clone")) {
+        item.remove();
+      }
+    });
+    if (loop === "infinite") {
+      const items = getItems();
+      const firstPage = pages[0];
+      const lastPage = [...pages.at(-1)];
+      if (firstPage === lastPage)
+        return;
+      lastPage.reverse().forEach((slide) => {
+        const clone = items[slide].cloneNode(true);
+        clone.setAttribute("data-clone", "true");
+        clone.setAttribute("inert", "true");
+        clone.setAttribute("aria-hidden", "true");
+        host.prepend(clone);
+      });
+      firstPage.forEach((slide) => {
+        const clone = items[slide].cloneNode(true);
+        clone.setAttribute("data-clone", "true");
+        clone.setAttribute("inert", "true");
+        clone.setAttribute("aria-hidden", "true");
+        host.append(clone);
+      });
+    }
+    updateSnaps();
+    scrollToPage(activePageIndex, "instant");
+  }, [
+    // activePageIndex,
+    getItems,
+    loop,
+    pages,
+    scrollToPage,
+    host,
+    updateSnaps
+  ]);
+  useEffect(() => {
+    if (!host)
+      return;
+    calculatePages();
+    updateSnaps();
+    const mutationObserver = new MutationObserver((mutations) => {
+      const childrenChanged = mutations.some(
+        (mutation) => (
+          // @ts-expect-error This is fine
+          [...mutation.addedNodes, ...mutation.removedNodes].some(
+            (el) => el.hasAttribute("data-carousel-item") && !el.hasAttribute("data-clone")
+          )
+        )
+      );
+      if (childrenChanged) {
+        calculatePages();
+        updateSnaps();
+      }
+    });
+    mutationObserver.observe(host, { childList: true, subtree: true });
+    return () => {
+      mutationObserver.disconnect();
+    };
+  }, [getItems, host, calculatePages, updateSnaps]);
+  useEffect(() => {
+    if (!host)
+      return;
+    const hasIntersected = /* @__PURE__ */ new Set();
+    const intersectionObserver = new IntersectionObserver(
+      (entries) => {
+        for (const entry of entries) {
+          if (entry.isIntersecting && !hasIntersected.has(entry.target)) {
+            hasIntersected.add(entry.target);
+          }
+          if (!entry.isIntersecting) {
+            hasIntersected.delete(entry.target);
+          }
+        }
+      },
+      {
+        root: host,
+        threshold: 0.6
+      }
+    );
+    const children = getItems({ includeClones: true });
+    for (let child of children) {
+      intersectionObserver.observe(child);
+    }
+    function handleScrollEnd() {
+      if (hasIntersected.size === 0)
+        return;
+      const sorted = [...hasIntersected].sort((a, b) => {
+        return a.compareDocumentPosition(b) & Node.DOCUMENT_POSITION_FOLLOWING ? -1 : 1;
+      });
+      const firstIntersecting = sorted[0];
+      if (loop === "infinite" && firstIntersecting.hasAttribute("data-clone") && !(mouseDragging && (isDraggingRef == null ? void 0 : isDraggingRef.current))) {
+        const cloneIndex = firstIntersecting.getAttribute("data-carousel-item");
+        const actualItem = getItems().find(
+          (el) => el.getAttribute("data-carousel-item") === cloneIndex
+        );
+        requestAnimationFrame(() => {
+          requestAnimationFrame(() => {
+            scrollToItem(actualItem, "instant");
+          });
+        });
+      } else {
+        const indexString = firstIntersecting.dataset.carouselItem;
+        if (process.env.NODE_ENV !== "production") {
+          if (!indexString) {
+            throw new Error(
+              "Failed to find data-carousel-item HTML attribute on an item."
+            );
+          }
+        }
+        setActivePageIndex((prev2) => {
+          const slideIndex = parseInt(indexString, 10);
+          const activePage = pages.findIndex((page) => page[0] === slideIndex);
+          const newIndex = clamp(0, activePage, getItems().length);
+          if (prev2 !== newIndex) {
+            onActivePageIndexChange == null ? void 0 : onActivePageIndexChange({ index: newIndex });
+          }
+          return newIndex;
+        });
+      }
+    }
+    let timeout;
+    function handleScroll() {
+      clearTimeout(timeout);
+      timeout = setTimeout(() => {
+        if (mouseDragging && (isDraggingRef == null ? void 0 : isDraggingRef.current))
+          return;
+        handleScrollEnd();
+      }, 150);
+    }
+    host.addEventListener("scroll", handleScroll, { passive: true });
+    return () => {
+      clearTimeout(timeout);
+      for (let child of children) {
+        intersectionObserver.unobserve(child);
+      }
+      intersectionObserver.disconnect();
+      host.removeEventListener("scroll", handleScroll);
+    };
+  }, [
+    getItems,
+    isDraggingRef,
+    loop,
+    mouseDragging,
+    onActivePageIndexChange,
+    pages,
+    scrollToItem,
+    host
+  ]);
+  return useMemo(
+    () => ({
+      itemsPerPage,
+      activePageIndex,
+      scrollBy,
+      pages,
+      next,
+      prev,
+      scrollToPage
+    }),
+    [activePageIndex, itemsPerPage, next, pages, prev, scrollBy, scrollToPage]
+  );
+}
+var useIsomorphicLayoutEffect = typeof window !== "undefined" ? useLayoutEffect : useEffect;
+function useAutoplay({
+  enabled,
+  interval,
+  next
+}) {
+  const [shouldAutoplay, setShouldAutoplay] = useState(enabled);
+  const [autoplayUserPreference, setAutoplayUserPreference] = useState(enabled);
+  useInterval(
+    () => requestAnimationFrame(next),
+    autoplayUserPreference && shouldAutoplay ? interval : null
+  );
+  const pause = useCallback(() => {
+    if (!enabled)
+      return;
+    setShouldAutoplay(false);
+  }, [enabled]);
+  const play = useCallback(() => {
+    if (!enabled)
+      return;
+    setShouldAutoplay(true);
+  }, [enabled]);
+  useEffect(() => {
+    function listener() {
+      if (document.visibilityState === "hidden") {
+        pause();
+      } else {
+        play();
+      }
+    }
+    document.addEventListener("visibilitychange", listener);
+    return () => {
+      document.removeEventListener("visibilitychange", listener);
+    };
+  }, [pause, play]);
+  return {
+    shouldAutoplay,
+    autoplayUserPreference,
+    setAutoplayUserPreference,
+    rootProps: {
+      onMouseEnter: pause,
+      onTouchStart: pause,
+      onFocus: pause,
+      onMouseLeave: play,
+      onTouchEnd: play,
+      onBlur: play
+    }
+  };
+}
+function useInterval(callback, delay) {
+  const savedCallback = useRef(callback);
+  useIsomorphicLayoutEffect(() => {
+    savedCallback.current = callback;
+  }, [callback]);
+  useEffect(() => {
+    if (delay === null) {
+      return;
+    }
+    const id = setInterval(() => {
+      savedCallback.current();
+    }, delay);
+    return () => {
+      clearInterval(id);
+    };
+  }, [delay]);
+}
+function useCarousel({
+  itemsPerPage = 1,
+  loop = false,
+  orientation = "horizontal",
+  spaceBetweenItems = "0px",
+  mouseDragging = false,
+  autoplay: propAutoplay = false,
+  autoplayInterval = 5e3,
+  scrollPadding,
+  onActivePageIndexChange
+} = {}) {
+  const [host, setHost] = useState(null);
+  const {
+    isDraggingRef,
+    scrollerProps: { onMouseDown }
+  } = useMouseDrag(host);
+  const state = useCarouselState(
+    {
+      itemsPerPage,
+      loop,
+      mouseDragging,
+      isDraggingRef,
+      onActivePageIndexChange
+    },
+    host
+  );
+  const { pages, activePageIndex, next, prev, scrollToPage } = state;
+  const scrollerId = useId();
+  const prefersReducedMotion = usePrefersReducedMotion();
+  const {
+    rootProps: autoplayRootProps,
+    autoplayUserPreference,
+    setAutoplayUserPreference
+  } = useAutoplay({
+    enabled: !prefersReducedMotion && propAutoplay,
+    interval: autoplayInterval,
+    next
+  });
+  const handleKeyDown = useCallback(
+    (e) => {
+      if (![
+        "ArrowLeft",
+        "ArrowRight",
+        "ArrowUp",
+        "ArrowDown",
+        "Home",
+        "End"
+      ].includes(e.key))
+        return;
+      e.preventDefault();
+      let nextPageIndex;
+      switch (e.key) {
+        case "ArrowUp": {
+          if (orientation === "vertical") {
+            nextPageIndex = prev();
+          }
+          break;
+        }
+        case "ArrowRight": {
+          if (orientation === "horizontal") {
+            nextPageIndex = next();
+          }
+          break;
+        }
+        case "ArrowDown": {
+          if (orientation === "vertical") {
+            nextPageIndex = next();
+          }
+          break;
+        }
+        case "ArrowLeft": {
+          if (orientation === "horizontal") {
+            nextPageIndex = prev();
+          }
+          break;
+        }
+        case "Home": {
+          scrollToPage(0);
+          nextPageIndex = 0;
+          break;
+        }
+        case "End": {
+          scrollToPage(pages.length - 1);
+          nextPageIndex = pages.length - 1;
+          break;
+        }
+      }
+      return nextPageIndex;
+    },
+    [next, orientation, pages.length, prev, scrollToPage]
+  );
+  const handleTablistKeydown = useCallback(
+    (e) => {
+      var _a;
+      const nextIndex = handleKeyDown(e);
+      if (!nextIndex)
+        return;
+      const target = e.target;
+      if (document.activeElement === target || ((_a = document.activeElement) == null ? void 0 : _a.contains(target))) {
+        const tab = document.querySelector(
+          `[data-carousel-tab="${nextIndex}"]`
+        );
+        tab == null ? void 0 : tab.focus();
+      }
+    },
+    [handleKeyDown]
+  );
+  useAriaBusyScroll(host);
+  return [
+    setHost,
+    {
+      ...state,
+      autoplayUserPreference,
+      rootProps: {
+        ...autoplayRootProps,
+        role: "region",
+        "aria-roledescription": "carousel"
+      },
+      tablistProps: {
+        role: "tablist",
+        "aria-controls": scrollerId,
+        "aria-orientation": orientation,
+        "aria-label": "Carousel navigation",
+        onKeyDown: handleTablistKeydown
+      },
+      prevButtonProps: {
+        "aria-label": "Previous page",
+        "aria-controls": scrollerId,
+        "data-prev-button": true,
+        onClick: () => prev(),
+        "aria-disabled": loop ? void 0 : activePageIndex <= 0 ? true : void 0
+      },
+      nextButtonProps: {
+        "aria-label": "Next page",
+        "aria-controls": scrollerId,
+        "data-next-button": true,
+        onClick: () => next(),
+        "aria-disabled": loop ? void 0 : activePageIndex >= pages.length - 1 ? true : void 0
+      },
+      scrollerProps: {
+        "data-carousel-scroller": true,
+        "aria-label": "Items Scroller",
+        "data-orientation": orientation,
+        onMouseDown: mouseDragging ? onMouseDown : noop,
+        onKeyDown: handleKeyDown,
+        tabIndex: 0,
+        "aria-atomic": true,
+        "aria-live": propAutoplay && autoplayUserPreference ? "polite" : "off",
+        "aria-busy": false,
+        id: scrollerId,
+        role: "group",
+        style: {
+          [`gridAuto${orientation === "horizontal" ? "Columns" : "Rows"}`]: `calc(100% / ${itemsPerPage} - ${spaceBetweenItems} * ${itemsPerPage - 1} / ${itemsPerPage})`,
+          [`scrollPadding${orientation === "horizontal" ? "Inline" : "Block"}`]: scrollPadding,
+          [`padding${orientation === "horizontal" ? "Inline" : "Block"}`]: scrollPadding,
+          gap: spaceBetweenItems
+        }
+      },
+      autoplayControlProps: {
+        inert: !propAutoplay ? "true" : void 0,
+        "aria-label": autoplayUserPreference ? "Disable autoplay" : "Enable autoplay",
+        "aria-controls": scrollerId,
+        onClick() {
+          setAutoplayUserPreference((prev2) => !prev2);
+        }
+      }
+    }
+  ];
+}
+function useCarouselTab(props, state) {
+  const isSelected = props.isSelected ?? state.activePageIndex === props.index;
+  let current = props.index + 1, setSize = state.pages.length;
+  return {
+    tabProps: {
+      "data-carousel-tab": props.index,
+      role: "tab",
+      "aria-label": `Go to page ${current} of ${setSize}`,
+      "aria-posinset": current,
+      "aria-setsize": setSize,
+      "aria-selected": isSelected,
+      tabIndex: isSelected ? 0 : -1,
+      onClick: () => state.scrollToPage(props.index)
+    },
+    isSelected
+  };
+}
+function useCarouselItem(props, state) {
+  var _a;
+  const { index } = props;
+  const {
+    pages = [],
+    activePageIndex,
+    scrollBy = "page",
+    itemsPerPage = 1
+  } = state;
+  const actualItemsPerPage = Math.floor(itemsPerPage);
+  const shouldSnap = scrollBy === "item" || (index + actualItemsPerPage) % actualItemsPerPage === 0;
+  const itemCount = new Set(pages == null ? void 0 : pages.flat()).size;
+  const label = itemCount ? `${index + 1} of ${itemCount}` : void 0;
+  const isInert = (_a = pages == null ? void 0 : pages[activePageIndex]) == null ? void 0 : _a.includes(index);
+  return {
+    itemProps: {
+      "data-carousel-item": index,
+      inert: isInert ? void 0 : "true",
+      "aria-hidden": isInert ? void 0 : true,
+      "aria-roledescription": "carousel item",
+      role: "group",
+      "aria-label": label,
+      style: {
+        scrollSnapAlign: shouldSnap ? "start" : void 0
+      }
+    }
+  };
+}
+var Context = createContext(void 0);
+var useCarouselContext = () => {
+  const context = useContext(Context);
+  if (!context) {
+    throw new Error("react-aria-carousel: No Carousel found in the React tree");
+  }
+  return context;
+};
+var IndexContext = createContext(-1);
+var Carousel = forwardRef(
+  function Carousel2({
+    children,
+    spaceBetweenItems = "16px",
+    scrollPadding,
+    mouseDragging,
+    autoplay,
+    autoplayInterval,
+    itemsPerPage = 1,
+    loop,
+    orientation = "horizontal",
+    scrollBy = "page",
+    initialPages = [],
+    onActivePageIndexChange,
+    ...props
+  }, ref) {
+    const carouselProps = {
+      spaceBetweenItems,
+      scrollPadding,
+      mouseDragging,
+      autoplay,
+      autoplayInterval,
+      itemsPerPage,
+      loop,
+      orientation,
+      scrollBy,
+      initialPages,
+      onActivePageIndexChange
+    };
+    const [assignRef2, carouselState] = useCarousel(carouselProps);
+    return /* @__PURE__ */ jsx(
+      Context.Provider,
+      {
+        value: {
+          assignRef: assignRef2,
+          carouselState,
+          carouselProps
+        },
+        children: /* @__PURE__ */ jsx("div", { ...mergeProps(carouselState.rootProps, props), ref, children })
+      }
+    );
+  }
+);
+var $bdb11010cef70236$var$idsUpdaterMap = /* @__PURE__ */ new Map();
+function $bdb11010cef70236$export$cd8c9cb68f842629(idA, idB) {
+  if (idA === idB)
+    return idA;
+  let setIdA = $bdb11010cef70236$var$idsUpdaterMap.get(idA);
+  if (setIdA) {
+    setIdA(idB);
+    return idB;
+  }
+  let setIdB = $bdb11010cef70236$var$idsUpdaterMap.get(idB);
+  if (setIdB) {
+    setIdB(idA);
+    return idA;
+  }
+  return idB;
+}
+function $ff5963eb1fccf552$export$e08e3b67e392101e(...callbacks) {
+  return (...args) => {
+    for (let callback of callbacks)
+      if (typeof callback === "function")
+        callback(...args);
+  };
+}
+function r(e) {
+  var t, f, n = "";
+  if ("string" == typeof e || "number" == typeof e)
+    n += e;
+  else if ("object" == typeof e)
+    if (Array.isArray(e)) {
+      var o = e.length;
+      for (t = 0; t < o; t++)
+        e[t] && (f = r(e[t])) && (n && (n += " "), n += f);
+    } else
+      for (f in e)
+        e[f] && (n && (n += " "), n += f);
+  return n;
+}
+function clsx() {
+  for (var e, t, f = 0, n = "", o = arguments.length; f < o; f++)
+    (e = arguments[f]) && (t = r(e)) && (n && (n += " "), n += t);
+  return n;
+}
+var clsx_default = clsx;
+function $3ef42575df84b30b$export$9d1611c77c2fe928(...args) {
+  let result = {
+    ...args[0]
+  };
+  for (let i = 1; i < args.length; i++) {
+    let props = args[i];
+    for (let key in props) {
+      let a = result[key];
+      let b = props[key];
+      if (typeof a === "function" && typeof b === "function" && // This is a lot faster than a regex.
+      key[0] === "o" && key[1] === "n" && key.charCodeAt(2) >= /* 'A' */
+      65 && key.charCodeAt(2) <= /* 'Z' */
+      90)
+        result[key] = $ff5963eb1fccf552$export$e08e3b67e392101e(a, b);
+      else if ((key === "className" || key === "UNSAFE_className") && typeof a === "string" && typeof b === "string")
+        result[key] = clsx_default(a, b);
+      else if (key === "id" && a && b)
+        result.id = $bdb11010cef70236$export$cd8c9cb68f842629(a, b);
+      else
+        result[key] = b !== void 0 ? b : a;
+    }
+  }
+  return result;
+}
+var CarouselTabs = forwardRef(
+  function CarouselTabs2({ children, ...props }, forwardedRef) {
+    const { carouselState } = useCarouselContext();
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref: forwardedRef,
+        ...$3ef42575df84b30b$export$9d1611c77c2fe928(carouselState == null ? void 0 : carouselState.tablistProps, props),
+        children: carouselState == null ? void 0 : carouselState.pages.map((_, index) => /* @__PURE__ */ jsx(Fragment, { children: children({
+          isSelected: index === (carouselState == null ? void 0 : carouselState.activePageIndex),
+          index
+        }) }, index))
+      }
+    );
+  }
+);
+var CarouselTab = forwardRef(
+  function CarouselTab2(props, forwardedRef) {
+    const { carouselState } = useCarouselContext();
+    const { index } = props;
+    const { tabProps } = useCarouselTab({ index }, carouselState);
+    return /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        ...$3ef42575df84b30b$export$9d1611c77c2fe928(tabProps, props),
+        ref: forwardedRef
+      }
+    );
+  }
+);
+var CarouselButton = forwardRef(function CarouselButton2({ dir, ...props }, forwardedRef) {
+  const { carouselState } = useCarouselContext();
+  const buttonProps = dir === "prev" ? carouselState == null ? void 0 : carouselState.prevButtonProps : carouselState == null ? void 0 : carouselState.nextButtonProps;
+  return /* @__PURE__ */ jsx(
+    "button",
+    {
+      ref: forwardedRef,
+      type: "button",
+      ...$3ef42575df84b30b$export$9d1611c77c2fe928(buttonProps, props)
+    }
+  );
+});
+function _CarouselScroller({ children, items, ...props }, forwardedRef) {
+  const context = useCarouselContext();
+  const { assignRef: assignRef2, carouselState } = context;
+  const ref = useMergedRef(assignRef2, forwardedRef);
+  const kids = typeof children === "function" ? items.map(children) : children;
+  function getChildren() {
+    let kidsArr = React.Children.toArray(kids);
+    if (kidsArr.length === 1 && kidsArr[0].type === React.Fragment) {
+      kidsArr = React.Children.toArray(kidsArr[0].props.children);
+    }
+    return kidsArr;
+  }
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref,
+      ...mergeProps(carouselState == null ? void 0 : carouselState.scrollerProps, props),
+      style: { ...carouselState == null ? void 0 : carouselState.scrollerProps.style, ...props == null ? void 0 : props.style },
+      children: getChildren().map((child, index) => {
+        return /* @__PURE__ */ jsx(IndexContext.Provider, { value: index, children: child }, index);
+      })
+    }
+  );
+}
+var CarouselScroller = React.forwardRef(_CarouselScroller);
+var CarouselAutoplayControl = forwardRef(function CarouselAutoplayControl2({ children, ...props }, forwardedRef) {
+  const { carouselState } = useCarouselContext();
+  return /* @__PURE__ */ jsx(
+    "button",
+    {
+      type: "button",
+      ref: forwardedRef,
+      ...$3ef42575df84b30b$export$9d1611c77c2fe928(carouselState == null ? void 0 : carouselState.autoplayControlProps, props),
+      children: typeof children === "function" ? children({
+        autoplayUserPreference: carouselState.autoplayUserPreference
+      }) : children
+    }
+  );
+});
+var CarouselItem = forwardRef(
+  function CarouselItem2({ index, ...props }, forwardedRef) {
+    const ctx = useCarouselContext();
+    const itemIndex = useContext(IndexContext);
+    const { itemProps } = useCarouselItem(
+      { index: index ?? itemIndex },
+      ctx.carouselState
+    );
+    return /* @__PURE__ */ jsx("div", { ref: forwardedRef, ...mergeProps(itemProps, props) });
+  }
+);
+const iconButton = "_iconButton_kb1oz_1";
+const sm = "_sm_kb1oz_24";
+const md = "_md_kb1oz_30";
+const lg = "_lg_kb1oz_36";
+const accentPrimary = "_accentPrimary_kb1oz_46";
+const accentSecondary = "_accentSecondary_kb1oz_69";
+const accentTertiary = "_accentTertiary_kb1oz_98";
+const accentQuaternary = "_accentQuaternary_kb1oz_127";
+const criticalPrimary = "_criticalPrimary_kb1oz_151";
+const criticalSecondary = "_criticalSecondary_kb1oz_175";
+const criticalTertiary = "_criticalTertiary_kb1oz_204";
+const criticalQuaternary = "_criticalQuaternary_kb1oz_229";
+const neutralPrimary = "_neutralPrimary_kb1oz_254";
+const neutralSecondary = "_neutralSecondary_kb1oz_278";
+const neutralTertiary = "_neutralTertiary_kb1oz_305";
+const neutralQuaternary = "_neutralQuaternary_kb1oz_330";
+const whitePrimary = "_whitePrimary_kb1oz_356";
+const whiteSecondary = "_whiteSecondary_kb1oz_385";
+const whiteTertiary = "_whiteTertiary_kb1oz_416";
+const whiteQuaternary = "_whiteQuaternary_kb1oz_445";
+const iconButtonStyles = {
+  iconButton,
+  sm,
+  md,
+  lg,
+  accentPrimary,
+  accentSecondary,
+  accentTertiary,
+  accentQuaternary,
+  criticalPrimary,
+  criticalSecondary,
+  criticalTertiary,
+  criticalQuaternary,
+  neutralPrimary,
+  neutralSecondary,
+  neutralTertiary,
+  neutralQuaternary,
+  whitePrimary,
+  whiteSecondary,
+  whiteTertiary,
+  whiteQuaternary,
+  "fa-spinner-third": "_fa-spinner-third_kb1oz_476",
+  "icon-wrapper": "_icon-wrapper_kb1oz_481"
+};
+export {
+  Carousel as C,
+  CarouselScroller as a,
+  CarouselItem as b,
+  CarouselTabs as c,
+  CarouselTab as d,
+  CarouselButton as e,
+  CarouselAutoplayControl as f,
+  iconButtonStyles as i
+};
+//# sourceMappingURL=IconButton.module-4obqG6tY.js.map