var __extends = (this && this.__extends) || function (d, b) {
    for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
    function __() { this.constructor = d; }
    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
define(["require", "exports", 'react', '../../../../index', './PeoplePickerExampleData', '../../../../utilities/object', './PeoplePicker.Types.Example.scss'], function (require, exports, React, index_1, PeoplePickerExampleData_1, object_1) {
    "use strict";
    var suggestionProps = {
        suggestionsHeaderText: 'Suggested People',
        noResultsFoundText: 'No results found'
    };
    var PeoplePickerTypesExample = (function (_super) {
        __extends(PeoplePickerTypesExample, _super);
        function PeoplePickerTypesExample() {
            var _this = this;
            _super.call(this);
            this.contextualMenuItems = [
                {
                    key: 'newItem',
                    icon: 'circlePlus',
                    name: 'New'
                },
                {
                    key: 'upload',
                    icon: 'upload',
                    name: 'Upload'
                },
                {
                    key: 'divider_1',
                    name: '-',
                },
                {
                    key: 'rename',
                    name: 'Rename'
                },
                {
                    key: 'properties',
                    name: 'Properties'
                },
                {
                    key: 'disabled',
                    name: 'Disabled item',
                    isDisabled: true
                }
            ];
            this._onFilterChanged = this._onFilterChanged.bind(this);
            this._peopleList = [];
            PeoplePickerExampleData_1.people.forEach(function (persona) {
                var target = {};
                object_1.assign(target, persona, { menuItems: _this.contextualMenuItems });
                _this._peopleList.push(target);
            });
            this.state = { currentPicker: 1 };
        }
        PeoplePickerTypesExample.prototype.render = function () {
            var currentPicker;
            switch (this.state.currentPicker) {
                case 1:
                    currentPicker = this._renderNormalPicker();
                    break;
                case 2:
                    currentPicker = this._renderCompactPicker();
                    break;
                case 3:
                    currentPicker = this._renderListPicker();
                    break;
                case 4:
                    currentPicker = this._renderPreselectedItemsPicker();
                    break;
                case 5:
                    currentPicker = this._renderLimitedSearch();
                    break;
            }
            return (React.createElement("div", null, currentPicker, React.createElement("div", {className: 'dropdown-div'}, React.createElement(index_1.Dropdown, {label: 'Select People Picker Type', options: [
                { key: 1, text: 'Normal' },
                { key: 2, text: 'Compact' },
                { key: 3, text: 'Members List' },
                { key: 4, text: 'Preselected Items' },
                { key: 5, text: 'Limit Search' }
            ], selectedKey: this.state.currentPicker, onChanged: this._dropDownSelected.bind(this)}))));
        };
        PeoplePickerTypesExample.prototype._renderListPicker = function () {
            return (React.createElement(index_1.ListPeoplePicker, {onResolveSuggestions: this._onFilterChanged, getTextFromItem: function (persona) { return persona.primaryText; }, className: 'ms-PeoplePicker', pickerSuggestionsProps: suggestionProps, key: 'list'}));
        };
        PeoplePickerTypesExample.prototype._renderNormalPicker = function () {
            return (React.createElement(index_1.NormalPeoplePicker, {onResolveSuggestions: this._onFilterChanged, getTextFromItem: function (persona) { return persona.primaryText; }, pickerSuggestionsProps: suggestionProps, className: 'ms-PeoplePicker', key: 'normal'}));
        };
        PeoplePickerTypesExample.prototype._renderCompactPicker = function () {
            return (React.createElement(index_1.CompactPeoplePicker, {onResolveSuggestions: this._onFilterChanged, getTextFromItem: function (persona) { return persona.primaryText; }, pickerSuggestionsProps: suggestionProps, className: 'ms-PeoplePicker'}));
        };
        PeoplePickerTypesExample.prototype._renderPreselectedItemsPicker = function () {
            return (React.createElement(index_1.CompactPeoplePicker, {onResolveSuggestions: this._onFilterChanged, getTextFromItem: function (persona) { return persona.primaryText; }, className: 'ms-PeoplePicker', defaultSelectedItems: PeoplePickerExampleData_1.people.splice(0, 3), key: 'list', pickerSuggestionsProps: suggestionProps}));
        };
        PeoplePickerTypesExample.prototype._renderLimitedSearch = function () {
            var limitedSearchSuggestionProps = suggestionProps;
            limitedSearchSuggestionProps.searchForMoreText = 'Load all Results';
            return (React.createElement(index_1.CompactPeoplePicker, {onResolveSuggestions: this._filterWithLimit.bind(this), getTextFromItem: function (persona) { return persona.primaryText; }, className: 'ms-PeoplePicker', onGetMoreResults: this._onFilterChanged, pickerSuggestionsProps: limitedSearchSuggestionProps}));
        };
        PeoplePickerTypesExample.prototype._onFilterChanged = function (filterText, items) {
            var _this = this;
            return filterText ? this._peopleList.filter(function (item) { return item.primaryText.toLowerCase().indexOf(filterText.toLowerCase()) === 0; }).filter(function (item) { return !_this._listContainsPersona(item, items); }) : [];
        };
        PeoplePickerTypesExample.prototype._listContainsPersona = function (persona, items) {
            if (!items || !items.length || items.length === 0) {
                return false;
            }
            return items.filter(function (item) { return item.primaryText === persona.primaryText; }).length > 0;
        };
        PeoplePickerTypesExample.prototype._filterWithLimit = function (filterText, currentItems) {
            return filterText ? this._onFilterChanged(filterText, currentItems).splice(0, 2) : [];
        };
        PeoplePickerTypesExample.prototype._dropDownSelected = function (option) {
            this.setState({ currentPicker: option.key });
        };
        return PeoplePickerTypesExample;
    }(React.Component));
    exports.PeoplePickerTypesExample = PeoplePickerTypesExample;
});
