@douyinfe/semi-foundation 2.27.1 → 2.28.0-beta.0

package/lib/cjs/autoComplete/foundation.js

@@ -1,518 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-
-var _isObject2 = _interopRequireDefault(require("lodash/isObject"));
-
-var _isUndefined2 = _interopRequireDefault(require("lodash/isUndefined"));
-
-var _isNumber2 = _interopRequireDefault(require("lodash/isNumber"));
-
-var _isString2 = _interopRequireDefault(require("lodash/isString"));
-
-var _foundation = _interopRequireDefault(require("../base/foundation"));
-
-var _warning = _interopRequireDefault(require("../utils/warning"));
-
-var _keyCode = _interopRequireDefault(require("../utils/keyCode"));
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-/* eslint-disable prefer-const, max-len */
-class AutoCompleteFoundation extends _foundation.default {
-  constructor(adapter) {
-    super(Object.assign({}, adapter));
-    this.isPanelOpen = false;
-  }
-
-  init() {
-    this._setDropdownWidth();
-
-    const {
-      defaultOpen,
-      data,
-      defaultValue,
-      value
-    } = this.getProps();
-
-    if (data && data.length) {
-      const initOptions = this._generateList(data);
-
-      this._adapter.updateOptionList(initOptions);
-    }
-
-    if (defaultOpen) {
-      this.openDropdown();
-    } // When both defaultValue and value exist, finally the value of value will be taken as initValue
-
-
-    let initValue;
-
-    if (typeof defaultValue !== 'undefined') {
-      initValue = defaultValue;
-    }
-
-    if (typeof value !== 'undefined') {
-      initValue = value;
-    }
-
-    if (typeof initValue !== 'undefined') {
-      this.handleValueChange(initValue);
-    }
-  }
-
-  destroy() {// this._adapter.unregisterClickOutsideHandler();
-    // this.unBindKeyBoardEvent();
-  }
-
-  _setDropdownWidth() {
-    const {
-      style,
-      dropdownMatchSelectWidth
-    } = this.getProps();
-    let width;
-
-    if (dropdownMatchSelectWidth) {
-      if (style && (0, _isNumber2.default)(style.width)) {
-        width = style.width;
-      } else if (style && (0, _isString2.default)(style.width) && !style.width.includes('%')) {
-        width = style.width;
-      } else {
-        width = this._adapter.getTriggerWidth();
-      }
-
-      this._adapter.setOptionWrapperWidth(width);
-    }
-  }
-
-  handleInputClick(e) {
-    const {
-      options
-    } = this.getStates();
-    const {
-      disabled
-    } = this.getProps();
-
-    if (!disabled) {
-      if (this.isPanelOpen) {
-        this.closeDropdown();
-      } else {
-        this.openDropdown();
-      }
-    }
-  }
-
-  openDropdown() {
-    this.isPanelOpen = true;
-
-    this._adapter.toggleListVisible(true);
-
-    this._setDropdownWidth(); // this._adapter.registerClickOutsideHandler(e => this.closeDropdown(e));
-
-
-    this._adapter.notifyDropdownVisibleChange(true);
-
-    this._modifyFocusIndexOnPanelOpen();
-  }
-
-  closeDropdown(e) {
-    this.isPanelOpen = false;
-
-    this._adapter.toggleListVisible(false); // this._adapter.unregisterClickOutsideHandler();
-
-
-    this._adapter.notifyDropdownVisibleChange(false); // After closing the panel, you can still open the panel by pressing the enter key
-    // this.unBindKeyBoardEvent();
-
-  } // props.data => optionList
-
-
-  _generateList(data) {
-    const {
-      renderItem
-    } = this.getProps();
-    const options = [];
-
-    if (data && data.length) {
-      data.forEach((item, i) => {
-        const key = String(new Date().getTime()) + i;
-        let option = {};
-
-        if ((0, _isString2.default)(item) || (0, _isNumber2.default)(item)) {
-          option = {
-            value: item,
-            key,
-            label: item,
-            show: true
-          };
-        } else if ((0, _isObject2.default)(item) && !(0, _isUndefined2.default)(item.value)) {
-          option = Object.assign({
-            show: true
-          }, item);
-        }
-
-        if (renderItem && typeof renderItem === 'function') {
-          option.label = renderItem(item);
-        }
-
-        options.push(option);
-      });
-    }
-
-    return options;
-  }
-
-  handleSearch(inputValue) {
-    this._adapter.updateInputValue(inputValue);
-
-    this._adapter.notifySearch(inputValue);
-
-    this._adapter.notifyChange(inputValue);
-
-    this._modifyFocusIndex(inputValue);
-
-    if (!this.isPanelOpen) {
-      this.openDropdown();
-    }
-  }
-
-  handleSelect(option, optionIndex) {
-    const {
-      renderSelectedItem
-    } = this.getProps();
-    let newInputValue = '';
-
-    if (renderSelectedItem && typeof renderSelectedItem === 'function') {
-      newInputValue = renderSelectedItem(option);
-      (0, _warning.default)(typeof newInputValue !== 'string', 'Warning: [Semi AutoComplete] renderSelectedItem must return string, please check your function return');
-    } else {
-      newInputValue = option.value;
-    } // 1. trigger onSelect
-    // 2. close Dropdown
-
-
-    if (this._isControlledComponent()) {
-      this.closeDropdown();
-      this.notifySelect(option);
-    } else {
-      // 1. update Input
-      // 2. update Selection
-      // 3. trigger onSelect
-      // 4. close Dropdown
-      this._adapter.updateInputValue(newInputValue);
-
-      this.updateSelection(option);
-      this.notifySelect(option);
-      this.closeDropdown();
-    }
-
-    this._adapter.notifyChange(newInputValue);
-
-    this._adapter.updateFocusIndex(optionIndex);
-  }
-
-  updateSelection(option) {
-    const selection = new Map();
-
-    if (option) {
-      selection.set(option.label, option);
-    }
-
-    this._adapter.updateSelection(selection);
-  }
-
-  notifySelect(option) {
-    if (this._backwardLabelInValue()) {
-      this._adapter.notifySelect(option);
-    } else {
-      this._adapter.notifySelect(option.value);
-    }
-  }
-
-  _backwardLabelInValue() {
-    const props = this.getProps();
-    let {
-      onSelectWithObject
-    } = props;
-    return onSelectWithObject;
-  }
-
-  handleDataChange(newData) {
-    const options = this._generateList(newData);
-
-    this._adapter.updateOptionList(options);
-
-    this._adapter.rePositionDropdown();
-  }
-
-  handleValueChange(propValue) {
-    let {
-      data,
-      defaultActiveFirstOption
-    } = this.getProps();
-    let selectedValue = '';
-
-    if (this._backwardLabelInValue() && Object.prototype.toString.call(propValue) === '[object Object]') {
-      selectedValue = propValue.value;
-    } else {
-      selectedValue = propValue;
-    }
-
-    let renderSelectedItem = this._getRenderSelectedItem();
-
-    const options = this._generateList(data); // Get the option whose value match from options
-
-
-    let selectedOption = options.filter(option => renderSelectedItem(option) === selectedValue);
-    const canMatchInData = selectedOption.length;
-    const selectedOptionIndex = options.findIndex(option => renderSelectedItem(option) === selectedValue);
-    let inputValue = '';
-
-    if (canMatchInData) {
-      selectedOption = selectedOption[0];
-      inputValue = renderSelectedItem(selectedOption);
-    } else {
-      const cbItem = this._backwardLabelInValue() ? propValue : {
-        label: selectedValue,
-        value: selectedValue
-      };
-      inputValue = renderSelectedItem(cbItem);
-    }
-
-    this._adapter.updateInputValue(inputValue);
-
-    this.updateSelection(canMatchInData ? selectedOption : null);
-
-    if (selectedOptionIndex === -1 && defaultActiveFirstOption) {
-      this._adapter.updateFocusIndex(0);
-    } else {
-      this._adapter.updateFocusIndex(selectedOptionIndex);
-    }
-  }
-
-  _modifyFocusIndex(searchValue) {
-    let {
-      focusIndex
-    } = this.getStates();
-    let {
-      data,
-      defaultActiveFirstOption
-    } = this.getProps();
-
-    let renderSelectedItem = this._getRenderSelectedItem();
-
-    const options = this._generateList(data);
-
-    const selectedOptionIndex = options.findIndex(option => renderSelectedItem(option) === searchValue);
-
-    if (selectedOptionIndex === -1 && defaultActiveFirstOption) {
-      if (focusIndex !== 0) {
-        this._adapter.updateFocusIndex(0);
-      }
-    } else {
-      if (selectedOptionIndex !== focusIndex) {
-        this._adapter.updateFocusIndex(selectedOptionIndex);
-      }
-    }
-  }
-
-  _modifyFocusIndexOnPanelOpen() {
-    let {
-      inputValue
-    } = this.getStates();
-
-    this._modifyFocusIndex(inputValue);
-  }
-
-  _getRenderSelectedItem() {
-    let {
-      renderSelectedItem
-    } = this.getProps();
-
-    if (typeof renderSelectedItem === 'undefined') {
-      renderSelectedItem = option => option.value;
-    } else if (renderSelectedItem && typeof renderSelectedItem === 'function') {// do nothing
-    }
-
-    return renderSelectedItem;
-  }
-
-  handleClear() {
-    this._adapter.notifyClear();
-  }
-
-  bindKeyBoardEvent() {
-    this._keydownHandler = event => {
-      this._handleKeyDown(event);
-    };
-
-    this._adapter.registerKeyDown(this._keydownHandler);
-  } // unBindKeyBoardEvent() {
-  //     if (this._keydownHandler) {
-  //         this._adapter.unregisterKeyDown(this._keydownHandler);
-  //     }
-  // }
-
-
-  _handleKeyDown(event) {
-    const key = event.keyCode;
-    const {
-      visible
-    } = this.getStates();
-
-    switch (key) {
-      case _keyCode.default.UP:
-        // Prevent Input's cursor from following the movement
-        event.preventDefault();
-
-        this._handleArrowKeyDown(-1);
-
-        break;
-
-      case _keyCode.default.DOWN:
-        // Prevent Input's cursor from following the movement
-        event.preventDefault();
-
-        this._handleArrowKeyDown(1);
-
-        break;
-
-      case _keyCode.default.ENTER:
-        // when custom trigger, prevent outer open panel again
-        event.preventDefault();
-
-        this._handleEnterKeyDown();
-
-        break;
-
-      case _keyCode.default.ESC:
-        this.closeDropdown();
-        break;
-
-      default:
-        break;
-    }
-
-    this._adapter.notifyKeyDown(event);
-  }
-
-  _getEnableFocusIndex(offset) {
-    const {
-      focusIndex,
-      options
-    } = this.getStates();
-    const visibleOptions = options.filter(item => item.show);
-    const optionsLength = visibleOptions.length;
-    let index = focusIndex + offset;
-
-    if (index < 0) {
-      index = optionsLength - 1;
-    }
-
-    if (index >= optionsLength) {
-      index = 0;
-    } // avoid newIndex option is disabled
-
-
-    if (offset > 0) {
-      let nearestActiveOption = -1;
-
-      for (let i = 0; i < visibleOptions.length; i++) {
-        const optionIsActive = !visibleOptions[i].disabled;
-
-        if (optionIsActive) {
-          nearestActiveOption = i;
-        }
-
-        if (nearestActiveOption >= index) {
-          break;
-        }
-      }
-
-      index = nearestActiveOption;
-    } else {
-      let nearestActiveOption = visibleOptions.length;
-
-      for (let i = optionsLength - 1; i >= 0; i--) {
-        const optionIsActive = !visibleOptions[i].disabled;
-
-        if (optionIsActive) {
-          nearestActiveOption = i;
-        }
-
-        if (nearestActiveOption <= index) {
-          break;
-        }
-      }
-
-      index = nearestActiveOption;
-    }
-
-    this._adapter.updateFocusIndex(index);
-  }
-
-  _handleArrowKeyDown(offset) {
-    const {
-      visible
-    } = this.getStates();
-
-    if (!visible) {
-      this.openDropdown();
-    } else {
-      this._getEnableFocusIndex(offset);
-    }
-  }
-
-  _handleEnterKeyDown() {
-    const {
-      visible,
-      options,
-      focusIndex
-    } = this.getStates();
-
-    if (!visible) {
-      this.openDropdown();
-    } else {
-      if (focusIndex !== undefined && focusIndex !== -1 && options.length !== 0) {
-        const visibleOptions = options.filter(item => item.show);
-        const selectedOption = visibleOptions[focusIndex];
-        this.handleSelect(selectedOption, focusIndex);
-      } else {
-        this.closeDropdown();
-      }
-    }
-  }
-
-  handleOptionMouseEnter(optionIndex) {
-    this._adapter.updateFocusIndex(optionIndex);
-  }
-
-  handleFocus(e) {
-    // If you get the focus through the tab key, you need to manually bind keyboard events
-    // Then you can open the panel by pressing the enter key
-    this.bindKeyBoardEvent();
-
-    this._adapter.notifyFocus(e);
-  }
-
-  handleBlur(e) {
-    // only need persist on react adapter
-    // https://reactjs.org/docs/legacy-event-pooling.html
-    this._persistEvent(e); // In order to handle the problem of losing onClick binding when clicking on the padding area, the onBlur event is triggered first to cause the react view to be updated
-    // internal-issues:1231
-
-
-    setTimeout(() => {
-      this._adapter.notifyBlur(e);
-
-      this.closeDropdown();
-    }, 100);
-  }
-
-}
-
-var _default = AutoCompleteFoundation;
-exports.default = _default;

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

