import React from "react"; import { AutocompleteProps, TooltipProps, AutocompleteRenderOptionState, ListItemButtonProps, ListItemTextProps, SvgIconProps, AutocompleteRenderGetTagProps, } from "@mui/material"; import { UseTreeSelectProps, TreeSelectFreeSoloValueMapping, PathDirection, } from "./useTreeSelect"; export interface BaseDefaultOptionsProps extends Omit, "children"> { ListItemTextProps: ListItemTextProps; } export interface UpBranchDefaultOptionsProps extends BaseDefaultOptionsProps { exitIcon: React.ReactNode; exitText: string; pathLabel: string; pathDirection: Extract; TooltipProps?: Pick; } export interface DownBranchDefaultOptionsProps extends BaseDefaultOptionsProps { enterIcon: React.ReactNode; enterText: string; pathDirection: Extract; TooltipProps?: Omit, "children">; } /** * Default Option Component. */ export declare const DefaultOption: ( props: | UpBranchDefaultOptionsProps | DownBranchDefaultOptionsProps | BaseDefaultOptionsProps ) => JSX.Element; export interface TreeSelectRenderOptionState< Direction extends PathDirection = PathDirection > extends AutocompleteRenderOptionState { addFreeSoloText: string; pathLabel: string; disabled: boolean; enterIcon: React.ReactNode; enterText: string; exitIcon: React.ReactNode; exitText: string; optionLabel: string; pathDirection?: Direction; TooltipProps?: Direction extends "up" ? Pick : Omit, "children">; } export declare type RenderOption = ( props: React.HTMLAttributes & { key: React.Key; }, option: Node | TreeSelectFreeSoloValueMapping, state: TreeSelectRenderOptionState ) => React.ReactNode; export interface RenderTagsState { getPathLabel: (index: number) => string; } /** * Returns props for {@link DefaultOption} from arguments of {@link RenderOption} */ export declare const getDefaultOptionProps: ( props: React.HTMLAttributes & { key: React.Key; }, option: any, state: TreeSelectRenderOptionState ) => | UpBranchDefaultOptionsProps | DownBranchDefaultOptionsProps | BaseDefaultOptionsProps; export declare const PathIcon: (props: SvgIconProps) => JSX.Element; /** * Individual customize props for {@link https://mui.com/material-ui/react-tooltip | Tooltip} elements in TreeSelect. * * @property `enter` - Tooltip around the enter icon * @property `exit` - Tooltip around the exit icon * @property `currentPath` - Tooltip for current branch path. * @property `valuePath` - Tooltip for the selected value path or paths when `multiple === true` */ export interface IndividualTooltipProps { enter?: Omit, "children">; exit?: Omit, "children">; currentPath?: Omit, "children">; valuePath?: Omit, "children">; } export interface TreeSelectProps< Node, Multiple extends boolean | undefined = undefined, DisableClearable extends boolean | undefined = undefined, FreeSolo extends boolean | undefined = undefined > extends UseTreeSelectProps, Omit< AutocompleteProps< Node | TreeSelectFreeSoloValueMapping, Multiple, DisableClearable, FreeSolo >, | keyof UseTreeSelectProps | "loading" | "options" | "renderOption" | "renderTags" > { /** * Prefix option label for a adding freeSolo values. * * @default `"Add: "` * */ addFreeSoloText?: string; /** * The icon to display in place of the default enter icon. * * @default `` */ enterIcon?: React.ReactNode; /** * Override the default down branch icon tooltip `title`. * * @default `"Enter"` */ enterText?: string; /** * The icon to display in place of the default exit icon. * * @default `` */ exitIcon?: React.ReactNode; /** * Override the default up branch icon tooltip `title`. * * @default `"Exit"` */ exitText?: string; /** * Used to provided custom [`key`](https://reactjs.org/docs/lists-and-keys.html#keys) prop to rendered options. * * Option keys are generated by {@link UseTreeSelectProps.getOptionLabel}. * A keys' uniqueness can be compromised when `getOptionLabel` returns the * same string for two different options. Use this method to resolve such * conflicts. */ getOptionKey?: ( option: Node | TreeSelectFreeSoloValueMapping, state: { key: string; } ) => string; /** * The icon to display in place of the default path icon. * * Rendered when `multiple === false`. * * @default `` */ pathIcon?: React.ReactNode; /** * Render the option, use `getOptionLabel` by default. */ renderOption?: RenderOption; /** * Render the selected value. */ renderTags?: ( value: (Node | TreeSelectFreeSoloValueMapping)[], getTagProps: AutocompleteRenderGetTagProps, state: RenderTagsState ) => React.ReactNode; /** * Props applied to the {@link https://mui.com/material-ui/react-tooltip | Tooltip} elements. */ TooltipProps?: | Omit, "children"> | IndividualTooltipProps; } export declare const TreeSelect: < Node_1, Multiple extends boolean | undefined = undefined, DisableClearable extends boolean | undefined = undefined, FreeSolo extends boolean | undefined = undefined >( props: TreeSelectProps ) => JSX.Element; export default TreeSelect;