@tribepad/themis 1.0.0

package/dist/chunk-R7XUIV25.js

@@ -0,0 +1,466 @@
+'use strict';
+
+var chunk3YOY2VJ6_js = require('./chunk-3YOY2VJ6.js');
+var chunkVIREG536_js = require('./chunk-VIREG536.js');
+var react = require('react');
+var reactAria = require('react-aria');
+var reactStately = require('react-stately');
+var classVarianceAuthority = require('class-variance-authority');
+var lucideReact = require('lucide-react');
+var zod = require('zod');
+var jsxRuntime = require('react/jsx-runtime');
+
+var DismissReasonSchema = zod.z.enum(["timeout", "user", "programmatic"]);
+var ToastVariantSchema = zod.z.enum([
+  "default",
+  "primary",
+  "destructive",
+  "accent"
+]);
+var ToasterPositionSchema = zod.z.enum([
+  "top-left",
+  "top-center",
+  "top-right",
+  "bottom-left",
+  "bottom-center",
+  "bottom-right"
+]);
+var ToastOptionsSchema = zod.z.object({
+  /**
+   * Visual variant determining background and foreground colors
+   * @default 'default'
+   */
+  variant: ToastVariantSchema.default("default"),
+  /**
+   * Auto-dismiss timeout in milliseconds
+   * - Values 1-4999ms are clamped to 5000ms (WCAG 2.2 timing requirement)
+   * - Set to 0 for persistent toasts (no auto-dismiss)
+   * @default 5000
+   */
+  timeout: zod.z.number().min(0).default(5e3),
+  /**
+   * Callback fired when toast is dismissed
+   * @param key - Unique identifier of the toast
+   * @param reason - Why the toast was dismissed ('timeout' | 'user' | 'programmatic')
+   */
+  onClose: zod.z.function().optional()
+});
+var ToastProviderPropsSchema = zod.z.object({
+  /**
+   * Maximum number of toasts visible at once
+   * Additional toasts are queued and shown as others dismiss
+   * @default 3
+   */
+  maxVisibleToasts: zod.z.number().min(1).default(3)
+});
+var ToasterPropsSchema = zod.z.object({
+  /**
+   * Position of the toast region on screen
+   * @default 'bottom-right'
+   */
+  position: ToasterPositionSchema.default("bottom-right"),
+  /**
+   * Accessible label for the toast region landmark
+   * Used by screen readers to identify the notification area
+   * @default 'Notifications'
+   */
+  "aria-label": zod.z.string().default("Notifications"),
+  /**
+   * Additional CSS classes for the toast region
+   */
+  className: zod.z.string().optional()
+});
+var toastVariants = classVarianceAuthority.cva(
+  [
+    // Fixed width for consistent appearance
+    "pointer-events-auto relative flex w-[356px] items-center justify-between",
+    "space-x-4 overflow-hidden rounded-lg border p-4 pr-12 shadow-lg",
+    // Animations with reduced-motion support
+    "transition-all duration-300",
+    "motion-reduce:transition-none motion-reduce:animate-none",
+    "data-[entering]:animate-in data-[entering]:slide-in-from-left",
+    "data-[exiting]:animate-out data-[exiting]:slide-out-to-right-full",
+    "data-[exiting]:fade-out-80",
+    // Touch interaction for swipe
+    "touch-pan-y"
+  ],
+  {
+    variants: {
+      variant: {
+        default: [
+          "bg-[var(--content-background)]",
+          "text-[var(--content-foreground)]",
+          "border-[var(--border)]"
+        ],
+        primary: [
+          "bg-[var(--primary)]",
+          "text-[var(--primary-foreground)]",
+          "border-[var(--primary)]"
+        ],
+        destructive: [
+          "bg-[var(--destructive-background)]",
+          "text-[var(--destructive-foreground)]",
+          "border-[var(--destructive-background)]"
+        ],
+        accent: [
+          "bg-[var(--accent-background)]",
+          "text-[var(--accent-foreground)]",
+          "border-[var(--accent-background)]"
+        ]
+      }
+    },
+    defaultVariants: {
+      variant: "default"
+    }
+  }
+);
+var toasterVariants = classVarianceAuthority.cva(
+  [
+    "fixed z-50 flex flex-col gap-2 p-4",
+    "pointer-events-none",
+    "max-h-screen overflow-hidden"
+  ],
+  {
+    variants: {
+      position: {
+        "top-left": "top-0 left-0 items-start",
+        "top-center": "top-0 left-1/2 -translate-x-1/2 items-center",
+        "top-right": "top-0 right-0 items-end",
+        "bottom-left": "bottom-0 left-0 items-start",
+        "bottom-center": "bottom-0 left-1/2 -translate-x-1/2 items-center",
+        "bottom-right": "bottom-0 right-0 items-end"
+      }
+    },
+    defaultVariants: {
+      position: "bottom-right"
+    }
+  }
+);
+var CloseButton = react.memo(
+  react.forwardRef(
+    ({ variant = "default", className, onPress }, ref) => {
+      const hoverStyles = variant === "default" ? "hover:bg-[var(--accent-background)]/20" : "hover:bg-white/20";
+      return /* @__PURE__ */ jsxRuntime.jsx(
+        chunk3YOY2VJ6_js.Button,
+        {
+          ref,
+          variant: "ghost",
+          visualSize: "icon",
+          onPress,
+          className: chunkVIREG536_js.cn(
+            "absolute right-2 top-2",
+            hoverStyles,
+            className
+          ),
+          "aria-label": "Dismiss notification",
+          children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { className: "h-4 w-4", "aria-hidden": "true" })
+        }
+      );
+    }
+  )
+);
+CloseButton.displayName = "CloseButton";
+var internalQueue = new reactStately.ToastQueue({
+  maxVisibleToasts: 3
+});
+var totalActiveToasts = 0;
+var toastCountListeners = /* @__PURE__ */ new Set();
+function incrementTotalToasts() {
+  totalActiveToasts++;
+  toastCountListeners.forEach((fn) => fn());
+}
+function decrementTotalToasts() {
+  totalActiveToasts = Math.max(0, totalActiveToasts - 1);
+  toastCountListeners.forEach((fn) => fn());
+}
+function getTotalActiveToasts() {
+  return totalActiveToasts;
+}
+function subscribeToTotalCount(fn) {
+  toastCountListeners.add(fn);
+  return () => toastCountListeners.delete(fn);
+}
+var toastQueue = {
+  /**
+   * Add a toast to the queue
+   */
+  add: (content, options) => internalQueue.add(content, options),
+  /**
+   * Close a specific toast by key
+   */
+  close: (key) => {
+    internalQueue.close(key);
+  },
+  /**
+   * Close all toasts (visible and queued)
+   */
+  closeAll: () => {
+    internalQueue.visibleToasts.forEach((toast2) => {
+      internalQueue.close(toast2.key);
+    });
+  },
+  /**
+   * Pause all toast timers
+   */
+  pauseAll: () => {
+    internalQueue.pauseAll();
+  },
+  /**
+   * Resume all toast timers
+   */
+  resumeAll: () => {
+    internalQueue.resumeAll();
+  },
+  /**
+   * Get the visible toasts
+   */
+  get visibleToasts() {
+    return internalQueue.visibleToasts;
+  },
+  /**
+   * Subscribe to queue changes
+   */
+  subscribe: (fn) => internalQueue.subscribe(fn),
+  /**
+   * Get total active toasts (visible + queued)
+   */
+  get totalCount() {
+    return totalActiveToasts;
+  }
+};
+function getInternalQueue() {
+  return internalQueue;
+}
+function enforceMinTimeout(timeout) {
+  if (timeout === 0) return 0;
+  return Math.max(timeout, 5e3);
+}
+function toast(content, options) {
+  const validated = ToastOptionsSchema.parse(options ?? {});
+  const timeout = enforceMinTimeout(validated.timeout);
+  const dismissReason = "timeout";
+  incrementTotalToasts();
+  const key = toastQueue.add(
+    {
+      key: "",
+      // Will be set by queue
+      content,
+      variant: validated.variant,
+      timeout,
+      onClose: validated.onClose
+    },
+    {
+      timeout,
+      onClose: () => {
+        decrementTotalToasts();
+        if (validated.onClose) {
+          validated.onClose(
+            key,
+            dismissReason
+          );
+        }
+      }
+    }
+  );
+  return key;
+}
+var ToastItem = react.memo(
+  react.forwardRef(({ toast: toast2, state }, forwardedRef) => {
+    const internalRef = react.useRef(null);
+    const ref = forwardedRef || internalRef;
+    const { toastProps, contentProps } = reactAria.useToast(
+      { toast: toast2 },
+      state,
+      ref
+    );
+    const [touchStart, setTouchStart] = react.useState(null);
+    const [translateX, setTranslateX] = react.useState(0);
+    const SWIPE_THRESHOLD = 50;
+    const handleTouchStart = react.useCallback((e) => {
+      const touch = e.touches[0];
+      if (touch) {
+        setTouchStart(touch.clientX);
+      }
+    }, []);
+    const handleTouchMove = react.useCallback(
+      (e) => {
+        if (touchStart === null) return;
+        const touch = e.touches[0];
+        if (!touch) return;
+        const diff = touch.clientX - touchStart;
+        if (diff > 0) {
+          setTranslateX(diff);
+        }
+      },
+      [touchStart]
+    );
+    const handleTouchEnd = react.useCallback(() => {
+      if (translateX > SWIPE_THRESHOLD) {
+        state.close(toast2.key);
+      }
+      setTranslateX(0);
+      setTouchStart(null);
+    }, [translateX, state, toast2.key]);
+    const handleCloseClick = react.useCallback(() => {
+      state.close(toast2.key);
+    }, [state, toast2.key]);
+    const { content } = toast2;
+    const variant = content.variant ?? "default";
+    const accessibleName = typeof content.content === "string" ? content.content : "Notification";
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        ...toastProps,
+        ref,
+        className: chunkVIREG536_js.cn(toastVariants({ variant })),
+        "aria-label": accessibleName,
+        style: {
+          transform: translateX > 0 ? `translateX(${translateX}px)` : void 0,
+          opacity: translateX > 0 ? 1 - translateX / 200 : void 0
+        },
+        onTouchStart: handleTouchStart,
+        onTouchMove: handleTouchMove,
+        onTouchEnd: handleTouchEnd,
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx("div", { ...contentProps, className: "flex-1 min-w-0", children: typeof content.content === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm font-medium", children: content.content }) : content.content }),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            CloseButton,
+            {
+              variant,
+              onPress: handleCloseClick
+            }
+          )
+        ]
+      }
+    );
+  })
+);
+ToastItem.displayName = "ToastItem";
+var ToastContext = react.createContext(null);
+function ToastProvider({
+  children,
+  maxVisibleToasts = 3
+}) {
+  ToastProviderPropsSchema.parse({ maxVisibleToasts });
+  const queue = react.useMemo(() => {
+    return getInternalQueue();
+  }, []);
+  return /* @__PURE__ */ jsxRuntime.jsx(ToastContext.Provider, { value: queue, children });
+}
+ToastProvider.displayName = "ToastProvider";
+function StackedToastIndicator({ queuedCount }) {
+  if (queuedCount <= 0) return null;
+  const stackLayers = Math.min(queuedCount, 2);
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative w-[356px] pointer-events-none", "aria-hidden": "true", children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        className: chunkVIREG536_js.cn(
+          "absolute left-1/2 -translate-x-1/2 w-[340px] h-4 rounded-lg shadow-lg",
+          "bg-[var(--content-background)] border border-[var(--border)]",
+          "opacity-60",
+          "transition-all duration-200"
+        ),
+        style: { top: 0 }
+      }
+    ),
+    stackLayers >= 2 && /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        className: chunkVIREG536_js.cn(
+          "absolute left-1/2 -translate-x-1/2 w-[324px] h-2 rounded-b-lg shadow-lg",
+          "bg-[var(--content-background)] border border-t-0 border-[var(--border)]",
+          "opacity-40",
+          "transition-all duration-200"
+        ),
+        style: { top: 14 }
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-4" }),
+    /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        className: "text-sm text-[var(--content-foreground)] opacity-70 text-center py-2 pointer-events-auto",
+        "aria-live": "polite",
+        children: [
+          "+",
+          queuedCount,
+          " more notification",
+          queuedCount > 1 ? "s" : ""
+        ]
+      }
+    )
+  ] });
+}
+var Toaster = react.memo(
+  react.forwardRef((props, forwardedRef) => {
+    const validated = ToasterPropsSchema.parse(props);
+    const {
+      position = "bottom-right",
+      "aria-label": ariaLabel = "Notifications",
+      className
+    } = validated;
+    const internalRef = react.useRef(null);
+    const ref = forwardedRef || internalRef;
+    const internalQueueRef = getInternalQueue();
+    const state = reactStately.useToastQueue(internalQueueRef);
+    const totalCount = react.useSyncExternalStore(
+      subscribeToTotalCount,
+      getTotalActiveToasts,
+      getTotalActiveToasts
+    );
+    const { regionProps } = reactAria.useToastRegion(
+      { "aria-label": ariaLabel },
+      state,
+      ref
+    );
+    const queuedCount = Math.max(0, totalCount - state.visibleToasts.length);
+    const handleClearAll = react.useCallback(() => {
+      state.visibleToasts.forEach((toast2) => {
+        state.close(toast2.key);
+      });
+    }, [state]);
+    if (state.visibleToasts.length === 0) {
+      return null;
+    }
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        ...regionProps,
+        ref,
+        className: chunkVIREG536_js.cn(toasterVariants({ position }), className),
+        children: [
+          state.visibleToasts.map((toast2) => /* @__PURE__ */ jsxRuntime.jsx(ToastItem, { toast: toast2, state }, toast2.key)),
+          /* @__PURE__ */ jsxRuntime.jsx(StackedToastIndicator, { queuedCount }),
+          state.visibleToasts.length >= 2 && /* @__PURE__ */ jsxRuntime.jsx(
+            chunk3YOY2VJ6_js.Button,
+            {
+              variant: "secondary",
+              visualSize: "sm",
+              onPress: handleClearAll,
+              "aria-label": "Clear all notifications",
+              className: "mt-2 pointer-events-auto",
+              children: "Clear All"
+            }
+          )
+        ]
+      }
+    );
+  })
+);
+Toaster.displayName = "Toaster";
+
+exports.DismissReasonSchema = DismissReasonSchema;
+exports.ToastOptionsSchema = ToastOptionsSchema;
+exports.ToastProvider = ToastProvider;
+exports.ToastProviderPropsSchema = ToastProviderPropsSchema;
+exports.ToastVariantSchema = ToastVariantSchema;
+exports.Toaster = Toaster;
+exports.ToasterPositionSchema = ToasterPositionSchema;
+exports.ToasterPropsSchema = ToasterPropsSchema;
+exports.toast = toast;
+exports.toastQueue = toastQueue;
+exports.toastVariants = toastVariants;
+exports.toasterVariants = toasterVariants;
+//# sourceMappingURL=chunk-R7XUIV25.js.map
+//# sourceMappingURL=chunk-R7XUIV25.js.map

