import * as react from 'react';

/**
 * Theming props for the Notifications Widget.
 * These map to CSS custom properties used internally.
 */
interface NotificationsThemingProps {
    /** Container background color */
    notifBackgroundColor?: string;
    /** Primary text color */
    notifTextColor?: string;
    /** Secondary text color */
    notifSecondaryTextColor?: string;
    /** Border color */
    notifBorderColor?: string;
    /** Container border radius */
    notifBorderRadius?: string;
    /** Container padding */
    notifPadding?: string;
    /** Container box shadow */
    notifShadow?: string;
    /** Primary color */
    notifPrimaryColor?: string;
    /** Primary hover color */
    notifPrimaryHover?: string;
    /** Accent color (CSS) */
    notifAccentColor?: string;
    /** Notification item background */
    notifItemBg?: string;
    /** Notification item hover background */
    notifItemHoverBg?: string;
    /** Notification item border */
    notifItemBorder?: string;
    /** Notification item border radius */
    notifItemRadius?: string;
    /** Notification item box shadow */
    notifItemShadow?: string;
    /** Notification item padding */
    notifItemPadding?: string;
    /** Notification item gap */
    notifItemGap?: string;
    /** Unread notification background */
    notifUnreadBg?: string;
    /** Unread notification border */
    notifUnreadBorder?: string;
    /** Unread indicator color */
    notifUnreadIndicator?: string;
    /** Avatar size */
    notifAvatarSize?: string;
    /** Avatar border radius */
    notifAvatarRadius?: string;
    /** Avatar border */
    notifAvatarBorder?: string;
    /** Icon size */
    notifIconSize?: string;
    /** Icon color */
    notifIconColor?: string;
    /** Badge background */
    notifBadgeBg?: string;
    /** Badge text color */
    notifBadgeColor?: string;
    /** Badge size */
    notifBadgeSize?: string;
    /** Font family */
    notifFontFamily?: string;
    /** Title font size */
    notifTitleSize?: string;
    /** Title font weight */
    notifTitleWeight?: string;
    /** Body text font size */
    notifBodySize?: string;
    /** Timestamp font size */
    notifTimestampSize?: string;
    /** Empty state icon color */
    notifEmptyIconColor?: string;
    /** Empty state text color */
    notifEmptyTextColor?: string;
    /** Empty state icon size */
    notifEmptyIconSize?: string;
    /** Divider color */
    notifDividerColor?: string;
    /** Header background */
    notifHeaderBg?: string;
    /** Header border */
    notifHeaderBorder?: string;
    /** Button background */
    notifButtonBg?: string;
    /** Button text color */
    notifButtonColor?: string;
    /** Button border radius */
    notifButtonRadius?: string;
    /** Transition duration */
    notifTransitionDuration?: string;
    /** Hover scale factor */
    notifHoverScale?: string;
    /** Loader/spinner color */
    notifLoaderColor?: string;
}
/**
 * Core configuration props for the Notifications Widget.
 */
interface NotificationsWidgetProps extends NotificationsThemingProps {
    /** Base URL of the Legion application (required) */
    baseUrl: string;
    /** JWT / API key for authenticated access (sent via postMessage, never in URL) */
    authToken?: string;
    /** User ID for notification lookup */
    userId?: string;
    /** Theme preset. Default: "light" */
    theme?: "light" | "dark";
    /** Maximum number of notifications. Default: 10 */
    maxNotifications?: number;
    /** Enable auto-refresh (every 30 s). Default: true */
    autoRefresh?: boolean;
    /** Title shown in empty state. Default: "You're all caught up" */
    emptyTitle?: string;
    /** Subtitle shown in empty state. Default: "No notifications right now" */
    emptySubtitle?: string;
    /** Accent color name. Default: "blue" (light) / "gray" (dark) */
    accentColor?: string;
    /** Icon for empty state. Default: "bell" */
    emptyIcon?: "bell" | "gift" | "activity" | "trophy";
    /** Widget width CSS value. Default: "100%" */
    width?: string;
    /** Widget height CSS value. Default: "400px" */
    height?: string;
    /** Additional CSS class name for the container */
    className?: string;
    /** Additional inline styles for the container */
    style?: React.CSSProperties;
    /** Callback when the widget iframe has loaded */
    onLoad?: (detail: {
        widget: string;
        theme: string;
    }) => void;
    /** Callback when the widget iframe fails to load */
    onError?: (message: string) => void;
}
/**
 * Mapping from camelCase theming prop names to the kebab-case query
 * parameter names used by the notifications widget iframe URL.
 */
declare const NOTIF_THEMING_PROP_TO_PARAM: Record<keyof NotificationsThemingProps, string>;

/**
 * Ref handle exposed by LegionNotifications for imperative control.
 */
interface LegionNotificationsHandle {
    /** Reload the widget iframe */
    refresh: () => void;
}
/**
 * Build the iframe src URL from widget props.
 */
declare function buildNotificationsWidgetUrl(props: NotificationsWidgetProps): string;
/**
 * LegionNotifications – a React component that embeds the Legion
 * Notifications widget (Supabase-backed) via an iframe.
 *
 * @example
 * ```tsx
 * import { LegionNotifications } from '@legionhandtech/lht-react-widgets';
 *
 * function App() {
 *   return (
 *     <LegionNotifications
 *       baseUrl="https://your-legion-domain.com"
 *       authToken="your-jwt-token"
 *       theme="light"
 *     />
 *   );
 * }
 * ```
 */
declare const LegionNotifications: react.ForwardRefExoticComponent<NotificationsWidgetProps & react.RefAttributes<LegionNotificationsHandle>>;

export { LegionNotifications, type LegionNotificationsHandle, NOTIF_THEMING_PROP_TO_PARAM, type NotificationsThemingProps, type NotificationsWidgetProps, buildNotificationsWidgetUrl };