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

package/lib/cjs/notification/notificationFoundation.d.ts

@@ -0,0 +1,47 @@
+import BaseFoundation, { DefaultAdapter } from '../base/foundation';
+import { strings } from '../notification/constants';
+export declare type NoticePosition = 'top' | 'bottom' | 'topLeft' | 'topRight' | 'bottomLeft' | 'bottomRight';
+export declare type NoticeType = 'warning' | 'success' | 'info' | 'error' | 'default';
+export declare type NoticeTheme = 'light' | 'normal';
+export interface NoticeProps {
+    duration?: number;
+    id?: string | number;
+    title?: any;
+    content?: any;
+    position?: NoticePosition;
+    type?: NoticeType;
+    onClick?: (e: any) => void;
+    onClose?: () => void;
+    onCloseClick?: (id: string | number) => void;
+    showClose?: boolean;
+    close?: (id: string | number) => void;
+    zIndex?: number;
+    icon?: any;
+    getPopupContainer?: () => HTMLElement;
+    theme?: NoticeTheme;
+    onHookClose?: () => void;
+    direction?: typeof strings.directions[number];
+    className?: string;
+    style?: any;
+}
+export interface NoticeState {
+    visible: boolean;
+}
+export interface NoticeInstance extends NoticeProps {
+    motion?: boolean;
+}
+export interface NoticeAdapter extends DefaultAdapter<NoticeProps, NoticeState> {
+    notifyWrapperToRemove: (id: string) => void;
+    notifyClose: () => void;
+}
+export default class NotificationFoundation extends BaseFoundation<NoticeAdapter> {
+    _timer: ReturnType<typeof setTimeout> | null;
+    _id: string | null;
+    constructor(adapter: NoticeAdapter);
+    init(): void;
+    destroy(): void;
+    _startCloseTimer(): void;
+    close(e?: any): void;
+    _clearCloseTimer(): void;
+    restartCloseTimer(): void;
+}

package/lib/cjs/notification/notificationFoundation.js

