alm
Version:
The best IDE for TypeScript
173 lines (172 loc) • 8.63 kB
JavaScript
"use strict";
var __extends = (this && this.__extends) || (function () {
var extendStatics = Object.setPrototypeOf ||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
return function (d, b) {
extendStatics(d, b);
function __() { this.constructor = d; }
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
})();
Object.defineProperty(exports, "__esModule", { value: true });
var React = require("react");
var ReactDOM = require("react-dom");
var csx = require("../../base/csx");
var ui = require("../../ui");
var utils = require("../../../common/utils");
var styles = require("../../styles/styles");
var state = require("../../state/state");
var commands = require("../../commands/commands");
var Modal = require("react-modal");
var socketClient_1 = require("../../../socket/socketClient");
var styles_1 = require("../../styles/styles");
var codeEditor_1 = require("../editor/codeEditor");
var FindReferences = /** @class */ (function (_super) {
__extends(FindReferences, _super);
function FindReferences(props) {
var _this = _super.call(this, props) || this;
_this.onChangeSelected = function (event) {
var keyStates = ui.getKeyStates(event);
if (keyStates.up || keyStates.tabPrevious) {
event.preventDefault();
var selectedIndex = utils.rangeLimited({ num: _this.state.selectedIndex - 1, min: 0, max: _this.props.data.references.length - 1, loopAround: true });
_this.setState({ selectedIndex: selectedIndex });
}
if (keyStates.down || keyStates.tabNext) {
event.preventDefault();
var selectedIndex = utils.rangeLimited({ num: _this.state.selectedIndex + 1, min: 0, max: _this.props.data.references.length - 1, loopAround: true });
_this.setState({ selectedIndex: selectedIndex });
}
if (keyStates.enter) {
event.preventDefault();
_this.openIndex(_this.state.selectedIndex);
}
};
_this.openIndex = function (index) {
var def = _this.props.data.references[index];
commands.doOpenOrFocusFile.emit({
filePath: def.filePath,
position: def.position
});
setTimeout(function () { _this.props.unmount(); });
};
_this.selectAndRefocus = function (index) {
_this.setState({ selectedIndex: index });
_this.focus();
};
_this.focus = function () {
var input = ReactDOM.findDOMNode(_this.refs.mainInput);
input.focus();
};
_this.state = {
selectedIndex: 0,
};
return _this;
}
FindReferences.prototype.componentDidMount = function () {
var _this = this;
this.disposible.add(commands.esc.on(function () {
_this.props.unmount();
}));
setTimeout(function () {
_this.focus();
var input = ReactDOM.findDOMNode(_this.refs.mainInput);
var len = input.value.length;
input.setSelectionRange(0, len);
});
};
FindReferences.prototype.componentDidUpdate = function () {
var _this = this;
setTimeout(function () {
var selected = ReactDOM.findDOMNode(_this.refs.selectedTabTitle);
if (selected) {
selected.scrollIntoViewIfNeeded(false);
}
});
};
FindReferences.prototype.render = function () {
var _this = this;
var references = this.props.data.references;
var selectedPreview = this.props.data.references[this.state.selectedIndex];
var filePathsRendered = references.map(function (item, i) {
var selected = i == _this.state.selectedIndex;
var active = selected ? styles.tabHeaderActive : {};
var ref = selected && "selectedTabTitle";
return (React.createElement("div", { ref: ref, key: item.filePath + i, style: csx.extend(styles.tabHeader, active, { overflow: 'hidden' }), onClick: function () { return _this.selectAndRefocus(i); }, onDoubleClick: function () { return _this.openIndex(i); } },
React.createElement("div", { title: item.filePath, style: { overflow: 'hidden', textOverflow: 'ellipsis' } },
utils.getFileName(item.filePath),
" (line: ",
item.position.line + 1,
")")));
});
var previewRendered = React.createElement(codeEditor_1.CodeEditor, { key: selectedPreview.filePath, filePath: selectedPreview.filePath, readOnly: true, preview: selectedPreview.span });
return (React.createElement(Modal, { isOpen: true, onRequestClose: this.props.unmount },
React.createElement("div", { style: csx.extend(csx.vertical, csx.flex) },
React.createElement("div", { style: csx.extend(csx.horizontal, csx.content) },
React.createElement("h4", null, "References"),
React.createElement("div", { style: csx.flex }),
React.createElement("div", { style: { fontSize: '0.9rem', color: 'grey' } },
React.createElement("code", { style: styles_1.modal.keyStrokeStyle }, "Esc"),
" to exit ",
React.createElement("code", { style: styles_1.modal.keyStrokeStyle }, "Enter"),
" to select",
' ',
React.createElement("code", { style: styles_1.modal.keyStrokeStyle }, "Up / Down"),
" to see usages")),
React.createElement("input", { defaultValue: '', style: styles.hiddenInput, type: "text", ref: "mainInput", placeholder: "Filter", onKeyDown: this.onChangeSelected }),
React.createElement("div", { style: csx.extend(csx.horizontal, csx.flex, { overflow: 'hidden' }) },
React.createElement("div", { style: { width: '200px', overflow: 'auto' } }, filePathsRendered),
React.createElement("div", { style: csx.extend(csx.flex, csx.flexRoot, styles.modal.previewContainerStyle) }, previewRendered)))));
};
return FindReferences;
}(ui.BaseComponent));
exports.FindReferences = FindReferences;
var monacoUtils = require("../monacoUtils");
var CommonEditorRegistry = monaco.CommonEditorRegistry;
var EditorAction = monaco.EditorAction;
var KeyMod = monaco.KeyMod;
var KeyCode = monaco.KeyCode;
var EditorContextKeys = monaco.EditorContextKeys;
var FindReferencesAction = /** @class */ (function (_super) {
__extends(FindReferencesAction, _super);
function FindReferencesAction() {
return _super.call(this, {
id: 'editor.action.findReferencesAction',
label: 'TypeScript: Find references',
alias: 'TypeScript: Find references',
precondition: EditorContextKeys.Focus,
kbOpts: {
kbExpr: EditorContextKeys.TextFocus,
primary: KeyMod.CtrlCmd | KeyMod.Shift | KeyCode.KEY_B
}
}) || this;
}
FindReferencesAction.prototype.run = function (accessor, editor) {
var filePath = editor.filePath;
if (!state.inActiveProjectFilePath(filePath)) {
ui.notifyInfoNormalDisappear('The current file is no in the active project');
return;
}
var position = monacoUtils.getCurrentPosition(editor);
socketClient_1.server.getReferences({ filePath: filePath, position: position }).then(function (res) {
if (res.references.length == 0) {
ui.notifyInfoNormalDisappear('No references for item at cursor location');
}
else if (res.references.length == 1) {
// Go directly 🌹
var def = res.references[0];
commands.doOpenOrFocusFile.emit({
filePath: def.filePath,
position: def.position
});
}
else {
var _a = ui.getUnmountableNode(), node = _a.node, unmount = _a.unmount;
ReactDOM.render(React.createElement(FindReferences, { data: res, unmount: unmount }), node);
}
});
};
return FindReferencesAction;
}(EditorAction));
CommonEditorRegistry.registerEditorAction(new FindReferencesAction());