mirror of
https://github.com/primefaces/primevue.git
synced 2025-05-09 08:52:34 +00:00
Refactor #3965 - For Terminal
This commit is contained in:
parent
dbb6a2467f
commit
b64f42683d
3 changed files with 82 additions and 45 deletions
67
components/lib/terminal/BaseTerminal.vue
Normal file
67
components/lib/terminal/BaseTerminal.vue
Normal file
|
@ -0,0 +1,67 @@
|
|||
<script>
|
||||
import BaseComponent from 'primevue/basecomponent';
|
||||
import { useStyle } from 'primevue/usestyle';
|
||||
|
||||
const styles = `
|
||||
.p-terminal {
|
||||
height: 18rem;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.p-terminal-prompt-container {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.p-terminal-input {
|
||||
flex: 1 1 auto;
|
||||
border: 0 none;
|
||||
background-color: transparent;
|
||||
color: inherit;
|
||||
padding: 0;
|
||||
outline: 0 none;
|
||||
}
|
||||
|
||||
.p-terminal-input::-ms-clear {
|
||||
display: none;
|
||||
}
|
||||
`;
|
||||
|
||||
const classes = {
|
||||
root: 'p-terminal p-component',
|
||||
content: 'p-terminal-content',
|
||||
prompt: 'p-terminal-prompt',
|
||||
command: 'p-terminal-command',
|
||||
response: 'p-terminal-response',
|
||||
container: 'p-terminal-prompt-container',
|
||||
commandText: 'p-terminal-input'
|
||||
};
|
||||
|
||||
const { load: loadStyle } = useStyle(styles, { id: 'primevue_terminal_style', manual: true });
|
||||
|
||||
export default {
|
||||
name: 'BaseTerminal',
|
||||
extends: BaseComponent,
|
||||
props: {
|
||||
welcomeMessage: {
|
||||
type: String,
|
||||
default: null
|
||||
},
|
||||
prompt: {
|
||||
type: String,
|
||||
default: null
|
||||
}
|
||||
},
|
||||
css: {
|
||||
classes
|
||||
},
|
||||
watch: {
|
||||
isUnstyled: {
|
||||
immediate: true,
|
||||
handler(newValue) {
|
||||
!newValue && loadStyle();
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
Loading…
Add table
Add a link
Reference in a new issue