@@ -1,21 +0,0 @@
-import BaseFoundation, { DefaultAdapter } from '../base/foundation';
-export interface BasicOptionProps {
-    [x: string]: any;
-    value?: string | number;
-    label?: string | number | unknown;
-    children?: unknown;
-    disabled?: boolean;
-    showTick?: boolean;
-    className?: string;
-    style?: Record<string, any>;
-}
-export interface OptionDefaultAdapter extends Partial<DefaultAdapter> {
-    notifyClick(option: BasicOptionProps): void;
-}
-export default class OptionFoundation extends BaseFoundation<OptionDefaultAdapter> {
-    constructor(adapter: OptionDefaultAdapter);
-    init(): void;
-    destroy(): void;
-    onOptionClick(option: BasicOptionProps): void;
-    _isDisabled(): any;
-}

package/lib/cjs/autoComplete/optionFoundation.js

@@ -1,37 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-
-var _foundation = _interopRequireDefault(require("../base/foundation"));
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-class OptionFoundation extends _foundation.default {
-  constructor(adapter) {
-    super(Object.assign({}, adapter));
-  } // eslint-disable-next-line @typescript-eslint/no-empty-function
-
-
-  init() {} // eslint-disable-next-line @typescript-eslint/no-empty-function
-
-
-  destroy() {}
-
-  onOptionClick(option) {
-    const isDisabled = this._isDisabled();
-
-    if (!isDisabled) {
-      this._adapter.notifyClick(option);
-    }
-  }
-
-  _isDisabled() {
-    return this.getProp('disabled');
-  }
-
-}
-
-exports.default = OptionFoundation;

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

