@expcat/tigercat-react 2.0.19 → 2.1.1

package/dist/{chunk-V6P7ZK6O.mjs → chunk-QXSUG7SN.mjs}

@@ -1,15 +1,15 @@
 import {
   Table
-} from "./chunk-BOGOQ44C.mjs";
+} from "./chunk-CQOLQAB5.mjs";
 import {
   Select
 } from "./chunk-KVCI2346.mjs";
 import {
   Popover
-} from "./chunk-HOYBHB7B.mjs";
+} from "./chunk-FNK2VWPP.mjs";
 import {
   Input
-} from "./chunk-F6WV53BS.mjs";
+} from "./chunk-3LDDXHW2.mjs";
 import {
   Checkbox
 } from "./chunk-EPWAROC2.mjs";

package/dist/{chunk-FYINJRYN.mjs → chunk-R7YZ6FKP.mjs}

@@ -1,6 +1,12 @@
+import {
+  useResponsiveChartSize
+} from "./chunk-5JETWHLJ.mjs";
 import {
   useChartInteraction
-} from "./chunk-DNOPEJ5I.mjs";
+} from "./chunk-JZZPLKTW.mjs";
+import {
+  ChartSeries
+} from "./chunk-SDLMB34Y.mjs";
 import {
   ChartTooltip
 } from "./chunk-YORCCCQX.mjs";
@@ -9,16 +15,13 @@ import {
 } from "./chunk-RQSQXQN6.mjs";
 import {
   ChartCanvas
-} from "./chunk-DKNVSQSV.mjs";
+} from "./chunk-CUAXRBKO.mjs";
 import {
   ChartGrid
 } from "./chunk-677VSTPW.mjs";
 import {
   ChartLegend
 } from "./chunk-F2ITBDUS.mjs";
-import {
-  ChartSeries
-} from "./chunk-SDLMB34Y.mjs";
 
 // src/components/AreaChart.tsx
 import { useId, useMemo, useState, useCallback } from "react";
