import { Color } from '@ionic/core'; /** * Badge configuration for a nav item */ export interface BottomNavBadge { /** Badge text (e.g., "3", "NEW") */ text?: string; /** Badge color */ color?: Color | string; /** Badge background color */ backgroundColor?: Color | string; /** Show as dot only (no text) */ dot?: boolean; } /** * Icon configuration - supports multiple icon sources */ export interface BottomNavIcon { /** Ionicon name for inactive state (e.g., 'home-outline') */ default: string; /** Ionicon name for active state (e.g., 'home') - defaults to default if not provided */ active?: string; } /** * Configuration for a single nav tab item */ export interface BottomNavTab { /** Unique identifier for the tab */ token: string; /** Icon configuration */ icon: BottomNavIcon; /** Static label text */ label?: string; /** i18n key for label */ labelKey?: string; /** Route to navigate to (supports string or array format) */ route: string | string[]; /** Routes that should also mark this tab as active (for nested routes) */ activeRoutes?: string[]; /** Badge configuration */ badge?: BottomNavBadge; /** Whether the tab is disabled */ disabled?: boolean; /** Aria label for accessibility */ ariaLabel?: string; } /** * Configuration for the central FAB button (optional) */ export interface BottomNavFab { /** Icon name */ icon: string; /** FAB color */ color?: Color | string; /** FAB size */ size?: 'small' | 'default'; /** Route to navigate to (if navigation action) */ route?: string | string[]; /** Whether this is an action (emits event) or navigation */ isAction?: boolean; /** Aria label for accessibility */ ariaLabel?: string; } /** * Theme configuration for bottom nav */ export interface BottomNavTheme { /** Background color (CSS variable or color value) */ background?: string; /** Active tab color */ activeColor?: Color | string; /** Inactive tab color */ inactiveColor?: Color | string; /** Border radius for the nav bar */ borderRadius?: string; /** Whether to show a top border/shadow */ elevated?: boolean; /** Blur effect for translucent background */ translucent?: boolean; /** Floating island style - detached from edges with rounded corners */ floating?: boolean; } /** * Click event emitted by bottom nav */ export interface BottomNavClickEvent { /** Token of the clicked item */ token: string; /** Whether it's the FAB button */ isFab: boolean; /** The route if navigation occurred */ route?: string | string[]; } /** * Main metadata for val-bottom-nav component */ export interface BottomNavMetadata { /** Array of tab configurations */ tabs: BottomNavTab[]; /** Central FAB button configuration (optional) */ fab?: BottomNavFab; /** i18n namespace for labels */ i18nNamespace?: string; /** Theme configuration */ theme?: BottomNavTheme; /** Hide labels (icon-only mode) */ hideLabels?: boolean; /** Safe area padding for iOS notch */ safeArea?: boolean; /** Animation style */ animation?: 'fade' | 'scale' | 'slide' | 'none'; /** Cap del ancho de la barra. Token sm|md|lg|xl|full o valor CSS crudo. Default: 'md' (720px) — bottom-nav típicamente tiene pocos tabs y se ve mejor estrecho aunque el contenido use 'xl' */ maxWidth?: 'sm' | 'md' | 'lg' | 'xl' | 'full' | string; } /** * Default values for BottomNavMetadata */ export declare const BOTTOM_NAV_DEFAULTS: Required> & { theme: Required; };