package/dist/chunk-R7XUIV25.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/elements/Toast/Toast.types.ts","../src/elements/Toast/Toast.tsx","../src/elements/Toast/ToastProvider.tsx","../src/elements/Toast/Toaster.tsx"],"names":["z","cva","memo","forwardRef","jsx","Button","cn","X","ToastQueue","toast","useRef","useToast","useState","useCallback","jsxs","createContext","useMemo","useAriaToastQueue","useSyncExternalStore","useToastRegion"],"mappings":"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","file":"chunk-R7XUIV25.js","sourcesContent":["import { z } from 'zod';\nimport type { ReactNode } from 'react';\n\n/**\n * Toast Component Type Definitions\n *\n * @see toast-prd.md - Product Requirements Document\n * @see plan.md - Implementation Plan\n * @see constitution.md Principle IV (Accessibility First - WCAG 2.2 AAA)\n */\n\n// =============================================================================\n// Enums and Primitives\n// =============================================================================\n\n/**\n * Reason why a toast was dismissed\n * - 'timeout': Auto-dismissed after timeout period\n * - 'user': User clicked close button or swiped to dismiss\n * - 'programmatic': Closed via toastQueue.close() or toastQueue.closeAll()\n */\nexport const DismissReasonSchema = z.enum(['timeout', 'user', 'programmatic']);\nexport type DismissReason = z.infer<typeof DismissReasonSchema>;\n\n/**\n * Toast visual variants matching the Themis theme system\n * Each variant maps to specific theme tokens for background/foreground colors\n *\n * @see toast-prd.md Variant Token Mapping table\n */\nexport const ToastVariantSchema = z.enum([\n  'default',\n  'primary',\n  'destructive',\n  'accent',\n]);\nexport type ToastVariant = z.infer<typeof ToastVariantSchema>;\n\n/**\n * Toast region positioning options\n * Toasts appear in a fixed position on the viewport\n */\nexport const ToasterPositionSchema = z.enum([\n  'top-left',\n  'top-center',\n  'top-right',\n  'bottom-left',\n  'bottom-center',\n  'bottom-right',\n]);\nexport type ToasterPosition = z.infer<typeof ToasterPositionSchema>;\n\n// =============================================================================\n// Toast Options Schema\n// =============================================================================\n\n/**\n * Options for creating a toast notification\n *\n * @example\n * ```tsx\n * toast(\"Message\", {\n *   variant: \"primary\",\n *   timeout: 8000,\n *   onClose: (key, reason) => console.log(`Toast ${key} closed: ${reason}`)\n * });\n * ```\n */\nexport const ToastOptionsSchema = z.object({\n  /**\n   * Visual variant determining background and foreground colors\n   * @default 'default'\n   */\n  variant: ToastVariantSchema.default('default'),\n\n  /**\n   * Auto-dismiss timeout in milliseconds\n   * - Values 1-4999ms are clamped to 5000ms (WCAG 2.2 timing requirement)\n   * - Set to 0 for persistent toasts (no auto-dismiss)\n   * @default 5000\n   */\n  timeout: z.number().min(0).default(5000),\n\n  /**\n   * Callback fired when toast is dismissed\n   * @param key - Unique identifier of the toast\n   * @param reason - Why the toast was dismissed ('timeout' | 'user' | 'programmatic')\n   */\n  onClose: z.function().optional(),\n});\n\n/**\n * Inferred type from Zod schema\n * Note: onClose is typed as generic function in Zod, but we override with proper signature below\n */\ntype ToastOptionsBase = z.infer<typeof ToastOptionsSchema>;\n\n/**\n * Toast options with properly typed onClose callback\n */\nexport type ToastOptions = Omit<ToastOptionsBase, 'onClose'> & {\n  /**\n   * Callback fired when toast is dismissed\n   * @param key - Unique identifier of the toast\n   * @param reason - Why the toast was dismissed\n   */\n  onClose?: (key: string, reason: DismissReason) => void;\n};\n\n// =============================================================================\n// Provider Props Schema\n// =============================================================================\n\n/**\n * Props for the ToastProvider component\n * Wraps the application to provide toast queue context\n *\n * @example\n * ```tsx\n * <ToastProvider maxVisibleToasts={3}>\n *   <App />\n *   <Toaster position=\"bottom-right\" />\n * </ToastProvider>\n * ```\n */\nexport const ToastProviderPropsSchema = z.object({\n  /**\n   * Maximum number of toasts visible at once\n   * Additional toasts are queued and shown as others dismiss\n   * @default 3\n   */\n  maxVisibleToasts: z.number().min(1).default(3),\n});\n\nexport type ToastProviderProps = z.infer<typeof ToastProviderPropsSchema> & {\n  /** Child components that can trigger toasts */\n  children: ReactNode;\n};\n\n// =============================================================================\n// Toaster Props Schema\n// =============================================================================\n\n/**\n * Props for the Toaster component (toast region container)\n * Renders the toast region with positioning and accessibility attributes\n *\n * @example\n * ```tsx\n * <Toaster\n *   position=\"bottom-right\"\n *   aria-label=\"Notifications\"\n *   className=\"custom-toast-region\"\n * />\n * ```\n */\nexport const ToasterPropsSchema = z.object({\n  /**\n   * Position of the toast region on screen\n   * @default 'bottom-right'\n   */\n  position: ToasterPositionSchema.default('bottom-right'),\n\n  /**\n   * Accessible label for the toast region landmark\n   * Used by screen readers to identify the notification area\n   * @default 'Notifications'\n   */\n  'aria-label': z.string().default('Notifications'),\n\n  /**\n   * Additional CSS classes for the toast region\n   */\n  className: z.string().optional(),\n});\n\nexport type ToasterProps = z.infer<typeof ToasterPropsSchema>;\n\n// =============================================================================\n// Internal Types (not exported from index.ts)\n// =============================================================================\n\n/**\n * Internal toast state stored in the queue\n * Contains all information needed to render and manage a toast\n */\nexport interface ToastState {\n  /** Unique identifier for the toast */\n  key: string;\n\n  /** Content to render inside the toast (ReactNode or string) */\n  content: ReactNode;\n\n  /** Visual variant for styling */\n  variant: ToastVariant;\n\n  /** Auto-dismiss timeout in milliseconds (0 = persistent) */\n  timeout: number;\n\n  /** Callback fired when toast is dismissed */\n  onClose?: (key: string, reason: DismissReason) => void;\n}\n\n/**\n * Toast content type - fully customizable by developer\n * Can be a simple string or complex ReactNode with custom layout\n */\nexport type ToastContent = ReactNode;\n\n/**\n * Props for the internal ToastItem component\n */\nexport interface ToastItemProps {\n  /** Toast state from the queue */\n  toast: {\n    key: string;\n    content: ToastState;\n    animation: 'entering' | 'queued' | 'exiting';\n    priority: number;\n  };\n\n  /** Toast queue state for managing dismissal */\n  state: {\n    close: (key: string) => void;\n  };\n}\n\n// =============================================================================\n// Toast Queue API Types\n// =============================================================================\n\n/**\n * Public API for the toast queue\n * Allows programmatic control of toasts from anywhere in the app\n */\nexport interface ToastQueueAPI {\n  /**\n   * Add a new toast to the queue\n   * @param content - Content to display in the toast\n   * @param options - Toast configuration options\n   * @returns Unique key for the created toast\n   */\n  add: (content: ToastContent, options?: Partial<ToastOptions>) => string;\n\n  /**\n   * Close a specific toast by key\n   * @param key - Unique identifier of the toast to close\n   */\n  close: (key: string) => void;\n\n  /**\n   * Close all toasts (visible and queued)\n   */\n  closeAll: () => void;\n\n  /**\n   * Pause all toast timers\n   * Useful when user is interacting with the toast region\n   */\n  pauseAll: () => void;\n\n  /**\n   * Resume all paused toast timers\n   */\n  resumeAll: () => void;\n}\n\n// =============================================================================\n// Utility Types\n// =============================================================================\n\n/**\n * Configuration for the toast() function\n * Partial version of ToastOptions for convenience\n */\nexport type ToastConfig = Partial<ToastOptions>;\n\n/**\n * Return type of the toast() function\n */\nexport type ToastKey = string;\n","'use client';\n\n/**\n * Toast Component - Accessible notification system\n * Built with React Aria toast primitives and CVA styling\n *\n * @see toast-prd.md - Product Requirements Document\n * @see plan.md - Implementation Plan\n * @see constitution.md Principle IV (Accessibility First - WCAG 2.2 AAA)\n */\n\nimport {\n  forwardRef,\n  memo,\n  useRef,\n  useState,\n  useCallback,\n  type TouchEvent as ReactTouchEvent,\n} from 'react';\nimport { useToast } from 'react-aria';\nimport { ToastQueue, type QueuedToast, type ToastState as AriaToastState } from 'react-stately';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { X } from 'lucide-react';\nimport { cn } from '../../utils/cn';\nimport { Button } from '../Button';\nimport type {\n  ToastVariant,\n  ToastContent,\n  ToastState,\n  DismissReason,\n  ToastConfig,\n} from './Toast.types';\nimport { ToastOptionsSchema } from './Toast.types';\n\n// =============================================================================\n// CVA Variants\n// =============================================================================\n\n/**\n * Toast container variants with theme-aligned styling\n * Fixed 356px width for consistent appearance across all toasts\n */\nexport const toastVariants = cva(\n  [\n    // Fixed width for consistent appearance\n    'pointer-events-auto relative flex w-[356px] items-center justify-between',\n    'space-x-4 overflow-hidden rounded-lg border p-4 pr-12 shadow-lg',\n    // Animations with reduced-motion support\n    'transition-all duration-300',\n    'motion-reduce:transition-none motion-reduce:animate-none',\n    'data-[entering]:animate-in data-[entering]:slide-in-from-left',\n    'data-[exiting]:animate-out data-[exiting]:slide-out-to-right-full',\n    'data-[exiting]:fade-out-80',\n    // Touch interaction for swipe\n    'touch-pan-y',\n  ],\n  {\n    variants: {\n      variant: {\n        default: [\n          'bg-[var(--content-background)]',\n          'text-[var(--content-foreground)]',\n          'border-[var(--border)]',\n        ],\n        primary: [\n          'bg-[var(--primary)]',\n          'text-[var(--primary-foreground)]',\n          'border-[var(--primary)]',\n        ],\n        destructive: [\n          'bg-[var(--destructive-background)]',\n          'text-[var(--destructive-foreground)]',\n          'border-[var(--destructive-background)]',\n        ],\n        accent: [\n          'bg-[var(--accent-background)]',\n          'text-[var(--accent-foreground)]',\n          'border-[var(--accent-background)]',\n        ],\n      },\n    },\n    defaultVariants: {\n      variant: 'default',\n    },\n  }\n);\n\n/**\n * Toaster position variants for the toast region container\n */\nexport const toasterVariants = cva(\n  [\n    'fixed z-50 flex flex-col gap-2 p-4',\n    'pointer-events-none',\n    'max-h-screen overflow-hidden',\n  ],\n  {\n    variants: {\n      position: {\n        'top-left': 'top-0 left-0 items-start',\n        'top-center': 'top-0 left-1/2 -translate-x-1/2 items-center',\n        'top-right': 'top-0 right-0 items-end',\n        'bottom-left': 'bottom-0 left-0 items-start',\n        'bottom-center': 'bottom-0 left-1/2 -translate-x-1/2 items-center',\n        'bottom-right': 'bottom-0 right-0 items-end',\n      },\n    },\n    defaultVariants: {\n      position: 'bottom-right',\n    },\n  }\n);\n\n// =============================================================================\n// Close Button Component\n// =============================================================================\n\ninterface CloseButtonProps {\n  variant?: ToastVariant;\n  className?: string;\n  onPress?: () => void;\n}\n\n/**\n * Close button component with 44x44px touch target\n * WCAG 2.2 AAA compliant touch target size\n */\nconst CloseButton = memo(\n  forwardRef<HTMLButtonElement, CloseButtonProps>(\n    ({ variant = 'default', className, onPress}, ref) => {\n      // Variant-aware hover styles\n      const hoverStyles =\n        variant === 'default'\n          ? 'hover:bg-[var(--accent-background)]/20'\n          : 'hover:bg-white/20';\n\n      return (\n        <Button\n          ref={ref}\n          variant=\"ghost\"\n          visualSize=\"icon\"\n          onPress={onPress}\n          className={cn(\n            'absolute right-2 top-2',\n            hoverStyles,\n            className\n          )}\n          aria-label=\"Dismiss notification\"\n        >\n          <X className=\"h-4 w-4\" aria-hidden=\"true\" />\n        </Button>\n      );\n    }\n  )\n);\n\nCloseButton.displayName = 'CloseButton';\n\n// =============================================================================\n// Global Toast Queue\n// =============================================================================\n\n/**\n * Internal toast queue instance\n */\nconst internalQueue = new ToastQueue<ToastState>({\n  maxVisibleToasts: 3,\n});\n\n/**\n * Track total active toasts (visible + queued)\n * React Stately doesn't expose queued toasts, so we track manually\n */\nlet totalActiveToasts = 0;\nconst toastCountListeners = new Set<() => void>();\n\nfunction incrementTotalToasts(): void {\n  totalActiveToasts++;\n  toastCountListeners.forEach((fn) => fn());\n}\n\nfunction decrementTotalToasts(): void {\n  totalActiveToasts = Math.max(0, totalActiveToasts - 1);\n  toastCountListeners.forEach((fn) => fn());\n}\n\n/**\n * Get the total number of active toasts (visible + queued)\n */\nexport function getTotalActiveToasts(): number {\n  return totalActiveToasts;\n}\n\n/**\n * Subscribe to total toast count changes\n */\nexport function subscribeToTotalCount(fn: () => void): () => void {\n  toastCountListeners.add(fn);\n  return () => toastCountListeners.delete(fn);\n}\n\n/**\n * Enhanced toast queue API with additional methods\n * Provides closeAll, pauseAll, resumeAll on top of base ToastQueue\n */\nexport const toastQueue = {\n  /**\n   * Add a toast to the queue\n   */\n  add: (content: ToastState, options?: { timeout?: number; onClose?: () => void }) =>\n    internalQueue.add(content, options),\n\n  /**\n   * Close a specific toast by key\n   */\n  close: (key: string) => {\n    internalQueue.close(key);\n  },\n\n  /**\n   * Close all toasts (visible and queued)\n   */\n  closeAll: () => {\n    // Close all visible toasts\n    internalQueue.visibleToasts.forEach((toast) => {\n      internalQueue.close(toast.key);\n    });\n  },\n\n  /**\n   * Pause all toast timers\n   */\n  pauseAll: () => {\n    internalQueue.pauseAll();\n  },\n\n  /**\n   * Resume all toast timers\n   */\n  resumeAll: () => {\n    internalQueue.resumeAll();\n  },\n\n  /**\n   * Get the visible toasts\n   */\n  get visibleToasts() {\n    return internalQueue.visibleToasts;\n  },\n\n  /**\n   * Subscribe to queue changes\n   */\n  subscribe: (fn: () => void) => internalQueue.subscribe(fn),\n\n  /**\n   * Get total active toasts (visible + queued)\n   */\n  get totalCount() {\n    return totalActiveToasts;\n  },\n};\n\n/**\n * Get the internal queue for use in components\n */\nexport function getInternalQueue(): ToastQueue<ToastState> {\n  return internalQueue;\n}\n\n// =============================================================================\n// Toast Function (Programmatic API)\n// =============================================================================\n\n/**\n * Enforce minimum timeout of 5000ms for accessibility\n * WCAG 2.2 timing guidelines require sufficient time for reading\n * Timeout of 0 bypasses this (persistent toast)\n */\nfunction enforceMinTimeout(timeout: number): number {\n  if (timeout === 0) return 0; // Persistent toast\n  return Math.max(timeout, 5000);\n}\n\n/**\n * Add a toast notification programmatically\n *\n * @param content - Content to display (string or ReactNode)\n * @param options - Toast configuration options\n * @returns Unique key for the created toast\n *\n * @example\n * ```tsx\n * // Simple string\n * toast(\"Message saved!\");\n *\n * // With variant\n * toast(\"Error occurred\", { variant: \"destructive\" });\n *\n * // With callback\n * toast(\"Action completed\", {\n *   variant: \"primary\",\n *   onClose: (key, reason) => console.log(`Closed: ${reason}`)\n * });\n * ```\n */\nexport function toast(content: ToastContent, options?: ToastConfig): string {\n  // Parse and validate options with Zod schema\n  const validated = ToastOptionsSchema.parse(options ?? {});\n\n  // Enforce minimum timeout for accessibility\n  const timeout = enforceMinTimeout(validated.timeout);\n\n  // Track dismissal reason for callback\n  const dismissReason: DismissReason = 'timeout';\n\n  // Increment total toast count\n  incrementTotalToasts();\n\n  const key = toastQueue.add(\n    {\n      key: '', // Will be set by queue\n      content,\n      variant: validated.variant as ToastVariant,\n      timeout,\n      onClose: validated.onClose as\n        | ((key: string, reason: DismissReason) => void)\n        | undefined,\n    },\n    {\n      timeout,\n      onClose: () => {\n        // Decrement total toast count\n        decrementTotalToasts();\n\n        // Fire the user's onClose callback with reason\n        if (validated.onClose) {\n          (validated.onClose as (key: string, reason: DismissReason) => void)(\n            key,\n            dismissReason\n          );\n        }\n      },\n    }\n  );\n\n  return key;\n}\n\n// =============================================================================\n// Toast Item Component\n// =============================================================================\n\nexport interface ToastItemProps {\n  /** Toast from the queue */\n  toast: QueuedToast<ToastState>;\n  /** Toast state for managing dismissal */\n  state: AriaToastState<ToastState>;\n}\n\n/**\n * Individual toast notification component\n * Uses React Aria useToast hook for accessibility\n */\nexport const ToastItem = memo(\n  forwardRef<HTMLDivElement, ToastItemProps>(({ toast, state }, forwardedRef) => {\n    const internalRef = useRef<HTMLDivElement>(null);\n    const ref = (forwardedRef as React.RefObject<HTMLDivElement>) || internalRef;\n\n    // React Aria toast hook for accessibility\n    const { toastProps, contentProps } = useToast(\n      { toast },\n      state,\n      ref\n    );\n\n    // Swipe-to-dismiss state\n    const [touchStart, setTouchStart] = useState<number | null>(null);\n    const [translateX, setTranslateX] = useState(0);\n\n    const SWIPE_THRESHOLD = 50; // Minimum swipe distance to dismiss\n\n    const handleTouchStart = useCallback((e: ReactTouchEvent) => {\n      const touch = e.touches[0];\n      if (touch) {\n        setTouchStart(touch.clientX);\n      }\n    }, []);\n\n    const handleTouchMove = useCallback(\n      (e: ReactTouchEvent) => {\n        if (touchStart === null) return;\n        const touch = e.touches[0];\n        if (!touch) return;\n        const diff = touch.clientX - touchStart;\n        // Only allow right swipe (positive diff)\n        if (diff > 0) {\n          setTranslateX(diff);\n        }\n      },\n      [touchStart]\n    );\n\n    const handleTouchEnd = useCallback(() => {\n      if (translateX > SWIPE_THRESHOLD) {\n        // Dismiss the toast\n        state.close(toast.key);\n      }\n      // Reset swipe state\n      setTranslateX(0);\n      setTouchStart(null);\n    }, [translateX, state, toast.key]);\n\n    const handleCloseClick = useCallback(() => {\n      state.close(toast.key);\n    }, [state, toast.key]);\n\n    const { content } = toast;\n    const variant = content.variant ?? 'default';\n\n    // Generate accessible name for the toast\n    const accessibleName = typeof content.content === 'string'\n      ? content.content\n      : 'Notification';\n\n    return (\n      <div\n        {...toastProps}\n        ref={ref}\n        className={cn(toastVariants({ variant }))}\n        aria-label={accessibleName}\n        style={{\n          transform: translateX > 0 ? `translateX(${translateX}px)` : undefined,\n          opacity: translateX > 0 ? 1 - translateX / 200 : undefined,\n        }}\n        onTouchStart={handleTouchStart}\n        onTouchMove={handleTouchMove}\n        onTouchEnd={handleTouchEnd}\n      >\n        {/* Toast content */}\n        <div {...contentProps} className=\"flex-1 min-w-0\">\n          {typeof content.content === 'string' ? (\n            <p className=\"text-sm font-medium\">{content.content}</p>\n          ) : (\n            content.content\n          )}\n        </div>\n\n        {/* Close button */}\n        <CloseButton\n          variant={variant}\n          onPress={handleCloseClick}\n        />\n      </div>\n    );\n  })\n);\n\nToastItem.displayName = 'ToastItem';\n\n// =============================================================================\n// Export Types\n// =============================================================================\n\nexport type { VariantProps };\n","'use client';\n\n/**\n * ToastProvider Component\n * Provides toast queue context for the application\n *\n * @see toast-prd.md - Product Requirements Document\n * @see plan.md - Implementation Plan\n */\n\nimport { createContext, useContext, useMemo, type ReactNode } from 'react';\nimport { ToastQueue } from 'react-stately';\nimport type { ToastState, ToastProviderProps } from './Toast.types';\nimport { ToastProviderPropsSchema } from './Toast.types';\nimport { getInternalQueue } from './Toast';\n\n// =============================================================================\n// Context\n// =============================================================================\n\n/**\n * Context for the toast queue\n * Allows child components to access the toast queue state\n */\nexport const ToastContext = createContext<ToastQueue<ToastState> | null>(null);\n\n/**\n * Hook to access the toast queue from context\n * @returns The toast queue instance\n * @throws Error if used outside ToastProvider\n */\nexport function useToastQueue(): ToastQueue<ToastState> {\n  const context = useContext(ToastContext);\n  if (!context) {\n    throw new Error('useToastQueue must be used within a ToastProvider');\n  }\n  return context;\n}\n\n// =============================================================================\n// Provider Component\n// =============================================================================\n\n/**\n * ToastProvider - Wraps application to provide toast functionality\n *\n * @example\n * ```tsx\n * <ToastProvider maxVisibleToasts={3}>\n *   <App />\n *   <Toaster position=\"bottom-right\" />\n * </ToastProvider>\n * ```\n */\nexport function ToastProvider({\n  children,\n  maxVisibleToasts = 3,\n}: ToastProviderProps): ReactNode {\n  // Validate props with Zod schema (throws on invalid input)\n  ToastProviderPropsSchema.parse({ maxVisibleToasts });\n\n  // Create queue with configured maxVisibleToasts\n  // Note: We use the global toastQueue for now for simplicity\n  // In a more complex setup, we could create a new queue per provider\n  const queue = useMemo(() => {\n    // Get the internal queue instance\n    // Note: maxVisibleToasts is set on the global queue, not per-provider\n    return getInternalQueue();\n  }, []);\n\n  return (\n    <ToastContext.Provider value={queue}>{children}</ToastContext.Provider>\n  );\n}\n\nToastProvider.displayName = 'ToastProvider';\n","'use client';\n\n/**\n * Toaster Component - Toast region container\n * Renders visible toasts with positioning and accessibility attributes\n *\n * @see toast-prd.md - Product Requirements Document\n * @see plan.md - Implementation Plan\n * @see constitution.md Principle IV (Accessibility First - WCAG 2.2 AAA)\n */\n\nimport { forwardRef, useRef, memo, useCallback, useSyncExternalStore, type ReactElement } from 'react';\nimport { useToastRegion } from 'react-aria';\nimport { useToastQueue as useAriaToastQueue } from 'react-stately';\nimport { cn } from '../../utils/cn';\nimport { Button } from '../Button';\nimport { toasterVariants, getInternalQueue, ToastItem, getTotalActiveToasts, subscribeToTotalCount } from './Toast';\nimport type { ToasterProps } from './Toast.types';\nimport { ToasterPropsSchema } from './Toast.types';\n\n// =============================================================================\n// Stacked Toast Visual Effect\n// =============================================================================\n\ninterface StackedToastIndicatorProps {\n  queuedCount: number;\n}\n\n/**\n * Visual stacking effect showing ghost toasts behind visible ones\n * Creates depth perception for queued notifications\n */\nfunction StackedToastIndicator({ queuedCount }: StackedToastIndicatorProps): ReactElement | null {\n  if (queuedCount <= 0) return null;\n\n  // Show up to 2 visual stack layers\n  const stackLayers = Math.min(queuedCount, 2);\n\n  return (\n    <div className=\"relative w-[356px] pointer-events-none\" aria-hidden=\"true\">\n      {/* Stack layer 1 (closest to visible toasts) */}\n      <div\n        className={cn(\n          'absolute left-1/2 -translate-x-1/2 w-[340px] h-4 rounded-lg shadow-lg',\n          'bg-[var(--content-background)] border border-[var(--border)]',\n          'opacity-60',\n          'transition-all duration-200'\n        )}\n        style={{ top: 0 }}\n      />\n\n      {/* Stack layer 2 (further back, if 2+ queued) */}\n      {stackLayers >= 2 && (\n        <div\n          className={cn(\n            'absolute left-1/2 -translate-x-1/2 w-[324px] h-2 rounded-b-lg shadow-lg',\n            'bg-[var(--content-background)] border border-t-0 border-[var(--border)]',\n            'opacity-40',\n            'transition-all duration-200'\n          )}\n          style={{ top: 14 }}\n        />\n      )}\n\n      {/* Spacer to account for stack height */}\n      <div className=\"h-4\" />\n\n      {/* Text indicator */}\n      <div\n        className=\"text-sm text-[var(--content-foreground)] opacity-70 text-center py-2 pointer-events-auto\"\n        aria-live=\"polite\"\n      >\n        +{queuedCount} more notification{queuedCount > 1 ? 's' : ''}\n      </div>\n    </div>\n  );\n}\n\n// =============================================================================\n// Toaster Component\n// =============================================================================\n\n/**\n * Toaster - Toast region container\n * Renders the toast notification area with proper ARIA attributes\n *\n * @example\n * ```tsx\n * <ToastProvider>\n *   <App />\n *   <Toaster position=\"bottom-right\" aria-label=\"Notifications\" />\n * </ToastProvider>\n * ```\n */\nexport const Toaster = memo(\n  forwardRef<HTMLDivElement, ToasterProps>((props, forwardedRef) => {\n    // Validate props with Zod schema\n    const validated = ToasterPropsSchema.parse(props);\n    const {\n      position = 'bottom-right',\n      'aria-label': ariaLabel = 'Notifications',\n      className,\n    } = validated;\n\n    const internalRef = useRef<HTMLDivElement>(null);\n    const ref = (forwardedRef as React.RefObject<HTMLDivElement>) || internalRef;\n\n    // Use the global toast queue state\n    const internalQueueRef = getInternalQueue();\n    const state = useAriaToastQueue(internalQueueRef);\n\n    // Subscribe to total toast count (includes queued toasts)\n    const totalCount = useSyncExternalStore(\n      subscribeToTotalCount,\n      getTotalActiveToasts,\n      getTotalActiveToasts\n    );\n\n    // React Aria toast region hook for accessibility\n    const { regionProps } = useToastRegion(\n      { 'aria-label': ariaLabel },\n      state,\n      ref\n    );\n\n    // Calculate queued toast count for collapsed stack indicator\n    // totalCount = all toasts (visible + queued), visibleToasts.length = currently shown\n    const queuedCount = Math.max(0, totalCount - state.visibleToasts.length);\n\n    // Handle \"Clear All\" button click\n    const handleClearAll = useCallback(() => {\n      // Close all visible toasts\n      state.visibleToasts.forEach((toast) => {\n        state.close(toast.key);\n      });\n    }, [state]);\n\n    // Don't render if no toasts\n    if (state.visibleToasts.length === 0) {\n      return null;\n    }\n\n    return (\n      <div\n        {...regionProps}\n        ref={ref}\n        className={cn(toasterVariants({ position }), className)}\n      >\n        {/* Toast list */}\n        {state.visibleToasts.map((toast) => (\n          <ToastItem key={toast.key} toast={toast} state={state} />\n        ))}\n\n        {/* Visual stacking effect with ghost toasts */}\n        <StackedToastIndicator queuedCount={queuedCount} />\n\n        {/* \"Clear All\" button (when 2+ toasts visible) */}\n        {state.visibleToasts.length >= 2 && (\n          <Button\n            variant=\"secondary\"\n            visualSize=\"sm\"\n            onPress={handleClearAll}\n            aria-label=\"Clear all notifications\"\n            className=\"mt-2 pointer-events-auto\"\n          >\n            Clear All\n          </Button>\n        )}\n      </div>\n    );\n  })\n);\n\nToaster.displayName = 'Toaster';\n"]}