primereact
Version:
PrimeReact is an open source UI library for React featuring a rich set of 90+ components, a theme designer, various theme alternatives such as Material, Bootstrap, Tailwind, premium templates and professional support. In addition, it integrates with Prime
2 lines (1 loc) • 4.87 kB
JavaScript
import*as e from"react";import{PrimeReactContext as t}from"primereact/api";import{ComponentBase as n,useHandleStyle as r}from"primereact/componentbase";import{useMergeProps as o}from"primereact/hooks";import{TerminalService as a}from"primereact/terminalservice";import{DomHandler as l,classNames as i}from"primereact/utils";function c(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}function m(e){if(Array.isArray(e))return c(e)}function s(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}function u(e,t){if(e){if("string"==typeof e)return c(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?c(e,t):void 0}}function p(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function f(e){return m(e)||s(e)||u(e)||p()}function d(e){if(Array.isArray(e))return e}function y(e,t){var n=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=n){var r,o,a,l,i=[],c=!0,m=!1;try{if(a=(n=n.call(e)).next,0===t){if(Object(n)!==n)return;c=!1}else for(;!(c=(r=a.call(n)).done)&&(i.push(r.value),i.length!==t);c=!0);}catch(e){m=!0,o=e}finally{try{if(!c&&null!=n.return&&(l=n.return(),Object(l)!==l))return}finally{if(m)throw o}}return i}}function v(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function h(e,t){return d(e)||y(e,t)||u(e,t)||v()}var g=n.extend({defaultProps:{__TYPE:"Terminal",id:null,style:null,className:null,welcomeMessage:null,prompt:null,children:void 0},css:{classes:{root:"p-terminal p-component",content:"p-terminal-content",container:"p-terminal-prompt-container",command:"p-terminal-command",commandText:"p-terminal-input",prompt:"p-terminal-prompt",response:"p-terminal-response"},styles:"\n@layer primereact {\n .p-terminal {\n height: 18rem;\n overflow: auto;\n }\n \n .p-terminal-prompt-container {\n display: flex;\n align-items: center;\n }\n \n .p-terminal-input {\n flex: 1 1 auto;\n border: 0 none;\n background-color: transparent;\n color: inherit;\n padding: 0;\n outline: 0 none;\n }\n \n .p-terminal-input::-ms-clear {\n display: none;\n } \n}\n"}}),b=e.memo(e.forwardRef((function(n,c){var m=o(),s=e.useContext(t),u=g.getProps(n,s),p=h(e.useState(""),2),d=p[0],y=p[1],v=h(e.useState([]),2),b=v[0],E=v[1],w=h(e.useState(0),2),x=w[0],S=w[1],N=h(e.useState(""),2),A=N[0],T=N[1],j=e.useRef(null),I=e.useRef(null),M=e.useRef(!1),k=g.setMetaData({props:u,state:{commandText:d,commands:b}}),C=k.ptm,O=k.cx;r(g.css.styles,k.isUnstyled,{name:"terminal"});var P=m({className:O("prompt")},C("prompt")),R=function(e){y(e.target.value)},U=function(e){switch(e.code){case"ArrowUp":if(b&&b.length){var t=x-1<0?b.length-1:x-1,n=b[t];S(t),y(n.text)}break;case"Enter":case"NumpadEnter":if(d){var r=f(b);r.push({text:d}),S((function(e){return e+1})),y(""),E(r),T(d),M.current=!0}}};e.useImperativeHandle(c,(function(){return{props:u,focus:function(){return l.focus(I.current)},getElement:function(){return j.current}}})),e.useEffect((function(){var e=function(e){if(b&&b.length>0){var t=f(b);t[t.length-1].response=e,E(t)}},t=function(){E([]),S(0)};return a.on("response",e),a.on("clear",t),function(){a.off("response",e),a.off("clear",t)}}),[b]),e.useEffect((function(){M.current&&(a.emit("command",A),M.current=!1),j.current.scrollTop=j.current.scrollHeight}));var _,D,H=function(t,n){var r=t.text,o=t.response,a=m({key:r+"_"+n},C("commands")),l=m({className:O("command")},C("command")),i=m({className:O("response"),"aria-live":"polite"},C("response"));return e.createElement("div",a,e.createElement("span",P,u.prompt," "),e.createElement("span",l,r),e.createElement("div",i,o))},K=function(){if(u.welcomeMessage){var t=m(C("welcomeMessage"));return e.createElement("div",t,u.welcomeMessage)}return null}(),Y=function(){var t=b.map(H),n=m({className:O("content")},C("content"));return e.createElement("div",n,t)}(),$=(_=m({className:O("container")},C("container")),D=m({ref:I,value:d,type:"text",className:O("commandText"),autoComplete:"off",onChange:function(e){return R(e)},onKeyDown:U},C("commandText")),e.createElement("div",_,e.createElement("span",P,u.prompt," "),e.createElement("input",D))),q=m({id:u.id,ref:j,className:i(u.className,O("root")),style:u.style,onClick:function(){l.focus(I.current)}},g.getOtherProps(u),C("root"));return e.createElement("div",q,K,Y,$)})));b.displayName="Terminal";export{b as Terminal};