0.0.2 • Published 1 year ago
use-read-alert v0.0.2
use-read-alert
A callback hook to read assertive alert by the screen reader.
Background
How to use
Installs the provider component. The provider component is required to use the useReadAlert
hook.
import { UseReadAlertProvider } from 'use-read-alert';
React.createRoot(document.getElementById('root')).render(
<UseReadAlertProvider>
<App />
</UseReadAlertProvider>
);
Then, in your React component, calls the callback function to read the alert message.
import { useReadAlert } from 'use-read-alert';
const MyComponent = () => {
const readAlert = useReadAlert();
readAlert('Hello, World!');
// ...
};
API
function UseReadAlertProvider(PropsWithChildren<{
alertClassName?: string;
}>);
function useReadAlert(): (message: string) => void;
By default, the alert
role will be hidden using CSS. If you prefer to hide it using your own CSS, you can provide an alertClassName
.
Behaviors
Contributions
Like us? Star us.
Want to make it better? File us an issue.
Don't like something you see? Submit a pull request.
0.0.3-main.c4cac7c
1 year ago
0.0.2
1 year ago
0.0.1-main.720cb21
1 year ago
0.0.1-main.646a91d
1 year ago
0.0.1-main.d12b81f
1 year ago
0.0.1-main.2e81e72
1 year ago
0.0.1-main.8e0db13
1 year ago
0.0.1-main.704458
1 year ago
0.0.1-main.c368b19
1 year ago
0.0.1-main.7c2924b
1 year ago
0.0.1-main.13b0470
1 year ago
0.0.1-main.7f98760
1 year ago
0.0.1-main.6389e66
1 year ago
0.0.1-main.d31833e
1 year ago
0.0.1-main.2888d3f
1 year ago
0.0.1-main.7abd93e
1 year ago
0.0.1
1 year ago
0.0.1-main.5991230
1 year ago
0.0.1-main.a4c078a
1 year ago
0.0.1-main.c44c3e0
1 year ago
0.0.1-main.9a6114c
1 year ago
0.0.1-main.742f40a
1 year ago
0.0.1-main.f007ba3
1 year ago
0.0.1-main.98c2dbd
1 year ago