/**
 * -------------------------------------------------------------------------------------------
 * Copyright (c) Microsoft Corporation.  All Rights Reserved.  Licensed under the MIT License.
 * See License in the project root for license information.
 * -------------------------------------------------------------------------------------------
 */
import * as MicrosoftGraph from '@microsoft/microsoft-graph-types';
import { TemplateResult } from 'lit-element';
import '../../styles/fabric-icon-font';
import '../mgt-person/mgt-person';
import { MgtTemplatedComponent } from '../templatedComponent';
/**
 * Web component used to search for people from the Microsoft Graph
 *
 * @export
 * @class MgtPicker
 * @extends {MgtTemplatedComponent}
 */
export declare class MgtPeoplePicker extends MgtTemplatedComponent {
    /**
     * Array of styles to apply to the element. The styles should be defined
     * user the `css` tag function.
     */
    static get styles(): import("lit-element").CSSResult[];
    /**
     * containing object of MgtPersonDetails.
     * @type {MgtPersonDetails}
     */
    people: Array<MicrosoftGraph.User | MicrosoftGraph.Person | MicrosoftGraph.Contact>;
    /**
     * determining how many people to show in list.
     * @type {number}
     */
    showMax: number;
    /**
     * value determining if search is filtered to a group.
     * @type {string}
     */
    groupId: string;
    /**
     *  array of user picked people.
     * @type {Array<any>}
     */
    selectedPeople: Array<MicrosoftGraph.User | MicrosoftGraph.Person | MicrosoftGraph.Contact>;
    private _userInput;
    private showLoading;
    private isLoading;
    private arrowSelectionCount;
    private groupPeople;
    private debouncedSearch;
    constructor();
    /**
     * Synchronizes property values when attributes change.
     *
     * @param {*} name
     * @param {*} oldValue
     * @param {*} newValue
     * @memberof MgtPersonCard
     */
    attributeChangedCallback(att: any, oldval: any, newval: any): void;
    /**
     * Invoked when the element is first updated. Implement to perform one time work on the element after update.
     * Checks if group-id is present
     * @memberof MgtPeoplePicker
     */
    firstUpdated(): void;
    /**
     * Invoked on each update to perform rendering tasks. This method must return a lit-html TemplateResult.
     * Setting properties inside this method will not trigger the element to update.
     * @returns
     * @memberof MgtPeoplePicker
     */
    render(): TemplateResult;
    /**
     * Focuses the input element when focus is called
     *
     * @param {FocusOptions} [options]
     * @memberof MgtPeoplePicker
     */
    focus(options?: FocusOptions): void;
    /**
     * Queries the microsoft graph for a user based on the user id and adds them to the selectedPeople array
     *
     * @param {[string]} an array of user ids to add to selectedPeople
     * @returns {Promise<void>}
     * @memberof MgtPeoplePicker
     */
    selectUsersById(userIds: [string]): Promise<void>;
    /**
     * Adds debounce method for set delay on user input
     */
    private onUserKeyUp;
    /**
     * Async query to Graph for members of group if determined by developer.
     * set's `this.groupPeople` to those members.
     */
    private findGroup;
    /**
     * Tracks event on user input in search
     * @param input - input text
     */
    private handleUserSearch;
    /**
     * Tracks event on user search (keydown)
     * @param event - event tracked on user input (keydown)
     */
    private onUserKeyDown;
    /**
     * Tracks user key selection for arrow key selection of people
     * @param event - tracks user key selection
     */
    private handleArrowSelection;
    /**
     * Tracks when user selects person from picker
     * @param person - contains details pertaining to selected user
     * @param event - tracks user event
     */
    private addPerson;
    /**
     * Async method which query's the Graph with user input
     * @param name - user input or name of person searched
     */
    private loadPersonSearch;
    /**
     * Filters people searched from already selected people
     * @param people - array of people returned from query to Graph
     */
    private filterPeople;
    /**
     * Removes person from selected people
     * @param person - person and details pertaining to user selected
     */
    private removePerson;
    private renderErrorMessage;
    private renderLoadingMessage;
    private renderSelectedPeople;
    private gainedFocus;
    private lostFocus;
    private renderHighlightText;
    private renderPeopleList;
    private renderPeople;
    private renderPerson;
    private renderSelectedPerson;
}
