@expcat/tigercat-react 0.3.0 → 0.3.69

package/dist/chunk-56KTCMRE.mjs

@@ -0,0 +1,77 @@
+import { usePopup } from './chunk-3PV2MDST.mjs';
+import { useRef, useMemo } from 'react';
+import { createFloatingIdFactory, classNames, getPopoverContainerClasses, getPopoverTriggerClasses, getPopoverContentClasses, POPOVER_TITLE_CLASSES, POPOVER_TEXT_CLASSES } from '@expcat/tigercat-core';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var createPopoverId = createFloatingIdFactory("popover");
+var Popover = ({
+  visible,
+  defaultVisible = false,
+  title,
+  content,
+  trigger = "click",
+  placement = "top",
+  disabled = false,
+  width,
+  offset = 8,
+  className,
+  style,
+  children,
+  titleContent,
+  contentContent,
+  onVisibleChange,
+  ...divProps
+}) => {
+  const popoverIdRef = useRef(null);
+  if (!popoverIdRef.current) popoverIdRef.current = createPopoverId();
+  const popoverId = popoverIdRef.current;
+  const titleId = `${popoverId}-title`;
+  const contentId = `${popoverId}-content`;
+  const {
+    currentVisible,
+    containerRef,
+    triggerRef,
+    floatingRef,
+    floatingStyles,
+    triggerHandlers
+  } = usePopup({ visible, defaultVisible, disabled, trigger, placement, offset, onVisibleChange });
+  const containerClasses = useMemo(
+    () => classNames(getPopoverContainerClasses(), className),
+    [className]
+  );
+  const triggerClasses = useMemo(() => getPopoverTriggerClasses(disabled), [disabled]);
+  const contentClasses = useMemo(() => getPopoverContentClasses(width), [width]);
+  if (!children) return null;
+  const hasTitle = Boolean(title || titleContent);
+  const hasContent = Boolean(content || contentContent);
+  return /* @__PURE__ */ jsxs("div", { ref: containerRef, className: containerClasses, style, ...divProps, children: [
+    /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref: triggerRef,
+        className: triggerClasses,
+        "aria-haspopup": "dialog",
+        "aria-disabled": disabled ? "true" : void 0,
+        ...triggerHandlers,
+        children
+      }
+    ),
+    currentVisible && /* @__PURE__ */ jsx("div", { ref: floatingRef, style: floatingStyles, "aria-hidden": false, children: /* @__PURE__ */ jsxs(
+      "div",
+      {
+        id: popoverId,
+        role: "dialog",
+        "aria-modal": "false",
+        "aria-labelledby": hasTitle ? titleId : void 0,
+        "aria-describedby": hasContent ? contentId : void 0,
+        className: contentClasses,
+        children: [
+          hasTitle && /* @__PURE__ */ jsx("div", { id: titleId, className: POPOVER_TITLE_CLASSES, children: titleContent || title }),
+          hasContent && /* @__PURE__ */ jsx("div", { id: contentId, className: POPOVER_TEXT_CLASSES, children: contentContent || content })
+        ]
+      }
+    ) })
+  ] });
+};
+
+export { Popover };

package/dist/chunk-5P5M656V.mjs

