angularjs directive - How to find an attribute's (which is binded in HTML code) source library in angular?

Question

Basically I have below code snippet in Angular in one of component's HTML code:

<span 
[attr.data-tooltip]="skuDetails.name" ?
[autoClose]="true" 
data-tooltip-position="top" ?
ngbTooltip="{{skuDetails.name}}">{{skuDetails.value}}
</span>

I am not able to find which angular library uses this directive/attribute data-tooltip or data-tooltip-position or ngbTooltip.

There are just lots of libraries with similar names and just difficult to figure out from which angular library or dependency this attribute is coming from. Is there any way to find this and just install this library to make this code work in another angular project.

question from:https://stackoverflow.com/questions/66058642/how-to-find-an-attributes-which-is-binded-in-html-code-source-library-in-angu

Answer 1

This is html5 specification: https://html.spec.whatwg.org/multipage/dom.html#embedding-custom-non-visible-data-with-the-data-*-attributes.

<style type="text/css">
    [data-tooltip]::after {
        content: attr(data-tooltip);
    }
    [data-tooltip]::after {
        opacity: 0;
    }
    [data-tooltip]::after {
      transition: 2s;
    }       
    [data-tooltip]::after {
      pointer-events: none;
    }
    [data-tooltip]:hover::after {
      opacity: 0.8;
    }
</style>

<p data-tooltip="message">Test</p>