@kdcloudjs/kdesign 1.8.14 → 1.8.16

package/es/breadcrumb/breadcrumb.js

@@ -142,8 +142,8 @@ var Breadcrumb = function Breadcrumb(props) {
   };
   useEffect(function () {
     var isMore = itemsConfig === null || itemsConfig === void 0 ? void 0 : itemsConfig.some(function (item) {
-      var _a, _b;
-      return ((_b = (_a = item === null || item === void 0 ? void 0 : item.title) === null || _a === void 0 ? void 0 : _a.props) === null || _b === void 0 ? void 0 : _b.children.type.displayName) === 'Tooltip';
+      var _a, _b, _c, _d;
+      return ((_d = (_c = (_b = (_a = item === null || item === void 0 ? void 0 : item.title) === null || _a === void 0 ? void 0 : _a.props) === null || _b === void 0 ? void 0 : _b.children) === null || _c === void 0 ? void 0 : _c.type) === null || _d === void 0 ? void 0 : _d.displayName) === 'Tooltip';
     });
     setOpenEllipsis(isMore && itemsConfig.length === MIN_ITEM);
   }, [itemsConfig]);

package/es/button/group.d.ts

@@ -1,6 +1,6 @@
 import React, { CSSProperties, ReactNode } from 'react';
-import { PopperProps } from '../_utils/usePopper';
 import { ButtonType, ButtonSize } from './button';
+import { PopperProps } from '../popper';
 export declare const ButtonGroupTypes: ["basic", "similar"];
 export declare type ButtonGroupType = typeof ButtonGroupTypes[number];
 export interface OverlayType {

package/es/button/group.js

@@ -8,9 +8,9 @@ import classNames from 'classnames';
 import ConfigContext from '../config-provider/ConfigContext';
 import { getCompProps } from '../_utils';
 import { Button, Icon } from '../index';
-import usePopper from '../_utils/usePopper';
 import { toArray } from '../_utils/react-children';
 import { tuple } from '../_utils/type';
+import Popper from '../popper';
 export var ButtonGroupTypes = tuple('basic', 'similar');
 var InternalButtonGroup = function InternalButtonGroup(props, ref) {
   var _context;
@@ -37,7 +37,7 @@ var InternalButtonGroup = function InternalButtonGroup(props, ref) {
     _useState2 = _slicedToArray(_useState, 2),
     optionShow = _useState2[0],
     setOptionShow = _useState2[1];
-  var refBtnGroup = React.useRef(null) || ref;
+  var refBtnGroup = ref || React.createRef();
   var triggerRef = React.useRef(null);
   var isBsicType = type === 'basic';
   var btnGroupPrefixCls = getPrefixCls(prefixCls, 'btn-group', customPrefixcls);
@@ -120,7 +120,9 @@ var InternalButtonGroup = function InternalButtonGroup(props, ref) {
       return isBsicType ? locatorNode : triggerRef.current;
     }
   });
-  return usePopper(renderTriggerButton(), renderContent(), popperProps);
+  return React.createElement(Popper, _extends({
+    tip: renderContent()
+  }, popperProps), renderTriggerButton());
 };
 var ButtonGroup = React.forwardRef(InternalButtonGroup);
 ButtonGroup.displayName = 'ButtonGroup';

package/es/city-picker/city-picker.js

@@ -6,13 +6,14 @@ import _concatInstanceProperty from "@babel/runtime-corejs3/core-js-stable/insta
 import _findInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/find";
 import _mapInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/map";
 import _filterInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/filter";
+import _findIndexInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/find-index";
 import React, { useContext, useRef, useEffect, useState, useCallback, useMemo } from 'react';
 import { useMergedState } from '../_utils/hooks';
 import classNames from 'classnames';
 import ConfigContext from '../config-provider/ConfigContext';
 import { getCompProps } from '../_utils';
 import { Icon, Tabs, Spin } from '../index';
-import usePopper from '../_utils/usePopper';
+import Popper from '../popper';
 import Option from './option';
 import escapeRegExp from 'lodash/escapeRegExp';
 import KeyCode from '../_utils/KeyCode';
@@ -152,15 +153,6 @@ var InternalSelect = function InternalSelect(props, ref) {
     setAfterChangeFocus(false);
     onBlur && onBlur(e);
   }, [onBlur]);
