"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var tslib_1 = require("tslib");
var libs_1 = require("./libs");
var common_1 = require("../../common");
var config = require("../../config");
var themes = require("../../themes");
var DARK_BACKGROUND = themes.dark.colors['editor.background'];
var CodeEditor = (function (_super) {
    tslib_1.__extends(CodeEditor, _super);
    function CodeEditor() {
        var _this = _super !== null && _super.apply(this, arguments) || this;
        _this.state = { isMounted: false };
        _this.unmounted$ = new common_1.Subject();
        _this.elRef = function (ref) { return (_this.el = ref); };
        _this.handleBeforeMount = function (monacoModule) {
            var _a = _this.options, javascriptDefaults = _a.javascriptDefaults, typescriptDefaults = _a.typescriptDefaults;
            var typescript = monacoModule.languages.typescript;
            if (javascriptDefaults) {
                config.configureLanguage(javascriptDefaults, typescript.javascriptDefaults);
            }
            if (typescriptDefaults) {
                config.configureLanguage(typescriptDefaults, typescript.typescriptDefaults);
            }
        };
        _this.handleAfterMount = function (editor) {
            var _a = _this.options, tabSize = _a.tabSize, theme = _a.theme;
            _this.editor = editor;
            var focusOnLoad = _this.props.focusOnLoad === undefined ? true : _this.props.focusOnLoad;
            if (focusOnLoad) {
                _this.focus();
            }
            config.configureTheme(theme);
            config.configureTabSize(editor, tabSize);
        };
        _this.handleChange = function (code, e) {
            var onChange = _this.props.onChange;
            if (onChange) {
                onChange(tslib_1.__assign({ code: code }, e));
            }
        };
        return _this;
    }
    CodeEditor.prototype.componentDidMount = function () {
        var _this = this;
        this.setState({ isMounted: true });
        var resize$ = common_1.events.resize$.takeUntil(this.unmounted$);
        this.updateSize();
        resize$.subscribe(function (e) { return _this.updateSize(); });
    };
    CodeEditor.prototype.componentWillUnmount = function () {
        this.unmounted$.next();
    };
    CodeEditor.prototype.render = function () {
        var _a = this.props, _b = _a.code, code = _b === void 0 ? '' : _b, diff = _a.diff;
        var _c = this.state, isMounted = _c.isMounted, width = _c.width, height = _c.height;
        var _d = this.options, selectOnLineNumbers = _d.selectOnLineNumbers, fontSize = _d.fontSize, fontFamily = _d.fontFamily, readOnly = _d.readOnly, theme = _d.theme, language = _d.language;
        var styles = {
            base: common_1.css({
                backgroundColor: theme === 'DARK' ? DARK_BACKGROUND : undefined,
            }),
        };
        var options = {
            selectOnLineNumbers: selectOnLineNumbers,
            fontSize: fontSize,
            fontFamily: fontFamily,
            readOnly: readOnly,
            minimap: {
                enabled: false,
            },
        };
        var elEditor = isMounted &&
            !diff && (common_1.React.createElement(libs_1.MonacoEditor, { width: width, height: height, language: language, value: code, options: options, editorWillMount: this.handleBeforeMount, editorDidMount: this.handleAfterMount, onChange: this.handleChange }));
        var elDiffEditor = isMounted &&
            diff && (common_1.React.createElement(libs_1.MonacoDiffEditor, { width: width, height: height, language: language, options: tslib_1.__assign({}, options, { renderSideBySide: !diff.inline }), value: code, original: diff.code }));
        return (common_1.React.createElement("div", tslib_1.__assign({ ref: this.elRef }, common_1.css(STYLES.BASE, styles.base, this.props.style)),
            elEditor,
            elDiffEditor));
    };
    Object.defineProperty(CodeEditor.prototype, "isFocused", {
        get: function () {
            return this.editor && this.editor.isFocused();
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(CodeEditor.prototype, "width", {
        get: function () {
            return this.state.width || -1;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(CodeEditor.prototype, "height", {
        get: function () {
            return this.state.height || -1;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(CodeEditor.prototype, "size", {
        get: function () {
            var width = this.width;
            var height = this.height;
            return { width: width, height: height };
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(CodeEditor.prototype, "options", {
        get: function () {
            var options = this.props.options || {};
            var _a = options.selectOnLineNumbers, selectOnLineNumbers = _a === void 0 ? true : _a, _b = options.fontSize, fontSize = _b === void 0 ? 14 : _b, fontFamily = options.fontFamily, _c = options.readOnly, readOnly = _c === void 0 ? false : _c, _d = options.tabSize, tabSize = _d === void 0 ? 2 : _d, _e = options.theme, theme = _e === void 0 ? 'DARK' : _e, _f = options.language, language = _f === void 0 ? 'typescript' : _f, javascriptDefaults = options.javascriptDefaults, typescriptDefaults = options.typescriptDefaults;
            return {
                selectOnLineNumbers: selectOnLineNumbers,
                fontSize: fontSize,
                fontFamily: fontFamily,
                readOnly: readOnly,
                tabSize: tabSize,
                theme: theme,
                language: language,
                javascriptDefaults: javascriptDefaults,
                typescriptDefaults: typescriptDefaults,
            };
        },
        enumerable: true,
        configurable: true
    });
    CodeEditor.prototype.updateSize = function () {
        var width = this.el.offsetWidth;
        var height = this.el.offsetHeight;
        this.setState({ width: width, height: height });
    };
    CodeEditor.prototype.focus = function () {
        if (this.editor) {
            this.editor.focus();
        }
    };
    return CodeEditor;
}(common_1.React.PureComponent));
exports.CodeEditor = CodeEditor;
var STYLES = {
    BASE: common_1.css({
        flex: 1,
        position: 'relative',
        boxSizing: 'border-box',
    }),
};
//# sourceMappingURL=CodeEditor.js.map