import React from "react";
import { LucideIcon } from "lucide-react";
import type { EventEmit, EventKey } from "@almadar/core";
export interface NavItem {
    label: string;
    href: string;
    /** Lucide icon component or string icon name (resolved by @almadar/ui Icon) */
    icon?: LucideIcon | string;
    badge?: string | number;
    children?: NavItem[];
}
export interface NotificationItem {
    id: string;
    /** Short label shown in the dropdown row. */
    message: string;
    /** Optional secondary text. */
    description?: string;
    /** Optional ISO timestamp string. */
    createdAt?: string;
    /** Optional flag — bell badge counts items where read !== true. */
    read?: boolean;
}
/** A generic top-bar action button. Domain-agnostic — consumers wire any
 *  combination (cart icon, profile, help, custom). Each entry renders as
 *  an icon button between the search bar and the notifications bell;
 *  click dispatches the configured event onto the bus. */
export interface TopBarAction {
    /** Lucide icon name (e.g. "shopping-cart", "user", "help-circle"). */
    icon: string;
    /** Optional aria-label / tooltip. Falls back to `icon`. */
    label?: string;
    /** Bus event fired on click. Dispatched as `UI:{event}` with empty payload.
     *  Typed as `EventKey` so the pattern-sync detector marks `topBarActions`
     *  as `event-list` and the validator checks references against trait
     *  emit/listen sets. */
    event: EventKey;
    /** Optional badge — number or string rendered in the corner of the icon. */
    badge?: number | string;
    /** Visual variant. Default `"default"`. */
    variant?: "default" | "primary" | "danger";
}
export interface DashboardLayoutProps {
    /** App name shown in sidebar */
    appName?: string;
    /** Logo component or URL */
    logo?: React.ReactNode;
    /** Navigation items. Apps that need a Settings page should add it
     *  as a navItems entry, not depend on baked-in chrome. */
    navItems?: NavItem[];
    /** Current user info (optional - auto-populated from auth context if not provided) */
    user?: {
        name: string;
        email: string;
        avatar?: string;
    };
    /** Header actions (extra slots beyond bell/search/theme). */
    headerActions?: React.ReactNode;
    /** Show the top-bar search box. Default `false` — opt in by setting
     *  `searchEvent` (any truthy value implies showSearch) or this flag. */
    showSearch?: boolean;
    /** Declarative search event — fires `UI:{searchEvent}` on the bus
     *  when the user submits the search box (Enter key). Setting this
     *  implies `showSearch=true`. Use `onSearchSubmit` for direct React
     *  usage instead. */
    searchEvent?: EventEmit<{
        value: string;
    }>;
    /** React-side search submit callback. Used when the host wires the
     *  layout directly (not via render-ui pattern resolution). */
    onSearchSubmit?: (value: string) => void;
    /** Generic top-bar action buttons rendered between the search bar and
     *  the notifications bell. Each entry: `{icon, label?, event, badge?, variant?}`.
     *  Domain-agnostic — consumers add a cart icon, profile button, help-bubble,
     *  or any other top-bar action by appending entries. Empty array (default)
     *  renders nothing. */
    topBarActions?: TopBarAction[];
    /** Notification list. Pass an empty array to show the bell with no
     *  badge; omit / pass null to hide the bell entirely. */
    notifications?: NotificationItem[] | null;
    /** Declarative bell click event — fires `UI:{notificationClickEvent}`
     *  on the bus with an empty payload when the user clicks the bell. */
    notificationClickEvent?: EventEmit<Record<string, never>>;
    /** React-side bell click callback. */
    onNotificationClick?: () => void;
    /** Show the theme toggle button in the header. Default `true` —
     *  universally useful for a11y / dark mode. */
    showThemeToggle?: boolean;
    /** Custom sidebar footer (optional). When omitted, the sidebar has
     *  no footer — apps that need Settings/etc. add them via navItems. */
    sidebarFooter?: React.ReactNode;
    /** Active path used to highlight the matching nav item. Falls back
     *  to `useCurrentPagePath()` (set by `CurrentPagePathProvider`), then
     *  to `useLocation().pathname`. Production deploys can omit it; the
     *  studio preview passes the in-frame `?page=` value so highlighting
     *  works inside the embedded playground where `pathname` would be
     *  the studio route. */
    currentPath?: string;
    /** Callback when user clicks sign out (optional - uses auth context signOut if not provided) */
    onSignOut?: () => void;
    /** Page content rendered inside the main area */
    children?: React.ReactNode;
}
export declare const DashboardLayout: React.FC<DashboardLayoutProps>;
