refactor(dropdown-item): add default role prop, cleanup

Author: xidedix

projects/coreui-angular/src/lib/dropdown/dropdown-item/dropdown-item.directive.ts

@@ -1,5 +1,5 @@
-import { booleanAttribute, computed, Directive, ElementRef, inject, input, linkedSignal } from '@angular/core';
 import { FocusableOption, FocusOrigin } from '@angular/cdk/a11y';
+import { booleanAttribute, computed, Directive, ElementRef, inject, input, linkedSignal } from '@angular/core';
 import { DropdownService } from '../dropdown.service';
 import { DropdownComponent } from '../dropdown/dropdown.component';
 
@@ -12,6 +12,7 @@ import { DropdownComponent } from '../dropdown/dropdown.component';
     '[attr.tabindex]': 'tabIndex()',
     '[attr.aria-current]': 'ariaCurrent()',
     '[attr.aria-disabled]': 'disabled || null',
+    '[role]': 'role()',
     '(click)': 'onClick($event)',
     '(keyup)': 'onKeyUp($event)'
   }
@@ -42,19 +43,28 @@ export class DropdownItemDirective implements FocusableOption {
    */
   readonly disabledInput = input(false, { transform: booleanAttribute, alias: 'disabled' });
 
-  readonly disabledEffect = linkedSignal({
+  readonly #disabled = linkedSignal({
     source: this.disabledInput,
     computation: (value) => value
   });
 
   set disabled(value) {
-    this.disabledEffect.set(value);
+    this.#disabled.set(value);
   }
 
   get disabled() {
-    return this.disabledEffect();
+    return this.#disabled();
   }
 
+  readonly role = input<string>('list-item');
+
+  readonly tabIndexInput = input<string | number | null>('0', { alias: 'tabIndex' });
+
+  readonly tabIndex = linkedSignal({
+    source: this.tabIndexInput,
+    computation: (value) => (this.disabled ? '-1' : value)
+  });
+
   focus(origin?: FocusOrigin | undefined): void {
     this.#elementRef?.nativeElement?.focus();
   }
@@ -75,13 +85,6 @@ export class DropdownItemDirective implements FocusableOption {
     } as Record<string, boolean>;
   });
 
-  readonly tabIndexInput = input<string | number | null>(null, { alias: 'tabIndex' });
-
-  readonly tabIndex = linkedSignal({
-    source: this.tabIndexInput,
-    computation: (value) => (this.disabled ? '-1' : value)
-  });
-
   onClick($event: MouseEvent): void {
     this.handleInteraction();
   }