@apdesign/web-react 1.5.1 → 1.6.0

package/es/Button/index.d.ts

@@ -2,12 +2,12 @@ import React from 'react';
 import Group from './group';
 import { ButtonProps } from './interface';
 declare const ButtonComponent: React.ForwardRefExoticComponent<Partial<{
-    htmlType?: "button" | "reset" | "submit";
-} & import("./interface").BaseButtonProps & Omit<React.ButtonHTMLAttributes<any>, "className" | "onClick" | "type"> & {
+    htmlType?: "button" | "submit" | "reset";
+} & import("./interface").BaseButtonProps & Omit<React.ButtonHTMLAttributes<any>, "className" | "type" | "onClick"> & {
     href: string;
     target?: string;
     anchorProps?: React.HTMLProps<HTMLAnchorElement>;
-} & Omit<React.AnchorHTMLAttributes<any>, "className" | "onClick" | "type">> & React.RefAttributes<unknown>> & {
+} & Omit<React.AnchorHTMLAttributes<any>, "className" | "type" | "onClick">> & React.RefAttributes<unknown>> & {
     __BYTE_BUTTON: boolean;
     Group: typeof Group;
 };

package/es/TreeSelect/interface.d.ts

@@ -14,6 +14,12 @@ export declare type LabelValue = {
  * @title TreeSelect
  */
 export interface TreeSelectProps extends SelectViewCommonProps {
+    /**
+     * @zh 是否允许拼音搜索（仅在 showSearch 开启时生效）
+     * @en Whether to enable pinyin search (only works when showSearch is enabled)
+     * @defaultValue false
+     */
+    allowPYSearch?: boolean;
     /**
      * @zh 是否多选
      * @en Whether to select multiple

package/es/TreeSelect/tree-select.js

@@ -72,6 +72,7 @@ var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
 };
 import React, { forwardRef, useContext, useEffect, useRef, useState, useImperativeHandle, useMemo, useCallback, } from 'react';
 import debounce from 'lodash/debounce';
+import PinyinMatch from 'pinyin-match';
 import useStateValue, { getInitCheckKeys, parseValue } from './hook/useStateValue';
 import { normalizeValueToArray } from './utils';
 import { isArray, isFunction, isNullOrUndefined, isObject } from '../_util/is';
@@ -91,6 +92,27 @@ import useIsFirstRender from '../_util/hooks/useIsFirstRender';
 import useId from '../_util/hooks/useId';
 import Button from '../Button';
 import Checkbox from '../Checkbox';
+/** 与 value/_key 子串匹配，或在开启拼音时按 title（或 value）做拼音匹配 */
+function matchNodeByTextAndPinyin(nodeProps, inputText, allowPYSearch) {
+    var text = nodeProps.value || nodeProps._key;
+    if (text && text.indexOf(inputText) > -1) {
+        return true;
+    }
+    if (!allowPYSearch) {
+        return false;
+    }
+    var displayText = typeof nodeProps.title === 'string' || typeof nodeProps.title === 'number'
+        ? String(nodeProps.title)
+        : typeof text === 'string' || typeof text === 'number'
+            ? String(text)
+            : '';
+    try {
+        return !!PinyinMatch.match(displayText, String(inputText || ''));
+    }
+    catch (_a) {
+        return false;
+    }
+}
 function isEmptyValue(value) {
     return (!value ||
         (isArray(value) && value.length === 0) ||
@@ -131,6 +153,7 @@ var TreeSelect = function (baseProps, ref) {
     var _f = __read(useStateValue(props, key2nodeProps, indeterminateKeys), 5), value = _f[0], setValue = _f[1], realValue = _f[2], confirmSetValue = _f[3], cancelSetValue = _f[4];
     var prefixCls = getPrefixCls('tree-select');
     var isFilterNode = inputValue && !isFunction(props.onSearch);
+    var allowPYSearchEnabled = !!props.allowPYSearch && !!props.showSearch;
     // Unique ID of this select instance
     var instancePopupID = useId(prefixCls + "-popup-");
     var tryUpdatePopupVisible = function (visible) {
@@ -172,16 +195,17 @@ var TreeSelect = function (baseProps, ref) {
                             var nodeProps = key2nodeProps[key];
                             var isHit = false;
                             if (isFunction(props.filterTreeNode)) {
+                                // Keep historical behavior: user errors should throw.
                                 // @ts-ignore
                                 if (props.filterTreeNode(inputText, React.createElement(Tree.Node, __assign({}, nodeProps)))) {
                                     isHit = true;
                                 }
+                                else if (allowPYSearchEnabled) {
+                                    isHit = matchNodeByTextAndPinyin(nodeProps, inputText, true);
+                                }
                             }
                             else {
-                                var text = nodeProps.value || nodeProps._key;
-                                if (text && text.indexOf(inputText) > -1) {
-                                    isHit = true;
-                                }
+                                isHit = matchNodeByTextAndPinyin(nodeProps, inputText, allowPYSearchEnabled);
                             }
                             if (isHit) {
                                 hitKeys.add(nodeProps.key);
@@ -193,7 +217,7 @@ var TreeSelect = function (baseProps, ref) {
             });
         }); }, 100);
         return search(inputText);
-    }, [props.onSearch, treeData, key2nodeProps, props.filterTreeNode]);
+    }, [props.onSearch, treeData, key2nodeProps, props.filterTreeNode, allowPYSearchEnabled]);
     var resetInputValue = useCallback(function () {
         // 多选选中值时候不清除搜索文本
         var retainInputValueWhileSelect = true;

package/es/_util/constant.d.ts

@@ -1,3 +1,3 @@
 export declare const NOOP: () => void;
 export declare function newArray(length: number): any;
-export declare function pickTriggerPropsFromRest(rest: any): Pick<any, "onFocus" | "onBlur" | "onClick" | "tabIndex" | "onContextMenu" | "onMouseEnter" | "onMouseLeave" | "onMouseMove">;
+export declare function pickTriggerPropsFromRest(rest: any): Pick<any, "onClick" | "onFocus" | "onBlur" | "tabIndex" | "onContextMenu" | "onMouseEnter" | "onMouseLeave" | "onMouseMove">;

package/es/index.d.ts

@@ -139,4 +139,4 @@ export type { WatermarkProps } from './Watermark/interface';
 export { default as Watermark } from './Watermark';
 export type { ImageProps, ImagePreviewProps, ImagePreviewActionProps, ImagePreviewGroupProps } from './Image/interface';
 export { default as Image } from './Image';
-export declare const version = "1.5.1";
+export declare const version = "1.6.0";

package/es/index.js

@@ -69,4 +69,4 @@ export { default as Upload } from './Upload';
 export { default as Mentions } from './Mentions';
 export { default as Watermark } from './Watermark';
 export { default as Image } from './Image';
-export var version = '1.5.1';
+export var version = '1.6.0';

package/lib/TreeSelect/interface.d.ts

@@ -14,6 +14,12 @@ export declare type LabelValue = {
  * @title TreeSelect
  */
 export interface TreeSelectProps extends SelectViewCommonProps {
+    /**
+     * @zh 是否允许拼音搜索（仅在 showSearch 开启时生效）
+     * @en Whether to enable pinyin search (only works when showSearch is enabled)
+     * @defaultValue false
+     */
+    allowPYSearch?: boolean;
     /**
      * @zh 是否多选
      * @en Whether to select multiple

package/lib/TreeSelect/tree-select.js

@@ -96,6 +96,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 var react_1 = __importStar(require("react"));
 var debounce_1 = __importDefault(require("lodash/debounce"));
+var pinyin_match_1 = __importDefault(require("pinyin-match"));
 var useStateValue_1 = __importStar(require("./hook/useStateValue"));
 var utils_1 = require("./utils");
 var is_1 = require("../_util/is");
@@ -115,6 +116,27 @@ var useIsFirstRender_1 = __importDefault(require("../_util/hooks/useIsFirstRende
 var useId_1 = __importDefault(require("../_util/hooks/useId"));
 var Button_1 = __importDefault(require("../Button"));
 var Checkbox_1 = __importDefault(require("../Checkbox"));
+/** 与 value/_key 子串匹配，或在开启拼音时按 title（或 value）做拼音匹配 */
+function matchNodeByTextAndPinyin(nodeProps, inputText, allowPYSearch) {
+    var text = nodeProps.value || nodeProps._key;
+    if (text && text.indexOf(inputText) > -1) {
+        return true;
+    }
+    if (!allowPYSearch) {
+        return false;
+    }
+    var displayText = typeof nodeProps.title === 'string' || typeof nodeProps.title === 'number'
+        ? String(nodeProps.title)
+        : typeof text === 'string' || typeof text === 'number'
+            ? String(text)
+            : '';
+    try {
+        return !!pinyin_match_1.default.match(displayText, String(inputText || ''));
+    }
+    catch (_a) {
+        return false;
+    }
+}
 function isEmptyValue(value) {
     return (!value ||
         ((0, is_1.isArray)(value) && value.length === 0) ||
@@ -155,6 +177,7 @@ var TreeSelect = function (baseProps, ref) {
     var _f = __read((0, useStateValue_1.default)(props, key2nodeProps, indeterminateKeys), 5), value = _f[0], setValue = _f[1], realValue = _f[2], confirmSetValue = _f[3], cancelSetValue = _f[4];
     var prefixCls = getPrefixCls('tree-select');
     var isFilterNode = inputValue && !(0, is_1.isFunction)(props.onSearch);
+    var allowPYSearchEnabled = !!props.allowPYSearch && !!props.showSearch;
     // Unique ID of this select instance
     var instancePopupID = (0, useId_1.default)(prefixCls + "-popup-");
     var tryUpdatePopupVisible = function (visible) {
@@ -196,16 +219,17 @@ var TreeSelect = function (baseProps, ref) {
                             var nodeProps = key2nodeProps[key];
                             var isHit = false;
                             if ((0, is_1.isFunction)(props.filterTreeNode)) {
+                                // Keep historical behavior: user errors should throw.
                                 // @ts-ignore
                                 if (props.filterTreeNode(inputText, react_1.default.createElement(Tree_1.default.Node, __assign({}, nodeProps)))) {
                                     isHit = true;
                                 }
+                                else if (allowPYSearchEnabled) {
+                                    isHit = matchNodeByTextAndPinyin(nodeProps, inputText, true);
+                                }
                             }
                             else {
-                                var text = nodeProps.value || nodeProps._key;
-                                if (text && text.indexOf(inputText) > -1) {
-                                    isHit = true;
-                                }
+                                isHit = matchNodeByTextAndPinyin(nodeProps, inputText, allowPYSearchEnabled);
                             }
                             if (isHit) {
                                 hitKeys.add(nodeProps.key);
@@ -217,7 +241,7 @@ var TreeSelect = function (baseProps, ref) {
             });
         }); }, 100);
         return search(inputText);
-    }, [props.onSearch, treeData, key2nodeProps, props.filterTreeNode]);
+    }, [props.onSearch, treeData, key2nodeProps, props.filterTreeNode, allowPYSearchEnabled]);
     var resetInputValue = (0, react_1.useCallback)(function () {
         // 多选选中值时候不清除搜索文本
         var retainInputValueWhileSelect = true;

package/lib/index.d.ts

@@ -139,4 +139,4 @@ export type { WatermarkProps } from './Watermark/interface';
 export { default as Watermark } from './Watermark';
 export type { ImageProps, ImagePreviewProps, ImagePreviewActionProps, ImagePreviewGroupProps } from './Image/interface';
 export { default as Image } from './Image';
-export declare const version = "1.5.1";
+export declare const version = "1.6.0";

package/lib/index.js

@@ -147,4 +147,4 @@ var Watermark_1 = require("./Watermark");
 Object.defineProperty(exports, "Watermark", { enumerable: true, get: function () { return __importDefault(Watermark_1).default; } });
 var Image_1 = require("./Image");
 Object.defineProperty(exports, "Image", { enumerable: true, get: function () { return __importDefault(Image_1).default; } });
-exports.version = '1.5.1';
+exports.version = '1.6.0';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@apdesign/web-react",
-  "version": "1.5.1",
+  "version": "1.6.0",
   "description": "AP Design React UI Library.",
   "module": "./es/index.js",
   "main": "./lib/index.js",
@@ -126,6 +126,7 @@
     "dayjs": "^1.10.5",
     "lodash": "^4.17.21",
     "number-precision": "^1.3.1",
+    "pinyin-match": "^1.2.10",
     "react-draggable": "^4.4.6",
     "react-focus-lock": "^2.12.1",
     "react-is": "^18.2.0",