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

package/lib/cjs/anchor/foundation.js

@@ -1,268 +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 _assign = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/assign"));
-
-var _set = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/set"));
-
-var _foundation = _interopRequireDefault(require("../base/foundation"));
-
-var _lodashEs = require("lodash-es");
-
-var _scrollIntoViewIfNeeded = _interopRequireDefault(require("scroll-into-view-if-needed"));
-
-var _constants = require("./constants");
-
-const prefixCls = _constants.cssClasses.PREFIX;
-
-class AnchorFoundation extends _foundation.default {
-  constructor(adapter) {
-    var _this;
-
-    super((0, _assign.default)((0, _assign.default)({}, AnchorFoundation.defaultAdapter), adapter));
-    _this = this;
-
-    // eslint-disable-next-line @typescript-eslint/no-empty-function
-    this.init = () => {}; // eslint-disable-next-line @typescript-eslint/no-empty-function
-
-
-    this.destroy = () => {};
-
-    this.addLink = link => {
-      this._adapter.addLink(link);
-    };
-
-    this.removeLink = link => {
-      this._adapter.removeLink(link);
-    };
-
-    this.setActiveLink = function (link, prevLink) {
-      let shouldNotify = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
-
-      const activeLink = _this._adapter.getState('activeLink');
-
-      const onChange = _this._adapter.getProp('onChange');
-
-      if (activeLink !== link) {
-        _this._adapter.setActiveLink(link, _this._setActiveSlide);
-
-        if (onChange && shouldNotify) {
-          _this._adapter.notifyChange(link, prevLink);
-        }
-      }
-    }; // Adjust rail height according to text link content height
-
-
-    this.setScrollHeight = () => {
-      const anchorWrapper = ".".concat(prefixCls, "-link-wrapper");
-
-      const anchorNode = this._adapter.getAnchorNode(anchorWrapper);
-
-      if (anchorNode) {
-        const scrollHeight = "".concat(anchorNode.scrollHeight, "px");
-
-        this._adapter.setScrollHeight(scrollHeight);
-      }
-    };
-
-    this.updateScrollHeight = (prevState, state) => {
-      const prevLinks = prevState.links.join('');
-      const links = state.links.join('');
-
-      if (prevLinks !== links) {
-        this.setScrollHeight();
-      }
-    };
-
-    this.setChildMap = () => {
-      const children = this._adapter.getProp('children');
-
-      const childMap = {};
-
-      if ((0, _lodashEs.isArray)(children)) {
-        for (const link of children) {
-          this._getLinkToMap(link, [], childMap);
-        }
-      } else {
-        this._getLinkToMap(children, [], childMap);
-      }
-
-      this._adapter.setChildMap(childMap);
-    };
-
-    this.updateChildMap = (prevState, state) => {
-      const prevLinks = prevState.links.join('');
-      const links = state.links.join('');
-
-      if (prevLinks !== links) {
-        this.setChildMap();
-      }
-    };
-
-    this.getLinksTop = () => this._adapter.getLinksBoundingTop();
-
-    this.handleScroll = () => {
-      const {
-        clickLink,
-        links,
-        activeLink: prevActiveLink
-      } = this.getStates(); // TODO check this._adapter -> this.
-      // ActiveLink Determined by the clicked link
-
-      if (clickLink) {
-        return;
-      }
-
-      const elTop = this.getLinksTop();
-      let lastNegative = -Infinity;
-      let lastNegativeIndex = -1;
-
-      for (let i = 0; i < elTop.length; i++) {
-        if (elTop[i] < 0 && elTop[i] > lastNegative) {
-          lastNegative = elTop[i];
-          lastNegativeIndex = i;
-        }
-      }
-
-      const activeLink = links[lastNegativeIndex];
-      this.setActiveLink(activeLink, prevActiveLink);
-    };
-
-    this.handleClick = function (e, link) {
-      let shouldNotify = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
-
-      const destNode = _this._adapter.getContentNode(link);
-
-      const prevLink = _this._adapter.getState('activeLink');
-
-      _this.setActiveLink(link, prevLink, shouldNotify);
-
-      if (destNode) {
-        try {
-          _this._adapter.setClickLinkWithCallBack(true, link, _this._scrollIntoView);
-        } catch (error) {}
-      }
-
-      shouldNotify && _this._adapter.notifyClick(e, link);
-    };
-
-    this.handleClickLink = () => {
-      this._adapter.setClickLink(false);
-    }; // Get the child nodes of each link
-
-
-    this._getLinkToMap = (link, parents, linkMap) => {
-      const node = link && link.props;
-
-      if (!node || !node.href) {
-        return;
-      }
-
-      if (!(node.href in linkMap)) {
-        linkMap[node.href] = new _set.default();
-      } // Every ancestor kept a map
-
-
-      for (const parent of parents) {
-        linkMap[parent].add(node.href);
-      }
-
-      if (node.children && node.children.length) {
-        parents.push(node.href); // Maintain child node map
-
-        for (const child of node.children) {
-          this._getLinkToMap(child, parents, linkMap);
-        }
-
-        parents.pop();
-      }
-    };
-
-    this._scrollIntoView = link => {
-      const {
-        scrollMotion,
-        targetOffset
-      } = this.getProps(); // TODO check this._adapter -> this.
-
-      const behavior = scrollMotion ? 'smooth' : 'auto';
-
-      const canSmoothScroll = this._adapter.canSmoothScroll();
-
-      if (link) {
-        const destNode = this._adapter.getContentNode(link);
-
-        const scrollOpts = {
-          /**
-           * Behavior defines scrolling behavior
-           *  - Optional'auto '|' smooth '| Function
-           *  - Function Custom scrolling behavior
-           *    - Enter parameters as actions, each action contains an element that should be scrolled
-           *    - Actions include scrolling containers to the outermost scrollable container (document.body), the scrollable capacity needs to meet
-           *      1. The parent of the scroll container (directly or indirectly)
-           *      2. There is a scroll axis (clientHeight < scrollHeight | | clientWidth < scrollWidth)
-           *      3.overflowX or overflowY has a value and is not visible or clip
-           *       For details, please see https://github.com/stipsan/compute-scroll-into-view
-           *
-           * behavior定义滚动行为
-           *  - 可选 'auto' | 'smooth' | Function
-           *  - Function 自定义滚动行为
-           *    - 入参为 actions，每个action包含一个应该滚动的元素
-           *    - actions包括滚动容器到最外层的可滚动容器（document.body），可滚动容需满足
-           *      1. 滚动容器的父级（直接或间接）
-           *      2. 有滚动轴（clientHeight < scrollHeight || clientWidth < scrollWidth）
-           *      3. overflowX 或 overflowY 有值且不为 visible 或 clip
-           *      详情请看https://github.com/stipsan/compute-scroll-into-view
-           */
-          behavior: actions => {
-            // We just need to scroll the innermost target container
-            const innermostAction = (0, _lodashEs.get)(actions, '0');
-            const el = (0, _lodashEs.get)(innermostAction, 'el');
-            const top = (0, _lodashEs.get)(innermostAction, 'top');
-
-            if (el) {
-              const offsetTop = top - targetOffset;
-
-              if (el.scroll && canSmoothScroll) {
-                el.scroll({
-                  top: offsetTop,
-                  behavior
-                });
-              } else {
-                el.scrollTop = offsetTop;
-              }
-            }
-          },
-          block: 'start'
-        };
-
-        if (destNode) {
-          (0, _scrollIntoViewIfNeeded.default)(destNode, scrollOpts);
-        }
-      }
-    };
-
-    this._setActiveSlide = () => {
-      const activeClass = ".".concat(_constants.cssClasses.PREFIX, "-link-title-active");
-
-      const linkNode = this._adapter.getAnchorNode(activeClass);
-
-      if (linkNode) {
-        const height = linkNode.offsetTop;
-
-        this._adapter.setSlideBarTop(height);
-      }
-    };
-  }
-
-}
-
-exports.default = AnchorFoundation;

