@kdcloudjs/kdesign 1.7.68-stable.8 → 1.7.68-stable.9

package/es/_utils/useId.d.ts

@@ -0,0 +1,2 @@
+declare const _default: (id?: string | undefined) => any;
+export default _default;

package/es/_utils/useId.js

@@ -0,0 +1,30 @@
+import _slicedToArray from "@babel/runtime-corejs3/helpers/slicedToArray";
+import _extends from "@babel/runtime-corejs3/helpers/extends";
+import * as React from 'react';
+function getUseId() {
+  var fullClone = _extends({}, React);
+  return fullClone === null || fullClone === void 0 ? void 0 : fullClone.useId;
+}
+var uuid = 0;
+var useOriginId = getUseId();
+export default useOriginId ? function useId(id) {
+  var reactId = useOriginId();
+  if (id) {
+    return id;
+  }
+  return reactId;
+} : function useCompatId(id) {
+  var _React$useState = React.useState('ssr-id'),
+    _React$useState2 = _slicedToArray(_React$useState, 2),
+    innerId = _React$useState2[0],
+    setInnerId = _React$useState2[1];
+  React.useEffect(function () {
+    var nextId = uuid;
+    uuid += 1;
+    setInnerId("kd_unique_".concat(nextId));
+  }, []);
+  if (id) {
+    return id;
+  }
+  return innerId;
+};

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';
@@ -59,7 +60,8 @@ var InternalSelect = function InternalSelect(props, ref) {
     clearIcon = selectProps.clearIcon,
     loading = selectProps.loading,
     showDescription = selectProps.showDescription,
-    description = selectProps.description,
+    _selectProps$descript = selectProps.description,
+    description = _selectProps$descript === void 0 ? cityPickerLangMsg.title : _selectProps$descript,
     optionHighlightProps = selectProps.optionHighlightProps,
     _selectProps$popperSt = selectProps.popperStyle,
     popperStyle = _selectProps$popperSt === void 0 ? {} : _selectProps$popperSt,
@@ -152,15 +154,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;
@@ -365,14 +358,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]);
   // keyboard
   var curkeyboardList = useMemo(function () {
@@ -402,15 +388,17 @@ 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;
     // open
     if (which === KeyCode.ENTER || which === KeyCode.UP || which === KeyCode.DOWN) {
       e.preventDefault();
-      setOptionShow(true);
     }
     // up、down、enter、esc
     if (optionShow) {
@@ -431,6 +419,8 @@ var InternalSelect = function InternalSelect(props, ref) {
             break;
           }
         case KeyCode.ESC:
+          e.stopPropagation();
+          e.nativeEvent.stopImmediatePropagation();
           handleVisibleChange(false);
           break;
         default:
@@ -476,15 +466,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);
@@ -504,7 +490,9 @@ var InternalSelect = function InternalSelect(props, ref) {
       }
     }
   });
-  return usePopper(renderCityPicker(), renderContent(), popperProps);
+  return /*#__PURE__*/React.createElement(Popper, _extends({
+    tip: renderContent()
+  }, popperProps), renderCityPicker());
 };
 var Select = /*#__PURE__*/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 /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
     ref: optionRef,
     className: optionCls,
     title: name,
     onClick: handleClick,
-    onMouseEnter: handleOnMouseEnter,
-    onMouseLeave: handleOnMouseLeave
+    onMouseEnter: handleOnMouseEnter
   }, typeof itemRender === 'function' ? itemRender(city) : /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("span", {
     className: "".concat(selectOptionPrefixCls, "-content")
   }, children), /*#__PURE__*/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%;

package/es/config-provider/compDefaultProps.d.ts

