@expcat/tigercat-react 1.3.4 → 1.5.0

package/dist/{chunk-PXO2F2CS.mjs → chunk-V23KR23W.mjs}

@@ -60,6 +60,34 @@ var Rate = ({
     setHoverValue(0);
     onHoverChange?.(0);
   }, [disabled, onHoverChange]);
+  const step = allowHalf ? 0.5 : 1;
+  const handleKeyDown = useCallback(
+    (e) => {
+      if (disabled) return;
+      let next = value;
+      switch (e.key) {
+        case "ArrowRight":
+        case "ArrowUp":
+          next = Math.min(count, value + step);
+          break;
+        case "ArrowLeft":
+        case "ArrowDown":
+          next = Math.max(0, value - step);
+          break;
+        case "Home":
+          next = 0;
+          break;
+        case "End":
+          next = count;
+          break;
+        default:
+          return;
+      }
+      e.preventDefault();
+      if (next !== value) onChange?.(next);
+    },
+    [disabled, value, count, step, onChange]
+  );
   const starIcon = useMemo(
     () => /* @__PURE__ */ jsx("svg", { viewBox: starViewBox, fill: "currentColor", className: "w-full h-full", children: /* @__PURE__ */ jsx("path", { d: starPathD }) }),
     []
@@ -90,9 +118,7 @@ var Rate = ({
           "span",
           {
             className: getRateStarClasses(size, isChar, disabled),
-            role: "radio",
-            "aria-checked": full || half,
-            "aria-label": `${i + 1} star${i + 1 > 1 ? "s" : ""}`,
+            "aria-hidden": "true",
             onClick: (e) => handleClick(i, e),
             onMouseMove: (e) => handleMouseMove(i, e),
             onMouseLeave: handleMouseLeave,
@@ -117,7 +143,24 @@ var Rate = ({
     handleMouseMove,
     handleMouseLeave
   ]);
-  return /* @__PURE__ */ jsx("div", { className: classNames(rateBaseClasses, className), role: "radiogroup", "aria-label": "Rating", children: stars });
+  const valueText = `${value} star${value === 1 ? "" : "s"}`;
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: classNames(rateBaseClasses, className),
+      role: "slider",
+      "aria-label": "Rating",
+      "aria-valuemin": 0,
+      "aria-valuemax": count,
+      "aria-valuenow": value,
+      "aria-valuetext": valueText,
+      "aria-disabled": disabled || void 0,
+      "aria-orientation": "horizontal",
+      tabIndex: disabled ? -1 : 0,
+      onKeyDown: handleKeyDown,
+      children: stars
+    }
+  );
 };
 
 export {

package/dist/{chunk-6I6X255M.js → chunk-V3QEV3TL.js}

@@ -1,24 +1,24 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }
 
-var _chunkITRYKHQJjs = require('./chunk-ITRYKHQJ.js');
+var _chunkDH4B2COVjs = require('./chunk-DH4B2COV.js');
 
 
-var _chunkBBLVRLXTjs = require('./chunk-BBLVRLXT.js');
+var _chunkHFGTJEQWjs = require('./chunk-HFGTJEQW.js');
 
 
 var _chunkWOSKRZOOjs = require('./chunk-WOSKRZOO.js');
 
 
-var _chunkTDODFBBOjs = require('./chunk-TDODFBBO.js');
+var _chunkTO4SSBAJjs = require('./chunk-TO4SSBAJ.js');
 
 
-var _chunkZYJTHGQWjs = require('./chunk-ZYJTHGQW.js');
+var _chunkLZG24TDBjs = require('./chunk-LZG24TDB.js');
 
 
-var _chunkF7H4ALKNjs = require('./chunk-F7H4ALKN.js');
+var _chunkZLNBE4ISjs = require('./chunk-ZLNBE4IS.js');
 
 
-var _chunkZLNBE4ISjs = require('./chunk-ZLNBE4IS.js');
+var _chunkTDODFBBOjs = require('./chunk-TDODFBBO.js');
 
 // src/components/DataTableWithToolbar.tsx
 var _react = require('react');
@@ -41,7 +41,7 @@ var DataTableWithToolbar = ({
   onBulkAction,
   hiddenColumnKeys,
   defaultHiddenColumnKeys,
-  onHiddenColumnsChange,
+  onHiddenColumnKeysChange,
   pagination = false,
   onPageChange,
   onPageSizeChange,
@@ -142,7 +142,7 @@ var DataTableWithToolbar = ({
     if (hiddenColumnKeys === void 0) {
       setInternalHiddenKeys(nextHiddenKeys);
     }
-    _optionalChain([onHiddenColumnsChange, 'optionalCall', _18 => _18(nextHiddenKeys)]);
+    _optionalChain([onHiddenColumnKeysChange, 'optionalCall', _18 => _18(nextHiddenKeys)]);
   };
   const handleToggleColumnVisibility = (columnKey, visible) => {
     const nextHiddenKeys = visible ? resolvedHiddenKeys.filter((key) => key !== columnKey) : [...resolvedHiddenKeys, columnKey];
@@ -213,7 +213,7 @@ var DataTableWithToolbar = ({
         contentContent: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "flex flex-col gap-2 min-w-[160px]", children: tableProps.columns.map((column) => {
           const locked = lockedKeys.has(column.key) || column.hideable === false;
           return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-            _chunkF7H4ALKNjs.Checkbox,
+            _chunkLZG24TDBjs.Checkbox,
             {
               size: "sm",
               checked: !resolvedHiddenKeys.includes(column.key),
@@ -310,7 +310,7 @@ var DataTableWithToolbar = ({
                 ),
                 children: [
                   /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-                    _chunkZYJTHGQWjs.Input,
+                    _chunkTO4SSBAJjs.Input,
                     {
                       type: "search",
                       size: "sm",
@@ -383,7 +383,7 @@ var DataTableWithToolbar = ({
                   className: _nullishCoalesce(filter.itemClass, () => ( "w-full sm:w-auto sm:min-w-[120px] sm:max-w-[180px]")),
                   style: filter.itemStyle,
                   children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-                    _chunkBBLVRLXTjs.Select,
+                    _chunkHFGTJEQWjs.Select,
                     {
                       size: "sm",
                       options: (_nullishCoalesce(filter.options, () => ( []))).map((opt) => ({
@@ -435,7 +435,7 @@ var DataTableWithToolbar = ({
   return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: wrapperClasses, "data-tiger-data-table-with-toolbar": true, children: [
     renderToolbar(),
     /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-      _chunkITRYKHQJjs.Table,
+      _chunkDH4B2COVjs.Table,
       {
         ...remainingTableProps,
         locale,

package/dist/{chunk-M5GSLKUX.mjs → chunk-VAIWWELW.mjs}

@@ -1,6 +1,12 @@
+import {
+  useTigerConfig
+} from "./chunk-QAIBQHIO.mjs";
+
 // src/components/TreeSelect.tsx
 import { useState, useMemo, useRef, useEffect, useId } from "react";
 import {
+  resolveLocaleText,
+  mergeTigerLocale,
   treeSelectBaseClasses,
   treeSelectDropdownClasses,
   treeSelectSearchClasses,
@@ -45,12 +51,18 @@ var TreeSelect = (props) => {
     clearable = false,
     multiple = false,
     showSearch = false,
-    notFoundText = "No data",
+    notFoundText,
     defaultExpandAll = false,
     className,
     onChange,
+    locale,
     ...rest
   } = props;
+  const config = useTigerConfig();
+  const mergedLocale = useMemo(
+    () => mergeTigerLocale(config.locale, locale),
+    [config.locale, locale]
+  );
   const divProps = {};
   for (const key of Object.keys(rest)) {
     if (!TREESELECT_KEYS.has(key)) {
@@ -204,7 +216,7 @@ var TreeSelect = (props) => {
         {
           type: "text",
           className: treeSelectSearchClasses,
-          placeholder: "Search...",
+          placeholder: resolveLocaleText("Search...", mergedLocale?.common?.searchPlaceholder),
           value: searchQuery,
           "aria-label": "Search tree",
           onChange: (e) => setSearchQuery(e.target.value)
@@ -248,7 +260,7 @@ var TreeSelect = (props) => {
           },
           String(node.key)
         );
-      }) : /* @__PURE__ */ jsx("div", { className: treeSelectEmptyClasses, children: notFoundText })
+      }) : /* @__PURE__ */ jsx("div", { className: treeSelectEmptyClasses, children: resolveLocaleText("No data", notFoundText, mergedLocale?.common?.emptyText) })
     ] })
   ] });
 };

package/dist/{chunk-GG72T6JK.js → chunk-VOSN3IQC.js}

@@ -60,6 +60,34 @@ var Rate = ({
     setHoverValue(0);
     _optionalChain([onHoverChange, 'optionalCall', _3 => _3(0)]);
   }, [disabled, onHoverChange]);
+  const step = allowHalf ? 0.5 : 1;
+  const handleKeyDown = _react.useCallback.call(void 0, 
+    (e) => {
+      if (disabled) return;
+      let next = value;
+      switch (e.key) {
+        case "ArrowRight":
+        case "ArrowUp":
+          next = Math.min(count, value + step);
+          break;
+        case "ArrowLeft":
+        case "ArrowDown":
+          next = Math.max(0, value - step);
+          break;
+        case "Home":
+          next = 0;
+          break;
+        case "End":
+          next = count;
+          break;
+        default:
+          return;
+      }
+      e.preventDefault();
+      if (next !== value) _optionalChain([onChange, 'optionalCall', _4 => _4(next)]);
+    },
+    [disabled, value, count, step, onChange]
+  );
   const starIcon = _react.useMemo.call(void 0, 
     () => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "svg", { viewBox: _tigercatcore.starViewBox, fill: "currentColor", className: "w-full h-full", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", { d: _tigercatcore.starPathD }) }),
     []
@@ -90,9 +118,7 @@ var Rate = ({
           "span",
           {
             className: _tigercatcore.getRateStarClasses.call(void 0, size, isChar, disabled),
-            role: "radio",
-            "aria-checked": full || half,
-            "aria-label": `${i + 1} star${i + 1 > 1 ? "s" : ""}`,
+            "aria-hidden": "true",
             onClick: (e) => handleClick(i, e),
             onMouseMove: (e) => handleMouseMove(i, e),
             onMouseLeave: handleMouseLeave,
@@ -117,7 +143,24 @@ var Rate = ({
     handleMouseMove,
     handleMouseLeave
   ]);
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: _tigercatcore.classNames.call(void 0, _tigercatcore.rateBaseClasses, className), role: "radiogroup", "aria-label": "Rating", children: stars });
+  const valueText = `${value} star${value === 1 ? "" : "s"}`;
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+    "div",
+    {
+      className: _tigercatcore.classNames.call(void 0, _tigercatcore.rateBaseClasses, className),
+      role: "slider",
+      "aria-label": "Rating",
+      "aria-valuemin": 0,
+      "aria-valuemax": count,
+      "aria-valuenow": value,
+      "aria-valuetext": valueText,
+      "aria-disabled": disabled || void 0,
+      "aria-orientation": "horizontal",
+      tabIndex: disabled ? -1 : 0,
+      onKeyDown: handleKeyDown,
+      children: stars
+    }
+  );
 };
 
 

package/dist/{chunk-J4OQ2VRH.mjs → chunk-W6T3CG7U.mjs}

@@ -1,3 +1,7 @@
+import {
+  useTigerConfig
+} from "./chunk-QAIBQHIO.mjs";
+
 // src/components/AutoComplete.tsx
 import { useState, useRef, useEffect, useId, useMemo } from "react";
 import {
@@ -14,6 +18,8 @@ import {
   getPickerOptionAria,
   getPickerOptionId,
   classNames,
+  resolveLocaleText,
+  mergeTigerLocale,
   icon20ViewBox,
   closeSolidIcon20PathD
 } from "@expcat/tigercat-core";
@@ -29,6 +35,7 @@ var AUTOCOMPLETE_KEYS = /* @__PURE__ */ new Set([
   "filterOption",
   "defaultActiveFirstOption",
   "allowFreeInput",
+  "locale",
   "onChange",
   "onSelect",
   "onSearch"
@@ -41,15 +48,27 @@ var AutoComplete = (props) => {
     size = "md",
     disabled = false,
     clearable = false,
-    notFoundText = "No matches found",
+    notFoundText,
     filterOption = true,
     defaultActiveFirstOption = true,
+    allowFreeInput = true,
+    locale,
     className,
     onChange,
     onSelect,
     onSearch,
     ...rest
   } = props;
+  const config = useTigerConfig();
+  const mergedLocale = useMemo(
+    () => mergeTigerLocale(config.locale, locale),
+    [config.locale, locale]
+  );
+  const resolvedNotFoundText = resolveLocaleText(
+    "No matches found",
+    notFoundText,
+    mergedLocale?.common?.emptyText
+  );
   const divProps = {};
   for (const key of Object.keys(rest)) {
     if (!AUTOCOMPLETE_KEYS.has(key)) {
@@ -80,6 +99,23 @@ var AutoComplete = (props) => {
     setIsOpen(false);
     setActiveIndex(-1);
   }
+  function constrainToOption() {
+    if (allowFreeInput) return;
+    const match = options.find((o) => !o.disabled && o.label === inputValue);
+    if (match) {
+      if (String(match.value) !== String(value)) {
+        onChange?.(match.value);
+        onSelect?.(match.value, match);
+      }
+      return;
+    }
+    const current = options.find((o) => String(o.value) === String(value));
+    const revertLabel = current ? current.label : "";
+    if (revertLabel !== inputValue) {
+      setInputValue(revertLabel);
+      onChange?.(current ? current.value : "");
+    }
+  }
   function handleInput(e) {
     const val = e.target.value;
     setInputValue(val);
@@ -126,6 +162,9 @@ var AutoComplete = (props) => {
         e.preventDefault();
         if (activeIndex >= 0 && activeIndex < filteredOptions.length) {
           handleSelect(filteredOptions[activeIndex]);
+        } else {
+          constrainToOption();
+          closeDropdown();
         }
         break;
       case "Escape":
@@ -159,7 +198,8 @@ var AutoComplete = (props) => {
         autoComplete: "off",
         onChange: handleInput,
         onFocus: openDropdown,
-        onKeyDown: handleKeyDown
+        onKeyDown: handleKeyDown,
+        onBlur: constrainToOption
       }
     ),
     showClearButton && /* @__PURE__ */ jsx(
@@ -167,7 +207,7 @@ var AutoComplete = (props) => {
       {
         type: "button",
         className: "absolute right-2 top-1/2 -translate-y-1/2 text-[var(--tiger-autocomplete-clear,var(--tiger-text-muted,#9ca3af))] hover:text-[var(--tiger-autocomplete-clear-hover,var(--tiger-text,#111827))] transition-colors",
-        "aria-label": "Clear",
+        "aria-label": resolveLocaleText("Clear", mergedLocale?.common?.clearText),
         onClick: handleClear,
         children: /* @__PURE__ */ jsx(
           "svg",
@@ -194,13 +234,14 @@ var AutoComplete = (props) => {
           !!option.disabled,
           size
         ),
+        onMouseDown: (e) => e.preventDefault(),
         onClick: () => handleSelect(option),
         onMouseEnter: () => setActiveIndex(index),
         children: option.label
       },
       String(option.value)
     )) }),
-    isOpen && inputValue && filteredOptions.length === 0 && /* @__PURE__ */ jsx("div", { className: classNames(autoCompleteDropdownClasses, autoCompleteEmptyStateClasses), children: notFoundText })
+    isOpen && inputValue && filteredOptions.length === 0 && /* @__PURE__ */ jsx("div", { className: classNames(autoCompleteDropdownClasses, autoCompleteEmptyStateClasses), children: resolvedNotFoundText })
   ] });
 };
 

package/dist/{chunk-OTEM4FVX.mjs → chunk-WGKNAOW7.mjs}

@@ -1,5 +1,5 @@
 // src/components/FloatButton.tsx
-import { useState, useMemo, useCallback } from "react";
+import { createContext, useContext, useState, useMemo, useCallback } from "react";
 import ReactDOM from "react-dom";
 import {
   classNames,
@@ -12,8 +12,9 @@ import {
   floatButtonGroupClasses
 } from "@expcat/tigercat-core";
 import { jsx, jsxs } from "react/jsx-runtime";
+var FloatButtonGroupContext = createContext(null);
 var FloatButton = ({
-  shape = "circle",
+  shape,
   size = "md",
   type = "primary",
   tooltip,
@@ -24,16 +25,18 @@ var FloatButton = ({
   onClick,
   ...props
 }) => {
+  const group = useContext(FloatButtonGroupContext);
+  const resolvedShape = shape ?? group?.shape ?? "circle";
   const classes = useMemo(
     () => classNames(
       floatButtonBaseClasses,
-      floatButtonShapeClasses[shape],
+      floatButtonShapeClasses[resolvedShape],
       floatButtonSizeClasses[size],
       floatButtonTypeClasses[type],
       disabled && floatButtonDisabledClasses,
       className
     ),
-    [shape, size, type, disabled, className]
+    [resolvedShape, size, type, disabled, className]
   );
   return /* @__PURE__ */ jsx(
     "button",
@@ -50,7 +53,7 @@ var FloatButton = ({
   );
 };
 var FloatButtonGroup = ({
-  shape: _shape = "circle",
+  shape: groupShape,
   trigger = "click",
   open: controlledOpen,
   triggerNode,
@@ -59,6 +62,7 @@ var FloatButtonGroup = ({
   onOpenChange,
   ...props
 }) => {
+  const groupContextValue = useMemo(() => ({ shape: groupShape }), [groupShape]);
   const [internalOpen, setInternalOpen] = useState(false);
   const isOpen = controlledOpen ?? internalOpen;
   const toggle = useCallback(() => {
@@ -76,7 +80,7 @@ var FloatButtonGroup = ({
   }, [onOpenChange]);
   const groupClasses = useMemo(() => classNames(floatButtonGroupClasses, className), [className]);
   if (!isBrowser()) return null;
-  const content = /* @__PURE__ */ jsxs(
+  const content = /* @__PURE__ */ jsx(FloatButtonGroupContext.Provider, { value: groupContextValue, children: /* @__PURE__ */ jsxs(
     "div",
     {
       className: groupClasses,
@@ -88,7 +92,7 @@ var FloatButtonGroup = ({
         isOpen && children
       ]
     }
-  );
+  ) });
   return ReactDOM.createPortal(content, document.body);
 };
 

package/dist/chunk-WHYHLUXG.mjs

@@ -0,0 +1,25 @@
+// src/hooks/useControlledState.ts
+import { useCallback, useRef, useState } from "react";
+function useControlledState(controlledValue, defaultValue, onChange) {
+  const [internalValue, setInternalValue] = useState(defaultValue);
+  const isControlled = controlledValue !== void 0;
+  const value = isControlled ? controlledValue : internalValue;
+  const valueRef = useRef(value);
+  valueRef.current = value;
+  const isControlledRef = useRef(isControlled);
+  isControlledRef.current = isControlled;
+  const onChangeRef = useRef(onChange);
+  onChangeRef.current = onChange;
+  const setValue = useCallback((next, ...args) => {
+    const resolved = typeof next === "function" ? next(valueRef.current) : next;
+    if (!isControlledRef.current) {
+      setInternalValue(resolved);
+    }
+    onChangeRef.current?.(resolved, ...args);
+  }, []);
+  return [value, setValue];
+}
+
+export {
+  useControlledState
+};