// // src/components/TravelBooking.tsx (or wherever TravelBooking is)
// import React, { useState, useCallback, useMemo, useEffect } from "react";
// import { View, StyleSheet, StyleProp, ViewStyle, TextStyle } from "react-native"; // Import style types
// import TabSelector, { TabSelectorProps } from "./TabSelector"; // Adjust import path
// import FlightForm, { FlightFormProps } from "./FlightForm"; // Adjust import path
// import HotelForm, { HotelFormProps } from "./HotelForm"; // Adjust import path
// import CarRentalForm, {
//   CarRentalFormProps,
//   mockCarSuggestions,
// } from "./CarRentalForm"; // Adjust import path
// import { ThemeType, useTheme } from "../../theme"; // Adjust import path
// import SummaryBar, {
//   SelectionCallbackDataType,
//   SummaryBarProps,
// } from "./SummaryBar"; // Adjust import path
// import {
//   FlightSuggestions,
//   FormInputType,
//   HotelSuggestions,
//   CarSuggestions,
// } from "./types"; // Adjust import path
// import { FlightSelection, FlightSummaryProps } from "./FlightSummary";
// import { HotelSummaryProps, RoomState } from "./HotelSummary";

// // Define the possible tab names (can be overridden via props)
// type DefaultBookingType = "Flights" | "Hotels" | "Car Rentals";
// const DEFAULT_TABS: DefaultBookingType[] = ["Flights", "Hotels", "Car Rentals"];

// // Mock Data (Keep accessible for potential defaults)
// const DEFAULT_MOCK_FLIGHT_SUGGESTIONS: FlightSuggestions[] = [
//   {
//     id: 1,
//     city: "London",
//     value: "London, United Kingdom",
//     airports: [
//       "Heathrow Airport (LHR)",
//       "Gatwick Airport (LGW)",
//       "Stansted Airport (STN)",
//     ],
//   },
//   {
//     id: 2,
//     city: "New York",
//     value: "New York, USA",
//     airports: [
//       "John F. Kennedy Intl (JFK)",
//       "LaGuardia Airport (LGA)",
//       "Newark Liberty Intl (EWR)",
//     ],
//   },
// ];
// const DEFAULT_MOCK_HOTEL_SUGGESTIONS: HotelSuggestions[] = [
//   { id: 1, city: "Beirut", country: "Lebanon", value: "BEIRUT, LEBANON" },
//   {
//     id: 2,
//     city: "Dubai",
//     country: "United Arab Emirates",
//     value: "DUBAI, UNITED ARAB EMIRATES",
//   },
// ];
// const DEFAULT_MOCK_CAR_SUGGESTIONS: CarSuggestions[] = mockCarSuggestions;

// // --- TravelBooking Props Interface ---
// export interface TravelBookingProps {
//   /** Array of tab names. Defaults to ['Flights', 'Hotels', 'Car Rentals'] */
//   tabs?: string[];
//   /** The initially selected tab. Defaults to the first tab in the `tabs` array. */
//   initialTab?: string;
//   /** Callback when the selected tab changes */
//   onTabChange?: (tab: string) => void;
//   /** Callback when the search button is pressed in any form */
//   onSearch?: (details: any) => void;
//   /** Callback when any form input gains focus */
//   onInputFocus?: (input: FormInputType) => void;
//   /** Callback when text changes in location inputs */
//   onTextChange?: (text: string) => void;

//   /** Initial selection state for FlightSummary (if mode is 'flight') */
//   initialFlightSelection?: FlightSelection;
//   /** Initial selection state for HotelSummary (if mode is 'hotel') */
//   initialHotelSelection?: RoomState[];
//   /** Callback when the selection in SummaryBar changes */
//   onSummarySelectionChange?: (selection: SelectionCallbackDataType) => void;

