@pisell/utils 1.0.68 → 1.0.71
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +2 -2
- package/es/arrayUtils.d.ts +1 -1
- package/es/common/index.d.ts +5 -5
- package/es/common/index.js +2 -2
- package/es/common/stateHelper.d.ts +18 -18
- package/es/common/stateHelper.js +15 -15
- package/es/common/types.d.ts +28 -28
- package/es/componentStorage.d.ts +36 -36
- package/es/componentStorage.js +7 -7
- package/es/constants/index.d.ts +7 -7
- package/es/date.d.ts +28 -28
- package/es/date.js +22 -22
- package/es/document.d.ts +13 -13
- package/es/document.js +7 -7
- package/es/escPosPrinter/index.d.ts +9 -9
- package/es/firebase/config/index.d.ts +13 -13
- package/es/firebase/index.d.ts +28 -28
- package/es/format.d.ts +28 -28
- package/es/format.js +14 -14
- package/es/image.d.ts +11 -11
- package/es/image.js +5 -5
- package/es/index.d.ts +25 -25
- package/es/jsBridge/index.d.ts +22 -22
- package/es/jsBridge/index.js +15 -15
- package/es/jsBridge/regDeviceApi.d.ts +15 -15
- package/es/jsBridge/regDeviceApi.js +3 -3
- package/es/jsBridge/types.d.ts +149 -149
- package/es/locales.d.ts +9 -9
- package/es/locales.js +40 -21
- package/es/log.d.ts +10 -10
- package/es/miniRedux.d.ts +16 -16
- package/es/number-input/hooks/index.d.ts +4 -4
- package/es/number-input/hooks/index.js +2 -2
- package/es/number-input/hooks/useNumberInputState.d.ts +25 -25
- package/es/number-input/hooks/useNumberInputState.js +39 -39
- package/es/number-input/index.d.ts +14 -14
- package/es/number-input/index.js +8 -8
- package/es/number-input/types.d.ts +96 -96
- package/es/number-input/utils/formatter.d.ts +53 -53
- package/es/number-input/utils/formatter.js +37 -37
- package/es/number-input/utils/index.d.ts +7 -7
- package/es/number-input/utils/index.js +2 -2
- package/es/number-input/utils/validation.d.ts +27 -27
- package/es/number-input/utils/validation.js +24 -24
- package/es/otherUtils.d.ts +48 -48
- package/es/otherUtils.js +32 -32
- package/es/platform.d.ts +9 -9
- package/es/select/hooks/index.d.ts +5 -5
- package/es/select/hooks/index.js +2 -2
- package/es/select/hooks/useDebouncedSearch.d.ts +20 -20
- package/es/select/hooks/useDebouncedSearch.js +17 -17
- package/es/select/hooks/useSelectState.d.ts +19 -19
- package/es/select/hooks/useSelectState.js +13 -13
- package/es/select/index.d.ts +8 -8
- package/es/select/index.js +3 -3
- package/es/select/types.d.ts +256 -256
- package/es/select/utils/filterOptions.d.ts +22 -22
- package/es/select/utils/filterOptions.js +16 -16
- package/es/select/utils/helpers.d.ts +42 -42
- package/es/select/utils/helpers.js +30 -30
- package/es/select/utils/index.d.ts +7 -7
- package/es/select/utils/index.js +2 -2
- package/es/select/utils/sortOptions.d.ts +12 -12
- package/es/select/utils/sortOptions.js +8 -8
- package/es/select/utils/tagAggregation.d.ts +25 -25
- package/es/select/utils/tagAggregation.js +21 -21
- package/es/text-input/hooks/index.d.ts +4 -4
- package/es/text-input/hooks/index.js +2 -2
- package/es/text-input/hooks/useTextInputState.d.ts +24 -24
- package/es/text-input/hooks/useTextInputState.js +38 -38
- package/es/text-input/index.d.ts +14 -14
- package/es/text-input/index.js +9 -9
- package/es/text-input/types.d.ts +56 -56
- package/es/text-input/utils/index.d.ts +5 -5
- package/es/text-input/utils/index.js +2 -2
- package/es/text-input/utils/validation.d.ts +23 -23
- package/es/text-input/utils/validation.js +20 -20
- package/es/typeUtils.d.ts +42 -42
- package/es/typeUtils.js +26 -26
- package/es/walletValidity.d.ts +44 -44
- package/es/walletValidity.js +85 -85
- package/lib/arrayUtils.d.ts +1 -1
- package/lib/common/index.d.ts +5 -5
- package/lib/common/stateHelper.d.ts +18 -18
- package/lib/common/types.d.ts +28 -28
- package/lib/componentStorage.d.ts +36 -36
- package/lib/constants/index.d.ts +7 -7
- package/lib/date.d.ts +28 -28
- package/lib/document.d.ts +13 -13
- package/lib/escPosPrinter/index.d.ts +9 -9
- package/lib/firebase/config/index.d.ts +13 -13
- package/lib/firebase/index.d.ts +28 -28
- package/lib/format.d.ts +28 -28
- package/lib/image.d.ts +11 -11
- package/lib/index.d.ts +25 -25
- package/lib/jsBridge/index.d.ts +22 -22
- package/lib/jsBridge/regDeviceApi.d.ts +15 -15
- package/lib/jsBridge/types.d.ts +149 -149
- package/lib/locales.d.ts +9 -9
- package/lib/locales.js +25 -6
- package/lib/log.d.ts +10 -10
- package/lib/miniRedux.d.ts +16 -16
- package/lib/number-input/hooks/index.d.ts +4 -4
- package/lib/number-input/hooks/useNumberInputState.d.ts +25 -25
- package/lib/number-input/index.d.ts +14 -14
- package/lib/number-input/types.d.ts +96 -96
- package/lib/number-input/utils/formatter.d.ts +53 -53
- package/lib/number-input/utils/index.d.ts +7 -7
- package/lib/number-input/utils/validation.d.ts +27 -27
- package/lib/otherUtils.d.ts +48 -48
- package/lib/platform.d.ts +9 -9
- package/lib/select/hooks/index.d.ts +5 -5
- package/lib/select/hooks/useDebouncedSearch.d.ts +20 -20
- package/lib/select/hooks/useSelectState.d.ts +19 -19
- package/lib/select/index.d.ts +8 -8
- package/lib/select/types.d.ts +256 -256
- package/lib/select/utils/filterOptions.d.ts +22 -22
- package/lib/select/utils/helpers.d.ts +42 -42
- package/lib/select/utils/index.d.ts +7 -7
- package/lib/select/utils/sortOptions.d.ts +12 -12
- package/lib/select/utils/tagAggregation.d.ts +25 -25
- package/lib/text-input/hooks/index.d.ts +4 -4
- package/lib/text-input/hooks/useTextInputState.d.ts +24 -24
- package/lib/text-input/index.d.ts +14 -14
- package/lib/text-input/types.d.ts +56 -56
- package/lib/text-input/utils/index.d.ts +5 -5
- package/lib/text-input/utils/validation.d.ts +23 -23
- package/lib/typeUtils.d.ts +42 -42
- package/lib/walletValidity.d.ts +44 -44
- package/package.json +1 -1
|
@@ -1,13 +1,13 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Select 组件辅助函数
|
|
1
|
+
/**
|
|
2
|
+
* Select 组件辅助函数
|
|
3
3
|
*/
|
|
4
4
|
|
|
5
|
-
/**
|
|
6
|
-
* 根据值查找选项对象
|
|
7
|
-
* @template T 选项值的类型
|
|
8
|
-
* @param value 选项值
|
|
9
|
-
* @param options 选项列表
|
|
10
|
-
* @returns 找到的选项对象,如果没找到返回 undefined
|
|
5
|
+
/**
|
|
6
|
+
* 根据值查找选项对象
|
|
7
|
+
* @template T 选项值的类型
|
|
8
|
+
* @param value 选项值
|
|
9
|
+
* @param options 选项列表
|
|
10
|
+
* @returns 找到的选项对象,如果没找到返回 undefined
|
|
11
11
|
*/
|
|
12
12
|
export function findOptionByValue(value, options) {
|
|
13
13
|
return options.find(function (opt) {
|
|
@@ -15,12 +15,12 @@ export function findOptionByValue(value, options) {
|
|
|
15
15
|
});
|
|
16
16
|
}
|
|
17
17
|
|
|
18
|
-
/**
|
|
19
|
-
* 根据值数组查找选项对象数组
|
|
20
|
-
* @template T 选项值的类型
|
|
21
|
-
* @param values 选项值数组
|
|
22
|
-
* @param options 选项列表
|
|
23
|
-
* @returns 找到的选项对象数组
|
|
18
|
+
/**
|
|
19
|
+
* 根据值数组查找选项对象数组
|
|
20
|
+
* @template T 选项值的类型
|
|
21
|
+
* @param values 选项值数组
|
|
22
|
+
* @param options 选项列表
|
|
23
|
+
* @returns 找到的选项对象数组
|
|
24
24
|
*/
|
|
25
25
|
export function findOptionsByValues(values, options) {
|
|
26
26
|
return values.map(function (val) {
|
|
@@ -28,32 +28,32 @@ export function findOptionsByValues(values, options) {
|
|
|
28
28
|
}).filter(Boolean);
|
|
29
29
|
}
|
|
30
30
|
|
|
31
|
-
/**
|
|
32
|
-
* 判断选项是否被选中(单选)
|
|
33
|
-
* @template T 选项值的类型
|
|
34
|
-
* @param optionValue 选项值
|
|
35
|
-
* @param selectedValue 当前选中值
|
|
36
|
-
* @returns 是否选中
|
|
31
|
+
/**
|
|
32
|
+
* 判断选项是否被选中(单选)
|
|
33
|
+
* @template T 选项值的类型
|
|
34
|
+
* @param optionValue 选项值
|
|
35
|
+
* @param selectedValue 当前选中值
|
|
36
|
+
* @returns 是否选中
|
|
37
37
|
*/
|
|
38
38
|
export function isOptionSelected(optionValue, selectedValue) {
|
|
39
39
|
return selectedValue !== null && selectedValue !== undefined && optionValue === selectedValue;
|
|
40
40
|
}
|
|
41
41
|
|
|
42
|
-
/**
|
|
43
|
-
* 判断选项是否被选中(多选)
|
|
44
|
-
* @template T 选项值的类型
|
|
45
|
-
* @param optionValue 选项值
|
|
46
|
-
* @param selectedValues 当前选中值数组
|
|
47
|
-
* @returns 是否选中
|
|
42
|
+
/**
|
|
43
|
+
* 判断选项是否被选中(多选)
|
|
44
|
+
* @template T 选项值的类型
|
|
45
|
+
* @param optionValue 选项值
|
|
46
|
+
* @param selectedValues 当前选中值数组
|
|
47
|
+
* @returns 是否选中
|
|
48
48
|
*/
|
|
49
49
|
export function isOptionSelectedInMultiple(optionValue, selectedValues) {
|
|
50
50
|
return selectedValues.includes(optionValue);
|
|
51
51
|
}
|
|
52
52
|
|
|
53
|
-
/**
|
|
54
|
-
* 生成唯一 ID
|
|
55
|
-
* @param prefix ID 前缀
|
|
56
|
-
* @returns 唯一 ID
|
|
53
|
+
/**
|
|
54
|
+
* 生成唯一 ID
|
|
55
|
+
* @param prefix ID 前缀
|
|
56
|
+
* @returns 唯一 ID
|
|
57
57
|
*/
|
|
58
58
|
export function generateId() {
|
|
59
59
|
var prefix = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'select';
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Select 工具函数导出
|
|
3
|
-
*/
|
|
4
|
-
export { calculateTagDisplay } from './tagAggregation';
|
|
5
|
-
export { filterOptions, defaultFilterOption } from './filterOptions';
|
|
6
|
-
export { sortOptions } from './sortOptions';
|
|
7
|
-
export { findOptionByValue, findOptionsByValues, isOptionSelected, isOptionSelectedInMultiple, generateId, } from './helpers';
|
|
1
|
+
/**
|
|
2
|
+
* Select 工具函数导出
|
|
3
|
+
*/
|
|
4
|
+
export { calculateTagDisplay } from './tagAggregation';
|
|
5
|
+
export { filterOptions, defaultFilterOption } from './filterOptions';
|
|
6
|
+
export { sortOptions } from './sortOptions';
|
|
7
|
+
export { findOptionByValue, findOptionsByValues, isOptionSelected, isOptionSelectedInMultiple, generateId, } from './helpers';
|
package/es/select/utils/index.js
CHANGED
|
@@ -1,12 +1,12 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* 选项排序工具函数
|
|
3
|
-
*/
|
|
4
|
-
import type { SelectOption, SortDirection } from '../types';
|
|
5
|
-
/**
|
|
6
|
-
* 排序选项列表
|
|
7
|
-
* @template T 选项值的类型
|
|
8
|
-
* @param options 原始选项列表
|
|
9
|
-
* @param direction 排序方向('asc' 升序 | 'desc' 降序)
|
|
10
|
-
* @returns 排序后的选项列表(新数组)
|
|
11
|
-
*/
|
|
12
|
-
export declare function sortOptions<T = string | number>(options: SelectOption<T>[], direction?: SortDirection): SelectOption<T>[];
|
|
1
|
+
/**
|
|
2
|
+
* 选项排序工具函数
|
|
3
|
+
*/
|
|
4
|
+
import type { SelectOption, SortDirection } from '../types';
|
|
5
|
+
/**
|
|
6
|
+
* 排序选项列表
|
|
7
|
+
* @template T 选项值的类型
|
|
8
|
+
* @param options 原始选项列表
|
|
9
|
+
* @param direction 排序方向('asc' 升序 | 'desc' 降序)
|
|
10
|
+
* @returns 排序后的选项列表(新数组)
|
|
11
|
+
*/
|
|
12
|
+
export declare function sortOptions<T = string | number>(options: SelectOption<T>[], direction?: SortDirection): SelectOption<T>[];
|
|
@@ -4,16 +4,16 @@ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o =
|
|
|
4
4
|
function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
|
|
5
5
|
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
|
|
6
6
|
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
|
|
7
|
-
/**
|
|
8
|
-
* 选项排序工具函数
|
|
7
|
+
/**
|
|
8
|
+
* 选项排序工具函数
|
|
9
9
|
*/
|
|
10
10
|
|
|
11
|
-
/**
|
|
12
|
-
* 排序选项列表
|
|
13
|
-
* @template T 选项值的类型
|
|
14
|
-
* @param options 原始选项列表
|
|
15
|
-
* @param direction 排序方向('asc' 升序 | 'desc' 降序)
|
|
16
|
-
* @returns 排序后的选项列表(新数组)
|
|
11
|
+
/**
|
|
12
|
+
* 排序选项列表
|
|
13
|
+
* @template T 选项值的类型
|
|
14
|
+
* @param options 原始选项列表
|
|
15
|
+
* @param direction 排序方向('asc' 升序 | 'desc' 降序)
|
|
16
|
+
* @returns 排序后的选项列表(新数组)
|
|
17
17
|
*/
|
|
18
18
|
export function sortOptions(options) {
|
|
19
19
|
var direction = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'asc';
|
|
@@ -1,25 +1,25 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* 标签聚合工具函数
|
|
3
|
-
* 用于多选下拉组件的标签显示逻辑
|
|
4
|
-
*/
|
|
5
|
-
import type { SelectOption, TagDisplayInfo } from '../types';
|
|
6
|
-
/**
|
|
7
|
-
* 计算需要显示的标签和聚合信息
|
|
8
|
-
* @template T 选项值的类型
|
|
9
|
-
* @param selectedValues 当前选中的值数组
|
|
10
|
-
* @param options 所有选项列表
|
|
11
|
-
* @param maxTagCount 最多显示的标签数量
|
|
12
|
-
* @returns 标签显示信息
|
|
13
|
-
*
|
|
14
|
-
* @example
|
|
15
|
-
* ```tsx
|
|
16
|
-
* const tagInfo = calculateTagDisplay(['a', 'b', 'c', 'd'], options, 2);
|
|
17
|
-
* // 返回:
|
|
18
|
-
* // {
|
|
19
|
-
* // visibleTags: [option_a, option_b],
|
|
20
|
-
* // hiddenTags: [option_c, option_d],
|
|
21
|
-
* // hiddenCount: 2
|
|
22
|
-
* // }
|
|
23
|
-
* ```
|
|
24
|
-
*/
|
|
25
|
-
export declare function calculateTagDisplay<T = string | number>(selectedValues: T[], options: SelectOption<T>[], maxTagCount: number): TagDisplayInfo<T>;
|
|
1
|
+
/**
|
|
2
|
+
* 标签聚合工具函数
|
|
3
|
+
* 用于多选下拉组件的标签显示逻辑
|
|
4
|
+
*/
|
|
5
|
+
import type { SelectOption, TagDisplayInfo } from '../types';
|
|
6
|
+
/**
|
|
7
|
+
* 计算需要显示的标签和聚合信息
|
|
8
|
+
* @template T 选项值的类型
|
|
9
|
+
* @param selectedValues 当前选中的值数组
|
|
10
|
+
* @param options 所有选项列表
|
|
11
|
+
* @param maxTagCount 最多显示的标签数量
|
|
12
|
+
* @returns 标签显示信息
|
|
13
|
+
*
|
|
14
|
+
* @example
|
|
15
|
+
* ```tsx
|
|
16
|
+
* const tagInfo = calculateTagDisplay(['a', 'b', 'c', 'd'], options, 2);
|
|
17
|
+
* // 返回:
|
|
18
|
+
* // {
|
|
19
|
+
* // visibleTags: [option_a, option_b],
|
|
20
|
+
* // hiddenTags: [option_c, option_d],
|
|
21
|
+
* // hiddenCount: 2
|
|
22
|
+
* // }
|
|
23
|
+
* ```
|
|
24
|
+
*/
|
|
25
|
+
export declare function calculateTagDisplay<T = string | number>(selectedValues: T[], options: SelectOption<T>[], maxTagCount: number): TagDisplayInfo<T>;
|
|
@@ -1,26 +1,26 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* 标签聚合工具函数
|
|
3
|
-
* 用于多选下拉组件的标签显示逻辑
|
|
1
|
+
/**
|
|
2
|
+
* 标签聚合工具函数
|
|
3
|
+
* 用于多选下拉组件的标签显示逻辑
|
|
4
4
|
*/
|
|
5
5
|
|
|
6
|
-
/**
|
|
7
|
-
* 计算需要显示的标签和聚合信息
|
|
8
|
-
* @template T 选项值的类型
|
|
9
|
-
* @param selectedValues 当前选中的值数组
|
|
10
|
-
* @param options 所有选项列表
|
|
11
|
-
* @param maxTagCount 最多显示的标签数量
|
|
12
|
-
* @returns 标签显示信息
|
|
13
|
-
*
|
|
14
|
-
* @example
|
|
15
|
-
* ```tsx
|
|
16
|
-
* const tagInfo = calculateTagDisplay(['a', 'b', 'c', 'd'], options, 2);
|
|
17
|
-
* // 返回:
|
|
18
|
-
* // {
|
|
19
|
-
* // visibleTags: [option_a, option_b],
|
|
20
|
-
* // hiddenTags: [option_c, option_d],
|
|
21
|
-
* // hiddenCount: 2
|
|
22
|
-
* // }
|
|
23
|
-
* ```
|
|
6
|
+
/**
|
|
7
|
+
* 计算需要显示的标签和聚合信息
|
|
8
|
+
* @template T 选项值的类型
|
|
9
|
+
* @param selectedValues 当前选中的值数组
|
|
10
|
+
* @param options 所有选项列表
|
|
11
|
+
* @param maxTagCount 最多显示的标签数量
|
|
12
|
+
* @returns 标签显示信息
|
|
13
|
+
*
|
|
14
|
+
* @example
|
|
15
|
+
* ```tsx
|
|
16
|
+
* const tagInfo = calculateTagDisplay(['a', 'b', 'c', 'd'], options, 2);
|
|
17
|
+
* // 返回:
|
|
18
|
+
* // {
|
|
19
|
+
* // visibleTags: [option_a, option_b],
|
|
20
|
+
* // hiddenTags: [option_c, option_d],
|
|
21
|
+
* // hiddenCount: 2
|
|
22
|
+
* // }
|
|
23
|
+
* ```
|
|
24
24
|
*/
|
|
25
25
|
export function calculateTagDisplay(selectedValues, options, maxTagCount) {
|
|
26
26
|
// 根据选中值找到对应的选项对象
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* 文本输入 Hooks 导出
|
|
3
|
-
*/
|
|
4
|
-
export { useTextInputState } from './useTextInputState';
|
|
1
|
+
/**
|
|
2
|
+
* 文本输入 Hooks 导出
|
|
3
|
+
*/
|
|
4
|
+
export { useTextInputState } from './useTextInputState';
|
|
@@ -1,24 +1,24 @@
|
|
|
1
|
-
import type { BaseTextInputProps, TextInputState } from '../types';
|
|
2
|
-
/**
|
|
3
|
-
* 文本输入状态管理 Hook
|
|
4
|
-
*
|
|
5
|
-
* 管理组件的内部状态,包括:
|
|
6
|
-
* - 值管理(受控/非受控模式)
|
|
7
|
-
* - 校验状态管理
|
|
8
|
-
* - 事件处理函数封装
|
|
9
|
-
*
|
|
10
|
-
* 支持受控和非受控两种模式:
|
|
11
|
-
* - 受控模式:value 由外部传入,组件不维护内部状态
|
|
12
|
-
* - 非受控模式:使用 defaultValue,组件维护内部状态
|
|
13
|
-
*
|
|
14
|
-
* @param props 组件 Props(包含校验配置)
|
|
15
|
-
* @returns 文本输入状态对象
|
|
16
|
-
*
|
|
17
|
-
* @example
|
|
18
|
-
* // 受控模式
|
|
19
|
-
* const state = useTextInputState({ value: 'hello', onChange: (v) => console.log(v) });
|
|
20
|
-
*
|
|
21
|
-
* // 非受控模式
|
|
22
|
-
* const state = useTextInputState({ defaultValue: 'hello' });
|
|
23
|
-
*/
|
|
24
|
-
export declare function useTextInputState(props: BaseTextInputProps): TextInputState;
|
|
1
|
+
import type { BaseTextInputProps, TextInputState } from '../types';
|
|
2
|
+
/**
|
|
3
|
+
* 文本输入状态管理 Hook
|
|
4
|
+
*
|
|
5
|
+
* 管理组件的内部状态,包括:
|
|
6
|
+
* - 值管理(受控/非受控模式)
|
|
7
|
+
* - 校验状态管理
|
|
8
|
+
* - 事件处理函数封装
|
|
9
|
+
*
|
|
10
|
+
* 支持受控和非受控两种模式:
|
|
11
|
+
* - 受控模式:value 由外部传入,组件不维护内部状态
|
|
12
|
+
* - 非受控模式:使用 defaultValue,组件维护内部状态
|
|
13
|
+
*
|
|
14
|
+
* @param props 组件 Props(包含校验配置)
|
|
15
|
+
* @returns 文本输入状态对象
|
|
16
|
+
*
|
|
17
|
+
* @example
|
|
18
|
+
* // 受控模式
|
|
19
|
+
* const state = useTextInputState({ value: 'hello', onChange: (v) => console.log(v) });
|
|
20
|
+
*
|
|
21
|
+
* // 非受控模式
|
|
22
|
+
* const state = useTextInputState({ defaultValue: 'hello' });
|
|
23
|
+
*/
|
|
24
|
+
export declare function useTextInputState(props: BaseTextInputProps): TextInputState;
|
|
@@ -6,27 +6,27 @@ function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" !=
|
|
|
6
6
|
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
7
7
|
import { useState, useCallback } from 'react';
|
|
8
8
|
import { validateValue } from "../utils/validation";
|
|
9
|
-
/**
|
|
10
|
-
* 文本输入状态管理 Hook
|
|
11
|
-
*
|
|
12
|
-
* 管理组件的内部状态,包括:
|
|
13
|
-
* - 值管理(受控/非受控模式)
|
|
14
|
-
* - 校验状态管理
|
|
15
|
-
* - 事件处理函数封装
|
|
16
|
-
*
|
|
17
|
-
* 支持受控和非受控两种模式:
|
|
18
|
-
* - 受控模式:value 由外部传入,组件不维护内部状态
|
|
19
|
-
* - 非受控模式:使用 defaultValue,组件维护内部状态
|
|
20
|
-
*
|
|
21
|
-
* @param props 组件 Props(包含校验配置)
|
|
22
|
-
* @returns 文本输入状态对象
|
|
23
|
-
*
|
|
24
|
-
* @example
|
|
25
|
-
* // 受控模式
|
|
26
|
-
* const state = useTextInputState({ value: 'hello', onChange: (v) => console.log(v) });
|
|
27
|
-
*
|
|
28
|
-
* // 非受控模式
|
|
29
|
-
* const state = useTextInputState({ defaultValue: 'hello' });
|
|
9
|
+
/**
|
|
10
|
+
* 文本输入状态管理 Hook
|
|
11
|
+
*
|
|
12
|
+
* 管理组件的内部状态,包括:
|
|
13
|
+
* - 值管理(受控/非受控模式)
|
|
14
|
+
* - 校验状态管理
|
|
15
|
+
* - 事件处理函数封装
|
|
16
|
+
*
|
|
17
|
+
* 支持受控和非受控两种模式:
|
|
18
|
+
* - 受控模式:value 由外部传入,组件不维护内部状态
|
|
19
|
+
* - 非受控模式:使用 defaultValue,组件维护内部状态
|
|
20
|
+
*
|
|
21
|
+
* @param props 组件 Props(包含校验配置)
|
|
22
|
+
* @returns 文本输入状态对象
|
|
23
|
+
*
|
|
24
|
+
* @example
|
|
25
|
+
* // 受控模式
|
|
26
|
+
* const state = useTextInputState({ value: 'hello', onChange: (v) => console.log(v) });
|
|
27
|
+
*
|
|
28
|
+
* // 非受控模式
|
|
29
|
+
* const state = useTextInputState({ defaultValue: 'hello' });
|
|
30
30
|
*/
|
|
31
31
|
export function useTextInputState(props) {
|
|
32
32
|
// 判断是否为受控组件
|
|
@@ -53,12 +53,12 @@ export function useTextInputState(props) {
|
|
|
53
53
|
// 当前值(受控模式优先使用 props.value)
|
|
54
54
|
var currentValue = isControlled ? props.value : innerValue;
|
|
55
55
|
|
|
56
|
-
/**
|
|
57
|
-
* 值变更处理函数
|
|
58
|
-
*
|
|
59
|
-
* 1. 更新内部状态(非受控模式)
|
|
60
|
-
* 2. 根据 validateTrigger 决定是否立即校验
|
|
61
|
-
* 3. 触发外部 onChange 回调
|
|
56
|
+
/**
|
|
57
|
+
* 值变更处理函数
|
|
58
|
+
*
|
|
59
|
+
* 1. 更新内部状态(非受控模式)
|
|
60
|
+
* 2. 根据 validateTrigger 决定是否立即校验
|
|
61
|
+
* 3. 触发外部 onChange 回调
|
|
62
62
|
*/
|
|
63
63
|
var handleChange = useCallback(function (newValue) {
|
|
64
64
|
var _props$onChange;
|
|
@@ -81,12 +81,12 @@ export function useTextInputState(props) {
|
|
|
81
81
|
(_props$onChange = props.onChange) === null || _props$onChange === void 0 || _props$onChange.call(props, newValue);
|
|
82
82
|
}, [isControlled, props]);
|
|
83
83
|
|
|
84
|
-
/**
|
|
85
|
-
* 失焦处理函数
|
|
86
|
-
*
|
|
87
|
-
* 1. 标记为已触摸
|
|
88
|
-
* 2. 执行失焦时的校验(根据 validateTrigger)
|
|
89
|
-
* 3. 触发外部 onBlur 回调
|
|
84
|
+
/**
|
|
85
|
+
* 失焦处理函数
|
|
86
|
+
*
|
|
87
|
+
* 1. 标记为已触摸
|
|
88
|
+
* 2. 执行失焦时的校验(根据 validateTrigger)
|
|
89
|
+
* 3. 触发外部 onBlur 回调
|
|
90
90
|
*/
|
|
91
91
|
var handleBlur = useCallback(function () {
|
|
92
92
|
var _props$onBlur;
|
|
@@ -104,11 +104,11 @@ export function useTextInputState(props) {
|
|
|
104
104
|
(_props$onBlur = props.onBlur) === null || _props$onBlur === void 0 || _props$onBlur.call(props, currentValue || '');
|
|
105
105
|
}, [currentValue, props]);
|
|
106
106
|
|
|
107
|
-
/**
|
|
108
|
-
* 聚焦处理函数
|
|
109
|
-
*
|
|
110
|
-
* 1. 标记为已触摸
|
|
111
|
-
* 2. 触发外部 onFocus 回调
|
|
107
|
+
/**
|
|
108
|
+
* 聚焦处理函数
|
|
109
|
+
*
|
|
110
|
+
* 1. 标记为已触摸
|
|
111
|
+
* 2. 触发外部 onFocus 回调
|
|
112
112
|
*/
|
|
113
113
|
var handleFocus = useCallback(function () {
|
|
114
114
|
var _props$onFocus;
|
package/es/text-input/index.d.ts
CHANGED
|
@@ -1,14 +1,14 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* 文本输入组件公共逻辑导出
|
|
3
|
-
*
|
|
4
|
-
* 供以下组件使用:
|
|
5
|
-
* - PisellSingleLineText
|
|
6
|
-
* - PisellLongText
|
|
7
|
-
* - PisellPhone
|
|
8
|
-
* - PisellEmail
|
|
9
|
-
* - PisellUrl
|
|
10
|
-
*/
|
|
11
|
-
export type { DisplayState, ValidationResult, TextInputState, BaseTextInputProps, } from './types';
|
|
12
|
-
export { useTextInputState } from './hooks';
|
|
13
|
-
export { getDisplayState } from './utils';
|
|
14
|
-
export { validateValue as validateTextValue } from './utils';
|
|
1
|
+
/**
|
|
2
|
+
* 文本输入组件公共逻辑导出
|
|
3
|
+
*
|
|
4
|
+
* 供以下组件使用:
|
|
5
|
+
* - PisellSingleLineText
|
|
6
|
+
* - PisellLongText
|
|
7
|
+
* - PisellPhone
|
|
8
|
+
* - PisellEmail
|
|
9
|
+
* - PisellUrl
|
|
10
|
+
*/
|
|
11
|
+
export type { DisplayState, ValidationResult, TextInputState, BaseTextInputProps, } from './types';
|
|
12
|
+
export { useTextInputState } from './hooks';
|
|
13
|
+
export { getDisplayState } from './utils';
|
|
14
|
+
export { validateValue as validateTextValue } from './utils';
|
package/es/text-input/index.js
CHANGED
|
@@ -1,12 +1,12 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* 文本输入组件公共逻辑导出
|
|
3
|
-
*
|
|
4
|
-
* 供以下组件使用:
|
|
5
|
-
* - PisellSingleLineText
|
|
6
|
-
* - PisellLongText
|
|
7
|
-
* - PisellPhone
|
|
8
|
-
* - PisellEmail
|
|
9
|
-
* - PisellUrl
|
|
1
|
+
/**
|
|
2
|
+
* 文本输入组件公共逻辑导出
|
|
3
|
+
*
|
|
4
|
+
* 供以下组件使用:
|
|
5
|
+
* - PisellSingleLineText
|
|
6
|
+
* - PisellLongText
|
|
7
|
+
* - PisellPhone
|
|
8
|
+
* - PisellEmail
|
|
9
|
+
* - PisellUrl
|
|
10
10
|
*/
|
|
11
11
|
|
|
12
12
|
// 类型
|
package/es/text-input/types.d.ts
CHANGED
|
@@ -1,56 +1,56 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* 文本输入组件公共类型定义
|
|
3
|
-
* 供 PisellSingleLineText、PisellLongText、PisellPhone、PisellEmail、PisellUrl 等组件使用
|
|
4
|
-
*/
|
|
5
|
-
export type { DisplayState, ValidationResult } from '../common';
|
|
6
|
-
/**
|
|
7
|
-
* 文本输入状态 Hook 返回值
|
|
8
|
-
*/
|
|
9
|
-
export interface TextInputState {
|
|
10
|
-
/**
|
|
11
|
-
* 当前值
|
|
12
|
-
*/
|
|
13
|
-
value: string | undefined;
|
|
14
|
-
/**
|
|
15
|
-
* 是否已被触摸(交互过)
|
|
16
|
-
*/
|
|
17
|
-
isTouched: boolean;
|
|
18
|
-
/**
|
|
19
|
-
* 是否校验通过
|
|
20
|
-
*/
|
|
21
|
-
isValid: boolean;
|
|
22
|
-
/**
|
|
23
|
-
* 错误信息数组
|
|
24
|
-
*/
|
|
25
|
-
errors: string[];
|
|
26
|
-
/**
|
|
27
|
-
* 值变更处理函数
|
|
28
|
-
*/
|
|
29
|
-
handleChange: (value: string) => void;
|
|
30
|
-
/**
|
|
31
|
-
* 失焦处理函数
|
|
32
|
-
*/
|
|
33
|
-
handleBlur: () => void;
|
|
34
|
-
/**
|
|
35
|
-
* 聚焦处理函数
|
|
36
|
-
*/
|
|
37
|
-
handleFocus: () => void;
|
|
38
|
-
}
|
|
39
|
-
/**
|
|
40
|
-
* 基础文本输入 Props(供校验和状态管理使用)
|
|
41
|
-
*/
|
|
42
|
-
export interface BaseTextInputProps {
|
|
43
|
-
value?: string;
|
|
44
|
-
defaultValue?: string;
|
|
45
|
-
required?: boolean;
|
|
46
|
-
minLength?: number;
|
|
47
|
-
maxLength?: number;
|
|
48
|
-
pattern?: string | RegExp;
|
|
49
|
-
validator?: (value: string) => boolean | string;
|
|
50
|
-
validateTrigger?: 'onChange' | 'onBlur' | 'both';
|
|
51
|
-
errorMessage?: string;
|
|
52
|
-
onChange?: (value: string) => void;
|
|
53
|
-
onBlur?: (value: string) => void;
|
|
54
|
-
onFocus?: () => void;
|
|
55
|
-
onValidate?: (isValid: boolean, errors: string[]) => void;
|
|
56
|
-
}
|
|
1
|
+
/**
|
|
2
|
+
* 文本输入组件公共类型定义
|
|
3
|
+
* 供 PisellSingleLineText、PisellLongText、PisellPhone、PisellEmail、PisellUrl 等组件使用
|
|
4
|
+
*/
|
|
5
|
+
export type { DisplayState, ValidationResult } from '../common';
|
|
6
|
+
/**
|
|
7
|
+
* 文本输入状态 Hook 返回值
|
|
8
|
+
*/
|
|
9
|
+
export interface TextInputState {
|
|
10
|
+
/**
|
|
11
|
+
* 当前值
|
|
12
|
+
*/
|
|
13
|
+
value: string | undefined;
|
|
14
|
+
/**
|
|
15
|
+
* 是否已被触摸(交互过)
|
|
16
|
+
*/
|
|
17
|
+
isTouched: boolean;
|
|
18
|
+
/**
|
|
19
|
+
* 是否校验通过
|
|
20
|
+
*/
|
|
21
|
+
isValid: boolean;
|
|
22
|
+
/**
|
|
23
|
+
* 错误信息数组
|
|
24
|
+
*/
|
|
25
|
+
errors: string[];
|
|
26
|
+
/**
|
|
27
|
+
* 值变更处理函数
|
|
28
|
+
*/
|
|
29
|
+
handleChange: (value: string) => void;
|
|
30
|
+
/**
|
|
31
|
+
* 失焦处理函数
|
|
32
|
+
*/
|
|
33
|
+
handleBlur: () => void;
|
|
34
|
+
/**
|
|
35
|
+
* 聚焦处理函数
|
|
36
|
+
*/
|
|
37
|
+
handleFocus: () => void;
|
|
38
|
+
}
|
|
39
|
+
/**
|
|
40
|
+
* 基础文本输入 Props(供校验和状态管理使用)
|
|
41
|
+
*/
|
|
42
|
+
export interface BaseTextInputProps {
|
|
43
|
+
value?: string;
|
|
44
|
+
defaultValue?: string;
|
|
45
|
+
required?: boolean;
|
|
46
|
+
minLength?: number;
|
|
47
|
+
maxLength?: number;
|
|
48
|
+
pattern?: string | RegExp;
|
|
49
|
+
validator?: (value: string) => boolean | string;
|
|
50
|
+
validateTrigger?: 'onChange' | 'onBlur' | 'both';
|
|
51
|
+
errorMessage?: string;
|
|
52
|
+
onChange?: (value: string) => void;
|
|
53
|
+
onBlur?: (value: string) => void;
|
|
54
|
+
onFocus?: () => void;
|
|
55
|
+
onValidate?: (isValid: boolean, errors: string[]) => void;
|
|
56
|
+
}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* 文本输入工具函数导出
|
|
3
|
-
*/
|
|
4
|
-
export { getDisplayState } from '../../common';
|
|
5
|
-
export { validateValue } from './validation';
|
|
1
|
+
/**
|
|
2
|
+
* 文本输入工具函数导出
|
|
3
|
+
*/
|
|
4
|
+
export { getDisplayState } from '../../common';
|
|
5
|
+
export { validateValue } from './validation';
|