Skip to content

tooltip: Allow custom aria-describedby target for tooltip #681

@OmerGronich

Description

@OmerGronich

Which scope/s are relevant/related to the feature request?

tooltip

Information

Currently, BrnTooltipTriggerDirective always applies the aria-describedby attribute to the trigger element itself:

this._ariaDescriber.describe(this._elementRef.nativeElement, ariaDescribedBy, 'tooltip');

This behavior assumes the trigger is also the element being described. However, in many real-world scenarios like this one:

Image

the tooltip describes a separate form control (e.g. an <input>), while the trigger may be an adjacent icon or button.

It would be helpful if Spartan allowed specifying a custom element for the aria-describedby association, rather than hardcoding it to the trigger.

Suggested Solution

Introduce a new describedByTarget input that defaults to this._elementRef.nativeElement, allowing consumers to override the element that receives the aria-describedby attribute.

The input could follow the pattern already used in Spartan:

public readonly _describedByTarget = input<HTMLElement | null>(null);
public readonly describedByTarget = computed(() => signal(this._describedByTarget() ?? this._elementRef.nativeElement));

This would allow host directives to override it as needed without breaking default behavior.

Describe any alternatives/workarounds you're currently using

The current workaround is to manually pass null to ariaDescribedBy and then handle aria-describedby wiring yourself, but this requires duplicating a lot of internal logic handled by Spartan (like tooltip visibility state, cleanup, etc.).

I would be willing to submit a PR to fix this issue

  • Yes
  • No

Metadata

Metadata

Assignees

Labels

enhancementNew feature or request

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions