lit-ui-router / UiSrefActiveDirective

Class: UiSrefActiveDirective

Defined in: packages/lit-ui-router/src/ui-sref-active.ts:321

Directive class that adds CSS classes based on active state.

This directive is used internally by the uiSrefActive directive function. It watches the current router state and applies CSS classes to elements when their associated states are active.

The directive can operate in two modes:

1. Explicit state: Provide a state name to watch
2. Container mode: Automatically watch nested uiSref directives

See

• uiSrefActive for the public API
• AsyncDirective
• SrefStatus

Extends

• AsyncDirective

Properties

Property	Type	Default value	Description	Defined in
active	boolean | undefined	undefined	whether any target is active, or undefined before the first status	packages/lit-ui-router/src/ui-sref-active.ts:369
activeClasses	string[]	[]	classes applied while any target is active	packages/lit-ui-router/src/ui-sref-active.ts:340
ariaCurrentValue	| false | AriaCurrentValue | AriaCurrentValues | undefined	undefined	undefined = default (on for link elements)	packages/lit-ui-router/src/ui-sref-active.ts:344
entering	boolean | undefined	undefined	whether a running transition enters a target	packages/lit-ui-router/src/ui-sref-active.ts:373
exact	boolean | undefined	undefined	whether any target is exactly active, or undefined before the first status	packages/lit-ui-router/src/ui-sref-active.ts:371
exactClasses	string[]	[]	classes applied while any target is exactly active	packages/lit-ui-router/src/ui-sref-active.ts:342
exiting	boolean | undefined	undefined	whether a running transition exits a target	packages/lit-ui-router/src/ui-sref-active.ts:375
options	TransitionOptions	{}	the explicit target transition options	packages/lit-ui-router/src/ui-sref-active.ts:366
params	RawParams	{}	the explicit target state params	packages/lit-ui-router/src/ui-sref-active.ts:364
state	string | undefined	undefined	the explicit target state name, or undefined in container mode	packages/lit-ui-router/src/ui-sref-active.ts:362
targetStates	Set<TargetState>	undefined	every target this directive watches: the explicit one, or the enclosed links'	packages/lit-ui-router/src/ui-sref-active.ts:378