@douyinfe/semi-ui 2.0.6 → 2.0.9-alpha.0

package/lib/es/autoComplete/index.d.ts

@@ -5,7 +5,6 @@ import BaseComponent, { ValidateStatus } from '../_base/baseComponent';
 import { Position } from '../tooltip';
 import Option from '../select/option';
 import '@douyinfe/semi-foundation/lib/es/autoComplete/autoComplete.css';
-import '@douyinfe/semi-foundation/lib/es/select/option.css';
 import { Motion } from '../_base/base';
 /**
  * AutoComplete is an enhanced Input (candidates suggest that users can choose or not),

package/lib/es/autoComplete/index.js

@@ -21,7 +21,6 @@ import Trigger from '../trigger';
 import Option from '../select/option';
 import warning from '@douyinfe/semi-foundation/lib/es/utils/warning';
 import '@douyinfe/semi-foundation/lib/es/autoComplete/autoComplete.css';
-import '@douyinfe/semi-foundation/lib/es/select/option.css';
 const prefixCls = cssClasses.PREFIX;
 const sizeSet = strings.SIZE;
 const positionSet = strings.POSITION;

package/lib/es/datePicker/index.d.ts

@@ -8,4 +8,4 @@ export { QuickControlProps } from './quickControl';
 export { YearAndMonthProps } from './yearAndMonth';
 declare const _default: React.ForwardRefExoticComponent<DatePickerProps & React.RefAttributes<DatePicker>>;
 export default _default;
-export { BaseValueType, DayStatusType, DisabledDateOptions, DisabledDateType, DisabledTimeType, InputSize, Position, PresetType, PresetsType, TriggerRenderProps, ValidateStatus, ValueType, } from '@douyinfe/semi-foundation/datePicker/foundation';
+export { BaseValueType, DayStatusType, DisabledDateOptions, DisabledDateType, DisabledTimeType, InputSize, Position, PresetType, PresetsType, TriggerRenderProps, ValidateStatus, ValueType, } from '@douyinfe/semi-foundation/lib/es/datePicker/foundation';

package/lib/es/form/hoc/withField.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { withFieldOption } from '@douyinfe/semi-foundation/lib/es/form/interface';
+import { WithFieldOption } from '@douyinfe/semi-foundation/lib/es/form/interface';
 import { CommonFieldProps, CommonexcludeType } from '../interface';
 import { Subtract } from 'utility-types';
 /**
@@ -8,5 +8,5 @@ import { Subtract } from 'utility-types';
  * 2. Insert <Label>
  * 3. Insert <ErrorMessage>
  */
-declare function withField<C extends React.ComponentType<React.ComponentProps<C>>, T extends React.ComponentType<Subtract<React.ComponentProps<C>, CommonexcludeType> & CommonFieldProps>>(Component: C, opts?: withFieldOption): T;
+declare function withField<C extends React.ComponentType<React.ComponentProps<C>>, T extends React.ComponentType<Subtract<React.ComponentProps<C>, CommonexcludeType> & CommonFieldProps>>(Component: C, opts?: WithFieldOption): T;
 export default withField;

package/lib/es/form/interface.d.ts

@@ -2,7 +2,7 @@ import * as React from 'react';
 import { Subtract } from 'utility-types';
 import type { RuleItem } from 'async-validator';
 import { Options as scrollIntoViewOptions } from 'scroll-into-view-if-needed';
-import { BaseFormApi as FormApi, FormState } from '@douyinfe/semi-foundation/lib/es/form/interface';
+import { BaseFormApi as FormApi, FormState, WithFieldOption } from '@douyinfe/semi-foundation/lib/es/form/interface';
 import { SelectProps } from '../select/index';
 import Option from '../select/option';
 import OptGroup from '../select/optionGroup';
@@ -10,7 +10,7 @@ import { CheckboxProps } from '../checkbox/index';
 import { RadioProps } from '../radio/index';
 import { ReactFieldError as FieldError } from './errorMessage';
 import { LabelProps } from './label';
