@douyinfe/semi-foundation 2.1.1 → 2.1.2

package/lib/cjs/tree/variables.scss

@@ -0,0 +1,54 @@
+$color-tree_default-bg-default: var(--semi-color-fill-0); // 树背景颜色 - 默认
+$color-tree_default-border-default: transparent; // 树描边颜色 - 默认
+$color-tree_default-icon-default: var(--semi-color-text-2); // 树图标颜色 - 默认
+$color-tree_default-bg-hover: var(--semi-color-fill-1); // 树背景颜色 - 悬停
+
+$color-tree_default-border-focus: var(--semi-color-focus-border); // 树描边颜色 - 按下
+
+$color-tree_option-text-default: var(--semi-color-text-0); // 树选项文字颜色
+$color-tree_option-icon-default: var(--semi-color-text-2); // 树选项图标颜色
+
+$color-tree_option-bg-hover: var(--semi-color-fill-0); // 树选项背景色 - 悬停
+$color-tree_option_selected-bg-default: var(--semi-color-fill-1); // 树选项背景色 - 按下
+$color-tree_option-bg-active: var(--semi-color-primary-light-default); // 树选项背景色 - 选中
+$color-tree_option_disabled-text-default: var(--semi-color-disabled-text); // 禁用树选项文字颜色
+
+$color-tree_option-icon-hover: var(--semi-color-text-0); // 树选项图标颜色 - 悬浮
+$color-tree_option-icon-active: var(--semi-color-black); // 树选项图标颜色 - 按下
+$color-tree_option_loading-icon-default: var(--semi-color-primary); // 树选项加载 spin 颜色
+
+$color-tree_option_draggable_insert-border-default: var(--semi-color-primary); // 树选项加载 spin 颜色
+
+$height-tree_default: $height-control-default; // 树选项高度 - 默认
+
+$font-tree_default-fontWeight: $font-weight-regular; // 树选项文本字重 - 默认
+$font-tree_option_hightlight-fontWeight: $font-weight-bold; // 树选项高亮文本字重
+$color-tree_option_hightlight-text: var(--semi-color-primary); // 树选项高亮文本颜色
+
+$radius-tree: var(--semi-border-radius-small); // 树整体圆角
+$radius-tree_checkbox_addon: var(--semi-border-radius-small); // 多选树 checkbox 圆角
+
+$spacing-tree_search_wrapper-paddingX: 12px; // 树搜索框水平内边距
+$spacing-tree_search_wrapper-paddingY: 8px; // 树搜索框垂直内边距
+$spacing-tree_option_level-paddingLeft: 20px; // 树选项缩进增量
+$spacing-tree_option_level1-paddingLeft: 8px; // 树选项最上层左侧内边距
+
+$spacing-tree_optionList-paddingX: 0; // 树选项列表水平内边距
+$spacing-tree_optionList-paddingY: 8px; // 树选项列表垂直内边距
+$spacing-tree_option-paddingTop: 4px; // 树选项顶部内边距
+$spacing-tree_option-paddingBottom: 4px; // 树选项底部内边距
+$spacing-tree_icon-marginRight: 8px; // 树选项图标右侧外边距
+$spacing-tree_label_withIcon-marginRight: 8px; // 树选项图标右侧外边距
+$spacing-tree_option_draggable-paddingY: 3px; // 可拖拽的树选项垂直内边距
+$spacing-tree_option_draggable-paddingX: 0; // 可拖拽的树选项水平内边距
+$spacing-tree_spinIcon-paddingY: 4px; // 树选项加载 spin 垂直内边距 (已废弃)
+$spacing-tree_spinIcon-paddingX: 0; // 树选项加载 spin 水平内边距 (已废弃)
+
+$width-tree-border: 1px; // 树选项描边宽度
+$width-tree_arrow: 32px; // 树选项箭头宽度
+$width-tree_emptyIcon: $width-icon-small; // 树选项空图标宽度
+$width-tree_spinIcon: $width-icon-small; // 树选项加载 spin 宽度
+$width-tree_focus-border: $border-thickness-control-focus; // 树选中态描边宽度
+$width-tree_option:  230px; // 树选项宽度
+$width-tree_search_wrapper-border: 1px; // 树搜索框容器描边宽度
+$width-tree_option_draggable-border: 2px; // 可拖拽的树标示线宽度

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