@@ -29,7 +32,6 @@ import {
   createLinePath,
   createPointScale,
   getChartElementOpacity,
-  getChartInnerRect,
   getStableChartGradientPrefix,
   getNumberExtent,
   linePointTransitionClasses,
@@ -111,9 +113,11 @@ var AreaChart = ({
     () => getStableChartGradientPrefix("area", gradientId),
     [gradientId]
   );
-  const innerRect = useMemo(
-    () => getChartInnerRect(width, height, padding),
-    [width, height, padding]
+  const { innerRect, onResolvedSizeChange } = useResponsiveChartSize(
+    width,
+    height,
+    padding,
+    responsive
   );
   const resolvedSeries = useMemo(
     () => resolveSeriesData(series, data, {
@@ -135,6 +139,7 @@ var AreaChart = ({
     wrapperClasses
   } = useChartInteraction({
     hoverable,
+    showTooltip,
     hoveredIndexProp,
     selectable,
     selectedIndexProp,
@@ -287,17 +292,21 @@ var AreaChart = ({
     (seriesIndex, pointIndex, event) => {
       setHoveredPointInfo({ seriesIndex, pointIndex });
       setTooltipPosition({ x: event.clientX, y: event.clientY });
-      onPointHover?.(seriesIndex, pointIndex, resolvedSeries[seriesIndex]?.data[pointIndex]);
+      if (hoverable) {
+        onPointHover?.(seriesIndex, pointIndex, resolvedSeries[seriesIndex]?.data[pointIndex]);
+      }
     },
-    [onPointHover, resolvedSeries]
+    [hoverable, onPointHover, resolvedSeries]
   );
   const handlePointMouseMove = useCallback((event) => {
     setTooltipPosition({ x: event.clientX, y: event.clientY });
   }, []);
   const handlePointMouseLeave = useCallback(() => {
     setHoveredPointInfo(null);
-    onPointHover?.(null, null, null);
-  }, [onPointHover]);
+    if (hoverable) {
+      onPointHover?.(null, null, null);
+    }
+  }, [hoverable, onPointHover]);
   const showPointTooltipFromElement = useCallback(
     (el, seriesIndex, pointIndex) => {
       if (!hoverable) return;
@@ -325,6 +334,7 @@ var AreaChart = ({
     [selectable, handleSeriesSelect]
   );
   const pointClickable = selectable || !!onPointClick;
+  const trackPointHover = showTooltip || hoverable;
   const reversedSeriesData = useMemo(() => [...seriesData].reverse(), [seriesData]);
   const chart = /* @__PURE__ */ jsxs(
     ChartCanvas,
@@ -336,6 +346,7 @@ var AreaChart = ({
       title,
       desc,
       className: classNames(className),
+      onResolvedSizeChange,
       children: [
         (gradient || animated || strokeGradient || pointGradient) && /* @__PURE__ */ jsxs("defs", { children: [
           animated && /* @__PURE__ */ jsx("style", { children: `
@@ -518,9 +529,9 @@ var AreaChart = ({
                 tabIndex: pointInteractive ? 0 : void 0,
                 "data-point-index": point.pointIndex,
                 "data-series-key": sd.seriesKey,
-                onMouseEnter: hoverable ? (e) => handlePointMouseEnter(sd.seriesIndex, point.pointIndex, e) : void 0,
-                onMouseMove: hoverable ? handlePointMouseMove : void 0,
-                onMouseLeave: hoverable ? handlePointMouseLeave : void 0,
+                onMouseEnter: trackPointHover ? (e) => handlePointMouseEnter(sd.seriesIndex, point.pointIndex, e) : void 0,
+                onMouseMove: trackPointHover ? handlePointMouseMove : void 0,
+                onMouseLeave: trackPointHover ? handlePointMouseLeave : void 0,
                 onClick: pointClickable ? (e) => {
                   e.stopPropagation();
                   handlePointClick(sd.seriesIndex, point.pointIndex);

package/dist/{chunk-YI6YWH66.mjs → chunk-RE5ZLA5D.mjs}

@@ -44,6 +44,7 @@ var DropdownMenu = ({
 var DropdownItem = ({
   disabled = false,
   divided = false,
+  closeOnClick,
   className,
   onClick,
   children,
@@ -56,8 +57,9 @@ var DropdownItem = ({
       return;
     }
     onClick?.(event);
-    if (context?.closeOnClick) {
-      context.handleItemClick();
+    const shouldClose = closeOnClick ?? context?.closeOnClick ?? true;
+    if (shouldClose) {
+      context?.handleItemClick();
     }
   };
   const itemClasses = classNames(getDropdownItemClasses(disabled, divided), className);
@@ -129,10 +131,8 @@ var Dropdown = ({
     [disabled, visible, controlledOpen, onOpenChange]
   );
   const handleItemClick = useCallback(() => {
-    if (closeOnClick) {
-      setVisible(false);
-    }
-  }, [closeOnClick, setVisible]);
+    setVisible(false);
+  }, [setVisible]);
   const handleMouseEnter = useCallback(() => {
     if (trigger !== "hover") return;
     if (hoverTimerRef.current) {

package/dist/{chunk-UCBW5RJN.mjs → chunk-RGVU4EMA.mjs}

@@ -33,7 +33,7 @@ import {
   getPictureCardClasses,
   getUploadStatusIconClasses
 } from "@expcat/tigercat-core";
-import { jsx, jsxs } from "react/jsx-runtime";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 var spinnerSvg = getSpinnerSVG("spinner");
 var Upload = ({
   accept,
@@ -133,6 +133,11 @@ var Upload = ({
       onExceed?.(prepared.rejectedExceedFiles, fileList);
     }
     let nextFileList = [...fileList];
+    const notifyFileList = (file) => {
+      const nextList = [...nextFileList];
+      updateFileList(nextList);
+      onChange?.(file, nextList);
+    };
     for (const file of prepared.acceptedFiles) {
       const uploadFile = fileToUploadFile(file);
       nextFileList = [...nextFileList, uploadFile];
@@ -141,7 +146,7 @@ var Upload = ({
         onChange(uploadFile, nextFileList);
       }
       if (autoUpload && !queue) {
-        await uploadOne(file, uploadFile, () => updateFileList([...nextFileList]));
+        await uploadOne(file, uploadFile, () => notifyFileList(uploadFile));
       }
     }
     if (autoUpload && queue) {
@@ -154,7 +159,7 @@ var Upload = ({
         async (item) => {
           const uploadFile = nextFileList.find((candidate) => candidate.uid === item.id);
           if (!uploadFile) return;
-          await uploadOne(item.file, uploadFile, () => updateFileList([...nextFileList]));
+          await uploadOne(item.file, uploadFile, () => notifyFileList(uploadFile));
         },
         { concurrency: maxConcurrent, onChange: onQueueChange }
       );
@@ -266,7 +271,7 @@ var Upload = ({
   };
   const renderUploadButton = () => {
     if (drag) {
-      return /* @__PURE__ */ jsxs(
+      return /* @__PURE__ */ jsx(
         "div",
         {
           className: getDragAreaClasses(isDragging, disabled),
@@ -279,7 +284,7 @@ var Upload = ({
           tabIndex: disabled ? -1 : 0,
           "aria-disabled": disabled,
           "aria-label": labels.dragAreaAriaLabel,
-          children: [
+          children: children || /* @__PURE__ */ jsxs(Fragment, { children: [
             /* @__PURE__ */ jsx(
               "svg",
               {
@@ -308,7 +313,7 @@ var Upload = ({
             maxSize && /* @__PURE__ */ jsx("p", { className: "text-xs text-gray-500", children: interpolateUploadLabel(labels.maxSizeInfoText, {
               maxSize: formatFileSize(maxSize)
             }) })
-          ]
+          ] })
         }
       );
     }

package/dist/{chunk-IBSOUQGB.mjs → chunk-RRGPDFDI.mjs}

@@ -155,14 +155,17 @@ var FormWizard = ({
   ]);
   const handleStepChange = useCallback(
     async (nextIndex) => {
-      if (nextIndex === currentIndex || steps[nextIndex]?.disabled) return;
-      if (nextIndex > currentIndex) {
+      if (nextIndex === currentIndex) return;
+      const direction2 = nextIndex > currentIndex ? 1 : -1;
+      if (direction2 === 1) {
         const ok = await runBeforeNext();
         if (!ok) return;
       }
-      setCurrent(nextIndex);
+      const target = findNextUnskipped(nextIndex, direction2);
+      if (target === currentIndex) return;
+      setCurrent(target);
     },
-    [currentIndex, runBeforeNext, setCurrent, steps]
+    [currentIndex, runBeforeNext, setCurrent, findNextUnskipped]
   );
   const contentNode = useMemo(() => {
     if (!currentStep) return null;

package/dist/{chunk-ZH5ZBLAN.mjs → chunk-RUQ3F3MV.mjs}

@@ -21,6 +21,25 @@ import {
   getFormItemAsteriskClasses
 } from "@expcat/tigercat-core";
 import { jsx, jsxs } from "react/jsx-runtime";
+function isEventTarget(value) {
+  return value !== null && typeof value === "object";
+}
+function extractFormChangeValue(argument) {
+  if (argument === void 0) {
+    return { found: false };
+  }
+  if (argument !== null && typeof argument === "object" && "target" in argument) {
+    const target = argument.target;
+    if (isEventTarget(target)) {
+      const type = typeof target.type === "string" ? target.type.toLowerCase() : "";
+      if (type === "checkbox" || type === "radio") {
+        return { found: true, value: target.checked };
+      }
+      return { found: true, value: target.value };
+    }
+  }
+  return { found: true, value: argument };
+}
 function hasRequiredRule(maybeRules) {
   if (!maybeRules) return false;
   const ruleArr = Array.isArray(maybeRules) ? maybeRules : [maybeRules];
@@ -129,11 +148,19 @@ var FormItem = ({
       formContext.validateField(name, rules, "blur");
     }
   }, [name, formContext, rules]);
-  const handleChange = useCallback(() => {
-    if (name && formContext) {
+  const handleChange = useCallback(
+    (argument) => {
+      if (!name || !formContext) {
+        return;
+      }
+      const extracted = extractFormChangeValue(argument);
+      if (extracted.found) {
+        formContext.updateValue(name, extracted.value);
+      }
       formContext.validateField(name, rules, "change");
-    }
-  }, [name, formContext, rules]);
+    },
+    [name, formContext, rules]
+  );
   const hasError = !!errorMessage;
   const popupErrorVisible = showMessage && hasError && errorDisplayMode === "popup";
   const overlay = useAnchoredOverlay({
@@ -172,9 +199,9 @@ var FormItem = ({
         onlyChild.props.onBlur?.(event);
         handleBlur();
       },
-      onChange: (event) => {
-        onlyChild.props.onChange?.(event);
-        handleChange();
+      onChange: (...args) => {
+        onlyChild.props.onChange?.(...args);
+        handleChange(args[0]);
       }
     };
     if (!isNativeElement) {

package/dist/chunk-SEOG5AGS.mjs

@@ -0,0 +1,72 @@
+// src/components/Highlight.tsx
+import React, { forwardRef, isValidElement } from "react";
+import {
+  getHighlightMarkClasses,
+  getHighlightRootClasses,
+  getHighlightSegments,
+  resolveHighlightText
+} from "@expcat/tigercat-core";
+import { jsx } from "react/jsx-runtime";
+function flattenReactText(node) {
+  if (node == null || typeof node === "boolean") return "";
+  if (typeof node === "string" || typeof node === "number") return String(node);
+  if (Array.isArray(node)) {
+    let out = "";
+    for (const item of node) out += flattenReactText(item);
+    return out;
+  }
+  if (isValidElement(node)) {
+    const props = node.props;
+    return flattenReactText(props.children);
+  }
+  return "";
+}
+var Highlight = forwardRef(
+  ({
+    text,
+    keywords,
+    caseSensitive = false,
+    global = true,
+    highlightClassName,
+    highlightStyle,
+    className,
+    style,
+    children,
+    ...rest
+  }, ref) => {
+    const source = resolveHighlightText(text, flattenReactText(children));
+    const segments = getHighlightSegments(source, keywords, { caseSensitive, global });
+    const markClasses = getHighlightMarkClasses(highlightClassName);
+    return /* @__PURE__ */ jsx(
+      "span",
+      {
+        ref,
+        "data-highlight": "",
+        "data-highlight-case-sensitive": caseSensitive ? "true" : "false",
+        "data-highlight-global": global ? "true" : "false",
+        className: getHighlightRootClasses(className),
+        style,
+        ...rest,
+        children: segments.map(
+          (segment) => segment.highlighted ? /* @__PURE__ */ jsx(
+            "mark",
+            {
+              className: markClasses,
+              style: highlightStyle,
+              "data-highlight-mark": "",
+              children: segment.text
+            },
+            `mark-${segment.start}-${segment.end}`
+          ) : /* @__PURE__ */ jsx(React.Fragment, { children: segment.text }, `text-${segment.start}-${segment.end}`)
+        )
+      }
+    );
+  }
+);
+Highlight.displayName = "Highlight";
+var Highlight_default = Highlight;
+
+export {
+  Highlight,
+  Highlight_default
+};

package/dist/{chunk-PGD5RPKF.mjs → chunk-SVIJ2UZA.mjs}

@@ -7,6 +7,7 @@ import { useState, useMemo, useCallback } from "react";
 import {
   rateBaseClasses,
   getRateStarClasses,
+  rateHalfStarInnerClasses,
   rateActiveColor,
   rateInactiveColor,
   rateHoverColor,
@@ -126,7 +127,7 @@ var Rate = ({
               isHovering ? rateHoverColor : rateActiveColor
             ),
             style: { width: "50%" },
-            children: isChar ? /* @__PURE__ */ jsx("span", { children: character }) : starIcon
+            children: isChar ? /* @__PURE__ */ jsx("span", { className: rateHalfStarInnerClasses, children: character }) : /* @__PURE__ */ jsx("svg", { viewBox: starViewBox, fill: "currentColor", className: rateHalfStarInnerClasses, children: /* @__PURE__ */ jsx("path", { d: starPathD }) })
           }
         )
       ] }) : /* @__PURE__ */ jsx("span", { className: colorClass, children: isChar ? /* @__PURE__ */ jsx("span", { children: character }) : starIcon });