@@ -0,0 +1,67 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _isNumber2 = _interopRequireDefault(require("lodash/isNumber"));
+
+var _foundation = _interopRequireDefault(require("../base/foundation"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+class NotificationFoundation extends _foundation.default {
+  constructor(adapter) {
+    super(Object.assign(Object.assign({}, NotificationFoundation.defaultAdapter), adapter));
+    this._timer = null;
+    this._id = null; // cache id
+  }
+
+  init() {
+    this._startCloseTimer();
+
+    this._id = this.getProp('id');
+  }
+
+  destroy() {
+    this._clearCloseTimer();
+  }
+
+  _startCloseTimer() {
+    // unit: s
+    const duration = this.getProp('duration');
+
+    if (duration && (0, _isNumber2.default)(duration)) {
+      this._timer = setTimeout(() => {
+        this.close(); // call parent to remove itself
+      }, duration * 1000);
+    }
+  }
+
+  close(e) {
+    if (e) {
+      e.stopPropagation();
+    }
+
+    this._adapter.notifyWrapperToRemove(this._id);
+
+    this._adapter.notifyClose();
+  }
+
+  _clearCloseTimer() {
+    if (this._timer) {
+      clearTimeout(this._timer);
+      this._timer = null;
+    }
+  }
+
+  restartCloseTimer() {
+    this._clearCloseTimer();
+
+    this._startCloseTimer();
+  }
+
+}
+
+exports.default = NotificationFoundation;

package/lib/cjs/notification/notificationListFoundation.d.ts

@@ -0,0 +1,28 @@
+import BaseFoundation, { DefaultAdapter } from '../base/foundation';
+import { NoticeInstance, NoticePosition, NoticeProps } from '../notification/notificationFoundation';
+import { strings } from './constants';
+export interface NotificationListProps {
+}
+export interface NotificationListState {
+    notices: NoticeInstance[];
+    removedItems: NoticeInstance[];
+}
+export interface NotificationListAdapter extends DefaultAdapter<NotificationListProps, NotificationListState> {
+    updateNotices: (notices: NoticeInstance[], removedItems?: NoticeInstance[]) => void;
+    getNotices: () => NoticeInstance[];
+}
+export interface ConfigProps {
+    top?: number | string;
+    bottom?: number | string;
+    left?: number | string;
+    right?: number | string;
+    duration?: number;
+    position?: NoticePosition;
+    zIndex?: number;
+    direction?: typeof strings.directions[number];
+}
+export default class NotificationListFoundation extends BaseFoundation<NotificationListAdapter> {
+    addNotice(opts: NoticeProps): void;
+    removeNotice(id: string): void;
+    destroyAll(): void;
+}

package/lib/cjs/notification/notificationListFoundation.js

@@ -0,0 +1,56 @@
+"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 }; }
+
+/* eslint-disable no-useless-constructor */
+class NotificationListFoundation extends _foundation.default {
+  addNotice(opts) {
+    // let notices = this._adapter.getNotices();
+    const notices = this._adapter.getNotices(); // opts = { ...opts, id };
+    // if (opts.duration) {
+    //     setTimeout(() => {
+    //         this.removeNotice(opts.id);
+    //     }, opts.duration * 1000);
+    // }
+
+
+    this._adapter.updateNotices([opts, ...notices]); // return id;
+
+  }
+
+  removeNotice(id) {
+    let notices = this._adapter.getNotices(); // let notices = this._adapter.getNotices();
+
+
+    const removedItems = [];
+    notices = notices.filter(notice => {
+      if (notice.id === id) {
+        removedItems.push(notice);
+        return false;
+      }
+
+      return true;
+    });
+
+    this._adapter.updateNotices(notices, removedItems); // This must be updated at the same time https://github.com/facebook/react/issues/12312
+
+  }
+
+  destroyAll() {
+    const notices = this._adapter.getNotices();
+
+    if (notices.length > 0) {
+      this._adapter.updateNotices([], notices);
+    }
+  }
+
+}
+
+exports.default = NotificationListFoundation;

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

@@ -0,0 +1,25 @@
+declare const cssClasses: {
+    PREFIX: string;
+};
+declare const strings: {
+    BOUNDARY_SET: ("end" | "start")[];
+    POSITION_SET: string[];
+    MODE_SET: string[];
+    MODE_MAP: {
+        COLLAPSE: string;
+        SCROLL: string;
+    };
+    BOUNDARY_MAP: {
+        readonly START: "start";
+        readonly END: "end";
+    };
+    OVERFLOW_DIR: {
+        NONE: number;
+        GROW: number;
+        SHRINK: number;
+    };
+};
+declare const numbers: {
+    MINIMUM_HTML_ELEMENT_WIDTH: number;
+};
+export { cssClasses, strings, numbers };

package/lib/cjs/overflowList/constants.js

@@ -0,0 +1,39 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.strings = exports.numbers = exports.cssClasses = void 0;
+
+var _constants = require("../base/constants");
+
+const cssClasses = {
+  PREFIX: _constants.BASE_CLASS_PREFIX + '-overflow-list'
+};
+exports.cssClasses = cssClasses;
+const MODE_MAP = {
+  COLLAPSE: 'collapse',
+  SCROLL: 'scroll'
+};
+const BOUNDARY_MAP = {
+  START: 'start',
+  END: 'end'
+};
+const OVERFLOW_DIR = {
+  NONE: 0,
+  GROW: 1,
+  SHRINK: 2
+};
+const strings = {
+  BOUNDARY_SET: Object.values(BOUNDARY_MAP),
+  POSITION_SET: ['vertical', 'horizontal'],
+  MODE_SET: Object.values(MODE_MAP),
+  MODE_MAP,
+  BOUNDARY_MAP,
+  OVERFLOW_DIR
+};
+exports.strings = strings;
+const numbers = {
+  MINIMUM_HTML_ELEMENT_WIDTH: 4
+};
+exports.numbers = numbers;

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

@@ -0,0 +1,17 @@
+import BaseFoundation, { DefaultAdapter } from '../base/foundation';
+export interface OverflowListAdapter extends DefaultAdapter {
+    updateStates: (state: any) => void;
+    updateVisibleState: (visible: Map<string, boolean>) => void;
+    notifyIntersect: (res: any) => void;
+    getItemSizeMap: () => Map<string, number>;
+}
+declare class OverflowListFoundation extends BaseFoundation<OverflowListAdapter> {
+    constructor(adapter: OverflowListAdapter);
+    previousY: any;
+    isScrollMode: () => boolean;
+    getOverflowItem(): Array<Array<Record<string, any>>>;
+    handleIntersect(entries: Array<IntersectionObserverEntry>): void;
+    getReversedItems: () => any;
+    handleCollapseOverflow(): void;
+}
+export default OverflowListFoundation;

package/lib/cjs/overflowList/foundation.js

@@ -0,0 +1,172 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _cloneDeep2 = _interopRequireDefault(require("lodash/cloneDeep"));
+
+var _get2 = _interopRequireDefault(require("lodash/get"));
+
+var _foundation = _interopRequireDefault(require("../base/foundation"));
+
+var _constants = require("./constants");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+const Boundary = _constants.strings.BOUNDARY_MAP;
+const OverflowDirection = _constants.strings.OVERFLOW_DIR;
+
+class OverflowListFoundation extends _foundation.default {
+  constructor(adapter) {
+    super(Object.assign({}, adapter));
+    this.previousY = undefined;
+
+    this.isScrollMode = () => {
+      const {
+        renderMode
+      } = this.getProps();
+      return renderMode === 'scroll';
+    };
+
+    this.getReversedItems = () => {
+      const {
+        items
+      } = this.getProps();
+      return (0, _cloneDeep2.default)(items).reverse();
+    };
+  }
+
+  getOverflowItem() {
+    const {
+      items
+    } = this.getProps();
+    const {
+      visibleState,
+      overflow
+    } = this.getStates();
+
+    if (!this.isScrollMode()) {
+      return overflow;
+    }
+
+    const visibleStateArr = items.map(_ref => {
+      let {
+        key
+      } = _ref;
+      return Boolean(visibleState.get(key));
+    });
+    const visibleStart = visibleStateArr.indexOf(true);
+    const visibleEnd = visibleStateArr.lastIndexOf(true);
+    const overflowList = [];
+    overflowList[0] = visibleStart >= 0 ? items.slice(0, visibleStart) : [];
+    overflowList[1] = visibleEnd >= 0 ? items.slice(visibleEnd + 1, items.length) : items;
+    return overflowList;
+  }
+
+  handleIntersect(entries) {
+    const visibleState = (0, _cloneDeep2.default)(this.getState('visibleState'));
+    const res = {};
+    entries.forEach(entry => {
+      const itemKey = (0, _get2.default)(entry, 'target.dataset.scrollkey');
+      const visible = entry.isIntersecting;
+      res[itemKey] = entry;
+      visibleState.set(itemKey, visible);
+    });
+    let someItemVisible = false;
+
+    for (const value of visibleState.values()) {
+      if (value) {
+        someItemVisible = true;
+        break;
+      }
+    } // Any item is visible, indicating that the List is visible
+
+
+    const wholeListVisible = someItemVisible; // If scrolling in the vertical direction makes the List invisible, no processing is required. 
+    // If this.previousY is undefined, it means that the List is mounted for the first time and will not be processed.
+
+    const [entry1] = entries;
+    const currentY = entry1.boundingClientRect.y;
+
+    if (!wholeListVisible && this.previousY !== undefined && currentY !== this.previousY) {
+      this.previousY = currentY;
+      return;
+    }
+
+    this.previousY = currentY;
+
+    this._adapter.updateVisibleState(visibleState);
+
+    this._adapter.notifyIntersect(res);
+  }
+
+  handleCollapseOverflow() {
+    const {
+      minVisibleItems,
+      collapseFrom
+    } = this.getProps();
+    const {
+      overflowWidth,
+      containerWidth,
+      pivot: statePivot,
+      overflowStatus
+    } = this.getStates();
+    const {
+      items,
+      onOverflow
+    } = this.getProps();
+    let itemWidths = overflowWidth,
+        _pivot = 0;
+    let overflowed = false;
+
+    for (const size of this._adapter.getItemSizeMap().values()) {
+      itemWidths += size; // 触发overflow
+
+      if (itemWidths > containerWidth) {
+        overflowed = true;
+        break;
+      } // 顺利遍历完整个列表，说明不存在overflow，直接渲染全部
+
+
+      if (_pivot === items.length - 1) {
+        this._adapter.updateStates({
+          overflowStatus: "normal",
+          pivot: items.length - 1,
+          visible: items,
+          overflow: []
+        });
+
+        break;
+      }
+
+      _pivot++;
+    }
+
+    if (overflowed) {
+      const pivot = Math.max(minVisibleItems, _pivot);
+      const isCollapseFromStart = collapseFrom === Boundary.START;
+      const visible = isCollapseFromStart ? this.getReversedItems().slice(0, pivot).reverse() : items.slice(0, pivot);
+      const overflow = isCollapseFromStart ? this.getReversedItems().slice(pivot).reverse() : items.slice(pivot);
+
+      this._adapter.updateStates({
+        overflowStatus: "overflowed",
+        pivot: pivot,
+        visible,
+        overflow
+      }); // trigger onOverflow
+
+
+      if (statePivot !== pivot) {
+        onOverflow(overflow);
+      }
+
+      return;
+    }
+  }
+
+}
+
+var _default = OverflowListFoundation;
+exports.default = _default;

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

@@ -0,0 +1,12 @@
+declare const cssClasses: {
+    readonly PREFIX: "semi-page";
+};
+declare const strings: {};
+declare const numbers: {
+    readonly PAGE_SHOW_MAX: 7;
+    readonly REST_PAGE_SHOW_MAX: 5;
+    readonly DEFAULT_PAGE_SIZE: 10;
+    readonly PAGE_SIZE_OPTION: readonly [10, 20, 40, 100];
+    readonly REST_PAGE_MAX_SIZE: 1000000;
+};
+export { cssClasses, strings, numbers };

package/lib/cjs/pagination/constants.js

@@ -0,0 +1,23 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.strings = exports.numbers = exports.cssClasses = void 0;
+
+var _constants = require("../base/constants");
+
+const cssClasses = {
+  PREFIX: `${_constants.BASE_CLASS_PREFIX}-page`
+};
+exports.cssClasses = cssClasses;
+const strings = {};
+exports.strings = strings;
+const numbers = {
+  PAGE_SHOW_MAX: 7,
+  REST_PAGE_SHOW_MAX: 5,
+  DEFAULT_PAGE_SIZE: 10,
+  PAGE_SIZE_OPTION: [10, 20, 40, 100],
+  REST_PAGE_MAX_SIZE: 1000000
+};
+exports.numbers = numbers;

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

@@ -0,0 +1,52 @@
+import BaseFoundation, { DefaultAdapter } from '../base/foundation';
+export interface PaginationAdapter<P = Record<string, any>, S = Record<string, any>> extends DefaultAdapter<P, S> {
+    setPageList: (pageListState: AdapterPageList) => void;
+    setDisabled: (prevIsDisabled: boolean, nextIsDisabled: boolean) => void;
+    updateTotal: (total: number) => void;
+    updatePageSize: (pageSize: number) => void;
+    updateQuickJumpPage: (quickJumpPage: string | number) => void;
+    setCurrentPage: (pageIndex: number) => void;
+    registerKeyDownHandler: (handler: KeyDownHandler) => void;
+    unregisterKeyDownHandler: (handler: KeyDownHandler) => void;
+    notifyPageChange: (pageIndex: number) => void;
+    notifyPageSizeChange: (pageSize: number) => void;
+    notifyChange: (pageIndex: number, pageSize: number) => void;
+}
+export declare type PageRenderText = number | '...';
+export declare type PageList = PageRenderText[];
+export interface AdapterPageList {
+    pageList: PageRenderText[];
+    restLeftPageList: number[];
+    restRightPageList: number[];
+}
+export declare type KeyDownHandler = any;
+declare class PaginationFoundation<P = Record<string, any>, S = Record<string, any>> extends BaseFoundation<PaginationAdapter<P, S>, P, S> {
+    constructor(adapter: PaginationAdapter<P, S>);
+    init(): void;
+    destroy(): void;
+    _registerEventHandler(): void;
+    _unregisterEventHandler(): void;
+    _updateDisabled(pageInfo: {
+        currentPage: number;
+        total: number;
+        pageSize: number;
+    }): void;
+    goPage(targetPageIndex: number | '...'): void;
+    updatePage(targetPageIndex?: number, total?: number, pageSize?: number): void;
+    goPrev(): void;
+    goNext(): void;
+    _updatePageList(pageListInfo: {
+        currentPage: number;
+        total: number;
+        pageSize: number;
+    }): void;
+    changePageSize(newPageSize: number): void;
+    handleKeyDown(): void;
+    pageSizeInOpts(): any[];
+    handleQuickJumpNumberChange(targetPage: string | number): void;
+    _handleQuickJump(quickJumpPage: string | number): void;
+    handleQuickJumpBlur(): void;
+    handleQuickJumpEnterPress(targetPage: any): void;
+    _getTotalPageNumber(total: number, pageSize: number): number;
+}
+export default PaginationFoundation;