Refactor SbDialog component to enhance OnCloseButtonClick behavior, ensuring it runs before the standard close flow while still invoking OpenChanged. Update JavaScript functions to prevent closing when already closed. Improve tests to validate new close behavior and synchronization.
Release NuGet Packages / pack-and-push (release) Successful in 5m1s

This commit is contained in:
2026-06-07 14:10:29 +03:30
parent cf13f4faae
commit b0015a5b60
5 changed files with 111 additions and 36 deletions
+11 -7
View File
@@ -16,7 +16,7 @@ A modal dialog component built on the native HTML `<dialog>` element with header
| CloseOnEscape | bool | true | Whether to close on Escape key |
| CloseOnBackdropClick | bool | true | Whether to close when clicking backdrop |
| ShowCloseButton | bool | true | Whether to show the close button |
| OnCloseButtonClick | EventCallback | - | Optional. When set, the header close (X) button invokes this instead of the default close (e.g. pass your modal's Hide so @bind-Open stays in sync) |
| OnCloseButtonClick | EventCallback | - | Optional hook invoked before the standard header close (X) flow. `OpenChanged(false)` still fires. |
| Class | string? | null | Additional CSS classes |
| Style | string? | null | Inline styles |
| AdditionalAttributes | Dictionary\<string, object\>? | null | Additional HTML attributes |
@@ -176,19 +176,23 @@ Override the Size preset with inline dimensions. Inline styles override the size
</SbDialog>
```
### Custom Close Button Handler (e.g. for @bind-Open in a wrapper modal)
### Custom Close Button Handler
When the dialog is used inside a modal that binds Open from a parent, the header X should call the same close logic as Cancel so the binding stays in sync:
Use `OnCloseButtonClick` for cleanup or confirmation-side effects that should run before the header X closes the dialog. The dialog still performs the standard close flow and fires `OpenChanged(false)` afterward:
```razor
<SbDialog @bind-Open="Open" OnCloseButtonClick="Hide" Title="Create Item">
<SbDialog @bind-Open="isOpen" OnCloseButtonClick="OnHeaderClose" Title="Create Item">
<ChildContent>...</ChildContent>
</SbDialog>
@code {
[Parameter] public bool Open { get; set; }
[Parameter] public EventCallback<bool> OpenChanged { get; set; }
private void Hide() => OpenChanged.InvokeAsync(false);
private bool isOpen;
private Task OnHeaderClose()
{
// Optional cleanup before the dialog closes.
return Task.CompletedTask;
}
}
```