TSA/chapter-organizer
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Refactor InteractiveChip component to improve touch event handling

Browse Source 
This commit updates the InteractiveChip component by refining touch event handling for better user interaction on touch devices. The `HandleClick` method has been replaced with `HandleTouchStart`, which now toggles the `_isTouched` state and prevents event propagation. This change enhances the responsiveness of the component, ensuring a smoother experience for users on mobile devices while maintaining existing hover functionality for desktop users.
This commit is contained in:
James Kolpack
2026-01-19 12:09:57 -05:00
parent 7679a458e0
commit 9ed9c93540
1 changed files with 6 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files
WebApp/Components/Shared/Components/InteractiveChip.razor
+5 -8
View File
@@ -6,9 +6,8 @@
Class="@WrapperClass" Class="@WrapperClass"
@onmouseenter="@(() => _isHovered = true)" @onmouseenter="@(() => _isHovered = true)"
@onmouseleave="@(() => _isHovered = false)" @onmouseleave="@(() => _isHovered = false)"
@ontouchstart="@(() => _isTouched = true)" @ontouchstart="@HandleTouchStart"
@ontouchend="@(() => { /* Prevent mouse events on touch */ })" @ontouchend="@((e) => { e.PreventDefault(); })">
@onclick="@HandleClick">
<MudChip T="string" <MudChip T="string"
Size="@Size" Size="@Size"
Color="@Color" Color="@Color"
@@ -69,12 +68,10 @@
private bool _isHovered = false; private bool _isHovered = false;
private bool _isTouched = false; private bool _isTouched = false;
private void HandleClick(MouseEventArgs e) private void HandleTouchStart(TouchEventArgs e)
{
// On touch devices, toggle controls on tap (for devices with both touch and mouse)
if (_isTouched)
{ {
_isTouched = !_isTouched; _isTouched = !_isTouched;
} e.StopPropagation();
StateHasChanged();
} }
} }