@db-ux/ngx-core-components 2.3.1 → 2.4.0-0-af2a02f

package/components/button/button.d.ts

@@ -1,4 +1,5 @@
 import { AfterViewInit, ElementRef } from "@angular/core";
+import { ClickEvent } from "../../shared/model";
 import * as i0 from "@angular/core";
 export declare class DBButton implements AfterViewInit {
     protected readonly cls: (...args: import("../../utils").ClassNameArg[]) => string;
@@ -24,7 +25,9 @@ export declare class DBButton implements AfterViewInit {
     ariaexpanded: import("@angular/core").InputSignal<boolean | undefined>;
     ariapressed: import("@angular/core").InputSignal<boolean | undefined>;
     text: import("@angular/core").InputSignal<string | undefined>;
+    click: import("@angular/core").OutputEmitterRef<void | MouseEvent>;
     _ref: import("@angular/core").Signal<ElementRef<any> | undefined>;
+    handleClick(event: ClickEvent<HTMLButtonElement>): void;
     constructor();
     /**
      * Passes `aria-*`, `data-*` & `class` attributes to correct child. Used in angular and stencil.
@@ -34,5 +37,5 @@ export declare class DBButton implements AfterViewInit {
     private enableAttributePassing;
     ngAfterViewInit(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<DBButton, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<DBButton, "db-button", never, { "id": { "alias": "id"; "required": false; "isSignal": true; }; "className": { "alias": "className"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "showIcon": { "alias": "showIcon"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "state": { "alias": "state"; "required": false; "isSignal": true; }; "width": { "alias": "width"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "noText": { "alias": "noText"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "form": { "alias": "form"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "describedbyid": { "alias": "describedbyid"; "required": false; "isSignal": true; }; "ariaexpanded": { "alias": "ariaexpanded"; "required": false; "isSignal": true; }; "ariapressed": { "alias": "ariapressed"; "required": false; "isSignal": true; }; "text": { "alias": "text"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DBButton, "db-button", never, { "id": { "alias": "id"; "required": false; "isSignal": true; }; "className": { "alias": "className"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "showIcon": { "alias": "showIcon"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "state": { "alias": "state"; "required": false; "isSignal": true; }; "width": { "alias": "width"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "noText": { "alias": "noText"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "form": { "alias": "form"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "describedbyid": { "alias": "describedbyid"; "required": false; "isSignal": true; }; "ariaexpanded": { "alias": "ariaexpanded"; "required": false; "isSignal": true; }; "ariapressed": { "alias": "ariapressed"; "required": false; "isSignal": true; }; "text": { "alias": "text"; "required": false; "isSignal": true; }; }, { "click": "click"; }, never, ["*"], true, never>;
 }

package/components/link/link.d.ts

@@ -1,4 +1,5 @@
 import { AfterViewInit, ElementRef } from "@angular/core";
+import { ClickEvent } from "../../shared/model";
 import * as i0 from "@angular/core";
 export declare class DBLink implements AfterViewInit {
     protected readonly cls: (...args: import("../../utils").ClassNameArg[]) => string;
@@ -20,7 +21,9 @@ export declare class DBLink implements AfterViewInit {
     variant: import("@angular/core").InputSignal<"brand" | "adaptive" | undefined>;
     content: import("@angular/core").InputSignal<"external" | "internal" | undefined>;
     text: import("@angular/core").InputSignal<string | undefined>;
+    click: import("@angular/core").OutputEmitterRef<void | MouseEvent>;
     _ref: import("@angular/core").Signal<ElementRef<any> | undefined>;
+    handleClick(event: ClickEvent<HTMLAnchorElement>): void;
     constructor();
     /**
      * Passes `aria-*`, `data-*` & `class` attributes to correct child. Used in angular and stencil.
@@ -30,5 +33,5 @@ export declare class DBLink implements AfterViewInit {
     private enableAttributePassing;
     ngAfterViewInit(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<DBLink, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<DBLink, "db-link", never, { "id": { "alias": "id"; "required": false; "isSignal": true; }; "className": { "alias": "className"; "required": false; "isSignal": true; }; "href": { "alias": "href"; "required": false; "isSignal": true; }; "target": { "alias": "target"; "required": false; "isSignal": true; }; "rel": { "alias": "rel"; "required": false; "isSignal": true; }; "role": { "alias": "role"; "required": false; "isSignal": true; }; "hreflang": { "alias": "hreflang"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "selected": { "alias": "selected"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "current": { "alias": "current"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "showIcon": { "alias": "showIcon"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "content": { "alias": "content"; "required": false; "isSignal": true; }; "text": { "alias": "text"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DBLink, "db-link", never, { "id": { "alias": "id"; "required": false; "isSignal": true; }; "className": { "alias": "className"; "required": false; "isSignal": true; }; "href": { "alias": "href"; "required": false; "isSignal": true; }; "target": { "alias": "target"; "required": false; "isSignal": true; }; "rel": { "alias": "rel"; "required": false; "isSignal": true; }; "role": { "alias": "role"; "required": false; "isSignal": true; }; "hreflang": { "alias": "hreflang"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "selected": { "alias": "selected"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "current": { "alias": "current"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "showIcon": { "alias": "showIcon"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "content": { "alias": "content"; "required": false; "isSignal": true; }; "text": { "alias": "text"; "required": false; "isSignal": true; }; }, { "click": "click"; }, never, ["*"], true, never>;
 }

package/fesm2022/db-ux-ngx-core-components.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { input, viewChild, Component, output, signal, effect, model, Directive, TemplateRef, ContentChild } from '@angular/core';
+import { input, output, viewChild, Component, signal, effect, model, Directive, TemplateRef, ContentChild } from '@angular/core';
 import * as i1 from '@angular/common';
 import { CommonModule } from '@angular/common';
 import { NG_VALUE_ACCESSOR } from '@angular/forms';
@@ -111,6 +111,11 @@ const isKeyboardEvent = (event) => event.key !== undefined;
 
 const defaultProps$z = {};
 class DBButton {
+    handleClick(event) {
+        if (this.click) {
+            this.click.emit(event);
+        }
+    }
     constructor() {
         this.cls = cls;
         this.getBoolean = getBoolean;
@@ -135,6 +140,7 @@ class DBButton {
         this.ariaexpanded = input();
         this.ariapressed = input();
         this.text = input();
+        this.click = output();
         this._ref = viewChild("_ref");
     }
     /**
@@ -174,7 +180,7 @@ class DBButton {
         this.enableAttributePassing(element, "db-button");
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DBButton, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.14", type: DBButton, isStandalone: true, selector: "db-button", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, className: { classPropertyName: "className", publicName: "className", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, showIcon: { classPropertyName: "showIcon", publicName: "showIcon", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, state: { classPropertyName: "state", publicName: "state", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, noText: { classPropertyName: "noText", publicName: "noText", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, form: { classPropertyName: "form", publicName: "form", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, describedbyid: { classPropertyName: "describedbyid", publicName: "describedbyid", isSignal: true, isRequired: false, transformFunction: null }, ariaexpanded: { classPropertyName: "ariaexpanded", publicName: "ariaexpanded", isSignal: true, isRequired: false, transformFunction: null }, ariapressed: { classPropertyName: "ariapressed", publicName: "ariapressed", isSignal: true, isRequired: false, transformFunction: null }, text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "_ref", first: true, predicate: ["_ref"], descendants: true, isSignal: true }], ngImport: i0, template: `
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.14", type: DBButton, isStandalone: true, selector: "db-button", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, className: { classPropertyName: "className", publicName: "className", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, showIcon: { classPropertyName: "showIcon", publicName: "showIcon", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, state: { classPropertyName: "state", publicName: "state", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, noText: { classPropertyName: "noText", publicName: "noText", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, form: { classPropertyName: "form", publicName: "form", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, describedbyid: { classPropertyName: "describedbyid", publicName: "describedbyid", isSignal: true, isRequired: false, transformFunction: null }, ariaexpanded: { classPropertyName: "ariaexpanded", publicName: "ariaexpanded", isSignal: true, isRequired: false, transformFunction: null }, ariapressed: { classPropertyName: "ariapressed", publicName: "ariapressed", isSignal: true, isRequired: false, transformFunction: null }, text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { click: "click" }, viewQueries: [{ propertyName: "_ref", first: true, predicate: ["_ref"], descendants: true, isSignal: true }], ngImport: i0, template: `
     <button
       #_ref
       [attr.id]="id()"
@@ -195,6 +201,7 @@ class DBButton {
       [attr.aria-describedby]="describedbyid()"
       [attr.aria-expanded]="ariaexpanded()"
       [attr.aria-pressed]="ariapressed()"
+      (click)="handleClick($event)"
     >
       @if(text()){ {{text()}} }@else{
       <ng-content></ng-content>
@@ -225,6 +232,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
       [attr.aria-describedby]="describedbyid()"
       [attr.aria-expanded]="ariaexpanded()"
       [attr.aria-pressed]="ariapressed()"
+      (click)="handleClick($event)"
     >
       @if(text()){ {{text()}} }@else{
       <ng-content></ng-content>
@@ -442,7 +450,7 @@ class DBNotification {
       </db-button>
       }
     </article>
-  `, isInline: true, styles: [":host{display:contents}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: DBButton, selector: "db-button", inputs: ["id", "className", "type", "disabled", "label", "icon", "showIcon", "size", "state", "width", "variant", "noText", "name", "form", "value", "describedbyid", "ariaexpanded", "ariapressed", "text"] }] }); }
+  `, isInline: true, styles: [":host{display:contents}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: DBButton, selector: "db-button", inputs: ["id", "className", "type", "disabled", "label", "icon", "showIcon", "size", "state", "width", "variant", "noText", "name", "form", "value", "describedbyid", "ariaexpanded", "ariapressed", "text"], outputs: ["click"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DBNotification, decorators: [{
             type: Component,
@@ -515,7 +523,7 @@ class DBBadge {
                         parent = parent.parentElement;
                     }
                     if (parent) {
-                        parent.dataset["hasBadge"] = "true";
+                        parent.setAttribute("data-has-badge", "true");
                     }
                 }
             }
@@ -1413,7 +1421,7 @@ class DBDrawer {
         <div class="db-drawer-content"><ng-content></ng-content></div>
       </article>
     </dialog>
-  `, isInline: true, styles: [":host{display:contents}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: DBButton, selector: "db-button", inputs: ["id", "className", "type", "disabled", "label", "icon", "showIcon", "size", "state", "width", "variant", "noText", "name", "form", "value", "describedbyid", "ariaexpanded", "ariapressed", "text"] }] }); }
+  `, isInline: true, styles: [":host{display:contents}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: DBButton, selector: "db-button", inputs: ["id", "className", "type", "disabled", "label", "icon", "showIcon", "size", "state", "width", "variant", "noText", "name", "form", "value", "describedbyid", "ariaexpanded", "ariapressed", "text"], outputs: ["click"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DBDrawer, decorators: [{
             type: Component,
@@ -1760,7 +1768,7 @@ const handleFixedPopover = (element, parent, placement) => {
         element.style.insetBlockEnd = `calc(${end > innerHeight ? innerHeight : end}px + ${distance})`;
     }
     element.style.position = 'fixed';
-    element.dataset['correctedPlacement'] = correctedPlacement;
+    element.setAttribute('data-corrected-placement', correctedPlacement);
 };
 
 const isEventTargetNavigationItem = (event) => {
@@ -2090,7 +2098,7 @@ class DBHeader {
         </div>
       </div>
     </header>
-  `, isInline: true, styles: [":host{display:contents}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: DBDrawer, selector: "db-drawer", inputs: ["open", "backdrop", "variant", "id", "className", "spacing", "width", "direction", "rounded", "closeButtonId", "closeButtonText"], outputs: ["close"] }, { kind: "component", type: DBButton, selector: "db-button", inputs: ["id", "className", "type", "disabled", "label", "icon", "showIcon", "size", "state", "width", "variant", "noText", "name", "form", "value", "describedbyid", "ariaexpanded", "ariapressed", "text"] }] }); }
+  `, isInline: true, styles: [":host{display:contents}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: DBDrawer, selector: "db-drawer", inputs: ["open", "backdrop", "variant", "id", "className", "spacing", "width", "direction", "rounded", "closeButtonId", "closeButtonText"], outputs: ["close"] }, { kind: "component", type: DBButton, selector: "db-button", inputs: ["id", "className", "type", "disabled", "label", "icon", "showIcon", "size", "state", "width", "variant", "noText", "name", "form", "value", "describedbyid", "ariaexpanded", "ariapressed", "text"], outputs: ["click"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DBHeader, decorators: [{
             type: Component,
@@ -2539,7 +2547,12 @@ class DBInput {
       @if(dataList()){
       <datalist [attr.id]="_dataListId()">
         @for (option of getDataList();track trackByOption0;let i = $index) {
-        <option [attr.value]="option.value">{{option.label}}</option>
+        <option
+          [attr.value]="option.value"
+          [attr.data-value]="option.hiddenValue"
+        >
+          {{option.label}}
+        </option>
         }
       </datalist>
       }
@@ -2612,7 +2625,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
       @if(dataList()){
       <datalist [attr.id]="_dataListId()">
         @for (option of getDataList();track trackByOption0;let i = $index) {
-        <option [attr.value]="option.value">{{option.label}}</option>
+        <option
+          [attr.value]="option.value"
+          [attr.data-value]="option.hiddenValue"
+        >
+          {{option.label}}
+        </option>
         }
       </datalist>
       }
@@ -2638,6 +2656,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
 
 const defaultProps$n = {};
 class DBLink {
+    handleClick(event) {
+        if (this.click) {
+            this.click.emit(event);
+        }
+    }
     constructor() {
         this.cls = cls;
         this.getBooleanAsString = getBooleanAsString;
@@ -2658,6 +2681,7 @@ class DBLink {
         this.variant = input();
         this.content = input();
         this.text = input();
+        this.click = output();
         this._ref = viewChild("_ref");
     }
     /**
@@ -2697,7 +2721,7 @@ class DBLink {
         this.enableAttributePassing(element, "db-link");
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DBLink, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.14", type: DBLink, isStandalone: true, selector: "db-link", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, className: { classPropertyName: "className", publicName: "className", isSignal: true, isRequired: false, transformFunction: null }, href: { classPropertyName: "href", publicName: "href", isSignal: true, isRequired: false, transformFunction: null }, target: { classPropertyName: "target", publicName: "target", isSignal: true, isRequired: false, transformFunction: null }, rel: { classPropertyName: "rel", publicName: "rel", isSignal: true, isRequired: false, transformFunction: null }, role: { classPropertyName: "role", publicName: "role", isSignal: true, isRequired: false, transformFunction: null }, hreflang: { classPropertyName: "hreflang", publicName: "hreflang", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, selected: { classPropertyName: "selected", publicName: "selected", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, current: { classPropertyName: "current", publicName: "current", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, showIcon: { classPropertyName: "showIcon", publicName: "showIcon", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, content: { classPropertyName: "content", publicName: "content", isSignal: true, isRequired: false, transformFunction: null }, text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "_ref", first: true, predicate: ["_ref"], descendants: true, isSignal: true }], ngImport: i0, template: `
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.14", type: DBLink, isStandalone: true, selector: "db-link", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, className: { classPropertyName: "className", publicName: "className", isSignal: true, isRequired: false, transformFunction: null }, href: { classPropertyName: "href", publicName: "href", isSignal: true, isRequired: false, transformFunction: null }, target: { classPropertyName: "target", publicName: "target", isSignal: true, isRequired: false, transformFunction: null }, rel: { classPropertyName: "rel", publicName: "rel", isSignal: true, isRequired: false, transformFunction: null }, role: { classPropertyName: "role", publicName: "role", isSignal: true, isRequired: false, transformFunction: null }, hreflang: { classPropertyName: "hreflang", publicName: "hreflang", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, selected: { classPropertyName: "selected", publicName: "selected", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, current: { classPropertyName: "current", publicName: "current", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, showIcon: { classPropertyName: "showIcon", publicName: "showIcon", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, content: { classPropertyName: "content", publicName: "content", isSignal: true, isRequired: false, transformFunction: null }, text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { click: "click" }, viewQueries: [{ propertyName: "_ref", first: true, predicate: ["_ref"], descendants: true, isSignal: true }], ngImport: i0, template: `
     <a
       #_ref
       [attr.id]="id()"
@@ -2716,6 +2740,7 @@ class DBLink {
       [attr.data-hide-icon-after]="getHideProp(showIcon() ?? true)"
       [attr.data-variant]="variant()"
       [attr.data-content]="content() || 'internal'"
+      (click)="handleClick($event)"
     >
       @if(text()){ {{text()}} }@else{
       <ng-content></ng-content>
@@ -2744,6 +2769,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
       [attr.data-hide-icon-after]="getHideProp(showIcon() ?? true)"
       [attr.data-variant]="variant()"
       [attr.data-content]="content() || 'internal'"
+      (click)="handleClick($event)"
     >
       @if(text()){ {{text()}} }@else{
       <ng-content></ng-content>
@@ -4023,7 +4049,7 @@ class DBTooltip {
                     ["mouseleave", "focusout"].forEach((event) => {
                         parent.addEventListener(event, () => this.handleLeave());
                     });
-                    parent.dataset["hasTooltip"] = "true";
+                    parent.setAttribute("data-has-tooltip", "true");
                     if (this.variant() === "label") {
                         parent.setAttribute("aria-labelledby", this._id());
                     }
@@ -4809,7 +4835,7 @@ class DBNavigationItem {
       </menu>
       }
     </li>
-  `, isInline: true, styles: [":host{display:contents}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: DBButton, selector: "db-button", inputs: ["id", "className", "type", "disabled", "label", "icon", "showIcon", "size", "state", "width", "variant", "noText", "name", "form", "value", "describedbyid", "ariaexpanded", "ariapressed", "text"] }] }); }
+  `, isInline: true, styles: [":host{display:contents}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: DBButton, selector: "db-button", inputs: ["id", "className", "type", "disabled", "label", "icon", "showIcon", "size", "state", "width", "variant", "noText", "name", "form", "value", "describedbyid", "ariaexpanded", "ariapressed", "text"], outputs: ["click"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DBNavigationItem, decorators: [{
             type: Component,
@@ -5903,7 +5929,7 @@ class DBTabs {
       }
       <ng-content></ng-content>
     </div>
-  `, isInline: true, styles: [":host{display:contents}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: DBButton, selector: "db-button", inputs: ["id", "className", "type", "disabled", "label", "icon", "showIcon", "size", "state", "width", "variant", "noText", "name", "form", "value", "describedbyid", "ariaexpanded", "ariapressed", "text"] }, { kind: "component", type: DBTabList, selector: "db-tab-list", inputs: ["id", "className"] }, { kind: "component", type: DBTabItem, selector: "db-tab-item", inputs: ["active", "name", "className", "id", "icon", "iconAfter", "showIcon", "noText", "disabled", "controls", "checked", "label"], outputs: ["disabledChange", "checkedChange", "change"] }, { kind: "component", type: DBTabPanel, selector: "db-tab-panel", inputs: ["className", "id", "labelledBy", "content"] }] }); }
+  `, isInline: true, styles: [":host{display:contents}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: DBButton, selector: "db-button", inputs: ["id", "className", "type", "disabled", "label", "icon", "showIcon", "size", "state", "width", "variant", "noText", "name", "form", "value", "describedbyid", "ariaexpanded", "ariapressed", "text"], outputs: ["click"] }, { kind: "component", type: DBTabList, selector: "db-tab-list", inputs: ["id", "className"] }, { kind: "component", type: DBTabItem, selector: "db-tab-item", inputs: ["active", "name", "className", "id", "icon", "iconAfter", "showIcon", "noText", "disabled", "controls", "checked", "label"], outputs: ["disabledChange", "checkedChange", "change"] }, { kind: "component", type: DBTabPanel, selector: "db-tab-panel", inputs: ["className", "id", "labelledBy", "content"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DBTabs, decorators: [{
             type: Component,
@@ -7430,7 +7456,7 @@ class DBCustomSelect {
         {{_voiceOverFallback()}}
       </span>
     </div>
-  `, isInline: true, styles: [":host{display:contents}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: DBTag, selector: "db-tag", inputs: ["disabled", "removeButton", "id", "className", "semantic", "emphasis", "icon", "showCheckState", "showIcon", "noText", "overflow", "text", "behavior"], outputs: ["remove"] }, { kind: "component", type: DBCustomSelectDropdown, selector: "db-custom-select-dropdown", inputs: ["id", "className", "width"] }, { kind: "component", type: DBInput, selector: "db-input", inputs: ["id", "invalidMessage", "dataListId", "message", "showMessage", "value", "validMessage", "validation", "required", "minLength", "maxLength", "pattern", "dataList", "className", "variant", "showLabel", "showIcon", "icon", "iconAfter", "label", "fieldSizing", "name", "type", "placeholder", "disabled", "step", "maxlength", "minlength", "max", "min", "readOnly", "readonly", "form", "size", "autocomplete", "autofocus", "ariaDescribedBy", "messageIcon"], outputs: ["valueChange", "disabledChange", "input", "change", "blur", "focus"] }, { kind: "component", type: DBCustomSelectList, selector: "db-custom-select-list", inputs: ["multiple", "label", "id", "className"] }, { kind: "component", type: DBCustomSelectListItem, selector: "db-custom-select-list-item", inputs: ["id", "isGroupTitle", "showDivider", "type", "checked", "className", "groupTitle", "icon", "showIcon", "name", "disabled", "value", "label"], outputs: ["checkedChange", "disabledChange", "change"] }, { kind: "component", type: DBInfotext, selector: "db-infotext", inputs: ["id", "className", "icon", "semantic", "size", "showIcon", "text"] }, { kind: "component", type: DBButton, selector: "db-button", inputs: ["id", "className", "type", "disabled", "label", "icon", "showIcon", "size", "state", "width", "variant", "noText", "name", "form", "value", "describedbyid", "ariaexpanded", "ariapressed", "text"] }, { kind: "component", type: DBTooltip, selector: "db-tooltip", inputs: ["id", "variant", "placement", "className", "emphasis", "animation", "delay", "width", "showArrow"] }] }); }
+  `, isInline: true, styles: [":host{display:contents}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: DBTag, selector: "db-tag", inputs: ["disabled", "removeButton", "id", "className", "semantic", "emphasis", "icon", "showCheckState", "showIcon", "noText", "overflow", "text", "behavior"], outputs: ["remove"] }, { kind: "component", type: DBCustomSelectDropdown, selector: "db-custom-select-dropdown", inputs: ["id", "className", "width"] }, { kind: "component", type: DBInput, selector: "db-input", inputs: ["id", "invalidMessage", "dataListId", "message", "showMessage", "value", "validMessage", "validation", "required", "minLength", "maxLength", "pattern", "dataList", "className", "variant", "showLabel", "showIcon", "icon", "iconAfter", "label", "fieldSizing", "name", "type", "placeholder", "disabled", "step", "maxlength", "minlength", "max", "min", "readOnly", "readonly", "form", "size", "autocomplete", "autofocus", "ariaDescribedBy", "messageIcon"], outputs: ["valueChange", "disabledChange", "input", "change", "blur", "focus"] }, { kind: "component", type: DBCustomSelectList, selector: "db-custom-select-list", inputs: ["multiple", "label", "id", "className"] }, { kind: "component", type: DBCustomSelectListItem, selector: "db-custom-select-list-item", inputs: ["id", "isGroupTitle", "showDivider", "type", "checked", "className", "groupTitle", "icon", "showIcon", "name", "disabled", "value", "label"], outputs: ["checkedChange", "disabledChange", "change"] }, { kind: "component", type: DBInfotext, selector: "db-infotext", inputs: ["id", "className", "icon", "semantic", "size", "showIcon", "text"] }, { kind: "component", type: DBButton, selector: "db-button", inputs: ["id", "className", "type", "disabled", "label", "icon", "showIcon", "size", "state", "width", "variant", "noText", "name", "form", "value", "describedbyid", "ariaexpanded", "ariapressed", "text"], outputs: ["click"] }, { kind: "component", type: DBTooltip, selector: "db-tooltip", inputs: ["id", "variant", "placement", "className", "emphasis", "animation", "delay", "width", "showArrow"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DBCustomSelect, decorators: [{
             type: Component,