@douyinfe/semi-ui 2.36.0-beta.0 → 2.36.1-alpha.0

package/lib/es/collapse/item.js

@@ -1,14 +1,11 @@
 var __rest = this && this.__rest || function (s, e) {
   var t = {};
-
   for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
-
   if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
     if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
   }
   return t;
 };
-
 import React, { PureComponent } from 'react';
 import cls from 'classnames';
 import PropTypes from 'prop-types';
@@ -22,18 +19,15 @@ export default class CollapsePanel extends PureComponent {
     super(...arguments);
     this.headerExpandIconTriggerRef = /*#__PURE__*/React.createRef();
     this.ariaID = getUuidShort({});
-
     this.handleClick = (itemKey, e) => {
-      var _a; // Judge user click Icon or Header
+      var _a;
+      // Judge user click Icon or Header
       // Don't mount this func into icon span wrapper, or get triggered twice because of event propagation
-
-
       if (this.context.clickHeaderToExpand || ((_a = this.headerExpandIconTriggerRef.current) === null || _a === void 0 ? void 0 : _a.contains(e.target))) {
         this.context.onClick(itemKey, e);
       }
     };
   }
-
   renderHeader(active) {
     let expandIconEnable = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
     const {
@@ -48,15 +42,12 @@ export default class CollapsePanel extends PureComponent {
     const {
       expandIconPosition
     } = this.context;
-
     if (typeof expandIcon === 'undefined') {
       expandIcon = /*#__PURE__*/React.createElement(IconChevronDown, null);
     }
-
     if (typeof collapseIcon === 'undefined') {
       collapseIcon = /*#__PURE__*/React.createElement(IconChevronUp, null);
     }
-
     const icon = /*#__PURE__*/React.createElement("span", {
       ref: this.headerExpandIconTriggerRef,
       "aria-hidden": 'true',
@@ -65,30 +56,26 @@ export default class CollapsePanel extends PureComponent {
       }])
     }, expandIconEnable ? active ? collapseIcon : expandIcon : expandIcon);
     const iconPosLeft = expandIconPosition === 'left';
-
     if (typeof header === 'string') {
       return /*#__PURE__*/React.createElement(React.Fragment, null, showArrow && (iconPosLeft ? icon : null), /*#__PURE__*/React.createElement("span", null, header), /*#__PURE__*/React.createElement("span", {
         className: `${cssClasses.PREFIX}-header-right`
       }, /*#__PURE__*/React.createElement("span", null, extra), showArrow && (iconPosLeft ? null : icon)));
     }
-
     return /*#__PURE__*/React.createElement(React.Fragment, null, showArrow && (iconPosLeft ? icon : null), header, showArrow && (iconPosLeft ? null : icon));
   }
-
   render() {
     const _a = this.props,
-          {
-      className,
-      children,
-      itemKey,
-      reCalcKey,
-      header,
-      extra,
-      showArrow,
-      disabled
-    } = _a,
-          restProps = __rest(_a, ["className", "children", "itemKey", "reCalcKey", "header", "extra", "showArrow", "disabled"]);
-
+      {
+        className,
+        children,
+        itemKey,
+        reCalcKey,
+        header,
+        extra,
+        showArrow,
+        disabled
+      } = _a,
+      restProps = __rest(_a, ["className", "children", "itemKey", "reCalcKey", "header", "extra", "showArrow", "disabled"]);
     const {
       keepDOM,
       expandIconPosition,
@@ -130,7 +117,6 @@ export default class CollapsePanel extends PureComponent {
       className: `${cssClasses.PREFIX}-content-wrapper`
     }, children))));
   }