@@ -470,7 +470,6 @@ declare const compDefaultProps: {
         defaultOpen: boolean;
         showArrow: boolean;
         placeholder: string;
-        description: string;
         showDescription: boolean;
         optionHighlightProps: string;
         allowClear: boolean;

package/es/config-provider/compDefaultProps.js

@@ -488,7 +488,6 @@ var compDefaultProps = {
     defaultOpen: false,
     showArrow: true,
     placeholder: '',
-    description: '城市',
     showDescription: true,
     optionHighlightProps: 'highlightText',
     allowClear: true

package/es/locale/locale.d.ts

@@ -69,6 +69,7 @@ declare class LocaleCache {
         'CityPicker.commonEmptyText': string;
         'CityPicker.tabsDomestic': string;
         'CityPicker.tabsInternation': string;
+        'CityPicker.title': string;
         'ColorPicker.followFunctionalColor': string;
         'Search.placeholder': string;
         'Search.desc': string[];

package/es/locale/zh-CN.d.ts

@@ -41,6 +41,7 @@ declare const locale: {
     'CityPicker.commonEmptyText': string;
     'CityPicker.tabsDomestic': string;
     'CityPicker.tabsInternation': string;
+    'CityPicker.title': string;
     'ColorPicker.followFunctionalColor': string;
     'Search.placeholder': string;
     'Search.desc': string[];

package/es/locale/zh-CN.js

@@ -45,6 +45,7 @@ var locale = _extends(_extends({
   'CityPicker.commonEmptyText': '无常用城市',
   'CityPicker.tabsDomestic': '国内',
   'CityPicker.tabsInternation': '国际/中国港澳台',
+  'CityPicker.title': '城市',
   'ColorPicker.followFunctionalColor': '跟随功能色',
   'Search.placeholder': '请输入需要搜索的内容',
   'Search.desc': ['空格代表"或"，回车代表"且"'],

package/es/popper/index.d.ts

@@ -0,0 +1,61 @@
+import React from 'react';
+import { Modifier, Placement } from '@popperjs/core';
+export declare const Placements: ["top", "left", "right", "bottom", "topLeft", "topRight", "bottomLeft", "bottomRight", "leftTop", "leftBottom", "rightTop", "rightBottom"];
+export declare type PlacementType = typeof Placements[number];
+export declare const Triggers: ["hover", "focus", "click", "contextMenu"];
+export declare type TriggerType = typeof Triggers[number];
+export declare type Reason = TriggerType | 'scroll' | 'clickOutside' | 'clickToClose' | 'parentHidden' | 'unknown';
+export declare type RenderFunction = () => React.ReactNode;
+export declare type PopperProps = {
+    gap?: number;
+    arrow?: boolean;
+    visible?: boolean;
+    prefixCls?: string;
+    arrowSize?: number;
+    disabled?: boolean;
+    arrowOffset?: number;
+    scrollHidden?: boolean;
+    mouseEnterDelay?: number;
+    mouseLeaveDelay?: number;
+    defaultVisible?: boolean;
+    autoPlacement?: boolean;
+    autoPlacementList?: Placement[];
+    className?: string;
+    style?: React.CSSProperties;
+    popperClassName?: string;
+    popperStyle?: React.CSSProperties;
+    popperOuterClassName?: string;
+    popperOuterStyle?: React.CSSProperties;
+    placement?: PlacementType;
+    tip?: any;
+    trigger?: TriggerType | Array<TriggerType>;
+    strategy?: 'fixed' | 'absolute';
+    clickToClose?: boolean;
+    onTrigger?: (trigger: TriggerType) => void;
+    onVisibleChange?: (visible: boolean, reason?: Reason) => void;
+    getTriggerElement?: (locatorNode: HTMLElement) => HTMLElement;
+    getPopupContainer?: (locatorNode: HTMLElement) => HTMLElement;
+    onTransitionEnd?: (e: React.TransitionEvent) => void;
+    onAnimationEnd?: (e: React.AnimationEvent) => void;
+    children?: React.ReactNode;
+    customerModifiers?: (modifiers: Partial<Modifier<any, any>>[]) => Partial<Modifier<any, any>>[];
+};
+export interface TriggerContextProps {
+    registerSubPopup: (id: string, node: any) => void;
+}
+export declare const popperPlacementMap: {
+    top: string;
+    left: string;
+    right: string;
+    bottom: string;
+    topLeft: string;
+    topRight: string;
+    bottomLeft: string;
+    bottomRight: string;
+    leftTop: string;
+    leftBottom: string;
+    rightTop: string;
+    rightBottom: string;
+};
+export declare const Popper: React.ForwardRefExoticComponent<PopperProps & React.RefAttributes<unknown>>;
+export default Popper;