lit-ui-router / UiSrefActiveDirective

Class: UiSrefActiveDirective

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

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:263
activeClasses	string[]	[]	classes applied while any target is active	packages/lit-ui-router/src/ui-sref-active.ts:234
ariaCurrentValue	| false | AriaCurrentValue | AriaCurrentValues | undefined	undefined	undefined = default (on for link elements)	packages/lit-ui-router/src/ui-sref-active.ts:238
entering	boolean | undefined	undefined	whether a running transition enters a target	packages/lit-ui-router/src/ui-sref-active.ts:267
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:265
exactClasses	string[]	[]	classes applied while any target is exactly active	packages/lit-ui-router/src/ui-sref-active.ts:236
exiting	boolean | undefined	undefined	whether a running transition exits a target	packages/lit-ui-router/src/ui-sref-active.ts:269
options	TransitionOptions	{}	the explicit target transition options	packages/lit-ui-router/src/ui-sref-active.ts:260
params	RawParams	{}	the explicit target state params	packages/lit-ui-router/src/ui-sref-active.ts:258
state	string | undefined	undefined	the explicit target state name, or undefined in container mode	packages/lit-ui-router/src/ui-sref-active.ts:256
targetStates	Set<TargetState>	...	every target this directive watches: the explicit one, or the enclosed links'	packages/lit-ui-router/src/ui-sref-active.ts:272