@chaoswise/ui 3.1.10 → 3.1.12

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.
Files changed (64) hide show
  1. package/lib/AbreastLayout/index.js +20 -17
  2. package/lib/Antd5/config-provider/index.js +10 -6
  3. package/lib/Antd5/dropdown/dropdown.js +1 -1
  4. package/lib/Antd5/menu/menu.js +1 -1
  5. package/lib/Antd5/splitter/SplitBar.js +74 -15
  6. package/lib/Antd5/splitter/Splitter.js +27 -17
  7. package/lib/Antd5/splitter/hooks/useItems.js +6 -3
  8. package/lib/Antd5/splitter/hooks/useResizable.js +3 -3
  9. package/lib/Antd5/splitter/hooks/useResize.js +17 -6
  10. package/lib/Antd5/splitter/style/index.js +32 -6
  11. package/lib/Antd5/typography/hooks/useCopyClick.js +2 -2
  12. package/lib/Antd5/upload/Upload.js +1 -1
  13. package/lib/BasicLayout/index.js +29 -29
  14. package/lib/Button/index.js +0 -3
  15. package/lib/CWCascader/index.js +0 -5
  16. package/lib/CWCascader/rc-cascader/OptionList/Column.js +1 -1
  17. package/lib/CWColorPicker/SketchPicker/components/common/Checkboard.js +8 -10
  18. package/lib/CWColorPicker/SketchPicker/components/common/Raised.js +6 -9
  19. package/lib/CWColorPicker/SketchPicker/components/sketch/index.js +7 -9
  20. package/lib/CWColorPicker/index.js +2 -4
  21. package/lib/CWMessage/MessageContent/TabList/index.js +1 -1
  22. package/lib/CWMessage/MessageContent/index.js +1 -1
  23. package/lib/CWMessage/index.js +6 -14
  24. package/lib/CWRadioTabs/index.js +2 -5
  25. package/lib/CWRangePicker/Refresh/index.js +2 -1
  26. package/lib/CWRangePicker/TimeSpan/index.js +2 -1
  27. package/lib/CWRangePicker/index.js +0 -5
  28. package/lib/CWSelect/index.js +2 -2
  29. package/lib/CWTable/CWTable.js +29 -18
  30. package/lib/CWTable/index.js +0 -12
  31. package/lib/CWTree/index.js +188 -149
  32. package/lib/CWTree/index.style.js +4 -2
  33. package/lib/CWTree/utils/index.js +147 -54
  34. package/lib/CardSelect/index.js +8 -12
  35. package/lib/ChangeIcon/index.js +3 -5
  36. package/lib/Collapse/index.js +8 -11
  37. package/lib/CustomScrollBar/index.js +6 -13
  38. package/lib/EchartsBase/index.js +0 -3
  39. package/lib/Empty/index.js +0 -4
  40. package/lib/Flow/Flow.js +0 -3
  41. package/lib/Header/index.js +16 -17
  42. package/lib/LayoutWrapper/Footer.js +3 -8
  43. package/lib/LayoutWrapper/index.js +2 -58
  44. package/lib/Modal/assets/Close.js +0 -8
  45. package/lib/ModuleFederation/react-dynamic-remote-component/RemoteComponent.js +3 -3
  46. package/lib/ModuleFederation/react-dynamic-remote-component/load-module.js +2 -2
  47. package/lib/QuickTransfer/index.js +9 -11
  48. package/lib/QuickTransfer/utils.js +50 -29
  49. package/lib/ScrollLoad/index.js +17 -19
  50. package/lib/SearchBar/index.js +2 -5
  51. package/lib/SiderMenu/index.js +2 -4
  52. package/lib/SimpleCard/index.js +5 -12
  53. package/lib/SimplePagination/index.js +6 -8
  54. package/lib/SingleSpa/index.js +2 -2
  55. package/lib/Tag/CheckableTag.js +8 -10
  56. package/lib/Tag/index.js +0 -1
  57. package/lib/TimeRangeSlider/index.js +0 -3
  58. package/lib/TimeZoneSelect/index.js +2 -2
  59. package/lib/Tooltip/index.js +9 -6
  60. package/lib/TooltipText/index.js +2 -4
  61. package/lib/UniversalLayout/index.js +5 -7
  62. package/lib/WangEditor/index.js +10 -11
  63. package/lib/useChartTheme/index.js +3 -2
  64. package/package.json +3 -2
@@ -1,5 +1,5 @@
1
1
  function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
2
- var _excluded = ["children", "type", "Siderbar", "SiderWidth", "resizeBarColor", "showCollapsedBtn", "onCollapse", "contentStyle", "siderStyle"];
2
+ var _excluded = ["children", "type", "Siderbar", "SiderWidth", "resizeBarColor", "showCollapsedBtn", "onCollapse", "contentStyle", "siderStyle", "minWidth", "maxWidth"];
3
3
  function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
4
4
  function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
5
5
  function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
@@ -31,17 +31,25 @@ import useStyle from "./index.style";
31
31
  */
