UNPKG

@vertisanpro/flowbite-react

Version:

Non-Official React components built for Flowbite and Tailwind CSS

23 lines (22 loc) 1.05 kB
'use client'; import { HiX } from '@vertisanpro/react-icons/hi'; import { twMerge } from '@vertisanpro/tailwind-merge'; import React from 'react'; import { mergeDeep } from '../../helpers/merge-deep'; import { useToastContext } from './ToastContext'; export const ToastToggle = ({ className, onClick, theme: customTheme = {}, xIcon: XIcon = HiX, onDismiss, ...props }) => { const { theme: rootTheme, duration, isClosed, isRemoved, setIsClosed, setIsRemoved } = useToastContext(); const theme = mergeDeep(rootTheme.toggle, customTheme); const handleClick = (e) => { if (onClick) onClick(e); if (onDismiss) { onDismiss(); return; } setIsClosed(!isClosed); setTimeout(() => setIsRemoved(!isRemoved), duration); }; return (React.createElement("button", { "aria-label": "Close", onClick: handleClick, type: "button", className: twMerge(theme.base, className), ...props }, React.createElement(XIcon, { "aria-hidden": true, className: theme.icon }))); };