import React from 'react'; import PropTypes from 'prop-types'; import { Size, BasicTriggerRenderProps, BasicTreeSelectProps, BasicTreeSelectInnerData, TreeSelectAdapter } from '@douyinfe/semi-foundation/lib/cjs/treeSelect/foundation'; import '@douyinfe/semi-foundation/lib/cjs/tree/tree.css'; import '@douyinfe/semi-foundation/lib/cjs/treeSelect/treeSelect.css'; import BaseComponent, { ValidateStatus } from '../_base/baseComponent'; import { ContextValue } from '../configProvider/context'; import Input, { InputProps } from '../input/index'; import TagInput from '../tagInput'; import { TreeProps, TreeState, FlattenNode, TreeNodeData, TreeNodeProps } from '../tree/interface'; import { PopoverProps } from '../popover/index'; export type ExpandAction = false | 'click' | 'doubleClick'; export interface TriggerRenderProps extends Omit { [x: string]: any; componentProps: TreeSelectProps; value: TreeNodeData[]; onClear: (e: React.MouseEvent) => void; } export interface OnChange { (value: TreeNodeData['value'] | Array, node: TreeNodeData[] | TreeNodeData, e: React.MouseEvent): void; (node: TreeNodeData[] | TreeNodeData, e: React.MouseEvent): void; } export type RenderSelectedItemInSingle = (treeNode: TreeNodeData) => React.ReactNode; export type RenderSelectedItemInMultiple = (treeNode: TreeNodeData, otherProps: { index: number | string; onClose: (tagContent: any, e: React.MouseEvent) => void; }) => { isRenderInTag: boolean; content: React.ReactNode; }; export type RenderSelectedItem = RenderSelectedItemInSingle | RenderSelectedItemInMultiple; export type OverrideCommonProps = 'renderFullLabel' | 'renderLabel' | 'defaultValue' | 'emptyContent' | 'filterTreeNode' | 'style' | 'treeData' | 'value' | 'onExpand' | 'keyMaps' | 'showLine'; /** * Type definition description: * TreeSelectProps inherits some properties from BasicTreeSelectProps (from foundation) and TreeProps (from semi-ui-react). */ export interface TreeSelectProps extends Omit, Pick { 'aria-describedby'?: React.AriaAttributes['aria-describedby']; 'aria-errormessage'?: React.AriaAttributes['aria-errormessage']; 'aria-invalid'?: React.AriaAttributes['aria-invalid']; 'aria-labelledby'?: React.AriaAttributes['aria-labelledby']; 'aria-required'?: React.AriaAttributes['aria-required']; motion?: boolean; mouseEnterDelay?: number; mouseLeaveDelay?: number; arrowIcon?: React.ReactNode; autoAdjustOverflow?: boolean; clickToHide?: boolean; clearIcon?: React.ReactNode; defaultOpen?: boolean; dropdownClassName?: string; dropdownMatchSelectWidth?: boolean; dropdownStyle?: React.CSSProperties; dropdownMargin?: PopoverProps['margin']; insetLabel?: React.ReactNode; insetLabelId?: string; maxTagCount?: number; motionExpand?: boolean; optionListStyle?: React.CSSProperties; outerBottomSlot?: React.ReactNode; outerTopSlot?: React.ReactNode; placeholder?: string; prefix?: React.ReactNode; position?: PopoverProps['position']; searchAutoFocus?: boolean; searchPlaceholder?: string; showSearchClear?: boolean; size?: Size; suffix?: React.ReactNode; treeNodeLabelProp?: string; validateStatus?: ValidateStatus; zIndex?: number; searchPosition?: string; stopPropagation?: boolean | string; restTagsPopoverProps?: PopoverProps; expandIcon?: React.ReactNode | ((props: { onClick: (e: MouseEvent) => void; className: string; expanded: boolean; }) => React.ReactNode); searchRender?: boolean | ((inputProps: InputProps) => React.ReactNode); onSelect?: (selectedKey: string, selected: boolean, selectedNode: TreeNodeData) => void; renderSelectedItem?: RenderSelectedItem; getPopupContainer?: () => HTMLElement; triggerRender?: (props: TriggerRenderProps) => React.ReactNode; onBlur?: (e: React.MouseEvent) => void; onChange?: OnChange; onFocus?: (e: React.MouseEvent) => void; onVisibleChange?: (isVisible: boolean) => void; onClear?: (e: React.MouseEvent | React.KeyboardEvent) => void; autoMergeValue?: boolean; /** * Whether to allow selected tags to wrap to multiple lines in trigger (multiple + searchPosition="trigger"). * When enabled, TreeSelect will constrain trigger width and allow TagInput to wrap. */ triggerTagWrap?: boolean; } export type OverrideCommonState = 'keyEntities' | 'treeData' | 'disabledKeys' | 'flattenNodes'; export interface TreeSelectState extends Omit, Pick { inputTriggerFocus: boolean; isOpen: boolean; rePosKey: number; dropdownMinWidth: null | number; isHovering: boolean; prevProps: TreeSelectProps; isFocus: boolean; } declare class TreeSelect extends BaseComponent { static contextType: React.Context; static propTypes: { 'aria-describedby': PropTypes.Requireable; 'aria-errormessage': PropTypes.Requireable; 'aria-invalid': PropTypes.Requireable; 'aria-labelledby': PropTypes.Requireable; 'aria-required': PropTypes.Requireable; borderless: PropTypes.Requireable; loadedKeys: PropTypes.Requireable; loadData: PropTypes.Requireable<(...args: any[]) => any>; onLoad: PropTypes.Requireable<(...args: any[]) => any>; arrowIcon: PropTypes.Requireable; clearIcon: PropTypes.Requireable; defaultOpen: PropTypes.Requireable; defaultValue: PropTypes.Requireable>; defaultExpandAll: PropTypes.Requireable; defaultExpandedKeys: PropTypes.Requireable; expandAll: PropTypes.Requireable; disabled: PropTypes.Requireable; disableStrictly: PropTypes.Requireable; filterTreeNode: PropTypes.Requireable any)>>; multiple: PropTypes.Requireable; remote: PropTypes.Requireable; searchPlaceholder: PropTypes.Requireable; searchAutoFocus: PropTypes.Requireable; virtualize: PropTypes.Requireable; treeNodeFilterProp: PropTypes.Requireable; onChange: PropTypes.Requireable<(...args: any[]) => any>; onClear: PropTypes.Requireable<(...args: any[]) => any>; onSearch: PropTypes.Requireable<(...args: any[]) => any>; onSelect: PropTypes.Requireable<(...args: any[]) => any>; onExpand: PropTypes.Requireable<(...args: any[]) => any>; onChangeWithObject: PropTypes.Requireable; onBlur: PropTypes.Requireable<(...args: any[]) => any>; onFocus: PropTypes.Requireable<(...args: any[]) => any>; value: PropTypes.Requireable>; expandedKeys: PropTypes.Requireable; autoExpandParent: PropTypes.Requireable; showClear: PropTypes.Requireable; showSearchClear: PropTypes.Requireable; autoAdjustOverflow: PropTypes.Requireable; showFilteredOnly: PropTypes.Requireable; showLine: PropTypes.Requireable; motionExpand: PropTypes.Requireable; emptyContent: PropTypes.Requireable; keyMaps: PropTypes.Requireable; leafOnly: PropTypes.Requireable; treeData: PropTypes.Requireable; value: PropTypes.Requireable>; label: PropTypes.Requireable; }>[]>; dropdownClassName: PropTypes.Requireable; dropdownStyle: PropTypes.Requireable; dropdownMargin: PropTypes.Requireable>; motion: PropTypes.Requireable; placeholder: PropTypes.Requireable; maxTagCount: PropTypes.Requireable; size: PropTypes.Requireable; className: PropTypes.Requireable; style: PropTypes.Requireable; treeNodeLabelProp: PropTypes.Requireable; suffix: PropTypes.Requireable; prefix: PropTypes.Requireable; insetLabel: PropTypes.Requireable; insetLabelId: PropTypes.Requireable; zIndex: PropTypes.Requireable; getPopupContainer: PropTypes.Requireable<(...args: any[]) => any>; dropdownMatchSelectWidth: PropTypes.Requireable; validateStatus: PropTypes.Requireable<"default" | "error" | "warning" | "success">; mouseEnterDelay: PropTypes.Requireable; mouseLeaveDelay: PropTypes.Requireable; triggerRender: PropTypes.Requireable<(...args: any[]) => any>; stopPropagation: PropTypes.Requireable>; outerBottomSlot: PropTypes.Requireable; outerTopSlot: PropTypes.Requireable; onVisibleChange: PropTypes.Requireable<(...args: any[]) => any>; expandAction: PropTypes.Requireable; searchPosition: PropTypes.Requireable<"trigger" | "dropdown">; clickToHide: PropTypes.Requireable; renderLabel: PropTypes.Requireable<(...args: any[]) => any>; renderFullLabel: PropTypes.Requireable<(...args: any[]) => any>; labelEllipsis: PropTypes.Requireable; optionListStyle: PropTypes.Requireable; searchRender: PropTypes.Requireable any)>>; renderSelectedItem: PropTypes.Requireable<(...args: any[]) => any>; checkRelation: PropTypes.Requireable; 'aria-label': PropTypes.Requireable; showRestTagsPopover: PropTypes.Requireable; restTagsPopoverProps: PropTypes.Requireable; preventScroll: PropTypes.Requireable; clickTriggerToHide: PropTypes.Requireable; autoMergeValue: PropTypes.Requireable; triggerTagWrap: PropTypes.Requireable; }; static defaultProps: Partial; inputRef: React.RefObject; tagInputRef: React.RefObject; triggerRef: React.RefObject; optionsRef: React.RefObject; optionContainerEl: React.RefObject; clickOutsideHandler: any; onNodeClick: any; onNodeDoubleClick: any; onMotionEnd: any; treeSelectID: string; context: ContextValue; constructor(props: TreeSelectProps); static getDerivedStateFromProps(props: TreeSelectProps, prevState: TreeSelectState): Partial; get adapter(): TreeSelectAdapter; componentDidMount(): void; componentWillUnmount(): void; renderSuffix: () => React.JSX.Element; renderPrefix: () => React.JSX.Element; renderContent: () => React.JSX.Element; removeTag: (removedKey: TreeNodeData['key']) => void; handleClick: (e: React.MouseEvent) => void; getDataForKeyNotInKeyEntities: (key: string) => any; handleSelectionEnterPress: (e: React.KeyboardEvent) => void; hasValue: () => boolean; showClearBtn: () => boolean; renderTagList: (triggerRenderKeys: string[]) => React.ReactNode[]; /** * When single selection and the search box is on trigger, the items displayed in the rendered search box */ renderSingleTriggerSearchItem: () => React.JSX.Element; /** * Single selection and the search box content rendered when the search box is on trigger */ renderSingleTriggerSearch: () => React.JSX.Element; renderSelectContent: (triggerRenderKeys: string[]) => React.JSX.Element; handleClear: (e: React.MouseEvent) => void; handleClearEnterPress: (e: React.KeyboardEvent) => void; handleMouseOver: (e: React.MouseEvent) => void; handleMouseLeave: (e: React.MouseEvent) => void; search: (value: string) => void; close: () => void; renderArrow: () => React.JSX.Element; renderClearBtn: () => React.JSX.Element; renderSelection: () => React.JSX.Element; renderTagItem: (key: string, idx: number) => any; renderTagInput: (triggerRenderKeys: string[]) => React.JSX.Element; renderInput: () => React.JSX.Element; renderEmpty: () => React.JSX.Element; onNodeLoad: (data: TreeNodeData) => Promise; onNodeSelect: (e: React.MouseEvent | React.KeyboardEvent, treeNode: TreeNodeProps) => void; onNodeCheck: (e: React.MouseEvent | React.KeyboardEvent, treeNode: TreeNodeProps) => void; onNodeExpand: (e: React.MouseEvent | React.KeyboardEvent, treeNode: TreeNodeProps) => void; getTreeNodeRequiredProps: () => { expandedKeys: Set; selectedKeys: string[]; checkedKeys: Set; halfCheckedKeys: Set; filteredKeys: Set; keyEntities: import("../tree/interface").KeyEntities; }; getTreeNodeKey: (treeNode: TreeNodeData) => string; handlePopoverVisibleChange: (isVisible: any) => void; afterClose: () => void; renderTreeNode: (treeNode: FlattenNode, ind: number, style: React.CSSProperties) => React.JSX.Element; itemKey: (index: number, data: Record) => any; renderNodeList: () => React.JSX.Element; renderTree: () => React.JSX.Element; render(): React.JSX.Element; } export default TreeSelect;