64-bit | |
macOS (.app) | 3.0.2 |
Windows (.exe) | 3.0.2 |
Debian (.deb) | 3.0.2 |
Fedora (.rpm) | 3.0.2 |
Other Linux distros (.AppImage) | 3.0.2 |
hyper
in the keywords
field in package.json
..hyper.js
and add it to plugins
Hyper
will show a notification when your modules are installed to .hyper_plugins
..hyper.js
and add your desired change to keymaps
.'window:devtools': 'Cmd+Alt+O'
macOS | ~/Library/Application Support/Hyper/.hyper.js |
Windows | $Env:AppData/Hyper/.hyper.js |
Linux | ~/.config/Hyper/.hyper.js |
~/.hyper.js
still supported, but will be ignored, if config in application directory present. Otherwise it will be moved to the application directory at first run.config
object seen above in.hyper.js
admits the followingProperty | Default | Description |
updateChannel | 'stable' | The update channel to receive updates from |
fontSize | 12 | The default size in pixels for the terminal |
fontFamily | 'Menlo, DejaVu Sans Mono, Lucida Console, monospace' | The font family to use with optional fallbacks |
uiFontFamily | '-apple-system, BlinkMacSystemFont, Segoe UI, Roboto, ..' | The font family to use for the UI with optional fallbacks |
fontWeight | 'normal' | The default font weight: 'normal' or 'bold' |
fontWeightBold | 'bold' | The font weight for bold characters: 'normal' or 'bold' |
cursorColor | 'rgba(248,28,229,0.8)' | The color of the caret in the terminal |
cursorAccentColor | '#000' | The text color under BLOCK cursor |
cursorShape | 'BLOCK' | The shape of the caret in the terminal. Available options are: 'BEAM', 'UNDERLINE', 'BLOCK' |
cursorBlink | 'false' | If true, cursor will blink |
foregroundColor | '#fff' | The color of the main text of the terminal |
backgroundColor | '#000' | The color and opacity of the window and main terminal background |
selectionColor | 'rgba(248,28,229,0.3)' | The background color/opacity of the text selection in terminal |
borderColor | '#333' | The color of the main window border and tab bar |
css | ' | Custom CSS to include in the main window |
padding | '12px 14px' | CSS padding values for the space around each term |
colors | { black: '#000000', red: '#ff0000', .. } | A list of overrides for the color palette. The names of the keys represent the 'ANSI 16', which can all be seenin the default config. |
shell | ' | A path to a custom shell to run when Hyper starts a new session |
shellArgs | '['--login']' | An array of shell arguments |
env | {} | An object of environment variables to set before launching shell |
windowSize | [540, 380] | The default width/height in pixels of a new window |
scrollback | 1000 | The number of rows to be persisted in terminal buffer for scrolling |
copyOnSelect | false | If true, selected text will automatically be copied to the clipboard |
quickEdit | false | If true, on right click selected text will be copied or pasted if no selection is present (true by default on Windows) |
defaultSSHApp | true | If true, Hyper will be set as the default protocol client for SSH |
modifierKeys | {altIsMeta: false} | Change the behaviour of modifier keys to act as meta key |
showHamburgerMenu | true on Linux/Windows, false on macOS | Change the visibility of the hamburger menu. Available options are: true, false |
showWindowControls | ' | Change the position/visibility of the window controls. Available options are: true, false, 'left' |
React
components andRedux
actions.Hyper
is that of its underlying open source libraries..hyper_plugins/local
and then specify it under the localPlugins
array in.hyper.js
. We load new plugins:plugins
or localPlugins
)npm prune
and npm install
in.hyper_plugins
.require.cache
in both electron and the renderer processon*
methods on the existing instances and re-rendering components with the fresh decorations in place.macOS | ~/Library/Application Support/Hyper/.hyper_plugins |
Windows | $Env:AppData/Hyper/.hyper_plugins |
Linux | ~/.config/Hyper/.hyper_plugins |
~/.hyper_plugins
still supported, but will be ignored, if plugins in application directory present. Otherwise they will be moved to the application directory at first run.onLoad
). On the browser, it's up to the user to trigger their load by pressing command+R. We put the user in control of the loading in this way to prevent them from losing critical work by extensions that reset state or don't preserve it correctly.Hyper
UI.decorate*
methods receive the following references in an object passed as the second parameter:React | The entire React namespace. |
notify | A helper function that shows a desktop notification. The first parameter is the title, the second is the optional body of the notification, and the third is another optional parameter which can be used to log details to the development console. To pass these details, simply provide and object with an error property containing the information to log. |
Notification | The Notification component in case you want to re-use it. |
customChildren | An array of Element or a singleElement to insert at the bottom of the component. |
customChildrenBefore | The same as the above property, but inserted as the first child element(s) of the component. |
onDecorated
property to the decorated component to get a reference to its instance.onCursorMove
handler property that be called when cursor has moved with an object parameter representing its relative position to Term origin:x | Horizontal position in pixels |
y | Vertical position in pixels |
width | Cursor width in pixels |
height | Cursor height in pixels |
col | Horizontal position in columns |
row | Vertical position in rows |
onDecorated
propertyeffect
key in the action and later handled by our middleware.Command+=
:Hyper
achieves a lot of its speed and functionality thanks to the power ofxterm.jsapp
objects are extended with the following properties:config | An Object with the config block from.hyper.js . |
plugins | An Object with helpers for plugins. |
getWindows | A Function that returns an Set of all the open windows. |
createWindow | A Function that will create a new window. Accepts an optional callback that will be passed as the new window's init callback. |
BrowserWindow
objects are extended with the following parameters:rpc | An EventEmitter that allows for communication with the window process. |
sessions | A Map of Session objects which hold the communication with each term's pty. |
rpc | An EventEmitter that allows for communication with the window process. |
store | The Redux Store object. This allows access todispatch actions or read the global state withgetState . |
rpc
object is symmetrical between browser and renderer process. The API is the same as Node.js, with the exception that it only admits a single object as its parameters only:decorateConfig
is needed:View -> Toggle Developer Tools
. When you do so, notice that some classes are automatically generated and followed by a random nonce (e.g.: term_13hv8io
). Ignore those: they change with every new window!SESSION_ADD_DATA
. You can find the full list of actionsin the repository.uiReducer
and later map:<Term>
component so that we can access the underlying caret.<Term>
is not a container that we can map props to. So we use getTermProps
to pass the property further down:<Term>
. Notice we pass the onDecorated
property to access the base Term component and its DOM ref, and theonCursorMove
property to use Hyper cursor API: