Skip to content

Commit d8acd69

Browse files
essjay05wagnermaciel
authored andcommitted
fix(aria/tree): adds rtl keyboard functionality for tree (#32305)
* feat(aria/tree): adds rtl keyboard functionality for tree Updates aria tree keyboard functionality to have RightArrow collapse and LeftArrow expand for rtl. * refactor(aria/tree): remove unnecessary input Updates previous code to remove unnecessary input. (cherry picked from commit 56304a3)
1 parent a47ebeb commit d8acd69

File tree

1 file changed

+7
-4
lines changed

1 file changed

+7
-4
lines changed

src/aria/private/tree/tree.ts

Lines changed: 7 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -205,36 +205,39 @@ export class TreePattern<V> {
205205
/** Whether the tree selection follows focus. */
206206
readonly followFocus = computed(() => this.inputs.selectionMode() === 'follow');
207207

208+
/** Whether the tree direction is RTL. */
209+
readonly isRtl = computed(() => this.inputs.textDirection() === 'rtl');
210+
208211
/** The key for navigating to the previous item. */
209212
readonly prevKey = computed(() => {
210213
if (this.inputs.orientation() === 'vertical') {
211214
return 'ArrowUp';
212215
}
213-
return this.inputs.textDirection() === 'rtl' ? 'ArrowRight' : 'ArrowLeft';
216+
return this.isRtl() ? 'ArrowRight' : 'ArrowLeft';
214217
});
215218

216219
/** The key for navigating to the next item. */
217220
readonly nextKey = computed(() => {
218221
if (this.inputs.orientation() === 'vertical') {
219222
return 'ArrowDown';
220223
}
221-
return this.inputs.textDirection() === 'rtl' ? 'ArrowLeft' : 'ArrowRight';
224+
return this.isRtl() ? 'ArrowLeft' : 'ArrowRight';
222225
});
223226

224227
/** The key for collapsing an item or moving to its parent. */
225228
readonly collapseKey = computed(() => {
226229
if (this.inputs.orientation() === 'horizontal') {
227230
return 'ArrowUp';
228231
}
229-
return this.inputs.textDirection() === 'rtl' ? 'ArrowRight' : 'ArrowLeft';
232+
return this.isRtl() ? 'ArrowRight' : 'ArrowLeft';
230233
});
231234

232235
/** The key for expanding an item or moving to its first child. */
233236
readonly expandKey = computed(() => {
234237
if (this.inputs.orientation() === 'horizontal') {
235238
return 'ArrowDown';
236239
}
237-
return this.inputs.textDirection() === 'rtl' ? 'ArrowLeft' : 'ArrowRight';
240+
return this.isRtl() ? 'ArrowLeft' : 'ArrowRight';
238241
});
239242

240243
/** Represents the space key. Does nothing when the user is actively using typeahead. */

0 commit comments

Comments
 (0)