@xwadex/fesd-next 0.3.3 → 0.3.4-10

package/dist/components/index.js

@@ -1 +1,1211 @@
-export * from "./myComponents";
+import * as React2 from 'react';
+import React2__default, { memo, useRef, useEffectEvent, useEffect, useState, useLayoutEffect, createContext, useMemo, useCallback, use } from 'react';
+import 'js-cookie';
+import { useAnimate, motionValue } from 'motion/react';
+import { create } from 'zustand';
+import Lenis from 'lenis';
+import '@radix-ui/react-accordion';
+import { ArrowLeft } from 'lucide-react';
+import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
+import '@radix-ui/react-alert-dialog';
+import { cva } from 'class-variance-authority';
+import '@radix-ui/react-aspect-ratio';
+import '@radix-ui/react-avatar';
+import { Slot } from '@radix-ui/react-slot';
+import 'react-day-picker';
+import useEmblaCarousel from 'embla-carousel-react';
+import 'recharts';
+import '@radix-ui/react-checkbox';
+import '@radix-ui/react-collapsible';
+import 'cmdk';
+import '@radix-ui/react-context-menu';
+import '@radix-ui/react-dialog';
+import 'vaul';
+import '@radix-ui/react-dropdown-menu';
+import 'react-hook-form';
+import '@radix-ui/react-hover-card';
+import 'input-otp';
+import '@radix-ui/react-label';
+import '@radix-ui/react-menubar';
+import '@radix-ui/react-navigation-menu';
+import '@radix-ui/react-popover';
+import '@radix-ui/react-progress';
+import '@radix-ui/react-radio-group';
+import 'react-resizable-panels';
+import '@radix-ui/react-scroll-area';
+import '@radix-ui/react-select';
+import '@radix-ui/react-separator';
+import '@radix-ui/react-slider';
+import 'next-themes';
+import 'sonner';
+import '@radix-ui/react-switch';
+import '@radix-ui/react-tabs';
+import '@radix-ui/react-toggle-group';
+import '@radix-ui/react-toggle';
+import '@radix-ui/react-tooltip';
+import { clsx } from 'clsx';
+import { twMerge } from 'tailwind-merge';
+import { useLenis, ReactLenis } from 'lenis/react';
+import { WheelGesturesPlugin } from 'embla-carousel-wheel-gestures';
+import Autoplay from 'embla-carousel-autoplay';
+import AutoScroll from 'embla-carousel-auto-scroll';
+import AutoHeight from 'embla-carousel-auto-height';
+import ClassNames from 'embla-carousel-class-names';
+import Fade from 'embla-carousel-fade';
+
+// src/hooks/useDebounce.tsx
+var ANCHOR_ATTRIBUTE = "data-anchor";
+var OFFSETER_ATTRIBUTE = "data-anchor-offseter";
+function useAnchors() {
+  const [_, animate] = useAnimate();
+  const controllerRef = useRef(/* @__PURE__ */ new Map());
+  const scrollAnimations = useCallback(({
+    controllerKey,
+    containerDom,
+    anchorScrollValue,
+    containerScrollValue,
+    direction = "y",
+    duration = 1,
+    delay = 0,
+    ease = [0, 1, 0.5, 0.99],
+    onScroll: onPlay,
+    onScrolled,
+    onScrolling,
+    ...props
+  }) => {
+    if (direction !== "y" && direction !== "x") {
+      console.error(`Scroll Direction isn't 'x' or 'y' `);
+      return;
+    }
+    const { left: scrollLeft, top: scrollTop } = containerScrollValue;
+    const { left: anchorLeft, top: anchorTop } = anchorScrollValue;
+    const isScrollX = direction === "x";
+    const isScrollY = direction === "y";
+    const startValue = isScrollX ? scrollLeft : scrollTop;
+    const endValue = isScrollX ? anchorLeft : anchorTop;
+    if (startValue == endValue) {
+      controllerRef.current.delete(controllerKey);
+      return;
+    }
+    const motionStartValue = motionValue(startValue);
+    const onUpdate = (value) => {
+      const left = isScrollX ? value : void 0;
+      const top = isScrollY ? value : void 0;
+      containerDom.scrollTo({ left, top });
+      onScrolling?.(value);
+    };
+    const onComplete = () => {
+      controllerRef.current.delete(controllerKey);
+      onScrolled?.();
+    };
+    const options = {
+      duration,
+      ease,
+      delay,
+      onPlay,
+      onUpdate,
+      onComplete,
+      ...props
+    };
+    controllerRef.current.set(
+      controllerKey,
+      animate(motionStartValue, endValue, options)
+    );
+  }, []);
+  const scrollToAnchor = useCallback((anchorOptions) => {
+    const {
+      anchor: anchorName,
+      container: containerName,
+      offseters,
+      align,
+      offset = 0,
+      direction = "y",
+      ...options
+    } = anchorOptions;
+    const anchorsStores = getAnchorsStores();
+    const scrollContainersStores = getScrollContainerStores();
+    const isScrolltoAnchor = anchorName !== "#";
+    const isScrollContainer = containerName && containerName !== "window";
+    const controllerKey = containerName ?? "window";
+    if (controllerRef.current.has(controllerKey)) {
+      controllerRef.current.get(controllerKey)?.stop();
+      controllerRef.current.delete(controllerKey);
+    }
+    const anchorDom = isScrolltoAnchor ? anchorsStores.anchors.get(anchorName) : void 0;
+    if (isScrolltoAnchor && !(anchorDom instanceof HTMLElement)) return;
+    const containerDom = isScrollContainer ? scrollContainersStores.containers.get(containerName) : window;
+    if (!containerDom) return;
+    const getOffseterDomClient = (offseters2) => {
+      const offseterDom = anchorsStores.offseters.get(offseters2);
+      const { clientWidth, clientHeight } = offseterDom || {};
+      return { width: clientWidth ?? 0, height: clientHeight ?? 0 };
+    };
+    const offsets = Array.isArray(offseters) ? offseters.reduce((init, offseter) => {
+      const { width, height } = getOffseterDomClient(offseter);
+      return {
+        width: (init.width ?? 0) + width,
+        height: (init.height ?? 0) + height
+      };
+    }, {}) : typeof offseters == "string" ? getOffseterDomClient(offseters) : { width: 0, height: 0 };
+    const offsetValue = {
+      width: direction === "x" ? offsets.width + offset : 0,
+      height: direction === "y" ? offsets.height + offset : 0
+    };
+    const isLenisScroll = containerDom == window && window.document.documentElement.classList.contains("lenis") || containerDom instanceof Lenis;
+    if (isLenisScroll) {
+      const lenis = isScrollContainer ? containerDom : getRootLenis()?.root;
+      if (!lenis) return;
+      const directionOffset = direction === "x" ? offsetValue.width + offset : offsetValue.height + offset;
+      lenis.scrollTo(
+        anchorDom ?? 0,
+        {
+          offset: directionOffset * -1,
+          onStart: (lenis2) => options?.onScroll?.(lenis2),
+          onComplete: (lenis2) => options?.onScrolled?.(lenis2)
+        }
+      );
+      return;
+    }
+    const containerScrollValue = {
+      top: Math.round(isScrollContainer ? containerDom.scrollTop : containerDom.pageYOffset),
+      left: Math.round(isScrollContainer ? containerDom.scrollLeft : pageXOffset)
+    };
+    const containerRect = isScrollContainer ? containerDom.getBoundingClientRect() : { top: 0, left: 0 };
+    const containerOffsetValue = {
+      left: containerScrollValue.left - (isScrollContainer ? containerRect.left : 0),
+      top: containerScrollValue.top - (isScrollContainer ? containerRect.top : 0)
+    };
+    const anchorRect = anchorDom ? anchorDom.getBoundingClientRect() : { left: 0, top: 0 };
+    const anchorScrollValue = {
+      left: isScrolltoAnchor ? Math.round(anchorRect.left + containerOffsetValue.left - offsetValue.width) : offsetValue.width,
+      top: isScrolltoAnchor ? Math.round(anchorRect.top + containerOffsetValue.top - offsetValue.height) : offsetValue.height
+    };
+    scrollAnimations({
+      controllerKey,
+      containerDom,
+      containerScrollValue,
+      anchorScrollValue,
+      direction,
+      ...options
+    });
+  }, []);
+  const returnsMemo = useMemo(() => ({
+    registerAnchors,
+    registerOffseters,
+    setStores: setAnchorsStore,
+    getStores: getAnchorsStores,
+    scrollToAnchor
+  }), [scrollToAnchor]);
+  return returnsMemo;
+}
+function useRegistration({ key, name }) {
+  const ref = useRef(null);
+  const attribute = key == "anchors" ? ANCHOR_ATTRIBUTE : OFFSETER_ATTRIBUTE;
+  useLayoutEffect(() => {
+    setAnchorsStore({ key, action: "add", node: ref.current, name });
+    return () => {
+      setAnchorsStore({ key, action: "remove", node: ref.current, name });
+    };
+  }, []);
+  return { ref, [attribute]: name };
+}
+function registerAnchors(name) {
+  return useRegistration({ key: "anchors", name });
+}
+function registerOffseters(name) {
+  return useRegistration({ key: "offseters", name });
+}
+var useAnchorsStores = create()(() => ({
+  anchors: /* @__PURE__ */ new Map(),
+  offseters: /* @__PURE__ */ new Map()
+}));
+var getAnchorsStores = () => useAnchorsStores.getState();
+var setAnchorsStore = (options) => {
+  const { key, action, name, node } = options;
+  useAnchorsStores.setState((stores) => {
+    switch (key) {
+      case "anchors":
+        const anchorDom = stores.anchors?.get(name);
+        if (action == "add" && node instanceof HTMLElement) {
+          if (anchorDom == node) return stores;
+          stores.anchors?.set(name, node);
+        } else if (action == "remove" && anchorDom) {
+          stores.anchors?.delete(name);
+        }
+        return { anchors: stores.anchors };
+      case "offseters":
+        const offseterDom = stores.offseters?.get(name);
+        if (action == "add" && node instanceof HTMLElement) {
+          if (offseterDom == node) return stores;
+          stores.offseters?.set(name, node);
+        } else if (action == "remove" && offseterDom) {
+          stores.offseters?.delete(name);
+        }
+        return { offseters: stores.offseters };
+      default:
+        return stores;
+    }
+  });
+};
+cva(
+  "relative w-full rounded-lg border px-4 py-3 text-sm grid has-[>svg]:grid-cols-[calc(var(--spacing)*4)_1fr] grid-cols-[0_1fr] has-[>svg]:gap-x-3 gap-y-0.5 items-start [&>svg]:size-4 [&>svg]:translate-y-0.5 [&>svg]:text-current",
+  {
+    variants: {
+      variant: {
+        default: "bg-card text-card-foreground",
+        destructive: "text-destructive bg-card [&>svg]:text-current *:data-[slot=alert-description]:text-destructive/90"
+      }
+    },
+    defaultVariants: {
+      variant: "default"
+    }
+  }
+);
+cva(
+  "inline-flex items-center justify-center rounded-md border px-2 py-0.5 text-xs font-medium w-fit whitespace-nowrap shrink-0 [&>svg]:size-3 gap-1 [&>svg]:pointer-events-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive transition-[color,box-shadow] overflow-hidden",
+  {
+    variants: {
+      variant: {
+        default: "border-transparent bg-primary text-primary-foreground [a&]:hover:bg-primary/90",
+        secondary: "border-transparent bg-secondary text-secondary-foreground [a&]:hover:bg-secondary/90",
+        destructive: "border-transparent bg-destructive text-white [a&]:hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60",
+        outline: "text-foreground [a&]:hover:bg-accent [a&]:hover:text-accent-foreground"
+      }
+    },
+    defaultVariants: {
+      variant: "default"
+    }
+  }
+);
+var buttonVariants = cva(
+  "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
+  {
+    variants: {
+      variant: {
+        default: "bg-primary text-primary-foreground shadow-xs hover:bg-primary/90",
+        destructive: "bg-destructive text-white shadow-xs hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60",
+        outline: "border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50",
+        secondary: "bg-secondary text-secondary-foreground shadow-xs hover:bg-secondary/80",
+        ghost: "hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50",
+        link: "text-primary underline-offset-4 hover:underline"
+      },
+      size: {
+        default: "h-9 px-4 py-2 has-[>svg]:px-3",
+        sm: "h-8 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5",
+        lg: "h-10 rounded-md px-6 has-[>svg]:px-4",
+        icon: "size-9"
+      }
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "default"
+    }
+  }
+);
+function Button({
+  className,
+  variant,
+  size,
+  asChild = false,
+  ...props
+}) {
+  const Comp = asChild ? Slot : "button";
+  return /* @__PURE__ */ jsx(
+    Comp,
+    {
+      "data-slot": "button",
+      className: cn(buttonVariants({ variant, size, className })),
+      ...props
+    }
+  );
+}
+var CarouselContext = React2.createContext(null);
+function useCarousel() {
+  const context = React2.useContext(CarouselContext);
+  if (!context) {
+    throw new Error("useCarousel must be used within a <Carousel />");
+  }
+  return context;
+}
+function Carousel({
+  orientation = "horizontal",
+  opts,
+  setApi,
+  plugins,
+  className,
+  children,
+  ...props
+}) {
+  const [carouselRef, api] = useEmblaCarousel(
+    {
+      ...opts,
+      axis: orientation === "horizontal" ? "x" : "y"
+    },
+    plugins
+  );
+  const [canScrollPrev, setCanScrollPrev] = React2.useState(false);
+  const [canScrollNext, setCanScrollNext] = React2.useState(false);
+  const onSelect = React2.useCallback((api2) => {
+    if (!api2) return;
+    setCanScrollPrev(api2.canScrollPrev());
+    setCanScrollNext(api2.canScrollNext());
+  }, []);
+  const scrollPrev = React2.useCallback(() => {
+    api?.scrollPrev();
+  }, [api]);
+  const scrollNext = React2.useCallback(() => {
+    api?.scrollNext();
+  }, [api]);
+  const handleKeyDown = React2.useCallback(
+    (event) => {
+      if (event.key === "ArrowLeft") {
+        event.preventDefault();
+        scrollPrev();
+      } else if (event.key === "ArrowRight") {
+        event.preventDefault();
+        scrollNext();
+      }
+    },
+    [scrollPrev, scrollNext]
+  );
+  React2.useEffect(() => {
+    if (!api || !setApi) return;
+    setApi(api);
+  }, [api, setApi]);
+  React2.useEffect(() => {
+    if (!api) return;
+    onSelect(api);
+    api.on("reInit", onSelect);
+    api.on("select", onSelect);
+    return () => {
+      api?.off("select", onSelect);
+    };
+  }, [api, onSelect]);
+  return /* @__PURE__ */ jsx(
+    CarouselContext.Provider,
+    {
+      value: {
+        carouselRef,
+        api,
+        opts,
+        orientation: orientation || (opts?.axis === "y" ? "vertical" : "horizontal"),
+        scrollPrev,
+        scrollNext,
+        canScrollPrev,
+        canScrollNext
+      },
+      children: /* @__PURE__ */ jsx(
+        "div",
+        {
+          onKeyDownCapture: handleKeyDown,
+          className: cn("relative", className),
+          role: "region",
+          "aria-roledescription": "carousel",
+          "data-slot": "carousel",
+          ...props,
+          children
+        }
+      )
+    }
+  );
+}
+function CarouselPrevious({
+  className,
+  variant = "outline",
+  size = "icon",
+  ...props
+}) {
+  const { orientation, scrollPrev, canScrollPrev } = useCarousel();
+  return /* @__PURE__ */ jsxs(
+    Button,
+    {
+      "data-slot": "carousel-previous",
+      variant,
+      size,
+      className: cn(
+        "absolute size-8 rounded-full",
+        orientation === "horizontal" ? "top-1/2 -left-12 -translate-y-1/2" : "-top-12 left-1/2 -translate-x-1/2 rotate-90",
+        className
+      ),
+      disabled: !canScrollPrev,
+      onClick: scrollPrev,
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx(ArrowLeft, {}),
+        /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Previous slide" })
+      ]
+    }
+  );
+}
+React2.createContext(null);
+React2.createContext({});
+React2.createContext({});
+cva(
+  "group inline-flex h-9 w-max items-center justify-center rounded-md bg-background px-4 py-2 text-sm font-medium hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground disabled:pointer-events-none disabled:opacity-50 data-[state=open]:hover:bg-accent data-[state=open]:text-accent-foreground data-[state=open]:focus:bg-accent data-[state=open]:bg-accent/50 focus-visible:ring-ring/50 outline-none transition-[color,box-shadow] focus-visible:ring-[3px] focus-visible:outline-1"
+);
+React2.createContext(null);
+cva(
+  "peer/menu-button flex w-full items-center gap-2 overflow-hidden rounded-md p-2 text-left text-sm outline-hidden ring-sidebar-ring transition-[width,height,padding] hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 group-has-data-[sidebar=menu-action]/menu-item:pr-8 aria-disabled:pointer-events-none aria-disabled:opacity-50 data-[active=true]:bg-sidebar-accent data-[active=true]:font-medium data-[active=true]:text-sidebar-accent-foreground data-[state=open]:hover:bg-sidebar-accent data-[state=open]:hover:text-sidebar-accent-foreground group-data-[collapsible=icon]:size-8! group-data-[collapsible=icon]:p-2! [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0",
+  {
+    variants: {
+      variant: {
+        default: "hover:bg-sidebar-accent hover:text-sidebar-accent-foreground",
+        outline: "bg-background shadow-[0_0_0_1px_hsl(var(--sidebar-border))] hover:bg-sidebar-accent hover:text-sidebar-accent-foreground hover:shadow-[0_0_0_1px_hsl(var(--sidebar-accent))]"
+      },
+      size: {
+        default: "h-8 text-sm",
+        sm: "h-7 text-xs",
+        lg: "h-12 text-sm group-data-[collapsible=icon]:p-0!"
+      }
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "default"
+    }
+  }
+);
+React2.createContext({
+  size: "default",
+  variant: "default"
+});
+cva(
+  "inline-flex items-center justify-center gap-2 rounded-md text-sm font-medium hover:bg-muted hover:text-muted-foreground disabled:pointer-events-none disabled:opacity-50 data-[state=on]:bg-accent data-[state=on]:text-accent-foreground [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 [&_svg]:shrink-0 focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] outline-none transition-[color,box-shadow] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive whitespace-nowrap",
+  {
+    variants: {
+      variant: {
+        default: "bg-transparent",
+        outline: "border border-input bg-transparent shadow-xs hover:bg-accent hover:text-accent-foreground"
+      },
+      size: {
+        default: "h-9 px-2 min-w-9",
+        sm: "h-8 px-1.5 min-w-8",
+        lg: "h-10 px-2.5 min-w-10"
+      }
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "default"
+    }
+  }
+);
+function cn(...inputs) {
+  return twMerge(clsx(...inputs));
+}
+var AnchorTarget = ({ name, ...props }) => {
+  const { registerAnchors: registerAnchors2 } = useAnchors();
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      ...props,
+      ...registerAnchors2(name)
+    }
+  );
+};
+var AnchorOffseter = ({ name, ...props }) => {
+  const { registerOffseters: registerOffseters2 } = useAnchors();
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      ...props,
+      ...registerOffseters2(name)
+    }
+  );
+};
+var AnchorTrigger = ({
+  children,
+  className,
+  ...options
+}) => {
+  const { scrollToAnchor } = useAnchors();
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: cn(className),
+      onClick: () => scrollToAnchor(options),
+      children
+    }
+  );
+};
+var Anchors = {
+  Trigger: AnchorTrigger,
+  Target: AnchorTarget,
+  Offseter: AnchorOffseter
+};
+var LenisScroll = memo((props) => {
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    props?.root == true ? /* @__PURE__ */ jsx(LenisRootScroll, { ...props }) : /* @__PURE__ */ jsx(LenisContainerScroll, { ...props }),
+    "	"
+  ] });
+});
+var LenisRootScroll = memo(({
+  root,
+  options
+}) => {
+  const lenis = useLenis();
+  const lenisRef = useRef(null);
+  const registerRootLenis = useEffectEvent(() => {
+    if (!root == true || !lenis) return;
+    setRootLenis(lenis);
+  });
+  useEffect(() => {
+    registerRootLenis();
+  }, [lenis]);
+  return /* @__PURE__ */ jsx(
+    ReactLenis,
+    {
+      ref: lenisRef,
+      root,
+      options: {
+        autoRaf: true,
+        lerp: 5e-4,
+        duration: 1.5,
+        smoothWheel: true,
+        ...options
+      }
+    }
+  );
+});
+var LenisContainerScroll = memo(({
+  name,
+  className,
+  children,
+  options,
+  ...restProps
+}) => {
+  const [containerRef, setContainerRef] = useState();
+  const wrapperRef = useRef(null);
+  const contentRef = useRef(null);
+  const initLenis = useEffectEvent(() => {
+    if (!wrapperRef.current || !contentRef.current || !name) return;
+    const lenis = new Lenis({
+      wrapper: wrapperRef.current,
+      content: contentRef.current,
+      autoRaf: true,
+      ...options
+    });
+    setContainerRef(contentRef);
+    setScrollContainerStore({ name, action: "add", node: lenis });
+    return () => {
+      setScrollContainerStore({ name, action: "remove" });
+      lenis?.destroy?.();
+    };
+  });
+  useLayoutEffect(() => {
+    const effect = initLenis();
+    return effect;
+  }, [name, options]);
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref: wrapperRef,
+      "data-lenis-scroll": name,
+      className: cn("group overflow-hidden", className),
+      ...restProps,
+      children: /* @__PURE__ */ jsx(
+        "div",
+        {
+          ref: contentRef,
+          className: cn("h-full", "relative", "will-change-transform overscroll-contain"),
+          children: /* @__PURE__ */ jsx(ScrollContainerContext, { value: { containerRef }, children })
+        }
+      )
+    }
+  );
+});
+var useLenisStores = create()(() => ({
+  root: null
+}));
+var setRootLenis = (lenis) => useLenisStores.setState(() => {
+  return { root: lenis };
+});
+var getRootLenis = () => useLenisStores.getState();
+var ScrollContainer = ({
+  name,
+  lenis = false,
+  ...props
+}) => {
+  return /* @__PURE__ */ jsx(Fragment, { children: lenis ? /* @__PURE__ */ jsx(LenisScroll, { name, ...props }) : /* @__PURE__ */ jsx(NativeScroll, { name, ...props }) });
+};
+var ScrollContainerContext = createContext(null);
+var useScrollContainerContext = () => {
+  const context = use(ScrollContainerContext);
+  if (!context) throw new Error("useScrollContainerContext must be used inside ScrollContainerProvider");
+  return context;
+};
+var useScrollContainersStores = create()(() => ({
+  containers: /* @__PURE__ */ new Map()
+}));
+var getScrollContainer = (name) => {
+  const stores = useScrollContainersStores.getState();
+  return stores.containers?.get(name);
+};
+var getScrollContainerStores = () => useScrollContainersStores.getState();
+var setScrollContainerStore = (options) => {
+  const { action, name, node } = options;
+  useScrollContainersStores.setState((stores) => {
+    const containerDom = stores.containers?.get(name);
+    const isContainerNode = node instanceof Lenis || node instanceof HTMLDivElement;
+    if (action == "add" && isContainerNode) {
+      if (containerDom == node) return stores;
+      stores.containers?.set(name, node);
+    } else if (action == "remove" && containerDom) {
+      stores.containers?.delete(name);
+    }
+    return { containers: stores.containers };
+  });
+};
+var NativeScroll = memo(({
+  tag: Component = "div",
+  name,
+  className,
+  ...restProps
+}) => {
+  const componentRef = useRef(null);
+  const [containerRef, setContainerRef] = useState();
+  const nativeEffect = useEffectEvent(() => {
+    if (!componentRef.current) return;
+    setContainerRef(componentRef);
+    setScrollContainerStore({ name, action: "add", node: componentRef.current });
+    return () => {
+      setScrollContainerStore({ name, action: "remove" });
+    };
+  });
+  useEffect(() => {
+    const effect = nativeEffect();
+    return effect;
+  }, [componentRef?.current]);
+  return /* @__PURE__ */ jsx(ScrollContainerContext, { value: { containerRef }, children: /* @__PURE__ */ jsx(
+    Component,
+    {
+      ref: componentRef,
+      "data-native-scroll": name,
+      className: cn(
+        "overflow-auto",
+        "will-change-transform",
+        className
+      ),
+      ...restProps
+    }
+  ) });
+});
+function emblaCarouselsHooks({
+  options,
+  autoplay,
+  autoScroll,
+  classNames,
+  autoHeight,
+  fade,
+  wheel,
+  setApi
+}) {
+  const orientation = options?.axis ?? "x";
+  const plugins = useMemo(() => [
+    autoplay && Autoplay(typeof autoplay == "boolean" ? void 0 : autoplay),
+    autoScroll && AutoScroll(typeof autoScroll == "boolean" ? void 0 : autoScroll),
+    autoHeight && AutoHeight(typeof autoHeight == "boolean" ? void 0 : autoHeight),
+    classNames && ClassNames(typeof classNames == "boolean" ? void 0 : classNames),
+    fade && Fade(typeof fade == "boolean" ? void 0 : fade),
+    wheel && WheelGesturesPlugin(typeof wheel == "boolean" ? void 0 : wheel)
+  ].filter(
+    (plugin) => plugin
+  ), [
+    autoplay,
+    autoScroll,
+    classNames,
+    fade,
+    wheel,
+    autoHeight
+  ]);
+  const [emblaRef, emblaApi] = useEmblaCarousel(options, plugins);
+  const [currentIndex, setCurrentIndex] = useState(0);
+  const [isScrollPrev, setIsScrollPrev] = useState(false);
+  const [isScrollNext, setIsScrollNext] = useState(false);
+  const scrollPrev = useCallback(() => {
+    emblaApi?.scrollPrev();
+  }, [emblaApi]);
+  const scrollNext = useCallback(() => {
+    emblaApi?.scrollNext();
+  }, [emblaApi]);
+  const onKeyDownCapture = useCallback((event) => {
+    console.log("key...");
+    if (event.key === "ArrowLeft") {
+      event.preventDefault();
+      scrollPrev();
+    } else if (event.key === "ArrowRight") {
+      event.preventDefault();
+      scrollNext();
+    }
+  }, [scrollPrev, scrollNext]);
+  const onSelect = useCallback((api) => {
+    if (!api) return;
+    setCurrentIndex(api?.selectedScrollSnap());
+    setIsScrollPrev(api.canScrollPrev());
+    setIsScrollNext(api.canScrollNext());
+  }, []);
+  const initalEffect = useEffectEvent(() => {
+    if (!emblaApi || !setApi) return;
+    setApi?.(emblaApi);
+    onSelect(emblaApi);
+    emblaApi.on("reInit", onSelect);
+    emblaApi.on("select", onSelect);
+    return () => {
+      emblaApi?.off("select", onSelect);
+    };
+  });
+  useEffect(() => {
+    const events = initalEffect();
+    return () => {
+      events?.();
+    };
+  }, [emblaApi]);
+  return {
+    emblaRef,
+    emblaApi,
+    orientation,
+    currentIndex,
+    isScrollPrev,
+    isScrollNext,
+    scrollPrev,
+    scrollNext,
+    onKeyDownCapture
+  };
+}
+var CarouselsContext = createContext(null);
+var useCarouselsContext = () => {
+  const context = use(CarouselsContext);
+  if (!context) throw new Error("useCarousel must be used within a <Carousel />");
+  return context;
+};
+var EmblaCarouselsRoots = memo(({
+  children,
+  className,
+  setApi,
+  options,
+  autoplay,
+  autoScroll,
+  classNames,
+  autoHeight,
+  fade,
+  wheel,
+  ...props
+}) => {
+  const {
+    emblaRef,
+    emblaApi,
+    orientation,
+    currentIndex,
+    isScrollPrev,
+    isScrollNext,
+    scrollPrev,
+    scrollNext,
+    onKeyDownCapture
+  } = emblaCarouselsHooks({
+    setApi,
+    options,
+    autoplay,
+    autoScroll,
+    classNames,
+    autoHeight,
+    fade,
+    wheel
+  });
+  const contextValue = useMemo(() => ({
+    emblaRef,
+    emblaApi,
+    orientation,
+    currentIndex,
+    isScrollPrev,
+    isScrollNext,
+    scrollPrev,
+    scrollNext
+  }), [
+    emblaRef,
+    emblaApi,
+    orientation,
+    currentIndex,
+    isScrollPrev,
+    isScrollNext,
+    scrollPrev,
+    scrollNext
+  ]);
+  return /* @__PURE__ */ jsx(CarouselsContext, { value: contextValue, children: /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-component": "embla-carousels",
+      onKeyDownCapture,
+      className: cn("relative overflow-hidden", className),
+      "aria-roledescription": "embla-carousels",
+      role: "region",
+      ...props,
+      children
+    }
+  ) });
+});
+var EmblaCarouselsContents = memo(({ className, ...props }) => {
+  const { emblaRef, orientation } = useCarouselsContext();
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref: emblaRef,
+      className: "overflow-hidden",
+      "data-component": "embla-carousels-contents",
+      children: /* @__PURE__ */ jsx(
+        "div",
+        {
+          className: cn(
+            "flex",
+            orientation === "x" ? "flex-row" : "flex-col",
+            className
+          ),
+          ...props
+        }
+      )
+    }
+  );
+});
+var EmblaCarouselsSlides = memo(({ className, ...props }) => {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      role: "group",
+      "aria-roledescription": "slide",
+      "data-component": "embla-carousels-slides",
+      className: cn(
+        "min-w-0 shrink-0 grow-0 basis-full",
+        className
+      ),
+      ...props
+    }
+  );
+});
+var EmblaCarousels = {
+  Roots: EmblaCarouselsRoots,
+  Contents: EmblaCarouselsContents,
+  Slides: EmblaCarouselsSlides
+};
+var CarouselContext2 = createContext(null);
+var CarouselContextProvider = (props) => {
+  return /* @__PURE__ */ jsx(CarouselContext2, { ...props });
+};
+var useCarouselContext = () => {
+  const context = use(CarouselContext2);
+  if (!context) throw new Error("useCMSData must be used inside CMSProvider");
+  return context;
+};
+var Embla = ({
+  children,
+  className,
+  options,
+  datas,
+  autoplayEnabled = true,
+  autoplayOptions,
+  setApi,
+  setMethods,
+  setRef,
+  style,
+  controls,
+  onScrolled
+}) => {
+  const { loop, duration = 40 } = options || {};
+  const autoplaySetting = useMemo(() => {
+    if (!autoplayEnabled) return;
+    return [Autoplay({ playOnInit: true, delay: 5e3, stopOnInteraction: false, ...autoplayOptions })];
+  }, [autoplayEnabled, autoplayOptions]);
+  const [emblaRef, emblaApi] = useEmblaCarousel({ ...options, loop, duration }, autoplaySetting);
+  const [selectIndex, setSelectIndex] = useState(0);
+  const [scrollSnaps, setScrollSnaps] = useState([]);
+  const nextScroll = useCallback(() => {
+    if (!emblaApi) return;
+    const { canScrollNext, scrollNext } = emblaApi;
+    canScrollNext() && scrollNext() && autoPlayReset();
+  }, [emblaApi]);
+  const prevScroll = useCallback(() => {
+    if (!emblaApi) return;
+    const { canScrollPrev, scrollPrev } = emblaApi;
+    canScrollPrev() && scrollPrev() && autoPlayReset();
+  }, [emblaApi]);
+  const scrollToIndex = useCallback((index) => {
+    if (!emblaApi || typeof index !== "number") return;
+    emblaApi.scrollTo(index);
+  }, [emblaApi]);
+  const autoPlayReset = useCallback(() => {
+    if (!emblaApi) return;
+    const autoplay = emblaApi?.plugins()?.autoplay;
+    autoplay && autoplay.reset();
+  }, [emblaApi]);
+  const autoPlayPlay = useCallback(() => {
+    if (!emblaApi) return;
+    if (!emblaApi.canScrollNext()) return;
+    const autoplay = emblaApi?.plugins()?.autoplay;
+    autoplay && autoplay.play();
+  }, [emblaApi]);
+  const autoPlayStop = useCallback(() => {
+    if (!emblaApi) return;
+    const autoplay = emblaApi?.plugins()?.autoplay;
+    autoplay && autoplay.stop();
+  }, [emblaApi]);
+  const contextValue = useMemo(() => ({
+    datas,
+    emblaRef,
+    emblaApi,
+    selectIndex,
+    scrollSnaps,
+    nextScroll,
+    prevScroll,
+    scrollToIndex,
+    autoPlayReset,
+    autoPlayStop,
+    autoPlayPlay
+  }), [
+    datas,
+    emblaRef,
+    emblaApi,
+    selectIndex,
+    scrollSnaps,
+    nextScroll,
+    prevScroll,
+    scrollToIndex,
+    autoPlayReset,
+    autoPlayStop,
+    autoPlayPlay
+  ]);
+  const onInit = useCallback((emblaApi2) => {
+    const snapList = emblaApi2.scrollSnapList();
+    setScrollSnaps(snapList);
+  }, []);
+  const onSelectEvent = (emblaApi2) => {
+    emblaApi2.on("select", () => {
+      onScrolled?.(emblaApi2.selectedScrollSnap());
+      setSelectIndex(emblaApi2.selectedScrollSnap());
+    });
+  };
+  useEffect(() => {
+    if (!emblaApi) return;
+    setRef?.(emblaRef);
+    setApi?.(emblaApi);
+    setMethods?.({});
+    onInit(emblaApi);
+    onSelectEvent(emblaApi);
+  }, [emblaApi]);
+  return /* @__PURE__ */ jsx(CarouselContextProvider, { value: contextValue, children: /* @__PURE__ */ jsxs(
+    "div",
+    {
+      "data-component": "embla-root",
+      className: cn("relative w-full"),
+      children: [
+        /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: cn(
+              "overflow-hidden",
+              "w-full",
+              className
+            ),
+            ref: emblaRef,
+            style,
+            children
+          }
+        ),
+        Array.isArray(controls) ? controls.map((ctrl, i) => /* @__PURE__ */ jsx(React2__default.Fragment, { children: ctrl }, i)) : controls
+      ]
+    }
+  ) });
+};
+Embla.displayName = "Embla";
+var embla_default = Embla;
+var EmblaContainer = ({
+  slide: SlideComponent,
+  className,
+  children,
+  style,
+  ...props
+}) => {
+  const { datas, emblaApi } = useCarouselContext();
+  const cantSlide = !emblaApi?.canScrollNext() && !emblaApi?.canScrollPrev();
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      "data-component": "embla-container",
+      className: cn(
+        "flex",
+        className,
+        cantSlide && [
+          "transform-[unset!important]"
+        ]
+      ),
+      style: { ...style },
+      children: [
+        SlideComponent && datas?.map((item, index) => /* @__PURE__ */ jsx(
+          SlideComponent,
+          {
+            ...item,
+            index,
+            ...props
+          },
+          item?.multipurpose?.key ?? item?.id ?? index
+        )),
+        children
+      ]
+    }
+  );
+};
+EmblaContainer.displayName = "EmblaContainer";
+var embla_container_default = EmblaContainer;
+var EmblaPagination = ({
+  color = "black",
+  align,
+  className,
+  maxDots = 5,
+  dynamic = true,
+  swiperNumber = true
+}) => {
+  const { selectIndex, scrollToIndex, scrollSnaps, autoPlayReset, emblaApi } = useCarouselContext();
+  const total = scrollSnaps?.length ?? 0;
+  const active = Math.max(0, Math.min(selectIndex ?? 0, Math.max(0, total - 1)));
+  const paginationNumber = `${Number(active + 1) < 10 ? "0" + Number(active + 1) : Number(active + 1)}`;
+  const isWhite = color === "white";
+  const clickEvent = (index) => {
+    scrollToIndex(index);
+    autoPlayReset();
+  };
+  const isSelected = (index) => {
+    return index === selectIndex;
+  };
+  const [selectedIndex, setSelectedIndex] = useState(0);
+  const [slideCount, setSlideCount] = useState(0);
+  useEffect(() => {
+    if (!emblaApi || !dynamic) return;
+    const update = () => {
+      setSelectedIndex(emblaApi.selectedScrollSnap());
+      setSlideCount(emblaApi.scrollSnapList().length);
+    };
+    emblaApi.on("select", update);
+    emblaApi.on("reInit", update);
+    update();
+    return () => {
+      emblaApi.off("select", update);
+      emblaApi.off("reInit", update);
+    };
+  }, [emblaApi, dynamic]);
+  const getVisibleBullets = () => {
+    const total2 = slideCount ?? 0;
+    if (total2 === 0) return [];
+    const limit = Math.max(1, Number(maxDots));
+    const windowSize = Math.min(total2, limit);
+    const left = Math.floor((windowSize - 1) / 2);
+    const right = windowSize - left - 1;
+    let start = selectedIndex - left;
+    let end = selectedIndex + right;
+    if (start < 0) {
+      end = Math.min(end - start, total2 - 1);
+      start = 0;
+    }
+    if (end > total2 - 1) {
+      start = Math.max(0, start - (end - (total2 - 1)));
+      end = total2 - 1;
+    }
+    return Array.from({ length: end - start + 1 }, (_, i) => start + i);
+  };
+  const visibleRange = getVisibleBullets();
+  const dots = dynamic ? visibleRange : scrollSnaps?.map((_, i) => i) ?? [];
+  const swiperSnap = [
+    "text-[16px]",
+    "font-semibold",
+    " leading-[1.4]"
+  ];
+  const paginationColorStyle = {
+    "black": "#000",
+    "white": "#fff"
+  }[color] || `${color}`;
+  const paginationColorStyle2 = {
+    "--pagination-color": paginationColorStyle
+  };
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      "data-compoents": "emblas-pagination",
+      className: cn(
+        "flex",
+        "items-center",
+        "gap-7.25",
+        align === "center" && [
+          "justify-center"
+        ],
+        className
+      ),
+      style: paginationColorStyle2,
+      children: [
+        swiperNumber && /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: cn(
+              swiperSnap,
+              "relative",
+              "after:absolute",
+              "after:top-1/2",
+              "after:right-[-15px]",
+              "after:-translate-y-1/2",
+              "after:block",
+              // "after:bg-black",
+              "after:bg-(--pagination-color)",
+              "after:w-0.5",
+              "after:h-3.75",
+              "after:opacity-20",
+              isWhite && [
+                "after:bg-white"
+              ]
+            ),
+            children: paginationNumber
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: cn(
+              "flex",
+              "flex-wrap",
+              "justify-end",
+              "items-center",
+              "gap-y-0",
+              "gap-x-2.5",
+              "**:data-[component='emblas-pagination-dots']:bg-(--pagination-color)",
+              isWhite && [
+                "**:data-[component='emblas-pagination-dots']:bg-white"
+              ]
+            ),
+            children: dots.map((index) => /* @__PURE__ */ jsx(
+              "div",
+              {
+                "data-component": "emblas-pagination-dots",
+                onClick: () => clickEvent(index),
+                className: cn(
+                  "w-1.5",
+                  "h-1.5",
+                  "rounded-full",
+                  "cursor-pointer",
+                  "opacity-30",
+                  isSelected(index) && "opacity-100"
+                )
+              },
+              index
+            ))
+          }
+        )
+      ]
+    }
+  );
+};
+EmblaPagination.displayName = "EmblaPagination";
+var emblas_pagination_default = EmblaPagination;
+var Tests = () => {
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(Carousel, { children: /* @__PURE__ */ jsx(CarouselPrevious, {}) }),
+    /* @__PURE__ */ jsx(Button, { children: "test123133232" })
+  ] });
+};
+Tests.displayName = "Tests";
+var tests_default = Tests;
+
+export { AnchorOffseter, AnchorTarget, AnchorTrigger, Anchors, CarouselContextProvider, embla_default as Embla, EmblaCarousels, EmblaCarouselsContents, EmblaCarouselsRoots, EmblaCarouselsSlides, embla_container_default as EmblaContainer, emblas_pagination_default as EmblaPagination, LenisContainerScroll, LenisRootScroll, LenisScroll, NativeScroll, ScrollContainer, ScrollContainerContext, tests_default as Tests, emblaCarouselsHooks, getRootLenis, getScrollContainer, getScrollContainerStores, setRootLenis, setScrollContainerStore, useCarouselContext, useCarouselsContext, useLenisStores, useScrollContainerContext, useScrollContainersStores };
+//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map