Skip to content

Commit 7ca17bc

Browse files
dvoituronvnbaaij
dvoituron
and
vnbaaij
authored
KeyCode: Add a new StopRepeat property (#2908)
Co-authored-by: Vincent Baaij <[email protected]>
1 parent 1e4a052 commit 7ca17bc

File tree

8 files changed

+57
-20
lines changed

8 files changed

+57
-20
lines changed

‎examples/Demo/Shared/Microsoft.FluentUI.AspNetCore.Components.xml‎

Lines changed: 12 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5196,6 +5196,11 @@
51965196
its default action should not be taken as it normally would be.
51975197
</summary>
51985198
</member>
5199+
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentKeyCode.StopRepeat">
5200+
<summary>
5201+
Gets or sets whether the key pressed can be repeated.
5202+
</summary>
5203+
</member>
51995204
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentKeyCode.AdditionalAttributes">
52005205
<summary>
52015206
Gets or sets a collection of additional attributes that will be applied to the created element.
@@ -5204,7 +5209,7 @@
52045209
<member name="M:Microsoft.FluentUI.AspNetCore.Components.FluentKeyCode.OnAfterRenderAsync(System.Boolean)">
52055210
<summary />
52065211
</member>
5207-
<member name="M:Microsoft.FluentUI.AspNetCore.Components.FluentKeyCode.OnKeyDownRaisedAsync(System.Int32,System.String,System.Boolean,System.Boolean,System.Boolean,System.Boolean,System.Int32,System.String)">
5212+
<member name="M:Microsoft.FluentUI.AspNetCore.Components.FluentKeyCode.OnKeyDownRaisedAsync(System.Int32,System.String,System.Boolean,System.Boolean,System.Boolean,System.Boolean,System.Int32,System.String,System.Boolean)">
52085213
<summary>
52095214
Internal method.
52105215
</summary>
@@ -5218,7 +5223,7 @@
52185223
<param name="targetId"></param>
52195224
<returns></returns>
52205225
</member>
5221-
<member name="M:Microsoft.FluentUI.AspNetCore.Components.FluentKeyCode.OnKeyUpRaisedAsync(System.Int32,System.String,System.Boolean,System.Boolean,System.Boolean,System.Boolean,System.Int32,System.String)">
5226+
<member name="M:Microsoft.FluentUI.AspNetCore.Components.FluentKeyCode.OnKeyUpRaisedAsync(System.Int32,System.String,System.Boolean,System.Boolean,System.Boolean,System.Boolean,System.Int32,System.String,System.Boolean)">
52225227
<summary>
52235228
Internal method.
52245229
</summary>
@@ -5284,6 +5289,11 @@
52845289
Gets the identifier of the targeted DOM element.
52855290
</summary>
52865291
</member>
5292+
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentKeyCodeEventArgs.Repeat">
5293+
<summary>
5294+
Gets a boolean value that is true if the given key is being held down such that it is automatically repeating.
5295+
</summary>
5296+
</member>
52875297
<member name="M:Microsoft.FluentUI.AspNetCore.Components.FluentKeyCodeEventArgs.ToString">
52885298
<summary>
52895299
Returns a string that represents the key pressed.

‎examples/Demo/Shared/Pages/KeyCode/Examples/KeyCodeExample.razor‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -46,6 +46,7 @@
4646
</li>
4747
<li><span>Location:</span> <code>@LastKeyCode?.Location.ToString()</code></li>
4848
<li><span>TargetId:</span> <code>@LastKeyCode?.TargetId</code></li>
49+
<li><span>Repeat:</span> <code>@LastKeyCode?.Repeat</code></li>
4950
</ul>
5051
</FluentStack>
5152

‎examples/Demo/Shared/Pages/KeyCode/Examples/KeyCodeGlobalExample.razor‎

Lines changed: 14 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,14 @@
11
@inject IKeyCodeService KeyCodeService
22
@implements IAsyncDisposable
33

4-
<FluentSwitch @bind-Value="@IncludeKeyUp"
5-
CheckedMessage="KeyDown and KeyUp"
6-
UncheckedMessage="KeyDown only"
7-
Style="margin-bottom: 10px;" />
4+
<FluentStack Style="margin-bottom: 10px;">
5+
<FluentSwitch @bind-Value="@IncludeKeyUp"
6+
CheckedMessage="KeyDown and KeyUp"
7+
UncheckedMessage="KeyDown only" />
8+
<FluentSwitch @bind-Value="@StopRepeat"
9+
CheckedMessage="Stop Repeat"
10+
UncheckedMessage="Allow Repeat" />
11+
</FluentStack>
812

913
<FluentCard>
1014
@if (!KeyPressed.Any())
@@ -21,6 +25,7 @@
2125
@code
2226
{
2327
private bool IncludeKeyUp = false;
28+
private bool StopRepeat = false;
2429
private List<(string Key, string Event)> KeyPressed = new();
2530

2631
protected override void OnInitialized()
@@ -36,6 +41,11 @@
3641
return Task.CompletedTask;
3742
}
3843

44+
if (StopRepeat && args.Repeat)
45+
{
46+
return Task.CompletedTask;
47+
}
48+
3949
KeyPressed.Add((args.ToString(), args.Name));
4050
StateHasChanged();
4151
return Task.CompletedTask;

‎src/Core/Components/KeyCode/FluentKeyCode.razor.cs‎

Lines changed: 11 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -103,6 +103,12 @@ public partial class FluentKeyCode : IAsyncDisposable
103103
[Parameter]
104104
public KeyCode[] PreventDefaultOnly { get; set; } = Array.Empty<KeyCode>();
105105

106+
/// <summary>
107+
/// Gets or sets whether the key pressed can be repeated.
108+
/// </summary>
109+
[Parameter]
110+
public bool StopRepeat { get; set; }
111+
106112
/// <summary>
107113
/// Gets or sets a collection of additional attributes that will be applied to the created element.
108114
/// </summary>
@@ -128,7 +134,7 @@ protected async override Task OnAfterRenderAsync(bool firstRender)
128134
OnKeyUp.HasDelegate ? "KeyUp" : string.Empty,
129135
});
130136

