@react-slate/core
Version:
Write interactive CLI apps with React
97 lines • 4.04 kB
JavaScript
;
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
const react_reconciler_1 = __importDefault(require("react-reconciler"));
const terminal_kit_1 = require("terminal-kit");
const reconcilerConfig_1 = __importDefault(require("./host/reconcilerConfig"));
const View_1 = __importDefault(require("./host/nodes/View"));
const Renderer_1 = __importDefault(require("./host/renderer/Renderer"));
const bufferedConsole_1 = require("./bufferedConsole");
const events_1 = require("./events");
function reflowAndDiff(container, renderer) {
container.setLayoutStyle({ width: '100%', height: '100%' });
const layout = container.layoutNode.computeLayout({
width: terminal_kit_1.terminal.width,
height: terminal_kit_1.terminal.height,
});
container.notifyOnLayoutHook(layout, { offsetX: 0, offsetY: 0 });
return renderer.renderDiff(container, layout);
}
function flushDiff(diff) {
for (let i = 0; i < diff.length; i++) {
terminal_kit_1.terminal.moveTo(1, diff[i].line + 1);
terminal_kit_1.terminal(diff[i].text);
}
}
const { bufferedConsole, flushConsole } = bufferedConsole_1.createBufferedConsole();
function exit(code = 0) {
terminal_kit_1.terminal.grabInput(false);
terminal_kit_1.terminal.hideCursor(false);
terminal_kit_1.terminal.fullscreen(false);
flushConsole(terminal_kit_1.terminal);
terminal_kit_1.terminal.processExit(code);
}
exports.exit = exit;
function initialize(container) {
process.on('exit', exit);
global.console = bufferedConsole;
terminal_kit_1.terminal.fullscreen(true);
terminal_kit_1.terminal.grabInput({ mouse: 'motion' });
terminal_kit_1.terminal.hideCursor();
terminal_kit_1.terminal.once('key', (name) => {
if (name === 'CTRL_C') {
// Trigger 'exit' event, which will do the clean up.
process.exit(0);
}
});
const eventManager = new events_1.EventManager();
terminal_kit_1.terminal.on('mouse', (name, data) => {
if (name === 'MOUSE_LEFT_BUTTON_PRESSED') {
eventManager.propagateEvent(events_1.EventTypes.MOUSE_LEFT_BUTTON_PRESSED, data, container.eventListener);
}
else if (name === 'MOUSE_WHEEL_UP' || name === 'MOUSE_WHEEL_DOWN') {
eventManager.propagateEvent(events_1.EventTypes.MOUSE_WHEEL, Object.assign(Object.assign({}, data), { direction: name === 'MOUSE_WHEEL_UP' ? 1 : -1 }), container.eventListener);
}
else if (name === 'MOUSE_MOTION') {
// TODO: uncomment once there's a need for motion detection
// eventManager.propagateEvent(
// EventTypes.MOUSE_MOTION,
// data,
// container.eventListener
// );
}
});
}
function render(element) {
const renderer = new Renderer_1.default();
const container = new View_1.default();
let initialized = false;
const reconciler = react_reconciler_1.default(reconcilerConfig_1.default(container, () => {
const diff = reflowAndDiff(container, renderer);
if (!initialized) {
initialized = true;
initialize(container);
}
flushDiff(diff);
}));
const node = reconciler.createContainer(container, false, false);
reconciler.updateContainer(element, node, null, () => undefined);
let timeout;
let unmounted = false;
terminal_kit_1.terminal.on('resize', () => {
if (!unmounted) {
unmounted = true;
reconciler.updateContainer(null, node, null, () => undefined);
}
timeout && clearTimeout(timeout);
timeout = setTimeout(() => {
timeout = undefined;
unmounted = false;
reconciler.updateContainer(element, node, null, () => undefined);
}, 1000);
});
}
exports.default = render;
//# sourceMappingURL=renderFullscreen.js.map