package/lib/cjs/anchor/linkFoundation.d.ts

@@ -1,14 +0,0 @@
-import BaseFoundation, { DefaultAdapter } from '../base/foundation';
-import { AnchorAdapter } from './foundation';
-export interface LinkAdapter extends DefaultAdapter {
-    addLink: AnchorAdapter['addLink'];
-    removeLink: AnchorAdapter['removeLink'];
-}
-export default class LinkFoundation extends BaseFoundation<LinkAdapter> {
-    constructor(adapter: LinkAdapter);
-    init(): void;
-    destroy(): void;
-    handleAddLink(): void;
-    handleUpdateLink(href: string, prevHref: string): void;
-    handleRemoveLink(): void;
-}

package/lib/cjs/anchor/linkFoundation.js

@@ -1,50 +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 _assign = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/assign"));
-
-var _foundation = _interopRequireDefault(require("../base/foundation"));
-
-class LinkFoundation extends _foundation.default {
-  constructor(adapter) {
-    super((0, _assign.default)({}, adapter));
-  }
-
-  init() {// this.setInitValue();
-  } // eslint-disable-next-line @typescript-eslint/no-empty-function
-
-
-  destroy() {}
-
-  handleAddLink() {
-    const href = this._adapter.getProp('href');
-
-    this._adapter.addLink(href);
-  }
-
-  handleUpdateLink(href, prevHref) {
-    if (href !== prevHref) {
-      this._adapter.removeLink(prevHref);
-
-      this._adapter.addLink(href);
-    }
-  }
-
-  handleRemoveLink() {
-    const href = this._adapter.getProp('href');
-
-    this._adapter.removeLink(href);
-  }
-
-}
-
-exports.default = LinkFoundation;

