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.86 kB
JavaScript
import*as e from"react";import{PrimeReactContext as n}from"primereact/api";import{ComponentBase as t,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,n){(null==n||n>e.length)&&(n=e.length);for(var t=0,r=Array(n);t<n;t++)r[t]=e[t];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,n){if(e){if("string"==typeof e)return c(e,n);var t={}.toString.call(e).slice(8,-1);return"Object"===t&&e.constructor&&(t=e.constructor.name),"Map"===t||"Set"===t?Array.from(e):"Arguments"===t||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t)?c(e,n):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,n){var t=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=t){var r,o,a,l,i=[],c=!0,m=!1;try{if(a=(t=t.call(e)).next,0===n){if(Object(t)!==t)return;c=!1}else for(;!(c=(r=a.call(t)).done)&&(i.push(r.value),i.length!==n);c=!0);}catch(e){m=!0,o=e}finally{try{if(!c&&null!=t.return&&(l=t.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,n){return d(e)||y(e,n)||u(e,n)||v()}var g=t.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(t,c){var m=o(),s=e.useContext(n),u=g.getProps(t,s),p=h(e.useState(""),2),d=p[0],y=p[1],v=h(e.useState([]),2),b=v[0],E=v[1],x=h(e.useState(0),2),w=x[0],S=x[1],N=h(e.useState(""),2),A=N[0],T=N[1],I=e.useRef(null),M=e.useRef(null),j=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 n=w-1<0?b.length-1:w-1,t=b[n];S(n),y(t.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),j.current=!0}}};e.useImperativeHandle(c,(function(){return{props:u,focus:function(){return l.focus(M.current)},getElement:function(){return I.current}}})),e.useEffect((function(){var e=function(e){if(b&&b.length>0){var n=f(b);n[n.length-1].response=e,E(n)}},n=function(){E([]),S(0)};return a.on("response",e),a.on("clear",n),function(){a.off("response",e),a.off("clear",n)}}),[b]),e.useEffect((function(){j.current&&(a.emit("command",A),j.current=!1),I.current.scrollTop=I.current.scrollHeight}));var _,D,H=function(n,t){var r=n.text,o=n.response,a=m({key:r+"_"+t},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 n=m(C("welcomeMessage"));return e.createElement("div",n,u.welcomeMessage)}return null}(),Y=function(){var n=b.map(H),t=m({className:O("content")},C("content"));return e.createElement("div",t,n)}(),$=(_=m({className:O("container")},C("container")),D=m({ref:M,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:I,className:i(u.className,O("root")),style:u.style,onClick:function(){l.focus(M.current)}},g.getOtherProps(u),C("root"));return e.createElement("div",q,K,Y,$)})));b.displayName="Terminal";export{b as Terminal};