@@ -1,10 +0,0 @@
-declare const cssClasses: {
-    PREFIX: string;
-};
-declare const strings: {
-    SHAPE: string[];
-    SIZE: string[];
-    COLOR: string[];
-    OVERLAP_FROM: string[];
-};
-export { cssClasses, strings };

package/lib/cjs/avatar/constants.js

@@ -1,21 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.strings = exports.cssClasses = void 0;
-
-var _constants = require("../base/constants");
-
-const cssClasses = {
-  PREFIX: "".concat(_constants.BASE_CLASS_PREFIX, "-avatar")
-};
-exports.cssClasses = cssClasses;
-const strings = {
-  SHAPE: ['circle', 'square'],
-  SIZE: ['extra-extra-small', 'extra-small', 'small', 'default', 'medium', 'large', 'extra-large'],
-  // eslint-disable-next-line max-len
-  COLOR: ['grey', 'red', 'pink', 'purple', 'violet', 'indigo', 'blue', 'light-blue', 'cyan', 'teal', 'green', 'light-green', 'lime', 'yellow', 'amber', 'orange', 'white'],
-  OVERLAP_FROM: ['start', 'end']
-};
-exports.strings = strings;

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

@@ -1,17 +0,0 @@
-import BaseFoundation, { DefaultAdapter } from '../base/foundation';
-export interface AvatarAdapter<P = Record<string, any>, S = Record<string, any>> extends DefaultAdapter<P, S> {
-    notifyImgState(isImgExist: boolean): void;
-    notifyLeave(event: any): void;
-    notifyEnter(event: any): void;
-    setFocusVisible: (focusVisible: boolean) => void;
-}
-export default class AvatarFoundation<P = Record<string, any>, S = Record<string, any>> extends BaseFoundation<AvatarAdapter<P, S>, P, S> {
-    constructor(adapter: AvatarAdapter<P, S>);
-    init(): void;
-    destroy(): void;
-    handleImgLoadError(): void;
-    handleEnter(e: any): void;
-    handleLeave(e: any): void;
-    handleFocusVisible: (event: any) => void;
-    handleBlur: () => void;
-}

