import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
// packages/ui/src/routing/NavigationItem.tsx
/**
 * @fileoverview NavigationItem component
 * @description Universal navigation item component with icon and label
 *
 * @version 0.0.2
 * @since 0.0.1
 * @author AMBROISE PARK Consulting
 */
import { Link as LinkIcon } from 'lucide-react';
import { navigationMenuTriggerStylePrimitive } from '@donotdev/components';
import { Link } from './Link';
import { useNavigationItems } from './useNavigation';
import { Icon } from '../components/common/icon';
/**
 * Universal NavigationItem component — nav-trigger style link with icon + label.
 *
 * Used internally in menus, sidebars, and dropdowns.
 * Pass `path` to auto-resolve label, icon, and active state from the navigation store.
 * Pass `route` for an explicit one-off item not registered in the store.
 *
 * For standalone Button-style navigation (e.g. header end slot), use
 * `useNavigationRoute(path)` and compose with `Button` + `render` prop directly.
 *
 * @version 0.0.2
 * @since 0.0.1
 * @author AMBROISE PARK Consulting
 *
 * @example
 * ```tsx
 * <NavigationItemComponent path="/pricing" />
 * <NavigationItemComponent route={{ path: '/pricing', label: t('pricing'), icon: Tag }} />
 * ```
 */
export const NavigationItemComponent = ({ path, route: routeProp, showIcons = true, }) => {
    const allItems = useNavigationItems();
    const route = routeProp ?? allItems.find((item) => item.path === path);
    if (!route)
        return null;
    const hasIcon = showIcons && !!route.icon;
    const hasLabel = !!route.label;
    return (_jsxs(Link, { path: route.path, className: navigationMenuTriggerStylePrimitive(), ...(hasIcon && !hasLabel && { 'data-display': 'compact' }), children: [showIcons && _jsx(Icon, { icon: route.icon, fallback: LinkIcon }), _jsx("span", { children: route.label })] }));
};
