@expcat/tigercat-react 2.0.19 → 2.1.1

package/dist/chunk-3HHEVMHE.mjs

@@ -0,0 +1,180 @@
+import {
+  Dropdown,
+  DropdownItem,
+  DropdownMenu
+} from "./chunk-RE5ZLA5D.mjs";
+import {
+  Button
+} from "./chunk-5TE7KLE5.mjs";
+import {
+  ButtonGroup
+} from "./chunk-ZJWUBR2X.mjs";
+
+// src/components/SplitButton.tsx
+import React, { useMemo } from "react";
+import {
+  DROPDOWN_CHEVRON_PATH,
+  getDropdownChevronClasses,
+  getSplitButtonPrimaryClasses,
+  getSplitButtonRootClasses,
+  getSplitButtonTriggerClasses,
+  resolveSplitButtonSize,
+  resolveSplitButtonTriggerAriaLabel,
+  resolveSplitButtonVariant
+} from "@expcat/tigercat-core";
+import { jsx, jsxs } from "react/jsx-runtime";
+function wrapMenu(nodes) {
+  if (nodes == null || typeof nodes === "boolean") return null;
+  if (React.isValidElement(nodes) && nodes.type === DropdownMenu) return nodes;
+  const array = React.Children.toArray(nodes);
+  if (array.length === 0) return null;
+  const existing = array.find((child) => React.isValidElement(child) && child.type === DropdownMenu);
+  if (existing) return existing;
+  return /* @__PURE__ */ jsx(DropdownMenu, { children: nodes });
+}
+function partitionChildren(children) {
+  const primary = [];
+  const menuItems = [];
+  let menu = null;
+  React.Children.forEach(children, (child) => {
+    if (!React.isValidElement(child)) {
+      if (child != null && typeof child !== "boolean") primary.push(child);
+      return;
+    }
+    if (child.type === DropdownMenu) {
+      menu = child;
+      return;
+    }
+    if (child.type === DropdownItem) {
+      menuItems.push(child);
+      return;
+    }
+    primary.push(child);
+  });
+  if (!menu && menuItems.length > 0) {
+    menu = /* @__PURE__ */ jsx(DropdownMenu, { children: menuItems });
+  }
+  return { primary, menu };
+}
+function Chevron({ open }) {
+  return /* @__PURE__ */ jsx(
+    "svg",
+    {
+      className: getDropdownChevronClasses(open),
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      "aria-hidden": "true",
+      focusable: "false",
+      children: /* @__PURE__ */ jsx("path", { d: DROPDOWN_CHEVRON_PATH })
+    }
+  );
+}
+var SplitButton = ({
+  variant = "primary",
+  size = "md",
+  disabled = false,
+  loading = false,
+  danger = false,
+  block = false,
+  htmlType = "button",
+  iconPosition = "left",
+  icon,
+  loadingIcon,
+  trigger,
+  triggerAriaLabel,
+  open,
+  defaultOpen = false,
+  closeOnClick = true,
+  portal = true,
+  placement = "bottom-end",
+  offset = 4,
+  menu,
+  onClick,
+  onOpenChange,
+  className,
+  style,
+  children,
+  ...rest
+}) => {
+  const resolvedVariant = resolveSplitButtonVariant(variant);
+  const resolvedSize = resolveSplitButtonSize(size);
+  const isDisabled = disabled || loading;
+  const triggerLabel = resolveSplitButtonTriggerAriaLabel(triggerAriaLabel);
+  const partitioned = useMemo(() => partitionChildren(children), [children]);
+  const menuNode = menu != null ? wrapMenu(menu) : partitioned.menu;
+  const rootClasses = getSplitButtonRootClasses({ block, className });
+  const primaryClasses = getSplitButtonPrimaryClasses({ block });
+  const triggerClasses = getSplitButtonTriggerClasses({ size: resolvedSize });
+  return /* @__PURE__ */ jsxs(
+    ButtonGroup,
+    {
+      size: resolvedSize,
+      className: rootClasses,
+      style,
+      "data-split-button": "",
+      ...rest,
+      children: [
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            variant: resolvedVariant,
+            size: resolvedSize,
+            disabled,
+            loading,
+            danger,
+            htmlType,
+            iconPosition,
+            icon,
+            loadingIcon,
+            className: primaryClasses,
+            "data-split-button-primary": "",
+            onClick,
+            children: partitioned.primary
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Dropdown,
+          {
+            trigger: "click",
+            showArrow: false,
+            disabled: isDisabled,
+            open,
+            defaultOpen,
+            closeOnClick,
+            portal,
+            placement,
+            offset,
+            onOpenChange,
+            renderTrigger: ({ open: menuOpen }) => /* @__PURE__ */ jsx(
+              Button,
+              {
+                variant: resolvedVariant,
+                size: resolvedSize,
+                disabled: isDisabled,
+                danger,
+                htmlType: "button",
+                className: triggerClasses,
+                "aria-label": triggerLabel,
+                "aria-haspopup": "menu",
+                "aria-expanded": menuOpen,
+                "data-split-button-trigger": "",
+                children: trigger ?? /* @__PURE__ */ jsx(Chevron, { open: menuOpen })
+              }
+            ),
+            children: menuNode
+          }
+        )
+      ]
+    }
+  );
+};
+var SplitButton_default = SplitButton;
+
+export {
+  SplitButton,
+  SplitButton_default
+};

