text: "use strict";
  Object.defineProperty(exports, "__esModule", { value: true });
  var tslib_1 = require("tslib");
  var React = require("react");
  var Utilities_1 = require("../../../Utilities");
  var TagPicker_1 = require("office-ui-fabric-react/lib/components/pickers/TagPicker/TagPicker");
  var Checkbox_1 = require("office-ui-fabric-react/lib/Checkbox");
  var _testTags = [
      'black',
      'blue',
      'brown',
      'cyan',
      'green',
      'magenta',
      'mauve',
      'orange',
      'pink',
      'purple',
      'red',
      'rose',
      'violet',
      'white',
      'yellow'
  ].map(function (item) { return ({ key: item, name: item }); });
  var TagPickerBasicExample = (function (_super) {
      tslib_1.__extends(TagPickerBasicExample, _super);
      function TagPickerBasicExample() {
          var _this = _super.call(this) || this;
          _this.state = {
              isPickerDisabled: false
          };
          return _this;
      }
      TagPickerBasicExample.prototype.render = function () {
          return (React.createElement("div", null,
              React.createElement(Checkbox_1.Checkbox, { label: 'Disable Tag Picker', checked: this.state.isPickerDisabled, onChange: this._onDisabledButtonClick }),
              React.createElement(TagPicker_1.TagPicker, { ref: 'tagPicker', onResolveSuggestions: this._onFilterChanged, getTextFromItem: function (item) { return item.name; }, pickerSuggestionsProps: {
                      suggestionsHeaderText: 'Suggested Tags',
                      noResultsFoundText: 'No Color Tags Found'
                  }, itemLimit: 2, disabled: this.state.isPickerDisabled, inputProps: {
                      onBlur: function (ev) { return console.log('onBlur called'); },
                      onFocus: function (ev) { return console.log('onFocus called'); },
                      'aria-label': 'Tag Picker'
                  } })));
      };
      TagPickerBasicExample.prototype._onDisabledButtonClick = function () {
          this.setState({
              isPickerDisabled: !this.state.isPickerDisabled
          });
      };
      TagPickerBasicExample.prototype._onFilterChanged = function (filterText, tagList) {
          var _this = this;
          return filterText ? _testTags.filter(function (tag) { return tag.name.toLowerCase().indexOf(filterText.toLowerCase()) === 0; }).filter(function (item) { return !_this._listContainsDocument(item, tagList); }) : [];
      };
      TagPickerBasicExample.prototype._listContainsDocument = function (tag, tagList) {
          if (!tagList || !tagList.length || tagList.length === 0) {
              return false;
          }
          return tagList.filter(function (compareTag) { return compareTag.key === tag.key; }).length > 0;
      };
      tslib_1.__decorate([
          Utilities_1.autobind
      ], TagPickerBasicExample.prototype, "_onDisabledButtonClick", null);
      tslib_1.__decorate([
          Utilities_1.autobind
      ], TagPickerBasicExample.prototype, "_onFilterChanged", null);
      return TagPickerBasicExample;
  }(React.Component));
  exports.TagPickerBasicExample = TagPickerBasicExample;
  //# sourceMappingURL=TagPicker.Basic.Example.js.map