From 0f463da3a41182940bf57beaf0f833f5f0904b67 Mon Sep 17 00:00:00 2001 From: Argo Zhang Date: Wed, 12 Feb 2025 09:04:27 +0800 Subject: [PATCH 1/9] =?UTF-8?q?feat:=20=E5=A2=9E=E5=8A=A0=20OnKeyUpAsync?= =?UTF-8?q?=20=E5=8F=82=E6=95=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../Components/Textarea/Textarea.razor | 5 +++- .../Components/Textarea/Textarea.razor.cs | 24 +++++++++++++++++++ 2 files changed, 28 insertions(+), 1 deletion(-) diff --git a/src/BootstrapBlazor/Components/Textarea/Textarea.razor b/src/BootstrapBlazor/Components/Textarea/Textarea.razor index b5cf9fa4dd8..4f12f7c30d6 100644 --- a/src/BootstrapBlazor/Components/Textarea/Textarea.razor +++ b/src/BootstrapBlazor/Components/Textarea/Textarea.razor @@ -6,4 +6,7 @@ { } - + diff --git a/src/BootstrapBlazor/Components/Textarea/Textarea.razor.cs b/src/BootstrapBlazor/Components/Textarea/Textarea.razor.cs index 4f192d7547b..d76daa24e92 100644 --- a/src/BootstrapBlazor/Components/Textarea/Textarea.razor.cs +++ b/src/BootstrapBlazor/Components/Textarea/Textarea.razor.cs @@ -3,6 +3,8 @@ // See the LICENSE file in the project root for more information. // Maintainer: Argo Zhang(argo@live.ca) Website: https://www.blazor.zone +using Microsoft.AspNetCore.Components.Web; + namespace BootstrapBlazor.Components; /// @@ -34,6 +36,12 @@ public partial class Textarea [Parameter] public bool IsAutoScroll { get; set; } + /// + /// 获得/设置 文本框按键回调委托方法 默认为 null + /// + [Parameter] + public Func? OnKeyUpAsync { get; set; } + /// /// 获得 客户端是否自动滚屏标识 /// @@ -53,4 +61,20 @@ protected override async Task OnAfterRenderAsync(bool firstRender) await InvokeVoidAsync("execute", Id, "update"); } } + + private async Task OnKeyUp(KeyboardEventArgs args) + { + if (args.Key == "Enter" && OnEnterAsync != null) + { + await OnEnterAsync(Value); + } + if (args.Key == "Escape" && OnEscAsync != null) + { + await OnEscAsync(Value); + } + if (OnKeyUpAsync != null) + { + await OnKeyUpAsync(args); + } + } } From 4223011691bc8087587bdbf4464b745ceee2763b Mon Sep 17 00:00:00 2001 From: Argo Zhang Date: Thu, 13 Feb 2025 13:44:16 +0800 Subject: [PATCH 2/9] =?UTF-8?q?refactor:=20=E7=B2=BE=E7=AE=80=E4=BB=A3?= =?UTF-8?q?=E7=A0=81?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../Components/AutoComplete/AutoComplete.razor.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/BootstrapBlazor/Components/AutoComplete/AutoComplete.razor.js b/src/BootstrapBlazor/Components/AutoComplete/AutoComplete.razor.js index 4feca07aaa3..c544d05f5ad 100644 --- a/src/BootstrapBlazor/Components/AutoComplete/AutoComplete.razor.js +++ b/src/BootstrapBlazor/Components/AutoComplete/AutoComplete.razor.js @@ -1,4 +1,4 @@ -import { debounce, getHeight } from "../../modules/utility.js" +import { debounce } from "../../modules/utility.js" import { handleKeyUp, select, selectAllByFocus, selectAllByEnter } from "../Input/BootstrapInput.razor.js" import Data from "../../modules/data.js" import EventHandler from "../../modules/event-handler.js" From 950a339b60aa1ed57738295e67ae96915ddbc396 Mon Sep 17 00:00:00 2001 From: Argo Zhang Date: Thu, 13 Feb 2025 13:44:37 +0800 Subject: [PATCH 3/9] =?UTF-8?q?refactor:=20=E9=87=8D=E6=9E=84=E4=BB=A3?= =?UTF-8?q?=E7=A0=81?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../Components/Textarea/Textarea.razor | 5 ++-- .../Components/Textarea/Textarea.razor.cs | 27 +++++++------------ .../Components/Textarea/Textarea.razor.js | 22 ++++++++++++--- 3 files changed, 31 insertions(+), 23 deletions(-) diff --git a/src/BootstrapBlazor/Components/Textarea/Textarea.razor b/src/BootstrapBlazor/Components/Textarea/Textarea.razor index 4f12f7c30d6..bc249f4bfe6 100644 --- a/src/BootstrapBlazor/Components/Textarea/Textarea.razor +++ b/src/BootstrapBlazor/Components/Textarea/Textarea.razor @@ -7,6 +7,5 @@ } + @bind-value="CurrentValueAsString" @bind-value:event="@EventString" @onblur="@OnBlur" + data-bb-shift-enter="@_shiftEnterString" data-bb-scroll="@AutoScrollString" @ref="FocusElement"> diff --git a/src/BootstrapBlazor/Components/Textarea/Textarea.razor.cs b/src/BootstrapBlazor/Components/Textarea/Textarea.razor.cs index d76daa24e92..716a3454642 100644 --- a/src/BootstrapBlazor/Components/Textarea/Textarea.razor.cs +++ b/src/BootstrapBlazor/Components/Textarea/Textarea.razor.cs @@ -38,15 +38,24 @@ public partial class Textarea /// /// 获得/设置 文本框按键回调委托方法 默认为 null + /// 返回真时阻止按键 /// [Parameter] - public Func? OnKeyUpAsync { get; set; } + public Func>? OnKeyDownAsync { get; set; } + + /// + /// 获得/设置 是否使用 Shift + Enter 代替原回车按键行为 默认为 false + /// + [Parameter] + public bool UseShiftEnter { get; set; } /// /// 获得 客户端是否自动滚屏标识 /// private string? AutoScrollString => IsAutoScroll ? "auto" : null; + private string? _shiftEnterString => UseShiftEnter ? "true" : null; + /// /// /// @@ -61,20 +70,4 @@ protected override async Task OnAfterRenderAsync(bool firstRender) await InvokeVoidAsync("execute", Id, "update"); } } - - private async Task OnKeyUp(KeyboardEventArgs args) - { - if (args.Key == "Enter" && OnEnterAsync != null) - { - await OnEnterAsync(Value); - } - if (args.Key == "Escape" && OnEscAsync != null) - { - await OnEscAsync(Value); - } - if (OnKeyUpAsync != null) - { - await OnKeyUpAsync(args); - } - } } diff --git a/src/BootstrapBlazor/Components/Textarea/Textarea.razor.js b/src/BootstrapBlazor/Components/Textarea/Textarea.razor.js index 3bd366567ee..89a77189a34 100644 --- a/src/BootstrapBlazor/Components/Textarea/Textarea.razor.js +++ b/src/BootstrapBlazor/Components/Textarea/Textarea.razor.js @@ -1,13 +1,24 @@ import { select, handleKeyUp, selectAllByFocus, selectAllByEnter } from "../Input/BootstrapInput.razor.js" import Data from "../../modules/data.js" +import EventHandler from "../../modules/event-handler.js" export function init(id) { + var el = document.getElementById(id); const text = { prevMethod: '', - element: document.getElementById(id) + element: el } - Data.set(id, text) + Data.set(id, text); + EventHandler.on(el, 'keydown', e => { + if (e.key === "Enter" || e.key === "NumpadEnter") { + const useShiftEnter = el.getAttribute('data-bb-shift-enter') === 'true'; + const shiftKey = e.shiftKey; + if (!shiftKey || !useShiftEnter) { + e.preventDefault(); + } + } + }); } export function execute(id, method, position) { @@ -36,7 +47,12 @@ export function execute(id, method, position) { } export function dispose(id) { - Data.remove(id) + const text = Data.get(id); + Data.remove(id); + + if (text) { + EventHandler.off(text.element); + } } export { select, handleKeyUp, selectAllByFocus, selectAllByEnter } From ee0129e690a96fd3de0005246432d072baab7c37 Mon Sep 17 00:00:00 2001 From: Argo Zhang Date: Thu, 13 Feb 2025 13:44:50 +0800 Subject: [PATCH 4/9] =?UTF-8?q?doc:=20=E6=9B=B4=E6=96=B0=E7=A4=BA=E4=BE=8B?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../Components/Samples/TextAreas.razor | 44 ++++++++++--------- .../Components/Samples/TextAreas.razor.cs | 23 ++++++++++ 2 files changed, 47 insertions(+), 20 deletions(-) diff --git a/src/BootstrapBlazor.Server/Components/Samples/TextAreas.razor b/src/BootstrapBlazor.Server/Components/Samples/TextAreas.razor index bf5163b3a2d..0aa48920899 100644 --- a/src/BootstrapBlazor.Server/Components/Samples/TextAreas.razor +++ b/src/BootstrapBlazor.Server/Components/Samples/TextAreas.razor @@ -9,59 +9,63 @@ - - + +
@Text
- +
+
+ +
diff --git a/src/BootstrapBlazor.Server/Components/Samples/TextAreas.razor.cs b/src/BootstrapBlazor.Server/Components/Samples/TextAreas.razor.cs index 66838488959..b43559ad88a 100644 --- a/src/BootstrapBlazor.Server/Components/Samples/TextAreas.razor.cs +++ b/src/BootstrapBlazor.Server/Components/Samples/TextAreas.razor.cs @@ -3,6 +3,8 @@ // See the LICENSE file in the project root for more information. // Maintainer: Argo Zhang(argo@live.ca) Website: https://www.blazor.zone +using Microsoft.AspNetCore.Components.Web; + namespace BootstrapBlazor.Server.Components.Samples; /// @@ -15,6 +17,8 @@ public partial class TextAreas private string? Text { get; set; } + private string? KeyText { get; set; } + private string? ChatText { get; set; } private int ScrollValue { get; set; } @@ -88,6 +92,25 @@ private void MockChat() } } + [NotNull] + private ConsoleLogger? Logger { get; set; } + + private Task OnKeyDownAsync(KeyboardEventArgs args) + { + var ret = true; + if (args.ShiftKey && args.Key == "Enter") + { + Text += $"{Environment.NewLine}"; + Logger.Log("Press Shift + Enter"); + StateHasChanged(); + } + else if (args.Key == "Enter") + { + Logger.Log("Press Enter: call some method."); + } + return Task.FromResult(ret); + } + /// /// Dispose /// From 31604f45291a45feb62614f3c66792651640b43b Mon Sep 17 00:00:00 2001 From: Argo Zhang Date: Thu, 13 Feb 2025 13:55:06 +0800 Subject: [PATCH 5/9] =?UTF-8?q?refactor:=20=E7=A7=BB=E9=99=A4=E4=B8=8D?= =?UTF-8?q?=E9=9C=80=E8=A6=81=E7=9A=84=20OnKeyDownAsync=20=E5=9B=9E?= =?UTF-8?q?=E8=B0=83?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../Components/Textarea/Textarea.razor.cs | 9 --------- 1 file changed, 9 deletions(-) diff --git a/src/BootstrapBlazor/Components/Textarea/Textarea.razor.cs b/src/BootstrapBlazor/Components/Textarea/Textarea.razor.cs index 716a3454642..1b3220154e1 100644 --- a/src/BootstrapBlazor/Components/Textarea/Textarea.razor.cs +++ b/src/BootstrapBlazor/Components/Textarea/Textarea.razor.cs @@ -3,8 +3,6 @@ // See the LICENSE file in the project root for more information. // Maintainer: Argo Zhang(argo@live.ca) Website: https://www.blazor.zone -using Microsoft.AspNetCore.Components.Web; - namespace BootstrapBlazor.Components; /// @@ -36,13 +34,6 @@ public partial class Textarea [Parameter] public bool IsAutoScroll { get; set; } - /// - /// 获得/设置 文本框按键回调委托方法 默认为 null - /// 返回真时阻止按键 - /// - [Parameter] - public Func>? OnKeyDownAsync { get; set; } - /// /// 获得/设置 是否使用 Shift + Enter 代替原回车按键行为 默认为 false /// From 6864130ec42534303858f5bb08045c6f1567b903 Mon Sep 17 00:00:00 2001 From: Argo Zhang Date: Thu, 13 Feb 2025 13:55:16 +0800 Subject: [PATCH 6/9] =?UTF-8?q?doc:=20=E6=9B=B4=E6=96=B0=E7=A4=BA=E4=BE=8B?= =?UTF-8?q?=E6=96=87=E6=A1=A3?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../Components/Samples/TextAreas.razor | 11 ++++------- .../Components/Samples/TextAreas.razor.cs | 19 ------------------- src/BootstrapBlazor.Server/Locales/en-US.json | 5 ++++- src/BootstrapBlazor.Server/Locales/zh-CN.json | 5 ++++- 4 files changed, 12 insertions(+), 28 deletions(-) diff --git a/src/BootstrapBlazor.Server/Components/Samples/TextAreas.razor b/src/BootstrapBlazor.Server/Components/Samples/TextAreas.razor index 0aa48920899..8ffc65a3aa5 100644 --- a/src/BootstrapBlazor.Server/Components/Samples/TextAreas.razor +++ b/src/BootstrapBlazor.Server/Components/Samples/TextAreas.razor @@ -57,15 +57,12 @@ - + -
- -
diff --git a/src/BootstrapBlazor.Server/Components/Samples/TextAreas.razor.cs b/src/BootstrapBlazor.Server/Components/Samples/TextAreas.razor.cs index b43559ad88a..a48e3636658 100644 --- a/src/BootstrapBlazor.Server/Components/Samples/TextAreas.razor.cs +++ b/src/BootstrapBlazor.Server/Components/Samples/TextAreas.razor.cs @@ -92,25 +92,6 @@ private void MockChat() } } - [NotNull] - private ConsoleLogger? Logger { get; set; } - - private Task OnKeyDownAsync(KeyboardEventArgs args) - { - var ret = true; - if (args.ShiftKey && args.Key == "Enter") - { - Text += $"{Environment.NewLine}"; - Logger.Log("Press Shift + Enter"); - StateHasChanged(); - } - else if (args.Key == "Enter") - { - Logger.Log("Press Enter: call some method."); - } - return Task.FromResult(ret); - } - /// /// Dispose /// diff --git a/src/BootstrapBlazor.Server/Locales/en-US.json b/src/BootstrapBlazor.Server/Locales/en-US.json index 39c19942614..8e6781d0395 100644 --- a/src/BootstrapBlazor.Server/Locales/en-US.json +++ b/src/BootstrapBlazor.Server/Locales/en-US.json @@ -3280,7 +3280,10 @@ "TextAreaScrollToBottom": "Scroll to bottom", "TextAreaScrollToTop": "Scroll to top", "TextAreaScrollTo": "Scroll +20", - "TextAreaAutoScroll": "Automatic scrolling" + "TextAreaAutoScroll": "Automatic scrolling", + "TextAreaUseShiftEnterTitle": "Shift Enter", + "TextAreaUseShiftEnterIntro": "By setting UseShiftEnter=\"true\" you can start using Shift + Enter for line breaks, which is suitable for dialog applications.", + "TextAreaUseShiftEnterPlaceHolder": "Please enter some text, Enter sends Shift + Enter line break" }, "BootstrapBlazor.Server.Components.Samples.Toggles": { "TogglesOnText": "On", diff --git a/src/BootstrapBlazor.Server/Locales/zh-CN.json b/src/BootstrapBlazor.Server/Locales/zh-CN.json index c0011c53a9a..91f16179a55 100644 --- a/src/BootstrapBlazor.Server/Locales/zh-CN.json +++ b/src/BootstrapBlazor.Server/Locales/zh-CN.json @@ -3280,7 +3280,10 @@ "TextAreaScrollToBottom": "滚动到底部", "TextAreaScrollToTop": "滚动到顶部", "TextAreaScrollTo": "滚动+20", - "TextAreaAutoScroll": "自动滚屏" + "TextAreaAutoScroll": "自动滚屏", + "TextAreaUseShiftEnterTitle": "Shift Enter", + "TextAreaUseShiftEnterIntro": "通过设置 UseShiftEnter=\"true\" 开始使用 Shift + Enter 进行换行操作,适用于对话框类应用", + "TextAreaUseShiftEnterPlaceHolder": "请输入一些文字,Enter 发送 Shift + Enter 换行" }, "BootstrapBlazor.Server.Components.Samples.Toggles": { "TogglesOnText": "开启", From 499f6860b679828f6192b82521c7f3e000c052d1 Mon Sep 17 00:00:00 2001 From: Argo Zhang Date: Thu, 13 Feb 2025 13:58:36 +0800 Subject: [PATCH 7/9] =?UTF-8?q?doc:=20=E5=A2=9E=E5=8A=A0=E5=8F=82=E6=95=B0?= =?UTF-8?q?=E8=AF=B4=E6=98=8E=E6=96=87=E6=A1=A3?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../Components/Samples/TextAreas.razor.cs | 10 +++++++++- src/BootstrapBlazor.Server/Locales/en-US.json | 3 ++- src/BootstrapBlazor.Server/Locales/zh-CN.json | 3 ++- 3 files changed, 13 insertions(+), 3 deletions(-) diff --git a/src/BootstrapBlazor.Server/Components/Samples/TextAreas.razor.cs b/src/BootstrapBlazor.Server/Components/Samples/TextAreas.razor.cs index a48e3636658..df342f8acd4 100644 --- a/src/BootstrapBlazor.Server/Components/Samples/TextAreas.razor.cs +++ b/src/BootstrapBlazor.Server/Components/Samples/TextAreas.razor.cs @@ -167,11 +167,19 @@ private AttributeItem[] GetAttributes() => }, new() { - Name = nameof(BootstrapBlazor.Components.Textarea.IsAutoScroll), + Name = nameof(Textarea.IsAutoScroll), Description = Localizer["TextAreaAutoScroll"], Type = "bool", ValueList = "true|false", DefaultValue = "false" + }, + new() + { + Name = nameof(Textarea.UseShiftEnter), + Description = Localizer["TextAreaUseShiftEnter"], + Type = "bool", + ValueList = "true|false", + DefaultValue = "false" } ]; } diff --git a/src/BootstrapBlazor.Server/Locales/en-US.json b/src/BootstrapBlazor.Server/Locales/en-US.json index 8e6781d0395..8075f8cc43c 100644 --- a/src/BootstrapBlazor.Server/Locales/en-US.json +++ b/src/BootstrapBlazor.Server/Locales/en-US.json @@ -3283,7 +3283,8 @@ "TextAreaAutoScroll": "Automatic scrolling", "TextAreaUseShiftEnterTitle": "Shift Enter", "TextAreaUseShiftEnterIntro": "By setting UseShiftEnter=\"true\" you can start using Shift + Enter for line breaks, which is suitable for dialog applications.", - "TextAreaUseShiftEnterPlaceHolder": "Please enter some text, Enter sends Shift + Enter line break" + "TextAreaUseShiftEnterPlaceHolder": "Please enter some text, Enter sends Shift + Enter line break", + "TextAreaUseShiftEnter": "Whether to use Shift + Enter instead of the original Enter key behavior" }, "BootstrapBlazor.Server.Components.Samples.Toggles": { "TogglesOnText": "On", diff --git a/src/BootstrapBlazor.Server/Locales/zh-CN.json b/src/BootstrapBlazor.Server/Locales/zh-CN.json index 91f16179a55..a77f39725c0 100644 --- a/src/BootstrapBlazor.Server/Locales/zh-CN.json +++ b/src/BootstrapBlazor.Server/Locales/zh-CN.json @@ -3283,7 +3283,8 @@ "TextAreaAutoScroll": "自动滚屏", "TextAreaUseShiftEnterTitle": "Shift Enter", "TextAreaUseShiftEnterIntro": "通过设置 UseShiftEnter=\"true\" 开始使用 Shift + Enter 进行换行操作,适用于对话框类应用", - "TextAreaUseShiftEnterPlaceHolder": "请输入一些文字,Enter 发送 Shift + Enter 换行" + "TextAreaUseShiftEnterPlaceHolder": "请输入一些文字,Enter 发送 Shift + Enter 换行", + "TextAreaUseShiftEnter": "是否使用 Shift + Enter 代替原回车按键行为" }, "BootstrapBlazor.Server.Components.Samples.Toggles": { "TogglesOnText": "开启", From f18988b203ea92e85673c34bca799ff8eee717c2 Mon Sep 17 00:00:00 2001 From: Argo Zhang Date: Thu, 13 Feb 2025 13:59:22 +0800 Subject: [PATCH 8/9] =?UTF-8?q?doc:=20=E7=B2=BE=E7=AE=80=E4=BB=A3=E7=A0=81?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../Components/Samples/TextAreas.razor.cs | 2 -- 1 file changed, 2 deletions(-) diff --git a/src/BootstrapBlazor.Server/Components/Samples/TextAreas.razor.cs b/src/BootstrapBlazor.Server/Components/Samples/TextAreas.razor.cs index df342f8acd4..553c6b82550 100644 --- a/src/BootstrapBlazor.Server/Components/Samples/TextAreas.razor.cs +++ b/src/BootstrapBlazor.Server/Components/Samples/TextAreas.razor.cs @@ -3,8 +3,6 @@ // See the LICENSE file in the project root for more information. // Maintainer: Argo Zhang(argo@live.ca) Website: https://www.blazor.zone -using Microsoft.AspNetCore.Components.Web; - namespace BootstrapBlazor.Server.Components.Samples; /// From 4088fe1254e24de9cbd01b282e6fad0b0ad1a64c Mon Sep 17 00:00:00 2001 From: Argo Zhang Date: Thu, 13 Feb 2025 14:02:18 +0800 Subject: [PATCH 9/9] =?UTF-8?q?test:=20=E6=9B=B4=E6=96=B0=E5=8D=95?= =?UTF-8?q?=E5=85=83=E6=B5=8B=E8=AF=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- test/UnitTest/Components/TextareaTest.cs | 16 ++++++++++++++++ 1 file changed, 16 insertions(+) diff --git a/test/UnitTest/Components/TextareaTest.cs b/test/UnitTest/Components/TextareaTest.cs index 63a60b918df..be55c59c167 100644 --- a/test/UnitTest/Components/TextareaTest.cs +++ b/test/UnitTest/Components/TextareaTest.cs @@ -76,4 +76,20 @@ public async Task OnBlurAsync_Ok() await cut.InvokeAsync(() => { input.Blur(); }); Assert.True(blur); } + + [Fact] + public void UseShiftEnter_Ok() + { + var cut = Context.RenderComponent