-
 }
 CollapsePanel.contextType = CollapseContext;
 CollapsePanel.propTypes = {

package/lib/es/collapsible/index.js

@@ -6,22 +6,18 @@ import PropTypes from "prop-types";
 import cls from "classnames";
 import { cssClasses } from '@douyinfe/semi-foundation/lib/es/collapsible/constants';
 import '@douyinfe/semi-foundation/lib/es/collapsible/collapsible.css';
-
 class Collapsible extends BaseComponent {
   constructor(props) {
     super(props);
     this.domRef = /*#__PURE__*/React.createRef();
-
     this.handleResize = entryList => {
       const entry = entryList[0];
-
       if (entry) {
         const entryInfo = Collapsible.getEntryInfo(entry);
         this.foundation.updateDOMHeight(entryInfo.height);
         this.foundation.updateDOMInRenderTree(entryInfo.isShown);
       }
     };
-
     this.isChildrenInRenderTree = () => {
       if (this.domRef.current) {
         return this.domRef.current.offsetHeight > 0;
@@ -29,7 +25,6 @@ class Collapsible extends BaseComponent {
         return false;
       }
     };
-
     this.state = {
       domInRenderTree: false,
       domHeight: 0,
@@ -38,7 +33,6 @@ class Collapsible extends BaseComponent {
     };
     this.foundation = new CollapsibleFoundation(this.adapter);
   }
-
   get adapter() {
     return Object.assign(Object.assign({}, super.adapter), {
       setDOMInRenderTree: domInRenderTree => {
@@ -71,47 +65,38 @@ class Collapsible extends BaseComponent {
       }
     });
   }
-
   componentDidMount() {
     super.componentDidMount();
     this.resizeObserver = new ResizeObserver(this.handleResize);
     this.resizeObserver.observe(this.domRef.current);
     const domInRenderTree = this.isChildrenInRenderTree();
     this.foundation.updateDOMInRenderTree(domInRenderTree);
-
     if (domInRenderTree) {
       this.foundation.updateDOMHeight(this.domRef.current.scrollHeight);
     }
   }
-
   componentDidUpdate(prevProps, prevState, snapshot) {
     const changedPropKeys = Object.keys(this.props).filter(key => !_isEqual(this.props[key], prevProps[key]));
     const changedStateKeys = Object.keys(this.state).filter(key => !_isEqual(this.state[key], prevState[key]));
-
     if (changedPropKeys.includes("reCalcKey")) {
       this.foundation.updateDOMHeight(this.domRef.current.scrollHeight);
     }
-
     if (changedStateKeys.includes("domInRenderTree") && this.state.domInRenderTree) {
       this.foundation.updateDOMHeight(this.domRef.current.scrollHeight);
     }
-
     if (changedPropKeys.includes("isOpen")) {
       if (this.props.isOpen || !this.props.motion) {
         this.foundation.updateVisible(this.props.isOpen);
       }
     }
-
     if (this.props.motion && prevProps.isOpen !== this.props.isOpen) {
       this.foundation.updateIsTransitioning(true);
     }
   }
-
   componentWillUnmount() {
     super.componentWillUnmount();
     this.resizeObserver.disconnect();
   }
-
   render() {
     const wrapperStyle = Object.assign({
       overflow: 'hidden',
@@ -127,11 +112,9 @@ class Collapsible extends BaseComponent {
       style: wrapperStyle,
       onTransitionEnd: () => {
         var _a, _b;
-
         if (!this.props.isOpen) {
           this.foundation.updateVisible(false);
         }
-
         this.foundation.updateIsTransitioning(false);
         (_b = (_a = this.props).onMotionEnd) === null || _b === void 0 ? void 0 : _b.call(_a);
       }
@@ -144,9 +127,7 @@ class Collapsible extends BaseComponent {
       id: this.props.id
     }, (this.props.keepDOM || this.props.collapseHeight !== 0 || this.state.visible || this.props.isOpen) && this.props.children));
   }
-
 }
-
 Collapsible.defaultProps = {
   isOpen: false,
   duration: 250,
@@ -155,32 +136,26 @@ Collapsible.defaultProps = {
   collapseHeight: 0,
   fade: false
 };
-
 Collapsible.getEntryInfo = entry => {
   //judge whether parent or self display none
   let inRenderTree;
-
   if (entry.borderBoxSize) {
     inRenderTree = !(entry.borderBoxSize[0].blockSize === 0 && entry.borderBoxSize[0].inlineSize === 0);
   } else {
     inRenderTree = !(entry.contentRect.height === 0 && entry.contentRect.width === 0);
   }
-
   let height = 0;
-
   if (entry.borderBoxSize) {
     height = Math.ceil(entry.borderBoxSize[0].blockSize);
   } else {
     const target = entry.target;
     height = target.clientHeight;
   }
-
   return {
     isShown: inRenderTree,
     height
   };
 };
-
 Collapsible.propTypes = {
   motion: PropTypes.bool,
   children: PropTypes.node,

package/lib/es/configProvider/index.js

@@ -1,14 +1,11 @@
 var __rest = this && this.__rest || function (s, e) {
   var t = {};
-
   for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
-
   if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
     if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
   }
   return t;
 };
-
 import React from 'react';
 import PropTypes from 'prop-types';
 import { BASE_CLASS_PREFIX } from '@douyinfe/semi-foundation/lib/es/base/constants';
@@ -20,31 +17,26 @@ export default class ConfigProvider extends React.Component {
       direction,
       children
     } = this.props;
-
     if (direction === 'rtl') {
       return /*#__PURE__*/React.createElement("div", {
         className: `${BASE_CLASS_PREFIX}-rtl`
       }, children);
     }
-
     return children;
   }
-
   render() {
     const _a = this.props,
-          {
-      children,
-      direction
-    } = _a,
-          rest = __rest(_a, ["children", "direction"]);
-
+      {
+        children,
+        direction
+      } = _a,
+      rest = __rest(_a, ["children", "direction"]);
     return /*#__PURE__*/React.createElement(Context.Provider, {
       value: Object.assign({
         direction
       }, rest)
     }, this.renderChilren());
   }
-
 }
 ConfigProvider.propTypes = {
   locale: PropTypes.object,

package/lib/es/datePicker/dateInput.js

@@ -1,24 +1,16 @@
 import _get from "lodash/get";
-
 var __rest = this && this.__rest || function (s, e) {
   var t = {};
-
   for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
-
   if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
     if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
   }
   return t;
 };
 /* eslint-disable jsx-a11y/click-events-have-key-events */
-
 /* eslint-disable jsx-a11y/no-static-element-interactions */
-
 /* eslint-disable max-lines-per-function */
-
 /* eslint-disable no-unused-vars */
-
-
 import React from 'react';
 import cls from 'classnames';
 import PropTypes from 'prop-types';
@@ -29,48 +21,37 @@ import isNullOrUndefined from '@douyinfe/semi-foundation/lib/es/utils/isNullOrUn
 import { IconCalendar, IconCalendarClock, IconClear } from '@douyinfe/semi-icons';
 import BaseComponent from '../_base/baseComponent';
 import Input from '../input/index';
-import { InsetDateInput, InsetTimeInput } from './insetInput'; // eslint-disable-next-line @typescript-eslint/ban-types
-
+import { InsetDateInput, InsetTimeInput } from './insetInput';
+// eslint-disable-next-line @typescript-eslint/ban-types
 export default class DateInput extends BaseComponent {
   constructor(props) {
     super(props);
-
     this.handleChange = (value, e) => this.foundation.handleChange(value, e);
-
     this.handleEnterPress = e => this.foundation.handleInputComplete(e);
-
     this.handleInputClear = e => this.foundation.handleInputClear(e);
-
     this.handleRangeInputChange = (rangeStart, rangeEnd, e) => {
       const rangeInputValue = this.getRangeInputValue(rangeStart, rangeEnd);
       this.foundation.handleChange(rangeInputValue, e);
     };
-
     this.handleRangeInputClear = e => {
       this.foundation.handleRangeInputClear(e);
     };
-
     this.handleRangeInputEnterPress = (e, rangeStart, rangeEnd) => {
       const rangeInputValue = this.getRangeInputValue(rangeStart, rangeEnd);
       this.foundation.handleRangeInputEnterPress(e, rangeInputValue);
     };
-
     this.handleRangeInputEndKeyPress = e => {
       this.foundation.handleRangeInputEndKeyPress(e);
     };
-
     this.handleRangeInputFocus = (e, rangeType) => {
       this.foundation.handleRangeInputFocus(e, rangeType);
     };
-
     this.handleRangeStartFocus = e => {
       this.handleRangeInputFocus(e, 'rangeStart');
     };
-
     this.handleInsetInputChange = options => {
       this.foundation.handleInsetInputChange(options);
     };
-
     this.getRangeInputValue = (rangeStart, rangeEnd) => {
       const {
         rangeSeparator
@@ -78,13 +59,10 @@ export default class DateInput extends BaseComponent {
       const rangeInputValue = `${rangeStart}${rangeSeparator}${rangeEnd}`;
       return rangeInputValue;
     };
-
     this.foundation = new DateInputFoundation(this.adapter);
   }
-
   get adapter() {
     var _this = this;
-
     return Object.assign(Object.assign({}, super.adapter), {
       updateIsFocusing: isFocusing => this.setState({
         isFocusing
@@ -119,20 +97,16 @@ export default class DateInput extends BaseComponent {
       notifyInsetInputChange: options => this.props.onInsetInputChange(options)
     });
   }
-
   componentDidMount() {
     this.foundation.init();
   }
-
   componentWillUnmount() {
     this.foundation.destroy();
   }
-
   formatText(value) {
     // eslint-disable-next-line max-len
     return value && value.length ? this.foundation.formatShowText(value) : '';
   }
-
   renderRangePrefix() {
     const {
       prefix,
@@ -148,7 +122,6 @@ export default class DateInput extends BaseComponent {
       "x-semi-prop": "prefix,insetLabel"
     }, labelNode) : null;
   }
-
   renderRangeSeparator(rangeStart, rangeEnd) {
     const {
       disabled,
@@ -163,7 +136,6 @@ export default class DateInput extends BaseComponent {
       className: separatorCls
     }, rangeSeparator);
   }
-
   renderRangeClearBtn(rangeStart, rangeEnd) {
     const {
       showClear,
@@ -182,7 +154,6 @@ export default class DateInput extends BaseComponent {
       "aria-hidden": true
     })) : null;
   }
-
   renderRangeSuffix(suffix) {
     const {
       prefixCls,
@@ -195,7 +166,6 @@ export default class DateInput extends BaseComponent {
     }, suffix) : null;
     return rangeSuffix;
   }
-
   renderRangeInput(rangeProps) {
     const {
       // this.props
@@ -268,15 +238,13 @@ export default class DateInput extends BaseComponent {
       ref: rangeInputEndRef
     })), this.renderRangeClearBtn(rangeStart, rangeEnd), this.renderRangeSuffix(suffix));
   }
-
   isRenderMultipleInputs() {
     const {
       type
-    } = this.props; // isRange and not monthRange render multiple inputs
-
+    } = this.props;
+    // isRange and not monthRange render multiple inputs
     return type.includes('Range') && type !== 'monthRange';
   }
-
   renderInputInset() {
     const {
       type,
@@ -294,14 +262,12 @@ export default class DateInput extends BaseComponent {
       value,
       insetInputValue
     });
-
     const {
       dateStart,
       dateEnd,
       timeStart,
       timeEnd
     } = _get(insetInput, 'placeholder', {});
-
     const {
       datePlaceholder,
       timePlaceholder
@@ -345,47 +311,45 @@ export default class DateInput extends BaseComponent {
       onFocus: handleInsetTimeFocus
     })));
   }
-
   renderTriggerInput() {
     const _a = this.props,
-          {
-      placeholder,
-      type,
-      value,
-      inputValue,
-      inputStyle,
-      disabled,
-      showClear,
-      inputReadOnly,
-      insetLabel,
-      validateStatus,
-      block,
-      prefixCls,
-      multiple,
-      // Whether to allow multiple values for email and file types
-      dateFnsLocale,
-      // No need to pass to input
-      onBlur,
-      onClear,
-      onFocus,
-      prefix,
-      autofocus,
-      size,
-      inputRef,
-      // range input support props, no need passing to not range type
-      rangeInputStartRef,
-      rangeInputEndRef,
-      onRangeClear,
-      onRangeBlur,
-      onRangeEndTabPress,
-      rangeInputFocus,
-      rangeSeparator,
-      insetInput,
-      insetInputValue,
-      defaultPickerValue
-    } = _a,
-          rest = __rest(_a, ["placeholder", "type", "value", "inputValue", "inputStyle", "disabled", "showClear", "inputReadOnly", "insetLabel", "validateStatus", "block", "prefixCls", "multiple", "dateFnsLocale", "onBlur", "onClear", "onFocus", "prefix", "autofocus", "size", "inputRef", "rangeInputStartRef", "rangeInputEndRef", "onRangeClear", "onRangeBlur", "onRangeEndTabPress", "rangeInputFocus", "rangeSeparator", "insetInput", "insetInputValue", "defaultPickerValue"]);
-
+      {
+        placeholder,
+        type,
+        value,
+        inputValue,
+        inputStyle,
+        disabled,
+        showClear,
+        inputReadOnly,
+        insetLabel,
+        validateStatus,
+        block,
+        prefixCls,
+        multiple,
+        // Whether to allow multiple values for email and file types
+        dateFnsLocale,
+        // No need to pass to input
+        onBlur,
+        onClear,
+        onFocus,
+        prefix,
+        autofocus,
+        size,
+        inputRef,
+        // range input support props, no need passing to not range type
+        rangeInputStartRef,
+        rangeInputEndRef,
+        onRangeClear,
+        onRangeBlur,
+        onRangeEndTabPress,
+        rangeInputFocus,
+        rangeSeparator,
+        insetInput,
+        insetInputValue,
+        defaultPickerValue
+      } = _a,
+      rest = __rest(_a, ["placeholder", "type", "value", "inputValue", "inputStyle", "disabled", "showClear", "inputReadOnly", "insetLabel", "validateStatus", "block", "prefixCls", "multiple", "dateFnsLocale", "onBlur", "onClear", "onFocus", "prefix", "autofocus", "size", "inputRef", "rangeInputStartRef", "rangeInputEndRef", "onRangeClear", "onRangeBlur", "onRangeEndTabPress", "rangeInputFocus", "rangeSeparator", "insetInput", "insetInputValue", "defaultPickerValue"]);
     const dateIcon = /*#__PURE__*/React.createElement(IconCalendar, {
       "aria-hidden": true
     });
@@ -394,13 +358,11 @@ export default class DateInput extends BaseComponent {
     });
     const suffix = type.includes('Time') ? dateTimeIcon : dateIcon;
     let text = '';
-
     if (!isNullOrUndefined(inputValue)) {
       text = inputValue;
     } else if (value) {
       text = this.formatText(value);
     }
-
     const inputCls = cls({
       [`${prefixCls}-input-readonly`]: inputReadOnly,
       [`${prefixCls}-monthRange-input`]: type === 'monthRange'
@@ -433,14 +395,12 @@ export default class DateInput extends BaseComponent {
       onFocus: onFocus
     }));
   }
-
   render() {
     const {
       insetInput
     } = this.props;
     return insetInput ? this.renderInputInset() : this.renderTriggerInput();
   }
-
 }
 DateInput.propTypes = {
   borderless: PropTypes.bool,

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

@@ -48,7 +48,7 @@ export interface DatePickerProps extends DatePickerFoundationProps {
     yearAndMonthOpts?: ScrollItemProps<any>;
     dropdownMargin?: PopoverProps['margin'];
 }
-export declare type DatePickerState = DatePickerFoundationState;
+export type DatePickerState = DatePickerFoundationState;
 export default class DatePicker extends BaseComponent<DatePickerProps, DatePickerState> {
     static contextType: React.Context<ContextValue>;
     static propTypes: {