32 lines
851 B
TypeScript
32 lines
851 B
TypeScript
import { faExclamationCircle } from "@fortawesome/free-solid-svg-icons";
|
|
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
|
|
import React from "react";
|
|
|
|
interface ValidationErrorIconProps {
|
|
visible: boolean;
|
|
reserveSpace?: boolean;
|
|
}
|
|
|
|
const ValidationErrorIcon: React.FC<ValidationErrorIconProps> = ({
|
|
visible,
|
|
reserveSpace = false,
|
|
}) => {
|
|
if (!visible && !reserveSpace) return null;
|
|
|
|
const wrapperClassName = reserveSpace
|
|
? "validation-error-icon validation-error-icon--reserve-space"
|
|
: "validation-error-icon";
|
|
|
|
return (
|
|
<span className={wrapperClassName} aria-hidden={!visible}>
|
|
{visible && (
|
|
<span className="error-icon">
|
|
<FontAwesomeIcon icon={faExclamationCircle} />
|
|
</span>
|
|
)}
|
|
</span>
|
|
);
|
|
};
|
|
|
|
export default ValidationErrorIcon;
|