UNPKG

@es-js/terminal

Version:

Componente de Terminal para navegadores web, diseñado para el Lenguaje de Programación EsJS. Basado en XTerminal.

639 lines (637 loc) 20.2 kB
var xt = Object.defineProperty; var Et = (s, e, t) => e in s ? xt(s, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : s[e] = t; var d = (s, e, t) => (Et(s, typeof e != "symbol" ? e + "" : e, t), t), W = (s, e, t) => { if (!e.has(s)) throw TypeError("Cannot " + t); }; var l = (s, e, t) => (W(s, e, "read from private field"), t ? t.call(s) : e.get(s)), v = (s, e, t) => { if (e.has(s)) throw TypeError("Cannot add the same private member more than once"); e instanceof WeakSet ? e.add(s) : e.set(s, t); }, k = (s, e, t, n) => (W(s, e, "write to private field"), n ? n.call(s, t) : e.set(s, t), t); var q = (s, e, t) => (W(s, e, "access private method"), t); function Tt(s) { return s && s.__esModule && Object.prototype.hasOwnProperty.call(s, "default") ? s.default : s; } /*! * is-number <https://github.com/jonschlinkert/is-number> * * Copyright (c) 2014-present, Jon Schlinkert. * Released under the MIT License. */ var Ct = function(s) { return typeof s == "number" ? s - s === 0 : typeof s == "string" && s.trim() !== "" ? Number.isFinite ? Number.isFinite(+s) : isFinite(+s) : !1; }; const Lt = /* @__PURE__ */ Tt(Ct); /** * XTerminal - v2.1.9 * @author Henry Hale * @license MIT * @url https://github.com/henryhale/xterminal */ var H; class ut { constructor() { v(this, H, void 0); d(this, "isDisposed"); this.isDisposed = !1, k(this, H, []); } register(e) { this.isDisposed ? e == null || e.dispose() : l(this, H).push(e); } dispose() { this.isDisposed || (this.isDisposed = !0, l(this, H).forEach((e) => e == null ? void 0 : e.dispose())); } } H = new WeakMap(); var m; class St extends ut { constructor() { super(); v(this, m, void 0); k(this, m, { stack: [], store: /* @__PURE__ */ new Map() }), this.register({ dispose: () => l(this, m).store.clear() }); } on(t, n) { var a; const o = l(this, m).store; o.has(t) ? (a = o.get(t)) == null || a.add(n) : o.set(t, /* @__PURE__ */ new Set([n])); } once(t, n) { var u; const o = (...c) => { n.call(void 0, ...c), this.off(t, o); }, a = l(this, m).store; a.has(t) ? (u = a.get(t)) == null || u.add(o) : a.set(t, /* @__PURE__ */ new Set([o])); } off(t, n) { const o = l(this, m).store.get(t); if (o) { for (const a of o) if (a === n) { o.delete(n); break; } } } emit(t, ...n) { if (this.isDisposed) return; const o = l(this, m).stack; if (o.includes(t)) return; const a = l(this, m).store.get(t); if (a) { o.push(t); for (const u of a) u.call(void 0, ...n); o.pop(); } } } m = new WeakMap(); const ht = Array.isArray; function ot(s) { return typeof s == "object" && s !== null; } function L(s) { return typeof s == "function"; } class Mt { constructor(e = []) { d(this, "store"); d(this, "ptr"); this.store = ht(e) ? e : [], this.ptr = -1; } get size() { return this.store.length; } get list() { return [].slice.call(this.store).reverse(); } add(e) { e && e !== this.store[0] && this.store.unshift(e), this.ptr = -1; } get previous() { return this.ptr++, this.ptr >= this.size && (this.ptr = this.size - 1), this.store[this.ptr] || ""; } get next() { return this.ptr--, this.ptr <= -1 && (this.ptr = -1), this.store[this.ptr] || ""; } clear() { this.store.splice(0); } } const M = "&nbsp;", jt = "xt", ct = "xt-inactive", At = "xt-cursor", Ht = "xt-stdout", Ot = "xt-stdin"; function at(s) { s && s.scrollTo(0, s.scrollHeight); } function x(s, e) { const t = document.createElement(s); return ot(e) && (e != null && e.id && (t.id = e.id || ""), e != null && e.class && (t.className = e.class || ""), e != null && e.content && t.appendChild(document.createTextNode("" + e.content)), e != null && e.html && (t.innerHTML = e.html), ht(e == null ? void 0 : e.children) && e.children.forEach((n) => t.append(n)), ot(e == null ? void 0 : e.props) && Object.entries(e.props).forEach((n) => t.setAttribute(n[0], n[1]))), t; } function Dt(s = "") { return ("" + s).replace(/(\n)|(\n\r)|(\r\n)/g, "<br/>").replace(/\s{2}/g, M.repeat(2)).replace(/\t/g, M.repeat(4)); } class Ft { constructor(e) { d(this, "el"); d(this, "console"); d(this, "lastOutput"); d(this, "onoutput"); const { outputBox: t, consoleBox: n } = function(o) { const a = x("span"), u = x("div", { class: Ht, children: [a] }); return o.appendChild(u), { outputBox: u, consoleBox: a }; }(e); this.el = t, this.console = n; } write(e, t) { this.lastOutput = x("span", { html: Dt(e) }), this.console.appendChild(this.lastOutput), L(this.onoutput) && this.onoutput(), L(t) && t(); } clear() { this.console && (this.console.innerHTML = ""); } clearLast() { var e; this.lastOutput && ((e = this.lastOutput.parentNode) == null || e.removeChild(this.lastOutput)), this.lastOutput = void 0; } } const pt = "Enter"; function E(s, e, t, n) { s.addEventListener(e, t, n); let o = !1; return { dispose() { o || (s.removeEventListener(e, t, n), o = !0); } }; } const Nt = 0; function dt(s, ...e) { return setTimeout(s, Nt, ...e); } function lt(s) { let e; return (...t) => { L(s) && (clearTimeout(e), e = dt(s, ...t)); }; } let I; function P(s) { const e = /* @__PURE__ */ new Set(); let t = !1; return { get value() { return !t && L(I) && e.add(I), s; }, set value(n) { s = n, t || e.forEach((o) => o.call(void 0)); }, dispose() { t || (t = !0, e.clear()); } }; } function Y(s) { if (L(s)) { I = s; try { s.call(void 0); } finally { I = null; } } } class zt extends ut { constructor(t) { super(); d(this, "el"); d(this, "buffer"); d(this, "data"); d(this, "ptr"); d(this, "isActive"); d(this, "showInput"); d(this, "isFocused"); d(this, "onkeypress"); this.el = function(u) { const c = x("input", { props: { spellcheck: !1, autocapitalize: "off", autocomplete: "off" } }), y = x("div", { class: Ot, children: [c] }); return u.appendChild(y), c; }(t), this.buffer = "", this.data = P(""), this.ptr = P(0), this.isActive = P(!0), this.showInput = P(!0), this.isFocused = P(!1), this.register(this.data), this.register(this.ptr), this.register(this.isActive), this.register(this.showInput), this.register(this.isFocused); const n = () => function(u, c, y) { let T = "selectionStart" in (V = u) ? V.selectionStart : 0; var V; const A = c.value.length; T > A ? T = A : T < 0 && (T = 0), y.value = T; }(this.el, this.data, this.ptr), o = lt(n), a = lt(() => { this.data.value = this.buffer = this.el.value; }); Y(n), this.register(E(this.el, "blur", () => this.isFocused.value = !1)), this.register(E(this.el, "focus", () => this.isFocused.value = !0, !1)), this.register(E(this.el, "keyup", () => this.isActive.value && o(), !1)), this.register(E(this.el, "input", () => { a(), o(); })), this.register(E(this.el, "keydown", (u) => { u.stopImmediatePropagation(); const c = this.data.value; u.key === pt && (this.el && (this.el.value = ""), this.data.value = "", this.buffer = "", this.showInput.value = !0), this.isActive.value && L(this.onkeypress) && (this.onkeypress({ key: u.key, altKey: u.altKey, ctrlKey: u.ctrlKey, metaKey: u.metaKey, shiftKey: u.shiftKey, value: c, cancel() { u.preventDefault(), u.stopPropagation(); } }), o()); })); } blur() { this.el && this.el.blur(); } focus() { this.el && this.el.focus(); } pause() { this.isActive.value = !1; } resume() { this.isActive.value = !0; } setValue(t) { t = t || this.buffer, this.el && (this.el.value = t), this.data.value = t; } pipe(t) { var u; const n = x("span"), o = x("span", { class: At, html: M }), a = x("span"); (u = t.el) == null || u.append(n, o, a), Y(() => { const c = this.ptr.value, y = this.data.value; if (!this.isActive.value || !this.showInput.value) return n.innerHTML = "", o.innerHTML = M, void (a.innerHTML = ""); n.innerHTML = y.substring(0, c).replace(/\s{2}/g, " " + M), o.innerHTML = y.substring(c, c + 1).trim() || M, a.innerHTML = y.substring(c + 1).replace(/\s{2}/g, " " + M); }); } } function Kt(s, e) { const t = x("div", { class: jt, props: { tabindex: 0 } }), n = new Mt(), o = new Ft(t), a = new zt(t), u = { input: a, output: o, history: n, completer: (c) => c }; return a.pipe(o), o.onoutput = () => at(t), s.register(E(t, "keydown", function(c) { a.focus(), dt(() => { a.el.dispatchEvent(new KeyboardEvent("keydown", c)), a.el.dispatchEvent(new KeyboardEvent("input", c)); }); })), s.register(E(t, "focus", () => a.isFocused.value = !0)), s.register(E(t, "blur", () => a.isFocused.value = !1)), function() { const c = window || {}, y = navigator || {}; return !(!("ontouchstart" in c) && !y.maxTouchPoints || !/Mobi/.test(y.userAgent)); }() && s.register(E(t, "click", a.focus.bind(a))), e.appendChild(t), a.onkeypress = (c) => { c.key == pt ? (c.cancel(), n.add(c.value), s.writeln(c.value), s.emit("data", c.value)) : c.key == "Tab" ? (c.cancel(), L(u.completer) && a.setValue(u.completer(c.value))) : c.key == "ArrowDown" ? (c.cancel(), a.setValue(n.next)) : c.key == "ArrowUp" ? (c.cancel(), a.setValue(n.previous)) : s.emit("keypress", c), at(t); }, Y(() => { a.isFocused.value ? t.classList.remove(ct) : t.classList.add(ct); }), u; } class Pt extends Error { constructor(e) { super(e = "[x] " + e), this.name = "XTerminalError"; } } var f; class $t extends St { constructor(t) { super(); v(this, f, void 0); d(this, "isMounted"); this.isMounted = !1, t && (t != null && t.target) && this.mount(t.target); } focus() { l(this, f).input.focus(); } blur() { l(this, f).input.blur(); } pause() { l(this, f).input.pause(), this.emit("pause"); } resume() { l(this, f).input.resume(), this.emit("resume"); } write(t, n) { l(this, f).output.write("" + t, n); } writeln(t, n) { l(this, f).output.write(t + ` `, n); } clear() { l(this, f).output.clear(), this.emit("clear"); } clearLast() { l(this, f).output.clearLast(); } get history() { return l(this, f).history.list || []; } set history(t) { t.forEach((n) => l(this, f).history.add(n)); } clearHistory() { l(this, f).history.clear(); } setCompleter(t) { L(t) && (l(this, f).completer = t); } mount(t) { if (!this.isMounted) { if (t && typeof t == "string" && (t = document.querySelector(t)), !(t instanceof HTMLElement)) throw new Pt("mount: A parent HTMLElement (target) is required"); !t.isConnected && console && console.warn("'mount' was called on an HTMLElement (target) that is not attached to DOM."), t.innerHTML = "", k(this, f, Kt(this, t)), this.isMounted = !0; } } dispose() { var o; super.dispose(); const t = l(this, f); t.history.clear(), t.completer = void 0, t.input.dispose(); const n = t.output.el.parentNode; (o = n == null ? void 0 : n.parentNode) == null || o.removeChild(n); } static get version() { return "2.1.9"; } } f = new WeakMap(); class Rt extends Error { constructor(e) { super(e || "Promise was canceled"), this.name = "CancelError"; } get isCanceled() { return !0; } } const b = Object.freeze({ pending: Symbol("pending"), canceled: Symbol("canceled"), resolved: Symbol("resolved"), rejected: Symbol("rejected") }); var O, D, w, j, F, N, _; const tt = class tt { constructor(e) { v(this, N); v(this, O, []); v(this, D, !0); v(this, w, b.pending); v(this, j, void 0); v(this, F, void 0); k(this, j, new Promise((t, n) => { k(this, F, n); const o = (c) => { (l(this, w) !== b.canceled || !u.shouldReject) && (t(c), q(this, N, _).call(this, b.resolved)); }, a = (c) => { (l(this, w) !== b.canceled || !u.shouldReject) && (n(c), q(this, N, _).call(this, b.rejected)); }, u = (c) => { if (l(this, w) !== b.pending) throw new Error(`The \`onCancel\` handler was attached after the promise ${l(this, w).description}.`); l(this, O).push(c); }; Object.defineProperties(u, { shouldReject: { get: () => l(this, D), set: (c) => { k(this, D, c); } } }), e(o, a, u); })); } static fn(e) { return (...t) => new tt((n, o, a) => { t.push(a), e(...t).then(n, o); }); } // eslint-disable-next-line unicorn/no-thenable then(e, t) { return l(this, j).then(e, t); } catch(e) { return l(this, j).catch(e); } finally(e) { return l(this, j).finally(e); } cancel(e) { if (l(this, w) === b.pending) { if (q(this, N, _).call(this, b.canceled), l(this, O).length > 0) try { for (const t of l(this, O)) t(); } catch (t) { l(this, F).call(this, t); return; } l(this, D) && l(this, F).call(this, new Rt(e)); } } get isCanceled() { return l(this, w) === b.canceled; } }; O = new WeakMap(), D = new WeakMap(), w = new WeakMap(), j = new WeakMap(), F = new WeakMap(), N = new WeakSet(), _ = function(e) { l(this, w) === b.pending && k(this, w, e); }; let U = tt; Object.setPrototypeOf(U.prototype, Promise.prototype); let i = null, g = null, X = !1, B = !1, $ = !1, Q = [], C = null; const S = "> "; let R = S; const Z = () => { function s(r, h = {}) { typeof r == "string" && (r = document.querySelector(r)), r && (C = r, i = new $t(), i.mount(C), i.pause(), i.on("data", async (p) => { if (X) if ($) i == null || i.emit("input:enter"); else if (B) { if ((g == null ? void 0 : g.trim()) === "") { i == null || i.writeln(R); return; } i == null || i.emit("input", g), i == null || i.writeln(""); } else p.trim() === "" ? i == null || i.writeln(R) : (i == null || i.emit("input", p), i == null || i.writeln(p)); }), i.on("keypress", (p) => { if ($) p.cancel(); else if (B) { const K = p.key.toLowerCase(); if (p.cancel(), K === "backspace" && (g != null && g.length)) g = g.substring(0, g.length - 1); else { const G = p.altKey || p.ctrlKey || p.metaKey; if (K.length !== 1 || G) return; g += p.key; } i == null || i.clearLast(), i == null || i.write(`${R}${"*".repeat((g == null ? void 0 : g.length) || 1)}`); } }), et(h.theme || "dark")); } function e() { Q.map((r) => r.cancel()), Q = [], i == null || i.dispose(); } function t(...r) { r.map((h) => { switch (typeof h) { case "object": return i == null ? void 0 : i.writeln(JSON.stringify(h, null, 2)); default: return i == null ? void 0 : i.writeln(String(h)); } }); } function n() { i == null || i.pause(), X = !1, B = !1, $ = !1, R = S, g = null; } async function o(r = S, h = "porDefecto") { i == null || i.resume(), R = r, X = !0; const p = new U( (K, G, rt) => { if (!i) return G(new Error("Terminal not initialized")); rt.shouldReject = !1, rt(() => { n(); }), i.write(r), $ ? i.once("input:enter", () => { n(), K(null); }) : i.once("input", (kt) => { n(), K(A(kt ?? "", h)); }); } ); return Q.push(p), p; } function a(r = S) { return o( r, "cadena" /* cadena */ ); } function u(r = S) { return o( r, "numero" /* numero */ ); } function c(r = S, h = "porDefecto") { return g = "", B = !0, o(r, h); } function y(r = S, h = "porDefecto") { return $ = !0, o(r, h); } function T() { i == null || i.clear(); } function V() { i == null || i.clearLast(); } function A(r, h) { switch (h) { case "cadena": return String(r.trim()); case "numero": return Number(r); default: return Lt(r) ? A( r, "numero" /* numero */ ) : A( r, "cadena" /* cadena */ ); } } function ft(r) { return `<div style="text-align: center;">${r}</div>`; } function gt(r) { return `<div style="text-align: left;">${r}</div>`; } function yt(r) { return `<div style="text-align: right;">${r}</div>`; } function vt(r) { return `<div style="text-align: justify;">${r}</div>`; } function wt(r, h, p = "_nuevo") { return p = p === "_nuevo" ? "_blank" : p, `<a href="${r}" target="${p}">${h || r}</a>`; } function et(r) { C == null || C.classList.toggle("dark", r === "dark"); } function bt() { i == null || i.focus(); } function st(...r) { r.map((h) => { switch (typeof h) { case "object": return i == null ? void 0 : i.write(JSON.stringify(h, null, 2)); default: return i == null ? void 0 : i.write(String(h)); } }); } function mt(r, h) { it(r), nt(h); } function it(r) { J("--xt-bg", r); } function nt(r) { J("--xt-fg", r); } function J(r, h) { C == null || C.style.setProperty(r, h); } return { escribir: t, log: t, imprimir: t, escribirSinSalto: st, imprimirSinSalto: st, leer: o, leerCadena: a, leerNumero: u, leerSecreto: c, leerEnter: y, iniciar: s, destruir: e, limpiar: T, clear: T, limpiarUltimaLinea: V, centrar: ft, alinearIzquierda: gt, alinearDerecha: yt, justificar: vt, enlace: wt, setTheme: et, enfocar: bt, configurarColores: mt, configurarColorFondo: it, configurarColorFrente: nt, establecerVariableCss: J }; }, Vt = `:root{--xt-bg:#191a22;--xt-fg:#efefef;--xt-font-family:monospace;--xt-font-size:min(15px,calc(2vw + 5px));--xt-padding:min(6px,calc(1.25vw + 4px))}.xt,.xt *,.xt :after,.xt :before{-webkit-box-sizing:border-box;box-sizing:border-box;font-family:var(--xt-font-family);font-size:var(--xt-font-size)}.xt{background-color:var(--xt-bg);color:var(--xt-fg);height:100%;max-height:100%;max-width:100%;overflow-wrap:break-word;overflow-x:hidden;overflow-y:auto;padding:var(--xt-padding);width:100%}.xt>.xt-stdout>span:first{word-wrap:break-word}.xt>.xt-stdout>.xt-cursor{background-color:var(--xt-fg);border:.25px solid transparent;color:var(--xt-bg)}.xt.xt-inactive>.xt-stdout>.xt-cursor{background-color:transparent;border-color:currentColor;color:var(--xt-fg)}.xt>.xt-stdin{height:0;margin-top:2px;position:relative}.xt>.xt-stdin>input{border:0;outline:0 none;position:absolute;top:-20px;z-index:-100}.xt .xt-hidden{display:none}:host{--xt-bg: #ffffff;--xt-fg: #000000}.dark{--xt-bg: #121212;--xt-fg: #efefef}@keyframes blink{0%{opacity:0}50%{opacity:1}to{opacity:0}}.xt-cursor{animation:blink 1s linear infinite}.cargando:after{animation:changeContent .8s linear infinite;content:"⠋"}@keyframes changeContent{10%{content:"⠙"}20%{content:"⠹"}30%{content:"⠸"}40%{content:"⠼"}50%{content:"⠴"}60%{content:"⠦"}70%{content:"⠧"}80%{content:"⠇"}90%{content:"⠏"}} `; var z; class qt extends HTMLElement { constructor() { super(); v(this, z, void 0); k(this, z, this.attachShadow({ mode: "open" })), l(this, z).innerHTML = ` <style> ${Vt} </style> <div style="width: 100%; height: 100%;"></div> `; } connectedCallback() { Z().iniciar( l(this, z).querySelector("div"), { theme: this.getAttribute("tema") === "oscuro" ? "dark" : "light" } ); } disconnectedCallback() { Z().destruir(); } } z = new WeakMap(); customElements.get("es-terminal") || customElements.define("es-terminal", qt); const _t = Z(); export { _t as Terminal, Z as usarTerminal };