@_tc/template-core 0.0.1-bate.2 → 0.0.1-bate.21

package/{packages → fe/packages}/ui/react/components/TableSearch/TableSearch.d.ts

@@ -5,24 +5,61 @@ import { type DropdownItem } from '../Dropdown';
 import type { FormFieldScheme } from '../Form';
 import type { SearchProps } from '../Search/Search';
 type TableSearchScheme<T> = MOmit<FormFieldScheme<T>, 'rules' | 'required'> & {
+    /**
+     * - 字段是否常驻
+     * - 如果都没有则去前四个
+     */
     isPermanent?: boolean;
 };
 type TableSearchProps<T> = MOmit<SearchProps<T>, 'children' | 'schemes'> & {
     onSearch?: (values: T) => void;
     onReset?: () => void;
     schemes: TableSearchScheme<T>[];
+    /**
+     * 导出Excel按钮的下拉菜单项
+     */
     exportMenuItems?: DropdownItem[];
     btnConfig?: Partial<{
+        /**
+         * 导出Excel按钮的文案
+         */
         export?: ReactNode;
+        /**
+         * 收起按钮的文案
+         */
         collapse?: ReactNode;
+        /**
+         * 展开按钮的icon
+         */
         expandIcon?: ReactNode;
+        /**
+         * 展开按钮的文案
+         */
         expand?: ReactNode;
+        /**
+         * 重置按钮的文案
+         */
         reset?: ReactNode;
+        /**
+         * 查询按钮的文案
+         */
         search?: ReactNode;
     }>;
+    /**
+     * 备选边界
+     */
     expandBoundaries?: number;
+    /**
+     *
+     * @param exportType 导出类型
+     * @param searchData 当前查询条件
+     * @returns
+     */
     onExport?: (exportType: ExportType, searchData: T) => void;
     additionalButtons?: ReactNode;
+    /**
+     * 默认是否展开 @default true
+     */
     defaultExpand?: boolean;
 };
 declare const TableSearch: <T extends object>(props: TableSearchProps<T>) => import("react/jsx-runtime").JSX.Element;

package/{packages → fe/packages}/ui/react/components/TableSearch/TableSearch.js