@@ -0,0 +1,75 @@
+import { getSkeletonClasses, getSkeletonDimensions, getParagraphRowWidth, classNames } from '@expcat/tigercat-core';
+import { jsx } from 'react/jsx-runtime';
+
+// src/components/Skeleton.tsx
+var Skeleton = ({
+  variant = "text",
+  animation = "pulse",
+  width,
+  height,
+  shape = "circle",
+  rows = 1,
+  paragraph = false,
+  className,
+  style,
+  "aria-label": ariaLabel,
+  "aria-labelledby": ariaLabelledBy,
+  "aria-hidden": ariaHidden,
+  ...divProps
+}) => {
+  const visualClasses = getSkeletonClasses(variant, animation, shape);
+  const dimensions = getSkeletonDimensions(variant, width, height);
+  const computedAriaHidden = ariaHidden ?? (ariaLabel || ariaLabelledBy ? void 0 : true);
+  if (variant === "text" && rows > 1) {
+    const rowElements = [];
+    for (let i = 0; i < rows; i++) {
+      const rowStyle = {
+        height: dimensions.height
+      };
+      if (paragraph) {
+        rowStyle.width = getParagraphRowWidth(i, rows);
+      } else if (dimensions.width) {
+        rowStyle.width = dimensions.width;
+      }
+      rowElements.push(
+        /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: classNames(visualClasses, i < rows - 1 && "mb-2"),
+            style: rowStyle
+          },
+          i
+        )
+      );
+    }
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        ...divProps,
+        className: classNames("flex flex-col", className),
+        style,
+        "aria-label": ariaLabel,
+        "aria-labelledby": ariaLabelledBy,
+        "aria-hidden": computedAriaHidden,
+        children: rowElements
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      ...divProps,
+      className: classNames(visualClasses, className),
+      style: {
+        ...style,
+        ...dimensions.width ? { width: dimensions.width } : void 0,
+        height: dimensions.height
+      },
+      "aria-label": ariaLabel,
+      "aria-labelledby": ariaLabelledBy,
+      "aria-hidden": computedAriaHidden
+    }
+  );
+};
+
+export { Skeleton };

package/dist/{chunk-Z6G4HABF.js → chunk-67FVBKBC.js}