32
32
  function AbreastLayout(_ref) {
33
33
  var children = _ref.children,
34
- type = _ref.type,
34
+ _ref$type = _ref.type,
35
+ type = _ref$type === void 0 ? "leftNavigation" : _ref$type,
35
36
  Siderbar = _ref.Siderbar,
36
- SiderWidth = _ref.SiderWidth,
37
- resizeBarColor = _ref.resizeBarColor,
38
- showCollapsedBtn = _ref.showCollapsedBtn,
37
+ _ref$SiderWidth = _ref.SiderWidth,
38
+ SiderWidth = _ref$SiderWidth === void 0 ? 232 : _ref$SiderWidth,
39
+ _ref$resizeBarColor = _ref.resizeBarColor,
40
+ resizeBarColor = _ref$resizeBarColor === void 0 ? "#40A9FF" : _ref$resizeBarColor,
41
+ _ref$showCollapsedBtn = _ref.showCollapsedBtn,
42
+ showCollapsedBtn = _ref$showCollapsedBtn === void 0 ? true : _ref$showCollapsedBtn,
39
43
  _onCollapse = _ref.onCollapse,
40
44
  _ref$contentStyle = _ref.contentStyle,
41
45
  contentStyle = _ref$contentStyle === void 0 ? {} : _ref$contentStyle,
42
46
  _ref$siderStyle = _ref.siderStyle,
43
47
  siderStyle = _ref$siderStyle === void 0 ? {} : _ref$siderStyle,
44
- rest = _objectWithoutProperties(_ref, _excluded);
48
+ _ref$minWidth = _ref.minWidth,
49
+ minWidth = _ref$minWidth === void 0 ? 208 : _ref$minWidth,
50
+ _ref$maxWidth = _ref.maxWidth,
51
+ maxWidth = _ref$maxWidth === void 0 ? 440 : _ref$maxWidth,
52
+ restProps = _objectWithoutProperties(_ref, _excluded);
45
53
  var _useConfigContext = useConfigContext(),
46
54
  getPrefixCls = _useConfigContext.getPrefixCls;
47
55
  var prefixCls = getPrefixCls("abreast-layout");
@@ -62,6 +70,12 @@ function AbreastLayout(_ref) {
62
70
  _useState6 = _slicedToArray(_useState5, 2),
63
71
  resizableBoolean = _useState6[0],
64
72
  setResizable = _useState6[1];
73
+
74
+ // Construct rest object with defaults
75
+ var rest = _objectSpread({
76
+ minWidth: minWidth,
77
+ maxWidth: maxWidth
78
+ }, restProps);
65
79
  var isLeft = type === "rightNavigation" || type === "rightOperationArea";
66
80
  var isRight = type === "leftNavigation" || type === "leftOperationArea";
67
81
  var finalCollapsed = rest.collapsed !== undefined ? rest.collapsed : collapsed;
@@ -148,17 +162,6 @@ function AbreastLayout(_ref) {
148
162
  onClick: onCollapse
149
163
  }))));
150
164
  }