package/lib/cjs/avatar/foundation.js

@@ -1,64 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-
-var _foundation = _interopRequireDefault(require("../base/foundation"));
-
-var _warning = _interopRequireDefault(require("../utils/warning"));
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-class AvatarFoundation extends _foundation.default {
-  constructor(adapter) {
-    super(Object.assign({}, adapter));
-
-    this.handleFocusVisible = event => {
-      const {
-        target
-      } = event;
-
-      try {
-        if (target.matches(':focus-visible')) {
-          this._adapter.setFocusVisible(true);
-        }
-      } catch (error) {
-        (0, _warning.default)(true, 'Warning: [Semi Avatar] The current browser does not support the focus-visible');
-      }
-    };
-
-    this.handleBlur = () => {
-      this._adapter.setFocusVisible(false);
-    };
-  }
-
-  init() {} // eslint-disable-line
-
-
-  destroy() {} // eslint-disable-line
-
-
-  handleImgLoadError() {
-    const {
-      onError
-    } = this.getProps();
-    const errorFlag = onError ? onError() : undefined;
-
-    if (errorFlag !== false) {
-      this._adapter.notifyImgState(false);
-    }
-  }
-
-  handleEnter(e) {
-    this._adapter.notifyEnter(e);
-  }
-
-  handleLeave(e) {
-    this._adapter.notifyLeave(e);
-  }
-
-}
-
-exports.default = AvatarFoundation;

package/lib/cjs/backtop/constants.d.ts

@@ -1,5 +0,0 @@
-declare const cssClasses: {
-    PREFIX: string;
-};
-declare const strings: {};
-export { cssClasses, strings };

package/lib/cjs/backtop/constants.js

@@ -1,15 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.strings = exports.cssClasses = void 0;
-
-var _constants = require("../base/constants");
-
-const cssClasses = {
-  PREFIX: "".concat(_constants.BASE_CLASS_PREFIX, "-backtop")
-};
-exports.cssClasses = cssClasses;
-const strings = {};
-exports.strings = strings;