alouette
Version:
A modern, customizable design system built on top of NativeWind v5 with configurable defaults
31 lines • 1.37 kB
TypeScript
import type { ReactNode } from "react";
import { type SegmentedOrientation, type SegmentedVariant, type SelectionGroupProps } from "../selection/SelectionContext";
export interface NavBarProps extends SelectionGroupProps {
"aria-label"?: string;
/**
* `vertical` stacks the destinations as a sidebar rail, each item spanning
* the bar's width. The bar is content-width; give it a `className` width to
* fix the rail.
*/
orientation?: SegmentedOrientation;
/**
* The bar fills the width it is given instead of hugging its destinations,
* which share it equally — what a stacked `AppHeader` wants for the line it
* hands to the navigation.
*/
stretch?: boolean;
/**
* `icon` renders the destinations as square icon-only chips in a pill-shaped
* bar; each item's `label` stays its accessible name, so an item must carry
* an `icon`.
*/
variant?: SegmentedVariant;
className?: string;
}
/**
* Segmented navigation between destinations. `value` is the current
* destination — it matches an item's `href`, and is usually owned by the app's
* router, so pass it controlled.
*/
export declare function NavBar({ value, defaultValue, onValueChange, accent, disabled, orientation, stretch, variant, children, ...props }: NavBarProps): ReactNode;
//# sourceMappingURL=NavBar.d.ts.map