Skip to content

Commit

Permalink
Update "@xterm/xterm": "^5.4.0"
Browse files Browse the repository at this point in the history
  • Loading branch information
BattlefieldDuck committed Mar 7, 2024
1 parent ad9665c commit 5404109
Show file tree
Hide file tree
Showing 8 changed files with 98 additions and 16 deletions.
2 changes: 1 addition & 1 deletion README.md
Original file line number Diff line number Diff line change
Expand Up @@ -86,7 +86,7 @@ To use `xterm-addon-fit` addon, you need to add the following to your HTML body

```html
<!-- Add xterm-addon-fit.min.js before XtermBlazor.min.js -->
<script src="https://cdn.jsdelivr.net/npm/xterm-addon-fit@0.7.0/lib/xterm-addon-fit.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/@xterm/addon-fit@0.9.0/lib/addon-fit.min.js"></script>

<script src="_content/XtermBlazor/XtermBlazor.min.js"></script>

Expand Down
12 changes: 12 additions & 0 deletions XtermBlazor/TerminalOptions.cs
Original file line number Diff line number Diff line change
Expand Up @@ -99,6 +99,18 @@ public class TerminalOptions
[JsonIgnore(Condition = JsonIgnoreCondition.WhenWritingNull)]
public bool? DisableStdin { get; set; }

#pragma warning disable CS1587 // XML comment is not placed on a valid language element
/// <summary>
/// A {@link Document} to use instead of the one that xterm.js was attached
/// to. The purpose of this is to improve support in multi-window
/// applications where HTML elements may be references across multiple
/// windows which can cause problems with `instanceof`.
/// </summary>
// [JsonPropertyName("documentOverride")]
// [JsonIgnore(Condition = JsonIgnoreCondition.WhenWritingNull)]
// public object? DocumentOverride { get; set; }
#pragma warning restore CS1587 // XML comment is not placed on a valid language element

/// <summary>
/// Whether to draw bold text in bright colors. The default is true.
/// </summary>
Expand Down
52 changes: 52 additions & 0 deletions XtermBlazor/Xterm.razor.cs
Original file line number Diff line number Diff line change
Expand Up @@ -155,6 +155,14 @@ public partial class Xterm : ComponentBase, IAsyncDisposable
/// </summary>
public Func<KeyboardEventArgs, bool> CustomKeyEventHandler { get; private set; } = (_) => true;

/// <summary>
/// The custom WheelEvent handler to attach.
/// This is a function that takes a WheelEvent,
/// allowing consumers to stop propagation and/or prevent the default action.
/// The function returns whether the event should be processed by xterm.js.
/// </summary>
public Func<WheelEventArgs, bool> CustomWheelEventHandler { get; private set; } = (_) => true;

/// <inheritdoc />
protected override async Task OnAfterRenderAsync(bool firstRender)
{
Expand Down Expand Up @@ -240,6 +248,34 @@ public void AttachCustomKeyEventHandler(Func<KeyboardEventArgs, bool> customKeyE
return JSRuntime.InvokeVoidAsync("eval", $"{NAMESPACE_PREFIX}._terminals.get('{Id}').customKeyEventHandler = {customKeyEventHandler}");
}

/// <summary>
/// Attaches a custom wheel event handler which is run before keys are
/// processed, giving consumers of xterm.js control over whether to proceed
/// or cancel terminal wheel events.
/// </summary>
/// <param name="customWheelEventHandler">The custom WheelEvent handler to attach.
/// This is a function that takes a WheelEvent, allowing consumers to stop
/// propagation and/or prevent the default action. The function returns
/// whether the event should be processed by xterm.js.</param>
public void AttachCustomWheelEventHandler(Func<WheelEventArgs, bool> customWheelEventHandler)
{
CustomWheelEventHandler = customWheelEventHandler;
}

/// <summary>
/// Sets a custom wheels event handler which is run before keys are
/// processed, giving consumers of xterm.js control over whether to proceed
/// or cancel terminal wheel events.
/// </summary>
/// <param name="customWheelEventHandler">The custom WheelEvent handler to attach.
/// This is a function that takes a WheelEvent, allowing consumers to stop
/// propagation and/or prevent the default action. The function returns
/// whether the event should be processed by xterm.js.</param>
public ValueTask SetCustomWheelEventHandler(string customWheelEventHandler = "function (event) { return true; }")
{
return JSRuntime.InvokeVoidAsync("eval", $"{NAMESPACE_PREFIX}._terminals.get('{Id}').customWheelEventHandler = {customWheelEventHandler}");
}

/// <summary>
/// Gets the terminal options.
/// </summary>
Expand Down Expand Up @@ -275,6 +311,22 @@ public ValueTask Focus()
return JSRuntime.InvokeVoidAsync($"{NAMESPACE_PREFIX}.focus", Id);
}

/// <summary>
/// Input data to application side. The data is treated the same way input
/// typed into the terminal would (ie. the onData event will fire).
/// </summary>
/// <param name="data">The data to forward to the application.</param>
/// <param name="wasUserInput">Whether the input is genuine user input. This is true
/// by default and triggers additionalbehavior like focus or selection
/// clearing. Set this to false if the data sent should not be treated like
/// user input would, for example passing an escape sequence to the
/// application.</param>
/// <returns></returns>
public ValueTask Input(string data, bool wasUserInput = true)
{
return JSRuntime.InvokeVoidAsync($"{NAMESPACE_PREFIX}.input", Id, data, wasUserInput);
}

/// <summary>
/// Resizes the terminal.
/// </summary>
Expand Down
17 changes: 15 additions & 2 deletions XtermBlazor/src/index.ts
Original file line number Diff line number Diff line change
@@ -1,12 +1,13 @@
import './node_modules/xterm/css/xterm.css';
import { ITerminalAddon, ITerminalOptions, Terminal } from 'xterm';
import './node_modules/@xterm/xterm/css/xterm.css';
import { ITerminalAddon, ITerminalOptions, Terminal } from '@xterm/xterm';

declare var DotNet: any;

interface ITerminalObject {
terminal: Terminal,
addons: Map<string, ITerminalAddon>,
customKeyEventHandler: (event: KeyboardEvent) => boolean
customWheelEventHandler: (event: WheelEvent) => boolean
}

class XtermBlazor {
Expand Down Expand Up @@ -46,6 +47,16 @@ class XtermBlazor {
return this.getTerminalById(id).customKeyEventHandler?.call(event) ?? true;
}
});
terminal.attachCustomWheelEventHandler((event: WheelEvent) => {
try {
// Synchronous for Blazor WebAssembly apps only.
return DotNet.invokeMethod(this._ASSEMBLY_NAME, 'AttachCustomWheelEventHandler', id, event);
} catch {
// Asynchronous for both Blazor Server and Blazor WebAssembly apps.
DotNet.invokeMethodAsync(this._ASSEMBLY_NAME, 'AttachCustomWheelEventHandler', id, event);
return this.getTerminalById(id).customWheelEventHandler?.call(event) ?? true;
}
});

// Load and set addons
const addons = new Map<string, ITerminalAddon>();
Expand All @@ -63,6 +74,7 @@ class XtermBlazor {
terminal: terminal,
addons: addons,
customKeyEventHandler: undefined,
customWheelEventHandler: undefined
});
}

Expand Down Expand Up @@ -105,6 +117,7 @@ class XtermBlazor {
setOptions = (id: string, options: ITerminalOptions) => this.getTerminalById(id).terminal.options = options;
blur = (id: string) => this.getTerminalById(id).terminal.blur();
focus = (id: string) => this.getTerminalById(id).terminal.focus();
input = (id: string, data: string, wasUserInput: boolean) => this.getTerminalById(id).terminal.input(data, wasUserInput);
resize = (id: string, columns: number, rows: number) => this.getTerminalById(id).terminal.resize(columns, rows);
hasSelection = (id: string) => this.getTerminalById(id).terminal.hasSelection();
getSelection = (id: string) => this.getTerminalById(id).terminal.getSelection();
Expand Down
18 changes: 9 additions & 9 deletions XtermBlazor/src/package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

4 changes: 2 additions & 2 deletions XtermBlazor/src/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -3,15 +3,15 @@
"version": "1.0.0",
"private": true,
"description": "Brings xterm.js to Blazor",
"main": "index.js",
"main": "index.ts",
"scripts": {
"build": "webpack --mode production",
"dev": "webpack --mode development"
},
"author": "BattlefieldDuck",
"license": "MIT",
"dependencies": {
"xterm": "5.3.0"
"@xterm/xterm": "^5.4.0"
},
"devDependencies": {
"css-loader": "^6.10.0",
Expand Down
1 change: 1 addition & 0 deletions XtermBlazor/src/tsconfig.json
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@
"compilerOptions": {
"module": "commonjs",
"target": "es2021",
"alwaysStrict": true,
"noImplicitAny": true,
"removeComments": true,
"preserveConstEnums": true,
Expand Down
8 changes: 6 additions & 2 deletions XtermBlazor/src/webpack.config.ts
Original file line number Diff line number Diff line change
Expand Up @@ -13,13 +13,13 @@ const common: Configuration = {
rules: [
{
test: /\.css$/,
use: [MiniCssExtractPlugin.loader, "css-loader"]
use: [MiniCssExtractPlugin.loader, 'css-loader']
},
{
test: /\.ts$/,
use: 'ts-loader',
exclude: /node_modules/,
},
}
],
},
plugins: [
Expand All @@ -32,6 +32,10 @@ const common: Configuration = {
new CssMinimizerPlugin(),
],
},
performance: {
maxAssetSize: 300000,
maxEntrypointSize: 300000,
}
};

export default (env: any, argv: { mode: string; }) => {
Expand Down

0 comments on commit 5404109

Please sign in to comment.