terminal-lite
Version:
A lightweight customizable terminal-like React component.
28 lines (27 loc) • 2.4 kB
JavaScript
"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
var react_1 = __importDefault(require("react"));
var Close_1 = __importDefault(require("@mui/icons-material/Close"));
var CropSquare_1 = __importDefault(require("@mui/icons-material/CropSquare"));
var HorizontalRule_1 = __importDefault(require("@mui/icons-material/HorizontalRule"));
var tailwind_merge_1 = require("tailwind-merge");
var Terminal = function (_a) {
var title = _a.title, children = _a.children, className = _a.className;
return (react_1.default.createElement("div", { className: (0, tailwind_merge_1.twMerge)("bg-[#151515] border-2 border-primary-border h-full", className) },
react_1.default.createElement("div", { id: "terminal-header", className: "h-9 bg-primary-border-dark flex items-center justify-between px-2 font-tech-mono font-bold text-[#efefef] text-[12px]" },
react_1.default.createElement("div", { id: "terminal-title", className: "flex-1" }, title),
react_1.default.createElement("div", { id: "terminal-action-btns-container", className: "flex gap-2" },
react_1.default.createElement("button", { id: "terminal-minimize-btn", className: "hover:cursor-pointer" },
react_1.default.createElement(HorizontalRule_1.default, { sx: { fontSize: 15 } })),
react_1.default.createElement("button", { id: "terminal-restore-btn" },
react_1.default.createElement(CropSquare_1.default, { sx: { fontSize: 15 }, className: "hover:cursor-pointer" })),
react_1.default.createElement("button", { id: "terminal-close-btn", className: "hover:cursor-pointer" },
react_1.default.createElement(Close_1.default, { sx: { fontSize: 15 } })))),
react_1.default.createElement("div", { id: "terminal-body", className: "text-[#ffffffc2] p-2 font-tech-mono overflow-y-auto h-[calc(100%-36px)] scrollbar scrollbar-thumb-[#727272] scrollbar-track-[#181818]" }, children ? (children) : (react_1.default.createElement(react_1.default.Fragment, null,
"> npm run dev",
react_1.default.createElement("span", { className: "animate-blink" }, "_"))))));
};
exports.default = Terminal;