package/lib/cjs/anchor/rtl.scss

@@ -1,18 +0,0 @@
-$module: #{$prefix}-anchor;
-
-.#{$prefix}-rtl,
-.#{$prefix}-portal-rtl {
-    .#{$module} {
-        direction: rtl;
-
-        &-slide {
-            right: $spacing-anchor_slide-left;
-            left: auto;
-        }
-
-        &-link {
-            padding-right: $spacing-anchor_link-paddingLeft;
-            padding-left: auto;
-        }
-    }
-}

package/lib/cjs/anchor/variables.scss

@@ -1,27 +0,0 @@
-// Color
-$color-anchor_slide_default-bg-default: var(--semi-color-border); // 滑轨背景颜色
-$color-anchor_slide_primary-bg-active: var(--semi-color-primary); // 选中颜色 - Primary
-$color-anchor_slide_tertiary-bg-active: var(--semi-color-tertiary); // 选中颜色 - Tietrary
-$color-anchor_slide_muted-bg-active: var(--semi-color-white); // 选中颜色 - Muted
-
-$color-anchor_title-text-default: var(--semi-color-text-2); // 文字颜色 - 未选中
-$color-anchor_title-text-hover: var(--semi-color-tertiary-hover); // 文字颜色 - 未选中悬浮态
-$color-anchor_title-text-active: var(--semi-color-text-0); // 文字颜色 - 选中
-$color-anchor_title-text-disabled: var(--semi-color-disabled-text); // 文字颜色 - 禁用
-
-// Spacing
-$spacing-anchor_slide-left: $spacing-none; // 滑轨左侧位置
-$spacing-anchor_slide-top: $spacing-none; // 滑轨顶部位置
-$spacing-anchor_slide_default-Y: $spacing-extra-tight; // 选项间距 - 默认
-$spacing-anchor_slide_small-Y: $spacing-extra-tight; // 选项间距 - 紧凑
-$spacing-anchor_link-paddingLeft: $spacing-tight; // 选项文字左边距
-$spacing-anchor_link_title-paddingTop: $spacing-extra-tight; // 选项文字顶部内边距
-$spacing-anchor_link_title-paddingBottom: $spacing-extra-tight; // 选项文字底部内边距
-
-// Size
-$width-anchor_slide_default: 2px; // 滑轨宽度
-$height-anchor_slide_default: 20px; // 选项高度 - 默认
-$height-anchor_slide_small: 16px; // 选项高度 - 小尺寸
-
-// Radius
-$radius-anchor_slide: 1px; // 滑轨圆角

package/lib/cjs/autoComplete/autoComplete.css