@@ -0,0 +1,13 @@
+declare const cssClasses: {
+    PREFIX: string;
+    PREFIXTREE: string;
+    PREFIX_OPTION: string;
+};
+declare const strings: {
+    readonly SIZE_SET: readonly ["small", "large", "default"];
+    readonly SEARCH_POSITION_DROPDOWN: "dropdown";
+    readonly SEARCH_POSITION_TRIGGER: "trigger";
+    readonly STATUS: readonly ["default", "error", "warning", "success"];
+};
+declare const numbers: {};
+export { cssClasses, strings, numbers };

package/lib/cjs/treeSelect/constants.js

@@ -0,0 +1,27 @@
+"use strict";
+
+var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
+
+_Object$defineProperty(exports, "__esModule", {
+  value: true
+});
+
+exports.strings = exports.numbers = exports.cssClasses = void 0;
+
+var _constants = require("../base/constants");
+
+const cssClasses = {
+  PREFIX: "".concat(_constants.BASE_CLASS_PREFIX, "-tree-select"),
+  PREFIXTREE: "".concat(_constants.BASE_CLASS_PREFIX, "-tree"),
+  PREFIX_OPTION: "".concat(_constants.BASE_CLASS_PREFIX, "-tree-select-option")
+};
+exports.cssClasses = cssClasses;
+const strings = {
+  SIZE_SET: ['small', 'large', 'default'],
+  SEARCH_POSITION_DROPDOWN: 'dropdown',
+  SEARCH_POSITION_TRIGGER: 'trigger',
+  STATUS: _constants.VALIDATE_STATUS
+};
+exports.strings = strings;
+const numbers = {};
+exports.numbers = numbers;

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

