@douyinfe/semi-ui 2.1.0-next.0 → 2.1.0

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

@@ -1,142 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import { AutoCompleteAdapter, StateOptionItem, DataItem } from '@douyinfe/semi-foundation/lib/cjs/autoComplete/foundation';
-import BaseComponent, { ValidateStatus } from '../_base/baseComponent';
-import { Position } from '../tooltip';
-import Option from '../select/option';
-import '@douyinfe/semi-foundation/lib/cjs/autoComplete/autoComplete.css';
-import { Motion } from '../_base/base';
-/**
- * AutoComplete is an enhanced Input (candidates suggest that users can choose or not),
- * and the Select positioning that supports Search is still a selector.
- * 1. When you click to expand, Select will clear all input values, but AutoComplete will not
- * 2. AutoComplete's renderSelectedItem only supports simple string returns, while Select's renderSelectedItem can return ReactNode
- * 3. Select props.value supports incoming object, but autoComplete only supports string (because the value needs to be displayed in Input)
- */
-export interface BaseDataItem extends DataItem {
-    label?: React.ReactNode;
-}
-export interface AutoCompleteProps<Item extends BaseDataItem = BaseDataItem> {
-    autoAdjustOverflow?: boolean;
-    autoFocus?: boolean;
-    className?: string;
-    children?: React.ReactNode;
-    data?: Array<string | Item | number>;
-    disabled?: boolean;
-    defaultOpen?: boolean;
-    defaultValue?: string | number | Item;
-    defaultActiveFirstOption?: boolean;
-    dropdownMatchSelectWidth?: boolean;
-    dropdownClassName?: string;
-    dropdownStyle?: React.CSSProperties;
-    emptyContent?: React.ReactNode | null;
-    getPopupContainer?: () => HTMLElement;
-    insetLabel?: React.ReactNode;
-    loading?: boolean;
-    motion?: Motion;
-    maxHeight?: string | number;
-    mouseEnterDelay?: number;
-    mouseLeaveDelay?: number;
-    onFocus?: (e: React.FocusEvent) => void;
-    onBlur?: (e: React.FocusEvent) => void;
-    onChange?: (value: string | number) => void;
-    onSearch?: (inputValue: string) => void;
-    onSelect?: (value: string | Item | number) => void;
-    onClear?: () => void;
-    onChangeWithObject?: boolean;
-    onSelectWithObject?: boolean;
-    onDropdownVisibleChange?: (visible: boolean) => void;
-    prefix?: React.ReactNode;
-    placeholder?: string;
-    position?: Position;
-    renderItem?: (option: Item | string) => React.ReactNode;
-    renderSelectedItem?: (option: Item) => string;
-    size?: 'small' | 'default' | 'large';
-    style?: React.CSSProperties;
-    suffix?: React.ReactNode;
-    showClear?: boolean;
-    triggerRender?: (props?: any) => React.ReactNode;
-    stopPropagation?: boolean | string;
-    value?: string | number;
-    validateStatus?: ValidateStatus;
-    zIndex?: number;
-}
-interface KeyboardEventType {
-    onKeyDown?: React.KeyboardEventHandler;
-}
-interface AutoCompleteState {
-    dropdownMinWidth: null | number;
-    inputValue: string | undefined | number;
-    options: StateOptionItem[];
-    visible: boolean;
-    focusIndex: number;
-    selection: Map<any, any>;
-    rePosKey: number;
-    keyboardEventSet?: KeyboardEventType;
-}
-declare class AutoComplete extends BaseComponent<AutoCompleteProps, AutoCompleteState> {
-    static propTypes: {
-        autoFocus: PropTypes.Requireable<boolean>;
-        autoAdjustOverflow: PropTypes.Requireable<boolean>;
-        className: PropTypes.Requireable<string>;
-        children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-        data: PropTypes.Requireable<any[]>;
-        defaultOpen: PropTypes.Requireable<boolean>;
-        defaultValue: PropTypes.Requireable<string | number>;
-        defaultActiveFirstOption: PropTypes.Requireable<boolean>;
-        disabled: PropTypes.Requireable<boolean>;
-        dropdownMatchSelectWidth: PropTypes.Requireable<boolean>;
-        dropdownClassName: PropTypes.Requireable<string>;
-        dropdownStyle: PropTypes.Requireable<object>;
-        emptyContent: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-        onSearch: PropTypes.Requireable<(...args: any[]) => any>;
-        onSelect: PropTypes.Requireable<(...args: any[]) => any>;
-        onClear: PropTypes.Requireable<(...args: any[]) => any>;
-        onBlur: PropTypes.Requireable<(...args: any[]) => any>;
-        onFocus: PropTypes.Requireable<(...args: any[]) => any>;
-        onChange: PropTypes.Requireable<(...args: any[]) => any>;
-        position: PropTypes.Requireable<"top" | "topLeft" | "topRight" | "left" | "leftTop" | "leftBottom" | "right" | "rightTop" | "rightBottom" | "bottom" | "bottomLeft" | "bottomRight" | "leftTopOver" | "rightTopOver">;
-        placeholder: PropTypes.Requireable<string>;
-        prefix: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-        onChangeWithObject: PropTypes.Requireable<boolean>;
-        onSelectWithObject: PropTypes.Requireable<boolean>;
-        renderItem: PropTypes.Requireable<(...args: any[]) => any>;
-        renderSelectedItem: PropTypes.Requireable<(...args: any[]) => any>;
-        suffix: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-        showClear: PropTypes.Requireable<boolean>;
-        size: PropTypes.Requireable<"default" | "small" | "large">;
-        style: PropTypes.Requireable<object>;
-        stopPropagation: PropTypes.Requireable<string | boolean>;
-        maxHeight: PropTypes.Requireable<string | number>;
-        mouseEnterDelay: PropTypes.Requireable<number>;
-        mouseLeaveDelay: PropTypes.Requireable<number>;
-        motion: PropTypes.Requireable<boolean | object>;
-        getPopupContainer: PropTypes.Requireable<(...args: any[]) => any>;
-        triggerRender: PropTypes.Requireable<(...args: any[]) => any>;
-        value: PropTypes.Requireable<string | number>;
-        validateStatus: PropTypes.Requireable<"default" | "error" | "warning" | "success">;
-        zIndex: PropTypes.Requireable<number>;
-    };
-    static Option: typeof Option;
-    static defaultProps: Partial<AutoCompleteProps>;
-    triggerRef: React.RefObject<HTMLDivElement> | null;
-    optionsRef: React.RefObject<HTMLDivElement> | null;
-    private clickOutsideHandler;
-    constructor(props: AutoCompleteProps);
-    get adapter(): AutoCompleteAdapter<AutoCompleteProps, AutoCompleteState>;
-    componentDidMount(): void;
-    componentWillUnmount(): void;
-    componentDidUpdate(prevProps: AutoCompleteProps, prevState: AutoCompleteState): void;
-    onSelect: (option: StateOptionItem, optionIndex: number, e: React.MouseEvent | React.KeyboardEvent) => void;
-    onSearch: (value: string) => void;
-    onBlur: (e: React.FocusEvent) => void;
-    onFocus: (e: React.FocusEvent) => void;
-    onInputClear: () => void;
-    handleInputClick: (e: React.MouseEvent) => void;
-    renderInput(): React.ReactNode;
-    renderLoading(): JSX.Element;
-    renderOption(option: StateOptionItem, optionIndex: number): React.ReactNode;
-    renderOptionList(): React.ReactNode;
-    render(): React.ReactNode;
-}
-export default AutoComplete;

