Popover
A popover is a small overlay of content that is used to display additional information or options when a user interacts with an element.
Example
Popovers are a component used to display additional information on demand. They are similar to tooltips but can contain more content and can be interactive.
Popover example
popover-example.component.html
<ng0-dropdown>
Primary
<ng0-dropdown-menu>
<ng0-dropdown-item (click)="thankYou()">Action</ng0-dropdown-item>
<ng0-dropdown-divider />
<ng0-dropdown-item toggleCss="text-danger">Another action</ng0-dropdown-item>
<ng0-dropdown-link link="/"> Home Page (link) </ng0-dropdown-link>
<ng0-dropdown-link link="/" target="_blank">
Home Page (link, target: _blank)
</ng0-dropdown-link>
<ng0-dropdown-divider />
<ng0-dropdown-link link="/" [active]="['fw-bold', 'text-info']">
Active route with custom css class (link)
</ng0-dropdown-link>
</ng0-dropdown-menu>
</ng0-dropdown>
popover-example.component.ts
import { Component } from '@angular/core';
import { DropdownModule } from '@bootkit/ng0/components/dropdown';
@Component({
selector: 'app-dropdown-example',
templateUrl: './dropdown-example.component.html',
standalone: true,
imports: [DropdownModule]
})
export class DropdownExampleComponent {
}