@@ -1,103 +0,0 @@
-/* shadow */
-/* sizing */
-/* spacing */
-.semi-select-option {
-  font-size: 14px;
-  line-height: 20px;
-  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif;
-  word-break: break-all;
-  padding-left: 12px;
-  padding-right: 12px;
-  padding-top: 8px;
-  padding-bottom: 8px;
-  color: var(--semi-color-text-0);
-  position: relative;
-  display: flex;
-  flex-wrap: nowrap;
-  align-items: center;
-  cursor: pointer;
-  box-sizing: border-box;
-}
-.semi-select-option-icon {
-  width: 12px;
-  color: transparent;
-  visibility: hidden;
-  margin-right: 8px;
-  display: flex;
-  justify-content: center;
-  align-content: center;
-}
-.semi-select-option-text {
-  display: flex;
-  flex-wrap: wrap;
-  white-space: pre;
-}
-.semi-select-option-keyword {
-  color: var(--semi-color-primary);
-  background-color: inherit;
-  font-weight: 600;
-}
-.semi-select-option:active {
-  background-color: var(--semi-color-fill-1);
-}
-.semi-select-option-empty {
-  cursor: not-allowed;
-  color: var(--semi-color-disabled-text);
-  justify-content: center;
-}
-.semi-select-option-empty:hover {
-  background-color: inherit;
-}
-.semi-select-option-empty:active {
-  background-color: inherit;
-}
-.semi-select-option-disabled {
-  color: var(--semi-color-disabled-text);
-  cursor: not-allowed;
-}
-.semi-select-option-disabled:hover {
-  background-color: var(--semi-color-fill-0);
-}
-.semi-select-option-selected {
-  font-weight: 600;
-}
-.semi-select-option-selected .semi-select-option-icon {
-  visibility: visible;
-  color: var(--semi-color-text-2);
-}
-.semi-select-option-focused {
-  background-color: var(--semi-color-fill-0);
-}
-.semi-select-option:first-of-type {
-  margin-top: 4px;
-}
-.semi-select-option:last-of-type {
-  margin-bottom: 4px;
-}
-
-.semi-select {
-  cursor: text;
-  display: inline-flex;
-  vertical-align: middle;
-  box-sizing: border-box;
-}
-.semi-select-option-list {
-  overflow-x: hidden;
-  overflow-y: auto;
-}
-.semi-select-option-list-chosen .semi-select-option-icon {
-  display: flex;
-}
-.semi-select-loading-wrapper {
-  padding-top: 8px;
-  padding-bottom: 8px;
-  cursor: not-allowed;
-}
-.semi-select-loading-wrapper .semi-spin {
-  width: 100%;
-}
-
-.semi-rtl .semi-autocomplete,
-.semi-portal-rtl .semi-autocomplete {
-  direction: rtl;
-}

package/lib/cjs/autoComplete/autoComplete.scss

@@ -1,37 +0,0 @@
-$module: #{$prefix}-autocomplete;
-
-@import "./variables.scss";
-@import "../select/option.scss";
-.#{$module} {
-    cursor: text;
-    display: inline-flex;
-    vertical-align: middle;
-    box-sizing: border-box;
-
-    &-option-list {
-        overflow-x: hidden;
-        overflow-y: auto;
-
-        &-chosen {
-            .#{$module}-option-icon {
-                display: flex;
-            }
-        }
-    }
-
-    &-loading-wrapper {
-        // padding-left: $spacing-base;
-        // padding-right: $spacing-base;
-        padding-top: $spacing-autoComplete_loading_wrapper-paddingTop;
-        padding-bottom: $spacing-autoComplete_loading_wrapper-paddingBottom;
-        cursor: not-allowed;
-        // height: $spacing-extra-loose;
-        // @include all-center;
-        .#{$prefix}-spin {
-            width: 100%;
-        }
-    }
-
-}
-
-@import './rtl.scss';

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

@@ -1,10 +0,0 @@
-declare const cssClasses: {
-    PREFIX: string;
-};
-declare const strings: {
-    readonly SIZE: readonly ["small", "large", "default"];
-    readonly POSITION: readonly ["top", "topLeft", "topRight", "left", "leftTop", "leftBottom", "right", "rightTop", "rightBottom", "bottom", "bottomLeft", "bottomRight", "leftTopOver", "rightTopOver"];
-    readonly OPTIONS: readonly ["children", "value"];
-    readonly STATUS: readonly ["default", "error", "warning", "success"];
-};
-export { cssClasses, strings };

