Autofocus buttons

This commit is contained in:
Gregory Schier
2023-04-11 14:04:23 -07:00
parent 90b03a0b97
commit 6b07fe105f
3 changed files with 16 additions and 21 deletions

View File

@@ -8,9 +8,9 @@ module.exports = {
"plugin:@typescript-eslint/recommended",
"eslint-config-prettier"
],
parser: '@typescript-eslint/parser',
parser: "@typescript-eslint/parser",
parserOptions: {
project: ['./tsconfig.json'],
project: ["./tsconfig.json"]
},
ignorePatterns: ["src-tauri/**/*"],
settings: {
@@ -25,13 +25,13 @@ module.exports = {
}
},
rules: {
"jsx-a11y/no-autofocus": "warn",
"jsx-a11y/no-autofocus": "off",
"react/react-in-jsx-scope": "off",
"import/no-unresolved": "off",
"@typescript-eslint/consistent-type-imports": ["error", {
prefer: "type-imports",
disallowTypeAnnotations: true,
fixStyle: "separate-type-imports"
}],
}]
}
};

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>