151
- AbreastLayout.defaultProps = {
152
- SiderWidth: 232,
153
- // 侧边栏默认宽度
154
- resizeBarColor: "#40A9FF",
155
- minWidth: 208,
156
- // 侧边栏拖拽最小宽度
157
- maxWidth: 440,
158
- // 侧边栏拖拽最大宽度
159
- showCollapsedBtn: true,
160
- type: "leftNavigation"
161
- };
162
165
  AbreastLayout.propTypes = {
163
166
  /**
164
167
  * 顶部导航的类型,分为左侧可拖拽(leftNavigation),左侧固定宽(leftOperationArea),右侧可拖拽(rightNavigation),右侧固定宽(rightOperationArea)四种样式
@@ -437,12 +437,16 @@ ConfigProvider.ConfigContext = ConfigContext;
437
437
  ConfigProvider.SizeContext = SizeContext;
438
438
  ConfigProvider.config = setGlobalConfig;
439
439
  ConfigProvider.useConfig = useConfig;
440
- Object.defineProperty(ConfigProvider, 'SizeContext', {
441
- get: function get() {
442
- warning(false, 'ConfigProvider', 'ConfigProvider.SizeContext is deprecated. Please use `ConfigProvider.useConfig().componentSize` instead.');
443
- return SizeContext;
444
- }
445
- });
440
+ // Object.defineProperty(ConfigProvider, 'SizeContext', {
441
+ // get: () => {
442
+ // warning(
443
+ // false,
444
+ // 'ConfigProvider',
445
+ // 'ConfigProvider.SizeContext is deprecated. Please use `ConfigProvider.useConfig().componentSize` instead.',
446
+ // );
447
+ // return SizeContext;
448
+ // },
449
+ // });
446
450
  if (process.env.NODE_ENV !== 'production') {
447
451
  ConfigProvider.displayName = 'ConfigProvider';
448
452
  }
@@ -75,7 +75,7 @@ var Dropdown = function Dropdown(props) {
75
75
  var deprecatedProps = {
76
76
  visible: 'open',
77
77
  onVisibleChange: 'onOpenChange',
78
- overlay: 'menu',
78
+ // overlay: 'menu',
79
79
  dropdownRender: 'popupRender',
80
80
  destroyPopupOnHide: 'destroyOnHidden'
81
81
  };
@@ -70,7 +70,7 @@ var InternalMenu = /*#__PURE__*/forwardRef(function (props, ref) {
70
70
  if (process.env.NODE_ENV !== 'production') {
71
71
  var warning = devUseWarning('Menu');
72
72
  warning(!('inlineCollapsed' in props && mode !== 'inline'), 'usage', '`inlineCollapsed` should only be used when `mode` is inline.');
73
- warning.deprecated('items' in props && !props.children, 'children', 'items');
73
+ // warning.deprecated('items' in props && !props.children, 'children', 'items');
74
74
  }
75
75
  (_overrideObj$validato = overrideObj.validator) === null || _overrideObj$validato === void 0 || _overrideObj$validato.call(overrideObj, {
76
76
  mode: mode
@@ -15,6 +15,7 @@ import LeftOutlined from '@ant-design/icons/LeftOutlined';
15
15
  import RightOutlined from '@ant-design/icons/RightOutlined';
16
16
  import UpOutlined from '@ant-design/icons/UpOutlined';
17
17
  import classNames from 'classnames';
18
+ import useEvent from 'rc-util/lib/hooks/useEvent';
18
19
  function getValidNumber(num) {
19
20
  return typeof num === 'number' && !Number.isNaN(num) ? Math.round(num) : 0;
20
21
  }
@@ -32,13 +33,21 @@ var SplitBar = function SplitBar(props) {
32
33
  onOffsetStart = props.onOffsetStart,
33
34
  onOffsetUpdate = props.onOffsetUpdate,
34
35
  onOffsetEnd = props.onOffsetEnd,
35
- onCollapse = props.onCollapse;
36
+ onCollapse = props.onCollapse,
37
+ lazy = props.lazy,
38
+ containerSize = props.containerSize;
36
39
  var splitBarPrefixCls = "".concat(prefixCls, "-bar");
37
40
  // ======================== Resize ========================
38
41
  var _useState = useState(null),
39
42
  _useState2 = _slicedToArray(_useState, 2),
40
43
  startPos = _useState2[0],
41
44
  setStartPos = _useState2[1];
45
+ var _useState3 = useState(0),
46
+ _useState4 = _slicedToArray(_useState3, 2),
47
+ constrainedOffset = _useState4[0],
48
+ setConstrainedOffset = _useState4[1];
49
+ var constrainedOffsetX = vertical ? 0 : constrainedOffset;
50
+ var constrainedOffsetY = vertical ? constrainedOffset : 0;
42
51
  var onMouseDown = function onMouseDown(e) {
43
52
  if (resizable && e.currentTarget) {
44
53
  setStartPos([e.pageX, e.pageY]);
@@ -52,43 +61,90 @@ var SplitBar = function SplitBar(props) {
52
61
  onOffsetStart(index);
53
62
  }
54
63
  };
55
- React.useEffect(function () {
64
+ // Updated constraint calculation
65
+ var getConstrainedOffset = function getConstrainedOffset(rawOffset) {
66
+ var currentPos = containerSize * ariaNow / 100;
67
+ var newPos = currentPos + rawOffset;
68
+ // Calculate available space
69
+ var minAllowed = Math.max(0, containerSize * ariaMin / 100);
70
+ var maxAllowed = Math.min(containerSize, containerSize * ariaMax / 100);
71
+ // Constrain new position within bounds
72
+ var clampedPos = Math.max(minAllowed, Math.min(maxAllowed, newPos));
73
+ return clampedPos - currentPos;
74
+ };
75
+ var handleLazyMove = useEvent(function (offsetX, offsetY) {
76
+ var constrainedOffsetValue = getConstrainedOffset(vertical ? offsetY : offsetX);
77
+ setConstrainedOffset(constrainedOffsetValue);
78
+ });
79
+ var handleLazyEnd = useEvent(function () {
80
+ onOffsetUpdate(index, constrainedOffsetX, constrainedOffsetY, true);
81
+ setConstrainedOffset(0);
82
+ onOffsetEnd(true);
83
+ });
84
+ React.useLayoutEffect(function () {
56
85
  if (startPos) {
57
86
  var onMouseMove = function onMouseMove(e) {
58
87
  var pageX = e.pageX,
59
88
  pageY = e.pageY;
60
89
  var offsetX = pageX - startPos[0];
61
90
  var offsetY = pageY - startPos[1];
62
- onOffsetUpdate(index, offsetX, offsetY);
91
+ if (lazy) {
92
+ handleLazyMove(offsetX, offsetY);
93
+ } else {
94
+ onOffsetUpdate(index, offsetX, offsetY);
95
+ }
63
96
  };
64
97
  var onMouseUp = function onMouseUp() {
98
+ if (lazy) {
99
+ handleLazyEnd();
100
+ } else {
101
+ onOffsetEnd();
102
+ }
65
103
  setStartPos(null);
66
- onOffsetEnd();
67
104
  };
68
105
  var handleTouchMove = function handleTouchMove(e) {
69
106
  if (e.touches.length === 1) {
70
107
  var touch = e.touches[0];
71
108
  var offsetX = touch.pageX - startPos[0];
72
109
  var offsetY = touch.pageY - startPos[1];
73
- onOffsetUpdate(index, offsetX, offsetY);
110
+ if (lazy) {
111
+ handleLazyMove(offsetX, offsetY);
112
+ } else {
113
+ onOffsetUpdate(index, offsetX, offsetY);
114
+ }
74
115
  }
75
116
  };
76
117
  var handleTouchEnd = function handleTouchEnd() {
118
+ if (lazy) {
119
+ handleLazyEnd();
120
+ } else {
121
+ onOffsetEnd();
122
+ }
77
123
  setStartPos(null);
78
- onOffsetEnd();
79
124
  };
80
- window.addEventListener('touchmove', handleTouchMove);
81
- window.addEventListener('touchend', handleTouchEnd);
82
- window.addEventListener('mousemove', onMouseMove);
83
- window.addEventListener('mouseup', onMouseUp);
125
+ var eventHandlerMap = {
126
+ mousemove: onMouseMove,
127
+ mouseup: onMouseUp,
128
+ touchmove: handleTouchMove,
129
+ touchend: handleTouchEnd
130
+ };
131
+ for (var _i = 0, _Object$entries = Object.entries(eventHandlerMap); _i < _Object$entries.length; _i++) {
132
+ var _Object$entries$_i = _slicedToArray(_Object$entries[_i], 2),
133
+ event = _Object$entries$_i[0],
134
+ handler = _Object$entries$_i[1];
135
+ window.addEventListener(event, handler);
136
+ }
84
137
  return function () {
85
- window.removeEventListener('mousemove', onMouseMove);
86
- window.removeEventListener('mouseup', onMouseUp);
87
- window.removeEventListener('touchmove', handleTouchMove);
88
- window.removeEventListener('touchend', handleTouchEnd);
138
+ for (var _i2 = 0, _Object$entries2 = Object.entries(eventHandlerMap); _i2 < _Object$entries2.length; _i2++) {
139
+ var _Object$entries2$_i = _slicedToArray(_Object$entries2[_i2], 2),
140
+ _event = _Object$entries2$_i[0],
141
+ _handler = _Object$entries2$_i[1];
142
+ window.removeEventListener(_event, _handler);
143
+ }
89
144
  };
90
145
  }
91
146
  }, [startPos]);
147
+ var transformStyle = _defineProperty({}, "--".concat(splitBarPrefixCls, "-preview-offset"), "".concat(constrainedOffset, "px"));
92
148
  // ======================== Render ========================
93
149
  var StartIcon = vertical ? UpOutlined : LeftOutlined;
94
150
  var EndIcon = vertical ? DownOutlined : RightOutlined;
@@ -98,7 +154,10 @@ var SplitBar = function SplitBar(props) {
98
154
  "aria-valuenow": getValidNumber(ariaNow),
99
155
  "aria-valuemin": getValidNumber(ariaMin),
100
156
  "aria-valuemax": getValidNumber(ariaMax),
101
- children: [_jsx("div", {
157
+ children: [lazy && _jsx("div", {
158
+ className: classNames("".concat(splitBarPrefixCls, "-preview"), _defineProperty({}, "".concat(splitBarPrefixCls, "-preview-active"), !!constrainedOffset)),
159
+ style: transformStyle
160
+ }), _jsx("div", {
102
161
  className: classNames("".concat(splitBarPrefixCls, "-dragger"), _defineProperty(_defineProperty({}, "".concat(splitBarPrefixCls, "-dragger-disabled"), !resizable), "".concat(splitBarPrefixCls, "-dragger-active"), active)),
103
162
  onMouseDown: onMouseDown,
104
163
  onTouchStart: onTouchStart
@@ -17,7 +17,7 @@ import classNames from 'classnames';
17
17
  import ResizeObserver from 'rc-resize-observer';
18
18
  import useEvent from 'rc-util/lib/hooks/useEvent';
19
19
  import { devUseWarning } from '../_util/warning';
20
- import { ConfigContext } from '../config-provider';
20
+ import { useComponentConfig } from '../config-provider/context';
21
21
  import useCSSVarCls from '../config-provider/hooks/useCSSVarCls';
22
22
  import useItems from './hooks/useItems';
23
23
  import useResizable from './hooks/useResizable';
@@ -36,11 +36,13 @@ var Splitter = function Splitter(props) {
36
36
  rootClassName = props.rootClassName,
37
37
  onResizeStart = props.onResizeStart,
38
38
  onResize = props.onResize,
39
- onResizeEnd = props.onResizeEnd;
40
- var _React$useContext = React.useContext(ConfigContext),
41
- getPrefixCls = _React$useContext.getPrefixCls,
42
- direction = _React$useContext.direction,
43
- splitter = _React$useContext.splitter;
39
+ onResizeEnd = props.onResizeEnd,
40
+ lazy = props.lazy;
41
+ var _useComponentConfig = useComponentConfig('splitter'),
42
+ getPrefixCls = _useComponentConfig.getPrefixCls,
43
+ direction = _useComponentConfig.direction,
44
+ contextClassName = _useComponentConfig.className,
45
+ contextStyle = _useComponentConfig.style;
44
46
  var prefixCls = getPrefixCls('splitter', customizePrefixCls);
45
47
  var rootCls = useCSSVarCls(prefixCls);
46
48
  var _useStyle = useStyle(prefixCls, rootCls),
@@ -96,8 +98,8 @@ var Splitter = function Splitter(props) {
96
98
  itemPtgMaxSizes = _useSizes2[4],
97
99
  updateSizes = _useSizes2[5];
98
100
  // ====================== Resizable =======================
99
- var resizableInfos = useResizable(items, itemPxSizes);
100
- var _useResize = useResize(items, resizableInfos, itemPtgSizes, containerSize, updateSizes),
101
+ var resizableInfos = useResizable(items, itemPxSizes, isRTL);
102
+ var _useResize = useResize(items, resizableInfos, itemPtgSizes, containerSize, updateSizes, isRTL),
101
103
  _useResize2 = _slicedToArray(_useResize, 5),
102
104
  onOffsetStart = _useResize2[0],
103
105
  onOffsetUpdate = _useResize2[1],
@@ -109,13 +111,19 @@ var Splitter = function Splitter(props) {
109
111
  onOffsetStart(index);
110
112
  onResizeStart === null || onResizeStart === void 0 || onResizeStart(itemPxSizes);
111
113
  });
112
- var onInternalResizeUpdate = useEvent(function (index, offset) {
114
+ var onInternalResizeUpdate = useEvent(function (index, offset, lazyEnd) {
113
115
  var nextSizes = onOffsetUpdate(index, offset);
114
- onResize === null || onResize === void 0 || onResize(nextSizes);
116
+ if (lazyEnd) {
117
+ onResizeEnd === null || onResizeEnd === void 0 || onResizeEnd(nextSizes);
118
+ } else {
119
+ onResize === null || onResize === void 0 || onResize(nextSizes);
120
+ }
115
121
  });
116
- var onInternalResizeEnd = useEvent(function () {
122
+ var onInternalResizeEnd = useEvent(function (lazyEnd) {
117
123
  onOffsetEnd();
118
- onResizeEnd === null || onResizeEnd === void 0 || onResizeEnd(itemPxSizes);
124
+ if (!lazyEnd) {
125
+ onResizeEnd === null || onResizeEnd === void 0 || onResizeEnd(itemPxSizes);
126
+ }
119
127
  });
120
128
  var onInternalCollapse = useEvent(function (index, type) {
121
129
  var nextSizes = onCollapse(index, type);
@@ -123,7 +131,7 @@ var Splitter = function Splitter(props) {
123
131
  onResizeEnd === null || onResizeEnd === void 0 || onResizeEnd(nextSizes);
124
132
  });
125
133
  // ======================== Styles ========================
126
- var containerClassName = classNames(prefixCls, className, "".concat(prefixCls, "-").concat(layout), _defineProperty({}, "".concat(prefixCls, "-rtl"), isRTL), rootClassName, splitter === null || splitter === void 0 ? void 0 : splitter.className, cssVarCls, rootCls, hashId);
134
+ var containerClassName = classNames(prefixCls, className, "".concat(prefixCls, "-").concat(layout), _defineProperty({}, "".concat(prefixCls, "-rtl"), isRTL), rootClassName, contextClassName, cssVarCls, rootCls, hashId);
127
135
  // ======================== Render ========================
128
136
  var maskCls = "".concat(prefixCls, "-mask");
129
137
  var stackSizes = React.useMemo(function () {
@@ -135,7 +143,7 @@ var Splitter = function Splitter(props) {
135
143
  }
136
144
  return mergedSizes;
137
145
  }, [itemPtgSizes]);
138
- var mergedStyle = _objectSpread(_objectSpread({}, splitter === null || splitter === void 0 ? void 0 : splitter.style), style);
146
+ var mergedStyle = _objectSpread(_objectSpread({}, contextStyle), style);
139
147
  return wrapCSSVar(_jsx(ResizeObserver, {
140
148
  onResize: onContainerResize,
141
149
  children: _jsxs("div", {
@@ -156,6 +164,7 @@ var Splitter = function Splitter(props) {
156
164
  var ariaMaxStart = (stackSizes[idx - 1] || 0) + itemPtgMaxSizes[idx];
157
165
  var ariaMaxEnd = (stackSizes[idx + 1] || 100) - itemPtgMinSizes[idx + 1];
158
166
  splitBar = _jsx(SplitBar, {
167
+ lazy: lazy,
159
168
  index: idx,
160
169
  active: movingIndex === idx,
161
170
  prefixCls: prefixCls,
@@ -167,15 +176,16 @@ var Splitter = function Splitter(props) {
167
176
  startCollapsible: resizableInfo.startCollapsible,
168
177
  endCollapsible: resizableInfo.endCollapsible,
169
178
  onOffsetStart: onInternalResizeStart,
170
- onOffsetUpdate: function onOffsetUpdate(index, offsetX, offsetY) {
179
+ onOffsetUpdate: function onOffsetUpdate(index, offsetX, offsetY, lazyEnd) {
171
180
  var offset = isVertical ? offsetY : offsetX;
172
181
  if (reverse) {
173
182
  offset = -offset;
174
183
  }
175
- onInternalResizeUpdate(index, offset);
184
+ onInternalResizeUpdate(index, offset, lazyEnd);
176
185
  },
177
186
  onOffsetEnd: onInternalResizeEnd,
178
- onCollapse: onInternalCollapse
187
+ onCollapse: onInternalCollapse,
188
+ containerSize: containerSize || 0
179
189
  });
180
190
  }
181
191
  return _jsxs(React.Fragment, {
@@ -22,9 +22,11 @@ function getCollapsible(collapsible) {
22
22
  /**
23
23
  * Convert `children` into `items`.
24
24
  */
25
- export default function useItems(children) {
25
+ function useItems(children) {
26
26
  var items = React.useMemo(function () {
27
- return toArray(children).filter(React.isValidElement).map(function (node) {
27
+ return toArray(children).filter(function (item) {
28
+ return /*#__PURE__*/React.isValidElement(item);
29
+ }).map(function (node) {
28
30
  var props = node.props;
29
31
  var collapsible = props.collapsible,
30
32
  restProps = _objectWithoutProperties(props, _excluded);
@@ -34,4 +36,5 @@ export default function useItems(children) {
34
36
  });
35
37
  }, [children]);
36
38
  return items;
37
- }
39
+ }
40
+ export default useItems;
@@ -1,5 +1,5 @@
1
1
  import * as React from 'react';
2
- export default function useResizable(items, pxSizes) {
2
+ export default function useResizable(items, pxSizes, isRTL) {
3
3
  return React.useMemo(function () {
4
4
  var resizeInfos = [];
5
5
  for (var i = 0; i < items.length - 1; i += 1) {
@@ -34,8 +34,8 @@ export default function useResizable(items, pxSizes) {
34
34
  prevCollapsible.end && prevSize === 0 && nextSize > 0;
35
35
  resizeInfos[i] = {
36
36
  resizable: mergedResizable,
37
- startCollapsible: !!startCollapsible,
38
- endCollapsible: !!endCollapsible
37
+ startCollapsible: !!(isRTL ? endCollapsible : startCollapsible),
38
+ endCollapsible: !!(isRTL ? startCollapsible : endCollapsible)
39
39
  };
40
40
  }
41
41
  return resizeInfos;
@@ -13,7 +13,7 @@ import { getPtg } from './useSizes';
13
13
  /**
14
14
  * Handle user drag resize logic.
15
15
  */
16
- export default function useResize(items, resizableInfos, percentSizes, containerSize, updateSizes) {
16
+ export default function useResize(items, resizableInfos, percentSizes, containerSize, updateSizes, isRTL) {
17
17
  var limitSizes = items.map(function (item) {
18
18
  return [item.min, item.max];
19
19
  });
@@ -33,6 +33,7 @@ export default function useResize(items, resizableInfos, percentSizes, container
33
33
  _React$useState2 = _slicedToArray(_React$useState, 2),
34
34
  cacheSizes = _React$useState2[0],
35
35
  setCacheSizes = _React$useState2[1];
36
+ var cacheCollapsedSize = React.useRef([]);
36
37
  /**
37
38
  * When start drag, check the direct is `start` or `end`.
38
39
  * This will handle when 2 splitter bar are in the same position.
@@ -111,14 +112,16 @@ export default function useResize(items, resizableInfos, percentSizes, container
111
112
  // ======================= Collapse =======================
112
113
  var onCollapse = function onCollapse(index, type) {
113
114
  var currentSizes = getPxSizes();
114
- var currentIndex = type === 'start' ? index : index + 1;
115
- var targetIndex = type === 'start' ? index + 1 : index;
115
+ var adjustedType = isRTL ? type === 'start' ? 'end' : 'start' : type;
116
+ var currentIndex = adjustedType === 'start' ? index : index + 1;
117
+ var targetIndex = adjustedType === 'start' ? index + 1 : index;
116
118
  var currentSize = currentSizes[currentIndex];
117
119
  var targetSize = currentSizes[targetIndex];
118
120
  if (currentSize !== 0 && targetSize !== 0) {
119
121
  // Collapse directly
120
122
  currentSizes[currentIndex] = 0;
121
123
  currentSizes[targetIndex] += currentSize;
124
+ cacheCollapsedSize.current[index] = currentSize;
122
125
  } else {
123
126
  var totalSize = currentSize + targetSize;
124
127
  var currentSizeMin = getLimitSize(limitSizes[currentIndex][0], 0);
@@ -127,9 +130,17 @@ export default function useResize(items, resizableInfos, percentSizes, container
127
130
  var targetSizeMax = getLimitSize(limitSizes[targetIndex][1], mergedContainerSize);
128
131
  var limitStart = Math.max(currentSizeMin, totalSize - targetSizeMax);
129
132
  var limitEnd = Math.min(currentSizeMax, totalSize - targetSizeMin);
130
- var halfOffset = (limitEnd - limitStart) / 2;
131
- currentSizes[currentIndex] -= halfOffset;
132
- currentSizes[targetIndex] += halfOffset;
133
+ var halfOffset = targetSizeMin || (limitEnd - limitStart) / 2;
134
+ var targetCacheCollapsedSize = cacheCollapsedSize.current[index];
135
+ var currentCacheCollapsedSize = totalSize - targetCacheCollapsedSize;
136
+ var shouldUseCache = targetCacheCollapsedSize && targetCacheCollapsedSize <= targetSizeMax && targetCacheCollapsedSize >= targetSizeMin && currentCacheCollapsedSize <= currentSizeMax && currentCacheCollapsedSize >= currentSizeMin;
137
+ if (shouldUseCache) {
138
+ currentSizes[targetIndex] = targetCacheCollapsedSize;
139
+ currentSizes[currentIndex] = currentCacheCollapsedSize;
140
+ } else {
141
+ currentSizes[currentIndex] -= halfOffset;
142
+ currentSizes[targetIndex] += halfOffset;
143
+ }
133
144
  }
134
145
  updateSizes(currentSizes);
135
146
  return currentSizes;
@@ -39,11 +39,22 @@ var genSplitterStyle = function genSplitterStyle(token) {
39
39
  splitTriggerSize = token.splitTriggerSize,
40
40
  controlItemBgHover = token.controlItemBgHover,
41
41
  controlItemBgActive = token.controlItemBgActive,
42
- controlItemBgActiveHover = token.controlItemBgActiveHover;
42
+ controlItemBgActiveHover = token.controlItemBgActiveHover,
43
+ prefixCls = token.prefixCls;
43
44
  var splitBarCls = "".concat(componentCls, "-bar");
44
45
  var splitMaskCls = "".concat(componentCls, "-mask");
45
46
  var splitPanelCls = "".concat(componentCls, "-panel");
46
47
  var halfTriggerSize = token.calc(splitTriggerSize).div(2).equal();
48
+ var splitterBarPreviewOffsetVar = "".concat(prefixCls, "-bar-preview-offset");
49
+ var splitterBarPreviewStyle = {
50
+ position: 'absolute',
51
+ background: token.colorPrimary,
52
+ opacity: 0.2,
53
+ pointerEvents: 'none',
54
+ transition: 'none',
55
+ zIndex: 1,
56
+ display: 'none'
57
+ };
47
58
  return _defineProperty({}, componentCls, _objectSpread(_objectSpread({}, resetComponent(token)), {}, _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({
48
59
  display: 'flex',
49
60
  width: '100%',
@@ -86,7 +97,7 @@ var genSplitterStyle = function genSplitterStyle(token) {
86
97
  display: 'none'
87
98
  }
88
99
  }))), "".concat(splitBarCls, "-collapse-bar"), _objectSpread(_objectSpread({}, centerStyle), {}, {
89
- zIndex: 1,
100
+ zIndex: token.zIndexPopupBase,
90
101
  background: controlItemBgHover,
91
102
  fontSize: token.fontSizeSM,
92
103
  borderRadius: token.borderRadiusXS,
@@ -96,6 +107,9 @@ var genSplitterStyle = function genSplitterStyle(token) {
96
107
  display: 'flex',
97
108
  alignItems: 'center',
98
109
  justifyContent: 'center',
110
+ '@media(hover:none)': {
111
+ opacity: 1
112
+ },
99
113
  // Hover
100
114
  '&:hover': {
101
115
  background: controlItemBgActive
@@ -118,9 +132,15 @@ var genSplitterStyle = function genSplitterStyle(token) {
118
132
  }
119
133
  }), '&-horizontal', _defineProperty({
120
134
  flexDirection: 'row'
121
- }, "> ".concat(splitBarCls), _defineProperty(_defineProperty({
135
+ }, "> ".concat(splitBarCls), _defineProperty(_defineProperty(_defineProperty({
122
136
  width: 0
123
- }, "".concat(splitBarCls, "-dragger"), {
137
+ }, "".concat(splitBarCls, "-preview"), _objectSpread(_objectSpread({
138
+ height: '100%',
139
+ width: splitBarSize
140
+ }, splitterBarPreviewStyle), {}, _defineProperty({}, "&".concat(splitBarCls, "-preview-active"), {
141
+ display: 'block',
142
+ transform: "translateX(var(--".concat(splitterBarPreviewOffsetVar, "))")
143
+ }))), "".concat(splitBarCls, "-dragger"), {
124
144
  cursor: 'col-resize',
125
145
  height: '100%',
126
146
  width: splitTriggerSize,
@@ -159,9 +179,15 @@ var genSplitterStyle = function genSplitterStyle(token) {
159
179
  }
160
180
  }))), '&-vertical', _defineProperty({
161
181
  flexDirection: 'column'
162
- }, "> ".concat(splitBarCls), _defineProperty(_defineProperty({
182
+ }, "> ".concat(splitBarCls), _defineProperty(_defineProperty(_defineProperty({
163
183
  height: 0
164
- }, "".concat(splitBarCls, "-dragger"), {
184
+ }, "".concat(splitBarCls, "-preview"), _objectSpread(_objectSpread({
185
+ height: splitBarSize,
186
+ width: '100%'
187
+ }, splitterBarPreviewStyle), {}, _defineProperty({}, "&".concat(splitBarCls, "-preview-active"), {
188
+ display: 'block',
189
+ transform: "translateY(var(--".concat(splitterBarPreviewOffsetVar, "))")
190
+ }))), "".concat(splitBarCls, "-dragger"), {
165
191
  cursor: 'row-resize',
166
192
  width: '100%',
167
193
  height: splitTriggerSize,
@@ -1,5 +1,5 @@
1
1
  function _regenerator() { /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/babel/babel/blob/main/packages/babel-helpers/LICENSE */ var e, t, r = "function" == typeof Symbol ? Symbol : {}, n = r.iterator || "@@iterator", o = r.toStringTag || "@@toStringTag"; function i(r, n, o, i) { var c = n && n.prototype instanceof Generator ? n : Generator, u = Object.create(c.prototype); return _regeneratorDefine2(u, "_invoke", function (r, n, o) { var i, c, u, f = 0, p = o || [], y = !1, G = { p: 0, n: 0, v: e, a: d, f: d.bind(e, 4), d: function d(t, r) { return i = t, c = 0, u = e, G.n = r, a; } }; function d(r, n) { for (c = r, u = n, t = 0; !y && f && !o && t < p.length; t++) { var o, i = p[t], d = G.p, l = i[2]; r > 3 ? (o = l === n) && (u = i[(c = i[4]) ? 5 : (c = 3, 3)], i[4] = i[5] = e) : i[0] <= d && ((o = r < 2 && d < i[1]) ? (c = 0, G.v = n, G.n = i[1]) : d < l && (o = r < 3 || i[0] > n || n > l) && (i[4] = r, i[5] = n, G.n = l, c = 0)); } if (o || r > 1) return a; throw y = !0, n; } return function (o, p, l) { if (f > 1) throw TypeError("Generator is already running"); for (y && 1 === p && d(p, l), c = p, u = l; (t = c < 2 ? e : u) || !y;) { i || (c ? c < 3 ? (c > 1 && (G.n = -1), d(c, u)) : G.n = u : G.v = u); try { if (f = 2, i) { if (c || (o = "next"), t = i[o]) { if (!(t = t.call(i, u))) throw TypeError("iterator result is not an object"); if (!t.done) return t; u = t.value, c < 2 && (c = 0); } else 1 === c && (t = i["return"]) && t.call(i), c < 2 && (u = TypeError("The iterator does not provide a '" + o + "' method"), c = 1); i = e; } else if ((t = (y = G.n < 0) ? u : r.call(n, G)) !== a) break; } catch (t) { i = e, c = 1, u = t; } finally { f = 1; } } return { value: t, done: y }; }; }(r, o, i), !0), u; } var a = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} t = Object.getPrototypeOf; var c = [][n] ? t(t([][n]())) : (_regeneratorDefine2(t = {}, n, function () { return this; }), t), u = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(c); function f(e) { return Object.setPrototypeOf ? Object.setPrototypeOf(e, GeneratorFunctionPrototype) : (e.__proto__ = GeneratorFunctionPrototype, _regeneratorDefine2(e, o, "GeneratorFunction")), e.prototype = Object.create(u), e; } return GeneratorFunction.prototype = GeneratorFunctionPrototype, _regeneratorDefine2(u, "constructor", GeneratorFunctionPrototype), _regeneratorDefine2(GeneratorFunctionPrototype, "constructor", GeneratorFunction), GeneratorFunction.displayName = "GeneratorFunction", _regeneratorDefine2(GeneratorFunctionPrototype, o, "GeneratorFunction"), _regeneratorDefine2(u), _regeneratorDefine2(u, o, "Generator"), _regeneratorDefine2(u, n, function () { return this; }), _regeneratorDefine2(u, "toString", function () { return "[object Generator]"; }), (_regenerator = function _regenerator() { return { w: i, m: f }; })(); }
2
- function _regeneratorDefine2(e, r, n, t) { var i = Object.defineProperty; try { i({}, "", {}); } catch (e) { i = 0; } _regeneratorDefine2 = function _regeneratorDefine(e, r, n, t) { if (r) i ? i(e, r, { value: n, enumerable: !t, configurable: !t, writable: !t }) : e[r] = n;else { var o = function o(r, n) { _regeneratorDefine2(e, r, function (e) { return this._invoke(r, n, e); }); }; o("next", 0), o("throw", 1), o("return", 2); } }, _regeneratorDefine2(e, r, n, t); }
2
+ function _regeneratorDefine2(e, r, n, t) { var i = Object.defineProperty; try { i({}, "", {}); } catch (e) { i = 0; } _regeneratorDefine2 = function _regeneratorDefine(e, r, n, t) { function o(r, n) { _regeneratorDefine2(e, r, function (e) { return this._invoke(r, n, e); }); } r ? i ? i(e, r, { value: n, enumerable: !t, configurable: !t, writable: !t }) : e[r] = n : (o("next", 0), o("throw", 1), o("return", 2)); }, _regeneratorDefine2(e, r, n, t); }
3
3
  function asyncGeneratorStep(n, t, e, r, o, a, c) { try { var i = n[a](c), u = i.value; } catch (n) { return void e(n); } i.done ? t(u) : Promise.resolve(u).then(r, o); }
4
4
  function _asyncToGenerator(n) { return function () { var t = this, e = arguments; return new Promise(function (r, o) { var a = n.apply(t, e); function _next(n) { asyncGeneratorStep(a, r, o, _next, _throw, "next", n); } function _throw(n) { asyncGeneratorStep(a, r, o, _next, _throw, "throw", n); } _next(void 0); }); }; }
5
5
  function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
@@ -41,7 +41,7 @@ var useCopyClick = function useCopyClick(_ref) {
41
41
  var _ref2 = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee(e) {
42
42
  var _copyConfig$onCopy, text, _t, _t2;
43
43
  return _regenerator().w(function (_context) {
44
- while (1) switch (_context.n) {
44
+ while (1) switch (_context.p = _context.n) {
45
45
  case 0:
46
46
  e === null || e === void 0 || e.preventDefault();
47
47
  e === null || e === void 0 || e.stopPropagation();
@@ -4,7 +4,7 @@ function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object
4
4
  function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
5
5
  function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
6
6
  function _regenerator() { /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/babel/babel/blob/main/packages/babel-helpers/LICENSE */ var e, t, r = "function" == typeof Symbol ? Symbol : {}, n = r.iterator || "@@iterator", o = r.toStringTag || "@@toStringTag"; function i(r, n, o, i) { var c = n && n.prototype instanceof Generator ? n : Generator, u = Object.create(c.prototype); return _regeneratorDefine2(u, "_invoke", function (r, n, o) { var i, c, u, f = 0, p = o || [], y = !1, G = { p: 0, n: 0, v: e, a: d, f: d.bind(e, 4), d: function d(t, r) { return i = t, c = 0, u = e, G.n = r, a; } }; function d(r, n) { for (c = r, u = n, t = 0; !y && f && !o && t < p.length; t++) { var o, i = p[t], d = G.p, l = i[2]; r > 3 ? (o = l === n) && (u = i[(c = i[4]) ? 5 : (c = 3, 3)], i[4] = i[5] = e) : i[0] <= d && ((o = r < 2 && d < i[1]) ? (c = 0, G.v = n, G.n = i[1]) : d < l && (o = r < 3 || i[0] > n || n > l) && (i[4] = r, i[5] = n, G.n = l, c = 0)); } if (o || r > 1) return a; throw y = !0, n; } return function (o, p, l) { if (f > 1) throw TypeError("Generator is already running"); for (y && 1 === p && d(p, l), c = p, u = l; (t = c < 2 ? e : u) || !y;) { i || (c ? c < 3 ? (c > 1 && (G.n = -1), d(c, u)) : G.n = u : G.v = u); try { if (f = 2, i) { if (c || (o = "next"), t = i[o]) { if (!(t = t.call(i, u))) throw TypeError("iterator result is not an object"); if (!t.done) return t; u = t.value, c < 2 && (c = 0); } else 1 === c && (t = i["return"]) && t.call(i), c < 2 && (u = TypeError("The iterator does not provide a '" + o + "' method"), c = 1); i = e; } else if ((t = (y = G.n < 0) ? u : r.call(n, G)) !== a) break; } catch (t) { i = e, c = 1, u = t; } finally { f = 1; } } return { value: t, done: y }; }; }(r, o, i), !0), u; } var a = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} t = Object.getPrototypeOf; var c = [][n] ? t(t([][n]())) : (_regeneratorDefine2(t = {}, n, function () { return this; }), t), u = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(c); function f(e) { return Object.setPrototypeOf ? Object.setPrototypeOf(e, GeneratorFunctionPrototype) : (e.__proto__ = GeneratorFunctionPrototype, _regeneratorDefine2(e, o, "GeneratorFunction")), e.prototype = Object.create(u), e; } return GeneratorFunction.prototype = GeneratorFunctionPrototype, _regeneratorDefine2(u, "constructor", GeneratorFunctionPrototype), _regeneratorDefine2(GeneratorFunctionPrototype, "constructor", GeneratorFunction), GeneratorFunction.displayName = "GeneratorFunction", _regeneratorDefine2(GeneratorFunctionPrototype, o, "GeneratorFunction"), _regeneratorDefine2(u), _regeneratorDefine2(u, o, "Generator"), _regeneratorDefine2(u, n, function () { return this; }), _regeneratorDefine2(u, "toString", function () { return "[object Generator]"; }), (_regenerator = function _regenerator() { return { w: i, m: f }; })(); }
7
- function _regeneratorDefine2(e, r, n, t) { var i = Object.defineProperty; try { i({}, "", {}); } catch (e) { i = 0; } _regeneratorDefine2 = function _regeneratorDefine(e, r, n, t) { if (r) i ? i(e, r, { value: n, enumerable: !t, configurable: !t, writable: !t }) : e[r] = n;else { var o = function o(r, n) { _regeneratorDefine2(e, r, function (e) { return this._invoke(r, n, e); }); }; o("next", 0), o("throw", 1), o("return", 2); } }, _regeneratorDefine2(e, r, n, t); }
7
+ function _regeneratorDefine2(e, r, n, t) { var i = Object.defineProperty; try { i({}, "", {}); } catch (e) { i = 0; } _regeneratorDefine2 = function _regeneratorDefine(e, r, n, t) { function o(r, n) { _regeneratorDefine2(e, r, function (e) { return this._invoke(r, n, e); }); } r ? i ? i(e, r, { value: n, enumerable: !t, configurable: !t, writable: !t }) : e[r] = n : (o("next", 0), o("throw", 1), o("return", 2)); }, _regeneratorDefine2(e, r, n, t); }
8
8
  function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
9
9
  function asyncGeneratorStep(n, t, e, r, o, a, c) { try { var i = n[a](c), u = i.value; } catch (n) { return void e(n); } i.done ? t(u) : Promise.resolve(u).then(r, o); }
10
10
  function _asyncToGenerator(n) { return function () { var t = this, e = arguments; return new Promise(function (r, o) { var a = n.apply(t, e); function _next(n) { asyncGeneratorStep(a, r, o, _next, _throw, "next", n); } function _throw(n) { asyncGeneratorStep(a, r, o, _next, _throw, "throw", n); } _next(void 0); }); }; }