131-
_javaScriptEventId = await _jsModule.InvokeAsync<string>("RegisterKeyCode", GlobalDocument, eventNames.Length > 1 ? eventNames : "KeyDown", Anchor, ChildContent is null ? null : Element, Only, IgnoreModifier ? Ignore.Union(_Modifiers) : Ignore, StopPropagation, PreventDefault, PreventDefaultOnly, _dotNetHelper, PreventMultipleKeyDown);
137+
_javaScriptEventId = await _jsModule.InvokeAsync<string>("RegisterKeyCode", GlobalDocument, eventNames.Length > 1 ? eventNames : "KeyDown", Anchor, ChildContent is null ? null : Element, Only, IgnoreModifier ? Ignore.Union(_Modifiers) : Ignore, StopPropagation, PreventDefault, PreventDefaultOnly, _dotNetHelper, PreventMultipleKeyDown, StopRepeat);
132138
}
133139
}
134140

@@ -145,11 +151,11 @@ protected async override Task OnAfterRenderAsync(bool firstRender)
145151
/// <param name="targetId"></param>
146152
/// <returns></returns>
147153
[JSInvokable]
148-
public async Task OnKeyDownRaisedAsync(int keyCode, string value, bool ctrlKey, bool shiftKey, bool altKey, bool metaKey, int location, string targetId)
154+
public async Task OnKeyDownRaisedAsync(int keyCode, string value, bool ctrlKey, bool shiftKey, bool altKey, bool metaKey, int location, string targetId, bool repeat)
149155
{
150156
if (OnKeyDown.HasDelegate)
151157
{
152-
await OnKeyDown.InvokeAsync(FluentKeyCodeEventArgs.Instance("keydown", keyCode, value, ctrlKey, shiftKey, altKey, metaKey, location, targetId));
158+
await OnKeyDown.InvokeAsync(FluentKeyCodeEventArgs.Instance("keydown", keyCode, value, ctrlKey, shiftKey, altKey, metaKey, location, targetId, repeat));
153159
}
154160
}
155161

