Place neu-block-ui inside a position:relative container, alongside the controls it blocks. blocked shows the overlay, spinner and optional message; variant selects default, light or dark. Controls outside that container remain available. For non-visual blocking, put [neuBlockUI] on the content container instead: the directive makes that subtree inert without adding an overlay.
Try [neuBlockUI] directly on the report content. It blocks interaction and sets aria-busy, but does not render a spinner or a message. The external toggle stays usable.
The application owns blocked and the operation that changes it. The component makes sibling controls inert while active and restores their prior state when released or destroyed. Keep the unblock action outside the blocked region. Neither the component nor the directive has Outputs or Templates.
Provide a useful status message; the overlay announces it politely. Blocking removes underlying controls from keyboard interaction, so keep a reachable way to cancel or finish the operation. Avoid blocking an entire page for a local task. The spinner respects reduced motion.
Key
Action
—
The blocking surface has no keyboard action of its own. Underlying controls are blocked; provide an accessible cancel/finish action outside the blocked content.
Inputs and Outputs match the installed package. Named types link to definitions. Every available Template has a Demo and Code example.
Inputs
Configure the component with [property]="value". Your application supplies these values; the component does not replace the state you pass in.
Name
Type
Default
Template binding
Description
blocked
boolean
false
[blocked]
Show the blocking overlay and make sibling controls inert.
message
string
''
[message]
Optional status text inside the overlay.
variant
"default" | "light" | "dark"
'default'
[variant]
Overlay appearance: default, light or dark.
Templates
ng-content projects content into the component. TemplateRef inputs receive a template; ng-template directives identify templates with a typed context. A directive shared by an entrypoint is not necessarily a slot of this component.
This component does not expose content projection or public customization templates.
