"use strict";
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 __());
};
var React = require("react");
var index_1 = require("../../../../index");
require("./ContextualMenuExample.scss");
var ContextualMenuHeaderExample = (function (_super) {
    __extends(ContextualMenuHeaderExample, _super);
    function ContextualMenuHeaderExample() {
        var _this = _super.call(this) || this;
        _this.state = {
            isContextMenuVisible: false
        };
        _this._onClick = _this._onClick.bind(_this);
        _this._onDismiss = _this._onDismiss.bind(_this);
        return _this;
    }
    ContextualMenuHeaderExample.prototype.render = function () {
        return (React.createElement("div", null,
            React.createElement(index_1.Button, { onClick: this._onClick, id: 'ContextualMenuButton1' }, " Click for ContextualMenu "),
            this.state.isContextMenuVisible ? (React.createElement(index_1.ContextualMenu, { shouldFocusOnMount: true, target: this.state.target, onDismiss: this._onDismiss, directionalHint: index_1.getRTL() ? index_1.DirectionalHint.bottomRightEdge : index_1.DirectionalHint.bottomLeftEdge, items: [
                    {
                        key: 'Actions',
                        itemType: 2,
                        name: 'Actions'
                    },
                    {
                        key: 'upload',
                        iconProps: {
                            iconName: index_1.IconName.Upload,
                            style: {
                                color: 'salmon'
                            }
                        },
                        name: 'Upload',
                        title: 'Upload a file'
                    },
                    {
                        key: 'rename',
                        name: 'Rename'
                    },
                    {
                        key: 'share',
                        iconProps: {
                            iconName: index_1.IconName.Share
                        },
                        subMenuProps: {
                            items: [
                                {
                                    key: 'sharetoemail',
                                    name: 'Share to Email',
                                    iconProps: {
                                        iconName: index_1.IconName.Mail
                                    },
                                },
                                {
                                    key: 'sharetofacebook',
                                    name: 'Share to Facebook',
                                },
                                {
                                    key: 'sharetotwitter',
                                    name: 'Share to Twitter',
                                    iconProps: {
                                        iconName: index_1.IconName.Share
                                    },
                                },
                            ],
                        },
                        name: 'Sharing'
                    },
                    {
                        key: 'navigation',
                        itemType: 2,
                        name: 'Navigation'
                    },
                    {
                        key: 'properties',
                        name: 'Properties'
                    },
                    {
                        key: 'print',
                        iconProps: {
                            iconName: index_1.IconName.Print
                        },
                        name: 'Print'
                    },
                    {
                        key: 'Bing',
                        name: 'Go to Bing',
                        href: 'http://www.bing.com'
                    },
                ] })) : (null)));
    };
    ContextualMenuHeaderExample.prototype._onClick = function (event) {
        this.setState({ target: event.target, isContextMenuVisible: true });
    };
    ContextualMenuHeaderExample.prototype._onDismiss = function (event) {
        this.setState({ isContextMenuVisible: false });
    };
    return ContextualMenuHeaderExample;
}(React.Component));
exports.ContextualMenuHeaderExample = ContextualMenuHeaderExample;

//# sourceMappingURL=ContextualMenu.Header.Example.js.map
