@expcat/tigercat-react 1.0.7 → 1.2.0

package/dist/{chunk-U3JOBIDU.js → chunk-FI53LYZ6.js}

@@ -1,11 +1,30 @@
-'use strict';
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }// src/components/ImageCropper.tsx
 
-var react = require('react');
-var tigercatCore = require('@expcat/tigercat-core');
-var jsxRuntime = require('react/jsx-runtime');
 
-// src/components/ImageCropper.tsx
-var ImageCropper = react.forwardRef(
+
+
+
+
+
+
+var _react = require('react');
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+var _tigercatcore = require('@expcat/tigercat-core');
+var _jsxruntime = require('react/jsx-runtime');
+var ImageCropper = _react.forwardRef.call(void 0, 
   ({
     src,
     aspectRatio,
@@ -19,21 +38,21 @@ var ImageCropper = react.forwardRef(
     onCropChange,
     onReady
   }, ref) => {
-    const containerRef = react.useRef(null);
-    const imageRef = react.useRef(null);
-    const [imageLoaded, setImageLoaded] = react.useState(false);
-    const [displayWidth, setDisplayWidth] = react.useState(0);
-    const [displayHeight, setDisplayHeight] = react.useState(0);
-    const [cropRect, setCropRect] = react.useState({ x: 0, y: 0, width: 0, height: 0 });
-    const dragModeRef = react.useRef("none");
-    const activeHandleRef = react.useRef(null);
-    const dragStartPosRef = react.useRef({ x: 0, y: 0 });
-    const dragStartRectRef = react.useRef({ x: 0, y: 0, width: 0, height: 0 });
-    const displayDimsRef = react.useRef({ w: 0, h: 0 });
-    react.useEffect(() => {
+    const containerRef = _react.useRef.call(void 0, null);
+    const imageRef = _react.useRef.call(void 0, null);
+    const [imageLoaded, setImageLoaded] = _react.useState.call(void 0, false);
+    const [displayWidth, setDisplayWidth] = _react.useState.call(void 0, 0);
+    const [displayHeight, setDisplayHeight] = _react.useState.call(void 0, 0);
+    const [cropRect, setCropRect] = _react.useState.call(void 0, { x: 0, y: 0, width: 0, height: 0 });
+    const dragModeRef = _react.useRef.call(void 0, "none");
+    const activeHandleRef = _react.useRef.call(void 0, null);
+    const dragStartPosRef = _react.useRef.call(void 0, { x: 0, y: 0 });
+    const dragStartRectRef = _react.useRef.call(void 0, { x: 0, y: 0, width: 0, height: 0 });
+    const displayDimsRef = _react.useRef.call(void 0, { w: 0, h: 0 });
+    _react.useEffect.call(void 0, () => {
       displayDimsRef.current = { w: displayWidth, h: displayHeight };
     }, [displayWidth, displayHeight]);
-    react.useEffect(() => {
+    _react.useEffect.call(void 0, () => {
       setImageLoaded(false);
       const img = new window.Image();
       img.crossOrigin = "anonymous";
@@ -48,14 +67,14 @@ var ImageCropper = react.forwardRef(
         setDisplayWidth(dw);
         setDisplayHeight(dh);
         displayDimsRef.current = { w: dw, h: dh };
-        const initial = tigercatCore.getInitialCropRect(dw, dh, aspectRatio);
+        const initial = _tigercatcore.getInitialCropRect.call(void 0, dw, dh, aspectRatio);
         setCropRect(initial);
         setImageLoaded(true);
-        onReady?.();
+        _optionalChain([onReady, 'optionalCall', _ => _()]);
       };
       img.src = src;
     }, [src, aspectRatio, onReady]);
-    react.useImperativeHandle(
+    _react.useImperativeHandle.call(void 0, 
       ref,
       () => ({
         getCropResult: () => {
@@ -64,7 +83,7 @@ var ImageCropper = react.forwardRef(
               reject(new Error("Image not loaded"));
               return;
             }
-            const { canvas, dataUrl } = tigercatCore.cropCanvas(
+            const { canvas, dataUrl } = _tigercatcore.cropCanvas.call(void 0, 
               imageRef.current,
               cropRect,
               displayWidth,
@@ -88,7 +107,7 @@ var ImageCropper = react.forwardRef(
       }),
       [cropRect, displayWidth, displayHeight, outputType, quality]
     );
-    const handleMouseDown = react.useCallback(
+    const handleMouseDown = _react.useCallback.call(void 0, 
       (e, mode, handle) => {
         e.preventDefault();
         e.stopPropagation();
@@ -102,9 +121,9 @@ var ImageCropper = react.forwardRef(
           const dims = displayDimsRef.current;
           let newRect;
           if (dragModeRef.current === "move") {
-            newRect = tigercatCore.moveCropRect(dragStartRectRef.current, dx, dy, dims.w, dims.h);
+            newRect = _tigercatcore.moveCropRect.call(void 0, dragStartRectRef.current, dx, dy, dims.w, dims.h);
           } else {
-            newRect = tigercatCore.resizeCropRect(
+            newRect = _tigercatcore.resizeCropRect.call(void 0, 
               dragStartRectRef.current,
               activeHandleRef.current,
               dx,
@@ -117,7 +136,7 @@ var ImageCropper = react.forwardRef(
             );
           }
           setCropRect(newRect);
-          onCropChange?.(newRect);
+          _optionalChain([onCropChange, 'optionalCall', _2 => _2(newRect)]);
         };
         const onMouseUp = () => {
           dragModeRef.current = "none";
@@ -130,7 +149,7 @@ var ImageCropper = react.forwardRef(
       },
       [cropRect, aspectRatio, minWidth, minHeight, onCropChange]
     );
-    const handleTouchStart = react.useCallback(
+    const handleTouchStart = _react.useCallback.call(void 0, 
       (e, mode, handle) => {
         if (e.touches.length !== 1) return;
         e.preventDefault();
@@ -148,9 +167,9 @@ var ImageCropper = react.forwardRef(
           const dims = displayDimsRef.current;
           let newRect;
           if (dragModeRef.current === "move") {
-            newRect = tigercatCore.moveCropRect(dragStartRectRef.current, dx, dy, dims.w, dims.h);
+            newRect = _tigercatcore.moveCropRect.call(void 0, dragStartRectRef.current, dx, dy, dims.w, dims.h);
           } else {
-            newRect = tigercatCore.resizeCropRect(
+            newRect = _tigercatcore.resizeCropRect.call(void 0, 
               dragStartRectRef.current,
               activeHandleRef.current,
               dx,
@@ -163,7 +182,7 @@ var ImageCropper = react.forwardRef(
             );
           }
           setCropRect(newRect);
-          onCropChange?.(newRect);
+          _optionalChain([onCropChange, 'optionalCall', _3 => _3(newRect)]);
         };
         const onTouchEnd = () => {
           dragModeRef.current = "none";
@@ -176,25 +195,84 @@ var ImageCropper = react.forwardRef(
       },
       [cropRect, aspectRatio, minWidth, minHeight, onCropChange]
     );
-    const containerClasses = react.useMemo(
-      () => tigercatCore.classNames(tigercatCore.imageCropperContainerClasses, className),
+    const updateCropRect = _react.useCallback.call(void 0, 
+      (nextRect) => {
+        setCropRect(nextRect);
+        _optionalChain([onCropChange, 'optionalCall', _4 => _4(nextRect)]);
+      },
+      [onCropChange]
+    );
+    const handleMoveKeyDown = _react.useCallback.call(void 0, 
+      (e) => {
+        const step = e.shiftKey ? 10 : 1;
+        const deltas = {
+          ArrowLeft: { dx: -step, dy: 0 },
+          ArrowRight: { dx: step, dy: 0 },
+          ArrowUp: { dx: 0, dy: -step },
+          ArrowDown: { dx: 0, dy: step }
+        };
+        const delta = deltas[e.key];
+        if (!delta) return;
+        e.preventDefault();
+        updateCropRect(
+          _tigercatcore.moveCropRect.call(void 0, 
+            cropRect,
+            delta.dx,
+            delta.dy,
+            displayDimsRef.current.w,
+            displayDimsRef.current.h
+          )
+        );
+      },
+      [cropRect, updateCropRect]
+    );
+    const handleResizeKeyDown = _react.useCallback.call(void 0, 
+      (e, handle) => {
+        const step = e.shiftKey ? 10 : 1;
+        const deltas = {
+          ArrowLeft: { dx: -step, dy: 0 },
+          ArrowRight: { dx: step, dy: 0 },
+          ArrowUp: { dx: 0, dy: -step },
+          ArrowDown: { dx: 0, dy: step }
+        };
+        const delta = deltas[e.key];
+        if (!delta) return;
+        e.preventDefault();
+        updateCropRect(
+          _tigercatcore.resizeCropRect.call(void 0, 
+            cropRect,
+            handle,
+            delta.dx,
+            delta.dy,
+            displayDimsRef.current.w,
+            displayDimsRef.current.h,
+            aspectRatio,
+            minWidth,
+            minHeight
+          )
+        );
+      },
+      [cropRect, aspectRatio, minWidth, minHeight, updateCropRect]
+    );
+    const containerClasses = _react.useMemo.call(void 0, 
+      () => _tigercatcore.classNames.call(void 0, _tigercatcore.imageCropperContainerClasses, className),
       [className]
     );
     const cr = cropRect;
     if (!imageLoaded) {
-      return /* @__PURE__ */ jsxRuntime.jsx(
+      return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
         "div",
         {
           ref: containerRef,
-          className: tigercatCore.classNames(containerClasses, "flex items-center justify-center"),
+          className: _tigercatcore.classNames.call(void 0, containerClasses, "flex items-center justify-center"),
           style: { ...style, minHeight: "200px" },
           role: "img",
           "aria-label": "Loading image for cropping",
-          children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-8 h-8 border-2 border-white/30 border-t-white rounded-full animate-spin" })
+          children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "w-8 h-8 border-2 border-white/30 border-t-white rounded-full animate-spin" })
         }
       );
     }
-    return /* @__PURE__ */ jsxRuntime.jsxs(
+    return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
       "div",
       {
         ref: containerRef,
@@ -208,29 +286,29 @@ var ImageCropper = react.forwardRef(
         "aria-label": "Image cropper",
         "aria-roledescription": "image cropper",
         children: [
-          /* @__PURE__ */ jsxRuntime.jsx(
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
             "img",
             {
               src,
-              className: tigercatCore.imageCropperImgClasses,
+              className: _tigercatcore.imageCropperImgClasses,
               style: { width: `${displayWidth}px`, height: `${displayHeight}px` },
               draggable: false,
               alt: "Image to crop"
             }
           ),
-          /* @__PURE__ */ jsxRuntime.jsxs(
+          /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
             "svg",
             {
-              className: tigercatCore.imageCropperMaskClasses,
+              className: _tigercatcore.imageCropperMaskClasses,
               width: displayWidth,
               height: displayHeight,
               xmlns: "http://www.w3.org/2000/svg",
               children: [
-                /* @__PURE__ */ jsxRuntime.jsx("defs", { children: /* @__PURE__ */ jsxRuntime.jsxs("mask", { id: "crop-mask", children: [
-                  /* @__PURE__ */ jsxRuntime.jsx("rect", { width: displayWidth, height: displayHeight, fill: "white" }),
-                  /* @__PURE__ */ jsxRuntime.jsx("rect", { x: cr.x, y: cr.y, width: cr.width, height: cr.height, fill: "black" })
+                /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "defs", { children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "mask", { id: "crop-mask", children: [
+                  /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "rect", { width: displayWidth, height: displayHeight, fill: "white" }),
+                  /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "rect", { x: cr.x, y: cr.y, width: cr.width, height: cr.height, fill: "black" })
                 ] }) }),
-                /* @__PURE__ */ jsxRuntime.jsx(
+                /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
                   "rect",
                   {
                     width: displayWidth,
@@ -242,10 +320,10 @@ var ImageCropper = react.forwardRef(
               ]
             }
           ),
-          /* @__PURE__ */ jsxRuntime.jsx(
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
             "div",
             {
-              className: tigercatCore.imageCropperSelectionClasses,
+              className: _tigercatcore.imageCropperSelectionClasses,
               style: {
                 left: `${cr.x}px`,
                 top: `${cr.y}px`,
@@ -254,25 +332,30 @@ var ImageCropper = react.forwardRef(
               }
             }
           ),
-          /* @__PURE__ */ jsxRuntime.jsx(
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
             "div",
             {
-              className: tigercatCore.imageCropperDragAreaClasses,
+              className: _tigercatcore.imageCropperDragAreaClasses,
               style: {
                 left: `${cr.x}px`,
                 top: `${cr.y}px`,
                 width: `${cr.width}px`,
                 height: `${cr.height}px`
               },
+              role: "button",
+              tabIndex: 0,
+              "aria-label": "Move crop area",
               onMouseDown: (e) => handleMouseDown(e, "move"),
-              onTouchStart: (e) => handleTouchStart(e, "move")
+              onTouchStart: (e) => handleTouchStart(e, "move"),
+              onKeyDown: handleMoveKeyDown
             }
           ),
-          guides && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-            /* @__PURE__ */ jsxRuntime.jsx(
+          guides && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
+            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
               "div",
               {
-                className: tigercatCore.imageCropperGuideClasses,
+                className: _tigercatcore.imageCropperGuideClasses,
+                "data-guide": "true",
                 style: {
                   left: `${cr.x}px`,
                   top: `${cr.y + cr.height / 3}px`,
@@ -283,10 +366,11 @@ var ImageCropper = react.forwardRef(
                 }
               }
             ),
-            /* @__PURE__ */ jsxRuntime.jsx(
+            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
               "div",
               {
-                className: tigercatCore.imageCropperGuideClasses,
+                className: _tigercatcore.imageCropperGuideClasses,
+                "data-guide": "true",
                 style: {
                   left: `${cr.x}px`,
                   top: `${cr.y + cr.height * 2 / 3}px`,
@@ -297,10 +381,11 @@ var ImageCropper = react.forwardRef(
                 }
               }
             ),
-            /* @__PURE__ */ jsxRuntime.jsx(
+            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
               "div",
               {
-                className: tigercatCore.imageCropperGuideClasses,
+                className: _tigercatcore.imageCropperGuideClasses,
+                "data-guide": "true",
                 style: {
                   left: `${cr.x + cr.width / 3}px`,
                   top: `${cr.y}px`,
@@ -311,10 +396,11 @@ var ImageCropper = react.forwardRef(
                 }
               }
             ),
-            /* @__PURE__ */ jsxRuntime.jsx(
+            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
               "div",
               {
-                className: tigercatCore.imageCropperGuideClasses,
+                className: _tigercatcore.imageCropperGuideClasses,
+                "data-guide": "true",
                 style: {
                   left: `${cr.x + cr.width * 2 / 3}px`,
                   top: `${cr.y}px`,
@@ -326,7 +412,7 @@ var ImageCropper = react.forwardRef(
               }
             )
           ] }),
-          tigercatCore.CROP_HANDLES.map((handle) => {
+          _tigercatcore.CROP_HANDLES.map((handle) => {
             const pos = {};
             if (handle.includes("n")) pos.top = `${cr.y}px`;
             if (handle.includes("s")) pos.top = `${cr.y + cr.height}px`;
@@ -334,13 +420,17 @@ var ImageCropper = react.forwardRef(
             if (handle.includes("w")) pos.left = `${cr.x}px`;
             if (handle.includes("e")) pos.left = `${cr.x + cr.width}px`;
             if (handle === "n" || handle === "s") pos.left = `${cr.x + cr.width / 2}px`;
-            return /* @__PURE__ */ jsxRuntime.jsx(
+            return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
               "div",
               {
-                className: tigercatCore.getCropperHandleClasses(handle),
+                className: _tigercatcore.getCropperHandleClasses.call(void 0, handle),
                 style: pos,
+                role: "button",
+                tabIndex: 0,
+                "aria-label": `Resize crop area ${handle}`,
                 onMouseDown: (e) => handleMouseDown(e, "resize", handle),
-                onTouchStart: (e) => handleTouchStart(e, "resize", handle)
+                onTouchStart: (e) => handleTouchStart(e, "resize", handle),
+                onKeyDown: (e) => handleResizeKeyDown(e, handle)
               },
               handle
             );
@@ -352,4 +442,6 @@ var ImageCropper = react.forwardRef(
 );
 ImageCropper.displayName = "ImageCropper";
 
+
+
 exports.ImageCropper = ImageCropper;

package/dist/chunk-FLYJVZED.mjs

@@ -1,7 +1,12 @@
-import { icon24StrokeWidth, icon24ViewBox, icon24PathStrokeLinejoin, icon24PathStrokeLinecap, classNames } from '@expcat/tigercat-core';
-import { jsx } from 'react/jsx-runtime';
-
 // src/components/shared/icons.tsx
+import {
+  icon24ViewBox,
+  icon24StrokeWidth,
+  icon24PathStrokeLinecap,
+  icon24PathStrokeLinejoin,
+  classNames
+} from "@expcat/tigercat-core";
+import { jsx } from "react/jsx-runtime";
 var StatusIcon = ({ path, className, ...svgProps }) => /* @__PURE__ */ jsx(
   "svg",
   {
@@ -27,4 +32,7 @@ var StatusIconWithLoading = ({ path, className, isLoading = false, spinnerClass
   return /* @__PURE__ */ jsx(StatusIcon, { path, className: merged });
 };
 
-export { StatusIcon, StatusIconWithLoading };
+export {
+  StatusIcon,
+  StatusIconWithLoading
+};

package/dist/{chunk-AVUXDQYO.mjs → chunk-FNJDBFKM.mjs}

@@ -1,8 +1,25 @@
-import { useEffect, useState, useMemo } from 'react';
-import { injectLoadingAnimationStyles, classNames, loadingFullscreenBaseClasses, loadingContainerBaseClasses, getLoadingTextClasses, getSpinnerSVG, getLoadingClasses, loadingColorClasses, getLoadingBarsWrapperClasses, getLoadingBarClasses, getLoadingDotsWrapperClasses, getLoadingDotClasses } from '@expcat/tigercat-core';
-import { jsxs, jsx } from 'react/jsx-runtime';
+import {
+  renderBodyPortal,
+  useBodyScrollLock
+} from "./chunk-SEWNVIHH.mjs";
 
 // src/components/Loading.tsx
+import { useEffect, useState, useMemo } from "react";
+import {
+  classNames,
+  getLoadingBarClasses,
+  getLoadingBarsWrapperClasses,
+  getLoadingClasses,
+  getLoadingDotClasses,
+  getLoadingDotsWrapperClasses,
+  getLoadingTextClasses,
+  getSpinnerSVG,
+  loadingContainerBaseClasses,
+  loadingFullscreenBaseClasses,
+  loadingColorClasses,
+  injectLoadingAnimationStyles
+} from "@expcat/tigercat-core";
+import { jsx, jsxs } from "react/jsx-runtime";
 var Loading = ({
   variant = "spinner",
   size = "md",
@@ -12,14 +29,16 @@ var Loading = ({
   delay = 0,
   background = "rgba(255, 255, 255, 0.9)",
   customColor,
+  lockScroll = true,
   className,
   style,
   ...props
 }) => {
+  const [visible, setVisible] = useState(delay <= 0);
   useEffect(() => {
     injectLoadingAnimationStyles();
   }, []);
-  const [visible, setVisible] = useState(delay <= 0);
+  useBodyScrollLock({ enabled: fullscreen && visible && lockScroll });
   useEffect(() => {
     if (delay <= 0) {
       setVisible(true);
@@ -91,7 +110,7 @@ var Loading = ({
   if (!visible) {
     return null;
   }
-  return /* @__PURE__ */ jsxs(
+  const loadingNode = /* @__PURE__ */ jsxs(
     "div",
     {
       className: containerClasses,
@@ -107,6 +126,12 @@ var Loading = ({
       ]
     }
   );
+  if (fullscreen) {
+    return renderBodyPortal(loadingNode);
+  }
+  return loadingNode;
 };
 
-export { Loading };
+export {
+  Loading
+};

package/dist/chunk-FUE7IBTJ.mjs

@@ -0,0 +1,129 @@
+// src/components/ScrollSpy.tsx
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import {
+  classNames,
+  createScrollSpyObserver,
+  createScrollSpyPayload,
+  flattenScrollSpyItems,
+  getInitialScrollSpyActiveKey,
+  getScrollSpyItemClasses,
+  getScrollSpyItemByKey,
+  getScrollSpyKeyString,
+  getScrollSpyListClasses,
+  getScrollSpyRootClasses,
+  scrollSpyNestedListClasses,
+  scrollToScrollSpyItem
+} from "@expcat/tigercat-core";
+import { jsx, jsxs } from "react/jsx-runtime";
+var getWindowContainer = () => window;
+var ScrollSpy = ({
+  items = [],
+  activeKey,
+  defaultActiveKey,
+  offsetTop = 0,
+  targetOffset,
+  bounds = 5,
+  direction = "vertical",
+  sticky = false,
+  ariaLabel = "Scroll navigation",
+  getContainer = getWindowContainer,
+  className,
+  style,
+  onChange,
+  onClick,
+  ...rest
+}) => {
+  const isControlled = activeKey !== void 0;
+  const [innerActiveKey, setInnerActiveKey] = useState(
+    () => getInitialScrollSpyActiveKey(items, activeKey, defaultActiveKey)
+  );
+  const currentActiveKey = isControlled ? activeKey : innerActiveKey;
+  const flatItems = useMemo(() => flattenScrollSpyItems(items), [items]);
+  const activeKeyString = currentActiveKey === void 0 ? "" : getScrollSpyKeyString(currentActiveKey);
+  const getContainerRef = useRef(getContainer);
+  getContainerRef.current = getContainer;
+  const onChangeRef = useRef(onChange);
+  onChangeRef.current = onChange;
+  const emitActive = useCallback(
+    (item, source) => {
+      const nextKeyString = getScrollSpyKeyString(item.key);
+      if (nextKeyString === activeKeyString) return;
+      const payload = createScrollSpyPayload(item, source);
+      if (!isControlled) setInnerActiveKey(item.key);
+      onChangeRef.current?.(item.key, item, payload);
+    },
+    [activeKeyString, isControlled]
+  );
+  useEffect(() => {
+    if (isControlled) return;
+    const currentItem = getScrollSpyItemByKey(items, innerActiveKey);
+    if (!currentItem || currentItem.disabled) {
+      setInnerActiveKey(getInitialScrollSpyActiveKey(items, void 0, defaultActiveKey));
+    }
+  }, [defaultActiveKey, innerActiveKey, isControlled, items]);
+  useEffect(() => {
+    const container = getContainerRef.current();
+    return createScrollSpyObserver(items, {
+      container,
+      offsetTop,
+      targetOffset,
+      bounds,
+      onChange: (item) => emitActive(item, "scroll")
+    });
+  }, [bounds, emitActive, items, offsetTop, targetOffset]);
+  const handleClick = useCallback(
+    (item, event) => {
+      event.preventDefault();
+      if (item.disabled) return;
+      onClick?.(item, event);
+      emitActive(item, "click");
+      scrollToScrollSpyItem(item, getContainerRef.current(), targetOffset ?? offsetTop);
+    },
+    [emitActive, offsetTop, onClick, targetOffset]
+  );
+  function renderItems(list, nested = false) {
+    return /* @__PURE__ */ jsx("ul", { className: nested ? scrollSpyNestedListClasses : getScrollSpyListClasses(direction), children: list.map((item) => {
+      const keyString = getScrollSpyKeyString(item.key);
+      const isActive = keyString === activeKeyString;
+      const hasChildren = Boolean(item.children?.length);
+      return /* @__PURE__ */ jsxs(
+        "li",
+        {
+          "data-depth": flatItems.find((flat) => flat.key === item.key)?.depth ?? 0,
+          children: [
+            /* @__PURE__ */ jsx(
+              "a",
+              {
+                href: item.href,
+                className: getScrollSpyItemClasses(isActive, item.disabled),
+                "aria-current": isActive ? "location" : void 0,
+                "aria-disabled": item.disabled || void 0,
+                "data-key": keyString,
+                onClick: (event) => handleClick(item, event),
+                children: item.label
+              }
+            ),
+            hasChildren ? renderItems(item.children ?? [], true) : null
+          ]
+        },
+        keyString
+      );
+    }) });
+  }
+  return /* @__PURE__ */ jsx(
+    "nav",
+    {
+      ...rest,
+      className: classNames(getScrollSpyRootClasses(sticky, className)),
+      style,
+      "aria-label": ariaLabel,
+      children: renderItems(items)
+    }
+  );
+};
+var ScrollSpy_default = ScrollSpy;
+
+export {
+  ScrollSpy,
+  ScrollSpy_default
+};