@expcat/tigercat-react 0.3.0 → 0.3.70

package/dist/chunk-GNMOOYHG.js

@@ -0,0 +1,250 @@
+'use strict';
+
+var chunkZYPEO2KY_js = require('./chunk-ZYPEO2KY.js');
+var react = require('react');
+var reactDom = require('react-dom');
+var tigercatCore = require('@expcat/tigercat-core');
+var jsxRuntime = require('react/jsx-runtime');
+
+var SvgIcon = ({ d, cls = "w-5 h-5" }) => /* @__PURE__ */ jsxRuntime.jsx(
+  "svg",
+  {
+    className: cls,
+    xmlns: "http://www.w3.org/2000/svg",
+    fill: "none",
+    viewBox: "0 0 24 24",
+    stroke: "currentColor",
+    children: /* @__PURE__ */ jsxRuntime.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "2", d })
+  }
+);
+var ImagePreview = ({
+  visible,
+  images,
+  currentIndex = 0,
+  zIndex = 1050,
+  maskClosable = true,
+  scaleStep = 0.5,
+  minScale = 0.25,
+  maxScale = 5,
+  onVisibleChange,
+  onCurrentIndexChange,
+  onScaleChange
+}) => {
+  const [scale, setScale] = react.useState(1);
+  const [offsetX, setOffsetX] = react.useState(0);
+  const [offsetY, setOffsetY] = react.useState(0);
+  const [index, setIndex] = react.useState(currentIndex);
+  const draggingRef = react.useRef(false);
+  const dragStartRef = react.useRef({ x: 0, y: 0, ox: 0, oy: 0 });
+  const resetTransform = react.useCallback(() => {
+    setScale(1);
+    setOffsetX(0);
+    setOffsetY(0);
+  }, []);
+  react.useEffect(() => {
+    setIndex(currentIndex);
+    resetTransform();
+  }, [currentIndex, resetTransform]);
+  react.useEffect(() => {
+    if (visible) {
+      resetTransform();
+      setIndex(currentIndex);
+      document.body.style.overflow = "hidden";
+    } else {
+      document.body.style.overflow = "";
+    }
+    return () => {
+      document.body.style.overflow = "";
+    };
+  }, [visible, currentIndex, resetTransform]);
+  const handleClose = react.useCallback(() => {
+    onVisibleChange?.(false);
+  }, [onVisibleChange]);
+  chunkZYPEO2KY_js.useEscapeKey({ enabled: !!visible, onEscape: handleClose });
+  const navState = react.useMemo(() => tigercatCore.getPreviewNavState(index, images.length), [index, images.length]);
+  const handleZoomIn = react.useCallback(() => {
+    setScale((s) => {
+      const next = tigercatCore.clampScale(s + scaleStep, minScale, maxScale);
+      onScaleChange?.(next);
+      return next;
+    });
+  }, [scaleStep, minScale, maxScale, onScaleChange]);
+  const handleZoomOut = react.useCallback(() => {
+    setScale((s) => {
+      const next = tigercatCore.clampScale(s - scaleStep, minScale, maxScale);
+      onScaleChange?.(next);
+      return next;
+    });
+  }, [scaleStep, minScale, maxScale, onScaleChange]);
+  const handleReset = react.useCallback(() => {
+    resetTransform();
+    onScaleChange?.(1);
+  }, [resetTransform, onScaleChange]);
+  const handlePrev = react.useCallback(() => {
+    if (index > 0) {
+      const next = index - 1;
+      setIndex(next);
+      resetTransform();
+      onCurrentIndexChange?.(next);
+    }
+  }, [index, resetTransform, onCurrentIndexChange]);
+  const handleNext = react.useCallback(() => {
+    if (index < images.length - 1) {
+      const next = index + 1;
+      setIndex(next);
+      resetTransform();
+      onCurrentIndexChange?.(next);
+    }
+  }, [index, images.length, resetTransform, onCurrentIndexChange]);
+  react.useEffect(() => {
+    if (!visible) return;
+    const handler = (e) => {
+      if (e.key === "ArrowLeft") handlePrev();
+      if (e.key === "ArrowRight") handleNext();
+    };
+    document.addEventListener("keydown", handler);
+    return () => document.removeEventListener("keydown", handler);
+  }, [visible, handlePrev, handleNext]);
+  const handleWheel = react.useCallback(
+    (e) => {
+      e.preventDefault();
+      const delta = e.deltaY > 0 ? -scaleStep : scaleStep;
+      setScale((s) => {
+        const next = tigercatCore.clampScale(s + delta, minScale, maxScale);
+        onScaleChange?.(next);
+        return next;
+      });
+    },
+    [scaleStep, minScale, maxScale, onScaleChange]
+  );
+  const handleMouseDown = react.useCallback(
+    (e) => {
+      if (e.button !== 0) return;
+      e.preventDefault();
+      draggingRef.current = true;
+      dragStartRef.current = { x: e.clientX, y: e.clientY, ox: offsetX, oy: offsetY };
+    },
+    [offsetX, offsetY]
+  );
+  const handleMouseMove = react.useCallback((e) => {
+    if (!draggingRef.current) return;
+    setOffsetX(dragStartRef.current.ox + (e.clientX - dragStartRef.current.x));
+    setOffsetY(dragStartRef.current.oy + (e.clientY - dragStartRef.current.y));
+  }, []);
+  const handleMouseUp = react.useCallback(() => {
+    draggingRef.current = false;
+  }, []);
+  const handleMaskClick = react.useCallback(
+    (e) => {
+      if (maskClosable && e.target === e.currentTarget) {
+        handleClose();
+      }
+    },
+    [maskClosable, handleClose]
+  );
+  const transform = react.useMemo(
+    () => tigercatCore.calculateTransform(scale, offsetX, offsetY),
+    [scale, offsetX, offsetY]
+  );
+  if (!visible || !images.length) return null;
+  const currentSrc = images[index] || images[0];
+  return reactDom.createPortal(
+    /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        className: tigercatCore.imagePreviewWrapperClasses,
+        style: { zIndex },
+        role: "dialog",
+        "aria-modal": "true",
+        "aria-label": "Image preview",
+        onClick: handleMaskClick,
+        onWheel: handleWheel,
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx("div", { className: tigercatCore.imagePreviewMaskClasses, "aria-hidden": "true" }),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "img",
+            {
+              src: currentSrc,
+              className: tigercatCore.imagePreviewImgClasses,
+              style: { transform },
+              alt: `Preview image ${index + 1}`,
+              draggable: false,
+              onMouseDown: handleMouseDown,
+              onMouseMove: handleMouseMove,
+              onMouseUp: handleMouseUp,
+              onMouseLeave: handleMouseUp
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "button",
+            {
+              className: tigercatCore.imagePreviewCloseBtnClasses,
+              onClick: handleClose,
+              "aria-label": "Close preview",
+              type: "button",
+              children: /* @__PURE__ */ jsxRuntime.jsx(SvgIcon, { d: tigercatCore.previewCloseIconPath })
+            }
+          ),
+          images.length > 1 && /* @__PURE__ */ jsxRuntime.jsx(
+            "button",
+            {
+              className: tigercatCore.classNames(tigercatCore.imagePreviewNavBtnClasses, "left-4"),
+              onClick: handlePrev,
+              disabled: !navState.hasPrev,
+              "aria-label": "Previous image",
+              type: "button",
+              children: /* @__PURE__ */ jsxRuntime.jsx(SvgIcon, { d: tigercatCore.prevIconPath })
+            }
+          ),
+          images.length > 1 && /* @__PURE__ */ jsxRuntime.jsx(
+            "button",
+            {
+              className: tigercatCore.classNames(tigercatCore.imagePreviewNavBtnClasses, "right-4"),
+              onClick: handleNext,
+              disabled: !navState.hasNext,
+              "aria-label": "Next image",
+              type: "button",
+              children: /* @__PURE__ */ jsxRuntime.jsx(SvgIcon, { d: tigercatCore.nextIconPath })
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: tigercatCore.imagePreviewToolbarClasses, children: [
+            /* @__PURE__ */ jsxRuntime.jsx(
+              "button",
+              {
+                className: tigercatCore.imagePreviewToolbarBtnClasses,
+                onClick: handleZoomOut,
+                "aria-label": "Zoom out",
+                type: "button",
+                children: /* @__PURE__ */ jsxRuntime.jsx(SvgIcon, { d: tigercatCore.zoomOutIconPath })
+              }
+            ),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              "button",
+              {
+                className: tigercatCore.imagePreviewToolbarBtnClasses,
+                onClick: handleReset,
+                "aria-label": "Reset",
+                type: "button",
+                children: /* @__PURE__ */ jsxRuntime.jsx(SvgIcon, { d: tigercatCore.resetIconPath })
+              }
+            ),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              "button",
+              {
+                className: tigercatCore.imagePreviewToolbarBtnClasses,
+                onClick: handleZoomIn,
+                "aria-label": "Zoom in",
+                type: "button",
+                children: /* @__PURE__ */ jsxRuntime.jsx(SvgIcon, { d: tigercatCore.zoomInIconPath })
+              }
+            ),
+            navState.counter && /* @__PURE__ */ jsxRuntime.jsx("span", { className: tigercatCore.imagePreviewCounterClasses, children: navState.counter })
+          ] })
+        ]
+      }
+    ),
+    document.body
+  );
+};
+
+exports.ImagePreview = ImagePreview;

