Skip to content

Commit d0312a7

Browse files
authored
Fixed it-button disabled interactions (#197)
1 parent 86f8710 commit d0312a7

19 files changed

Lines changed: 152 additions & 265 deletions

File tree

.changeset/free-buses-begin.md

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
---
2+
'@italia/dev-kit-italia': patch
3+
'@italia/dropdown': patch
4+
'@italia/button': patch
5+
'@italia/chip': patch
6+
---
7+
8+
Fixed it-button disabled interaction.

examples/angular-app/src/app/pages/button.component.html

Lines changed: 16 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -7,13 +7,13 @@ <h2>Varianti di colore</h2>
77
<div class="flex">
88
<it-button variant="primary" size="sm" type="button"> Primary </it-button>
99

10-
<it-button variant="primary" size="sm" aria-disabled="true" type="button"> Primary disabled </it-button>
10+
<it-button variant="primary" size="sm" disabled type="button"> Primary disabled </it-button>
1111
</div>
1212

1313
<div class="flex">
1414
<it-button variant="primary" outline size="sm" type="button"> Primary outline </it-button>
1515

16-
<it-button variant="primary" outline size="sm" aria-disabled="true" type="button">
16+
<it-button variant="primary" outline size="sm" disabled type="button">
1717
Primary outline disabled
1818
</it-button>
1919
</div>
@@ -22,13 +22,13 @@ <h2>Varianti di colore</h2>
2222
<div class="flex">
2323
<it-button variant="secondary" size="sm" type="button"> Secondary </it-button>
2424

25-
<it-button variant="secondary" size="sm" aria-disabled="true" type="button"> Secondary disabled </it-button>
25+
<it-button variant="secondary" size="sm" disabled type="button"> Secondary disabled </it-button>
2626
</div>
2727

2828
<div class="flex">
2929
<it-button variant="secondary" outline size="sm" type="button"> Secondary outline </it-button>
3030

31-
<it-button variant="secondary" outline size="sm" aria-disabled="true" type="button">
31+
<it-button variant="secondary" outline size="sm" disabled type="button">
3232
Secondary outline disabled
3333
</it-button>
3434
</div>
@@ -37,13 +37,13 @@ <h2>Varianti di colore</h2>
3737
<div class="flex">
3838
<it-button variant="success" size="sm" type="button"> Success </it-button>
3939

40-
<it-button variant="success" size="sm" aria-disabled="true" type="button"> Success disabled </it-button>
40+
<it-button variant="success" size="sm" disabled type="button"> Success disabled </it-button>
4141
</div>
4242

4343
<div class="flex">
4444
<it-button variant="success" outline size="sm" type="button"> Success outline </it-button>
4545

46-
<it-button variant="success" outline size="sm" aria-disabled="true" type="button">
46+
<it-button variant="success" outline size="sm" disabled type="button">
4747
Success outline disabled
4848
</it-button>
4949
</div>
@@ -52,13 +52,13 @@ <h2>Varianti di colore</h2>
5252
<div class="flex">
5353
<it-button variant="danger" size="sm" type="button"> Danger </it-button>
5454

55-
<it-button variant="danger" size="sm" aria-disabled="true" type="button"> Danger disabled </it-button>
55+
<it-button variant="danger" size="sm" disabled type="button"> Danger disabled </it-button>
5656
</div>
5757

5858
<div class="flex">
5959
<it-button variant="danger" outline size="sm" type="button"> Danger outline </it-button>
6060

61-
<it-button variant="danger" outline size="sm" aria-disabled="true" type="button">
61+
<it-button variant="danger" outline size="sm" disabled type="button">
6262
Danger outline disabled
6363
</it-button>
6464
</div>
@@ -67,13 +67,13 @@ <h2>Varianti di colore</h2>
6767
<div class="flex">
6868
<it-button variant="warning" size="sm" type="button"> Warning </it-button>
6969

70-
<it-button variant="warning" size="sm" aria-disabled="true" type="button"> Warning disabled </it-button>
70+
<it-button variant="warning" size="sm" disabled type="button"> Warning disabled </it-button>
7171
</div>
7272

7373
<div class="flex">
7474
<it-button variant="warning" outline size="sm" type="button"> Warning outline </it-button>
7575

76-
<it-button variant="warning" outline size="sm" aria-disabled="true" type="button">
76+
<it-button variant="warning" outline size="sm" disabled type="button">
7777
Warning outline disabled
7878
</it-button>
7979
</div>
@@ -82,7 +82,7 @@ <h2>Varianti di colore</h2>
8282
<div class="flex">
8383
<it-button variant="link" size="sm" type="button"> Link </it-button>
8484

85-
<it-button variant="link" size="sm" aria-disabled="true" type="button"> Link disabled </it-button>
85+
<it-button variant="link" size="sm" disabled type="button"> Link disabled </it-button>
8686
</div>
8787
</div>
8888
</section>
@@ -127,13 +127,13 @@ <h2>Sfondo scuro</h2>
127127
<div class="flex">
128128
<it-button variant="primary" size="sm" type="button"> Primary </it-button>
129129

130-
<it-button variant="primary" size="sm" aria-disabled="true" type="button"> Primary disabled </it-button>
130+
<it-button variant="primary" size="sm" disabled type="button"> Primary disabled </it-button>
131131
</div>
132132

133133
<div class="flex">
134134
<it-button variant="primary" outline size="sm" type="button"> Primary outline </it-button>
135135

136-
<it-button variant="primary" outline size="sm" aria-disabled="true" type="button">
136+
<it-button variant="primary" outline size="sm" disabled type="button">
137137
Primary outline disabled
138138
</it-button>
139139
</div>
@@ -142,13 +142,13 @@ <h2>Sfondo scuro</h2>
142142
<div class="flex">
143143
<it-button variant="secondary" size="sm" type="button"> Secondary </it-button>
144144

145-
<it-button variant="secondary" size="sm" aria-disabled="true" type="button"> Secondary disabled </it-button>
145+
<it-button variant="secondary" size="sm" disabled type="button"> Secondary disabled </it-button>
146146
</div>
147147

148148
<div class="flex">
149149
<it-button variant="secondary" outline size="sm" type="button"> Secondary outline </it-button>
150150

151-
<it-button variant="secondary" outline size="sm" aria-disabled="true" type="button">
151+
<it-button variant="secondary" outline size="sm" disabled type="button">
152152
Secondary outline disabled
153153
</it-button>
154154
</div>
@@ -157,7 +157,7 @@ <h2>Sfondo scuro</h2>
157157
<div class="flex">
158158
<it-button variant="link" size="sm" type="button"> Link </it-button>
159159

160-
<it-button variant="link" size="sm" aria-disabled="true" type="button"> Link disabled </it-button>
160+
<it-button variant="link" size="sm" disabled type="button"> Link disabled </it-button>
161161
</div>
162162
</div>
163163
</div>

examples/angular-app/src/app/pages/chip.component.html

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -42,7 +42,7 @@ <h2>Chip con avatar</h2>
4242
slot="dismiss-button"
4343
icon
4444
it-aria-label="Elimina etichetta"
45-
it-aria-disabled="true"
45+
disabled
4646
it-aria-description="Puoi premere per eliminare la chip."
4747
(click)="handleDismiss($event)"
4848
(keydown)="handleKeyDown($event)"
@@ -55,7 +55,7 @@ <h2>Chip con avatar</h2>
5555
slot="dismiss-button"
5656
icon
5757
it-aria-label="Elimina etichetta"
58-
it-aria-disabled="true"
58+
disabled
5959
it-aria-description="Puoi premere per eliminare la chip."
6060
(click)="handleDismiss($event)"
6161
(keydown)="handleKeyDown($event)"
@@ -99,7 +99,7 @@ <h2>Chip con chiusura</h2>
9999
slot="dismiss-button"
100100
icon
101101
it-aria-label="Elimina chip"
102-
it-aria-disabled="true"
102+
disabled
103103
it-aria-description="Puoi premere per eliminare la chip."
104104
(click)="handleDismiss($event)"
105105
(keydown)="handleKeyDown($event)"
@@ -119,7 +119,7 @@ <h2>Chip disabilitata</h2>
119119
slot="dismiss-button"
120120
icon
121121
it-aria-label="Elimina etichetta"
122-
it-aria-disabled="true"
122+
disabled
123123
it-aria-description="Puoi premere per eliminare la chip."
124124
(click)="handleDismiss($event)"
125125
(keydown)="handleKeyDown($event)"

0 commit comments

Comments
 (0)