Autofocus buttons

This commit is contained in:
Gregory Schier
2023-04-11 14:04:23 -07:00
parent a38691ed53
commit 66813d67fe
3 changed files with 16 additions and 21 deletions

View File

@@ -49,6 +49,17 @@ export const WorkspaceActionsDropdown = memo(function WorkspaceDropdown({ classN
return (
<HStack space={2} justifyContent="end" className="mt-6">
<Button
className="focus"
color="gray"
onClick={() => {
hide();
routes.navigate('workspace', { workspaceId: w.id });
}}
>
This Window
</Button>
<Button
autoFocus
className="focus"
color="gray"
rightSlot={<Icon icon="openNewWindow" />}
@@ -61,16 +72,6 @@ export const WorkspaceActionsDropdown = memo(function WorkspaceDropdown({ classN
>
New Window
</Button>
<Button
className="focus"
color="gray"
onClick={() => {
hide();
routes.navigate('workspace', { workspaceId: w.id });
}}
>
This Window
</Button>
</HStack>
);
},

View File

@@ -19,12 +19,6 @@ const confirmButtonTexts: Record<NonNullable<ConfirmProps['variant']>, string> =
};
export function Confirm({ onHide, onResult, variant = 'confirm' }: ConfirmProps) {
const focusRef = (el: HTMLButtonElement | null) => {
setTimeout(() => {
el?.focus();
});
};
const handleHide = () => {
onResult(false);
onHide();
@@ -40,7 +34,7 @@ export function Confirm({ onHide, onResult, variant = 'confirm' }: ConfirmProps)
<Button className="focus" color="gray" onClick={handleHide}>
Cancel
</Button>
<Button className="focus" ref={focusRef} color={colors[variant]} onClick={handleSuccess}>
<Button autoFocus className="focus" color={colors[variant]} onClick={handleSuccess}>
{confirmButtonTexts[variant]}
</Button>
</HStack>