@chaoswise/ui 3.1.8 → 3.1.10

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,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", "ResizeBarWidth", "resizeBarColor", "showCollapsedBtn", "onCollapse", "contentStyle", "siderStyle"];
2
+ var _excluded = ["children", "type", "Siderbar", "SiderWidth", "resizeBarColor", "showCollapsedBtn", "onCollapse", "contentStyle", "siderStyle"];
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; }
@@ -34,7 +34,6 @@ function AbreastLayout(_ref) {
34
34
  type = _ref.type,
35
35
  Siderbar = _ref.Siderbar,
36
36
  SiderWidth = _ref.SiderWidth,
37
- ResizeBarWidth = _ref.ResizeBarWidth,
38
37
  resizeBarColor = _ref.resizeBarColor,
39
38
  showCollapsedBtn = _ref.showCollapsedBtn,
40
39
  _onCollapse = _ref.onCollapse,
@@ -152,7 +151,6 @@ function AbreastLayout(_ref) {
152
151
  AbreastLayout.defaultProps = {
153
152
  SiderWidth: 232,
154
153
  // 侧边栏默认宽度
155
- ResizeBarWidth: 5,
156
154
  resizeBarColor: "#40A9FF",
157
155
  minWidth: 208,
158
156
  // 侧边栏拖拽最小宽度
@@ -182,10 +180,6 @@ AbreastLayout.propTypes = {
182
180
  * 侧边栏拖拽最大宽度,适用于可拖拽布局
183
181
  */
184
182
  maxWidth: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
185
- /**
186
- * 侧边栏拖拽条的宽度
187
- */
188
- ResizeBarWidth: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
189
183
  /**
190
184
  * 侧边栏拖拽条的颜色
191
185
  */
@@ -15,7 +15,6 @@ 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';
19
18
  function getValidNumber(num) {
20
19
  return typeof num === 'number' && !Number.isNaN(num) ? Math.round(num) : 0;
21
20
  }
@@ -33,21 +32,13 @@ var SplitBar = function SplitBar(props) {
33
32
  onOffsetStart = props.onOffsetStart,
34
33
  onOffsetUpdate = props.onOffsetUpdate,
35
34
  onOffsetEnd = props.onOffsetEnd,
36
- onCollapse = props.onCollapse,
37
- lazy = props.lazy,
38
- containerSize = props.containerSize;
35
+ onCollapse = props.onCollapse;
39
36
  var splitBarPrefixCls = "".concat(prefixCls, "-bar");
40
37
  // ======================== Resize ========================
41
38
  var _useState = useState(null),
42
39
  _useState2 = _slicedToArray(_useState, 2),
43
40
  startPos = _useState2[0],
44
41
  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;
51
42
  var onMouseDown = function onMouseDown(e) {
52
43
  if (resizable && e.currentTarget) {
53
44
  setStartPos([e.pageX, e.pageY]);
@@ -61,26 +52,6 @@ var SplitBar = function SplitBar(props) {
61
52
  onOffsetStart(index);
62
53
  }
63
54
  };
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
55
  React.useEffect(function () {
85
56
  if (startPos) {
86
57
  var onMouseMove = function onMouseMove(e) {
@@ -88,39 +59,23 @@ var SplitBar = function SplitBar(props) {
88
59
  pageY = e.pageY;
89
60
  var offsetX = pageX - startPos[0];
90
61
  var offsetY = pageY - startPos[1];
91
- if (lazy) {
92
- handleLazyMove(offsetX, offsetY);
93
- } else {
94
- onOffsetUpdate(index, offsetX, offsetY);
95
- }
62
+ onOffsetUpdate(index, offsetX, offsetY);
96
63
  };
97
64
  var onMouseUp = function onMouseUp() {
98
- if (lazy) {
99
- handleLazyEnd();
100
- } else {
101
- onOffsetEnd();
102
- }
103
65
  setStartPos(null);
66
+ onOffsetEnd();
104
67
  };
105
68
  var handleTouchMove = function handleTouchMove(e) {
106
69
  if (e.touches.length === 1) {
107
70
  var touch = e.touches[0];
108
71
  var offsetX = touch.pageX - startPos[0];
109
72
  var offsetY = touch.pageY - startPos[1];
110
- if (lazy) {
111
- handleLazyMove(offsetX, offsetY);
112
- } else {
113
- onOffsetUpdate(index, offsetX, offsetY);
114
- }
73
+ onOffsetUpdate(index, offsetX, offsetY);
115
74
  }
116
75
  };
117
76
  var handleTouchEnd = function handleTouchEnd() {
118
- if (lazy) {
119
- handleLazyEnd();
120
- } else {
121
- onOffsetEnd();
122
- }
123
77
  setStartPos(null);
78
+ onOffsetEnd();
124
79
  };
125
80
  window.addEventListener('touchmove', handleTouchMove);
126
81
  window.addEventListener('touchend', handleTouchEnd);
@@ -133,8 +88,7 @@ var SplitBar = function SplitBar(props) {
133
88
  window.removeEventListener('touchend', handleTouchEnd);
134
89
  };
135
90
  }
136
- }, [startPos, lazy, vertical, index, containerSize, ariaNow, ariaMin, ariaMax]);
137
- var transformStyle = _defineProperty({}, "--".concat(splitBarPrefixCls, "-preview-offset"), "".concat(constrainedOffset, "px"));
91
+ }, [startPos]);
138
92
  // ======================== Render ========================
139
93
  var StartIcon = vertical ? UpOutlined : LeftOutlined;
140
94
  var EndIcon = vertical ? DownOutlined : RightOutlined;
@@ -144,10 +98,7 @@ var SplitBar = function SplitBar(props) {
144
98
  "aria-valuenow": getValidNumber(ariaNow),
145
99
  "aria-valuemin": getValidNumber(ariaMin),
146
100
  "aria-valuemax": getValidNumber(ariaMax),
147
- children: [lazy && _jsx("div", {
148
- className: classNames("".concat(splitBarPrefixCls, "-preview"), _defineProperty({}, "".concat(splitBarPrefixCls, "-preview-active"), !!constrainedOffset)),
149
- style: transformStyle
150
- }), _jsx("div", {
101
+ children: [_jsx("div", {
151
102
  className: classNames("".concat(splitBarPrefixCls, "-dragger"), _defineProperty(_defineProperty({}, "".concat(splitBarPrefixCls, "-dragger-disabled"), !resizable), "".concat(splitBarPrefixCls, "-dragger-active"), active)),
152
103
  onMouseDown: onMouseDown,
153
104
  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 { useComponentConfig } from '../config-provider/context';
20
+ import { ConfigContext } from '../config-provider';
21
21
  import useCSSVarCls from '../config-provider/hooks/useCSSVarCls';
22
22
  import useItems from './hooks/useItems';
23
23
  import useResizable from './hooks/useResizable';
@@ -36,13 +36,11 @@ 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
- lazy = props.lazy;
41
- var _useComponentConfig = useComponentConfig('splitter'),
42
- getPrefixCls = _useComponentConfig.getPrefixCls,
43
- direction = _useComponentConfig.direction,
44
- contextClassName = _useComponentConfig.className,
45
- contextStyle = _useComponentConfig.style;
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;
46
44
  var prefixCls = getPrefixCls('splitter', customizePrefixCls);
47
45
  var rootCls = useCSSVarCls(prefixCls);
48
46
  var _useStyle = useStyle(prefixCls, rootCls),
@@ -98,8 +96,8 @@ var Splitter = function Splitter(props) {
98
96
  itemPtgMaxSizes = _useSizes2[4],
99
97
  updateSizes = _useSizes2[5];
100
98
  // ====================== Resizable =======================
101
- var resizableInfos = useResizable(items, itemPxSizes, isRTL);
102
- var _useResize = useResize(items, resizableInfos, itemPtgSizes, containerSize, updateSizes, isRTL),
99
+ var resizableInfos = useResizable(items, itemPxSizes);
100
+ var _useResize = useResize(items, resizableInfos, itemPtgSizes, containerSize, updateSizes),
103
101
  _useResize2 = _slicedToArray(_useResize, 5),
104
102
  onOffsetStart = _useResize2[0],
105
103
  onOffsetUpdate = _useResize2[1],
@@ -111,19 +109,13 @@ var Splitter = function Splitter(props) {
111
109
  onOffsetStart(index);
112
110
  onResizeStart === null || onResizeStart === void 0 || onResizeStart(itemPxSizes);
113
111
  });
114
- var onInternalResizeUpdate = useEvent(function (index, offset, lazyEnd) {
112
+ var onInternalResizeUpdate = useEvent(function (index, offset) {
115
113
  var nextSizes = onOffsetUpdate(index, offset);
116
- if (lazyEnd) {
117
- onResizeEnd === null || onResizeEnd === void 0 || onResizeEnd(nextSizes);
118
- } else {
119
- onResize === null || onResize === void 0 || onResize(nextSizes);
120
- }
114
+ onResize === null || onResize === void 0 || onResize(nextSizes);
121
115
  });
122
- var onInternalResizeEnd = useEvent(function (lazyEnd) {
116
+ var onInternalResizeEnd = useEvent(function () {
123
117
  onOffsetEnd();
124
- if (!lazyEnd) {
125
- onResizeEnd === null || onResizeEnd === void 0 || onResizeEnd(itemPxSizes);
126
- }
118
+ onResizeEnd === null || onResizeEnd === void 0 || onResizeEnd(itemPxSizes);
127
119
  });
128
120
  var onInternalCollapse = useEvent(function (index, type) {
129
121
  var nextSizes = onCollapse(index, type);
@@ -131,7 +123,7 @@ var Splitter = function Splitter(props) {
131
123
  onResizeEnd === null || onResizeEnd === void 0 || onResizeEnd(nextSizes);
132
124
  });
133
125
  // ======================== Styles ========================
134
- var containerClassName = classNames(prefixCls, className, "".concat(prefixCls, "-").concat(layout), _defineProperty({}, "".concat(prefixCls, "-rtl"), isRTL), rootClassName, contextClassName, cssVarCls, rootCls, hashId);
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);
135
127
  // ======================== Render ========================
136
128
  var maskCls = "".concat(prefixCls, "-mask");
137
129
  var stackSizes = React.useMemo(function () {
@@ -143,7 +135,7 @@ var Splitter = function Splitter(props) {
143
135
  }
144
136
  return mergedSizes;
145
137
  }, [itemPtgSizes]);
146
- var mergedStyle = _objectSpread(_objectSpread({}, contextStyle), style);
138
+ var mergedStyle = _objectSpread(_objectSpread({}, splitter === null || splitter === void 0 ? void 0 : splitter.style), style);
147
139
  return wrapCSSVar(_jsx(ResizeObserver, {
148
140
  onResize: onContainerResize,
149
141
  children: _jsxs("div", {
@@ -164,7 +156,6 @@ var Splitter = function Splitter(props) {
164
156
  var ariaMaxStart = (stackSizes[idx - 1] || 0) + itemPtgMaxSizes[idx];
165
157
  var ariaMaxEnd = (stackSizes[idx + 1] || 100) - itemPtgMinSizes[idx + 1];
166
158
  splitBar = _jsx(SplitBar, {
167
- lazy: lazy,
168
159
  index: idx,
169
160
  active: movingIndex === idx,
170
161
  prefixCls: prefixCls,
@@ -176,16 +167,15 @@ var Splitter = function Splitter(props) {
176
167
  startCollapsible: resizableInfo.startCollapsible,
177
168
  endCollapsible: resizableInfo.endCollapsible,
178
169
  onOffsetStart: onInternalResizeStart,
179
- onOffsetUpdate: function onOffsetUpdate(index, offsetX, offsetY, lazyEnd) {
170
+ onOffsetUpdate: function onOffsetUpdate(index, offsetX, offsetY) {
180
171
  var offset = isVertical ? offsetY : offsetX;
181
172
  if (reverse) {
182
173
  offset = -offset;
183
174
  }
184
- onInternalResizeUpdate(index, offset, lazyEnd);
175
+ onInternalResizeUpdate(index, offset);
185
176
  },
186
177
  onOffsetEnd: onInternalResizeEnd,
187
- onCollapse: onInternalCollapse,
188
- containerSize: containerSize || 0
178
+ onCollapse: onInternalCollapse
189
179
  });
190
180
  }
191
181
  return _jsxs(React.Fragment, {
@@ -1,5 +1,5 @@
1
1
  import * as React from 'react';
2
- export default function useResizable(items, pxSizes, isRTL) {
2
+ export default function useResizable(items, pxSizes) {
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, isRTL) {
34
34
  prevCollapsible.end && prevSize === 0 && nextSize > 0;
35
35
  resizeInfos[i] = {
36
36
  resizable: mergedResizable,
37
- startCollapsible: !!(isRTL ? endCollapsible : startCollapsible),
38
- endCollapsible: !!(isRTL ? startCollapsible : endCollapsible)
37
+ startCollapsible: !!startCollapsible,
38
+ endCollapsible: !!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, isRTL) {
16
+ export default function useResize(items, resizableInfos, percentSizes, containerSize, updateSizes) {
17
17
  var limitSizes = items.map(function (item) {
18
18
  return [item.min, item.max];
19
19
  });
@@ -33,7 +33,6 @@ 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([]);
37
36
  /**
38
37
  * When start drag, check the direct is `start` or `end`.
39
38
  * This will handle when 2 splitter bar are in the same position.
@@ -112,16 +111,14 @@ export default function useResize(items, resizableInfos, percentSizes, container
112
111
  // ======================= Collapse =======================
113
112
  var onCollapse = function onCollapse(index, type) {
114
113
  var currentSizes = getPxSizes();
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;
114
+ var currentIndex = type === 'start' ? index : index + 1;
115
+ var targetIndex = type === 'start' ? index + 1 : index;
118
116
  var currentSize = currentSizes[currentIndex];
119
117
  var targetSize = currentSizes[targetIndex];
120
118
  if (currentSize !== 0 && targetSize !== 0) {
121
119
  // Collapse directly
122
120
  currentSizes[currentIndex] = 0;
123
121
  currentSizes[targetIndex] += currentSize;
124
- cacheCollapsedSize.current[index] = currentSize;
125
122
  } else {
126
123
  var totalSize = currentSize + targetSize;
127
124
  var currentSizeMin = getLimitSize(limitSizes[currentIndex][0], 0);
@@ -130,17 +127,9 @@ export default function useResize(items, resizableInfos, percentSizes, container
130
127
  var targetSizeMax = getLimitSize(limitSizes[targetIndex][1], mergedContainerSize);
131
128
  var limitStart = Math.max(currentSizeMin, totalSize - targetSizeMax);
132
129
  var limitEnd = Math.min(currentSizeMax, totalSize - targetSizeMin);
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
- }
130
+ var halfOffset = (limitEnd - limitStart) / 2;
131
+ currentSizes[currentIndex] -= halfOffset;
132
+ currentSizes[targetIndex] += halfOffset;
144
133
  }
145
134
  updateSizes(currentSizes);
146
135
  return currentSizes;
@@ -39,22 +39,11 @@ var genSplitterStyle = function genSplitterStyle(token) {
39
39
  splitTriggerSize = token.splitTriggerSize,
40
40
  controlItemBgHover = token.controlItemBgHover,
41
41
  controlItemBgActive = token.controlItemBgActive,
42
- controlItemBgActiveHover = token.controlItemBgActiveHover,
43
- prefixCls = token.prefixCls;
42
+ controlItemBgActiveHover = token.controlItemBgActiveHover;
44
43
  var splitBarCls = "".concat(componentCls, "-bar");
45
44
  var splitMaskCls = "".concat(componentCls, "-mask");
46
45
  var splitPanelCls = "".concat(componentCls, "-panel");
47
46
  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
- };
58
47
  return _defineProperty({}, componentCls, _objectSpread(_objectSpread({}, resetComponent(token)), {}, _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({
59
48
  display: 'flex',
60
49
  width: '100%',
@@ -97,7 +86,7 @@ var genSplitterStyle = function genSplitterStyle(token) {
97
86
  display: 'none'
98
87
  }
99
88
  }))), "".concat(splitBarCls, "-collapse-bar"), _objectSpread(_objectSpread({}, centerStyle), {}, {
100
- zIndex: token.zIndexPopupBase,
89
+ zIndex: 1,
101
90
  background: controlItemBgHover,
102
91
  fontSize: token.fontSizeSM,
103
92
  borderRadius: token.borderRadiusXS,
@@ -107,9 +96,6 @@ var genSplitterStyle = function genSplitterStyle(token) {
107
96
  display: 'flex',
108
97
  alignItems: 'center',
109
98
  justifyContent: 'center',
110
- '@media(hover:none)': {
111
- opacity: 1
112
- },
113
99
  // Hover
114
100
  '&:hover': {
115
101
  background: controlItemBgActive
@@ -132,15 +118,9 @@ var genSplitterStyle = function genSplitterStyle(token) {
132
118
  }
133
119
  }), '&-horizontal', _defineProperty({
134
120
  flexDirection: 'row'
135
- }, "> ".concat(splitBarCls), _defineProperty(_defineProperty(_defineProperty({
121
+ }, "> ".concat(splitBarCls), _defineProperty(_defineProperty({
136
122
  width: 0
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"), {
123
+ }, "".concat(splitBarCls, "-dragger"), {
144
124
  cursor: 'col-resize',
145
125
  height: '100%',
146
126
  width: splitTriggerSize,
@@ -179,15 +159,9 @@ var genSplitterStyle = function genSplitterStyle(token) {
179
159
  }
180
160
  }))), '&-vertical', _defineProperty({
181
161
  flexDirection: 'column'
182
- }, "> ".concat(splitBarCls), _defineProperty(_defineProperty(_defineProperty({
162
+ }, "> ".concat(splitBarCls), _defineProperty(_defineProperty({
183
163
  height: 0
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"), {
164
+ }, "".concat(splitBarCls, "-dragger"), {
191
165
  cursor: 'row-resize',
192
166
  width: '100%',
193
167
  height: splitTriggerSize,
@@ -11,11 +11,13 @@ var prepareComponentToken = function prepareComponentToken(token) {
11
11
  var genCustomButtonStyle = function genCustomButtonStyle(token) {
12
12
  var prefixCls = token.antCls;
13
13
  var componentCls = "".concat(prefixCls, "-btn");
14
- return _defineProperty({}, "".concat(componentCls).concat(componentCls, "-wrapper"), _defineProperty(_defineProperty(_defineProperty({
14
+ return _defineProperty({}, "".concat(componentCls).concat(componentCls, "-wrapper"), _defineProperty(_defineProperty(_defineProperty(_defineProperty({
15
15
  display: "inline-flex !important",
16
16
  alignItems: "center",
17
17
  justifyContent: "center"
18
- }, "&".concat(componentCls, "-text,&").concat(componentCls, "-link"), {
18
+ }, "".concat(componentCls, "-icon"), {
19
+ display: "inline-flex"
20
+ }), "&".concat(componentCls, "-text,&").concat(componentCls, "-link"), {
19
21
  padding: "0 !important",
20
22
  border: "none !important",
21
23
  height: "20px",
@@ -1,13 +1,8 @@
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
- import _Checkbox from "@chaoswise/ui/lib/Checkbox";
3
2
  import _Tooltip from "@chaoswise/ui/lib/Tooltip";
4
3
  import _Tag from "@chaoswise/ui/lib/Tag";
5
- var _excluded = ["selectLabel", "label", "prefix", "defaultValue", "mode", "value", "labelInValue", "onChange", "onSelect", "onDeselect", "onDragEnd", "tagRender", "allowDrag", "maxTagCount", "showCheckbox", "tagLabelRender", "maxTagTextLength", "dropdownRender", "multipleOptions", "children", "maxCount"];
4
+ var _excluded = ["selectLabel", "label", "prefix", "defaultValue", "mode", "value", "labelInValue", "onChange", "onSelect", "onDeselect", "onDragEnd", "tagRender", "allowDrag", "maxTagCount", "tagLabelRender", "maxTagTextLength", "dropdownRender", "children", "maxCount"];
6
5
  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); }
7
- function _toConsumableArray(r) { return _arrayWithoutHoles(r) || _iterableToArray(r) || _unsupportedIterableToArray(r) || _nonIterableSpread(); }
8
- function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
9
- function _iterableToArray(r) { if ("undefined" != typeof Symbol && null != r[Symbol.iterator] || null != r["@@iterator"]) return Array.from(r); }
10
- function _arrayWithoutHoles(r) { if (Array.isArray(r)) return _arrayLikeToArray(r); }
11
6
  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; }
12
7
  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; }
13
8
  function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
@@ -31,41 +26,8 @@ import { DndProvider } from "react-dnd";
31
26
  import { cloneComProps } from "../utils";
32
27
  import update from "immutability-helper";
33
28
  import PropTypes from "prop-types";
34
- import { useIntl } from "../locales";
35
29
  import useStyle from "./index.style";
36
30
 
37
- /**
38
- * 多选模式的默认配置选项
39
- * @type {Object}
40
- * @property {boolean} showCheckbox - 是否显示复选框
41
- * @property {boolean} showSelectAll - 是否显示全选选项
42
- * @property {boolean} isCheckboxMultipleHasSelectAll - 复选框多选模式是否包含全选功能
43
- */
44
- var DEFAULT_MULTIPLE_OPTIONS = {
45
- showCheckbox: false,
46
- showSelectAll: true,
47
- isCheckboxMultipleHasSelectAll: true
48
- };
49
-
50
- /**
51
- * 安全获取嵌套对象属性值的辅助函数
52
- * @param {Object} obj - 目标对象
53
- * @param {Array} path - 属性路径数组
54
- * @param {*} defaultValue - 默认值
55
- * @returns {*} 获取到的值或默认值
56
- */
57
- var getNestedValue = function getNestedValue(obj, path) {
58
- var defaultValue = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : null;
59
- try {
60
- var _path$reduce;
61
- return (_path$reduce = path.reduce(function (current, key) {
62
- return current === null || current === void 0 ? void 0 : current[key];
63
- }, obj)) !== null && _path$reduce !== void 0 ? _path$reduce : defaultValue;
64
- } catch (_unused) {
65
- return defaultValue;
66
- }
67
- };
68
-
69
31
  /**
70
32
  * 检查是否为有效数组(非空数组)的辅助函数
71
33
  * @param {*} arr - 待检查的值
@@ -77,7 +39,7 @@ var isValidArray = function isValidArray(arr) {
77
39
 
78
40
  /**
79
41
  * CWSelect 组件 - 增强版的 Select 选择器
80
- * 支持多选、拖拽排序、复选框模式、标签自定义等功能
42
+ * 支持多选、拖拽排序、标签自定义等功能
81
43
  *
82
44
  * @param {Object} props - 组件属性
83
45
  * @param {React.Ref} ref - 组件引用
@@ -104,19 +66,12 @@ var CWSelect = /*#__PURE__*/forwardRef(function (props, ref) {
104
66
  _props$allowDrag = props.allowDrag,
105
67
  allowDrag = _props$allowDrag === void 0 ? false : _props$allowDrag,
106
68
  maxTagCount = props.maxTagCount,
107
- _props$showCheckbox = props.showCheckbox,
108
- showCheckbox = _props$showCheckbox === void 0 ? false : _props$showCheckbox,
109
69
  tagLabelRender = props.tagLabelRender,
110
70
  maxTagTextLength = props.maxTagTextLength,
111
71
  dropdownRender = props.dropdownRender,
112
- _props$multipleOption = props.multipleOptions,
113
- multipleOptions = _props$multipleOption === void 0 ? DEFAULT_MULTIPLE_OPTIONS : _props$multipleOption,
114
72
  children = props.children,
115
73
  maxCount = props.maxCount,
116
74
  rest = _objectWithoutProperties(props, _excluded);
117
-
118
- // 获取国际化和样式相关的 hooks
119
- var intl = useIntl();
120
75
  var _useConfigContext = useConfigContext(),
121
76
  getPrefixCls = _useConfigContext.getPrefixCls;
122
77
  var prefixCls = getPrefixCls("select");
@@ -148,22 +103,6 @@ var CWSelect = /*#__PURE__*/forwardRef(function (props, ref) {
148
103
  return prefix || label || selectLabel;
149
104
  }, [prefix, label, selectLabel]);
150
105
 
151
- /**
152
- * 判断是否应该显示复选框
153
- * 条件:多选模式 && (showCheckbox 为 true 或 multipleOptions.showCheckbox 为 true)
154
- */
155
- var shouldShowCheckbox = useMemo(function () {
156
- return mode === "multiple" && (showCheckbox || multipleOptions.showCheckbox);
157
- }, [mode, showCheckbox, multipleOptions.showCheckbox]);
158
-
159
- /**
160
- * 判断是否应该显示全选功能
161
- * 条件:配置允许全选 && 没有设置最大选择数量 && 显示复选框
162
- */
163
- var shouldShowCheckAll = useMemo(function () {
164
- return multipleOptions.isCheckboxMultipleHasSelectAll && !("maxCount" in props) && shouldShowCheckbox;
165
- }, [multipleOptions.isCheckboxMultipleHasSelectAll, props, shouldShowCheckbox]);
166
-
167
106
  /**
168
107
  * 从数组值构建键值索引映射的函数
169
108
  * @param {Array|*} _value - 输入值
@@ -196,7 +135,7 @@ var CWSelect = /*#__PURE__*/forwardRef(function (props, ref) {
196
135
  return key !== undefined && key !== null;
197
136
  });
198
137
  keyIndexMapRef.current = newKeyIndexMap;
199
- // 使用 setTimeout 避免同步更新导致的性能问题
138
+ // fixed 节点详情拿不到
200
139
  setTimeout(function () {
201
140
  return setAllInstance(allKeys);
202
141
  }, 0);
@@ -374,161 +313,6 @@ var CWSelect = /*#__PURE__*/forwardRef(function (props, ref) {
374
313
  return null;
375
314
  }, [allowDrag, maxTagCount, renderTag, moveNode, tagDropdownOverlay, prefixCls, rest.disabled, handlePreventMouseDown, activeKey, allOptions, handleChange, onDeselect, maxTagTextLength, tagLabelRender]);
376
315
 
377
- /**
378
- * 处理全选/取消全选的回调函数
379
- * @param {Event} e - 复选框事件
380
- * @param {Array} currentDataSource - 当前数据源
381
- * @param {Array} originDataSource - 原始数据源
382
- */
383
- var handleCheckAllChange = useCallback(function (e, currentDataSource, originDataSource) {
384
- if (!isValidArray(currentDataSource)) return;
385
- var isChecked = e.target.checked;
386
-
387
- // 获取原始激活的数据源
388
- var originActiveDataSource = originDataSource.filter(function (item) {
389
- return activeKey.some(function (activeItem) {
390
- return labelInValue ? (activeItem === null || activeItem === void 0 ? void 0 : activeItem.value) === (item === null || item === void 0 ? void 0 : item.value) : activeItem === (item === null || item === void 0 ? void 0 : item.value);
391
- });
392
- });
393
-
394
- // 转换当前数据源为键值格式
395
- var currentDataSourceKeys = currentDataSource.map(function (item) {
396
- return labelInValue ? {
397
- value: item === null || item === void 0 ? void 0 : item.value,
398
- label: item === null || item === void 0 ? void 0 : item.children
399
- } : item === null || item === void 0 ? void 0 : item.value;
400
- }).filter(Boolean);
401
- var newActiveKey = [];
402
- var newActiveDataSource = [];
403
- if (isChecked) {
404
- // 全选:合并原有选中项和当前数据源
405
- newActiveDataSource = Array.from(new Set([].concat(_toConsumableArray(originActiveDataSource), _toConsumableArray(currentDataSource))));
406
- newActiveKey = Array.from(new Set([].concat(_toConsumableArray(activeKey), _toConsumableArray(currentDataSourceKeys))));
407
- onSelect(currentDataSourceKeys, currentDataSource);
408
- } else {
409
- // 取消全选:从原有选中项中移除当前数据源
410
- newActiveDataSource = originActiveDataSource.filter(function (item) {
411
- return !currentDataSource.some(function (current) {
412
- return (current === null || current === void 0 ? void 0 : current.value) === (item === null || item === void 0 ? void 0 : item.value);
413
- });
414
- });
415
- newActiveKey = activeKey.filter(function (item) {
416
- return !currentDataSourceKeys.some(function (current) {
417
- return labelInValue ? (item === null || item === void 0 ? void 0 : item.value) === (current === null || current === void 0 ? void 0 : current.value) : item === current;
418
- });
419
- });
420
- onDeselect(currentDataSourceKeys, currentDataSource);
421
- }
422
- handleChange(newActiveKey, newActiveDataSource);
423
- }, [activeKey, labelInValue, onSelect, onDeselect, handleChange]);
424
-
425
- /**
426
- * 自定义下拉框渲染函数
427
- * 处理复选框模式下的全选功能和空状态显示
428
- * @param {React.ReactNode} originNode - 原始下拉框节点
429
- * @returns {React.ReactNode} 自定义渲染的下拉框内容
430
- */
431
- var customDropdownRender = useCallback(function (originNode) {
432
- // 从 React 内部属性中获取下拉框的状态数据
433
- var memoizedProps = getNestedValue(originNode, ["_owner", "return", "memoizedProps", "value"], {});
434
- var flattenOptions = memoizedProps.flattenOptions || [];
435
- var originDataSource = memoizedProps.options || [];
436
- var activeValues = Array.from(memoizedProps.rawValues || []);
437
-
438
- // 提取有效的数据源(过滤掉分组选项)
439
- var dataSource = flattenOptions.filter(function (item) {
440
- return item && Object.prototype.hasOwnProperty.call(item, "groupOption");
441
- }).map(function (item) {
442
- return item.data;
443
- }).filter(Boolean);
444
-
445
- // 空状态处理:没有数据时显示空状态提示
446
- if (!isValidArray(dataSource)) {
447
- var emptyContent = rest.notFoundContent || /*#__PURE__*/React.createElement("div", {
448
- className: "".concat(prefixCls, "-show-checkbox-empty")
449
- }, intl.get("812f44fc-ed3c-4bd3-8ad5-35cd2996c5ae").d("未查找到任何结果"));
450
- return emptyContent;
451
- }
452
-
453
- // 计算全选状态
454
- var dataSourceValues = dataSource.map(function (item) {
455
- return item === null || item === void 0 ? void 0 : item.value;
456
- }).filter(Boolean);
457
- var filterActiveValues = dataSourceValues.filter(function (value) {
458
- return activeValues.includes(value);
459
- });
460
- var isAllSelected = filterActiveValues.length === dataSource.length && dataSource.length > 0;
461
- var isIndeterminate = filterActiveValues.length > 0 && !isAllSelected;
462
- return /*#__PURE__*/React.createElement(React.Fragment, null, shouldShowCheckAll && /*#__PURE__*/React.createElement("div", {
463
- className: "".concat(prefixCls, "-check-all"),
464
- onMouseDown: handlePreventMouseDown
465
- }, /*#__PURE__*/React.createElement(_Checkbox, {
466
- indeterminate: isIndeterminate // 半选状态
467
- ,
468
- checked: isAllSelected // 全选状态
469
- ,
470
- onChange: function onChange(e) {
471
- return handleCheckAllChange(e, dataSource, originDataSource);
472
- },
473
- style: {
474
- width: "100%"
475
- }
476
- }, intl.get("3991a1d0-65a8-45ca-94a4-f89fbd9f8555").d("全选"), "\uFF08", filterActiveValues.length, "/", dataSource.length, "\uFF09")), originNode);
477
- }, [shouldShowCheckAll, prefixCls, handlePreventMouseDown, handleCheckAllChange, intl, rest.notFoundContent]);
478
-
479
- /**
480
- * 渲染复选框选项的函数
481
- * @param {React.ReactElement} child - 子选项元素
482
- * @returns {React.ReactElement|null} 渲染的复选框选项
483
- */
484
- var renderCheckboxItem = useCallback(function (child) {
485
- if (!(child !== null && child !== void 0 && child.props)) return null;
486
- var childValue = child.props.value;
487
- // 判断当前选项是否被选中
488
- var isChecked = labelInValue ? activeKey.some(function (item) {
489
- return (item === null || item === void 0 ? void 0 : item.value) === childValue;
490
- }) : activeKey.includes(childValue);
491
- return /*#__PURE__*/React.createElement("div", {
492
- key: child.key || childValue,
493
- className: "".concat(prefixCls, "-checkbox-item")
494
- }, /*#__PURE__*/React.createElement(_Checkbox, {
495
- disabled: child.props.disabled,
496
- checked: isChecked
497
- }), /*#__PURE__*/React.createElement("span", {
498
- className: "".concat(prefixCls, "-item-children")
499
- }, child.props.children));
500
- }, [activeKey, labelInValue, prefixCls]);
501
-
502
- /**
503
- * 处理子元素,在复选框模式下为每个选项添加复选框
504
- */
505
- var processedChildren = useMemo(function () {
506
- if (!shouldShowCheckbox || !children) return children;
507
- return React.Children.map(children, function (child) {
508
- var _child$props, _child$props2;
509
- if (!child) return null;
510
-
511
- // 处理选项组(OptGroup)
512
- if (Array.isArray((_child$props = child.props) === null || _child$props === void 0 ? void 0 : _child$props.children)) {
513
- var groupChildren = React.Children.map(child.props.children, function (optGroupChild) {
514
- var _optGroupChild$props;
515
- if (!optGroupChild) return null;
516
- return /*#__PURE__*/React.cloneElement(optGroupChild, {
517
- key: optGroupChild.key || ((_optGroupChild$props = optGroupChild.props) === null || _optGroupChild$props === void 0 ? void 0 : _optGroupChild$props.value)
518
- }, renderCheckboxItem(optGroupChild));
519
- }).filter(Boolean);
520
- return /*#__PURE__*/React.cloneElement(child, {
521
- key: child.key
522
- }, groupChildren);
523
- }
524
-
525
- // 处理普通选项
526
- return /*#__PURE__*/React.cloneElement(child, {
527
- key: child.key || ((_child$props2 = child.props) === null || _child$props2 === void 0 ? void 0 : _child$props2.value)
528
- }, renderCheckboxItem(child));
529
- }).filter(Boolean);
530
- }, [shouldShowCheckbox, children, renderCheckboxItem]);
531
-
532
316
  /**
533
317
  * 计算最终的 value 值
534
318
  * 受控模式:使用传入的 value
@@ -538,8 +322,8 @@ var CWSelect = /*#__PURE__*/forwardRef(function (props, ref) {
538
322
  if ("value" in props) {
539
323
  return value;
540
324
  }
541
- return shouldShowCheckbox || allowDrag ? activeKey : value;
542
- }, [props, value, shouldShowCheckbox, allowDrag, activeKey]);
325
+ return allowDrag ? activeKey : value;
326
+ }, [props, value, allowDrag, activeKey]);
543
327
 
544
328
  // 渲染组件
545
329
  return wrapCSSVar(/*#__PURE__*/React.createElement(DndProvider, {
@@ -555,10 +339,10 @@ var CWSelect = /*#__PURE__*/forwardRef(function (props, ref) {
555
339
  menuItemSelectedIcon: null,
556
340
  onSelect: onSelect,
557
341
  onDeselect: onDeselect,
558
- dropdownRender: dropdownRender !== null && dropdownRender !== void 0 ? dropdownRender : shouldShowCheckbox ? customDropdownRender : null,
342
+ dropdownRender: dropdownRender,
559
343
  labelInValue: labelInValue,
560
344
  maxCount: maxCount
561
- }, rest), processedChildren)));
345
+ }, rest), children)));
562
346
  });
563
347
 
564
348
  // PropTypes 类型定义
@@ -601,22 +385,11 @@ CWSelect.propTypes = {
601
385
  // 是否允许拖拽
602
386
  onDragEnd: PropTypes.func,
603
387
  // 拖拽结束回调
604
- showCheckbox: PropTypes.bool,
605
- // 是否显示复选框
606
388
  listHeight: PropTypes.number,
607
389
  // 列表高度
608
390
  selectLabel: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
609
391
  // 选择器标签
610
- label: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
611
- // 标签
612
- multipleOptions: PropTypes.shape({
613
- // 多选配置选项
614
- showCheckbox: PropTypes.bool,
615
- // 是否显示复选框
616
- showSelectAll: PropTypes.bool,
617
- // 是否显示全选
618
- isCheckboxMultipleHasSelectAll: PropTypes.bool // 复选框多选是否包含全选
619
- })
392
+ label: PropTypes.oneOfType([PropTypes.string, PropTypes.node]) // 标签
620
393
  };
621
394
 
622
395
  // 设置组件显示名称
@@ -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 = ["size", "expandIcon", "bordered", "className", "expandIconPosition", "ghost", "isHasBackground"];
2
+ var _excluded = ["size", "expandIcon", "className", "expandIconPosition", "ghost", "isHasBackground"];
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 _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
5
5
  function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
@@ -23,7 +23,6 @@ import useStyle from "./index.style";
23
23
  var CWCollapse = /*#__PURE__*/forwardRef(function (props, ref) {
24
24
  var size = props.size,
25
25
  expandIcon = props.expandIcon,
26
- bordered = props.bordered,
27
26
  className = props.className,
28
27
  expandIconPosition = props.expandIconPosition,
29
28
  ghost = props.ghost,
@@ -220,9 +220,7 @@ function CWHeader(_ref) {
220
220
  component: homeIconSvg
221
221
  })) : null, showTopNavigation && (topNavigationType === "fold" ? /*#__PURE__*/React.createElement(_Dropdown, {
222
222
  trigger: topNavigationTrigger,
223
- overlayClassName: classnames("".concat(prefixCls, "-cw-header-dropdown-out-wrapper"), {
224
- topNavigationClassName: topNavigationClassName
225
- }),
223
+ overlayClassName: classnames("".concat(prefixCls, "-cw-header-dropdown-out-wrapper"), topNavigationClassName),
226
224
  overlay: renderTopNavigationMenu(),
227
225
  open: visible,
228
226
  onOpenChange: function onOpenChange(pre) {
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@chaoswise/ui",
3
3
  "packageName": "chaoswiseUI",
4
- "version": "3.1.8",
4
+ "version": "3.1.10",
5
5
  "description": "公共UI库",
6
6
  "keywords": [
7
7
  "ui",