import type React from "react"; import { motion, AnimatePresence } from "motion/react"; import styles from "./auth.module.scss"; export function AuthContainer({ children }: { children?: React.ReactNode }) { return (
{children}
) } export type IconType = "filled" | "outlined"; export interface AuthHeaderIcon { name: string; type: IconType } export interface AuthHeaderProps { title: string; icon: string | AuthHeaderIcon; subtitle: string; } export function AuthHeader({ title, icon, subtitle }: AuthHeaderProps) { const iconType = typeof icon == "string" ? "filled" : icon.type; const iconName = typeof icon == "string" ? icon : icon.name; return (

{iconName} {title}

{subtitle}
) } export type AlertType = "success" | "danger" export interface Alert { type: AlertType; message: string; } export function AlertsContainer({ alerts }: { alerts: Alert[]}) { const displayAlerts = alerts.slice(-3); return (
{displayAlerts.map((alert, i) => ( {alert.message} ))}
) }