import { default as React, ReactNode, HTMLAttributes } from 'react';
export interface NavigationProps extends Omit, "aria-label" | "className" | "onSelect"> {
/**
* Accessible name for the `nav` landmark; applied as `aria-label`.
*
* A sidebar usually has multiple `nav` landmarks; the label is what
* distinguishes them for assistive technology.
*/
label: string;
/** `NavigationItem` children (or any content). */
children?: ReactNode;
/**
* The `itemId` of the currently selected `NavigationItem` (controlled).
*
* Providing this opts into coordinated single-selection and makes `Navigation`
* a controlled component: own this value in your app (typically derived from
* the router) and update it in `onSelect`.
*/
selectedId?: string;
/**
* The initially selected `itemId` (uncontrolled). `Navigation` owns selection
* state internally and updates it as items are clicked. Use this for local,
* non-URL-driven selection; use `selectedId` when the router is the source of
* truth.
*/
defaultSelectedId?: string;
/**
* Called with a `NavigationItem`'s `itemId` when it is clicked. Fires in both
* controlled and uncontrolled modes.
*/
onSelect?: (id: string) => void;
/** Optional value for `data-testid` attribute */
testId?: string;
}
/**
* Sidebar navigation container. Renders a `nav` landmark whose accessible name
* comes from `label`.
*
* ## Selection
* `Navigation` coordinates single-selection across `NavigationItem` children by
* their `itemId`:
* - **Uncontrolled:** pass `defaultSelectedId`; `Navigation` owns the state and
* updates it as items are clicked.
* - **Controlled:** pass `selectedId` (with `onSelect`) and own the value in
* your app — the right choice when the router is the source of truth.
*/
declare const Navigation: React.ForwardRefExoticComponent>;
export default Navigation;
//# sourceMappingURL=index.d.ts.map