@@ -0,0 +1,162 @@
+import BaseFoundation, { DefaultAdapter } from '../base/foundation';
+import { BasicTreeInnerData, BasicTreeProps, BasicTreeNodeData, BasicTreeNodeProps, BasicExpandedOtherProps } from '../tree/foundation';
+import { Motion } from '../utils/type';
+export declare type ValidateStatus = 'error' | 'warning' | 'default';
+export declare type Size = 'small' | 'large' | 'default';
+export declare type BasicRenderSelectedItemInMultiple = (treeNode: BasicTreeNodeData, otherProps: {
+    index: number | string;
+    onClose: (tagContent: any, e: any) => void;
+}) => {
+    isRenderInTag: boolean;
+    content: any;
+};
+export declare type BasicRenderSelectedItemInSingle = (treeNode: BasicTreeNodeData) => any;
+export declare type BasicRenderSelectedItem = BasicRenderSelectedItemInSingle | BasicRenderSelectedItemInMultiple;
+export interface BasicTriggerRenderProps {
+    [x: string]: any;
+    componentProps: BasicTreeSelectProps;
+    disabled: boolean;
+    inputValue: string;
+    placeholder: string;
+    value: BasicTreeNodeData[];
+    onClear: (e: any) => void;
+}
+export declare type BasicOnChangeWithObject = (node: BasicTreeNodeData[] | BasicTreeNodeData, e: any) => void;
+export declare type BasicOnChangeWithBasic = (value: BasicTreeNodeData['value'], node: BasicTreeNodeData[] | BasicTreeNodeData, e: any) => void;
+export interface BasicOnChange {
+    (node: BasicTreeNodeData[] | BasicTreeNodeData, e: any): void;
+    (value: BasicTreeNodeData['value'] | Array<BasicTreeNodeData['value']>, node: BasicTreeNodeData[] | BasicTreeNodeData, e: any): void;
+}
+export interface BasicTreeSelectProps extends Pick<BasicTreeProps, 'virtualize' | 'renderFullLabel' | 'renderLabel' | 'autoExpandParent' | 'className' | 'defaultExpandAll' | 'defaultExpandedKeys' | 'defaultValue' | 'disabled' | 'emptyContent' | 'expandAction' | 'expandedKeys' | 'filterTreeNode' | 'labelEllipsis' | 'leafOnly' | 'multiple' | 'onChangeWithObject' | 'showClear' | 'showFilteredOnly' | 'style' | 'treeData' | 'treeNodeFilterProp' | 'value' | 'onExpand' | 'onSearch' | 'expandAll' | 'disableStrictly'> {
+    motion?: Motion;
+    mouseEnterDelay?: number;
+    mouseLeaveDelay?: number;
+    arrowIcon?: any;
+    autoAdjustOverflow?: boolean;
+    clickToHide?: boolean;
+    defaultOpen?: boolean;
+    dropdownClassName?: string;
+    dropdownMatchSelectWidth?: boolean;
+    dropdownStyle?: any;
+    insetLabel?: any;
+    maxTagCount?: number;
+    motionExpand?: boolean;
+    optionListStyle?: any;
+    outerBottomSlot?: any;
+    outerTopSlot?: any;
+    placeholder?: string;
+    prefix?: any;
+    searchAutoFocus?: boolean;
+    searchPlaceholder?: string;
+    showSearchClear?: boolean;
+    size?: Size;
+    suffix?: any;
+    treeNodeLabelProp?: string;
+    validateStatus?: ValidateStatus;
+    zIndex?: number;
+    searchPosition?: string;
+    stopPropagation?: boolean | string;
+    loadedKeys?: string[];
+    loadData?: (data: BasicTreeNodeData) => Promise<void>;
+    onSelect?: (selectedKeys: string, selected: boolean, selectedNode: BasicTreeNodeData) => void;
+    searchRender?: (inputProps: any) => any;
+    renderSelectedItem?: BasicRenderSelectedItem;
+    getPopupContainer?: () => HTMLElement;
+    onBlur?: (e: any) => void;
+    onChange?: BasicOnChange;
+    onFocus?: (e: any) => void;
+    onVisibleChange?: (isVisible: boolean) => void;
+    onLoad?: (keys: Set<string>, data: BasicTreeNodeData) => void;
+}
+export interface BasicTreeSelectInnerData extends Pick<BasicTreeInnerData, 'keyEntities' | 'treeData' | 'flattenNodes' | 'selectedKeys' | 'checkedKeys' | 'halfCheckedKeys' | 'motionKeys' | 'motionType' | 'expandedKeys' | 'filteredKeys' | 'filteredExpandedKeys' | 'filteredShownKeys' | 'cachedKeyValuePairs' | 'inputValue' | 'disabledKeys' | 'loadedKeys' | 'loadingKeys'> {
+    inputTriggerFocus: boolean;
+    isOpen: boolean;
+    isInput: boolean;
+    rePosKey: number;
+    dropdownMinWidth: null | number;
+    isHovering: boolean;
+    prevProps: BasicTreeSelectProps;
+}
+export interface TreeSelectAdapter<P = Record<string, any>, S = Record<string, any>> extends DefaultAdapter<P, S> {
+    updateInputValue: (value: string) => void;
+    registerClickOutsideHandler: (cb: (e: any) => void) => void;
+    unregisterClickOutsideHandler: () => void;
+    rePositionDropdown: () => void;
+    updateState: (states: Pick<S, keyof S>) => void;
+    notifySelect: (selectedKeys: string, selected: boolean, selectedNode: BasicTreeNodeData) => void;
+    notifySearch: (input: string) => void;
+    cacheFlattenNodes: (bool: boolean) => void;
+    openMenu: () => void;
+    closeMenu: (cb?: () => void) => void;
+    getTriggerWidth: () => boolean | number;
+    setOptionWrapperWidth: (width: null | number) => void;
+    notifyChange: BasicOnChangeWithBasic;
+    notifyChangeWithObject: BasicOnChangeWithObject;
+    notifyExpand: (expandedKeys: Set<string>, expandedOtherProps: BasicExpandedOtherProps) => void;
+    notifyFocus: (e: any) => void;
+    notifyBlur: (e: any) => void;
+    toggleHovering: (bool: boolean) => void;
+    notifyLoad: (newLoadedKeys: Set<string>, data: BasicTreeNodeData) => void;
+    updateInputFocus: (bool: boolean) => void;
+    updateLoadKeys: (data: BasicTreeNodeData, resolve: (value?: any) => void) => void;
+}
+export default class TreeSelectFoundation<P = Record<string, any>, S = Record<string, any>> extends BaseFoundation<TreeSelectAdapter<P, S>, P, S> {
+    constructor(adapter: TreeSelectAdapter<P, S>);
+    init(): void;
+    destroy(): void;
+    _setDropdownWidth(): void;
+    _isMultiple(): any;
+    _isAnimated(): any;
+    _isDisabled(treeNode?: BasicTreeNodeProps): any;
+    _isExpandControlled(): any;
+    _isSelectToClose(): boolean;
+    _isLoadControlled(): any;
+    _showFilteredOnly(): any;
+    getCopyFromState(items: string | string[]): BasicTreeInnerData;
+    getTreeNodeProps(key: string): BasicTreeNodeProps;
+    handleNodeLoad(loadedKeys: Set<string>, loadingKeys: Set<string>, data: BasicTreeNodeData, resolve: (value?: any) => void): {
+        loadingKeys?: undefined;
+    } | {
+        loadingKeys: Set<string>;
+    };
+    focusInput(bool: boolean): void;
+    _notifyMultipleChange(key: string[], e: any): void;
+    _notifyChange(key: any, e: any): void;
+    _notifyFocus(e: any): void;
+    _notifyBlur(e: any): void;
+    toggleHoverState(bool: boolean): void;
+    open(): void;
+    close(e: any): void;
+    handleClick(e: any): void;
+    handleClear(e: any): void;
+    removeTag(eventKey: BasicTreeNodeData['key']): void;
+    clearInput(): void;
+    handleInputChange(sugInput: string): void;
+    handleNodeSelect(e: any, treeNode: BasicTreeNodeProps): void;
+    handleSingleSelect(e: any, treeNode: BasicTreeNodeProps): void;
+    calcCheckedKeys(eventKey: BasicTreeNodeProps['eventKey'], targetStatus: boolean): {
+        checkedKeys: Set<string>;
+        halfCheckedKeys: Set<string>;
+    };
+    handleMultipleSelect(e: any, treeNode: BasicTreeNodeProps): void;
+    calcNonDisabedCheckedKeys(eventKey: string, targetStatus: boolean): {
+        checkedKeys: Set<string>;
+        halfCheckedKeys: Set<any>;
+    };
+    calcChekcedStatus(targetStatus: boolean, eventKey: string): boolean;
+    handleNodeExpandInSearch(e: any, treeNode: BasicTreeNodeProps): void;
+    handleNodeExpand(e: any, treeNode: BasicTreeNodeProps): void;
+    /**
+     * The selected items that need to be displayed in the search box when obtaining a single selection
+     */
+    getRenderTextInSingle(): any;
+    /**
+     * When the search box is on the trigger, the blur event handling method
+     */
+    handleInputTriggerBlur(): void;
+    /**
+     * When the search box is on the trigger, the focus event processing method
+     */
+    handleInputTriggerFocus(): void;
+    setLoadKeys(data: BasicTreeNodeData, resolve: (value?: any) => void): void;
+}