mirror of
https://gitlab.nic.cz/turris/reforis/foris-js.git
synced 2024-11-14 17:35:35 +01:00
Refactor Alert component to use useFocusTrap hook
This commit is contained in:
parent
02f3803265
commit
83a6ff75f6
|
@ -5,10 +5,12 @@
|
||||||
* See /LICENSE for more information.
|
* See /LICENSE for more information.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
import React from "react";
|
import React, { useRef } from "react";
|
||||||
|
|
||||||
import PropTypes from "prop-types";
|
import PropTypes from "prop-types";
|
||||||
|
|
||||||
|
import { useFocusTrap } from "../utils/hooks";
|
||||||
|
|
||||||
export const ALERT_TYPES = Object.freeze({
|
export const ALERT_TYPES = Object.freeze({
|
||||||
PRIMARY: "primary",
|
PRIMARY: "primary",
|
||||||
SECONDARY: "secondary",
|
SECONDARY: "secondary",
|
||||||
|
@ -37,11 +39,15 @@ Alert.defaultProps = {
|
||||||
};
|
};
|
||||||
|
|
||||||
function Alert({ type, onDismiss, children }) {
|
function Alert({ type, onDismiss, children }) {
|
||||||
|
const alertRef = useRef();
|
||||||
|
useFocusTrap(alertRef, !!onDismiss);
|
||||||
return (
|
return (
|
||||||
<div
|
<div
|
||||||
|
ref={alertRef}
|
||||||
className={`alert alert-${type} ${
|
className={`alert alert-${type} ${
|
||||||
onDismiss ? "alert-dismissible" : ""
|
onDismiss ? "alert-dismissible" : ""
|
||||||
}`.trim()}
|
}`.trim()}
|
||||||
|
role="alert"
|
||||||
>
|
>
|
||||||
{onDismiss && (
|
{onDismiss && (
|
||||||
<button
|
<button
|
||||||
|
|
Loading…
Reference in New Issue
Block a user