@expcat/tigercat-react 2.1.0 → 2.1.1

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";

package/dist/{chunk-I4MWOYJS.mjs → chunk-AYFKHWJS.mjs}

@@ -1,6 +1,9 @@
+import {
+  useResponsiveChartSize
+} from "./chunk-5JETWHLJ.mjs";
 import {
   useChartInteraction
-} from "./chunk-DNOPEJ5I.mjs";
+} from "./chunk-JZZPLKTW.mjs";
 import {
   ChartSeries
 } from "./chunk-SDLMB34Y.mjs";
@@ -12,7 +15,7 @@ import {
 } from "./chunk-RQSQXQN6.mjs";
 import {
   ChartCanvas
-} from "./chunk-DKNVSQSV.mjs";
+} from "./chunk-CUAXRBKO.mjs";
 import {
   ChartGrid
 } from "./chunk-677VSTPW.mjs";
@@ -31,7 +34,6 @@ import {
   getStableChartGradientPrefix,
   getBarValueLabelY,
   getChartElementOpacity,
-  getChartInnerRect,
   getNumberExtent,
   resolveChartPalette,
   buildChartLegendItems,
@@ -117,6 +119,7 @@ var BarChart = ({
     wrapperClasses
   } = useChartInteraction({
     hoverable,
+    showTooltip,
     hoveredIndexProp,
     selectable,
     selectedIndexProp,
@@ -133,9 +136,11 @@ var BarChart = ({
       onClick: onBarClick
     }
   });
-  const innerRect = useMemo(
-    () => getChartInnerRect(width, height, padding),
-    [width, height, padding]
+  const { innerRect, onResolvedSizeChange } = useResponsiveChartSize(
+    width,
+    height,
+    padding,
+    responsive
   );
   const xDomain = useMemo(() => data.map((item) => String(item.x)), [data]);
   const yValues = useMemo(() => data.map((item) => item.y), [data]);
@@ -229,6 +234,7 @@ var BarChart = ({
       title,
       desc,
       className: classNames(className),
+      onResolvedSizeChange,
       children: [
         gradient && /* @__PURE__ */ jsx("defs", { children: bars.map((bar) => /* @__PURE__ */ jsxs(
           "linearGradient",
@@ -342,7 +348,7 @@ var BarChart = ({
     ChartTooltip,
     {
       content: tooltipContent,
-      open: hoverable && resolvedHoveredIndex !== null && tooltipContent !== "",
+      open: resolvedHoveredIndex !== null && tooltipContent !== "",
       x: tooltipPosition.x,
       y: tooltipPosition.y
     }

package/dist/{chunk-RPSHILHD.mjs → chunk-BXAH2GH3.mjs}

@@ -1,3 +1,7 @@
+import {
+  useControlledState
+} from "./chunk-MEFARVQI.mjs";
+
 // src/components/Switch.tsx
 import {
   getSwitchClasses,
@@ -5,7 +9,8 @@ import {
 } from "@expcat/tigercat-core";
 import { jsx } from "react/jsx-runtime";
 var Switch = ({
-  checked = false,
+  checked: checkedProp,
+  defaultChecked,
   disabled = false,
   size = "md",
   onChange,
@@ -15,11 +20,12 @@ var Switch = ({
   tabIndex,
   ...props
 }) => {
+  const [checked, setChecked] = useControlledState(checkedProp, defaultChecked ?? false, onChange);
   const switchClasses = getSwitchClasses(size, checked, disabled, className);
   const thumbClasses = getSwitchThumbClasses(size, checked);
   const toggle = () => {
     if (disabled) return;
-    onChange?.(!checked);
+    setChecked(!checked);
   };
   const handleClick = (event) => {
     onClick?.(event);

package/dist/{chunk-EW5EO7VE.mjs → chunk-BYD7EAWK.mjs}

@@ -1,6 +1,6 @@
 import {
   PieChart
-} from "./chunk-QGZ32NFQ.mjs";
+} from "./chunk-Z23KOLNU.mjs";
 
 // src/components/DonutChart.tsx
 import { useEffect, useMemo, useState } from "react";