'use client';

import { cn } from "../../utils/cn.mjs";
import { X } from "lucide-react";
import { cva } from "class-variance-authority";
import { jsx } from "react/jsx-runtime";
import * as ToastPrimitives from "@radix-ui/react-toast";

//#region src/components/Toaster/Toast.tsx
const ToastProvider = ToastPrimitives;
const ToastViewport = ({ className, ...props }) => /* @__PURE__ */ jsx(ToastPrimitives.Viewport, {
	className: cn("fixed top-0 z-100 flex max-h-screen w-full flex-col-reverse p-4 sm:top-auto sm:right-0 sm:bottom-0 sm:flex-col md:max-w-[420px]", className),
	...props
});
/**
* Toast variant styles using class-variance-authority.
*
* Defines visual styles for different toast types with semantic colors,
* animations, and responsive behavior.
*
* @example
* ```tsx
* // Error toast with red background
* <Toast variant="error">Error message</Toast>
*
* // Success toast with green background
* <Toast variant="success">Success message</Toast>
*
* // Default toast with neutral styling
* <Toast variant="default">Info message</Toast>
* ```
*/
const toastVariants = cva("group data-[state=closed]:fade-out-80 data-[state=closed]:slide-out-to-right-full data-[state=open]:slide-in-from-top-full data-[state=open]:sm:slide-in-from-bottom-full pointer-events-auto relative flex w-full items-center justify-between space-x-2 overflow-hidden rounded-md p-4 pr-6 shadow-[0_0_10px_-15px_rgba(0,0,0,0.3)] backdrop-blur transition-all data-[swipe=cancel]:translate-x-0 data-[swipe=end]:translate-x-[var(--radix-toast-swipe-end-x)] data-[swipe=move]:translate-x-[var(--radix-toast-swipe-move-x)] data-[state=closed]:animate-out data-[state=open]:animate-in data-[swipe=end]:animate-out data-[swipe=move]:transition-none", {
	variants: { variant: {
		error: "bg-error/40 text-text",
		success: "bg-success/30 text-text",
		default: "bg-card/80 text-text"
	} },
	defaultVariants: { variant: "default" }
});
/**
* Toast Component
*
* A notification component that displays temporary messages to users using Radix UI primitives.
* Supports different visual variants, animations, and user interactions including swipe-to-dismiss.
*
* ## Features
* - **Visual Variants**: Error, success, and default styling themes
* - **Animations**: Smooth slide-in/slide-out transitions with fade effects
* - **Swipe Gestures**: Touch-friendly swipe-to-dismiss functionality
* - **Accessibility**: Full screen reader support and keyboard navigation
* - **Positioning**: Smart positioning with responsive viewport handling
* - **Auto-dismiss**: Configurable automatic dismissal timing
*
* ## Technical Implementation
* - Built on Radix UI Toast primitives for accessibility compliance
* - Uses Framer Motion for smooth animations and gestures
* - CVA (class-variance-authority) for consistent styling variants
* - Backdrop blur effects for modern visual appeal
* - CSS transforms for hardware-accelerated animations
*
* @example
* ```tsx
* // Basic toast with title and description
* <Toast variant="default">
*   <ToastTitle>Notification</ToastTitle>
*   <ToastDescription>Your action was completed successfully.</ToastDescription>
*   <ToastClose />
* </Toast>
*
* // Error toast with action button
* <Toast variant="error">
*   <ToastTitle>Upload Failed</ToastTitle>
*   <ToastDescription>Could not upload file. Please try again.</ToastDescription>
*   <ToastAction altText="Retry upload">Retry</ToastAction>
*   <ToastClose />
* </Toast>
* ```
*/
const Toast = ({ className, variant, ...props }) => {
	return /* @__PURE__ */ jsx(ToastPrimitives.Root, {
		className: cn(toastVariants({ variant }), className),
		...props
	});
};
/**
* ToastAction Component
*
* An interactive button component for toast notifications that allows users to take
* actions related to the notification message.
*
* ## Features
* - **Accessibility**: Requires `altText` prop for screen readers
* - **Visual States**: Hover, focus, and disabled state styling
* - **Theme Integration**: Supports destructive and default themes
* - **Keyboard Navigation**: Full keyboard accessibility support
*
* ## Usage Guidelines
* - Use for actionable notifications (retry, undo, view details)
* - Keep action text short and descriptive
* - Provide meaningful `altText` for accessibility
* - Limit to one primary action per toast
*
* @example
* ```tsx
* // Retry action for failed operations
* <ToastAction altText="Retry the failed operation">
*   Retry
* </ToastAction>
*
* // Undo action for reversible operations
* <ToastAction altText="Undo the last action">
*   Undo
* </ToastAction>
*
* // Navigation action
* <ToastAction altText="View the uploaded file">
*   View File
* </ToastAction>
* ```
*/
const ToastAction = ({ className, ...props }) => /* @__PURE__ */ jsx(ToastPrimitives.Action, {
	className: cn("inline-flex h-8 shrink-0 items-center justify-center rounded-md border bg-transparent px-3 font-medium text-sm transition-colors hover:bg-text focus:outline-hidden focus:ring-1 focus:ring-ring disabled:pointer-events-none disabled:opacity-50 group-[.destructive]:border-muted/40 group-[.destructive]:focus:ring-destructive group-[.destructive]:hover:border-destructive/30 group-[.destructive]:hover:bg-destructive group-[.destructive]:hover:text-destructive-foreground", className),
	...props
});
const ToastClose = ({ className, ...props }) => /* @__PURE__ */ jsx(ToastPrimitives.Close, {
	className: cn("absolute top-1 right-1 rounded-md p-1 text-text/50 opacity-0 transition-opacity hover:text-text/80 focus:opacity-100 focus:outline-hidden focus:ring-1 group-hover:opacity-100 group-[.destructive]:text-red-300 group-[.destructive]:focus:ring-red-400 group-[.destructive]:focus:ring-offset-red-600 group-[.destructive]:hover:text-red-50", className),
	"toast-close": "",
	...props,
	children: /* @__PURE__ */ jsx(X, { className: "size-5" })
});
/**
* ToastTitle Component
*
* The primary heading text for toast notifications. Provides semantic structure
* and proper typography hierarchy within the toast.
*
* ## Styling Features
* - Semi-bold font weight for emphasis
* - Automatic text sizing adjustments for descriptions
* - Proper spacing relationships with other toast elements
*
* @example
* ```tsx
* <ToastTitle>File Upload Complete</ToastTitle>
* <ToastTitle>Error: Connection Failed</ToastTitle>
* <ToastTitle>Settings Saved</ToastTitle>
* ```
*/
const ToastTitle = ({ className, ...props }) => /* @__PURE__ */ jsx(ToastPrimitives.Title, {
	className: cn("font-semibold text-sm [&+div]:text-xs", className),
	...props
});
/**
* ToastDescription Component
*
* Supporting text that provides additional context or details for the toast notification.
* Complements the ToastTitle with more detailed information.
*
* ## Styling Features
* - Slightly reduced opacity for visual hierarchy
* - Smaller text size than title
* - Optimal line height for readability
*
* ## Content Guidelines
* - Keep descriptions concise but informative
* - Provide actionable information when possible
* - Use plain language for better accessibility
*
* @example
* ```tsx
* <ToastDescription>
*   Your document has been uploaded successfully and is now available for sharing.
* </ToastDescription>
*
* <ToastDescription>
*   Please check your internet connection and try again.
* </ToastDescription>
* ```
*/
const ToastDescription = ({ className, ...props }) => /* @__PURE__ */ jsx(ToastPrimitives.Description, {
	className: cn("text-sm opacity-90", className),
	...props
});

//#endregion
export { Toast, ToastAction, ToastClose, ToastDescription, ToastProvider, ToastTitle, ToastViewport };
//# sourceMappingURL=Toast.mjs.map