@kdcloudjs/kdesign 1.8.64 → 1.8.70

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.
@@ -22,6 +22,7 @@ export interface PopperProps {
22
22
  trigger?: TriggerType | Array<TriggerType>;
23
23
  clickToClose?: boolean;
24
24
  isMobile?: boolean;
25
+ triggerScroll?: boolean;
25
26
  onTrigger?: (trigger: TriggerType) => void;
26
27
  onVisibleChange?: (visible: boolean) => void;
27
28
  getTriggerElement?: (locatorNode: HTMLElement) => HTMLElement;
@@ -149,6 +149,8 @@ function usePopper(locatorElement, popperElement, props) {
149
149
  _props$clickToClose = props.clickToClose,
150
150
  clickToClose = _props$clickToClose === void 0 ? true : _props$clickToClose,
151
151
  isMobile = props.isMobile,
152
+ _props$triggerScroll = props.triggerScroll,
153
+ triggerScroll = _props$triggerScroll === void 0 ? false : _props$triggerScroll,
152
154
  _props$getTriggerElem = props.getTriggerElement,
153
155
  getTriggerElement = _props$getTriggerElem === void 0 ? function (locatorNode) {
154
156
  return locatorNode;
@@ -650,10 +652,16 @@ function usePopper(locatorElement, popperElement, props) {
650
652
  useEffect(function () {
651
653
  if (visible) {
652
654
  var scrollAlign = debounce(function (e) {
653
- var isPopperScroll = e.target === popperRef.current || popperRef.current.contains(e.target);
654
- if (scrollHidden && !isPopperScroll) {
655
+ var target = e.target;
656
+ var popperNode = popperRef.current;
657
+ var realDom = getRealDom(locatorRef, locatorElement);
658
+ var triggerNode = realDom ? getTriggerElement(realDom) : null;
659
+ var isPopperScroll = popperNode && target && (target === popperNode || popperNode.contains(target));
660
+ var isTriggerScroll = triggerNode && target && (target === triggerNode || triggerNode.contains(target)) && triggerScroll;
661
+ if (scrollHidden && !isPopperScroll && !isTriggerScroll) {
655
662
  props.visible === undefined && setVisible(false);
656
663
  onVisibleChange && onVisibleChange(false);
664
+ return;
657
665
  }
658
666
  alignPopper();
659
667
  }, 10);
@@ -664,7 +672,7 @@ function usePopper(locatorElement, popperElement, props) {
664
672
  document.removeEventListener('scroll', scrollAlign, true);
665
673
  };
666
674
  }
667
- }, [alignPopper, exist, onVisibleChange, popperNode, props.visible, scrollHidden, locatorNode, visible, popperRef]);
675
+ }, [visible, alignPopper, scrollHidden, onVisibleChange, props.visible, popperRef, locatorRef, locatorElement, getTriggerElement]);
668
676
  useEffect(function () {
669
677
  var realDom = getRealDom(locatorRef, locatorElement);
670
678
  var triggerNode = getTriggerElement(realDom);
@@ -290,11 +290,6 @@
290
290
  flex: 1;
291
291
  }
292
292
  .kd-dropdown-mobile .kd-dropdown-menu .kd-dropdown-menu-item span {
293
- overflow: hidden;
294
- text-overflow: ellipsis;
295
- display: -webkit-box;
296
293
  -webkit-line-clamp: 1;
297
- -webkit-box-orient: vertical;
298
- word-break: break-all;
299
294
  }
300
295
  /*! rtl:end:ignore */
@@ -132,8 +132,7 @@
132
132
  flex: 1;
133
133
  .@{dropdown-prefix-cls}-menu-item {
134
134
  span {
135
- .multipleEllipsis(1);
136
- word-break: break-all;
135
+ -webkit-line-clamp: 1;
137
136
  }
138
137
  }
139
138
  }
@@ -914,6 +914,7 @@ var InternalSelect = function InternalSelect(props, ref) {
914
914
  popperStyle: catchStyle(),
915
915
  defaultVisible: optionShow,
916
916
  visible: optionShow,
917
+ triggerScroll: true,
917
918
  onVisibleChange: handleVisibleChange,
918
919
  clickToClose: !(isShowSearch && searchValue)
919
920
  });
@@ -22,6 +22,7 @@ export interface PopperProps {
22
22
  trigger?: TriggerType | Array<TriggerType>;
23
23
  clickToClose?: boolean;
24
24
  isMobile?: boolean;
25
+ triggerScroll?: boolean;
25
26
  onTrigger?: (trigger: TriggerType) => void;
26
27
  onVisibleChange?: (visible: boolean) => void;
27
28
  getTriggerElement?: (locatorNode: HTMLElement) => HTMLElement;
@@ -163,6 +163,8 @@ function usePopper(locatorElement, popperElement, props) {
163
163
  _props$clickToClose = props.clickToClose,
164
164
  clickToClose = _props$clickToClose === void 0 ? true : _props$clickToClose,
165
165
  isMobile = props.isMobile,
166
+ _props$triggerScroll = props.triggerScroll,
167
+ triggerScroll = _props$triggerScroll === void 0 ? false : _props$triggerScroll,
166
168
  _props$getTriggerElem = props.getTriggerElement,
167
169
  getTriggerElement = _props$getTriggerElem === void 0 ? function (locatorNode) {
168
170
  return locatorNode;
@@ -664,10 +666,16 @@ function usePopper(locatorElement, popperElement, props) {
664
666
  (0, _react.useEffect)(function () {
665
667
  if (visible) {
666
668
  var scrollAlign = (0, _debounce.default)(function (e) {
667
- var isPopperScroll = e.target === popperRef.current || popperRef.current.contains(e.target);
668
- if (scrollHidden && !isPopperScroll) {
669
+ var target = e.target;
670
+ var popperNode = popperRef.current;
671
+ var realDom = getRealDom(locatorRef, locatorElement);
672
+ var triggerNode = realDom ? getTriggerElement(realDom) : null;
673
+ var isPopperScroll = popperNode && target && (target === popperNode || popperNode.contains(target));
674
+ var isTriggerScroll = triggerNode && target && (target === triggerNode || triggerNode.contains(target)) && triggerScroll;
675
+ if (scrollHidden && !isPopperScroll && !isTriggerScroll) {
669
676
  props.visible === undefined && setVisible(false);
670
677
  onVisibleChange && onVisibleChange(false);
678
+ return;
671
679
  }
672
680
  alignPopper();
673
681
  }, 10);
@@ -678,7 +686,7 @@ function usePopper(locatorElement, popperElement, props) {
678
686
  document.removeEventListener('scroll', scrollAlign, true);
679
687
  };
680
688
  }
681
- }, [alignPopper, exist, onVisibleChange, popperNode, props.visible, scrollHidden, locatorNode, visible, popperRef]);
689
+ }, [visible, alignPopper, scrollHidden, onVisibleChange, props.visible, popperRef, locatorRef, locatorElement, getTriggerElement]);
682
690
  (0, _react.useEffect)(function () {
683
691
  var realDom = getRealDom(locatorRef, locatorElement);
684
692
  var triggerNode = getTriggerElement(realDom);
@@ -290,11 +290,6 @@
290
290
  flex: 1;
291
291
  }
292
292
  .kd-dropdown-mobile .kd-dropdown-menu .kd-dropdown-menu-item span {
293
- overflow: hidden;
294
- text-overflow: ellipsis;
295
- display: -webkit-box;
296
293
  -webkit-line-clamp: 1;
297
- -webkit-box-orient: vertical;
298
- word-break: break-all;
299
294
  }
300
295
  /*! rtl:end:ignore */
@@ -132,8 +132,7 @@
132
132
  flex: 1;
133
133
  .@{dropdown-prefix-cls}-menu-item {
134
134
  span {
135
- .multipleEllipsis(1);
136
- word-break: break-all;
135
+ -webkit-line-clamp: 1;
137
136
  }
138
137
  }
139
138
  }
@@ -926,6 +926,7 @@ var InternalSelect = function InternalSelect(props, ref) {
926
926
  popperStyle: catchStyle(),
927
927
  defaultVisible: optionShow,
928
928
  visible: optionShow,
929
+ triggerScroll: true,
929
930
  onVisibleChange: handleVisibleChange,
930
931
  clickToClose: !(isShowSearch && searchValue)
931
932
  });
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@kdcloudjs/kdesign",
3
- "version": "1.8.64",
3
+ "version": "1.8.70",
4
4
  "description": "KDesign 金蝶前端react 组件库",
5
5
  "title": "kdesign",
6
6
  "keywords": [