Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Appearance settings

Commit 3cfcaf3

Browse filesBrowse files
committed
fix(button): cButton directive loosing tabindex attribute, refactor; close #228 - thanks @bernik1980
1 parent 4de719c commit 3cfcaf3
Copy full SHA for 3cfcaf3

File tree

Expand file treeCollapse file tree

1 file changed

+19
-3
lines changed
Open diff view settings
Filter options
Expand file treeCollapse file tree

1 file changed

+19
-3
lines changed
Open diff view settings
Collapse file

‎projects/coreui-angular/src/lib/button/button.directive.ts‎

Copy file name to clipboardExpand all lines: projects/coreui-angular/src/lib/button/button.directive.ts
+19-3Lines changed: 19 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,14 @@
1-
import { booleanAttribute, computed, Directive, input, InputSignal, InputSignalWithTransform } from '@angular/core';
1+
import {
2+
booleanAttribute,
3+
computed,
4+
Directive,
5+
input,
6+
InputSignal,
7+
InputSignalWithTransform,
8+
numberAttribute
9+
} from '@angular/core';
210

3-
import { ButtonType, Colors, Shapes } from '../coreui.types';
11+
import { BooleanInput, ButtonType, Colors, Shapes } from '../coreui.types';
412

513
@Directive({
614
selector: '[cButton]',
@@ -16,6 +24,9 @@ import { ButtonType, Colors, Shapes } from '../coreui.types';
1624
}
1725
})
1826
export class ButtonDirective {
27+
static ngAcceptInputType_active: BooleanInput;
28+
static ngAcceptInputType_disabled: BooleanInput;
29+
1930
/**
2031
* Toggle the active state for the component. [docs]
2132
* @type InputSignalWithTransform<boolean, unknown>
@@ -46,6 +57,11 @@ export class ButtonDirective {
4657
*/
4758
readonly size: InputSignal<'' | 'sm' | 'lg'> = input<'' | 'sm' | 'lg'>('');
4859

60+
/**
61+
* The tabindex attribute specifies the tab order of an element (when the "tab" button is used for navigating).
62+
*/
63+
readonly tabindex = input(undefined, { transform: numberAttribute });
64+
4965
/**
5066
* Specifies the type of button. Always specify the type attribute for the `<button>` element.
5167
* Different browsers may use different default types for the `<button>` element.
@@ -84,7 +100,7 @@ export class ButtonDirective {
84100
});
85101

86102
readonly tabIndex = computed(() => {
87-
return this._disabled() ? '-1' : null;
103+
return this._disabled() ? '-1' : (this.tabindex() ?? null);
88104
});
89105

90106
readonly isActive = computed(() => {

0 commit comments

Comments
0 (0)
Morty Proxy This is a proxified and sanitized view of the page, visit original site.