diff --git a/src/app/WardrobePage/PosePicker.js b/src/app/WardrobePage/PosePicker.js index b030d26..09b30a3 100644 --- a/src/app/WardrobePage/PosePicker.js +++ b/src/app/WardrobePage/PosePicker.js @@ -63,7 +63,7 @@ function PosePicker({ onUnlockFocus, }) { const theme = useTheme(); - const checkedInputRef = React.useRef(); + const initialFocusRef = React.useRef(); const { loading, error, poseInfos } = usePoses(speciesId, colorId, pose); const [isInSupportMode, setIsInSupportMode] = useLocalStorage( "DTIPosePickerIsInSupportMode", @@ -111,7 +111,7 @@ function PosePicker({ returnFocusOnClose onOpen={onLockFocus} onClose={onUnlockFocus} - initialFocusRef={checkedInputRef} + initialFocusRef={initialFocusRef} > {({ isOpen }) => ( <> @@ -166,6 +166,7 @@ function PosePicker({ colorId={colorId} pose={pose} appearanceId={appearanceId} + initialFocusRef={initialFocusRef} dispatchToOutfit={dispatchToOutfit} /> ) : ( @@ -173,7 +174,7 @@ function PosePicker({ {numAvailablePoses <= 1 && ( @@ -210,7 +211,7 @@ function PosePicker({ ); } -function PosePickerTable({ poseInfos, onChange, checkedInputRef }) { +function PosePickerTable({ poseInfos, onChange, initialFocusRef }) { return ( @@ -236,21 +237,21 @@ function PosePickerTable({ poseInfos, onChange, checkedInputRef }) { @@ -262,21 +263,21 @@ function PosePickerTable({ poseInfos, onChange, checkedInputRef }) { diff --git a/src/app/WardrobePage/support/PosePickerSupport.js b/src/app/WardrobePage/support/PosePickerSupport.js index 8b4d728..3766efb 100644 --- a/src/app/WardrobePage/support/PosePickerSupport.js +++ b/src/app/WardrobePage/support/PosePickerSupport.js @@ -17,6 +17,7 @@ function PosePickerSupport({ colorId, pose, appearanceId, + initialFocusRef, dispatchToOutfit, }) { const { loading, error, data } = useQuery( @@ -108,6 +109,7 @@ function PosePickerSupport({ petAppearances={data.petAppearances} currentPetAppearance={currentPetAppearance} canonicalAppearanceIds={canonicalAppearanceIds} + dropdownRef={initialFocusRef} dispatchToOutfit={dispatchToOutfit} /> { const id = e.target.value; const petAppearance = petAppearances.find((pa) => pa.id === id);