package/lib/cjs/autoComplete/index.js

@@ -1,427 +0,0 @@
-"use strict";
-
-var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
-
-var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
-
-_Object$defineProperty(exports, "__esModule", {
-  value: true
-});
-
-exports.default = void 0;
-
-var _map = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/map"));
-
-var _assign = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/assign"));
-
-var _from = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/array/from"));
-
-var _values = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/values"));
-
-var _map2 = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/map"));
-
-var _filter = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/filter"));
-
-var _react = _interopRequireDefault(require("react"));
-
-var _propTypes = _interopRequireDefault(require("prop-types"));
-
-var _classnames = _interopRequireDefault(require("classnames"));
-
-var _lodashEs = require("lodash-es");
-
-var _constants = require("@douyinfe/semi-foundation/lib/cjs/autoComplete/constants");
-
-var _foundation = _interopRequireDefault(require("@douyinfe/semi-foundation/lib/cjs/autoComplete/foundation"));
-
-var _constants2 = require("@douyinfe/semi-foundation/lib/cjs/popover/constants");
-
-var _baseComponent = _interopRequireDefault(require("../_base/baseComponent"));
-
-var _spin = _interopRequireDefault(require("../spin"));
-
-var _popover = _interopRequireDefault(require("../popover"));
-
-var _input = _interopRequireDefault(require("../input"));
-
-var _trigger = _interopRequireDefault(require("../trigger"));
-
-var _option = _interopRequireDefault(require("../select/option"));
-
-var _warning = _interopRequireDefault(require("@douyinfe/semi-foundation/lib/cjs/utils/warning"));
-
-require("@douyinfe/semi-foundation/lib/cjs/autoComplete/autoComplete.css");
-
-/* eslint-disable @typescript-eslint/ban-types, max-len */
-const prefixCls = _constants.cssClasses.PREFIX;
-const sizeSet = _constants.strings.SIZE;
-const positionSet = _constants.strings.POSITION;
-const statusSet = _constants.strings.STATUS;
-
-class AutoComplete extends _baseComponent.default {
-  constructor(props) {
-    super(props);
-
-    this.onSelect = (option, optionIndex, e) => {
-      this.foundation.handleSelect(option, optionIndex);
-    };
-
-    this.onSearch = value => {
-      this.foundation.handleSearch(value);
-    };
-
-    this.onBlur = e => this.foundation.handleBlur(e);
-
-    this.onFocus = e => this.foundation.handleFocus(e);
-
-    this.onInputClear = () => this.foundation.handleClear();
-
-    this.handleInputClick = e => this.foundation.handleInputClick(e);
-
-    this.foundation = new _foundation.default(this.adapter);
-    const initRePosKey = 1;
-    this.state = {
-      dropdownMinWidth: null,
-      inputValue: '',
-      // option list
-      options: [],
-      // popover visible
-      visible: false,
-      // current focus option index
-      focusIndex: props.defaultActiveFirstOption ? 0 : -1,
-      // current selected options
-      selection: new _map.default(),
-      rePosKey: initRePosKey
-    };
-    this.triggerRef = /*#__PURE__*/_react.default.createRef();
-    this.optionsRef = /*#__PURE__*/_react.default.createRef();
-    this.clickOutsideHandler = null;
-    (0, _warning.default)('triggerRender' in this.props && typeof this.props.triggerRender === 'function', "[Semi AutoComplete] \n            - If you are using the following props: 'suffix', 'prefix', 'showClear', 'validateStatus', and 'size', \n            please notice that they will be removed in the next major version.\n            Please use 'componentProps' to retrieve these props instead.\n            - If you are using 'onBlur', 'onFocus', please try to avoid using them and look for changes in the future.");
-  }
-
-  get adapter() {
-    const keyboardAdapter = {
-      registerKeyDown: cb => {
-        const keyboardEventSet = {
-          onKeyDown: cb
-        };
-        this.setState({
-          keyboardEventSet
-        });
-      },
-      unregisterKeyDown: cb => {
-        this.setState({
-          keyboardEventSet: {}
-        });
-      },
-      updateFocusIndex: focusIndex => {
-        this.setState({
-          focusIndex
-        });
-      }
-    };
-    return (0, _assign.default)((0, _assign.default)((0, _assign.default)({}, super.adapter), keyboardAdapter), {
-      getTriggerWidth: () => {
-        const el = this.triggerRef.current;
-        return el && el.getBoundingClientRect().width;
-      },
-      setOptionWrapperWidth: width => {
-        this.setState({
-          dropdownMinWidth: width
-        });
-      },
-      updateInputValue: inputValue => {
-        this.setState({
-          inputValue
-        });
-      },
-      toggleListVisible: isShow => {
-        this.setState({
-          visible: isShow
-        });
-      },
-      updateOptionList: optionList => {
-        this.setState({
-          options: optionList
-        });
-      },
-      updateSelection: selection => {
-        this.setState({
-          selection
-        });
-      },
-      notifySearch: inputValue => {
-        this.props.onSearch(inputValue);
-      },
-      notifyChange: value => {
-        this.props.onChange(value);
-      },
-      notifySelect: option => {
-        this.props.onSelect(option);
-      },
-      notifyDropdownVisibleChange: isVisible => {
-        this.props.onDropdownVisibleChange(isVisible);
-      },
-      notifyClear: () => {
-        this.props.onClear();
-      },
-      notifyFocus: event => {
-        this.props.onFocus(event);
-      },
-      notifyBlur: event => {
-        this.props.onBlur(event);
-      },
-      rePositionDropdown: () => {
-        let {
-          rePosKey
-        } = this.state;
-        rePosKey = rePosKey + 1;
-        this.setState({
-          rePosKey
-        });
-      }
-    });
-  }
-
-  componentDidMount() {
-    this.foundation.init();
-  }
-
-  componentWillUnmount() {
-    this.foundation.destroy();
-  }
-
-  componentDidUpdate(prevProps, prevState) {
-    if (!(0, _lodashEs.isEqual)(this.props.data, prevProps.data)) {
-      this.foundation.handleDataChange(this.props.data);
-    }
-
-    if (this.props.value !== prevProps.value) {
-      this.foundation.handleValueChange(this.props.value);
-    }
-  }
-
-  renderInput() {
-    const {
-      size,
-      prefix,
-      insetLabel,
-      suffix,
-      placeholder,
-      style,
-      className,
-      showClear,
-      disabled,
-      triggerRender,
-      validateStatus,
-      autoFocus,
-      value
-    } = this.props;
-    const {
-      inputValue,
-      keyboardEventSet,
-      selection
-    } = this.state;
-    const useCustomTrigger = typeof triggerRender === 'function';
-    const outerProps = (0, _assign.default)({
-      style,
-      className: useCustomTrigger ? (0, _classnames.default)(className) : (0, _classnames.default)({
-        [prefixCls]: true,
-        ["".concat(prefixCls, "-disabled")]: disabled
-      }, className),
-      onClick: this.handleInputClick,
-      ref: this.triggerRef
-    }, keyboardEventSet);
-    const innerProps = {
-      disabled,
-      placeholder,
-      autofocus: autoFocus,
-      onChange: this.onSearch,
-      onClear: this.onInputClear,
-      // TODO: remove in next major version
-      suffix,
-      prefix: prefix || insetLabel,
-      showClear,
-      validateStatus,
-      size,
-      onBlur: this.onBlur,
-      onFocus: this.onFocus
-    };
-    return /*#__PURE__*/_react.default.createElement("div", (0, _assign.default)({}, outerProps), typeof triggerRender === 'function' ? /*#__PURE__*/_react.default.createElement(_trigger.default, (0, _assign.default)({}, innerProps, {
-      inputValue: typeof value !== 'undefined' ? value : inputValue,
-      value: (0, _from.default)((0, _values.default)(selection).call(selection)),
-      triggerRender: triggerRender,
-      componentName: "AutoComplete",
-      componentProps: (0, _assign.default)({}, this.props)
-    })) : /*#__PURE__*/_react.default.createElement(_input.default, (0, _assign.default)({}, innerProps, {
-      value: typeof value !== 'undefined' ? value : inputValue
-    })));
-  }
-
-  renderLoading() {
-    const loadingWrapperCls = "".concat(prefixCls, "-loading-wrapper");
-    return /*#__PURE__*/_react.default.createElement("div", {
-      className: loadingWrapperCls
-    }, /*#__PURE__*/_react.default.createElement(_spin.default, null));
-  }
-
-  renderOption(option, optionIndex) {
-    const {
-      focusIndex
-    } = this.state;
-    const isFocused = optionIndex === focusIndex;
-    return /*#__PURE__*/_react.default.createElement(_option.default, (0, _assign.default)({
-      showTick: false,
-      onSelect: (v, e) => this.onSelect(v, optionIndex, e),
-      // selected={selection.has(option.label)}
-      focused: isFocused,
-      onMouseEnter: () => this.foundation.handleOptionMouseEnter(optionIndex),
-      key: option.key || option.label + option.value + optionIndex
-    }, option), option.label);
-  }
-
-  renderOptionList() {
-    const {
-      maxHeight,
-      dropdownStyle,
-      dropdownClassName,
-      loading,
-      emptyContent
-    } = this.props;
-    const {
-      options,
-      dropdownMinWidth
-    } = this.state;
-    const listCls = (0, _classnames.default)({
-      ["".concat(prefixCls, "-option-list")]: true
-    }, dropdownClassName);
-    let optionsNode;
-
-    if (options.length === 0) {
-      optionsNode = emptyContent;
-    } else {
-      var _context;
-
-      optionsNode = (0, _map2.default)(_context = (0, _filter.default)(options).call(options, option => option.show)).call(_context, (option, i) => this.renderOption(option, i));
-    }
-
-    const style = (0, _assign.default)({
-      maxHeight: maxHeight,
-      minWidth: dropdownMinWidth
-    }, dropdownStyle);
-    return /*#__PURE__*/_react.default.createElement("div", {
-      className: listCls,
-      role: "listbox",
-      style: style
-    }, !loading ? optionsNode : this.renderLoading());
-  }
-
-  render() {
-    const {
-      position,
-      motion,
-      zIndex,
-      mouseEnterDelay,
-      mouseLeaveDelay,
-      autoAdjustOverflow,
-      stopPropagation,
-      getPopupContainer
-    } = this.props;
-    const {
-      visible,
-      rePosKey
-    } = this.state;
-    const input = this.renderInput();
-    const optionList = this.renderOptionList();
-    return /*#__PURE__*/_react.default.createElement(_popover.default, {
-      mouseEnterDelay: mouseEnterDelay,
-      mouseLeaveDelay: mouseLeaveDelay,
-      autoAdjustOverflow: autoAdjustOverflow,
-      trigger: "custom",
-      motion: motion,
-      visible: visible,
-      content: optionList,
-      position: position,
-      ref: this.optionsRef,
-      // TransformFromCenter TODO: need to confirm
-      zIndex: zIndex,
-      stopPropagation: stopPropagation,
-      getPopupContainer: getPopupContainer,
-      rePosKey: rePosKey
-    }, input);
-  }
-
-}
-
-AutoComplete.propTypes = {
-  autoFocus: _propTypes.default.bool,
-  autoAdjustOverflow: _propTypes.default.bool,
-  className: _propTypes.default.string,
-  children: _propTypes.default.node,
-  data: _propTypes.default.array,
-  defaultOpen: _propTypes.default.bool,
-  defaultValue: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number]),
-  defaultActiveFirstOption: _propTypes.default.bool,
-  disabled: _propTypes.default.bool,
-  dropdownMatchSelectWidth: _propTypes.default.bool,
-  dropdownClassName: _propTypes.default.string,
-  dropdownStyle: _propTypes.default.object,
-  emptyContent: _propTypes.default.node,
-  onSearch: _propTypes.default.func,
-  onSelect: _propTypes.default.func,
-  onClear: _propTypes.default.func,
-  onBlur: _propTypes.default.func,
-  onFocus: _propTypes.default.func,
-  onChange: _propTypes.default.func,
-  position: _propTypes.default.oneOf(positionSet),
-  placeholder: _propTypes.default.string,
-  prefix: _propTypes.default.node,
-  onChangeWithObject: _propTypes.default.bool,
-  onSelectWithObject: _propTypes.default.bool,
-  renderItem: _propTypes.default.func,
-  renderSelectedItem: _propTypes.default.func,
-  suffix: _propTypes.default.node,
-  showClear: _propTypes.default.bool,
-  size: _propTypes.default.oneOf(sizeSet),
-  style: _propTypes.default.object,
-  stopPropagation: _propTypes.default.oneOfType([_propTypes.default.bool, _propTypes.default.string]),
-  maxHeight: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number]),
-  mouseEnterDelay: _propTypes.default.number,
-  mouseLeaveDelay: _propTypes.default.number,
-  motion: _propTypes.default.oneOfType([_propTypes.default.bool, _propTypes.default.func, _propTypes.default.object]),
-  getPopupContainer: _propTypes.default.func,
-  triggerRender: _propTypes.default.func,
-  value: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number]),
-  validateStatus: _propTypes.default.oneOf(statusSet),
-  zIndex: _propTypes.default.number
-};
-AutoComplete.Option = _option.default;
-AutoComplete.defaultProps = {
-  stopPropagation: true,
-  motion: true,
-  zIndex: _constants2.numbers.DEFAULT_Z_INDEX,
-  position: 'bottomLeft',
-  data: [],
-  showClear: false,
-  disabled: false,
-  size: 'default',
-  onFocus: _lodashEs.noop,
-  onSearch: _lodashEs.noop,
-  onClear: _lodashEs.noop,
-  onBlur: _lodashEs.noop,
-  onSelect: _lodashEs.noop,
-  onChange: _lodashEs.noop,
-  onSelectWithObject: false,
-  onDropdownVisibleChange: _lodashEs.noop,
-  defaultActiveFirstOption: true,
-  dropdownMatchSelectWidth: true,
-  loading: false,
-  maxHeight: 300,
-  validateStatus: 'default',
-  autoFocus: false,
-  emptyContent: null // onPressEnter: () => undefined,
-  // defaultOpen: false,
-
-};
-var _default = AutoComplete;
-exports.default = _default;

package/lib/cjs/avatar/avatarGroup.d.ts

@@ -1,22 +0,0 @@
-import React, { PureComponent } from 'react';
-import PropTypes from 'prop-types';
-import { AvatarGroupProps } from './interface';
-export default class AvatarGroup extends PureComponent<AvatarGroupProps> {
-    static defaultProps: {
-        size: string;
-        shape: string;
-        overlapFrom: string;
-    };
-    static propTypes: {
-        children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-        shape: PropTypes.Requireable<string>;
-        size: PropTypes.Requireable<string>;
-        maxCount: PropTypes.Requireable<number>;
-        renderMore: PropTypes.Requireable<(...args: any[]) => any>;
-        overlapFrom: PropTypes.Requireable<string>;
-    };
-    getAllAvatars(): React.ReactNodeArray;
-    getMergeAvatars(avatars: React.ReactNode[]): React.ReactNode[];
-    renderMoreAvatar(restNumber: number, restAvatars: React.ReactNode[]): JSX.Element;
-    render(): JSX.Element;
-}