office-ui-fabric-react
Version:
Reusable React components for building experiences for Office 365.
118 lines (117 loc) • 4.22 kB
TypeScript
/// <reference types="react" />
import * as React from 'react';
import { IKeytipLayerProps } from './KeytipLayer.types';
import { IKeytipProps } from '../../Keytip';
import { BaseComponent } from '../../Utilities';
import { KeytipTree } from './KeytipTree';
import { IKeytipTransitionKey } from '../../utilities/keytips/IKeytipTransitionKey';
export interface IKeytipLayerState {
inKeytipMode: boolean;
keytips: IKeytipProps[];
visibleKeytips: IKeytipProps[];
}
/**
* A layer that holds all keytip items
*
* @export
* @class KeytipLayer
* @extends {BaseComponent<IKeytipLayerProps>}
*/
export declare class KeytipLayerBase extends BaseComponent<IKeytipLayerProps, IKeytipLayerState> {
static defaultProps: IKeytipLayerProps;
private _keytipTree;
private _keytipManager;
private _classNames;
private _currentSequence;
private _newCurrentKeytipSequences?;
private _delayedKeytipQueue;
private _delayedQueueTimeout;
private _keyHandled;
constructor(props: IKeytipLayerProps, context: any);
render(): JSX.Element;
componentDidMount(): void;
componentWillUnmount(): void;
getCurrentSequence(): string;
getKeytipTree(): KeytipTree;
/**
* Processes an IKeytipTransitionKey entered by the user
*
* @param transitionKey - IKeytipTransitionKey received by the layer to process
*/
processTransitionInput(transitionKey: IKeytipTransitionKey, ev?: React.KeyboardEvent<HTMLElement>): void;
/**
* Processes inputs from the document listener and traverse the keytip tree
*
* @param key - Key pressed by the user
*/
processInput(key: string, ev?: React.KeyboardEvent<HTMLElement>): void;
/**
* Show the given keytips and hide all others
*
* @param ids - Keytip IDs to show
*/
showKeytips(ids: string[]): void;
/**
* Enters keytip mode for this layer
*/
private _enterKeytipMode();
/**
* Exits keytip mode for this layer
*/
private _exitKeytipMode(ev?);
/**
* Sets the keytips state property
*
* @param keytipProps - Keytips to set in this layer
*/
private _setKeytips(keytipProps?);
/**
* Callback function to use for persisted keytips
*
* @param overflowButtonSequences - The overflow button sequence to execute
* @param keytipSequences - The keytip that should become the 'currentKeytip' when it is registered
*/
private _persistedKeytipExecute(overflowButtonSequences, keytipSequences);
private _getVisibleKeytips(keytips);
private _onDismiss;
private _onKeyDown;
/**
* Gets the ModifierKeyCodes based on the keyboard event
*
* @param ev - React.KeyboardEvent
* @returns List of ModifierKeyCodes that were pressed
*/
private _getModifierKey(key, ev);
private _onKeyPress;
private _onKeytipAdded;
private _onKeytipUpdated;
private _onKeytipRemoved;
private _onPersistedKeytipAdded;
private _onPersistedKeytipRemoved;
private _onPersistedKeytipExecute;
/**
* Trigger a keytip immediately and set it as the current keytip
*
* @param keytipProps - Keytip to trigger immediately
*/
private _triggerKeytipImmediately(keytipProps);
private _addKeytipToQueue(keytipID);
private _removeKeytipFromQueue(keytipID);
private _getKtpExecuteTarget(currKtp);
private _getKtpTarget(currKtp);
/**
* Returns T/F if the keytipProps keySequences match the currentKeytip, and the currentKeytip is in an overflow well
* This will make 'keytipProps' the new currentKeytip
*
* @param keytipProps - Keytip props to check
* @returns {boolean} - T/F if this keytip should become the currentKeytip
*/
private _isCurrentKeytipAnAlias(keytipProps);
/**
* Sets if we are in keytip mode.
* Note, this sets both the state for the layer as well as
* the value that the manager will expose externally.
* @param inKeytipMode - Boolean so set whether we are in keytip mode or not
*/
private _setInKeytipMode;
}