//   /** Suggestion data for FlightForm */
//   flightSuggestionData?: FlightSuggestions[];
//   /** Suggestion data for HotelForm */
//   hotelSuggestionData?: HotelSuggestions[];
//   /** Suggestion data for CarRentalForm */
//   carSuggestionData?: CarSuggestions[];

//   // --- Common Style Props ---
//   /** Style for the root container of each form */
//   formContainerStyle?: StyleProp<ViewStyle>;
//   /** Style for input labels */
//   labelStyle?: StyleProp<TextStyle>;
//   /** Style for the CustomInput's TextInput component */
//   inputStyle?: StyleProp<ViewStyle>; // Renamed from commonInputStyle for clarity
//   /** Style for the touchable wrapper around date displays (if applicable) */
//   inputTouchableStyle?: StyleProp<ViewStyle>;
//   /** Style for the text inside inputs or date displays */
//   inputTextStyle?: StyleProp<TextStyle>;
//   /** Style for the container holding the date picker(s) and search button */
//   dateSearchRowStyle?: StyleProp<ViewStyle>;
//   /** Style for the individual date display groups within DateRangePicker */
//   dateInputGroupStyle?: StyleProp<ViewStyle>;
//   /** Style for the search button */
//   searchButtonStyle?: StyleProp<ViewStyle>;
//   /** Style for the search icon */
//   searchIconStyle?: StyleProp<TextStyle>;
//   /** Theme overrides for the calendar component */
//   calendarThemeOverrides?: object;
//   /** Style for the container wrapping the calendar modal/view */
//   calendarContainerStyle?: StyleProp<ViewStyle>;
//   /** Style for the container wrapping the swap button (Flights/Cars) */
//   swapButtonContainerStyle?: StyleProp<ViewStyle>;
//   /** Style for the swap button itself (Flights/Cars) */
//   swapButtonStyle?: StyleProp<ViewStyle>;
//   /** Style for the swap icon (Flights/Cars) */
//   swapIconStyle?: StyleProp<TextStyle>;
//   /** Style for the container wrapping the input fields (Flights/Cars) */
//   inputGroupContainerStyle?: StyleProp<ViewStyle>; // Added for consistency

//   // --- Nested Props for Child Components ---

//   /** Props to pass down to the TabSelector component */
//   tabSelectorProps?: Omit<
//     TabSelectorProps,
//     "tabs" | "initialTab" | "onTabChange" // Controlled by TravelBooking
//   >;

//   /** Props to pass down to the SummaryBar component */
//   summaryBarProps?: Omit<
//     SummaryBarProps,
//     | "mode"
//     | "initialSelection"
//     | "onSelectionChange"
//     | "flightProps"
//     | "hotelProps" // Controlled or derived by TravelBooking
//   >;

//   /** Props to pass down to the FlightSummary component (via SummaryBar) */
//   flightSummaryProps?: Omit<
//     FlightSummaryProps,
//     "selection" | "onSelectionChange" // Controlled by SummaryBar/TravelBooking
//   >;

//   /** Props to pass down to the HotelSummary component (via SummaryBar) */
//   hotelSummaryProps?: Omit<
//     HotelSummaryProps,
//     "selection" | "onSelectionChange" // Controlled by SummaryBar/TravelBooking
//   >;

//   /** Props to pass down to the FlightForm component */
//   /** Props to pass down to the FlightForm component */
//   flightFormProps?: Omit<
//     FlightFormProps,
//     "isOneWay" | "onSearchPress" | "onInputFocus" | "suggestionData" | "onTextChange" // Controlled or derived by TravelBooking
//   >;

//   /** Props to pass down to the HotelForm component */
//   hotelFormProps?: Omit<
//     HotelFormProps,
//     "onSearchPress" | "onInputFocus" | "suggestionData" | "onTextChange" // Controlled by TravelBooking
//   >;

//   /** Props to pass down to the CarRentalForm component */
//   carRentalFormProps?: Omit<
//     CarRentalFormProps,
//     "onSearchPress" | "onInputFocus" | "suggestionData" | "onTextChange"// Controlled by TravelBooking
//   >;
// }

