@hi-ui/check-cascader 4.0.0-alpha.21 → 4.0.0-alpha.26

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.
@@ -1,210 +0,0 @@
1
- /** @LICENSE
2
- * @hi-ui/check-cascader
3
- * https://github.com/XiaoMi/hiui/tree/master/packages/ui/check-cascader#readme
4
- *
5
- * Copyright (c) HIUI <mi-hiui@xiaomi.com>.
6
- *
7
- * This source code is licensed under the MIT license found in the
8
- * LICENSE file in the root directory of this source tree.
9
- */
10
- import { __rest } from 'tslib';
11
- import React, { forwardRef, useMemo, useRef, useCallback, useState } from 'react';
12
- import { getPrefixCls, cx } from '@hi-ui/classname';
13
- import { __DEV__ } from '@hi-ui/env';
14
- import { useUncontrolledState } from '@hi-ui/use-uncontrolled-state';
15
- import { times } from '@hi-ui/times';
16
- import { CloseOutlined, CloseCircleFilled } from '@hi-ui/icons';
17
- import { useMergeRefs } from '@hi-ui/use-merge-refs';
18
- import '@hi-ui/use-latest';
19
- import '@hi-ui/use-check';
20
- import { useTagInput } from './hooks/use-tag-input.js';
21
- import '@babel/runtime/regenerator';
22
- import '@hi-ui/tree-utils';
23
- import { flattenTreeData } from './utils/index.js';
24
- import { useOutsideClick } from '@hi-ui/use-outside-click';
25
- var _role = 'tag-input';
26
-
27
- var _prefix = getPrefixCls(_role);
28
-
29
- var NOOP_ARRAY = [];
30
- /**
31
- * TODO: What is TagInput
32
- */
33
-
34
- var TagInput = /*#__PURE__*/forwardRef(function (_a, ref) {
35
- var _a$prefixCls = _a.prefixCls,
36
- prefixCls = _a$prefixCls === void 0 ? _prefix : _a$prefixCls,
37
- _a$role = _a.role,
38
- role = _a$role === void 0 ? _role : _a$role,
39
- className = _a.className,
40
- _a$defaultValue = _a.defaultValue,
41
- defaultValue = _a$defaultValue === void 0 ? NOOP_ARRAY : _a$defaultValue,
42
- valueProp = _a.value,
43
- onChange = _a.onChange,
44
- placeholder = _a.placeholder,
45
- data = _a.data,
46
- _a$wrap = _a.wrap,
47
- wrap = _a$wrap === void 0 ? true : _a$wrap,
48
- _a$clearable = _a.clearable,
49
- clearable = _a$clearable === void 0 ? false : _a$clearable,
50
- _a$disabled = _a.disabled,
51
- disabled = _a$disabled === void 0 ? false : _a$disabled,
52
- displayRender = _a.displayRender,
53
- suffix = _a.suffix,
54
- onClick = _a.onClick,
55
- rest = __rest(_a, ["prefixCls", "role", "className", "defaultValue", "value", "onChange", "placeholder", "data", "wrap", "clearable", "disabled", "displayRender", "suffix", "onClick"]);
56
-
57
- var flattedData = useMemo(function () {
58
- return flattenTreeData(data);
59
- }, [data]);
60
-
61
- var _useUncontrolledState = useUncontrolledState(defaultValue, valueProp, onChange),
62
- value = _useUncontrolledState[0],
63
- tryChangeValue = _useUncontrolledState[1];
64
-
65
- var showData = useMemo(function () {
66
- return flattedData.filter(function (item) {
67
- return item && item.checkable && value.indexOf(item.id) !== -1;
68
- });
69
- }, [flattedData, value]);
70
- var tagSelector = "." + prefixCls + "__tag";
71
- var tagInputRef = useRef(null);
72
-
73
- var _useTagInput = useTagInput(true, tagSelector, showData, tagInputRef),
74
- tagMaxWidth = _useTagInput[0],
75
- showTagCount = _useTagInput[1];
76
-
77
- var handleClear = useCallback(function (evt) {
78
- if (disabled) return;
79
- evt.stopPropagation();
80
- tryChangeValue(NOOP_ARRAY, {
81
- trigger: 'clear'
82
- });
83
- }, [tryChangeValue, disabled]);
84
-
85
- var _useState = useState(false),
86
- hover = _useState[0],
87
- setHover = _useState[1];
88
-
89
- var trySetHover = function trySetHover(hovered) {
90
- if (disabled) return;
91
- setHover(hovered);
92
- }; // 在开启 clearable 下展示 清除内容按钮,可点击进行内容清楚
93
-
94
-
95
- var showClearableIcon = clearable && value.length > 0 && !disabled;
96
-
97
- var _useState2 = useState(false),
98
- expanded = _useState2[0],
99
- setExpanded = _useState2[1];
100
-
101
- var handleExpand = useCallback(function (evt) {
102
- evt.stopPropagation();
103
- setExpanded(true);
104
- }, []);
105
- useOutsideClick(tagInputRef, function () {
106
- return setExpanded(false);
107
- });
108
- var cls = cx(prefixCls, className, expanded ? prefixCls + "--expanded" : wrap ? prefixCls + "--wrap" : prefixCls + "--nowrap");
109
- return /*#__PURE__*/React.createElement("div", Object.assign({
110
- ref: useMergeRefs(ref, tagInputRef),
111
- role: role,
112
- className: cls,
113
- onMouseOver: function onMouseOver(e) {
114
- trySetHover(true);
115
- },
116
- onMouseLeave: function onMouseLeave(e) {
117
- trySetHover(false);
118
- }
119
- }, rest), /*#__PURE__*/React.createElement("div", {
120
- className: cx(prefixCls + "__container", disabled && 'disabled'),
121
- onClick: onClick
122
- }, value.length !== 0 ? /*#__PURE__*/React.createElement("span", {
123
- className: prefixCls + "__value"
124
- }, /*#__PURE__*/React.createElement("span", {
125
- className: cx(prefixCls + "__tags", wrap && prefixCls + "__tags--all")
126
- }, times(showTagCount, function (index) {
127
- var option = showData[index];
128
- if (!option) return null;
129
- var title = displayRender ? displayRender(option) : true;
130
- var closeable = !option.disabled;
131
- return /*#__PURE__*/React.createElement("span", {
132
- className: prefixCls + "__tag",
133
- key: option.id
134
- }, /*#__PURE__*/React.createElement("span", {
135
- className: prefixCls + "__tag-content",
136
- style: {
137
- maxWidth: tagMaxWidth
138
- }
139
- }, title === true ? option.title : title), closeable ? /*#__PURE__*/React.createElement("span", {
140
- className: prefixCls + "__tag-closed",
141
- onClick: function onClick(evt) {
142
- if (disabled) return;
143
- evt.stopPropagation();
144
- var nextValue = [].concat(value).filter(function (id) {
145
- return id !== option.id;
146
- }); // TODO: 点击 close 时,级联选项也需要处理,让其取消级联
147
-
148
- tryChangeValue(nextValue, {
149
- trigger: 'close'
150
- });
151
- }
152
- }, /*#__PURE__*/React.createElement(CloseOutlined, null)) : null);
153
- }))) : /*#__PURE__*/React.createElement("span", {
154
- className: prefixCls + "__placeholder"
155
- }, placeholder), suffix || showClearableIcon || !wrap && showTagCount > 0 ? /*#__PURE__*/React.createElement("span", {
156
- className: prefixCls + "__suffix"
157
- }, !wrap && showTagCount > 0 ? /*#__PURE__*/React.createElement("span", {
158
- className: cx(prefixCls + "__tag--total"),
159
- onClick: handleExpand
160
- }, "" + (showTagCount > 99 ? '+99' : showTagCount)) : null, showClearableIcon && hover ? /*#__PURE__*/React.createElement("span", {
161
- className: prefixCls + "__clear",
162
- role: "button",
163
- tabIndex: -1,
164
- onClick: handleClear
165
- }, /*#__PURE__*/React.createElement(CloseCircleFilled, null)) : suffix) : null), value.length !== 0 && expanded ? /*#__PURE__*/React.createElement("div", {
166
- className: prefixCls + "__container__expand"
167
- }, /*#__PURE__*/React.createElement("span", {
168
- className: cx(prefixCls + "__value")
169
- }, /*#__PURE__*/React.createElement("span", {
170
- className: cx(prefixCls + "__tags", prefixCls + "__tags--all")
171
- }, times(showTagCount, function (index) {
172
- var option = showData[index];
173
- if (!option) return null;
174
- var title = displayRender ? displayRender(option) : true;
175
- var closeable = !option.disabled;
176
- return /*#__PURE__*/React.createElement("span", {
177
- className: prefixCls + "__tag",
178
- key: option.id
179
- }, /*#__PURE__*/React.createElement("span", {
180
- className: prefixCls + "__tag-content",
181
- style: {
182
- maxWidth: tagMaxWidth
183
- }
184
- }, title === true ? option.title : title), closeable ? /*#__PURE__*/React.createElement("span", {
185
- className: prefixCls + "__tag-closed",
186
- onClick: function onClick(evt) {
187
- if (disabled) return;
188
- evt.stopPropagation();
189
- var nextValue = [].concat(value).filter(function (id) {
190
- return id !== option.id;
191
- });
192
- tryChangeValue(nextValue);
193
- }
194
- }, /*#__PURE__*/React.createElement(CloseOutlined, null)) : null);
195
- })), suffix || showClearableIcon ? /*#__PURE__*/React.createElement("span", {
196
- className: prefixCls + "__suffix"
197
- }, showClearableIcon ? /*#__PURE__*/React.createElement("span", {
198
- className: prefixCls + "__clear",
199
- role: "button",
200
- tabIndex: -1,
201
- onClick: handleClear
202
- }, /*#__PURE__*/React.createElement(CloseCircleFilled, null)) : suffix) : null)) : null);
203
- });
204
-
205
- if (__DEV__) {
206
- TagInput.displayName = 'TagInput';
207
- }
208
-
209
- export { TagInput };
210
- //# sourceMappingURL=TagInput.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"TagInput.js","sources":["../../src/TagInput.tsx"],"sourcesContent":[null],"names":["_role","_prefix","getPrefixCls","NOOP_ARRAY","TagInput","forwardRef","_a","ref","prefixCls","role","className","defaultValue","valueProp","value","onChange","placeholder","data","wrap","clearable","disabled","displayRender","suffix","onClick","rest","flattedData","useMemo","flattenTreeData","useUncontrolledState","tryChangeValue","showData","filter","item","checkable","indexOf","id","tagSelector","tagInputRef","useRef","useTagInput","tagMaxWidth","showTagCount","handleClear","useCallback","evt","stopPropagation","trigger","useState","hover","setHover","trySetHover","hovered","showClearableIcon","length","expanded","setExpanded","handleExpand","useOutsideClick","cls","cx","React","useMergeRefs","onMouseOver","e","onMouseLeave","times","index","option","title","closeable","key","style","maxWidth","nextValue","CloseOutlined","tabIndex","CloseCircleFilled","__DEV__","displayName"],"mappings":"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"}
@@ -1,113 +0,0 @@
1
- /** @LICENSE
2
- * @hi-ui/check-cascader
3
- * https://github.com/XiaoMi/hiui/tree/master/packages/ui/check-cascader#readme
4
- *
5
- * Copyright (c) HIUI <mi-hiui@xiaomi.com>.
6
- *
7
- * This source code is licensed under the MIT license found in the
8
- * LICENSE file in the root directory of this source tree.
9
- */
10
- import { useRef, useState, useReducer, useEffect, useCallback, useLayoutEffect } from 'react';
11
- import { debounce } from '../utils/index.js';
12
- var TAG_MARGIN_RIGHT = 4; // 留给显示剩余选项的宽度:suffix + paddingLeft + paddingRight + leftCountTag (16 + 10 + + 10 + 54)
13
-
14
- var LEFT_SPACE_WIDTH = 100 + TAG_MARGIN_RIGHT;
15
-
16
- var useTagInput = function useTagInput(wrap, selector, tags, ref) {
17
- var shouldCalcTagCountRef = useRef(false);
18
-
19
- var _useState = useState(0),
20
- showCount = _useState[0],
21
- setShowCount = _useState[1];
22
-
23
- var _useReducer = useReducer(function (v) {
24
- return !v;
25
- }, false),
26
- trigger = _useReducer[0],
27
- forceUpdate = _useReducer[1];
28
-
29
- var inputWidth = useResizeWidth(ref);
30
- useEffect(function () {
31
- forceUpdate();
32
- }, [inputWidth, tags]);
33
- var calSowCount = useCallback(function () {
34
- if (shouldCalcTagCountRef.current && ref.current) {
35
- // tags 多个展示超过一行时,以数字显示
36
- var tagElements = ref.current.querySelectorAll(selector);
37
- var tagWrapperWidth = ref.current.getBoundingClientRect().width;
38
- var width = 0;
39
-
40
- for (var i = 0; i < tagElements.length; ++i) {
41
- var tag = tagElements[i];
42
- var tagRect = tag.getBoundingClientRect();
43
- width += tagRect.width + TAG_MARGIN_RIGHT;
44
-
45
- if (shouldCalcTagCountRef.current && width + LEFT_SPACE_WIDTH > tagWrapperWidth) {
46
- shouldCalcTagCountRef.current = false; // 开始显示折行的位置,如果为 0,则必展示一个
47
-
48
- var nextShowCount = i === 0 ? 1 : i;
49
- setShowCount(nextShowCount);
50
- break;
51
- }
52
- }
53
- }
54
- }, [ref, selector]);
55
- var debouncedResizeRef = useRef();
56
- useEffect(function () {
57
- var _a;
58
-
59
- (_a = debouncedResizeRef.current) === null || _a === void 0 ? void 0 : _a.cancel();
60
- debouncedResizeRef.current = debounce(calSowCount, 60);
61
- }, [calSowCount]);
62
- useEffect(function () {
63
- var _a;
64
-
65
- setShowCount(0);
66
- shouldCalcTagCountRef.current = true;
67
- (_a = debouncedResizeRef.current) === null || _a === void 0 ? void 0 : _a.call(debouncedResizeRef);
68
- return function () {
69
- var _a;
70
-
71
- shouldCalcTagCountRef.current = false;
72
- (_a = debouncedResizeRef.current) === null || _a === void 0 ? void 0 : _a.cancel();
73
- };
74
- }, [trigger, ref]);
75
- var showTagCount = showCount > 0 ? showCount : tags.length;
76
- var leftTagCount = tags.length - showTagCount;
77
- var tagMaxWidth = inputWidth ? inputWidth - (LEFT_SPACE_WIDTH + 1) : '100%';
78
-
79
- if (wrap) {
80
- return [tagMaxWidth, tags.length, 0];
81
- }
82
-
83
- return [tagMaxWidth, showTagCount, leftTagCount];
84
- };
85
-
86
- var useResizeWidth = function useResizeWidth(ref) {
87
- var _useState2 = useState(0),
88
- width = _useState2[0],
89
- setWidth = _useState2[1];
90
-
91
- var tryUpdateWidth = useCallback(function () {
92
- var _a;
93
-
94
- var nextWidth = (_a = ref.current) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect().width;
95
- setWidth(function (prev) {
96
- return nextWidth || prev || 0;
97
- });
98
- }, [ref]);
99
- useLayoutEffect(function () {
100
- // init with resize
101
- tryUpdateWidth();
102
- var debouncedResize = debounce(tryUpdateWidth, 60);
103
- window.addEventListener('resize', debouncedResize);
104
- return function () {
105
- window.removeEventListener('resize', debouncedResize);
106
- debouncedResize.cancel();
107
- };
108
- }, [tryUpdateWidth]);
109
- return width;
110
- };
111
-
112
- export { useResizeWidth, useTagInput };
113
- //# sourceMappingURL=use-tag-input.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"use-tag-input.js","sources":["../../../src/hooks/use-tag-input.ts"],"sourcesContent":[null],"names":["TAG_MARGIN_RIGHT","LEFT_SPACE_WIDTH","useTagInput","wrap","selector","tags","ref","shouldCalcTagCountRef","useRef","useState","showCount","setShowCount","useReducer","v","trigger","forceUpdate","inputWidth","useResizeWidth","useEffect","calSowCount","useCallback","current","tagElements","querySelectorAll","tagWrapperWidth","getBoundingClientRect","width","i","length","tag","tagRect","nextShowCount","debouncedResizeRef","cancel","debounce","showTagCount","leftTagCount","tagMaxWidth","setWidth","tryUpdateWidth","nextWidth","prev","useLayoutEffect","debouncedResize","window","addEventListener","removeEventListener"],"mappings":"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"}
@@ -1,68 +0,0 @@
1
- import React from 'react';
2
- import { CheckCascaderItem, FlattedCheckCascaderItem } from './types';
3
- /**
4
- * TODO: What is TagInput
5
- */
6
- export declare const TagInput: React.ForwardRefExoticComponent<TagInputProps & React.RefAttributes<HTMLDivElement | null>>;
7
- export interface TagInputProps {
8
- /**
9
- * 组件默认的选择器类
10
- */
11
- prefixCls?: string;
12
- /**
13
- * 组件的语义化 Role 属性
14
- */
15
- role?: string;
16
- /**
17
- * 组件的注入选择器类
18
- */
19
- className?: string;
20
- /**
21
- * 组件的注入样式
22
- */
23
- style?: React.CSSProperties;
24
- /**
25
- * 设置当前多选值
26
- */
27
- value?: React.ReactText[];
28
- /**
29
- * 设置当前多选值默认值
30
- */
31
- defaultValue?: React.ReactText[];
32
- /**
33
- * 多选值改变时的回调
34
- */
35
- onChange?: (values: React.ReactText[]) => void;
36
- /**
37
- * 是否可清空 boolean true | false true
38
- */
39
- clearable?: boolean;
40
- /**
41
- * 是否禁止使用 boolean true | false false
42
- */
43
- disabled?: boolean;
44
- /**
45
- * 自定义选择后触发器所展示的内容
46
- */
47
- displayRender?: (checkedOption: FlattedCheckCascaderItem) => React.ReactNode;
48
- /**
49
- * 输入框占位符
50
- */
51
- placeholder?: string;
52
- /**
53
- * 是否开启换行全展示
54
- */
55
- wrap?: boolean;
56
- /**
57
- * 输入框后置内容
58
- */
59
- suffix?: React.ReactNode;
60
- /**
61
- * 点击 Tag Input 时触发回调
62
- */
63
- onClick?: (event: React.MouseEvent<HTMLDivElement>) => void;
64
- /**
65
- * tag 列表数据源
66
- */
67
- data: CheckCascaderItem[];
68
- }
@@ -1,3 +0,0 @@
1
- import React from 'react';
2
- export declare const useTagInput: <T>(wrap: boolean, selector: string, tags: T[], ref: React.MutableRefObject<HTMLDivElement | null>) => readonly [number | "100%", number, number];
3
- export declare const useResizeWidth: <T extends Element>(ref: React.MutableRefObject<T | null>) => number;