define(["require", "exports", "tslib", "react", "../../Utilities", "./Fabric.styles"], function (require, exports, tslib_1, React, Utilities_1, Fabric_styles_1) {
    "use strict";
    Object.defineProperty(exports, "__esModule", { value: true });
    var getClassNames = Utilities_1.classNamesFunction();
    var FabricBase = /** @class */ (function (_super) {
        tslib_1.__extends(FabricBase, _super);
        function FabricBase(props) {
            var _this = _super.call(this, props) || this;
            _this._rootElement = React.createRef();
            _this._disposables = [];
            _this._onMouseDown = function (ev) {
                _this.setState({ isFocusVisible: false });
            };
            _this._onKeyDown = function (ev) {
                if (Utilities_1.isDirectionalKeyCode(ev.which)) {
                    _this.setState({ isFocusVisible: true });
                }
            };
            _this.state = { isFocusVisible: false };
            return _this;
        }
        FabricBase.prototype.render = function () {
            var className = this.props.className;
            var classNames = getClassNames(Fabric_styles_1.getStyles, {
                theme: this.props.theme,
                className: className,
                isFocusVisible: this.state.isFocusVisible
            });
            var divProps = Utilities_1.getNativeProps(this.props, Utilities_1.divProperties);
            return React.createElement("div", tslib_1.__assign({}, divProps, { className: classNames.root, ref: this._rootElement }));
        };
        FabricBase.prototype.componentDidMount = function () {
            var win = Utilities_1.getWindow(this._rootElement.current);
            if (win) {
                this._disposables.push(Utilities_1.on(win, 'mousedown', this._onMouseDown, true), Utilities_1.on(win, 'keydown', this._onKeyDown, true));
            }
        };
        FabricBase.prototype.componentWillUnmount = function () {
            this._disposables.forEach(function (dispose) { return dispose(); });
        };
        return FabricBase;
    }(React.Component));
    exports.FabricBase = FabricBase;
});
//# sourceMappingURL=Fabric.base.js.map