define(["require", "exports", "tslib", "react", "@uifabric/experiments/lib/FloatingPeopleSuggestionsComposite", "@uifabric/example-data"], function (require, exports, tslib_1, React, FloatingPeopleSuggestionsComposite_1, example_data_1) {
    "use strict";
    Object.defineProperty(exports, "__esModule", { value: true });
    var _suggestions = [
        {
            key: '1',
            id: '1',
            displayText: 'Suggestion 1',
            item: example_data_1.mru[0],
            isSelected: true,
            showRemoveButton: true,
        },
        {
            key: '2',
            id: '2',
            displayText: 'Suggestion 2',
            item: example_data_1.mru[1],
            isSelected: false,
            showRemoveButton: true,
        },
        {
            key: '3',
            id: '3',
            displayText: 'Suggestion 3',
            item: example_data_1.mru[2],
            isSelected: false,
            showRemoveButton: true,
        },
        {
            key: '4',
            id: '4',
            displayText: 'Suggestion 4',
            item: example_data_1.mru[3],
            isSelected: false,
            showRemoveButton: true,
        },
        {
            key: '5',
            id: '5',
            displayText: 'Suggestion 5',
            item: example_data_1.mru[4],
            isSelected: false,
            showRemoveButton: true,
        },
    ];
    exports.FloatingPeopleSuggestionsExample = function () {
        var _a = React.useState(tslib_1.__spreadArrays(_suggestions)), peopleSuggestions = _a[0], setPeopleSuggestions = _a[1];
        var _onSuggestionSelected = function (ev, item) {
            _markSuggestionSelected(item);
        };
        var _onSuggestionRemoved = function (ev, suggestionToRemove) {
            setPeopleSuggestions(function (suggestions) {
                var modifiedSuggestions = suggestions.filter(function (item) { return item.id !== suggestionToRemove.id; });
                return modifiedSuggestions;
            });
        };
        var _markSuggestionSelected = function (selectedSuggestion) {
            setPeopleSuggestions(function (suggestions) {
                var modifiedSuggestions = suggestions.map(function (suggestion) {
                    return suggestion.id === selectedSuggestion.id
                        ? tslib_1.__assign(tslib_1.__assign({}, suggestion), { isSelected: true }) : tslib_1.__assign(tslib_1.__assign({}, suggestion), { isSelected: false });
                });
                return modifiedSuggestions;
            });
        };
        return (React.createElement(React.Fragment, null,
            React.createElement(FloatingPeopleSuggestionsComposite_1.FloatingPeopleSuggestions, { suggestions: tslib_1.__spreadArrays(peopleSuggestions), isSuggestionsVisible: true, targetElement: null, 
                /* eslint-disable react/jsx-no-bind */
                onSuggestionSelected: _onSuggestionSelected, onRemoveSuggestion: _onSuggestionRemoved, 
                /* eslint-enable react/jsx-no-bind */
                suggestionsHeaderText: 'People suggestions', noResultsFoundText: 'No suggestions', onFloatingSuggestionsDismiss: undefined, showSuggestionRemoveButton: true })));
    };
});
//# sourceMappingURL=FloatingPeopleSuggestions.Example.js.map