@@ -30,7 +30,12 @@ var Carousel = React.forwardRef(
   }, ref) => {
     const [currentIndex, setCurrentIndex] = React.useState(initialSlide);
     const [isPaused, setIsPaused] = React.useState(false);
-    const autoplayTimerRef = React.useRef(null);
+    const onChangeRef = React.useRef(onChange);
+    const onBeforeChangeRef = React.useRef(onBeforeChange);
+    onChangeRef.current = onChange;
+    onBeforeChangeRef.current = onBeforeChange;
+    const currentIndexRef = React.useRef(currentIndex);
+    currentIndexRef.current = currentIndex;
     const slides = React.useMemo(() => {
       return React__default.default.Children.toArray(children).filter((child) => React__default.default.isValidElement(child));
     }, [children]);
@@ -40,10 +45,7 @@ var Carousel = React.forwardRef(
       [className]
     );
     const trackClasses = React.useMemo(() => {
-      if (effect === "fade") {
-        return tigercatCore.carouselTrackFadeClasses;
-      }
-      return tigercatCore.carouselTrackScrollClasses;
+      return effect === "fade" ? tigercatCore.carouselTrackFadeClasses : tigercatCore.carouselTrackScrollClasses;
     }, [effect]);
     const trackStyle = React.useMemo(() => {
       if (effect === "scroll") {
@@ -54,26 +56,19 @@ var Carousel = React.forwardRef(
       }
       return {};
     }, [effect, currentIndex, speed]);
-    const getSlideClasses = React.useCallback(
-      (index) => {
-        const isActive = index === currentIndex;
-        if (effect === "fade") {
-          const positionClass = index === 0 ? "relative" : "absolute inset-0";
-          return tigercatCore.classNames(
-            positionClass,
-            "w-full transition-opacity ease-in-out",
-            isActive ? "opacity-100 z-10" : "opacity-0 z-0"
-          );
-        }
-        return tigercatCore.carouselSlideBaseClasses;
-      },
-      [effect, currentIndex]
-    );
-    const getSlideStyle = React.useCallback(() => {
-      return {
-        transitionDuration: `${speed}ms`
-      };
-    }, [speed]);
+    const slideStyle = React.useMemo(() => ({ transitionDuration: `${speed}ms` }), [speed]);
+    const getSlideClasses = (index) => {
+      const isActive = index === currentIndex;
+      if (effect === "fade") {
+        const positionClass = index === 0 ? "relative" : "absolute inset-0";
+        return tigercatCore.classNames(
+          positionClass,
+          "w-full transition-opacity ease-in-out",
+          isActive ? "opacity-100 z-10" : "opacity-0 z-0"
+        );
+      }
+      return tigercatCore.carouselSlideBaseClasses;
+    };
     const dotsClasses = React.useMemo(() => {
       return tigercatCore.getCarouselDotsClasses(dotPosition);
     }, [dotPosition]);
@@ -110,28 +105,18 @@ var Carousel = React.forwardRef(
       [next, prev, goTo]
     );
     React.useEffect(() => {
-      if (autoplay && !isPaused) {
-        if (autoplayTimerRef.current) {
-          clearInterval(autoplayTimerRef.current);
-        }
-        autoplayTimerRef.current = setInterval(() => {
-          setCurrentIndex((prevIndex) => {
-            const nextIdx = tigercatCore.getNextSlideIndex(prevIndex, slideCount, infinite);
-            if (nextIdx !== prevIndex) {
-              onBeforeChange?.(prevIndex, nextIdx);
-              onChange?.(nextIdx, prevIndex);
-            }
-            return nextIdx;
-          });
-        }, autoplaySpeed);
-      }
-      return () => {
-        if (autoplayTimerRef.current) {
-          clearInterval(autoplayTimerRef.current);
-          autoplayTimerRef.current = null;
+      if (!autoplay || isPaused) return;
+      const timer = setInterval(() => {
+        const curr = currentIndexRef.current;
+        const nextIdx = tigercatCore.getNextSlideIndex(curr, slideCount, infinite);
+        if (nextIdx !== curr) {
+          onBeforeChangeRef.current?.(curr, nextIdx);
+          setCurrentIndex(nextIdx);
+          onChangeRef.current?.(nextIdx, curr);
         }
-      };
-    }, [autoplay, autoplaySpeed, isPaused, slideCount, infinite, onChange, onBeforeChange]);
+      }, autoplaySpeed);
+      return () => clearInterval(timer);
+    }, [autoplay, autoplaySpeed, isPaused, slideCount, infinite]);
     const handleMouseEnter = React.useCallback(() => {
       if (pauseOnHover && autoplay) {
         setIsPaused(true);
@@ -160,57 +145,35 @@ var Carousel = React.forwardRef(
       () => tigercatCore.isNextDisabled(currentIndex, slideCount, infinite),
       [currentIndex, slideCount, infinite]
     );
-    const renderArrows = () => {
-      if (!arrows) return null;
-      return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-        /* @__PURE__ */ jsxRuntime.jsx(
-          "button",
-          {
-            type: "button",
-            className: tigercatCore.getCarouselArrowClasses("prev", isPrevArrowDisabled),
-            onClick: prev,
-            disabled: isPrevArrowDisabled,
-            "aria-label": "Previous slide",
-            children: /* @__PURE__ */ jsxRuntime.jsx(
-              "svg",
-              {
-                xmlns: "http://www.w3.org/2000/svg",
-                viewBox: "0 0 24 24",
-                fill: "none",
-                stroke: "currentColor",
-                strokeWidth: "2",
-                strokeLinecap: "round",
-                strokeLinejoin: "round",
-                className: "w-6 h-6",
-                children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: tigercatCore.carouselPrevArrowPath })
-              }
-            )
-          }
-        ),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          "button",
+    const renderArrowButton = (type, disabled, onClick, path) => /* @__PURE__ */ jsxRuntime.jsx(
+      "button",
+      {
+        type: "button",
+        className: tigercatCore.getCarouselArrowClasses(type, disabled),
+        onClick,
+        disabled,
+        "aria-label": type === "prev" ? "Previous slide" : "Next slide",
+        children: /* @__PURE__ */ jsxRuntime.jsx(
+          "svg",
           {
-            type: "button",
-            className: tigercatCore.getCarouselArrowClasses("next", isNextArrowDisabled),
-            onClick: next,
-            disabled: isNextArrowDisabled,
-            "aria-label": "Next slide",
-            children: /* @__PURE__ */ jsxRuntime.jsx(
-              "svg",
-              {
-                xmlns: "http://www.w3.org/2000/svg",
-                viewBox: "0 0 24 24",
-                fill: "none",
-                stroke: "currentColor",
-                strokeWidth: "2",
-                strokeLinecap: "round",
-                strokeLinejoin: "round",
-                className: "w-6 h-6",
-                children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: tigercatCore.carouselNextArrowPath })
-              }
-            )
+            xmlns: "http://www.w3.org/2000/svg",
+            viewBox: "0 0 24 24",
+            fill: "none",
+            stroke: "currentColor",
+            strokeWidth: "2",
+            strokeLinecap: "round",
+            strokeLinejoin: "round",
+            className: "w-6 h-6",
+            children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: path })
           }
         )
+      }
+    );
+    const renderArrows = () => {
+      if (!arrows) return null;
+      return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+        renderArrowButton("prev", isPrevArrowDisabled, prev, tigercatCore.carouselPrevArrowPath),
+        renderArrowButton("next", isNextArrowDisabled, next, tigercatCore.carouselNextArrowPath)
       ] });
     };
     const renderDots = () => {
@@ -232,7 +195,7 @@ var Carousel = React.forwardRef(
         "div",
         {
           className: getSlideClasses(index),
-          style: effect === "fade" ? getSlideStyle() : void 0,
+          style: effect === "fade" ? slideStyle : void 0,
           role: "group",
           "aria-roledescription": "slide",
           "aria-label": `Slide ${index + 1} of ${slideCount}`,

package/dist/{chunk-KAEHFMTQ.mjs → chunk-6IH5QPTR.mjs}

@@ -1,6 +1,6 @@
 import { useRef, useMemo, useState, useEffect, useCallback } from 'react';
-import { getSpinnerSVG, getAllKeys, calculateCheckedState, getVisibleTreeItems, filterTreeNodes, getAutoExpandKeys, findNode, handleNodeCheck, getCheckedKeysByStrategy, getParentKeys, treeNodeCheckboxClasses, treeNodeIconClasses, classNames, treeNodeLabelClasses, treeNodeWrapperClasses, getTreeNodeClasses, treeNodeChildrenClasses, treeLineClasses, treeEmptyStateClasses, treeBaseClasses, treeNodeIndentClasses, getTreeNodeExpandIconClasses, treeLoadingClasses } from '@expcat/tigercat-core';
-import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
+import { getSpinnerSVG, getAllKeys, calculateCheckedState, getVisibleTreeItems, checkedSetsFromState, filterTreeNodes, getAutoExpandKeys, findNode, handleNodeCheck, getCheckedKeysByStrategy, getParentKeys, classNames, treeEmptyStateClasses, treeBaseClasses, treeNodeCheckboxClasses, treeNodeIconClasses, treeNodeLabelClasses, treeNodeWrapperClasses, getTreeNodeClasses, treeNodeChildrenClasses, treeLineClasses, treeNodeIndentClasses, getTreeNodeExpandIconClasses, treeLoadingClasses } from '@expcat/tigercat-core';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 
 // src/components/Tree.tsx
 var spinnerSvg = getSpinnerSVG("spinner");
@@ -143,6 +143,10 @@ var Tree = ({
     }
     return internalCheckedState;
   }, [controlledCheckedKeys, internalCheckedState, treeData, checkStrictly]);
+  const checkedSets = useMemo(
+    () => checkedSetsFromState(computedCheckedState),
+    [computedCheckedState]
+  );
   useEffect(() => {
     if (filterValue) {
       const matched = filterTreeNodes(treeData, filterValue, filterFn);
@@ -267,6 +271,20 @@ var Tree = ({
     },
     [treeData, computedCheckedState, checkStrictly, checkStrategy, controlledCheckedKeys, onCheck]
   );
+  const getFirstChildKey = useCallback(
+    (nodeKey) => {
+      const index = visibleItems.findIndex((i) => i.key === nodeKey);
+      if (index < 0) return void 0;
+      const base = visibleItems[index];
+      for (let i = index + 1; i < visibleItems.length; i++) {
+        const item = visibleItems[i];
+        if (item.level <= base.level) break;
+        if (item.parentKey === nodeKey && !item.node.disabled) return item.key;
+      }
+      return void 0;
+    },
+    [visibleItems]
+  );
   const handleKeyDown = useCallback(
     (e, node, isExpanded, isChecked) => {
       if (node.disabled) return;
@@ -275,18 +293,6 @@ var Tree = ({
       const isExpandable = !!(node.children && node.children.length > 0) || !!(loadData && !node.isLeaf);
       const parents = getParentKeys(treeData, node.key);
       const parentKey = parents[parents.length - 1];
-      const getFirstChildKey = () => {
-        const list = visibleItems;
-        const index = list.findIndex((i) => i.key === node.key);
-        if (index < 0) return void 0;
-        const base = list[index];
-        for (let i = index + 1; i < list.length; i++) {
-          const item = list[i];
-          if (item.level <= base.level) break;
-          if (item.parentKey === node.key && !item.node.disabled) return item.key;
-        }
-        return void 0;
-      };
       if (e.key === "ArrowDown") {
         e.preventDefault();
         setActiveKey(focusableKeys[currentIndex + 1] ?? currentKey);
@@ -314,7 +320,7 @@ var Tree = ({
           return;
         }
         if (isExpandable && isExpanded) {
-          setActiveKey(getFirstChildKey() ?? currentKey);
+          setActiveKey(getFirstChildKey(node.key) ?? currentKey);
         }
         return;
       }
@@ -369,147 +375,118 @@ var Tree = ({
       activeKey,
       defaultActiveKey,
       focusableKeys,
-      visibleItems,
       treeData,
       loadData,
       checkable,
       computedExpandedKeys,
       effectiveSelectable,
+      getFirstChildKey,
       handleExpand,
       handleSelect,
       handleCheck
     ]
   );
-  const handleNodeClickInternal = useCallback(
-    (node, event) => {
-      if (node.disabled) return;
-      onNodeClick?.(node, event);
-    },
-    [onNodeClick]
-  );
-  const renderTreeNode = useCallback(
-    (node, level, _parentKey) => {
-      const hasChildren = !!(node.children && node.children.length > 0);
-      const isExpanded = computedExpandedKeys.has(node.key);
-      const isSelected = computedSelectedKeys.has(node.key);
-      const isChecked = computedCheckedState.checked.includes(node.key);
-      const isHalfChecked = computedCheckedState.halfChecked.includes(node.key);
-      const isLoading = loadingNodes.has(node.key);
-      const isFiltered = filteredNodeKeys.size > 0;
-      const isMatched = filteredNodeKeys.has(node.key);
-      const isVisible = !isFiltered || isMatched;
-      const isExpandable = hasChildren || !!(loadData && !node.isLeaf);
-      const isFocusable = !node.disabled && node.key === (activeKey ?? defaultActiveKey);
-      if (!isVisible) {
-        return null;
-      }
-      const indent = [];
-      for (let i = 0; i < level; i++) {
-        indent.push(/* @__PURE__ */ jsx("span", { className: treeNodeIndentClasses }, i));
-      }
-      const nodeContent = /* @__PURE__ */ jsxs(Fragment, { children: [
-        indent,
-        /* @__PURE__ */ jsx(
-          "span",
-          {
-            className: isExpandable ? "cursor-pointer" : "",
-            onClick: (e) => {
-              e.stopPropagation();
-              if (isExpandable) {
-                setActiveKey(node.key);
-                handleExpand(node.key);
-              }
-            },
-            children: /* @__PURE__ */ jsx(ExpandIcon, { expanded: isExpanded, hasChildren: isExpandable })
-          }
-        ),
-        checkable && /* @__PURE__ */ jsx(
-          "input",
-          {
-            type: "checkbox",
-            "aria-label": `Select ${node.label}`,
-            className: treeNodeCheckboxClasses,
-            checked: isChecked,
-            ref: (input) => {
-              if (input) {
-                input.indeterminate = isHalfChecked;
-              }
-            },
-            disabled: node.disabled,
-            onClick: (e) => {
-              e.stopPropagation();
-            },
-            onChange: (e) => {
-              handleCheck(node.key, e.target.checked);
-            }
-          }
-        ),
-        showIcon && node.icon && /* @__PURE__ */ jsx("span", { className: treeNodeIconClasses, children: node.icon }),
-        /* @__PURE__ */ jsx(
-          "span",
-          {
-            className: classNames(
-              treeNodeLabelClasses,
-              isFiltered && isMatched ? "font-semibold text-[var(--tiger-primary,#2563eb)]" : ""
-            ),
-            children: node.label
-          }
-        ),
-        isLoading && /* @__PURE__ */ jsx(LoadingSpinner, {})
-      ] });
-      return /* @__PURE__ */ jsxs("div", { className: treeNodeWrapperClasses, children: [
-        /* @__PURE__ */ jsx(
-          "div",
-          {
-            className: getTreeNodeClasses(isSelected, !!node.disabled, blockNode),
-            ref: (el) => {
-              itemRefs.current.set(node.key, el);
-            },
-            role: "treeitem",
-            "aria-level": level + 1,
-            "aria-disabled": node.disabled || void 0,
-            "aria-selected": effectiveSelectable ? isSelected : void 0,
-            "aria-expanded": isExpandable ? isExpanded : void 0,
-            "aria-checked": checkable ? isHalfChecked ? "mixed" : isChecked : void 0,
-            tabIndex: isFocusable ? 0 : -1,
-            onFocus: () => {
-              if (!node.disabled) setActiveKey(node.key);
-            },
-            onKeyDown: (e) => handleKeyDown(e, node, isExpanded, isChecked),
-            onClick: (e) => {
+  const renderTreeNode = (node, level) => {
+    const hasChildren = !!(node.children && node.children.length > 0);
+    const isExpanded = computedExpandedKeys.has(node.key);
+    const isSelected = computedSelectedKeys.has(node.key);
+    const isChecked = checkedSets.checkedSet.has(node.key);
+    const isHalfChecked = checkedSets.halfCheckedSet.has(node.key);
+    const isLoading = loadingNodes.has(node.key);
+    const isFiltered = filteredNodeKeys.size > 0;
+    const isMatched = filteredNodeKeys.has(node.key);
+    const isVisible = !isFiltered || isMatched;
+    const isExpandable = hasChildren || !!(loadData && !node.isLeaf);
+    const isFocusable = !node.disabled && node.key === (activeKey ?? defaultActiveKey);
+    if (!isVisible) {
+      return null;
+    }
+    const indent = [];
+    for (let i = 0; i < level; i++) {
+      indent.push(/* @__PURE__ */ jsx("span", { className: treeNodeIndentClasses }, i));
+    }
+    const nodeContent = /* @__PURE__ */ jsxs(Fragment, { children: [
+      indent,
+      /* @__PURE__ */ jsx(
+        "span",
+        {
+          className: isExpandable ? "cursor-pointer" : "",
+          onClick: (e) => {
+            e.stopPropagation();
+            if (isExpandable) {
               setActiveKey(node.key);
-              handleNodeClickInternal(node, e);
-              if (effectiveSelectable && !node.disabled) {
-                handleSelect(node.key, e);
-              }
-            },
-            children: nodeContent
+              handleExpand(node.key);
+            }
+          },
+          children: /* @__PURE__ */ jsx(ExpandIcon, { expanded: isExpanded, hasChildren: isExpandable })
+        }
+      ),
+      checkable && /* @__PURE__ */ jsx(
+        "input",
+        {
+          type: "checkbox",
+          "aria-label": `Select ${node.label}`,
+          className: treeNodeCheckboxClasses,
+          checked: isChecked,
+          ref: (input) => {
+            if (input) {
+              input.indeterminate = isHalfChecked;
+            }
+          },
+          disabled: node.disabled,
+          onClick: (e) => {
+            e.stopPropagation();
+          },
+          onChange: (e) => {
+            handleCheck(node.key, e.target.checked);
           }
-        ),
-        hasChildren && isExpanded && /* @__PURE__ */ jsx("div", { className: classNames(treeNodeChildrenClasses, showLine && treeLineClasses), children: node.children.map((child) => renderTreeNode(child, level + 1, node.key)) })
-      ] }, node.key);
-    },
-    [
-      computedExpandedKeys,
-      computedSelectedKeys,
-      computedCheckedState,
-      loadingNodes,
-      filteredNodeKeys,
-      activeKey,
-      defaultActiveKey,
-      loadData,
-      checkable,
-      blockNode,
-      effectiveSelectable,
-      showIcon,
-      showLine,
-      handleExpand,
-      handleCheck,
-      handleSelect,
-      handleNodeClickInternal,
-      handleKeyDown
-    ]
-  );
+        }
+      ),
+      showIcon && node.icon && /* @__PURE__ */ jsx("span", { className: treeNodeIconClasses, children: node.icon }),
+      /* @__PURE__ */ jsx(
+        "span",
+        {
+          className: classNames(
+            treeNodeLabelClasses,
+            isFiltered && isMatched ? "font-semibold text-[var(--tiger-primary,#2563eb)]" : ""
+          ),
+          children: node.label
+        }
+      ),
+      isLoading && /* @__PURE__ */ jsx(LoadingSpinner, {})
+    ] });
+    return /* @__PURE__ */ jsxs("div", { className: treeNodeWrapperClasses, children: [
+      /* @__PURE__ */ jsx(
+        "div",
+        {
+          className: getTreeNodeClasses(isSelected, !!node.disabled, blockNode),
+          ref: (el) => {
+            itemRefs.current.set(node.key, el);
+          },
+          role: "treeitem",
+          "aria-level": level + 1,
+          "aria-disabled": node.disabled || void 0,
+          "aria-selected": effectiveSelectable ? isSelected : void 0,
+          "aria-expanded": isExpandable ? isExpanded : void 0,
+          "aria-checked": checkable ? isHalfChecked ? "mixed" : isChecked : void 0,
+          tabIndex: isFocusable ? 0 : -1,
+          onFocus: () => {
+            if (!node.disabled) setActiveKey(node.key);
+          },
+          onKeyDown: (e) => handleKeyDown(e, node, isExpanded, isChecked),
+          onClick: (e) => {
+            setActiveKey(node.key);
+            if (!node.disabled) onNodeClick?.(node, e);
+            if (effectiveSelectable && !node.disabled) {
+              handleSelect(node.key, e);
+            }
+          },
+          children: nodeContent
+        }
+      ),
+      hasChildren && isExpanded && /* @__PURE__ */ jsx("div", { className: classNames(treeNodeChildrenClasses, showLine && treeLineClasses), children: node.children.map((child) => renderTreeNode(child, level + 1)) })
+    ] }, node.key);
+  };
   if (!treeData || treeData.length === 0) {
     return /* @__PURE__ */ jsx(
       "div",