@@ -166,11 +172,11 @@ public async Task OnKeyDownRaisedAsync(int keyCode, string value, bool ctrlKey,
166172
/// <param name="targetId"></param>
167173
/// <returns></returns>
168174
[JSInvokable]
169-
public async Task OnKeyUpRaisedAsync(int keyCode, string value, bool ctrlKey, bool shiftKey, bool altKey, bool metaKey, int location, string targetId)
175+
public async Task OnKeyUpRaisedAsync(int keyCode, string value, bool ctrlKey, bool shiftKey, bool altKey, bool metaKey, int location, string targetId, bool repeat)
170176
{
171177
if (OnKeyUp.HasDelegate)
172178
{
173-
await OnKeyUp.InvokeAsync(FluentKeyCodeEventArgs.Instance("keyup", keyCode, value, ctrlKey, shiftKey, altKey, metaKey, location, targetId));
179+
await OnKeyUp.InvokeAsync(FluentKeyCodeEventArgs.Instance("keyup", keyCode, value, ctrlKey, shiftKey, altKey, metaKey, location, targetId, repeat));
174180
}
175181
}
176182

‎src/Core/Components/KeyCode/FluentKeyCode.razor.js‎

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
export function RegisterKeyCode(globalDocument, eventNames, id, elementRef, onlyCodes, excludeCodes, stopPropagation, preventDefault, preventDefaultOnly, dotNetHelper, preventMultipleKeydown) {
1+
export function RegisterKeyCode(globalDocument, eventNames, id, elementRef, onlyCodes, excludeCodes, stopPropagation, preventDefault, preventDefaultOnly, dotNetHelper, preventMultipleKeydown, stopRepeat) {
22
const element = globalDocument
33
? document
44
: elementRef == null ? document.getElementById(id) : elementRef;
@@ -27,6 +27,10 @@ export function RegisterKeyCode(globalDocument, eventNames, id, elementRef, only
2727
const handler = function (e, netMethod) {
2828
const keyCode = e.which || e.keyCode || e.charCode;
2929

30+
if (stopRepeat && e.repeat) {
31+
return;
32+
}
33+
3034
if (!!dotNetHelper && !!dotNetHelper.invokeMethodAsync) {
3135

3236
const targetId = e.currentTarget?.id ?? "";
@@ -52,7 +56,7 @@ export function RegisterKeyCode(globalDocument, eventNames, id, elementRef, only
5256
if (isStopPropagation) {
5357
e.stopPropagation();
5458
}
55-
dotNetHelper.invokeMethodAsync(netMethod, keyCode, e.key, e.ctrlKey, e.shiftKey, e.altKey, e.metaKey, e.location, targetId);
59+
dotNetHelper.invokeMethodAsync(netMethod, keyCode, e.key, e.ctrlKey, e.shiftKey, e.altKey, e.metaKey, e.location, targetId, e.repeat);
5660
return;
5761
}
5862
}

‎src/Core/Components/KeyCode/FluentKeyCodeEventArgs.cs‎

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ namespace Microsoft.FluentUI.AspNetCore.Components;
22

33
public class FluentKeyCodeEventArgs
44
{
5-
internal static FluentKeyCodeEventArgs Instance(string name, int keyCode, string value, bool ctrlKey, bool shiftKey, bool altKey, bool metaKey, int location, string targetId)
5+
internal static FluentKeyCodeEventArgs Instance(string name, int keyCode, string value, bool ctrlKey, bool shiftKey, bool altKey, bool metaKey, int location, string targetId, bool repeat)
66
{
77
return new FluentKeyCodeEventArgs
88
{
@@ -16,6 +16,7 @@ internal static FluentKeyCodeEventArgs Instance(string name, int keyCode, string
1616
AltKey = altKey,
1717
MetaKey = metaKey,
1818
TargetId = targetId,
19+
Repeat = repeat
1920
};
2021
}
2122

@@ -71,6 +72,11 @@ internal static FluentKeyCodeEventArgs Instance(string name, int keyCode, string
7172
/// </summary>
7273
public string TargetId { get; init; } = string.Empty;
7374

75+
/// <summary>
76+
/// Gets a boolean value that is true if the given key is being held down such that it is automatically repeating.
77+
/// </summary>
78+
public bool Repeat { get; init; } = false;
79+
7480
/// <summary>
7581
/// Returns a string that represents the key pressed.
7682
/// Example: "Ctrl + Shift + A"

‎tests/Core/KeyCodeProvider/FluentKeyCodeTests.razor‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@
1616
// Arrange && Act
1717
var cut = Render(@<div id="myZone"><FluentKeyCode Anchor="myZone" OnKeyDown="@(e => pressed = e)" /></div>);
1818

19-
await cut.FindComponent<FluentKeyCode>().Instance.OnKeyDownRaisedAsync(65, "A", false, false, false, false, 0, "myZone");
19+
await cut.FindComponent<FluentKeyCode>().Instance.OnKeyDownRaisedAsync(65, "A", false, false, false, false, 0, "myZone", false);
2020

2121
// Assert
2222
Assert.Equal(65, pressed.KeyCode);
@@ -37,7 +37,7 @@
3737
// Arrange && Act
3838
var cut = Render(@<div id="myZone"><FluentKeyCode Anchor="myZone" OnKeyUp="@(e => pressed = e)" /></div>);
3939

40-
await cut.FindComponent<FluentKeyCode>().Instance.OnKeyUpRaisedAsync(65, "A", false, false, false, false, 0, "myZone");
40+
await cut.FindComponent<FluentKeyCode>().Instance.OnKeyUpRaisedAsync(65, "A", false, false, false, false, 0, "myZone", false);
4141

4242
// Assert
4343
Assert.Equal(65, pressed.KeyCode);
@@ -51,7 +51,7 @@
5151
// Arrange && Act
5252
var cut = Render(@<FluentKeyCode OnKeyDown="@(e => pressed = e)">Hello World</FluentKeyCode>);
5353

54-
await cut.FindComponent<FluentKeyCode>().Instance.OnKeyDownRaisedAsync(65, "A", false, false, false, false, 0, "myZone");
54+
await cut.FindComponent<FluentKeyCode>().Instance.OnKeyDownRaisedAsync(65, "A", false, false, false, false, 0, "myZone", false);
5555

5656
// Assert
5757
Assert.Equal(65, pressed.KeyCode);
@@ -72,7 +72,7 @@
7272
// Arrange && Act
7373
var cut = Render(@<div id="myZone"><FluentKeyCode Anchor="myZone" OnKeyDown="@(e => pressed = e)" /></div>);
7474

75-
await cut.FindComponent<FluentKeyCode>().Instance.OnKeyDownRaisedAsync(65, "A", true, true, true, true, 0, "myZone");
75+
await cut.FindComponent<FluentKeyCode>().Instance.OnKeyDownRaisedAsync(65, "A", true, true, true, true, 0, "myZone", false);
7676

7777
// Assert
7878
Assert.Equal(65, pressed.KeyCode);
@@ -99,7 +99,7 @@
9999
// Arrange && Act
100100
var cut = Render(@<div id="myZone"><FluentKeyCode Anchor="myZone" OnKeyDown="@(e => pressed = e)" /></div>);
101101

102-
await cut.FindComponent<FluentKeyCode>().Instance.OnKeyDownRaisedAsync(65, "A", ctrlKey, shiftKey, altKey, metaKey, 0, "myZone");
102+
await cut.FindComponent<FluentKeyCode>().Instance.OnKeyDownRaisedAsync(65, "A", ctrlKey, shiftKey, altKey, metaKey, 0, "myZone", false);
103103

104104
// Assert
105105
Assert.Equal(expected, pressed.ToString());

‎tests/Core/List/FluentAutocompleteTests.razor‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -433,7 +433,7 @@
433433
await cut.InvokeAsync(async () => await cut.FindComponents<FluentKeyCode>()
434434
.ElementAt(popoverOpened ? 1 : 0)
435435
.Instance
436-
.OnKeyDownRaisedAsync((int)key, string.Empty, false, false, false, false, 0, string.Empty));
436+
.OnKeyDownRaisedAsync((int)key, string.Empty, false, false, false, false, 0, string.Empty, false));
437437
}
438438

439439
// Search customers

0 commit comments

Comments
 (0)