package/lib/cjs/autoComplete/constants.js

@@ -1,25 +0,0 @@
-"use strict";
-
-var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
-
-_Object$defineProperty(exports, "__esModule", {
-  value: true
-});
-
-exports.strings = exports.cssClasses = void 0;
-
-var _constants = require("../tooltip/constants");
-
-var _constants2 = require("../base/constants");
-
-const cssClasses = {
-  PREFIX: "".concat(_constants2.BASE_CLASS_PREFIX, "-autocomplete")
-};
-exports.cssClasses = cssClasses;
-const strings = {
-  SIZE: ['small', 'large', 'default'],
-  POSITION: _constants.strings.POSITION_SET,
-  OPTIONS: ['children', 'value'],
-  STATUS: _constants2.VALIDATE_STATUS
-};
-exports.strings = strings;

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

@@ -1,62 +0,0 @@
-import BaseFoundation, { DefaultAdapter } from '../base/foundation';
-interface KeyboardAdapter<P = Record<string, any>, S = Record<string, any>> extends DefaultAdapter<P, S> {
-    registerKeyDown: (callback: (event: any) => void) => void;
-    unregisterKeyDown: (callback: (event: any) => void) => void;
-    updateFocusIndex: (focusIndex: number) => void;
-}
-export interface DataItem {
-    [x: string]: any;
-    value?: string | number;
-    label?: any;
-}
-export interface StateOptionItem extends DataItem {
-    show?: boolean;
-    key?: string | number;
-}
-export declare type AutoCompleteData = Array<DataItem | string>;
-export interface AutoCompleteAdapter<P = Record<string, any>, S = Record<string, any>> extends KeyboardAdapter<P, S> {
-    getTriggerWidth: () => number | undefined;
-    setOptionWrapperWidth: (width: number) => void;
-    updateInputValue: (inputValue: string | number) => void;
-    toggleListVisible: (isShow: boolean) => void;
-    updateOptionList: (optionList: Array<StateOptionItem>) => void;
-    updateSelection: (selection: Map<any, any>) => void;
-    notifySearch: (inputValue: string) => void;
-    notifyChange: (value: string | number) => void;
-    notifySelect: (option: StateOptionItem | string | number) => void;
-    notifyDropdownVisibleChange: (isVisible: boolean) => void;
-    notifyClear: () => void;
-    notifyFocus: (event?: any) => void;
-    notifyBlur: (event?: any) => void;
-    rePositionDropdown: () => void;
-}
-declare class AutoCompleteFoundation<P = Record<string, any>, S = Record<string, any>> extends BaseFoundation<AutoCompleteAdapter<P, S>, P, S> {
-    private _keydownHandler;
-    constructor(adapter: AutoCompleteAdapter<P, S>);
-    init(): void;
-    destroy(): void;
-    _setDropdownWidth(): void;
-    handleInputClick(e?: MouseEvent): void;
-    openDropdown(): void;
-    closeDropdown(e?: any): void;
-    _generateList(data: AutoCompleteData): Array<StateOptionItem>;
-    handleSearch(inputValue: string): void;
-    handleSelect(option: StateOptionItem, optionIndex?: number): void;
-    updateSelection(option: StateOptionItem): void;
-    notifySelect(option: StateOptionItem): void;
-    _backwardLabelInValue(): any;
-    handleDataChange(newData: any[]): void;
-    handleValueChange(propValue: any): void;
-    _getRenderSelectedItem(): any;
-    handleClear(): void;
-    bindKeyBoardEvent(): void;
-    unBindKeyBoardEvent(): void;
-    _handleKeyDown(event: KeyboardEvent): void;
-    _getEnableFocusIndex(offset: number): void;
-    _handleArrowKeyDown(offset: number): void;
-    _handleEnterKeyDown(): void;
-    handleOptionMouseEnter(optionIndex: number): void;
-    handleFocus(e: FocusEvent): void;
-    handleBlur(e: FocusEvent): void;
-}
-export default AutoCompleteFoundation;