package/dist/{chunk-GXTBCX3M.js → chunk-H5MZ54PM.js}

@@ -26,14 +26,15 @@ var Steps = ({
   children,
   ...props
 }) => {
-  const containerClasses = tigercatCore.classNames(tigercatCore.getStepsContainerClasses(direction), className);
-  const handleStepClick = (index) => {
-    if (!clickable) {
-      return;
-    }
+  const containerClasses = React.useMemo(
+    () => tigercatCore.classNames(tigercatCore.getStepsContainerClasses(direction), className),
+    [direction, className]
+  );
+  const handleStepClick = React.useCallback((index) => {
+    if (!clickable) return;
     onChange?.(index);
-  };
-  const contextValue = {
+  }, [clickable, onChange]);
+  const contextValue = React.useMemo(() => ({
     current,
     status,
     direction,
@@ -41,7 +42,7 @@ var Steps = ({
     simple,
     clickable,
     handleStepClick: clickable ? handleStepClick : void 0
-  };
+  }), [current, status, direction, size, simple, clickable, handleStepClick]);
   const totalCount = React__default.default.Children.count(children);
   const stepsWithProps = React__default.default.Children.map(children, (child, index) => {
     if (React__default.default.isValidElement(child) && child.type === StepsItem) {
@@ -52,10 +53,7 @@ var Steps = ({
     }
     return child;
   });
-  const mergedStyle = {
-    ...style ?? {}
-  };
-  return /* @__PURE__ */ jsxRuntime.jsx(StepsContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsxRuntime.jsx("ol", { ...props, className: containerClasses, style: mergedStyle, children: stepsWithProps }) });
+  return /* @__PURE__ */ jsxRuntime.jsx(StepsContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsxRuntime.jsx("ol", { ...props, className: containerClasses, style, children: stepsWithProps }) });
 };
 var StepsItem = ({
   title,
@@ -85,18 +83,16 @@ var StepsItem = ({
   );
   const isClickable = !!stepsContext.handleStepClick && !disabled;
   const itemClasses = tigercatCore.classNames(
-    tigercatCore.getStepItemClasses(stepsContext.direction, isLast, stepsContext.simple),
+    tigercatCore.getStepItemClasses(stepsContext.direction, isLast),
     className
   );
   const iconClasses = tigercatCore.getStepIconClasses(stepStatus, stepsContext.size, stepsContext.simple, !!icon);
-  const tailClasses = tigercatCore.getStepTailClasses(stepsContext.direction, stepStatus, isLast);
-  const contentClasses = tigercatCore.getStepContentClasses(stepsContext.direction, stepsContext.simple);
+  const tailClasses = tigercatCore.getStepTailClasses(stepsContext.direction, stepStatus, isLast, stepsContext.size, stepsContext.simple);
+  const contentClasses = tigercatCore.getStepContentClasses(stepsContext.direction);
   const titleClasses = tigercatCore.getStepTitleClasses(stepStatus, stepsContext.size, isClickable);
   const descriptionClasses = tigercatCore.getStepDescriptionClasses(stepStatus, stepsContext.size);
-  const handleClick = (_event) => {
-    if (!isClickable) {
-      return;
-    }
+  const handleClick = () => {
+    if (!isClickable) return;
     stepsContext.handleStepClick?.(stepIndex);
   };
   const renderIcon = () => {
@@ -104,26 +100,7 @@ var StepsItem = ({
       return /* @__PURE__ */ jsxRuntime.jsx("div", { className: iconClasses, children: icon });
     }
     if (stepStatus === "finish") {
-      return /* @__PURE__ */ jsxRuntime.jsx("div", { className: iconClasses, children: /* @__PURE__ */ jsxRuntime.jsx(
-        "svg",
-        {
-          className: tigercatCore.stepFinishIconSvgClasses,
-          fill: "none",
-          stroke: "currentColor",
-          viewBox: tigercatCore.stepFinishIconViewBox,
-          "aria-hidden": "true",
-          focusable: "false",
-          children: /* @__PURE__ */ jsxRuntime.jsx(
-            "path",
-            {
-              strokeLinecap: tigercatCore.stepFinishIconPathStrokeLinecap,
-              strokeLinejoin: tigercatCore.stepFinishIconPathStrokeLinejoin,
-              strokeWidth: tigercatCore.stepFinishIconPathStrokeWidth,
-              d: tigercatCore.stepFinishIconPathD
-            }
-          )
-        }
-      ) });
+      return /* @__PURE__ */ jsxRuntime.jsx("div", { className: iconClasses, "aria-hidden": "true", children: tigercatCore.stepFinishChar });
     }
     return /* @__PURE__ */ jsxRuntime.jsx("div", { className: iconClasses, children: stepIndex + 1 });
   };

package/dist/{chunk-4TWHENPT.js → chunk-HB2UYJBY.js}

@@ -19,11 +19,11 @@ var Dropdown = ({
   visible: controlledVisible,
   defaultVisible = false,
   closeOnClick = true,
+  showArrow = true,
   className,
   style,
   onVisibleChange,
   children,
-  onKeyDown,
   ...divProps
 }) => {
   const [internalVisible, setInternalVisible] = React.useState(defaultVisible);
@@ -32,6 +32,9 @@ var Dropdown = ({
   const triggerRef = React.useRef(null);
   const floatingRef = React.useRef(null);
   const hoverTimerRef = React.useRef(null);
+  React.useEffect(() => {
+    tigercatCore.injectDropdownStyles();
+  }, []);
   const setVisible = React.useCallback(
     (newVisible) => {
       if (disabled && newVisible) return;
@@ -92,13 +95,12 @@ var Dropdown = ({
       }
     };
   }, []);
-  const containerClasses = tigercatCore.classNames(
-    tigercatCore.getDropdownContainerClasses(),
-    "tiger-dropdown-container",
-    className
+  const containerClasses = React.useMemo(
+    () => tigercatCore.classNames(tigercatCore.getDropdownContainerClasses(), "tiger-dropdown-container", className),
+    [className]
   );
-  const triggerClasses = tigercatCore.getDropdownTriggerClasses(disabled);
-  const menuWrapperClasses = "absolute z-50";
+  const triggerClasses = React.useMemo(() => tigercatCore.getDropdownTriggerClasses(disabled), [disabled]);
+  const menuWrapperClasses = tigercatCore.classNames("absolute z-50", tigercatCore.DROPDOWN_ENTER_CLASS);
   const menuWrapperStyles = React.useMemo(
     () => ({
       position: "absolute",
@@ -108,10 +110,10 @@ var Dropdown = ({
     }),
     [x, y, placement]
   );
-  const contextValue = {
-    closeOnClick,
-    handleItemClick
-  };
+  const contextValue = React.useMemo(
+    () => ({ closeOnClick, handleItemClick }),
+    [closeOnClick, handleItemClick]
+  );
   const childrenArray = React__default.default.Children.toArray(children);
   let triggerElement = null;
   let menuElement = null;
@@ -128,19 +130,29 @@ var Dropdown = ({
       triggerElement = child;
     }
   });
-  const handleContainerKeyDown = (event) => {
-    onKeyDown?.(event);
-  };
+  const chevronNode = showArrow ? /* @__PURE__ */ jsxRuntime.jsx(
+    "svg",
+    {
+      className: tigercatCore.getDropdownChevronClasses(visible),
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      "aria-hidden": "true",
+      children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: tigercatCore.DROPDOWN_CHEVRON_PATH })
+    }
+  ) : null;
   return /* @__PURE__ */ jsxRuntime.jsx(DropdownContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsxRuntime.jsxs(
     "div",
     {
       ref: containerRef,
       className: containerClasses,
       style,
-      onKeyDown: handleContainerKeyDown,
       ...divProps,
       children: [
-        /* @__PURE__ */ jsxRuntime.jsx(
+        /* @__PURE__ */ jsxRuntime.jsxs(
           "div",
           {
             ref: triggerRef,
@@ -150,7 +162,10 @@ var Dropdown = ({
             onMouseLeave: handleMouseLeave,
             "aria-haspopup": "menu",
             "aria-expanded": visible,
-            children: triggerElement
+            children: [
+              triggerElement,
+              chevronNode
+            ]
           }
         ),
         /* @__PURE__ */ jsxRuntime.jsx(

package/dist/{chunk-5HUYCSA4.mjs → chunk-HPXLUJFJ.mjs}

@@ -1,4 +1,4 @@
-import React, { useState, useRef } from 'react';
+import React, { useState, useRef, useCallback, useMemo } from 'react';
 import { getRadioGroupClasses } from '@expcat/tigercat-core';
 import { jsx } from 'react/jsx-runtime';
 
@@ -22,13 +22,16 @@ var RadioGroup = ({
     `tiger-radio-group-${Date.now()}-${Math.random().toString(36).slice(2, 11)}`
   );
   const groupName = name || generatedNameRef.current;
-  const handleChange = (newValue) => {
-    if (disabled) return;
-    if (!isControlled) {
-      setInternalValue(newValue);
-    }
-    onChange?.(newValue);
-  };
+  const handleChange = useCallback(
+    (newValue) => {
+      if (disabled) return;
+      if (!isControlled) {
+        setInternalValue(newValue);
+      }
+      onChange?.(newValue);
+    },
+    [disabled, isControlled, onChange]
+  );
   const handleKeyDown = (event) => {
     if (disabled) return;
     if (event.key !== "ArrowDown" && event.key !== "ArrowRight" && event.key !== "ArrowUp" && event.key !== "ArrowLeft") {
@@ -52,20 +55,20 @@ var RadioGroup = ({
     nextInput.focus();
     nextInput.click();
   };
-  const contextValue = {
-    value: currentValue,
-    name: groupName,
-    disabled,
-    size,
-    onChange: handleChange
-  };
+  const contextValue = useMemo(
+    () => ({
+      value: currentValue,
+      name: groupName,
+      disabled,
+      size,
+      onChange: handleChange
+    }),
+    [currentValue, groupName, disabled, size, handleChange]
+  );
   return /* @__PURE__ */ jsx(RadioGroupContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx(
     "div",
     {
-      className: getRadioGroupClasses({
-        className,
-        hasCustomClass: !!className
-      }),
+      className: getRadioGroupClasses({ className }),
       role: "radiogroup",
       onKeyDown: handleKeyDown,
       ...props,

package/dist/chunk-HQ3QOT7H.js

@@ -0,0 +1,33 @@
+'use strict';
+
+var tigercatCore = require('@expcat/tigercat-core');
+var jsxRuntime = require('react/jsx-runtime');
+
+// src/components/shared/icons.tsx
+var StatusIcon = ({ path, className, ...svgProps }) => /* @__PURE__ */ jsxRuntime.jsx(
+  "svg",
+  {
+    className,
+    xmlns: "http://www.w3.org/2000/svg",
+    fill: "none",
+    viewBox: tigercatCore.icon24ViewBox,
+    stroke: "currentColor",
+    strokeWidth: tigercatCore.icon24StrokeWidth,
+    ...svgProps,
+    children: /* @__PURE__ */ jsxRuntime.jsx(
+      "path",
+      {
+        strokeLinecap: tigercatCore.icon24PathStrokeLinecap,
+        strokeLinejoin: tigercatCore.icon24PathStrokeLinejoin,
+        d: path
+      }
+    )
+  }
+);
+var StatusIconWithLoading = ({ path, className, isLoading = false, spinnerClass = "" }) => {
+  const merged = tigercatCore.classNames(className, isLoading && spinnerClass);
+  return /* @__PURE__ */ jsxRuntime.jsx(StatusIcon, { path, className: merged });
+};
+
+exports.StatusIcon = StatusIcon;
+exports.StatusIconWithLoading = StatusIconWithLoading;

package/dist/chunk-I5TCE5E7.js

@@ -0,0 +1,32 @@
+'use strict';
+
+var React = require('react');
+var tigercatCore = require('@expcat/tigercat-core');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefault(React);
+
+// src/components/Text.tsx
+var Text = ({
+  tag = "p",
+  size,
+  weight,
+  align,
+  color,
+  truncate,
+  italic,
+  underline,
+  lineThrough,
+  children,
+  className,
+  ...props
+}) => {
+  const textClasses = tigercatCore.classNames(
+    tigercatCore.getTextClasses({ size, weight, align, color, truncate, italic, underline, lineThrough }),
+    className
+  );
+  return React__default.default.createElement(tag, { ...props, className: textClasses }, children);
+};
+
+exports.Text = Text;

package/dist/{chunk-QFVE7GKD.js → chunk-IBYIPXIO.js}

@@ -32,27 +32,18 @@ var Menu = ({
   const openKeys = controlledOpenKeys !== void 0 ? controlledOpenKeys : internalOpenKeys;
   const handleSelect = react.useCallback(
     (key) => {
-      const newSelectedKeys = [key];
+      const newSelectedKeys = tigercatCore.replaceKeys(key, selectedKeys);
       if (controlledSelectedKeys === void 0) {
         setInternalSelectedKeys(newSelectedKeys);
       }
       onSelect?.(key, { selectedKeys: newSelectedKeys });
     },
-    [controlledSelectedKeys, onSelect]
+    [controlledSelectedKeys, selectedKeys, onSelect]
   );
   const handleOpenChange = react.useCallback(
     (key) => {
-      const isOpen = openKeys.includes(key);
-      let newOpenKeys;
-      if (isOpen) {
-        newOpenKeys = openKeys.filter((k) => k !== key);
-      } else {
-        if (multiple) {
-          newOpenKeys = [...openKeys, key];
-        } else {
-          newOpenKeys = [key];
-        }
-      }
+      const toggled = tigercatCore.toggleKey(key, openKeys);
+      const newOpenKeys = multiple ? toggled : toggled.includes(key) ? [key] : [];
       if (controlledOpenKeys === void 0) {
         setInternalOpenKeys(newOpenKeys);
       }
@@ -77,19 +68,7 @@ var Menu = ({
     [mode, theme, collapsed, inlineIndent, selectedKeys, openKeys, handleSelect, handleOpenChange]
   );
   react.useEffect(() => {
-    const root = menuRef.current;
-    if (!root) return;
-    const items = Array.from(
-      root.querySelectorAll('button[data-tiger-menuitem="true"]')
-    ).filter((el) => !el.disabled && !el.closest('[data-tiger-menu-hidden="true"]'));
-    if (items.length === 0) return;
-    const hasActive = items.some((el) => el.tabIndex === 0);
-    if (hasActive) return;
-    const selected = items.find((el) => el.dataset.tigerSelected === "true");
-    const active = selected ?? items[0];
-    items.forEach((el) => {
-      el.tabIndex = el === active ? 0 : -1;
-    });
+    if (menuRef.current) tigercatCore.initRovingTabIndex(menuRef.current);
   }, [mode, collapsed, selectedKeys, openKeys]);
   return /* @__PURE__ */ jsxRuntime.jsx(MenuContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsxRuntime.jsx(
     "ul",