one-design-next 0.0.63 → 0.0.65
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/dist/cascader/fork/Cascader.js +21 -31
- package/dist/cascader/fork/OptionList/Column.d.ts +1 -2
- package/dist/cascader/fork/OptionList/Column.js +2 -3
- package/dist/cascader/fork/OptionList/List.js +13 -96
- package/dist/cascader/fork/OptionList/index.js +1 -1
- package/dist/cascader/fork/OptionList/useActive.js +41 -15
- package/dist/cascader/fork/Panel.js +11 -12
- package/dist/cascader/fork/index.d.ts +3 -4
- package/dist/cascader/index.d.ts +0 -9
- package/dist/cascader/index.js +24 -87
- package/dist/cascader/style/index.css +1 -2
- package/dist/cascader/utils.d.ts +0 -48
- package/dist/cascader/utils.js +1 -72
- package/dist/index.d.ts +1 -1
- package/dist/select/SelectFeedback.d.ts +11 -0
- package/dist/select/SelectFeedback.js +20 -0
- package/dist/select/index.d.ts +28 -1
- package/dist/select/index.js +268 -36
- package/dist/select/style/index.css +73 -0
- package/dist/select/tokenUtils.d.ts +36 -0
- package/dist/select/tokenUtils.js +256 -0
- package/package.json +67 -67
|
@@ -1,27 +1,27 @@
|
|
|
1
|
-
import _extends from
|
|
2
|
-
import _objectSpread from
|
|
3
|
-
import
|
|
4
|
-
import _slicedToArray from
|
|
5
|
-
import
|
|
6
|
-
var _excluded = ["id", "prefixCls", "fieldNames", "defaultValue", "value", "changeOnSelect", "onChange", "displayRender", "checkable", "autoClearSearchValue", "searchValue", "onSearch", "showSearch", "expandTrigger", "options", "dropdownPrefixCls", "loadData", "popupVisible", "open", "popupClassName", "dropdownClassName", "dropdownMenuColumnStyle", "dropdownStyle", "popupPlacement", "placement", "onDropdownVisibleChange", "onPopupVisibleChange", "onOpenChange", "expandIcon", "loadingIcon", "children", "dropdownMatchSelectWidth", "showCheckedStrategy", "optionRender", "checkStrictly"];
|
|
7
|
-
import { BaseSelect } from 'rc-select';
|
|
8
|
-
import useId from "rc-select/es/hooks/useId";
|
|
9
|
-
import useEvent from "rc-util/es/hooks/useEvent";
|
|
10
|
-
import useMergedState from "rc-util/es/hooks/useMergedState";
|
|
11
|
-
import * as React from 'react';
|
|
1
|
+
import _extends from '@babel/runtime/helpers/esm/extends';
|
|
2
|
+
import _objectSpread from '@babel/runtime/helpers/esm/objectSpread2';
|
|
3
|
+
import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
|
|
4
|
+
import _slicedToArray from '@babel/runtime/helpers/esm/slicedToArray';
|
|
5
|
+
import _toConsumableArray from '@babel/runtime/helpers/esm/toConsumableArray';
|
|
12
6
|
import CascaderContext from 'rc-cascader/es/context';
|
|
13
7
|
import useDisplayValues from 'rc-cascader/es/hooks/useDisplayValues';
|
|
14
8
|
import useMissingValues from 'rc-cascader/es/hooks/useMissingValues';
|
|
15
9
|
import useOptions from 'rc-cascader/es/hooks/useOptions';
|
|
16
10
|
import useSearchConfig from 'rc-cascader/es/hooks/useSearchConfig';
|
|
17
11
|
import useSearchOptions from 'rc-cascader/es/hooks/useSearchOptions';
|
|
12
|
+
import { fillFieldNames, SHOW_CHILD, SHOW_PARENT, toPathKeys, toRawValues } from 'rc-cascader/es/utils/commonUtil';
|
|
13
|
+
import { formatStrategyValues, toPathOptions } from 'rc-cascader/es/utils/treeUtil';
|
|
14
|
+
import warningProps, { warningNullOptions } from 'rc-cascader/es/utils/warningPropsUtil';
|
|
15
|
+
import { BaseSelect } from 'rc-select';
|
|
16
|
+
import useId from 'rc-select/es/hooks/useId';
|
|
17
|
+
import useEvent from 'rc-util/es/hooks/useEvent';
|
|
18
|
+
import useMergedState from 'rc-util/es/hooks/useMergedState';
|
|
19
|
+
import * as React from 'react';
|
|
18
20
|
import useSelect from "./hooks/useSelect";
|
|
19
21
|
import useValues from "./hooks/useValues";
|
|
20
22
|
import OptionList from "./OptionList";
|
|
21
23
|
import Panel from "./Panel";
|
|
22
|
-
|
|
23
|
-
import { formatStrategyValues, toPathOptions } from 'rc-cascader/es/utils/treeUtil';
|
|
24
|
-
import warningProps, { warningNullOptions } from 'rc-cascader/es/utils/warningPropsUtil';
|
|
24
|
+
var _excluded = ['id', 'prefixCls', 'fieldNames', 'defaultValue', 'value', 'changeOnSelect', 'onChange', 'displayRender', 'checkable', 'autoClearSearchValue', 'searchValue', 'onSearch', 'showSearch', 'showInnerSearch', 'expandTrigger', 'options', 'dropdownPrefixCls', 'loadData', 'popupVisible', 'open', 'popupClassName', 'dropdownClassName', 'dropdownMenuColumnStyle', 'dropdownStyle', 'popupPlacement', 'placement', 'onDropdownVisibleChange', 'onPopupVisibleChange', 'onOpenChange', 'expandIcon', 'loadingIcon', 'children', 'dropdownMatchSelectWidth', 'showCheckedStrategy', 'optionRender', 'checkStrictly'];
|
|
25
25
|
var Cascader = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
26
26
|
var id = props.id,
|
|
27
27
|
_props$prefixCls = props.prefixCls,
|
|
@@ -38,6 +38,7 @@ var Cascader = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
38
38
|
searchValue = props.searchValue,
|
|
39
39
|
onSearch = props.onSearch,
|
|
40
40
|
showSearch = props.showSearch,
|
|
41
|
+
showInnerSearch = props.showInnerSearch,
|
|
41
42
|
expandTrigger = props.expandTrigger,
|
|
42
43
|
options = props.options,
|
|
43
44
|
dropdownPrefixCls = props.dropdownPrefixCls,
|
|
@@ -81,8 +82,7 @@ var Cascader = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
81
82
|
// ========================= FieldNames =========================
|
|
82
83
|
var mergedFieldNames = React.useMemo(function () {
|
|
83
84
|
return fillFieldNames(fieldNames);
|
|
84
|
-
}
|
|
85
|
-
[JSON.stringify(fieldNames)]
|
|
85
|
+
} /* eslint-disable react-hooks/exhaustive-deps */, [JSON.stringify(fieldNames)]
|
|
86
86
|
/* eslint-enable react-hooks/exhaustive-deps */);
|
|
87
87
|
|
|
88
88
|
// =========================== Option ===========================
|
|
@@ -231,34 +231,24 @@ var Cascader = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
231
231
|
prefixCls: prefixCls,
|
|
232
232
|
autoClearSearchValue: autoClearSearchValue,
|
|
233
233
|
dropdownMatchSelectWidth: dropdownMatchSelectWidth,
|
|
234
|
-
dropdownStyle: _objectSpread(_objectSpread({}, dropdownStyle), customDropdownStyle)
|
|
234
|
+
dropdownStyle: _objectSpread(_objectSpread({}, dropdownStyle), customDropdownStyle),
|
|
235
235
|
// Value
|
|
236
|
-
,
|
|
237
|
-
|
|
238
236
|
displayValues: displayValues,
|
|
239
237
|
onDisplayValuesChange: onDisplayValuesChange,
|
|
240
|
-
mode: multiple ? 'multiple' : undefined
|
|
238
|
+
mode: multiple ? 'multiple' : undefined,
|
|
241
239
|
// Search
|
|
242
|
-
,
|
|
243
|
-
|
|
244
240
|
searchValue: mergedSearchValue,
|
|
245
241
|
onSearch: onInternalSearch,
|
|
246
|
-
showSearch: mergedShowSearch
|
|
242
|
+
showSearch: showInnerSearch ? false : mergedShowSearch,
|
|
247
243
|
// Options
|
|
248
|
-
,
|
|
249
|
-
|
|
250
244
|
OptionList: OptionList,
|
|
251
|
-
emptyOptions: emptyOptions
|
|
245
|
+
emptyOptions: emptyOptions,
|
|
252
246
|
// Open
|
|
253
|
-
,
|
|
254
|
-
|
|
255
247
|
open: mergedOpen,
|
|
256
248
|
dropdownClassName: mergedDropdownClassName,
|
|
257
249
|
placement: mergedPlacement,
|
|
258
|
-
onDropdownVisibleChange: onInternalDropdownVisibleChange
|
|
250
|
+
onDropdownVisibleChange: onInternalDropdownVisibleChange,
|
|
259
251
|
// Children
|
|
260
|
-
,
|
|
261
|
-
|
|
262
252
|
getRawInputElement: function getRawInputElement() {
|
|
263
253
|
return children;
|
|
264
254
|
}
|
|
@@ -15,6 +15,5 @@ export interface ColumnProps {
|
|
|
15
15
|
loadingKeys: string[];
|
|
16
16
|
isSelectable: (option: DefaultOptionType) => boolean;
|
|
17
17
|
disabled?: boolean;
|
|
18
|
-
motionEnter?: boolean;
|
|
19
18
|
}
|
|
20
|
-
export default function Column({ prefixCls, multiple, options, activeValue, prevValuePath, onToggleOpen, onSelect, onActive, checkedSet, halfCheckedSet, loadingKeys, isSelectable, disabled: propsDisabled,
|
|
19
|
+
export default function Column({ prefixCls, multiple, options, activeValue, prevValuePath, onToggleOpen, onSelect, onActive, checkedSet, halfCheckedSet, loadingKeys, isSelectable, disabled: propsDisabled, }: ColumnProps): React.JSX.Element;
|
|
@@ -20,8 +20,7 @@ export default function Column(_ref) {
|
|
|
20
20
|
halfCheckedSet = _ref.halfCheckedSet,
|
|
21
21
|
loadingKeys = _ref.loadingKeys,
|
|
22
22
|
isSelectable = _ref.isSelectable,
|
|
23
|
-
propsDisabled = _ref.disabled
|
|
24
|
-
motionEnter = _ref.motionEnter;
|
|
23
|
+
propsDisabled = _ref.disabled;
|
|
25
24
|
var menuPrefixCls = "".concat(prefixCls, "-menu");
|
|
26
25
|
var menuItemPrefixCls = "".concat(prefixCls, "-menu-item");
|
|
27
26
|
var _ref2 = React.useContext(CascaderContext),
|
|
@@ -72,7 +71,7 @@ export default function Column(_ref) {
|
|
|
72
71
|
});
|
|
73
72
|
}, [options, checkedSet, fieldNames, halfCheckedSet, loadingKeys, prevValuePath]);
|
|
74
73
|
return /*#__PURE__*/React.createElement("ul", {
|
|
75
|
-
className:
|
|
74
|
+
className: menuPrefixCls,
|
|
76
75
|
role: "menu"
|
|
77
76
|
}, optionInfoList.map(function (_ref3) {
|
|
78
77
|
var disabled = _ref3.disabled,
|
|
@@ -1,18 +1,18 @@
|
|
|
1
|
-
import
|
|
2
|
-
import
|
|
3
|
-
import
|
|
4
|
-
import
|
|
5
|
-
import
|
|
1
|
+
import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
|
|
2
|
+
import _extends from '@babel/runtime/helpers/esm/extends';
|
|
3
|
+
import _objectSpread from '@babel/runtime/helpers/esm/objectSpread2';
|
|
4
|
+
import _slicedToArray from '@babel/runtime/helpers/esm/slicedToArray';
|
|
5
|
+
import _toConsumableArray from '@babel/runtime/helpers/esm/toConsumableArray';
|
|
6
6
|
/* eslint-disable default-case */
|
|
7
7
|
import classNames from 'classnames';
|
|
8
|
-
import * as React from 'react';
|
|
9
8
|
import CascaderContext from 'rc-cascader/es/context';
|
|
9
|
+
import CacheContent from 'rc-cascader/es/OptionList/CacheContent';
|
|
10
|
+
import useKeyboard from 'rc-cascader/es/OptionList/useKeyboard';
|
|
10
11
|
import { getFullPathKeys, isLeaf, scrollIntoParentView, toPathKey, toPathKeys, toPathValueStr } from 'rc-cascader/es/utils/commonUtil';
|
|
11
12
|
import { toPathOptions } from 'rc-cascader/es/utils/treeUtil';
|
|
12
|
-
import
|
|
13
|
+
import * as React from 'react';
|
|
13
14
|
import Column, { FIX_LABEL } from "./Column";
|
|
14
15
|
import useActive from "./useActive";
|
|
15
|
-
import useKeyboard from 'rc-cascader/es/OptionList/useKeyboard';
|
|
16
16
|
var RawOptionList = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
17
17
|
var _optionColumns$, _ref3, _classNames;
|
|
18
18
|
var prefixCls = props.prefixCls,
|
|
@@ -180,7 +180,7 @@ var RawOptionList = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
180
180
|
var _containerRef$current;
|
|
181
181
|
var cellPath = activeValueCells.slice(0, i + 1);
|
|
182
182
|
var cellKeyPath = toPathKey(cellPath);
|
|
183
|
-
var ele = (_containerRef$current = containerRef.current) === null || _containerRef$current === void 0 ? void 0 : _containerRef$current.querySelector(
|
|
183
|
+
var ele = (_containerRef$current = containerRef.current) === null || _containerRef$current === void 0 ? void 0 : _containerRef$current.querySelector('li[data-path-key="'.concat(cellKeyPath.replace(/\\{0,2}"/g, '\\"'), '"]') // matches unescaped double quotes
|
|
184
184
|
);
|
|
185
185
|
if (ele) {
|
|
186
186
|
scrollIntoParentView(ele);
|
|
@@ -191,7 +191,7 @@ var RawOptionList = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
191
191
|
// ========================== Render ==========================
|
|
192
192
|
// >>>>> Empty
|
|
193
193
|
var isEmpty = !((_optionColumns$ = optionColumns[0]) !== null && _optionColumns$ !== void 0 && (_optionColumns$ = _optionColumns$.options) !== null && _optionColumns$ !== void 0 && _optionColumns$.length);
|
|
194
|
-
var emptyList = [(_ref3 = {}, _defineProperty(_ref3, fieldNames.value, '__EMPTY__'), _defineProperty(_ref3, FIX_LABEL, notFoundContent), _defineProperty(_ref3,
|
|
194
|
+
var emptyList = [(_ref3 = {}, _defineProperty(_ref3, fieldNames.value, '__EMPTY__'), _defineProperty(_ref3, FIX_LABEL, notFoundContent), _defineProperty(_ref3, 'disabled', true), _ref3)];
|
|
195
195
|
var columnProps = _objectSpread(_objectSpread({}, props), {}, {
|
|
196
196
|
multiple: !isEmpty && multiple,
|
|
197
197
|
onSelect: onPathSelect,
|
|
@@ -207,88 +207,6 @@ var RawOptionList = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
207
207
|
var mergedOptionColumns = isEmpty ? [{
|
|
208
208
|
options: emptyList
|
|
209
209
|
}] : optionColumns;
|
|
210
|
-
|
|
211
|
-
// 面板已展开时,列数变化驱动宽度过渡;仅新增的那一列做进入动效
|
|
212
|
-
var prevOpenRef = React.useRef(false);
|
|
213
|
-
var prevColCountRef = React.useRef(0);
|
|
214
|
-
var prevWidthRef = React.useRef(null);
|
|
215
|
-
var widthMotionEndRef = React.useRef(null);
|
|
216
|
-
var colCount = mergedOptionColumns.length;
|
|
217
|
-
var _React$useStateEnter = React.useState(-1),
|
|
218
|
-
_React$useStateEnter2 = _slicedToArray(_React$useStateEnter, 2),
|
|
219
|
-
enterColumnIndex = _React$useStateEnter2[0],
|
|
220
|
-
setEnterColumnIndex = _React$useStateEnter2[1];
|
|
221
|
-
React.useLayoutEffect(function () {
|
|
222
|
-
var el = containerRef.current;
|
|
223
|
-
var wasOpen = prevOpenRef.current;
|
|
224
|
-
var prevColCount = prevColCountRef.current;
|
|
225
|
-
prevOpenRef.current = !!open;
|
|
226
|
-
prevColCountRef.current = open ? colCount : 0;
|
|
227
|
-
if (!el) {
|
|
228
|
-
return undefined;
|
|
229
|
-
}
|
|
230
|
-
if (!open) {
|
|
231
|
-
prevWidthRef.current = null;
|
|
232
|
-
el.style.width = '';
|
|
233
|
-
el.style.transition = '';
|
|
234
|
-
el.style.overflow = '';
|
|
235
|
-
setEnterColumnIndex(-1);
|
|
236
|
-
return undefined;
|
|
237
|
-
}
|
|
238
|
-
var nextWidth = el.offsetWidth;
|
|
239
|
-
var prevWidth = prevWidthRef.current;
|
|
240
|
-
prevWidthRef.current = nextWidth;
|
|
241
|
-
var reduceMotion = typeof window !== 'undefined' && window.matchMedia('(prefers-reduced-motion: reduce)').matches;
|
|
242
|
-
var timers = [];
|
|
243
|
-
// 已展开时新增列:给新列进入动效
|
|
244
|
-
if (wasOpen && !reduceMotion && colCount > prevColCount) {
|
|
245
|
-
setEnterColumnIndex(colCount - 1);
|
|
246
|
-
timers.push(window.setTimeout(function () {
|
|
247
|
-
setEnterColumnIndex(-1);
|
|
248
|
-
}, 220));
|
|
249
|
-
}
|
|
250
|
-
// 首次打开不动画,避免整板滑入;仅在已展开时宽度变化过渡
|
|
251
|
-
if (!wasOpen || reduceMotion || prevWidth == null || prevWidth === nextWidth) {
|
|
252
|
-
return function () {
|
|
253
|
-
timers.forEach(function (id) {
|
|
254
|
-
return window.clearTimeout(id);
|
|
255
|
-
});
|
|
256
|
-
};
|
|
257
|
-
}
|
|
258
|
-
if (widthMotionEndRef.current) {
|
|
259
|
-
el.removeEventListener('transitionend', widthMotionEndRef.current);
|
|
260
|
-
widthMotionEndRef.current = null;
|
|
261
|
-
}
|
|
262
|
-
el.style.transition = 'none';
|
|
263
|
-
el.style.overflow = 'hidden';
|
|
264
|
-
el.style.width = "".concat(prevWidth, "px");
|
|
265
|
-
// force reflow
|
|
266
|
-
el.offsetWidth;
|
|
267
|
-
el.style.transition = "width var(--odn-cascader-panel-motion-duration, 0.22s) var(--odn-cascader-panel-motion-ease, cubic-bezier(0.32, 0.72, 0, 1))";
|
|
268
|
-
el.style.width = "".concat(nextWidth, "px");
|
|
269
|
-
var onEnd = function onEnd(event) {
|
|
270
|
-
if (event.target !== el || event.propertyName !== 'width') {
|
|
271
|
-
return;
|
|
272
|
-
}
|
|
273
|
-
el.style.width = '';
|
|
274
|
-
el.style.transition = '';
|
|
275
|
-
el.style.overflow = '';
|
|
276
|
-
el.removeEventListener('transitionend', onEnd);
|
|
277
|
-
widthMotionEndRef.current = null;
|
|
278
|
-
prevWidthRef.current = el.offsetWidth;
|
|
279
|
-
};
|
|
280
|
-
widthMotionEndRef.current = onEnd;
|
|
281
|
-
el.addEventListener('transitionend', onEnd);
|
|
282
|
-
return function () {
|
|
283
|
-
timers.forEach(function (id) {
|
|
284
|
-
return window.clearTimeout(id);
|
|
285
|
-
});
|
|
286
|
-
el.removeEventListener('transitionend', onEnd);
|
|
287
|
-
if (widthMotionEndRef.current === onEnd) {
|
|
288
|
-
widthMotionEndRef.current = null;
|
|
289
|
-
}
|
|
290
|
-
};
|
|
291
|
-
}, [colCount, searchValue, open, isEmpty]);
|
|
292
210
|
var columnNodes = mergedOptionColumns.map(function (col, index) {
|
|
293
211
|
var prevValuePath = activeValueCells.slice(0, index);
|
|
294
212
|
var activeValue = activeValueCells[index];
|
|
@@ -298,16 +216,15 @@ var RawOptionList = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
298
216
|
prefixCls: mergedPrefixCls,
|
|
299
217
|
options: col.options,
|
|
300
218
|
prevValuePath: prevValuePath,
|
|
301
|
-
activeValue: activeValue
|
|
302
|
-
motionEnter: index === enterColumnIndex
|
|
219
|
+
activeValue: activeValue
|
|
303
220
|
}));
|
|
304
221
|
});
|
|
305
222
|
|
|
306
223
|
// >>>>> Render
|
|
307
224
|
return /*#__PURE__*/React.createElement(CacheContent, {
|
|
308
225
|
open: open
|
|
309
|
-
}, /*#__PURE__*/React.createElement(
|
|
310
|
-
className: classNames(
|
|
226
|
+
}, /*#__PURE__*/React.createElement('div', {
|
|
227
|
+
className: classNames(''.concat(mergedPrefixCls, '-menus'), (_classNames = {}, _defineProperty(_classNames, ''.concat(mergedPrefixCls, '-menu-empty'), isEmpty), _defineProperty(_classNames, ''.concat(mergedPrefixCls, '-rtl'), rtl), _classNames)),
|
|
311
228
|
ref: containerRef
|
|
312
229
|
}, columnNodes));
|
|
313
230
|
});
|
|
@@ -1,6 +1,12 @@
|
|
|
1
1
|
import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
|
|
2
|
-
import * as React from 'react';
|
|
3
2
|
import CascaderContext from 'rc-cascader/es/context';
|
|
3
|
+
import * as React from 'react';
|
|
4
|
+
var getStrictActivePath = function getStrictActivePath(path) {
|
|
5
|
+
if (!(path !== null && path !== void 0 && path.length)) {
|
|
6
|
+
return [];
|
|
7
|
+
}
|
|
8
|
+
return path.slice(0, -1);
|
|
9
|
+
};
|
|
4
10
|
|
|
5
11
|
/**
|
|
6
12
|
* Control the active open options path.
|
|
@@ -17,31 +23,51 @@ var useActive = function useActive(multiple, open) {
|
|
|
17
23
|
activeValueCells = _React$useState2[0],
|
|
18
24
|
setActiveValueCells = _React$useState2[1];
|
|
19
25
|
var prevOpenRef = React.useRef(open);
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
26
|
+
var justOpened = open && !prevOpenRef.current;
|
|
27
|
+
prevOpenRef.current = open;
|
|
28
|
+
React.useLayoutEffect(function () {
|
|
23
29
|
if (checkStrictly) {
|
|
24
30
|
if (multiple) {
|
|
25
|
-
// 多选:仅在打开面板时定位到选中值所在层级,勾选不重置展开路径
|
|
26
31
|
if (justOpened) {
|
|
27
|
-
|
|
28
|
-
setActiveValueCells(path.slice(0, -1));
|
|
32
|
+
setActiveValueCells(getStrictActivePath(firstValueCells));
|
|
29
33
|
}
|
|
30
34
|
return;
|
|
31
35
|
}
|
|
32
|
-
// 单选:打开或值变化时定位(选中后会收起面板)
|
|
33
36
|
if (open) {
|
|
34
|
-
|
|
35
|
-
setActiveValueCells(_path.slice(0, -1));
|
|
37
|
+
setActiveValueCells(getStrictActivePath(firstValueCells));
|
|
36
38
|
}
|
|
37
39
|
return;
|
|
38
40
|
}
|
|
39
|
-
if (!multiple) {
|
|
41
|
+
if (!multiple && (justOpened || open)) {
|
|
40
42
|
setActiveValueCells(firstValueCells || []);
|
|
41
43
|
}
|
|
42
|
-
},
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
44
|
+
}, [open, firstValueCells, checkStrictly, multiple, justOpened]);
|
|
45
|
+
|
|
46
|
+
// 打开首帧即用目标路径渲染列,避免弹层先窄后宽导致定位跳动
|
|
47
|
+
var mergedActiveValueCells = React.useMemo(function () {
|
|
48
|
+
if (!open) {
|
|
49
|
+
return activeValueCells;
|
|
50
|
+
}
|
|
51
|
+
if (checkStrictly) {
|
|
52
|
+
if (justOpened) {
|
|
53
|
+
return getStrictActivePath(firstValueCells);
|
|
54
|
+
}
|
|
55
|
+
if (activeValueCells.length > 0) {
|
|
56
|
+
return activeValueCells;
|
|
57
|
+
}
|
|
58
|
+
return getStrictActivePath(firstValueCells);
|
|
59
|
+
}
|
|
60
|
+
if (multiple) {
|
|
61
|
+
return activeValueCells;
|
|
62
|
+
}
|
|
63
|
+
if (justOpened) {
|
|
64
|
+
return firstValueCells || [];
|
|
65
|
+
}
|
|
66
|
+
if (activeValueCells.length > 0) {
|
|
67
|
+
return activeValueCells;
|
|
68
|
+
}
|
|
69
|
+
return firstValueCells || [];
|
|
70
|
+
}, [activeValueCells, checkStrictly, firstValueCells, justOpened, multiple, open]);
|
|
71
|
+
return [mergedActiveValueCells, setActiveValueCells];
|
|
46
72
|
};
|
|
47
73
|
export default useActive;
|
|
@@ -1,16 +1,16 @@
|
|
|
1
|
-
import _defineProperty from
|
|
2
|
-
import _slicedToArray from
|
|
1
|
+
import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
|
|
2
|
+
import _slicedToArray from '@babel/runtime/helpers/esm/slicedToArray';
|
|
3
3
|
import classNames from 'classnames';
|
|
4
|
-
import { useEvent, useMergedState } from 'rc-util';
|
|
5
|
-
import * as React from 'react';
|
|
6
4
|
import CascaderContext from 'rc-cascader/es/context';
|
|
7
5
|
import useMissingValues from 'rc-cascader/es/hooks/useMissingValues';
|
|
8
6
|
import useOptions from 'rc-cascader/es/hooks/useOptions';
|
|
7
|
+
import { fillFieldNames, toRawValues } from 'rc-cascader/es/utils/commonUtil';
|
|
8
|
+
import { toPathOptions } from 'rc-cascader/es/utils/treeUtil';
|
|
9
|
+
import { useEvent, useMergedState } from 'rc-util';
|
|
10
|
+
import * as React from 'react';
|
|
9
11
|
import useSelect from "./hooks/useSelect";
|
|
10
12
|
import useValues from "./hooks/useValues";
|
|
11
13
|
import RawOptionList from "./OptionList/List";
|
|
12
|
-
import { fillFieldNames, toRawValues } from 'rc-cascader/es/utils/commonUtil';
|
|
13
|
-
import { toPathOptions } from 'rc-cascader/es/utils/treeUtil';
|
|
14
14
|
function noop() {}
|
|
15
15
|
export default function Panel(props) {
|
|
16
16
|
var _classNames;
|
|
@@ -54,8 +54,7 @@ export default function Panel(props) {
|
|
|
54
54
|
// ========================= FieldNames =========================
|
|
55
55
|
var mergedFieldNames = React.useMemo(function () {
|
|
56
56
|
return fillFieldNames(fieldNames);
|
|
57
|
-
}
|
|
58
|
-
[JSON.stringify(fieldNames)]
|
|
57
|
+
} /* eslint-disable react-hooks/exhaustive-deps */, [JSON.stringify(fieldNames)]
|
|
59
58
|
/* eslint-enable react-hooks/exhaustive-deps */);
|
|
60
59
|
|
|
61
60
|
// =========================== Option ===========================
|
|
@@ -121,16 +120,16 @@ export default function Panel(props) {
|
|
|
121
120
|
}, [mergedOptions, mergedFieldNames, checkedValues, halfCheckedValues, mergedChangeOnSelect, onInternalSelect, checkable, checkStrictly, loadData, expandTrigger, expandIcon, loadingIcon]);
|
|
122
121
|
|
|
123
122
|
// ========================= Render =========================
|
|
124
|
-
var panelPrefixCls =
|
|
123
|
+
var panelPrefixCls = ''.concat(prefixCls, '-panel');
|
|
125
124
|
var isEmpty = !mergedOptions.length;
|
|
126
125
|
return /*#__PURE__*/React.createElement(CascaderContext.Provider, {
|
|
127
126
|
value: cascaderContext
|
|
128
|
-
}, /*#__PURE__*/React.createElement(
|
|
129
|
-
className: classNames(panelPrefixCls, (_classNames = {}, _defineProperty(_classNames,
|
|
127
|
+
}, /*#__PURE__*/React.createElement('div', {
|
|
128
|
+
className: classNames(panelPrefixCls, (_classNames = {}, _defineProperty(_classNames, ''.concat(panelPrefixCls, '-rtl'), direction === 'rtl'), _defineProperty(_classNames, ''.concat(panelPrefixCls, '-empty'), isEmpty), _classNames), className),
|
|
130
129
|
style: style
|
|
131
130
|
}, isEmpty ? notFoundContent : /*#__PURE__*/React.createElement(RawOptionList, {
|
|
132
131
|
prefixCls: prefixCls,
|
|
133
|
-
searchValue:
|
|
132
|
+
searchValue: '',
|
|
134
133
|
multiple: multiple,
|
|
135
134
|
toggleOpen: noop,
|
|
136
135
|
open: true,
|
|
@@ -1,7 +1,4 @@
|
|
|
1
|
-
import type {
|
|
2
|
-
CascaderProps,
|
|
3
|
-
DefaultOptionType,
|
|
4
|
-
} from 'rc-cascader';
|
|
1
|
+
import type { CascaderProps, DefaultOptionType } from 'rc-cascader';
|
|
5
2
|
import type * as React from 'react';
|
|
6
3
|
|
|
7
4
|
export { SHOW_CHILD, SHOW_PARENT } from 'rc-cascader';
|
|
@@ -12,6 +9,8 @@ export type ForkCascaderProps<
|
|
|
12
9
|
Multiple extends boolean | React.ReactNode = false,
|
|
13
10
|
> = CascaderProps<OptionType, ValueField, Multiple> & {
|
|
14
11
|
checkStrictly?: boolean;
|
|
12
|
+
/** 下拉内搜索:为 true 时不占用 selector 内的搜索后缀宽度 */
|
|
13
|
+
showInnerSearch?: boolean;
|
|
15
14
|
};
|
|
16
15
|
|
|
17
16
|
type CascaderComponent = (<
|
package/dist/cascader/index.d.ts
CHANGED
|
@@ -3,7 +3,6 @@ import React from 'react';
|
|
|
3
3
|
import '../select/style';
|
|
4
4
|
import CascaderPanel from './Panel';
|
|
5
5
|
import './style';
|
|
6
|
-
import { type ExpandDirection } from './utils';
|
|
7
6
|
export interface BaseCascaderProps extends Omit<RcCascaderProps<DefaultOptionType, 'value', false>, 'prefixCls' | 'onChange' | 'value' | 'defaultValue' | 'showCheckedStrategy' | 'changeOnSelect'> {
|
|
8
7
|
/** 组件尺寸 */
|
|
9
8
|
size?: 'small' | 'medium' | 'large';
|
|
@@ -52,14 +51,6 @@ export interface BaseCascaderProps extends Omit<RcCascaderProps<DefaultOptionTyp
|
|
|
52
51
|
* 点击选项或勾选控件选中,仅点击展开图标展开下一级;多选时父子节点选择互不影响(无半选)。
|
|
53
52
|
*/
|
|
54
53
|
crossLevelSelect?: boolean;
|
|
55
|
-
/**
|
|
56
|
-
* 弹层生长方向(不影响列阅读顺序,层级始终从左到右加深,展开 Icon 不翻转):
|
|
57
|
-
* - `ltr` 左对齐,整体向右生长
|
|
58
|
-
* - `rtl` 右对齐,整体向左生长(避免靠右时超出屏幕)
|
|
59
|
-
* - `auto` 根据 selector 相对视口位置自动选择
|
|
60
|
-
* `crossLevelSelect` 时默认 `auto`,否则默认 `ltr`。
|
|
61
|
-
*/
|
|
62
|
-
expandDirection?: ExpandDirection;
|
|
63
54
|
}
|
|
64
55
|
export type CascaderProps<V = (string | number)[] | null> = BaseCascaderProps & {
|
|
65
56
|
mode?: 'single' | 'multiple';
|