@@ -25,13 +25,29 @@ export const AccordionRoot = component$(
25
25
collapsible = true ,
26
26
behavior = 'single' ,
27
27
animated = false ,
28
+ onSelectedIndexChange$,
29
+ onFocusIndexChange$,
28
30
...props
29
31
} : AccordionRootProps ) => {
30
32
const rootRef = useSignal < HTMLDivElement | undefined > ( ) ;
31
33
const triggerStore = useStore < HTMLButtonElement [ ] > ( [ ] ) ;
32
34
const currFocusedTriggerIndexSig = useSignal < number > ( - 1 ) ;
33
35
const currSelectedTriggerIndexSig = useSignal < number > ( - 1 ) ;
34
36
37
+ useTask$ ( ( { track } ) => {
38
+ track ( ( ) => currSelectedTriggerIndexSig . value ) ;
39
+ if ( onSelectedIndexChange$ ) {
40
+ onSelectedIndexChange$ ( currSelectedTriggerIndexSig . value ) ;
41
+ }
42
+ } ) ;
43
+
44
+ useTask$ ( ( { track } ) => {
45
+ track ( ( ) => currFocusedTriggerIndexSig . value ) ;
46
+ if ( onFocusIndexChange$ ) {
47
+ onFocusIndexChange$ ( currFocusedTriggerIndexSig . value ) ;
48
+ }
49
+ } ) ;
50
+
35
51
const selectedTriggerIdSig = useSignal < string > ( '' ) ;
36
52
37
53
const focusPreviousTrigger$ = $ ( ( ) => {
@@ -64,20 +80,6 @@ export const AccordionRoot = component$(
64
80
return triggerStore [ triggerStore . length - 1 ] . focus ( ) ;
65
81
} ) ;
66
82
67
- useTask$ ( ( { track } ) => {
68
- track ( ( ) => currSelectedTriggerIndexSig . value ) ;
69
- if ( props . onSelectedIndexChange$ ) {
70
- props . onSelectedIndexChange$ ( currSelectedTriggerIndexSig . value ) ;
71
- }
72
- } ) ;
73
-
74
- useTask$ ( ( { track } ) => {
75
- track ( ( ) => currFocusedTriggerIndexSig . value ) ;
76
- if ( props . onFocusIndexChange$ ) {
77
- props . onFocusIndexChange$ ( currFocusedTriggerIndexSig . value ) ;
78
- }
79
- } ) ;
80
-
81
83
const contextService : AccordionRootContext = {
82
84
selectedTriggerIdSig,
83
85
currFocusedTriggerIndexSig,
0 commit comments