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

package/lib/cjs/_base/base.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
-export declare type ArrayElement<ArrayType extends readonly unknown[]> = ArrayType extends readonly (infer ElementType)[] ? ElementType : never;
-export declare type Motion<P extends Record<string, any> = any> = boolean | MotionObject | MotionFunction<P>;
-export declare type MotionFunction<P> = (props: P) => MotionObject;
+export type ArrayElement<ArrayType extends readonly unknown[]> = ArrayType extends readonly (infer ElementType)[] ? ElementType : never;
+export type Motion<P extends Record<string, any> = any> = boolean | MotionObject | MotionFunction<P>;
+export type MotionFunction<P> = (props: P) => MotionObject;
 export interface MotionObject {
     [x: string]: any;
     children?: React.ReactNode | ((props: MotionChildrenProps) => React.ReactNode);

package/lib/cjs/_base/baseComponent.d.ts

@@ -6,7 +6,7 @@ import React, { Component, ReactNode } from 'react';
 import { DefaultAdapter } from '@douyinfe/semi-foundation/lib/cjs/base/foundation';
 import { VALIDATE_STATUS } from '@douyinfe/semi-foundation/lib/cjs/base/constants';
 import { ArrayElement } from './base';
-export declare type ValidateStatus = ArrayElement<typeof VALIDATE_STATUS>;
+export type ValidateStatus = ArrayElement<typeof VALIDATE_STATUS>;
 export interface BaseProps {
     style?: React.CSSProperties;
     className?: string;

package/lib/cjs/_base/baseComponent.js

@@ -4,40 +4,33 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _react = require("react");
-
 var _log = _interopRequireDefault(require("@douyinfe/semi-foundation/lib/cjs/utils/log"));
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 /**
  * The Semi Foundation / Adapter architecture split was inspired by Material Component For Web. （https://github.com/material-components/material-components-web）
  * We re-implemented our own code based on the principle and added more functions we need according to actual needs.
  */
+
 const {
   hasOwnProperty
-} = Object.prototype; // eslint-disable-next-line
-
+} = Object.prototype;
+// eslint-disable-next-line
 class BaseComponent extends _react.Component {
   constructor(props) {
-    super(props); // eslint-disable-next-line
-
+    super(props);
+    // eslint-disable-next-line
     this.isControlled = key => Boolean(key && this.props && typeof this.props === 'object' && hasOwnProperty.call(this.props, key));
-
     this.cache = {};
     this.foundation = null;
   }
-
   componentDidMount() {
     this.foundation && typeof this.foundation.init === 'function' && this.foundation.init();
   }
-
   componentWillUnmount() {
     this.foundation && typeof this.foundation.destroy === 'function' && this.foundation.destroy();
     this.cache = {};
   }
-
   get adapter() {
     return {
       getContext: key => {
@@ -66,17 +59,13 @@ class BaseComponent extends _react.Component {
       }
     };
   }
-
   log(text) {
     for (var _len = arguments.length, rest = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
       rest[_key - 1] = arguments[_key];
     }
-
     return (0, _log.default)(text, ...rest);
   }
-
 }
-
 exports.default = BaseComponent;
 BaseComponent.propTypes = {};
 BaseComponent.defaultProps = {};

package/lib/cjs/_base/reactUtils.js

@@ -15,20 +15,17 @@ Object.defineProperty(exports, "isHTMLElement", {
   }
 });
 exports.isReactComponent = isReactComponent;
-
 var _react = _interopRequireDefault(require("react"));
-
 var _dom = require("@douyinfe/semi-foundation/lib/cjs/utils/dom");
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 // https://stackoverflow.com/questions/33199959/how-to-detect-a-react-component-vs-a-react-element
+
 function isClassComponent(component) {
   return typeof component === 'function' && Boolean(component.prototype.isReactComponent);
 }
-
 function isFunctionalComponent(Component) {
-  return typeof Component === 'function' && // can be various things
+  return typeof Component === 'function' &&
+  // can be various things
   !(Component.prototype && Component.prototype.isReactComponent // native arrows don't have prototypes
   );
 }
@@ -36,15 +33,12 @@ function isFunctionalComponent(Component) {
 function isReactComponent(component) {
   return isClassComponent(component) || isFunctionalComponent(component);
 }
-
 function isElement(element) {
   return /*#__PURE__*/_react.default.isValidElement(element);
 }
-
 function isCompositeTypeElement(element) {
   return isElement(element) && typeof element.type === 'function';
 }
-
 function isEmptyChildren(children) {
   return _react.default.Children.count(children) === 0;
 }

package/lib/cjs/_cssAnimation/index.js

@@ -4,23 +4,16 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _isEqual2 = _interopRequireDefault(require("lodash/isEqual"));
-
 var _react = _interopRequireDefault(require("react"));
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 class CSSAnimation extends _react.default.Component {
   constructor(props) {
     super(props);
-
     this.handleAnimationStart = () => {
       var _a, _b;
-
       (_b = (_a = this.props).onAnimationStart) === null || _b === void 0 ? void 0 : _b.call(_a);
     };
-
     this.handleAnimationEnd = () => {
       this.setState({
         currentClassName: this.props.endClassName,
@@ -30,11 +23,9 @@ class CSSAnimation extends _react.default.Component {
         isAnimating: false
       }, () => {
         var _a, _b;
-
         (_b = (_a = this.props).onAnimationEnd) === null || _b === void 0 ? void 0 : _b.call(_a, false);
       });
     };
-
     this.state = {
       currentClassName: this.props.startClassName,
       extraStyle: {
@@ -43,15 +34,12 @@ class CSSAnimation extends _react.default.Component {
       isAnimating: true
     };
   }
-
   componentDidMount() {
-    var _a, _b, _c, _d; // The purpose is to shield the impact of the presence or absence of animation on the other semi component life cycle.
+    var _a, _b, _c, _d;
+    // The purpose is to shield the impact of the presence or absence of animation on the other semi component life cycle.
     // In order to make the component side do not need to manually call the next life cycle function when there is no animation,
     // so when there is no animation , it is logically (and only logically) regarded as an animation with a duration of 0.
-
-
     (_b = (_a = this.props).onAnimationStart) === null || _b === void 0 ? void 0 : _b.call(_a);
-
     if (!this.props.motion) {
       (_d = (_c = this.props).onAnimationEnd) === null || _d === void 0 ? void 0 : _d.call(_c, false);
       this.setState({
@@ -59,12 +47,9 @@ class CSSAnimation extends _react.default.Component {
       });
     }
   }
-
   componentDidUpdate(prevProps, prevState, snapshot) {
     const changedKeys = Object.keys(this.props).filter(key => !(0, _isEqual2.default)(this.props[key], prevProps[key]));
-
     if (changedKeys.includes("animationState")) {}
-
     if (changedKeys.includes("startClassName") || changedKeys.includes('replayKey') || changedKeys.includes("motion")) {
       this.setState({
         currentClassName: this.props.startClassName,
@@ -74,9 +59,7 @@ class CSSAnimation extends _react.default.Component {
         isAnimating: true
       }, () => {
         var _a, _b, _c, _d;
-
         (_b = (_a = this.props).onAnimationStart) === null || _b === void 0 ? void 0 : _b.call(_a);
-
         if (!this.props.motion) {
           (_d = (_c = this.props).onAnimationEnd) === null || _d === void 0 ? void 0 : _d.call(_c, this.state.isAnimating);
           this.setState({
@@ -86,10 +69,8 @@ class CSSAnimation extends _react.default.Component {
       });
     }
   }
-
   render() {
     var _a;
-
     if (this.props.motion) {
       return this.props.children({
         animationClassName: (_a = this.state.currentClassName) !== null && _a !== void 0 ? _a : "",
@@ -109,13 +90,12 @@ class CSSAnimation extends _react.default.Component {
       });
     }
   }
-
 }
-
 CSSAnimation.defaultProps = {
   motion: true,
   replayKey: ""
-}; // const mergeAnimationFunction = (eventHandleFunctions: AnimationEventsNeedBind[]) => {
+};
+// const mergeAnimationFunction = (eventHandleFunctions: AnimationEventsNeedBind[]) => {
 //     //merge function in objects
 //     const mergedFunction = {};
 //     eventHandleFunctions.forEach(eventHandleFunction => {
@@ -134,6 +114,5 @@ CSSAnimation.defaultProps = {
 //     return mergedFunction;
 // };
 // export { mergeAnimationFunction };
-
 var _default = CSSAnimation;
 exports.default = _default;

package/lib/cjs/_portal/index.js

@@ -4,74 +4,53 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _react = require("react");
-
 var _reactDom = require("react-dom");
-
 var _constants = require("@douyinfe/semi-foundation/lib/cjs/base/constants");
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _classnames = _interopRequireDefault(require("classnames"));
-
 var _context = _interopRequireDefault(require("../configProvider/context"));
-
 require("@douyinfe/semi-foundation/lib/cjs/_portal/portal.css");
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 const defaultGetContainer = () => document.body;
-
 class Portal extends _react.PureComponent {
   constructor(props) {
     var _this;
-
     super(props);
     _this = this;
-
     this.addStyle = function () {
       let style = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-
       if (_this.el) {
         for (const key of Object.keys(style)) {
           _this.el.style[key] = style[key];
         }
       }
     };
-
     this.addClass = function (prefixCls) {
       const {
         direction
       } = _this.context;
-
       for (var _len = arguments.length, classNames = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
         classNames[_key - 1] = arguments[_key];
       }
-
       const cls = (0, _classnames.default)(prefixCls, ...classNames, {
         [`${prefixCls}-rtl`]: direction === 'rtl'
       });
-
       if (_this.el) {
         _this.el.className = cls;
       }
     };
-
     try {
       this.el = document.createElement('div');
     } catch (e) {}
-
     this.state = {
       container: undefined
     };
   }
-
   componentDidMount() {
     if (!this.el) {
       this.el = document.createElement('div');
     }
-
     const {
       state,
       props,
@@ -79,7 +58,6 @@ class Portal extends _react.PureComponent {
     } = this;
     const getContainer = props.getPopupContainer || context.getPopupContainer || defaultGetContainer;
     const container = getContainer();
-
     if (container !== state.container) {
       // const computedStyle = window.getComputedStyle(container);
       // if (computedStyle.position !== 'relative') {
@@ -93,43 +71,34 @@ class Portal extends _react.PureComponent {
       });
     }
   }
-
   componentDidUpdate(prevProps) {
     // visible callback
     const {
       didUpdate
     } = this.props;
-
     if (didUpdate) {
       didUpdate(prevProps);
     }
   }
-
   componentWillUnmount() {
     const {
       container
     } = this.state;
-
     if (container) {
       container.removeChild(this.el);
     }
   }
-
   render() {
     const {
       state,
       props
     } = this;
-
     if (state.container) {
       return /*#__PURE__*/(0, _reactDom.createPortal)(props.children, this.el);
     }
-
     return null;
   }
-
 }
-
 Portal.contextType = _context.default;
 Portal.defaultProps = {
   // getPopupContainer: () => document.body,

package/lib/cjs/_utils/hooks/usePrevFocus.js

@@ -4,17 +4,11 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.usePrevFocus = usePrevFocus;
-
 var _isFunction2 = _interopRequireDefault(require("lodash/isFunction"));
-
 var _get2 = _interopRequireDefault(require("lodash/get"));
-
 var _react = require("react");
-
 var _index = require("../index");
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 /* istanbul ignore next */
 function usePrevFocus() {
   const [prevFocusElement, setPrevFocus] = (0, _react.useState)((0, _index.getActiveElement)());

package/lib/cjs/_utils/index.js

@@ -10,25 +10,15 @@ exports.getHighLightTextHTML = void 0;
 exports.isNodeContainsFocus = isNodeContainsFocus;
 exports.registerMediaQuery = exports.isSemiIcon = void 0;
 exports.stopPropagation = stopPropagation;
-
 var _get2 = _interopRequireDefault(require("lodash/get"));
-
 var _set2 = _interopRequireDefault(require("lodash/set"));
-
 var _cloneDeepWith2 = _interopRequireDefault(require("lodash/cloneDeepWith"));
-
 var _react = _interopRequireDefault(require("react"));
-
 var _warning = _interopRequireDefault(require("@douyinfe/semi-foundation/lib/cjs/utils/warning"));
-
 var _getHighlight = require("@douyinfe/semi-foundation/lib/cjs/utils/getHighlight");
-
 var _dom = require("@douyinfe/semi-foundation/lib/cjs/utils/dom");
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 /* eslint-disable max-len */
-
 /* argus-disable unPkgSensitiveInfo */
 
 /**
@@ -41,7 +31,6 @@ function stopPropagation(e, noImmediate) {
   if (e && typeof e.stopPropagation === 'function') {
     e.stopPropagation();
   }
-
   if (!noImmediate && e.nativeEvent && typeof e.nativeEvent.stopImmediatePropagation === 'function') {
     e.nativeEvent.stopImmediatePropagation();
   }
@@ -51,45 +40,37 @@ function stopPropagation(e, noImmediate) {
  *
  * skip clone function and react element
  */
-
-
 function cloneDeep(value, customizer) {
   return (0, _cloneDeepWith2.default)(value, v => {
     if (typeof customizer === 'function') {
       return customizer(v);
     }
-
     if (typeof v === 'function' || /*#__PURE__*/_react.default.isValidElement(v)) {
       return v;
     }
-
     if (Object.prototype.toString.call(v) === '[object Error]') {
       return v;
-    } // it is tricky
+    }
+    // it is tricky
     // when array length beyond max length, array.length will be 0
-
-
     if (Array.isArray(v) && v.length === 0) {
       const keys = Object.keys(v);
-
       if (keys.length) {
         const newArray = [];
         keys.forEach(key => {
           (0, _set2.default)(newArray, key, v[key]);
-        }); // internal-issues:887
-
+        });
+        // internal-issues:887
         try {
           (0, _warning.default)((0, _get2.default)(process, 'env.NODE_ENV') !== 'production', `[Semi] You may use an out-of-bounds array. In some cases, your program may not behave as expected.
                     The maximum length of an array is 4294967295.
                     Please check whether the array subscript in your data exceeds the maximum value of the JS array subscript`);
         } catch (e) {}
-
         return newArray;
       } else {
         return undefined;
       }
     }
-
     return undefined;
   });
 }
@@ -106,8 +87,6 @@ function cloneDeep(value, customizer) {
  *
  * @return  {Array<object>}
  */
-
-
 const getHighLightTextHTML = _ref => {
   let {
     sourceString = '',
@@ -131,7 +110,6 @@ const getHighLightTextHTML = _ref => {
       highlight
     } = chunk;
     const text = sourceString.substr(start, end - start);
-
     if (highlight) {
       return /*#__PURE__*/_react.default.createElement(markEle, {
         style: highlightStyle,
@@ -149,20 +127,15 @@ const getHighLightTextHTML = _ref => {
  * @param {object} param param object
  * @returns function
  */
-
-
 exports.getHighLightTextHTML = getHighLightTextHTML;
-
 const registerMediaQuery = (media, _ref2) => {
   let {
     match,
     unmatch,
     callInInit = true
   } = _ref2;
-
   if (typeof window !== 'undefined') {
     const mediaQueryList = window.matchMedia(media);
-
     function handlerMediaChange(e) {
       if (e.matches) {
         match && match(e);
@@ -170,18 +143,14 @@ const registerMediaQuery = (media, _ref2) => {
         unmatch && unmatch(e);
       }
     }
-
     callInInit && handlerMediaChange(mediaQueryList);
-
     if (Object.prototype.hasOwnProperty.call(mediaQueryList, 'addEventListener')) {
       mediaQueryList.addEventListener('change', handlerMediaChange);
       return () => mediaQueryList.removeEventListener('change', handlerMediaChange);
     }
-
     mediaQueryList.addListener(handlerMediaChange);
     return () => mediaQueryList.removeListener(handlerMediaChange);
   }
-
   return () => undefined;
 };
 /**
@@ -189,31 +158,23 @@ const registerMediaQuery = (media, _ref2) => {
  * @param icon 元素
  * @returns boolean
  */
-
-
 exports.registerMediaQuery = registerMediaQuery;
-
 const isSemiIcon = icon => /*#__PURE__*/_react.default.isValidElement(icon) && (0, _get2.default)(icon.type, 'elementType') === 'Icon';
-
 exports.isSemiIcon = isSemiIcon;
-
 function getActiveElement() {
   return document ? document.activeElement : null;
 }
-
 function isNodeContainsFocus(node) {
   const activeElement = getActiveElement();
   return activeElement === node || node.contains(activeElement);
 }
-
 function getFocusableElements(node) {
   if (!(0, _dom.isHTMLElement)(node)) {
     return [];
   }
-
   const focusableSelectorsList = ["input:not([disabled]):not([tabindex='-1'])", "textarea:not([disabled]):not([tabindex='-1'])", "button:not([disabled]):not([tabindex='-1'])", "a[href]:not([tabindex='-1'])", "select:not([disabled]):not([tabindex='-1'])", "area[href]:not([tabindex='-1'])", "iframe:not([tabindex='-1'])", "object:not([tabindex='-1'])", "*[tabindex]:not([tabindex='-1'])", "*[contenteditable]:not([tabindex='-1'])"];
-  const focusableSelectorsStr = focusableSelectorsList.join(','); // we are not filtered elements which are invisible
-
+  const focusableSelectorsStr = focusableSelectorsList.join(',');
+  // we are not filtered elements which are invisible
   const focusableElements = Array.from(node.querySelectorAll(focusableSelectorsStr));
   return focusableElements;
 }

package/lib/cjs/anchor/anchor-context.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import Anchor, { AnchorProps, AnchorState } from '.';
-export declare type AnchorContextType = Pick<AnchorProps, 'showTooltip' | 'position' | 'autoCollapse' | 'size'> & Pick<AnchorState, 'activeLink'> & Pick<Anchor, 'addLink' | 'removeLink' | 'childMap'> & {
+export type AnchorContextType = Pick<AnchorProps, 'showTooltip' | 'position' | 'autoCollapse' | 'size'> & Pick<AnchorState, 'activeLink'> & Pick<Anchor, 'addLink' | 'removeLink' | 'childMap'> & {
     onClick: Anchor['handleClick'];
 };
 declare const AnchorContext: React.Context<AnchorContextType>;

package/lib/cjs/anchor/anchor-context.js

@@ -4,12 +4,8 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _react = _interopRequireDefault(require("react"));
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 const AnchorContext = /*#__PURE__*/_react.default.createContext(null);
-
 var _default = AnchorContext;
 exports.default = _default;