// // --- TravelBooking Component Implementation ---
// const TravelBooking: React.FC<TravelBookingProps> = ({
//   tabs = DEFAULT_TABS,
//   initialTab,
//   onTabChange,
//   onSearch,
//   initialFlightSelection,
//   initialHotelSelection,
//   onSummarySelectionChange,
//   flightSuggestionData = DEFAULT_MOCK_FLIGHT_SUGGESTIONS, // Provide defaults
//   hotelSuggestionData = DEFAULT_MOCK_HOTEL_SUGGESTIONS, // Provide defaults
//   carSuggestionData = DEFAULT_MOCK_CAR_SUGGESTIONS, // Provide defaults
//   tabSelectorProps,
//   summaryBarProps,
//   flightFormProps,
//   hotelFormProps,
//   carRentalFormProps,
//   onInputFocus,
//   onTextChange,
//   // Destructure common style props
//   formContainerStyle,
//   labelStyle,
//   inputStyle,
//   inputTouchableStyle,
//   inputTextStyle,
//   dateSearchRowStyle,
//   dateInputGroupStyle,
//   searchButtonStyle,
//   searchIconStyle,
//   calendarThemeOverrides,
//   calendarContainerStyle,
//   swapButtonContainerStyle,
//   swapButtonStyle,
//   swapIconStyle,
//   inputGroupContainerStyle, // Added
// }) => {
//   const { theme } = useTheme();
//   const styles = useMemo(() => themedStyles(theme), [theme]);

//   const actualInitialTab = useMemo(
//     () => initialTab ?? (tabs.length > 0 ? tabs[0] : ""),
//     [initialTab, tabs]
//   );

//   const [selectedTab, setSelectedTab] = useState<string>(actualInitialTab);
//   const [selectedOptions, setSelectedOptions] = useState<
//     SelectionCallbackDataType | undefined
//   >(
//     actualInitialTab === tabs[0] && tabs[0] === "Flights"
//       ? initialFlightSelection
//       : actualInitialTab === tabs[1] && tabs[1] === "Hotels"
//       ? initialHotelSelection
//       : undefined
//   );

//   // --- Handlers ---
//   const handleTabChange = useCallback(
//     (tab: string) => {
//       setSelectedTab(tab);
//       if (tab === "Flights") {
//         setSelectedOptions(initialFlightSelection);
//       } else if (tab === "Hotels") {
//         setSelectedOptions(initialHotelSelection);
//       } else {
//         setSelectedOptions(undefined);
//       }
//       onTabChange?.(tab);
//     },
//     [onTabChange, initialFlightSelection, initialHotelSelection]
//   );

//   const handleInternalSummarySelectionChange = useCallback(
//     (selection: SelectionCallbackDataType) => {
//       setSelectedOptions(selection);
//       onSummarySelectionChange?.(selection);
//     },
//     [onSummarySelectionChange]
//   );

//   const handleInternalSearch = useCallback(
//     (details: any) => {
//       console.log("Internal Search Triggered:", details);
//       onSearch?.(details);
//     },
//     [onSearch]
//   );

//   const handleInternalTextChange = useCallback(
//     (text: string) => {
//       onTextChange?.(text);
//     },
//     [onTextChange] // Added dependency
//   );

//   const handleInternalInputFocus = useCallback(
//     (input: FormInputType) => {
//       console.log("Input Focused:", input);
//       onInputFocus?.(input);
//     },
//     [onInputFocus] // Added dependency
//   );

//   // Determine SummaryBar mode
//   const summaryBarMode = useMemo(() => {
//     if (selectedTab === "Flights") return "flight";
//     if (selectedTab === "Hotels") return "hotel";
//     return undefined;
//   }, [selectedTab]);

