@system76/pop-vue
Version:
Vue components designed to look like Pop!_OS
3 lines (2 loc) • 10.3 kB
JavaScript
var e={name:"PopTerminalLine",props:{animate:{type:Boolean,default:!1},cursor:{type:Boolean,default:!1},directory:{type:String,default:"~"},hostname:{type:String,default:"pop-os"},prompt:{type:Boolean,default:!1},text:{type:String,default:""},speed:{type:Number,default:0},user:{type:String,default:"pop-os"}},data(){return{currentText:this.animate&&0!==this.speed?"":this.text,finished:0===this.speed,renderTimeout:null}},mounted(){this.animate&&0!==this.speed?this.draw():this.$emit("complete")},beforeDestroy(){clearTimeout(this.renderTimeout)},methods:{draw(){if(!this.finished){const e=this.text.charAt(this.currentText.length);""!==e?this.currentText+=e:this.finished=!0}this.finished?this.$emit("complete"):this.renderTimeout=setTimeout(this.draw.bind(this),this.timeoutDelay())},timeoutDelay(){return Math.round(Math.random()*this.speed/2)+this.speed}},render(e){const t=[this.currentText];return this.prompt&&(t.unshift("$ "),t.unshift(e("span",{class:this.$style.directory},`${this.directory}`)),t.unshift(":"),t.unshift(e("span",{class:this.$style.host},`${this.user}@${this.hostname}`))),this.cursor&&t.push(e("span",{class:this.$style.cursor},"")),e("div",{class:this.$style.line},t)}};function t(e,t,o,i,n,s,r,a,d,l){"boolean"!=typeof r&&(d=a,a=r,r=!1);const p="function"==typeof o?o.options:o;let c;if(e&&e.render&&(p.render=e.render,p.staticRenderFns=e.staticRenderFns,p._compiled=!0,n&&(p.functional=!0)),i&&(p._scopeId=i),s?(c=function(e){(e=e||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext)||"undefined"==typeof __VUE_SSR_CONTEXT__||(e=__VUE_SSR_CONTEXT__),t&&t.call(this,d(e)),e&&e._registeredComponents&&e._registeredComponents.add(s)},p._ssrRegister=c):t&&(c=r?function(e){t.call(this,l(e,this.$root.$options.shadowRoot))}:function(e){t.call(this,a(e))}),c)if(p.functional){const e=p.render;p.render=function(t,o){return c.call(o),e(t,o)}}else{const e=p.beforeCreate;p.beforeCreate=e?[].concat(e,c):[c]}return o}const o="undefined"!=typeof navigator&&/msie [6-9]\\b/.test(navigator.userAgent.toLowerCase());function i(e){return(e,t)=>function(e,t){const i=o?t.media||"default":e,r=s[i]||(s[i]={ids:new Set,styles:[]});if(!r.ids.has(e)){r.ids.add(e);let o=t.source;if(t.map&&(o+="\n/*# sourceURL="+t.map.sources[0]+" */",o+="\n/*# sourceMappingURL=data:application/json;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(t.map))))+" */"),r.element||(r.element=document.createElement("style"),r.element.type="text/css",t.media&&r.element.setAttribute("media",t.media),void 0===n&&(n=document.head||document.getElementsByTagName("head")[0]),n.appendChild(r.element)),"styleSheet"in r.element)r.styles.push(o),r.element.styleSheet.cssText=r.styles.filter(Boolean).join("\n");else{const e=r.ids.size-1,t=document.createTextNode(o),i=r.element.childNodes;i[e]&&r.element.removeChild(i[e]),i.length?r.element.insertBefore(t,i[e]):r.element.appendChild(t)}}}(e,t)}let n;const s={};const r=t({},(function(e){e&&(e("data-v-014b0b0a_0",{source:".pop-directory-3xlF{color:#48b9c7;font-weight:600}.pop-host-2Y3D{color:#73c48f;font-weight:600}.pop-cursor-1wxd{animation:pop-blink-2NiQ linear 1.4s infinite;background-color:#fff;display:inline-block;height:1em;vertical-align:middle;width:1ch}.pop-line-2xd-{word-wrap:break-word}@keyframes pop-blink-2NiQ{0%{opacity:0}49%{opacity:0}50%{opacity:1}100%{opacity:1}}",map:void 0,media:void 0}),Object.defineProperty(this,"$style",{value:{directory:"pop-directory-3xlF",host:"pop-host-2Y3D",cursor:"pop-cursor-1wxd",blink:"pop-blink-2NiQ",line:"pop-line-2xd-"}}))}),e,void 0,void 0,void 0,!1,i,void 0,void 0);function a(e){const t=function(e){const t={first:"$",delay:"",speed:"",text:"",last:"$"};if("$"===e.trim())return t;{const o=e.match(/^((\$|#)(\d*)\|?(\d*)(\$|#)?)?(.*?)(\$?)$/);if(null!=o){const[,,e,i,n,,s,r]=o;return Object.assign({},t,{first:e,delay:i,speed:n,text:s,last:r})}return t}}(e),o="$"!==e&&"$"===t.first,i="$"===t.last,n=function(e,t,o){return e.substring(t&&" "===e.charAt(0)?1:0).slice(0,o?-1:e.length)}(t.text,t.first,t.last);return{prompt:o,cursor:i,text:n,delay:Number(t.delay||0),speed:"$"===t.first&&""!==n?Number(t.speed||60):0}}function d(e,t){return{animate:e.animate,cursor:t.cursor,directory:e.directory,hostname:e.hostname,prompt:t.prompt,text:t.text,speed:t.speed,user:e.user}}const l=t({},(function(e){e&&(e("data-v-2d1a30be_0",{source:".pop-container-2onN{max-height:calc(100% - .6em);overflow-y:auto;padding:.3em}",map:void 0,media:void 0}),Object.defineProperty(this,"$style",{value:{container:"pop-container-2onN"}}))}),{name:"PopTerminalContent",props:{animate:{type:Boolean,default:!1},directory:{type:String,default:"~"},hostname:{type:String,default:"pop-os"},loop:{type:Boolean,default:!1},user:{type:String,default:"pop-os"}},data(){return{currentLine:0,finished:!this.animate}},computed:{firstLineDelay(){return null!=this.lineObjects[0]?this.lineObjects[0].delay:0},nextLineDelay(){return null!=this.lineObjects[this.currentLine]?this.lineObjects[this.currentLine].delay:0},hasAnimatedLines(){return this.lineObjects.some(e=>0!==e.delay||0!==e.speed)},lineObjects(){return this.linesOfText.map(a)},linesOfText(){if(null!=this.$slots.default[0]){const e=this.$slots.default[0].text.split("\n").filter(e=>/\S/.test(e)),t=(e[0].match(/^\s*/)[0]||"").length;return e.map(e=>e.substring(t))}return 0}},mounted(){this.animate?this.reset():this.currentLine=this.linesOfText.length},updated(){this.$el.scroll({top:this.$el.scrollHeight,behavior:"instant"})},methods:{draw(){this.currentLine<this.linesOfText.length&&!this.finished?this.renderTimeout=setTimeout(()=>{this.currentLine+=1},this.nextLineDelay):this.loop?this.renderTimeout=setTimeout(()=>{this.reset()},this.firstLineDelay):this.$emit("complete")},reset(){this.currentLine=0,this.finished=!1,this.draw()}},render(e){const t=this.lineObjects.slice(0,this.currentLine).map(t=>e(r,{on:{complete:this.draw},props:d(this,t)}));return e("div",{class:this.$style.container},t)}},void 0,void 0,void 0,!1,i,void 0,void 0);const p=t({render:function(){var e=this.$createElement;return(this._self._c||e)("div",{class:[this.$style.root]},[this._t("default")],2)},staticRenderFns:[]},(function(e){e&&(e("data-v-35655f7b_0",{source:".pop-root-1NmY{align-content:stretch;align-items:stretch;box-shadow:var(--pop-shadow-window);display:flex;flex-direction:column;flex-wrap:nowrap;justify-content:flex-start}",map:void 0,media:void 0}),Object.defineProperty(this,"$style",{value:{root:"pop-root-1NmY"}}))}),{name:"PopWindowContainer",inheritAttrs:!1},void 0,!1,void 0,!1,i,void 0,void 0);const c=t({render:function(){var e=this,t=e.$createElement,o=e._self._c||t;return o("div",{class:[e.$style.header]},[o("span",[e._v(e._s(e.title))]),e.closeButton?o("div",{class:[e.$style.close],on:{click:function(t){return e.$emit("close")}}},[o("svg",{attrs:{height:"16",width:"16",xmlns:"http://www.w3.org/2000/svg"}},[o("path",{attrs:{d:"M5 4.003a1 1 0 0 0-1 1 1 1 0 0 0 .293.707l2.293 2.293-2.293 2.293a1 1 0 0 0-.293.707 1 1 0 0 0 1 1 1 1 0 0 0 .707-.293L8 9.417l2.283 2.283a1 1 0 0 0 .717.303 1 1 0 0 0 1-1 1 1 0 0 0-.293-.707L9.414 8.003l2.283-2.283A1 1 0 0 0 12 5.003a1 1 0 0 0-1-1 1 1 0 0 0-.707.293L8 6.589 5.717 4.306a1 1 0 0 0-.01-.01A1 1 0 0 0 5 4.003z"}})])]):e._e()])},staticRenderFns:[]},(function(e){e&&(e("data-v-4013a4f5_0",{source:'.pop-header-10Vd{align-content:center;align-items:center;background-color:var(--pop-warm-grey-500);border-radius:var(--pop-corner-radius) var(--pop-corner-radius) 0 0;box-sizing:border-box;color:var(--pop-white);display:flex;font-family:"Fira Sans",system-ui,"-apple-system","Segoe UI",Roboto,Ubuntu,Cantarell,"Nato Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";font-size:.9rem;font-weight:700;height:22px;justify-content:space-between;min-height:2.4em;padding:.3em;text-align:center;user-select:none;width:100%}.pop-header-10Vd>span{flex:1 1 auto;grid-area:center;text-align:center}.pop-close-1BBd{align-content:center;align-items:center;border-radius:9999px;display:flex;height:1.5rem;justify-content:center;margin-right:.15ch;width:1.5rem}.pop-close-1BBd svg{fill:var(--pop-mid-grey)}.pop-close-1BBd:active,.pop-close-1BBd:hover{background-color:var(--pop-orange-700)}.pop-close-1BBd:active svg,.pop-close-1BBd:hover svg{fill:var(--pop-white)}',map:void 0,media:void 0}),Object.defineProperty(this,"$style",{value:{header:"pop-header-10Vd",close:"pop-close-1BBd"}}))}),{name:"PopWindowHeader",inheritAttrs:!1,props:{closeButton:{type:Boolean,default:!0},title:{type:String,default:""}}},void 0,!1,void 0,!1,i,void 0,void 0);const h=t({render:function(){var e=this.$createElement,t=this._self._c||e;return t("pop-window-container",this._b({},"pop-window-container",this.$attrs,!1),[t("pop-window-header",this._b({attrs:{title:this.title}},"pop-window-header",this.$attrs,!1)),t("div",{class:[this.$style.box]},[this._t("default")],2)],1)},staticRenderFns:[]},(function(e){e&&(e("data-v-07efa0f7_0",{source:'.pop-box-1HeX{background-color:#333;box-sizing:border-box;color:#f2f2f2;display:block;flex:0 1 auto;font-family:"Fira Mono","Ubuntu Mono","Ubuntu Monospace",Menlo,Consolas,"Roboto Mono","Noto Mono","Oxygen Mono","Liberation Mono",monospace;font-size:.9rem;height:100%;line-height:1.2;overflow:hidden;width:100%}',map:void 0,media:void 0}),Object.defineProperty(this,"$style",{value:{box:"pop-box-1HeX"}}))}),{name:"PopTerminal",components:{PopWindowContainer:p,PopWindowHeader:c},inheritAttrs:!1,props:{directory:{type:String,default:"~"},hostname:{type:String,default:"pop-os"},user:{type:String,default:"pop-os"}},computed:{title(){return`${this.user}@${this.hostname}: ${this.directory}`}}},void 0,!1,void 0,!1,i,void 0,void 0);var u=Object.freeze({__proto__:null,PopTerminalContent:l,PopTerminal:h,PopWindowContainer:p,PopWindowHeader:c});function m(e){Object.keys(u).forEach(t=>{e.component(t,u[t])})}var f=Object.freeze({__proto__:null,install:m,PopTerminalContent:l,PopTerminal:h,PopWindowContainer:p,PopWindowHeader:c});let y=null;"undefined"!=typeof window?y=window.Vue:"undefined"!=typeof global&&(y=global.Vue),y&&y.use(f);export{h as PopTerminal,l as PopTerminalContent,p as PopWindowContainer,c as PopWindowHeader,m as install};
//# sourceMappingURL=index.esm.js.map