-export { FormState, FormApi };
+export { FormState, FormApi, WithFieldOption };
 export declare type CommonFieldProps = {
     /** Field is required (except Form. Checkbox within the Group, Form. Radio) */
     field: string;

package/lib/es/modal/Modal.d.ts

@@ -125,6 +125,7 @@ declare class Modal extends BaseComponent<ModalReactProps, ModalState> {
     componentWillUnmount(): void;
     handleCancel: (e: React.MouseEvent) => void;
     handleOk: (e: React.MouseEvent) => void;
+    updateHiddenState: () => void;
     renderFooter: () => ReactNode;
     renderDialog: () => JSX.Element;
     render(): JSX.Element;

package/lib/es/modal/Modal.js

@@ -45,6 +45,21 @@ class Modal extends BaseComponent {
       this.foundation.handleOk(e);
     };
 
+    this.updateHiddenState = () => {
+      const {
+        visible
+      } = this.props;
+      const {
+        hidden
+      } = this.state;
+
+      if (!visible && !hidden) {
+        this.foundation.toggleHidden(true, () => this.foundation.afterClose());
+      } else if (visible && this.state.hidden) {
+        this.foundation.toggleHidden(false);
+      }
+    };
+
     this.renderFooter = () => {
       const {
         okText,
@@ -123,7 +138,7 @@ class Modal extends BaseComponent {
       }
 
       const classList = cls(className, {
-        ["".concat(cssClasses.DIALOG, "-displayNone")]: keepDOM && this.state.hidden
+        ["".concat(cssClasses.DIALOG, "-displayNone")]: keepDOM && this.state.hidden && !visible
       });
       const contentClassName = motion ? cls({
         ["".concat(cssClasses.DIALOG, "-content-animate-hide")]: !visible,
@@ -133,19 +148,6 @@ class Modal extends BaseComponent {
         ["".concat(cssClasses.DIALOG, "-mask-animate-hide")]: !visible,
         ["".concat(cssClasses.DIALOG, "-mask-animate-show")]: visible
       }) : null;
-
-      const updateHiddenState = () => {
-        if (!visible && !this.state.hidden) {
-          this.foundation.toggleHidden(true);
-        } else if (visible && this.state.hidden) {
-          this.foundation.toggleHidden(false);
-        }
-      };
-
-      if (!motion) {
-        updateHiddenState();
-      }
-
       return /*#__PURE__*/React.createElement(Portal, {
         style: wrapperStyle,
         getPopupContainer: getPopupContainer
@@ -159,7 +161,7 @@ class Modal extends BaseComponent {
         style: style,
         ref: this.modalRef,
         onAnimationEnd: () => {
-          updateHiddenState();
+          this.updateHiddenState();
         },
         footer: renderFooter,
         onClose: this.handleCancel
@@ -212,11 +214,11 @@ class Modal extends BaseComponent {
       notifyClose: () => {
         this.props.afterClose();
       },
-      toggleHidden: hidden => {
+      toggleHidden: (hidden, callback) => {
         if (hidden !== this.state.hidden) {
           this.setState({
             hidden
-          });
+          }, callback || noop);
         }
       },
       notifyFullScreen: isFullScreen => {
@@ -232,17 +234,8 @@ class Modal extends BaseComponent {
   static getDerivedStateFromProps(props, prevState) {
     const newState = {};
 
-    if (props.visible && prevState.hidden) {
-      newState.hidden = false;
-    }
-
     if (props.fullScreen !== prevState.isFullScreen) {
       newState.isFullScreen = props.fullScreen;
-    } // if not using animation, need to update hidden state from props
-
-
-    if (!props.visible && !props.motion && !prevState.hidden) {
-      newState.hidden = true;
     }
 
     return newState;
@@ -276,6 +269,10 @@ class Modal extends BaseComponent {
     if (prevProps.visible && !this.props.visible) {
       this.foundation.afterHide();
     }
+
+    if (!this.props.motion) {
+      this.updateHiddenState();
+    }
   }
 
   componentWillUnmount() {

package/lib/es/notification/index.d.ts

@@ -9,7 +9,7 @@ export { NoticeTransitionProps } from './NoticeTransition';
 export interface NoticeReactProps extends NoticeProps {
     style?: CSSProperties;
 }
-export { NoticeState, NotificationListProps, NotificationListState };
+export { NoticeState, NotificationListProps, NotificationListState, ConfigProps };
 export declare type NoticesInPosition = {
     top: NoticeInstance[];
     topLeft: NoticeInstance[];

package/lib/es/select/index.d.ts

@@ -5,7 +5,6 @@ import BaseComponent, { ValidateStatus } from '../_base/baseComponent';
 import Option, { OptionProps } from './option';
 import OptionGroup from './optionGroup';
 import '@douyinfe/semi-foundation/lib/es/select/select.css';
-import '@douyinfe/semi-foundation/lib/es/select/option.css';
 import { Position, TooltipProps } from '../tooltip';
 export { OptionProps } from './option';
 export { OptionGroupProps } from './optionGroup';

package/lib/es/select/index.js

@@ -40,7 +40,6 @@ import { IconChevronDown, IconClear } from '@douyinfe/semi-icons';
 import { isSemiIcon } from '../_utils';
 import warning from '@douyinfe/semi-foundation/lib/es/utils/warning';
 import '@douyinfe/semi-foundation/lib/es/select/select.css';
-import '@douyinfe/semi-foundation/lib/es/select/option.css';
 const prefixcls = cssClasses.PREFIX;
 const key = 0; // Notes: Use the label of the option as the identifier, that is, the option in Select, the value is allowed to be the same, but the label must be unique
 

package/lib/es/slider/index.js

@@ -399,6 +399,7 @@ export default class Slider extends BaseComponent {
       },
       onHandleMove: function (mousePos, isMin) {
         let stateChangeCallback = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : noop;
+        let clickTrack = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : false;
 
         const sliderDOMIsInRenderTree = _this.foundation.checkAndUpdateIsInRenderTreeState();
 
@@ -426,7 +427,8 @@ export default class Slider extends BaseComponent {
         if (!isEqual(_this.foundation.outPutValue(currentValue), outPutValue)) {
           onChange(outPutValue);
 
-          if (_this.foundation.valueFormatIsCorrect(value)) {
+          if (!clickTrack && _this.foundation.valueFormatIsCorrect(value)) {
+            // still require afterChangeCallback when click on the track directly, need skip here
             return false;
           }
 

package/lib/es/spin/index.d.ts

@@ -8,7 +8,7 @@ export interface SpinProps {
     spinning?: boolean;
     indicator?: React.ReactNode;
     delay?: number;
-    tip?: string;
+    tip?: React.ReactNode;
     wrapperClassName?: string;
     style?: React.CSSProperties;
     childStyle?: React.CSSProperties;
@@ -25,7 +25,7 @@ declare class Spin extends BaseComponent<SpinProps, SpinState> {
         children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
         indicator: PropTypes.Requireable<PropTypes.ReactNodeLike>;
         delay: PropTypes.Requireable<number>;
-        tip: PropTypes.Requireable<string>;
+        tip: PropTypes.Requireable<PropTypes.ReactNodeLike>;
         wrapperClassName: PropTypes.Requireable<string>;
         childStyle: PropTypes.Requireable<object>;
         style: PropTypes.Requireable<object>;

package/lib/es/spin/index.js

@@ -107,7 +107,7 @@ Spin.propTypes = {
   children: PropTypes.node,
   indicator: PropTypes.node,
   delay: PropTypes.number,
-  tip: PropTypes.string,
+  tip: PropTypes.node,
   wrapperClassName: PropTypes.string,
   childStyle: PropTypes.object,
   style: PropTypes.object

package/lib/es/table/interface.d.ts

@@ -35,7 +35,7 @@ export interface TableProps<RecordType extends Record<string, any> = any> extend
     id?: string;
     indentSize?: number;
     loading?: boolean;
-    pagination?: Pagination;
+    pagination?: TablePagination;
     prefixCls?: string;
     renderGroupSection?: RenderGroupSection;
     renderPagination?: RenderPagination;
@@ -225,6 +225,7 @@ export declare type Size = ArrayElement<typeof strings.SIZES>;
 export declare type Title<RecordType> = React.ReactNode | ((pageData?: RecordType[]) => React.ReactNode);
 export declare type PaginationPosition = ArrayElement<typeof strings.PAGINATION_POSITIONS>;
 export declare type Pagination = TablePaginationProps | boolean;
+export declare type TablePagination = Pagination;
 export interface ChangeInfoFilter<RecordType> extends BaseChangeInfoFilter<RecordType> {
     filters?: Filter[];
     onFilter?: OnFilter<RecordType>;

package/lib/es/toast/index.d.ts

@@ -11,7 +11,7 @@ export interface ToastReactProps extends ToastProps {
     icon?: React.ReactNode;
     content: React.ReactNode;
 }
-export { ToastListProps, ToastListState, ToastState };
+export { ConfigProps, ToastListProps, ToastListState, ToastState };
 declare const createBaseToast: () => {
     new (props: ToastListProps): {
         readonly adapter: ToastListAdapter;

package/lib/es/upload/index.d.ts

@@ -7,6 +7,7 @@ import BaseComponent, { ValidateStatus } from '../_base/baseComponent';
 import { ArrayElement } from '../_base/base';
 import { Locale } from '../locale/interface';
 import '@douyinfe/semi-foundation/lib/es/upload/upload.css';
+export { BeforeUploadObjectResult, AfterUploadResult };
 export interface FileItem extends BaseFileItem {
     validateMessage?: ReactNode;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@douyinfe/semi-ui",
-    "version": "2.0.6",
+    "version": "2.0.9-alpha.0",
     "description": "",
     "main": "lib/es/index.js",
     "module": "lib/es/index.js",
@@ -19,11 +19,11 @@
     },
     "dependencies": {
         "@babel/runtime-corejs3": "^7.15.4",
-        "@douyinfe/semi-animation-react": "2.0.6",
-        "@douyinfe/semi-foundation": "2.0.6",
-        "@douyinfe/semi-icons": "2.0.6",
-        "@douyinfe/semi-illustrations": "2.0.6",
-        "@douyinfe/semi-theme-default": "2.0.6",
+        "@douyinfe/semi-animation-react": "2.0.8",
+        "@douyinfe/semi-foundation": "2.0.9-alpha.0",
+        "@douyinfe/semi-icons": "2.0.9-alpha.0",
+        "@douyinfe/semi-illustrations": "2.0.9-alpha.0",
+        "@douyinfe/semi-theme-default": "2.0.8",
         "async-validator": "^3.5.0",
         "classnames": "^2.2.6",
         "copy-text-to-clipboard": "^2.1.1",
@@ -64,13 +64,13 @@
     ],
     "author": "",
     "license": "MIT",
-    "gitHead": "84d11e86280d92dd12ffe02bd8db93155a8626d2",
+    "gitHead": "cfbebccbd9c618b43a0eeca339980cea3723453d",
     "devDependencies": {
         "@babel/plugin-proposal-decorators": "^7.15.8",
         "@babel/plugin-transform-runtime": "^7.15.8",
         "@babel/preset-env": "^7.15.8",
         "@babel/preset-react": "^7.14.5",
-        "@douyinfe/semi-scss-compile": "2.0.6",
+        "@douyinfe/semi-scss-compile": "2.0.8",
         "@storybook/addon-knobs": "^6.3.1",
         "babel-loader": "^8.2.2",
         "case-sensitive-paths-webpack-plugin": "^2.4.0",