package/dist/{chunk-HSBN5MLS.mjs → chunk-3LACOSJQ.mjs}

@@ -1,6 +1,6 @@
 import {
   ImagePreview
-} from "./chunk-ZCGIZOMT.mjs";
+} from "./chunk-V7HJ5HLC.mjs";
 
 // src/components/ImageGroup.tsx
 import { useState, useCallback, useMemo, createContext, useRef } from "react";

package/dist/{chunk-F6WV53BS.mjs → chunk-3LDDXHW2.mjs}

@@ -12,7 +12,7 @@ import {
 import { useState, useEffect, useRef, useCallback, useId } from "react";
 import {
   classNames,
-  getInputClasses,
+  getInputFieldClasses,
   getInputWrapperClasses,
   getInputAffixClasses,
   getInputErrorClasses,
@@ -103,16 +103,13 @@ var Input = ({
   const showClear = clearable && !disabled && !readonly && currentValStr.length > 0;
   const showPasswordToggle = showPassword && type === "password" && !disabled;
   const effectiveType = showPassword && type === "password" ? passwordVisible ? "text" : "password" : type;
-  const inputClasses = getInputClasses({
+  const inputClasses = getInputFieldClasses({
     size: effectiveSize,
     status,
     hasPrefix,
     hasSuffix
   });
   const renderSuffix = () => {
-    if (activeError) {
-      return /* @__PURE__ */ jsx("div", { id: errorMsgId, className: getInputErrorClasses(effectiveSize), children: errorMessage });
-    }
     if (showClear) {
       return /* @__PURE__ */ jsx(
         "button",
@@ -148,7 +145,7 @@ var Input = ({
     "div",
     {
       ref: wrapperRef,
-      className: classNames(getInputWrapperClasses(), className),
+      className: classNames(getInputWrapperClasses(status), className),
       style,
       onAnimationEnd: handleAnimationEnd,
       children: [
@@ -183,16 +180,36 @@ var Input = ({
       ]
     }
   );
+  const extras = [];
+  if (activeError) {
+    extras.push(
+      /* @__PURE__ */ jsx(
+        "div",
+        {
+          id: errorMsgId,
+          className: getInputErrorClasses(effectiveSize),
+          "aria-live": "polite",
+          children: errorMessage
+        },
+        "error"
+      )
+    );
+  }
   if (showCount) {
     const count = currentValStr.length;
     const isOver = maxLength !== void 0 && count > maxLength;
     const countText = maxLength !== void 0 ? `${count} / ${maxLength}` : `${count}`;
-    return /* @__PURE__ */ jsxs("div", { children: [
-      wrapperNode,
-      /* @__PURE__ */ jsx("div", { className: getInputCountClasses(isOver), children: countText })
-    ] });
+    extras.push(
+      /* @__PURE__ */ jsx("div", { className: getInputCountClasses(isOver), children: countText }, "count")
+    );
+  }
+  if (extras.length === 0) {
+    return wrapperNode;
   }
-  return wrapperNode;
+  return /* @__PURE__ */ jsxs("div", { className: "w-full", children: [
+    wrapperNode,
+    extras
+  ] });
 };
 
 export {

package/dist/{chunk-IXQAECFP.mjs → chunk-3QNIFKVF.mjs}

@@ -16,6 +16,7 @@ import {
   getAnchorLinkClasses,
   getAnchorLinkListClasses,
   createAnchorObserver,
+  createProgrammaticScrollLock,
   scrollToAnchor
 } from "@expcat/tigercat-core";
 import { jsx, jsxs } from "react/jsx-runtime";
@@ -86,7 +87,7 @@ var AnchorLink = ({
 };
 var Anchor = ({
   affix = true,
-  bounds: _bounds = 5,
+  bounds = 5,
   offsetTop = 0,
   showInkInFixed = false,
   targetOffset,
@@ -103,10 +104,9 @@ var Anchor = ({
   const [links, setLinks] = useState([]);
   const anchorRef = useRef(null);
   const inkRef = useRef(null);
-  const isScrollingRef = useRef(false);
-  const scrollTimeoutRef = useRef(null);
   const getContainerRef = useRef(getContainer);
   getContainerRef.current = getContainer;
+  const scrollLockRef = useRef(createProgrammaticScrollLock(() => getContainerRef.current()));
   const getCurrentAnchorRef = useRef(getCurrentAnchor);
   getCurrentAnchorRef.current = getCurrentAnchor;
   const onChangeRef = useRef(onChange);
@@ -133,14 +133,9 @@ var Anchor = ({
   const handleLinkClick = useCallback(
     (href, event) => {
       onClick?.(event, href);
-      isScrollingRef.current = true;
+      scrollLockRef.current.lock();
       setActiveLink(href);
       scrollTo(href);
-      if (scrollTimeoutRef.current !== null) clearTimeout(scrollTimeoutRef.current);
-      scrollTimeoutRef.current = setTimeout(() => {
-        isScrollingRef.current = false;
-        scrollTimeoutRef.current = null;
-      }, 500);
     },
     [onClick, scrollTo]
   );
@@ -151,9 +146,10 @@ var Anchor = ({
       const root = container === window ? null : container;
       stop = createAnchorObserver(links, {
         offsetTop: scrollOffset,
+        bounds,
         root,
         onChange: (newActiveLink) => {
-          if (isScrollingRef.current) return;
+          if (scrollLockRef.current.isLocked()) return;
           const finalActiveLink = getCurrentAnchorRef.current ? getCurrentAnchorRef.current(newActiveLink) : newActiveLink;
           setActiveLink((prev) => {
             if (finalActiveLink !== prev) {
@@ -168,11 +164,13 @@ var Anchor = ({
     return () => {
       clearTimeout(timeoutId);
       stop?.();
-      if (scrollTimeoutRef.current !== null) {
-        clearTimeout(scrollTimeoutRef.current);
-      }
     };
-  }, [links, scrollOffset]);
+  }, [bounds, links, scrollOffset]);
+  useEffect(() => {
+    return () => {
+      scrollLockRef.current.dispose();
+    };
+  }, []);
   useEffect(() => {
     if (!inkRef.current || !anchorRef.current || !activeLink) {
       return;

package/dist/{chunk-UD4DTVJZ.mjs → chunk-4C2X5PZO.mjs}

@@ -1,6 +1,6 @@
 import {
   Textarea
-} from "./chunk-UYJJLHVA.mjs";
+} from "./chunk-PMQJ6AYT.mjs";
 import {
   Button
 } from "./chunk-5TE7KLE5.mjs";
@@ -13,6 +13,9 @@ import {
 import {
   Avatar
 } from "./chunk-OO562MFD.mjs";
+import {
+  useTigerConfig
+} from "./chunk-YSIXURBW.mjs";
 
 // src/components/CommentThread.tsx
 import { useMemo, useState } from "react";
@@ -20,7 +23,13 @@ import {
   classNames,
   buildCommentTree,
   clipCommentTreeDepth,
-  formatCommentTime
+  formatCommentTime,
+  getCommentThreadLabels,
+  mergeTigerLocale,
+  nextCommentLikeState,
+  resolveCommentLikeState,
+  resolveLocaleText,
+  writeCommentLikeOverlay
 } from "@expcat/tigercat-core";
 
 // ../core/src/internal/comment-thread-styles.ts
@@ -55,15 +64,19 @@ var CommentThread = ({
   maxReplies = 3,
   defaultExpandedKeys = [],
   expandedKeys,
-  emptyText = "\u6682\u65E0\u8BC4\u8BBA",
-  replyPlaceholder = "\u5199\u4E0B\u56DE\u590D...",
-  replyButtonText = "\u56DE\u590D",
-  cancelReplyText = "\u53D6\u6D88",
-  likeText = "\u70B9\u8D5E",
-  likedText = "\u5DF2\u8D5E",
-  replyText = "\u56DE\u590D",
-  moreText = "\u66F4\u591A",
-  loadMoreText = "\u52A0\u8F7D\u66F4\u591A",
+  emptyText,
+  replyPlaceholder,
+  replyButtonText,
+  cancelReplyText,
+  likeText,
+  likedText,
+  replyText,
+  moreText,
+  loadMoreText,
+  collapseRepliesText,
+  expandRepliesText,
+  locale,
+  labels: labelsOverride,
   showAvatar = true,
   showDivider = true,
   showLike = true,
@@ -78,8 +91,18 @@ var CommentThread = ({
   className,
   ...divProps
 }) => {
+  const config = useTigerConfig();
+  const mergedLocale = useMemo(
+    () => mergeTigerLocale(config.locale, locale),
+    [config.locale, locale]
+  );
+  const labels = useMemo(
+    () => getCommentThreadLabels(mergedLocale, labelsOverride),
+    [mergedLocale, labelsOverride]
+  );
   const [innerExpandedKeys, setInnerExpandedKeys] = useState(defaultExpandedKeys);
   const [expandedAllKeys, setExpandedAllKeys] = useState(/* @__PURE__ */ new Set());
+  const [likeOverlay, setLikeOverlay] = useState(() => /* @__PURE__ */ new Map());
   const [replyingTo, setReplyingTo] = useState(null);
   const [replyValue, setReplyValue] = useState("");
   const mergedExpandedKeys = expandedKeys ?? innerExpandedKeys;
@@ -109,6 +132,11 @@ var CommentThread = ({
     });
     onLoadMore?.(node);
   };
+  const handleLike = (node) => {
+    const next = nextCommentLikeState(node, likeOverlay);
+    setLikeOverlay(writeCommentLikeOverlay(likeOverlay, node.id, next));
+    onLike?.(node, next.liked);
+  };
   const handleReplySubmit = (node) => {
     const trimmed = replyValue.trim();
     if (!trimmed) return;
@@ -131,8 +159,9 @@ var CommentThread = ({
     const showLoadMoreBtn = showReplies && maxReplies > 0 && children.length > maxReplies && !showAllReplies;
     const actions = [];
     if (showLike) {
-      const likeLabel = node.liked ? likedText : likeText;
-      const likeCount = node.likes ? ` ${node.likes}` : "";
+      const { liked, likes } = resolveCommentLikeState(node, likeOverlay);
+      const likeLabel = liked ? resolveLocaleText(labels.likedText, likedText) : resolveLocaleText(labels.likeText, likeText);
+      const likeCount = likes ? ` ${likes}` : "";
       actions.push(
         /* @__PURE__ */ jsxs(
           Button,
@@ -142,16 +171,16 @@ var CommentThread = ({
             className: classNames(
               commentThreadActionButtonClasses,
               commentThreadLikeButtonClasses,
-              node.liked && commentThreadLikedButtonClasses
+              liked && commentThreadLikedButtonClasses
             ),
-            onClick: () => onLike?.(node, !node.liked),
+            onClick: () => handleLike(node),
             children: [
               /* @__PURE__ */ jsx(
                 "svg",
                 {
                   className: classNames(
                     commentThreadLikeIconClasses,
-                    node.liked ? "fill-current" : "stroke-current fill-none"
+                    liked ? "fill-current" : "stroke-current fill-none"
                   ),
                   viewBox: "0 0 24 24",
                   strokeWidth: "2",
@@ -203,7 +232,7 @@ var CommentThread = ({
                   )
                 }
               ),
-              /* @__PURE__ */ jsx("span", { children: replyText })
+              /* @__PURE__ */ jsx("span", { children: resolveLocaleText(labels.replyText, replyText) })
             ]
           },
           "reply"
@@ -241,7 +270,7 @@ var CommentThread = ({
                   )
                 }
               ),
-              /* @__PURE__ */ jsx("span", { children: moreText })
+              /* @__PURE__ */ jsx("span", { children: resolveLocaleText(labels.moreText, moreText) })
             ]
           },
           "more"
@@ -324,7 +353,7 @@ var CommentThread = ({
                 {
                   rows: 3,
                   value: replyValue,
-                  placeholder: replyPlaceholder,
+                  placeholder: resolveLocaleText(labels.replyPlaceholder, replyPlaceholder),
                   className: commentThreadReplyTextareaClasses,
                   onChange: (event) => setReplyValue(event.target.value)
                 }
@@ -340,7 +369,7 @@ var CommentThread = ({
                       setReplyingTo(null);
                       setReplyValue("");
                     },
-                    children: cancelReplyText
+                    children: resolveLocaleText(labels.cancelReplyText, cancelReplyText)
                   }
                 ),
                 /* @__PURE__ */ jsx(
@@ -350,7 +379,7 @@ var CommentThread = ({
                     variant: "primary",
                     className: commentThreadSubmitButtonClasses,
                     onClick: () => handleReplySubmit(node),
-                    children: replyButtonText
+                    children: resolveLocaleText(labels.replyButtonText, replyButtonText)
                   }
                 )
               ] })
@@ -364,7 +393,10 @@ var CommentThread = ({
                 "aria-expanded": isExpanded,
                 "aria-controls": repliesId,
                 onClick: () => toggleExpanded(node.id),
-                children: isExpanded ? "\u25BE \u6536\u8D77\u56DE\u590D" : `\u25B8 \u5C55\u5F00 ${children.length} \u6761\u56DE\u590D`
+                children: isExpanded ? resolveLocaleText(labels.collapseRepliesText, collapseRepliesText) : resolveLocaleText(labels.expandRepliesText, expandRepliesText).replace(
+                  "{count}",
+                  String(children.length)
+                )
               }
             ) : null,
             showReplies ? /* @__PURE__ */ jsxs("div", { id: repliesId, className: commentThreadRepliesClasses, children: [
@@ -378,7 +410,7 @@ var CommentThread = ({
                   variant: "ghost",
                   className: commentThreadPrimaryButtonClasses,
                   onClick: () => handleLoadMore(node),
-                  children: loadMoreText
+                  children: resolveLocaleText(labels.loadMoreText, loadMoreText)
                 }
               ) : null
             ] }) : null
@@ -394,7 +426,7 @@ var CommentThread = ({
       className: classNames("tiger-comment-thread flex flex-col", className),
       role: divProps.role ?? "feed",
       "data-tiger-comment-thread": true,
-      "aria-label": divProps["aria-label"] ?? (divProps["aria-labelledby"] ? void 0 : "\u8BC4\u8BBA\u7EBF\u7A0B"),
+      "aria-label": divProps["aria-label"] ?? (divProps["aria-labelledby"] ? void 0 : "Comment thread"),
       ...divProps,
       children: resolvedNodes.length === 0 ? /* @__PURE__ */ jsxs("div", { className: commentThreadEmptyClasses, children: [
         /* @__PURE__ */ jsx(
@@ -415,7 +447,7 @@ var CommentThread = ({
             )
           }
         ),
-        /* @__PURE__ */ jsx(Text, { tag: "div", size: "sm", color: "muted", className: "font-medium", children: emptyText })
+        /* @__PURE__ */ jsx(Text, { tag: "div", size: "sm", color: "muted", className: "font-medium", children: resolveLocaleText(labels.emptyText, emptyText) })
       ] }) : resolvedNodes.map((node, index) => renderNode(node, 1, index === resolvedNodes.length - 1))
     }
   );

package/dist/chunk-5JETWHLJ.mjs

@@ -0,0 +1,28 @@
+// src/hooks/useResponsiveChartSize.ts
+import { useCallback, useMemo, useState } from "react";
+import {
+  getChartInnerRect,
+  resolveResponsiveChartSize
+} from "@expcat/tigercat-core";
+function useResponsiveChartSize(width, height, padding, responsive) {
+  const [observedSize, setObservedSize] = useState(null);
+  const plotSize = useMemo(
+    () => resolveResponsiveChartSize({ width, height }, responsive ? observedSize : null),
+    [width, height, responsive, observedSize]
+  );
+  const innerRect = useMemo(
+    () => getChartInnerRect(plotSize.width, plotSize.height, padding),
+    [plotSize.width, plotSize.height, padding]
+  );
+  const onResolvedSizeChange = useCallback((size) => {
+    setObservedSize((prev) => {
+      if (prev && prev.width === size.width && prev.height === size.height) return prev;
+      return size;
+    });
+  }, []);
+  return { plotSize, innerRect, onResolvedSizeChange };
+}
+
+export {
+  useResponsiveChartSize
+};

package/dist/{chunk-VA6PZWOH.mjs → chunk-5SEMRHBD.mjs}

@@ -1,3 +1,6 @@
+import {
+  useControlledState
+} from "./chunk-MEFARVQI.mjs";
 import {
   useTigerConfig
 } from "./chunk-YSIXURBW.mjs";
@@ -34,7 +37,8 @@ import { jsx, jsxs } from "react/jsx-runtime";
 var FileManager = ({
   files = [],
   viewMode = "list",
-  selectedKeys = [],
+  selectedKeys,
+  defaultSelectedKeys,
   multiple = false,
   columns,
   sortField = "name",
@@ -67,6 +71,11 @@ var FileManager = ({
   const contentRef = useRef(null);
   const dragFromIndex = useRef(null);
   const labels = useMemo(() => getFileManagerLabels(mergedLocale), [mergedLocale]);
+  const [keys, setKeys] = useControlledState(
+    selectedKeys,
+    defaultSelectedKeys ?? [],
+    onSelectedKeysChange
+  );
   const metaColumns = columns ?? ["size", "modified"];
   const showSizeColumn = metaColumns.includes("size");
   const showModifiedColumn = metaColumns.includes("modified");
@@ -75,23 +84,22 @@ var FileManager = ({
     () => deriveFileManagerModel({
       files,
       currentPath,
-      selectedKeys,
+      selectedKeys: keys,
       sortField,
       sortOrder,
       showHidden,
       searchText: localSearch || searchText
     }),
-    [files, currentPath, selectedKeys, sortField, sortOrder, showHidden, localSearch, searchText]
+    [files, currentPath, keys, sortField, sortOrder, showHidden, localSearch, searchText]
   );
   const containerClasses = useMemo(() => getFileManagerContainerClasses(className), [className]);
   const handleSelect = useCallback(
     (item) => {
       if (item.disabled) return;
       onSelect?.(item);
-      const keys = toggleFileSelection(selectedKeys, item.key, multiple);
-      onSelectedKeysChange?.(keys);
+      setKeys(toggleFileSelection(keys, item.key, multiple));
     },
-    [selectedKeys, multiple, onSelect, onSelectedKeysChange]
+    [keys, multiple, onSelect, setKeys]
   );
   const handleOpen = useCallback(
     (item) => {

package/dist/{chunk-EKILTLUO.mjs → chunk-72CJNKDY.mjs}

@@ -3,7 +3,7 @@ import {
 } from "./chunk-YORCCCQX.mjs";
 import {
   ChartCanvas
-} from "./chunk-DKNVSQSV.mjs";
+} from "./chunk-CUAXRBKO.mjs";
 
 // src/components/GaugeChart.tsx
 import React, { useId, useMemo, useState, useRef, useEffect } from "react";

package/dist/{chunk-XE4YFBOZ.mjs → chunk-AUD3VOLO.mjs}

@@ -1,6 +1,6 @@
 import {
   usePopup
-} from "./chunk-ZG56T75O.mjs";
+} from "./chunk-WTHWLCRL.mjs";
 import {
   renderOverlayPortal
 } from "./chunk-HKAZXG74.mjs";