import { TemplateRef } from '@angular/core'; import { Color } from '@ionic/core'; /** * Context passed to each tab's template. */ export interface TabbedContentContext { /** The value of the active tab */ $implicit: string; /** The full tab configuration */ tab: TabbedContentTab; /** Index of the tab */ index: number; } /** * Configuration for a single tab. */ export interface TabbedContentTab { /** Unique identifier for the tab */ value: string; /** Display label for the tab button */ label?: string; /** Icon name (Ionicons) */ icon?: string; /** Whether the tab is disabled */ disabled?: boolean; /** Layout direction for icon and label */ layout?: 'icon-start' | 'icon-end' | 'icon-top' | 'icon-bottom'; /** Template to render when this tab is active */ template: TemplateRef; } /** * Metadata for the tabbed-content component. */ export interface TabbedContentMetadata { /** Array of tab configurations */ tabs: TabbedContentTab[]; /** Initially selected tab value (defaults to first tab) */ selectedTab?: string; /** Color theme for the segment control */ color?: Color; /** Allow horizontal scrolling for many tabs */ scrollable?: boolean; /** Enable swipe gesture to change tabs (iOS only) */ swipeGesture?: boolean; /** Visual mode style */ mode?: 'ios' | 'md'; /** Enable fade animation on tab change */ animated?: boolean; /** Animation duration in milliseconds */ animationDuration?: number; /** Additional CSS class for the container */ cssClass?: string; }