@@ -1,19 +1,17 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const jsx_runtime_1 = require("react/jsx-runtime");
-const export_1 = require("../../lib/export");
-const utils_1 = require("../../lib/utils");
-const lucide_react_1 = require("lucide-react");
-const react_1 = require("react");
-const Button_1 = require("../Button");
-const Dropdown_1 = require("../Dropdown");
-const Search_1 = require("../Search");
-const tableSearchLocaleStore_1 = require("./tableSearchLocaleStore");
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { ExportType } from '../../lib/export';
+import { cn } from '../../lib/utils';
+import { ChevronDown } from 'lucide-react';
+import { useMemo, useRef, useState } from 'react';
+import { Button } from '../Button';
+import { Dropdown } from '../Dropdown';
+import { Search } from '../Search';
+import { useTableSearchLocaleStore } from './tableSearchLocaleStore';
 const EXPAND_BOUNDARIES = 4;
 const TableSearch = (props) => {
     const { onSearch, onReset, exportMenuItems, btnConfig: PBtnText, expandBoundaries = EXPAND_BOUNDARIES, schemes, onExport, additionalButtons, defaultExpand = true, ...searchProps } = props;
-    const formRef = (0, react_1.useRef)(undefined);
-    const [isExpanded, setIsExpanded] = (0, react_1.useState)(defaultExpand);
+    const formRef = useRef(undefined);
+    const [isExpanded, setIsExpanded] = useState(defaultExpand);
     const handleSearch = () => {
         const values = formRef.current?.getFieldsValue();
         onSearch?.(values);
@@ -27,14 +25,14 @@ const TableSearch = (props) => {
     const handleExpand = () => {
         setIsExpanded(!isExpanded);
     };
-    const locale = (0, tableSearchLocaleStore_1.useTableSearchLocaleStore)((state) => state.locale);
-    const defaultExportItems = (0, react_1.useMemo)(() => exportMenuItems || [
+    const locale = useTableSearchLocaleStore((state) => state.locale);
+    const defaultExportItems = useMemo(() => exportMenuItems || [
         {
             key: 'export-current-page',
             label: locale.exportCurrentPage,
             onClick: () => {
                 const values = formRef.current?.getFieldsValue();
-                onExport?.(export_1.ExportType.current, values);
+                onExport?.(ExportType.current, values);
             },
         },
         {
@@ -42,17 +40,17 @@ const TableSearch = (props) => {
             label: locale.exportCurrentQuery,
             onClick: () => {
                 const values = formRef.current?.getFieldsValue();
-                onExport?.(export_1.ExportType.all, values);
+                onExport?.(ExportType.all, values);
             },
         },
     ], [exportMenuItems, locale.exportCurrentPage, locale.exportCurrentQuery, onExport]);
-    const btnConfig = (0, react_1.useMemo)(() => {
+    const btnConfig = useMemo(() => {
         const resetBtn = PBtnText?.reset || locale.reset;
         const searchBtn = PBtnText?.search || locale.search;
         const exportBtn = PBtnText?.export || locale.export;
         const expandBtn = PBtnText?.expand || locale.expand;
         const collapseBtn = PBtnText?.collapse || locale.collapse;
-        const expandIcon = PBtnText?.expandIcon || (0, jsx_runtime_1.jsx)(lucide_react_1.ChevronDown, { className: "h-4 w-4" });
+        const expandIcon = PBtnText?.expandIcon || _jsx(ChevronDown, { className: "h-4 w-4" });
         return {
             resetBtn,
             searchBtn,
@@ -70,7 +68,7 @@ const TableSearch = (props) => {
         PBtnText?.expandIcon,
         locale,
     ]);
-    const { permanentSchemes, alternativeSchemes } = (0, react_1.useMemo)(() => {
+    const { permanentSchemes, alternativeSchemes } = useMemo(() => {
         const alternativeSchemes = [];
         const tmp = [];
         for (let index = 0; index < schemes.length; index++) {
@@ -93,6 +91,7 @@ const TableSearch = (props) => {
     }, [expandBoundaries, schemes]);
     const showExpandedBtn = schemes.length > expandBoundaries;
     let SSchemes;
+    // 有展开
     if (showExpandedBtn) {
         SSchemes = isExpanded
             ? schemes
@@ -113,9 +112,8 @@ const TableSearch = (props) => {
     else {
         SSchemes = schemes;
     }
-    return ((0, jsx_runtime_1.jsxs)(Search_1.Search, { getForm: (form) => {
+    return (_jsxs(Search, { getForm: (form) => {
             formRef.current = form;
-        }, schemes: SSchemes, ...searchProps, children: [showExpandedBtn && ((0, jsx_runtime_1.jsx)(Button_1.Button, { variant: "default", size: "sm", onClick: handleExpand, rightIcon: (0, jsx_runtime_1.jsx)("span", { className: (0, utils_1.cn)('transition-transform duration-200', isExpanded && 'rotate-180'), children: btnConfig.expandIcon }), children: isExpanded ? btnConfig.collapseBtn : btnConfig.expandBtn }, "expandedBtn")), (0, jsx_runtime_1.jsx)(Button_1.Button, { variant: "primary", size: "sm", onClick: handleSearch, children: btnConfig.searchBtn }), (0, jsx_runtime_1.jsx)(Button_1.Button, { variant: "default", size: "sm", onClick: handleReset, children: btnConfig.resetBtn }), (0, jsx_runtime_1.jsx)(Dropdown_1.Dropdown, { items: defaultExportItems, placement: "bottom-end", children: (0, jsx_runtime_1.jsx)(Button_1.Button, { variant: "default", size: "sm", rightIcon: (0, jsx_runtime_1.jsx)(lucide_react_1.ChevronDown, { className: "h-4 w-4" }), children: btnConfig.exportBtn }) }), additionalButtons] }));
+        }, schemes: SSchemes, ...searchProps, children: [showExpandedBtn && (_jsx(Button, { variant: "default", size: "sm", onClick: handleExpand, rightIcon: _jsx("span", { className: cn('transition-transform duration-200', isExpanded && 'rotate-180'), children: btnConfig.expandIcon }), children: isExpanded ? btnConfig.collapseBtn : btnConfig.expandBtn }, "expandedBtn")), _jsx(Button, { variant: "primary", size: "sm", onClick: handleSearch, children: btnConfig.searchBtn }), _jsx(Button, { variant: "default", size: "sm", onClick: handleReset, children: btnConfig.resetBtn }), _jsx(Dropdown, { items: defaultExportItems, placement: "bottom-end", children: _jsx(Button, { variant: "default", size: "sm", rightIcon: _jsx(ChevronDown, { className: "h-4 w-4" }), children: btnConfig.exportBtn }) }), additionalButtons] }));
 };
-exports.default = TableSearch;
-//# sourceMappingURL=TableSearch.js.map
+export default TableSearch;

package/fe/packages/ui/react/components/TableSearch/index.js

@@ -0,0 +1 @@
+export { default as TableSearch } from './TableSearch';

package/fe/packages/ui/react/components/TableSearch/lang.js

@@ -0,0 +1,23 @@
+export const zhCNLocale = {
+    reset: '重置',
+    search: '查询',
+    export: '导出Excel',
+    expand: '展开',
+    collapse: '收起',
+    exportCurrentPage: '当前页',
+    exportCurrentQuery: '当前查询条件',
+};
+export const enUSLocale = {
+    reset: 'Reset',
+    search: 'Search',
+    export: 'Export Excel',
+    expand: 'Expand',
+    collapse: 'Collapse',
+    exportCurrentPage: 'Current Page',
+    exportCurrentQuery: 'Current Filters',
+};
+export const defaultLocale = zhCNLocale;
+export const btnConfig = defaultLocale;
+export const updateBtnConfig = (config) => {
+    Object.assign(btnConfig, config);
+};

package/fe/packages/ui/react/components/TableSearch/tableSearchLocaleStore.js

@@ -0,0 +1,11 @@
+import { create } from 'zustand';
+import { defaultLocale } from './lang';
+export const useTableSearchLocaleStore = create((set) => ({
+    locale: defaultLocale,
+    replaceLocale: (nextLocale) => set(() => ({
+        locale: nextLocale,
+    })),
+    resetLocale: () => set(() => ({
+        locale: defaultLocale,
+    })),
+}));

package/{packages → fe/packages}/ui/react/components/Textarea.d.ts

@@ -1,18 +1,58 @@
 import type { ChangeEvent, TextareaHTMLAttributes } from 'react';
 export type TextareaProps = Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, 'value' | 'onChange' | 'defaultValue'> & {
     value?: string;
+    /**
+     *
+     * @param v textarea value
+     * @param e changeEvent
+     */
     onChange?: (v: string, e: ChangeEvent<HTMLTextAreaElement>) => void;
+    /**
+     * 只有初始化时会使用
+     * 如果会改变请使用value
+     */
     defaultValue?: string;
+    /**
+     * 最大字符数限制
+     * @default 500
+     */
     maxLength?: number;
+    /**
+     * 是否显示字符计数器
+     * @default true
+     */
     showCount?: boolean;
+    /**
+     * 占位符文本
+     */
     placeholder?: string;
 };
 declare const Textarea: import("react").ForwardRefExoticComponent<Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, "defaultValue" | "onChange" | "value"> & {
     value?: string;
+    /**
+     *
+     * @param v textarea value
+     * @param e changeEvent
+     */
     onChange?: (v: string, e: ChangeEvent<HTMLTextAreaElement>) => void;
+    /**
+     * 只有初始化时会使用
+     * 如果会改变请使用value
+     */
     defaultValue?: string;
+    /**
+     * 最大字符数限制
+     * @default 500
+     */
     maxLength?: number;
+    /**
+     * 是否显示字符计数器
+     * @default true
+     */
     showCount?: boolean;
+    /**
+     * 占位符文本
+     */
     placeholder?: string;
 } & import("react").RefAttributes<HTMLTextAreaElement>>;
 export { Textarea };

package/fe/packages/ui/react/components/Textarea.js

@@ -0,0 +1,35 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { cn } from '../lib/utils';
+import { forwardRef, useCallback } from 'react';
+import { useInputController } from './hooks/useInputController';
+const Textarea = forwardRef(({ className, value: controlledValue, onChange, defaultValue, maxLength = 500, showCount = true, placeholder, disabled, ...props }, ref) => {
+    const { isFocused, setIsFocused, setInternalValue, setRefs, value, hasValue, isControlledRef, currentLength, } = useInputController({
+        controlledValue,
+        defaultValue,
+        ref,
+    });
+    const handleChange = useCallback((e) => {
+        const newValue = e.target.value;
+        // 如果设置了 maxLength，限制输入长度
+        if (maxLength && newValue.length > maxLength) {
+            return;
+        }
+        if (!isControlledRef.current) {
+            setInternalValue(newValue);
+        }
+        onChange?.(newValue, e);
+    }, [maxLength, isControlledRef, onChange, setInternalValue]);
+    return (_jsxs("div", { className: "relative w-full", children: [_jsx("textarea", { ref: setRefs, value: value, onChange: handleChange, maxLength: maxLength, placeholder: placeholder, className: cn('flex w-full rounded-lg px-4 py-3 text-sm', 'border transition-colors duration-200', 'placeholder:text-muted-foreground', 'focus:outline-none', 'resize-none', showCount && 'pb-10', disabled ? 'cursor-not-allowed bg-muted border-border text-muted-foreground' : 'bg-background', !disabled && !hasValue && !isFocused && 'border-border', !disabled && (hasValue || isFocused) && 'border-foreground', className), onFocus: (e) => {
+                    if (!disabled) {
+                        setIsFocused(true);
+                        props.onFocus?.(e);
+                    }
+                }, onBlur: (e) => {
+                    if (!disabled) {
+                        setIsFocused(false);
+                        props.onBlur?.(e);
+                    }
+                }, disabled: disabled, ...props }), showCount && (_jsxs("div", { className: cn('absolute bottom-3 right-4 text-xs text-muted-foreground', 'pointer-events-none'), children: [currentLength, "/", maxLength] }))] }));
+});
+Textarea.displayName = 'Textarea';
+export { Textarea };

package/{packages → fe/packages}/ui/react/components/Tooltip.d.ts

@@ -1,8 +1,24 @@
 export interface TooltipProps {
+    /**
+     * 提示内容
+     */
     content: React.ReactNode;
+    /**
+     * 触发元素
+     */
     children: React.ReactElement;
+    /**
+     * 提示位置
+     * @default 'right'
+     */
     placement?: 'top' | 'bottom' | 'left' | 'right';
+    /**
+     * 是否显示
+     */
     visible?: boolean;
+    /**
+     * 类名
+     */
     className?: string;
 }
 export declare function Tooltip({ content, children, placement, visible, className }: TooltipProps): import("react/jsx-runtime").JSX.Element;

package/{packages → fe/packages}/ui/react/components/Tooltip.js

@@ -1,15 +1,12 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Tooltip = Tooltip;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const utils_1 = require("../lib/utils");
-const react_1 = require("react");
-const react_dom_1 = require("react-dom");
-function Tooltip({ content, children, placement = 'right', visible, className }) {
-    const [isVisible, setIsVisible] = (0, react_1.useState)(false);
-    const [position, setPosition] = (0, react_1.useState)({ top: 0, left: 0 });
-    const triggerRef = (0, react_1.useRef)(null);
-    const tooltipRef = (0, react_1.useRef)(null);
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { cn } from '../lib/utils';
+import { useState, useRef, useEffect } from 'react';
+import { createPortal } from 'react-dom';
+export function Tooltip({ content, children, placement = 'right', visible, className }) {
+    const [isVisible, setIsVisible] = useState(false);
+    const [position, setPosition] = useState({ top: 0, left: 0 });
+    const triggerRef = useRef(null);
+    const tooltipRef = useRef(null);
     const showTooltip = () => {
         if (visible !== undefined) {
             setIsVisible(visible);
@@ -23,13 +20,14 @@ function Tooltip({ content, children, placement = 'right', visible, className })
             setIsVisible(false);
         }
     };
-    (0, react_1.useEffect)(() => {
+    useEffect(() => {
         if (visible !== undefined) {
             setIsVisible(visible);
         }
     }, [visible]);
-    (0, react_1.useEffect)(() => {
+    useEffect(() => {
         if (isVisible && triggerRef.current && tooltipRef.current) {
+            // 使用 requestAnimationFrame 确保 DOM 已更新
             requestAnimationFrame(() => {
                 if (!triggerRef.current || !tooltipRef.current)
                     return;
@@ -46,12 +44,15 @@ function Tooltip({ content, children, placement = 'right', visible, className })
                     case 'top':
                         top = triggerRect.top + scrollY - tooltipRect.height - padding;
                         left = triggerRect.left + scrollX + triggerRect.width / 2 - tooltipRect.width / 2;
+                        // 如果超出左边界，对齐到左边界
                         if (left < scrollX + padding) {
                             left = scrollX + padding;
                         }
+                        // 如果超出右边界，对齐到右边界
                         if (left + tooltipRect.width > scrollX + viewportWidth - padding) {
                             left = scrollX + viewportWidth - tooltipRect.width - padding;
                         }
+                        // 如果上方空间不够，改为下方显示
                         if (top < scrollY + padding) {
                             top = triggerRect.bottom + scrollY + padding;
                         }
@@ -59,12 +60,15 @@ function Tooltip({ content, children, placement = 'right', visible, className })
                     case 'bottom':
                         top = triggerRect.bottom + scrollY + padding;
                         left = triggerRect.left + scrollX + triggerRect.width / 2 - tooltipRect.width / 2;
+                        // 如果超出左边界，对齐到左边界
                         if (left < scrollX + padding) {
                             left = scrollX + padding;
                         }
+                        // 如果超出右边界，对齐到右边界
                         if (left + tooltipRect.width > scrollX + viewportWidth - padding) {
                             left = scrollX + viewportWidth - tooltipRect.width - padding;
                         }
+                        // 如果下方空间不够，改为上方显示
                         if (top + tooltipRect.height > scrollY + viewportHeight - padding) {
                             top = triggerRect.top + scrollY - tooltipRect.height - padding;
                         }
@@ -72,12 +76,15 @@ function Tooltip({ content, children, placement = 'right', visible, className })
                     case 'left':
                         top = triggerRect.top + scrollY + triggerRect.height / 2 - tooltipRect.height / 2;
                         left = triggerRect.left + scrollX - tooltipRect.width - padding;
+                        // 如果超出上边界，对齐到上边界
                         if (top < scrollY + padding) {
                             top = scrollY + padding;
                         }
+                        // 如果超出下边界，对齐到下边界
                         if (top + tooltipRect.height > scrollY + viewportHeight - padding) {
                             top = scrollY + viewportHeight - tooltipRect.height - padding;
                         }
+                        // 如果左侧空间不够，改为右侧显示
                         if (left < scrollX + padding) {
                             left = triggerRect.right + scrollX + padding;
                         }
@@ -85,12 +92,15 @@ function Tooltip({ content, children, placement = 'right', visible, className })
                     case 'right':
                         top = triggerRect.top + scrollY + triggerRect.height / 2 - tooltipRect.height / 2;
                         left = triggerRect.right + scrollX + padding;
+                        // 如果超出上边界，对齐到上边界
                         if (top < scrollY + padding) {
                             top = scrollY + padding;
                         }
+                        // 如果超出下边界，对齐到下边界
                         if (top + tooltipRect.height > scrollY + viewportHeight - padding) {
                             top = scrollY + viewportHeight - tooltipRect.height - padding;
                         }
+                        // 如果右侧空间不够，改为左侧显示
                         if (left + tooltipRect.width > scrollX + viewportWidth - padding) {
                             left = triggerRect.left + scrollX - tooltipRect.width - padding;
                         }
@@ -100,10 +110,9 @@ function Tooltip({ content, children, placement = 'right', visible, className })
             });
         }
     }, [isVisible, placement]);
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("div", { ref: triggerRef, onMouseEnter: showTooltip, onMouseLeave: hideTooltip, className: "inline-block", children: children }), isVisible &&
-                (0, react_dom_1.createPortal)((0, jsx_runtime_1.jsx)("div", { ref: tooltipRef, className: (0, utils_1.cn)('fixed z-[9999] px-3 py-2', 'bg-gray-800 text-white text-xs rounded', 'shadow-lg', 'pointer-events-none', 'max-w-xs', className), style: {
+    return (_jsxs(_Fragment, { children: [_jsx("div", { ref: triggerRef, onMouseEnter: showTooltip, onMouseLeave: hideTooltip, className: "inline-block", children: children }), isVisible &&
+                createPortal(_jsx("div", { ref: tooltipRef, className: cn('fixed z-[9999] px-3 py-2', 'bg-gray-800 text-white text-xs rounded', 'shadow-lg', 'pointer-events-none', 'max-w-xs', className), style: {
                         top: `${position.top}px`,
                         left: `${position.left}px`,
                     }, children: content }), document.body)] }));
 }
-//# sourceMappingURL=Tooltip.js.map

package/{packages → fe/packages}/ui/react/components/TreeSelect.d.ts

@@ -5,14 +5,20 @@ export interface TreeNode {
     children?: TreeNode[];
 }
 export interface TreeSelectProps {
+    /** 树形数据 */
     data: TreeNode[];
+    /** 已选中的节点 ID 数组 */
     value?: (string | number)[];
+    /** 选中状态改变回调，返回选中的 keys 和半选的 keys */
     onChange?: (keys: {
         checked: (string | number)[];
         indeterminate: (string | number)[];
     }) => void;
+    /** 节点文本字段名 */
     labelField?: 'name' | 'desctext';
+    /** 是否可以选择 */
     checkable?: boolean;
+    /** 自定义类名 */
     className?: string;
 }
 export declare function TreeSelect({ data, value, onChange, labelField, checkable, className, }: TreeSelectProps): import("react/jsx-runtime").JSX.Element;

package/{packages → fe/packages}/ui/react/components/TreeSelect.js

@@ -1,13 +1,10 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.TreeSelect = TreeSelect;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const utils_1 = require("../lib/utils");
-const lucide_react_1 = require("lucide-react");
-const react_1 = require("react");
-function TreeSelect({ data, value = [], onChange, labelField = 'name', checkable = true, className, }) {
-    const [expandedKeys, setExpandedKeys] = (0, react_1.useState)(new Set());
-    const { nodeMap, parentMap } = (0, react_1.useMemo)(() => {
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { cn } from '../lib/utils';
+import { Check, ChevronDown, ChevronRight } from 'lucide-react';
+import { useCallback, useMemo, useState } from 'react';
+export function TreeSelect({ data, value = [], onChange, labelField = 'name', checkable = true, className, }) {
+    const [expandedKeys, setExpandedKeys] = useState(new Set());
+    const { nodeMap, parentMap } = useMemo(() => {
         const nodeM = new Map();
         const parentM = new Map();
         const traverse = (nodes, parentId) => {
@@ -22,7 +19,8 @@ function TreeSelect({ data, value = [], onChange, labelField = 'name', checkable
         traverse(data, null);
         return { nodeMap: nodeM, parentMap: parentM };
     }, [data]);
-    const getDescendantIds = (0, react_1.useCallback)((node) => {
+    // 获取节点的所有子节点 ID
+    const getDescendantIds = useCallback((node) => {
         const ids = [];
         const traverse = (n) => {
             if (n.children && n.children.length > 0) {
@@ -35,7 +33,7 @@ function TreeSelect({ data, value = [], onChange, labelField = 'name', checkable
         traverse(node);
         return ids;
     }, []);
-    const updateParentSelection = (0, react_1.useCallback)((checkedSet) => {
+    const updateParentSelection = useCallback((checkedSet) => {
         const traverseUp = (nodeId) => {
             const parentId = parentMap.get(nodeId);
             if (parentId === undefined || parentId === null)
@@ -55,7 +53,8 @@ function TreeSelect({ data, value = [], onChange, labelField = 'name', checkable
         };
         checkedSet.forEach((id) => traverseUp(id));
     }, [nodeMap, parentMap]);
-    const toggleExpand = (0, react_1.useCallback)((nodeId) => {
+    // 切换展开/折叠
+    const toggleExpand = useCallback((nodeId) => {
         setExpandedKeys((prev) => {
             const newSet = new Set(prev);
             if (newSet.has(nodeId)) {
@@ -67,7 +66,7 @@ function TreeSelect({ data, value = [], onChange, labelField = 'name', checkable
             return newSet;
         });
     }, []);
-    const getIndeterminateKeys = (0, react_1.useCallback)((checkedSet) => {
+    const getIndeterminateKeys = useCallback((checkedSet) => {
         const indeterminateKeys = [];
         const getDescendantCount = (node) => {
             if (!node.children || node.children.length === 0) {
@@ -92,7 +91,8 @@ function TreeSelect({ data, value = [], onChange, labelField = 'name', checkable
         traverse(data);
         return indeterminateKeys;
     }, [data]);
-    const toggleCheck = (0, react_1.useCallback)((node) => {
+    // 切换选中状态
+    const toggleCheck = useCallback((node) => {
         if (!checkable || !onChange)
             return;
         const isChecked = value.includes(node.id);
@@ -110,10 +110,11 @@ function TreeSelect({ data, value = [], onChange, labelField = 'name', checkable
         const indeterminateKeys = getIndeterminateKeys(nextChecked);
         onChange({ checked: Array.from(nextChecked), indeterminate: indeterminateKeys });
     }, [value, onChange, checkable, getDescendantIds, updateParentSelection, getIndeterminateKeys]);
-    const isNodeChecked = (0, react_1.useCallback)((nodeId) => {
+    // 判断节点是否选中
+    const isNodeChecked = useCallback((nodeId) => {
         return value.includes(nodeId);
     }, [value]);
-    const isNodeIndeterminate = (0, react_1.useCallback)((node) => {
+    const isNodeIndeterminate = useCallback((node) => {
         if (!node.children || node.children.length === 0)
             return false;
         const getDescendantCount = (n) => {
@@ -128,33 +129,34 @@ function TreeSelect({ data, value = [], onChange, labelField = 'name', checkable
         const { total, checked } = getDescendantCount(node);
         return checked > 0 && checked < total;
     }, [value]);
+    // 渲染树节点
     function renderTreeNode(node, level = 0) {
         const hasChildren = node.children && node.children.length > 0;
         const isExpanded = expandedKeys.has(node.id);
         const isChecked = isNodeChecked(node.id);
         const isIndeterminate = isNodeIndeterminate(node);
-        return ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsxs)("div", { className: (0, utils_1.cn)('flex items-center gap-2 py-2 px-2 hover:bg-muted/50 rounded-md cursor-pointer transition-colors', 'group'), style: { paddingLeft: `${level * 20 + 8}px` }, children: [hasChildren ? ((0, jsx_runtime_1.jsx)("button", { type: "button", onClick: (e) => {
+        return (_jsxs("div", { children: [_jsxs("div", { className: cn('flex items-center gap-2 py-2 px-2 hover:bg-muted/50 rounded-md cursor-pointer transition-colors', 'group'), style: { paddingLeft: `${level * 20 + 8}px` }, children: [hasChildren ? (_jsx("button", { type: "button", onClick: (e) => {
                                 e.stopPropagation();
                                 toggleExpand(node.id);
-                            }, className: "flex-shrink-0 p-0.5 hover:bg-muted rounded", children: isExpanded ? (0, jsx_runtime_1.jsx)(lucide_react_1.ChevronDown, { className: "h-4 w-4" }) : (0, jsx_runtime_1.jsx)(lucide_react_1.ChevronRight, { className: "h-4 w-4" }) })) : ((0, jsx_runtime_1.jsx)("span", { className: "w-5" })), checkable && ((0, jsx_runtime_1.jsx)("button", { type: "button", onClick: (e) => {
+                            }, className: "flex-shrink-0 p-0.5 hover:bg-muted rounded", children: isExpanded ? _jsx(ChevronDown, { className: "h-4 w-4" }) : _jsx(ChevronRight, { className: "h-4 w-4" }) })) : (_jsx("span", { className: "w-5" })), checkable && (_jsx("button", { type: "button", onClick: (e) => {
                                 e.stopPropagation();
                                 toggleCheck(node);
-                            }, className: (0, utils_1.cn)('flex-shrink-0 w-4 h-4 rounded border-2 flex items-center justify-center transition-colors', isChecked
+                            }, className: cn('flex-shrink-0 w-4 h-4 rounded border-2 flex items-center justify-center transition-colors', isChecked
                                 ? 'bg-black border-black'
                                 : isIndeterminate
                                     ? 'bg-gray-400 border-gray-400'
-                                    : 'border-border hover:border-foreground'), children: (isChecked || isIndeterminate) && (0, jsx_runtime_1.jsx)(lucide_react_1.Check, { className: "h-3 w-3 text-white", strokeWidth: 3 }) })), (0, jsx_runtime_1.jsx)("span", { className: "flex-1 text-sm select-none", onClick: () => {
+                                    : 'border-border hover:border-foreground'), children: (isChecked || isIndeterminate) && _jsx(Check, { className: "h-3 w-3 text-white", strokeWidth: 3 }) })), _jsx("span", { className: "flex-1 text-sm select-none", onClick: () => {
                                 if (hasChildren) {
                                     toggleExpand(node.id);
                                 }
                                 else {
                                     toggleCheck(node);
                                 }
-                            }, children: labelField === 'desctext' ? node.desctext || node.name : node.name })] }), hasChildren && isExpanded && (0, jsx_runtime_1.jsx)("div", { children: node.children.map((child) => renderTreeNode(child, level + 1)) })] }, node.id));
+                            }, children: labelField === 'desctext' ? node.desctext || node.name : node.name })] }), hasChildren && isExpanded && _jsx("div", { children: node.children.map((child) => renderTreeNode(child, level + 1)) })] }, node.id));
     }
+    // 如果没有数据
     if (!data || data.length === 0) {
-        return (0, jsx_runtime_1.jsx)("div", { className: (0, utils_1.cn)('p-8 text-center text-sm text-muted-foreground', className), children: "No data" });
+        return _jsx("div", { className: cn('p-8 text-center text-sm text-muted-foreground', className), children: "No data" });
     }
-    return ((0, jsx_runtime_1.jsx)("div", { className: (0, utils_1.cn)('border border-border rounded-lg p-2 max-h-[400px] overflow-y-auto', className), children: data.map((node) => renderTreeNode(node)) }));
+    return (_jsx("div", { className: cn('border border-border rounded-lg p-2 max-h-[400px] overflow-y-auto', className), children: data.map((node) => renderTreeNode(node)) }));
 }
-//# sourceMappingURL=TreeSelect.js.map