import { type IconProp } from '../icon';
type Props = {
label: string;
/** Icon — string SVG source, `{ src, color?, size? }` object, or custom snippet. */
icon: IconProp;
/** Render as `` — unless `disabled`, which falls back to the button form. `on.click` still fires; `event.preventDefault()` keeps the click from navigating. */
href?: string;
/** Highlight as the current item. Consumer-controlled. @default false */
active?: boolean;
/** Active row visuals — `'plain'` uses color plus a heavier label weight and keeps hover, `'filled'` paints the active background (no hover on it). @default 'plain' */
activeStyle?: 'filled' | 'plain';
disabled?: boolean;
/** Notification badge on the icon (top-right corner). Numbers > 99 render as `99+`; strings render as-is. */
badge?: number | string;
/** Anchor target — only relevant when `href` is set. */
target?: string;
/** Anchor rel — only relevant when `href` is set. */
rel?: string;
on?: {
click?: (event: MouseEvent) => void;
};
};
/**
* NavMenuItem — single row inside a `NavMenuGroup`. Icon + label, optional badge in the top-right of
* the icon (numbers > 99 truncate to `99+`). The icon accepts an SVG source string or a snippet.
* Renders as `` when `href` is set and enabled, `