-  useEffect(function () {
-    selectionRef.current.addEventListener('mouseup', function (e) {
-      var _a;
-      var isCloseBtn = ((_a = e === null || e === void 0 ? void 0 : e.target) === null || _a === void 0 ? void 0 : _a.className.indexOf('kd-tag-close-icon')) > -1;
-      if (isCloseBtn) {
-        e.stopPropagation();
-      }
-    });
-  }, []);
   var handleSearchChange = useCallback(function (event) {
     var val = event.currentTarget.value;
     setOptionShow(true);
@@ -359,14 +351,7 @@ var InternalSelect = function InternalSelect(props, ref) {
   }, [optionShow]);
   useEffect(function () {
     var _a;
-    var fn = function fn(e) {
-      e.stopPropagation();
-    };
-    (_a = clearRef.current) === null || _a === void 0 ? void 0 : _a.addEventListener('mouseup', fn);
-    return function () {
-      var _a;
-      (_a = clearRef.current) === null || _a === void 0 ? void 0 : _a.removeEventListener('mouseup', fn);
-    };
+    (_a = clearRef.current) === null || _a === void 0 ? void 0 : _a.addEventListener('click', handleReset);
   }, [initValue]);
   var curkeyboardList = useMemo(function () {
     if (!searchValue) {
@@ -395,14 +380,16 @@ var InternalSelect = function InternalSelect(props, ref) {
     setActiveIndex(index === undefined ? getActiveIndex(0) : index);
   };
   useEffect(function () {
-    initActiveIndex(searchValue ? undefined : -1);
-  }, [searchValue, tabsValue, curkeyboardList]);
+    var index = _findIndexInstanceProperty(curkeyboardList).call(curkeyboardList, function (item) {
+      return item.id === initValue;
+    });
+    initActiveIndex(index >= 0 ? index : undefined);
+  }, [curkeyboardList, initValue]);
   var onInternalKeyDown = function onInternalKeyDown(e) {
     var _a, _b, _c;
     var which = e.which;
     if (which === KeyCode.ENTER || which === KeyCode.UP || which === KeyCode.DOWN) {
       e.preventDefault();
-      setOptionShow(true);
     }
     if (optionShow) {
       var offset = 0;
@@ -467,15 +454,11 @@ var InternalSelect = function InternalSelect(props, ref) {
         minWidth: width,
         maxWidth: 600
       }, dropdownStyle), {
-        width: (dropdownStyle === null || dropdownStyle === void 0 ? void 0 : dropdownStyle.width) || 'auto',
-        zIndex: 1050
+        width: (dropdownStyle === null || dropdownStyle === void 0 ? void 0 : dropdownStyle.width) || 'auto'
       }), popperStyle);
     }
   };
   var handleVisibleChange = function handleVisibleChange(visible) {
-    if (!visible) {
-      initActiveIndex(-1);
-    }
     if (visible !== optionShow) {
       props.visible === undefined && setOptionShow(visible);
       onVisibleChange && onVisibleChange(visible);
@@ -495,7 +478,9 @@ var InternalSelect = function InternalSelect(props, ref) {
       }
     }
   });
-  return usePopper(renderCityPicker(), renderContent(), popperProps);
+  return React.createElement(Popper, _extends({
+    tip: renderContent()
+  }, popperProps), renderCityPicker());
 };
 var Select = React.forwardRef(InternalSelect);
 Select.displayName = 'CityPicker';

package/es/city-picker/option.js

@@ -33,16 +33,12 @@ var InternalOption = function InternalOption(props, ref) {
   var handleOnMouseEnter = function handleOnMouseEnter() {
     onChangeActiveIndex && onChangeActiveIndex(index);
   };
-  var handleOnMouseLeave = function handleOnMouseLeave() {
-    onChangeActiveIndex && onChangeActiveIndex(-1);
-  };
   return React.createElement(React.Fragment, null, React.createElement("div", {
     ref: optionRef,
     className: optionCls,
     title: name,
     onClick: handleClick,
-    onMouseEnter: handleOnMouseEnter,
-    onMouseLeave: handleOnMouseLeave
+    onMouseEnter: handleOnMouseEnter
   }, typeof itemRender === 'function' ? itemRender(city) : React.createElement(React.Fragment, null, React.createElement("span", {
     className: "".concat(selectOptionPrefixCls, "-content")
   }, children), React.createElement("span", {

package/es/city-picker/style/index.css

@@ -270,6 +270,14 @@
   -webkit-box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.2);
           box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.2);
 }
+.kd-city-picker-dropdown.kd-popper-bottom-start-in {
+  -webkit-animation-name: kdSlideUpIn;
+          animation-name: kdSlideUpIn;
+}
+.kd-city-picker-dropdown.kd-popper-bottom-start-out {
+  -webkit-animation-name: kdSlideUpOut;
+          animation-name: kdSlideUpOut;
+}
 .kd-city-picker-dropdown .kd-tabs-tab-list {
   width: 100%;
 }

package/es/city-picker/style/index.less

@@ -4,6 +4,7 @@
 
 @city-picker-prefix-cls: ~'@{kd-prefix}-city-picker';
 @tabs-prefix-cls: ~'@{kd-prefix}-tabs';
+@popper-prefix-cls: ~'@{kd-prefix}-popper';
 
 .@{city-picker-prefix-cls} {
   position: relative;
@@ -156,6 +157,15 @@
     outline: none;
     box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.2);
 
+    &.@{popper-prefix-cls}-bottom-start {
+      &-in {
+        animation-name: kdSlideUpIn;
+      }
+
+      &-out {
+        animation-name: kdSlideUpOut;
+      }
+    }
     // 调整tabs样式
     .@{tabs-prefix-cls}-tab-list {
       width: 100%;