///
import { IReadonlyObservableArray, IReadonlyObservableValue } from '../../Core/Observable';
import { IIconProps } from '../../Icon';
import { IPillProps } from '../../Pill';
import { ISuggestionItemProps } from '../../SuggestionsList';
export interface ISelectedTagProps extends IPillProps {
/**
* Content to show in the pill when selected.
*/
content: string;
}
export interface ITagPickerProps {
/**
* Callback to determine if two tags are identical.
*/
areTagsEqual: (first: T, second: T) => boolean;
/**
* Aria label
*/
ariaLabel?: string;
/**
* Callback which converts one of the tag items to a pill.
*/
convertItemToPill: (item: T, index: number) => ISelectedTagProps;
/**
* Callback to create a default item from a search string.
*/
createDefaultItem?: (searchString: string) => T | undefined;
/**
* Text to show when the search does not show any suggestions
*/
noResultsFoundText: string;
/**
* Callback when focus has left the TagPicker.
*/
onBlur?: () => void;
/**
* Callback when the user clicks or focuses on an empty text field. This can be used to show an MRU list
*/
onEmptyInputFocus?: () => void;
/**
* Callback for when the right arrow key is pressed inside the tag picker.
*/
onSuggestionExpanded?: (tag: T) => void;
/**
* Callback when the text value of the input tag has changed. This callback should change the suggestions and suggestionsLoading values appropriately.
*/
onSearchChanged: (searchValue: string) => void;
/**
* Callback when a tag is chosen. Unless the tag is not valid, the consumer should update the suggestions list.
*/
onTagAdded: (tag: T) => void;
/**
* Callback when a tag is removed. Unless the tag is not valid, the consumer should update the suggestions list.
*/
onTagRemoved: (tag: T) => void;
/**
* Callback when a group of tags is removed. Unless the tag is not valid, the consumer should update the suggestions list. If this is not
* specified, then the user cannot select multiple tags for deletion.
*/
onTagsRemoved?: (tags: T[]) => void;
/**
* Placeholder text to show when the input has no text and there are no selected tags
*/
placeholderText?: string;
/**
* Icon props to show at the beginning of the picker control when there is nothing selected
*/
prefixIconProps?: IIconProps;
/**
* Callback to render the suggestion row for a given suggestion.
*/
renderSuggestionItem: (itemProps: ISuggestionItemProps) => JSX.Element;
/**
* List of tags currently selected by the user. This prop is 100% controlled
* by the consumer. onTagAdded/onTagRemoved/onTagsRemoved must also be implemented in order to
* work properly. If this value is a an item, the prop must be
* updated to cause the Tag Picker to re-render. If this value is an
* ObservableValue, then changing its value will cause the Tag Picker
* to re-render.
*/
selectedTags: IReadonlyObservableArray | T[];
/**
* List of suggestions for the given search value. This prop is 100% controlled
* by the consumer. onSearchChanged must also be implemented in order to
* work properly. If this value is a an item, the prop must be
* updated to cause the Tag Picker to re-render. If this value is an
* ObservableValue, then changing its value will cause the Tag Picker
* to re-render.
*/
suggestions: IReadonlyObservableArray | T[];
/**
* boolean indicating if the control is waiting to generate its suggestions list. This prop is 100% controlled
* by the consumer. onSearchChanged must also be implemented in order to
* work properly. If this value is a an T, the prop must be
* updated to cause the Tag Picker to re-render. If this value is an
* ObservableValue, then changing its value will cause the Tag Picker
*/
suggestionsLoading: IReadonlyObservableValue | boolean;
/**
* String to show when results are loading
*/
suggestionsLoadingText?: string;
}