mirror of
https://gitlab.com/mbugroup/lti-web-client.git
synced 2026-05-26 00:05:45 +00:00
feat: add ref prop to Alert
This commit is contained in:
@@ -1,15 +1,16 @@
|
|||||||
import { ReactNode } from 'react';
|
import { ReactNode, Ref } from 'react';
|
||||||
|
|
||||||
import { cn } from '@/lib/helper';
|
import { cn } from '@/lib/helper';
|
||||||
|
|
||||||
interface AlertProps {
|
interface AlertProps {
|
||||||
|
ref?: Ref<HTMLDivElement> | undefined;
|
||||||
variant?: 'outline' | 'dash' | 'soft';
|
variant?: 'outline' | 'dash' | 'soft';
|
||||||
color?: 'info' | 'success' | 'warning' | 'error';
|
color?: 'info' | 'success' | 'warning' | 'error';
|
||||||
children?: ReactNode;
|
children?: ReactNode;
|
||||||
className?: string;
|
className?: string;
|
||||||
}
|
}
|
||||||
|
|
||||||
const Alert = ({ children, variant, color, className }: AlertProps) => {
|
const Alert = ({ children, ref, variant, color, className }: AlertProps) => {
|
||||||
const alertBaseClassName = cn('alert', {
|
const alertBaseClassName = cn('alert', {
|
||||||
'alert-soft': variant === 'soft',
|
'alert-soft': variant === 'soft',
|
||||||
'alert-outline': variant === 'outline',
|
'alert-outline': variant === 'outline',
|
||||||
@@ -21,7 +22,11 @@ const Alert = ({ children, variant, color, className }: AlertProps) => {
|
|||||||
'alert-error': color === 'error',
|
'alert-error': color === 'error',
|
||||||
});
|
});
|
||||||
|
|
||||||
return <div className={cn(alertBaseClassName, className)}>{children}</div>;
|
return (
|
||||||
|
<div ref={ref} className={cn(alertBaseClassName, className)}>
|
||||||
|
{children}
|
||||||
|
</div>
|
||||||
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
export default Alert;
|
export default Alert;
|
||||||
|
|||||||
Reference in New Issue
Block a user