P11Modal Component

The P11Modal component provides a standard, accessible modal dialog window. It is designed to overlay the application content, making everything inactive except for itself (and any P11FloatingPanel instances). Built on Bootstrap classes, it ensures responsiveness and accessibility out-of-the-box.

Note: Proper use of AriaLabel or AriaLabelledby is crucial for screen reader users. The RestoreFocusId parameter allows controlling where focus returns after the modal closes, enhancing user experience for keyboard navigation.

Component API

Parameter	Type	Default	Description
`Visible`	`bool`	`false`	Controls the visibility of the modal. Bind with `@bind-Visible`.
`HeaderContent`	`RenderFragment`	-	Content to be rendered in the modal's header.
`BodyContent`	`RenderFragment`	-	Content to be rendered in the modal's body.
`FooterContent`	`RenderFragment`	-	Content to be rendered in the modal's footer.
`Size`	`Size`	`Size.Medium`	Specifies the size of the modal.
`Position`	`ModalPosition`	`ModalPosition.Default`	Specifies the position of the modal (e.g., Centered, Scrollable).
`ShowCloseButton`	`bool`	`true`	If `true`, a close button (X icon) is shown in the product header.
`RestoreFocusId`	`string`	`null`	Specifies the ID of the element that should receive focus after the modal closes. This is crucial for accessibility, especially when using nested modals or opening from specific buttons.
`PreventScroll`	`bool`	`true`	Prevents scrolling on the body when the modal is open. Set to `false` if you manage scroll prevention globally or want background scrolling.
`AriaLabel`	`string`	`null`	Provides an accessible name for the modal dialog. Use when no visible title is available. Either `AriaLabelledby` or `AriaLabel` should be provided for accessibility.
`AriaLabelledby`	`string`	`null`	Refers to the ID of a visible element (e.g., an `h1`) that provides an accessible name for the modal dialog. Either `AriaLabelledby` or `AriaLabel` should be provided for accessibility.
`ShowDevelopmentErrors`	`bool`	`false`	If `true`, logs warnings to the console for common development issues (e.g., missing accessibility attributes).
Events
`VisibleChanged`	`EventCallback<bool>`	-	Event callback for when the visibility changes.
`OnClose`	`EventCallback`	-	Event callback invoked when the modal is closed (via Escape key, backdrop click, or close button).