//   // --- Render Content Logic ---
//   const renderContent = () => {
//     const commonFormProps = {
//       containerStyle: formContainerStyle,
//       labelStyle: labelStyle,
//       inputStyle: inputStyle,
//       inputTouchableStyle: inputTouchableStyle,
//       inputTextStyle: inputTextStyle,
//       dateInputGroupStyle: dateInputGroupStyle,
//       searchButtonStyle: searchButtonStyle,
//       searchIconStyle: searchIconStyle,
//       calendarThemeOverrides: calendarThemeOverrides,
//       calendarContainerStyle: calendarContainerStyle,
//     };

//     switch (selectedTab) {
//       case "Flights": {
//         let isOneWay = false;
//         if (
//           selectedOptions &&
//           typeof selectedOptions === "object" &&
//           !Array.isArray(selectedOptions) &&
//           "flightType" in selectedOptions
//         ) {
//           isOneWay = selectedOptions.flightType === "ONE_WAY";
//         }
//         return (
//           <FlightForm
//             // Pass common props first
//             {...commonFormProps}
//             departureRowStyle={dateSearchRowStyle} // Map specific row style
//             swapButtonContainerStyle={swapButtonContainerStyle} // Pass swap styles
//             swapButtonStyle={swapButtonStyle}
//             swapIconStyle={swapIconStyle}

//             // Pass specific FlightForm props (will override common ones if keys match)
//             {...flightFormProps}

//             // Pass controlled props
//             isOneWay={isOneWay}
//             onSearchPress={handleInternalSearch}
//             onInputFocus={handleInternalInputFocus}
//             onTextChange={handleInternalTextChange}
//             suggestionData={flightSuggestionData}
//           />
//         );
//       }
//       case "Hotels":
//         return (
//           <HotelForm
//             // Pass common props first
//             {...commonFormProps}
//             checkoutRowStyle={dateSearchRowStyle} // Map specific row style

//             // Pass specific HotelForm props (will override common ones if keys match)
//             {...hotelFormProps}

//             // Pass controlled props
//             onSearchPress={handleInternalSearch}
//             onInputFocus={handleInternalInputFocus}
//             onTextChange={handleInternalTextChange}
//             suggestionData={hotelSuggestionData}
//           />
//         );
//       case "Car Rentals":
//         return (
//           <CarRentalForm
//             // Pass common props first
//             {...commonFormProps}
//             pickupRowStyle={dateSearchRowStyle} // Map specific row style
//             swapButtonContainerStyle={swapButtonContainerStyle} // Pass swap styles
//             swapButtonStyle={swapButtonStyle}
//             swapIconStyle={swapIconStyle}
//             inputGroupStyle={inputGroupContainerStyle} // Map input group style

//             // Pass specific CarRentalForm props (will override common ones if keys match)
//             {...carRentalFormProps}

//             // Pass controlled props
//             onSearchPress={handleInternalSearch}
//             onInputFocus={handleInternalInputFocus}
//             onTextChange={handleInternalTextChange}
//             suggestionData={carSuggestionData}
//           />
//         );
//       default:
//         console.warn(`No content defined for tab: ${selectedTab}`);
//         return null;
//     }
//   };

//   return (
//     <View style={styles.container}>
//       {/* Conditionally render SummaryBar */}
//       {summaryBarMode && (
//         <SummaryBar
//           {...summaryBarProps}
//           mode={summaryBarMode}
//           onSelectionChange={handleInternalSummarySelectionChange}
//         />
//       )}

//       <TabSelector
//         {...tabSelectorProps}
//         tabs={tabs}
//         initialTab={selectedTab} // Use state for controlled component
//         onTabChange={handleTabChange}
//       />

//       <View style={styles.contentContainer}>{renderContent()}</View>
//     </View>
//   );
// };

// const themedStyles = (theme: ThemeType) =>
//   StyleSheet.create({
//     container: {
//       // Removed flex: 1 to allow content to determine height naturally
//     },
//     contentContainer: {
//       // Removed flex: 1
//     },
//   });

// export default TravelBooking;