related-ui-components 2.1.8 → 2.2.0

package/src/components/TravelBooking/FlightForm.tsx

@@ -1,5 +1,5 @@
 import { ThemeType, useTheme } from "../../theme";
-import React, { useCallback, useMemo, useRef, useState } from "react";
+import React, { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import {
   View,
   Text,
@@ -39,6 +39,13 @@ export interface FlightFormProps {
   }) => void;
   onTextChange?: (text: string) => void;
 
+  onSelectionChange?: (details: {
+    from: LocationData | undefined;
+    to: LocationData | undefined;
+    departure: string | undefined; // Send YYYY-MM-DD
+    return?: string | undefined; // Send YYYY-MM-DD
+  }) => void;
+
   fromLabel?: string;
   fromPlaceholder?: string;
 
@@ -56,34 +63,35 @@ export interface FlightFormProps {
   suggestionData?: FlightSuggestions[];
 
   // --- Style Props ---
-  containerStyle?: StyleProp<ViewStyle>; 
-  inputGroupContainerStyle?: StyleProp<ViewStyle>; 
-  inputWrapperStyle?: StyleProp<ViewStyle>; 
-  customInputContainerStyle?: StyleProp<ViewStyle>; 
-  labelStyle?: StyleProp<TextStyle>; 
+  containerStyle?: StyleProp<ViewStyle>;
+  inputGroupContainerStyle?: StyleProp<ViewStyle>;
+  inputWrapperStyle?: StyleProp<ViewStyle>;
+  customInputContainerStyle?: StyleProp<ViewStyle>;
+  inputStyle?: StyleProp<ViewStyle>;
+  labelStyle?: StyleProp<TextStyle>;
   swapButtonContainerStyle?: StyleProp<ViewStyle>;
   swapButtonStyle?: StyleProp<ViewStyle>;
   swapIconStyle?: StyleProp<TextStyle>;
-  departureRowStyle?: StyleProp<ViewStyle>; 
+  departureRowStyle?: StyleProp<ViewStyle>;
   searchButtonStyle?: StyleProp<ViewStyle>;
-  searchIconStyle?: StyleProp<TextStyle>; 
+  searchIconStyle?: StyleProp<TextStyle>;
 
   // DateRangePicker specific styles (passed down)
   dateRangePickerOuterContainerStyle?: StyleProp<ViewStyle>;
   dateRangePickerLabelStyle?: StyleProp<TextStyle>;
   dateRangePickerInputGroupStyle?: StyleProp<ViewStyle>;
-  dateRangePickerCalendarContainerStyle?: StyleProp<ViewStyle>; 
+  dateRangePickerCalendarContainerStyle?: StyleProp<ViewStyle>;
 
   // SuggestionList specific styles
   suggestionListContainerStyle?: StyleProp<ViewStyle>;
   // Styles for the default suggestion item rendering
-  suggestionItemGroupStyle?: StyleProp<ViewStyle>; 
-  suggestionCityRowStyle?: StyleProp<ViewStyle>; 
-  suggestionCityIconStyle?: StyleProp<TextStyle>; 
-  suggestionCityTextStyle?: StyleProp<TextStyle>; 
+  suggestionItemGroupStyle?: StyleProp<ViewStyle>;
+  suggestionCityRowStyle?: StyleProp<ViewStyle>;
+  suggestionCityIconStyle?: StyleProp<TextStyle>;
+  suggestionCityTextStyle?: StyleProp<TextStyle>;
   suggestionAirportTouchableStyle?: StyleProp<ViewStyle>;
   suggestionAirportIconStyle?: StyleProp<TextStyle>;
-  suggestionAirportTextStyle?: StyleProp<TextStyle>; 
+  suggestionAirportTextStyle?: StyleProp<TextStyle>;
 }
 // --- Component ---
 const FlightForm: React.FC<FlightFormProps> = ({
@@ -130,6 +138,8 @@ const FlightForm: React.FC<FlightFormProps> = ({
   suggestionAirportTouchableStyle,
   suggestionAirportIconStyle,
   suggestionAirportTextStyle,
+  inputStyle,
+  onSelectionChange
 }) => {
   const { theme, isRTL } = useTheme();
   const styles = useMemo(() => themedStyles(theme, isRTL), [theme, isRTL]);
@@ -160,6 +170,15 @@ const FlightForm: React.FC<FlightFormProps> = ({
     onSwapPress?.(currentFrom, currentTo);
   }, [fromLocation, toLocation, onSwapPress]);
 
+  useEffect(() => {
+    onSelectionChange?.({
+      from: fromLocation,
+      to: toLocation,
+      departure: departureDate,
+      return: isOneWay ? undefined : returnDate,
+    });
+  }, [fromLocation, toLocation, departureDate, returnDate, isOneWay, onSelectionChange]);
+
   const handleSearch = useCallback(() => {
     onSearchPress?.({
       from: fromLocation,
@@ -233,6 +252,7 @@ const FlightForm: React.FC<FlightFormProps> = ({
               setFromLocation(text);
               onTextChange?.(text);
             }}
+            inputStyle={inputStyle}
             label={fromLabel}
             value={fromLocation}
             labelStyle={[styles.label, labelStyle]}
@@ -248,7 +268,7 @@ const FlightForm: React.FC<FlightFormProps> = ({
                 }
               }, 150);
             }}
-            containerStyle={customInputContainerStyle}
+            inputContainerStyle={customInputContainerStyle}
           />
           {suggestionData && (
             <SuggestionList
@@ -260,20 +280,22 @@ const FlightForm: React.FC<FlightFormProps> = ({
           )}
         </View>
 
-        <View style={[styles.swapButtonContainer, swapButtonContainerStyle]}>
-          <TouchableOpacity
-            style={[styles.swapButton, swapButtonStyle]}
-            onPress={handleSwap}
-            activeOpacity={0.7}
-          >
-            <Ionicons
-              name={swapIconName}
-              size={20}
-              color={theme.onSurface}
-              style={swapIconStyle}
-            />
-          </TouchableOpacity>
-        </View>
+        {onSwapPress && (
+          <View style={[styles.swapButtonContainer, swapButtonContainerStyle]}>
+            <TouchableOpacity
+              style={[styles.swapButton, swapButtonStyle]}
+              onPress={handleSwap}
+              activeOpacity={0.7}
+            >
+              <Ionicons
+                name={swapIconName}
+                size={20}
+                color={theme.onSurface}
+                style={swapIconStyle}
+              />
+            </TouchableOpacity>
+          </View>
+        )}
 
         {/* Apply inputWrapperStyle */}
         <View style={[styles.inputWrapper, inputWrapperStyle]}>
@@ -285,6 +307,7 @@ const FlightForm: React.FC<FlightFormProps> = ({
             }}
             label={toLabel}
             value={toLocation}
+            inputStyle={inputStyle}
             labelStyle={[styles.label, labelStyle]}
             placeholder={toPlaceholder}
             onFocus={() => {
@@ -292,15 +315,13 @@ const FlightForm: React.FC<FlightFormProps> = ({
               onInputFocus?.(FormInputType.FLIGHT_TO);
             }}
             onBlur={() => {
-              // Delay blur slightly to allow suggestion press
               setTimeout(() => {
                 if (focusedInput === FormInputType.FLIGHT_TO) {
                   setFocusedInput(undefined);
                 }
               }, 150);
             }}
-            // Apply customInputContainerStyle (passed to CustomInput)
-            containerStyle={customInputContainerStyle}
+            inputContainerStyle={customInputContainerStyle}
           />
           {suggestionData && (
             <SuggestionList
@@ -320,13 +341,13 @@ const FlightForm: React.FC<FlightFormProps> = ({
           returnLabel={returnLabel}
           departureLabel={departureLabel}
           outerContainerStyle={[
-            styles.dateRangePickerOuterContainer, 
+            styles.dateRangePickerOuterContainer,
             dateRangePickerOuterContainerStyle,
           ]}
           labelStyle={[labelStyle, dateRangePickerLabelStyle]}
           inputGroupStyle={dateRangePickerInputGroupStyle}
-          calendarContainerStyle={dateRangePickerCalendarContainerStyle} 
-          calendarThemeOverrides={calendarThemeOverrides} 
+          calendarContainerStyle={dateRangePickerCalendarContainerStyle}
+          calendarThemeOverrides={calendarThemeOverrides}
           onDatesChange={(d) => {
             setDepartureDate(d.departure);
             setReturnDate(d.return);
@@ -336,18 +357,20 @@ const FlightForm: React.FC<FlightFormProps> = ({
           initialReturnDate={initialReturnDate}
         />
         {/* Search Button */}
-        <TouchableOpacity
-          style={[styles.searchButton, searchButtonStyle]}
-          onPress={handleSearch}
-          activeOpacity={0.8}
-        >
-          <Ionicons
-            name={searchIconName}
-            size={24}
-            color={theme.onPrimary}
-            style={searchIconStyle}
-          />
-        </TouchableOpacity>
+        {onSearchPress && (
+          <TouchableOpacity
+            style={[styles.searchButton, searchButtonStyle]}
+            onPress={handleSearch}
+            activeOpacity={0.8}
+          >
+            <Ionicons
+              name={searchIconName}
+              size={24}
+              color={theme.onPrimary}
+              style={searchIconStyle}
+            />
+          </TouchableOpacity>
+        )}
       </View>
     </View>
   );

package/src/components/TravelBooking/FlightSummary.tsx

@@ -71,6 +71,9 @@ export interface FlightSummaryProps {
   flightTypesData?: string[];
   flightClassesData?: string[];
 
+  flightTypeLabel?: string;
+  flightClassLabel?: string;
+
   // State & Callbacks
   selection?: FlightSelection; // Renamed from 'selection' for clarity
   onSelectionChange?: (details: FlightSelection) => void;
@@ -100,6 +103,8 @@ const FlightSummary: React.FC<FlightSummaryProps> = ({
   passengersData: passengersProp = DEFAULT_PASSENGERS,
   flightTypesData: flightTypesProp = DEFAULT_FLIGHT_TYPES,
   flightClassesData: flightClassesProp = DEFAULT_FLIGHT_CLASSES,
+  flightClassLabel = "Class",
+  flightTypeLabel = "Type",
   // State & Callbacks
   selection,
   onSelectionChange,
@@ -133,9 +138,9 @@ const FlightSummary: React.FC<FlightSummaryProps> = ({
   const [selectedFlightClass, setSelectedFlightClass] = useState<string>(
     selection?.flightClass ?? flightClasses[0]
   );
-  const [passengerCounts, setPassengerCounts] = useState<Record<string, number>>(
-    selection?.passengers ?? getInitialPassengerCounts(passengersConfig)
-  );
+  const [passengerCounts, setPassengerCounts] = useState<
+    Record<string, number>
+  >(selection?.passengers ?? getInitialPassengerCounts(passengersConfig));
 
   const handleFlightTypeSelect = useCallback(
     (type: string) => {
@@ -162,8 +167,7 @@ const FlightSummary: React.FC<FlightSummaryProps> = ({
         const currentVal = prevCounts[passengerKey];
         const minValue = passengerInfo.minValue;
 
-        const maxValue =
-           passengerInfo.maxValue ?? 99;
+        const maxValue = passengerInfo.maxValue ?? 99;
 
         let newValue = currentVal;
         if (action === "increment") {
@@ -213,36 +217,42 @@ const FlightSummary: React.FC<FlightSummaryProps> = ({
   const renderButtonGroup = (
     items: string[],
     selectedValue: string,
-    onSelect: (item: string) => void
+    onSelect: (item: string) => void,
+    label?: string
   ) => (
-    <View style={[styles.buttonGroupContainer, buttonGroupContainerStyle]}>
-      {items.map((item) => {
-        const isSelected = item === selectedValue;
-        return (
-          <TouchableOpacity
-            key={item}
-            style={[
-              styles.button,
-              buttonStyle,
-              isSelected && styles.selectedButton,
-              isSelected && selectedButtonStyle,
-            ]}
-            onPress={() => onSelect(item)}
-            activeOpacity={0.7}
-          >
-            <Text
+    <View>
+      <Text style={{ color: theme.labelText, fontSize: 12, marginBottom: 6 }}>
+        {label}
+      </Text>
+      <View style={[styles.buttonGroupContainer, buttonGroupContainerStyle]}>
+        {items.map((item) => {
+          const isSelected = item === selectedValue;
+          return (
+            <TouchableOpacity
+              key={item}
               style={[
-                styles.buttonText,
-                buttonTextStyle, 
-                isSelected && styles.selectedButtonText,
-                isSelected && selectedButtonTextStyle,
+                styles.button,
+                buttonStyle,
+                isSelected && styles.selectedButton,
+                isSelected && selectedButtonStyle,
               ]}
+              onPress={() => onSelect(item)}
+              activeOpacity={0.7}
             >
-              {item}
-            </Text>
-          </TouchableOpacity>
-        );
-      })}
+              <Text
+                style={[
+                  styles.buttonText,
+                  buttonTextStyle,
+                  isSelected && styles.selectedButtonText,
+                  isSelected && selectedButtonTextStyle,
+                ]}
+              >
+                {item}
+              </Text>
+            </TouchableOpacity>
+          );
+        })}
+      </View>
     </View>
   );
 
@@ -260,12 +270,13 @@ const FlightSummary: React.FC<FlightSummaryProps> = ({
       {renderButtonGroup(
         flightTypes,
         selectedFlightType,
-        handleFlightTypeSelect
+        handleFlightTypeSelect,
+        flightTypeLabel
       )}
 
       {/* Passengers */}
       <View style={[styles.passengerSection, passengerSectionStyle]}>
-        {passengersConfig.map((passenger) => ( 
+        {passengersConfig.map((passenger) => (
           <View
             key={passenger.key}
             style={[styles.passengerRow, passengerRowStyle]}
@@ -280,10 +291,7 @@ const FlightSummary: React.FC<FlightSummaryProps> = ({
                 {passenger.name}
               </Text>
               <Text
-                style={[
-                  styles.passengerDescription,
-                  passengerDescriptionStyle,
-                ]}
+                style={[styles.passengerDescription, passengerDescriptionStyle]}
               >
                 {passenger.description}
               </Text>
@@ -312,7 +320,8 @@ const FlightSummary: React.FC<FlightSummaryProps> = ({
       {renderButtonGroup(
         flightClasses,
         selectedFlightClass,
-        handleFlightClassSelect
+        handleFlightClassSelect,
+        flightClassLabel
       )}
     </View>
   );
@@ -326,7 +335,7 @@ const themedStyles = (theme: ThemeType, isRTL: boolean) =>
     },
     buttonGroupContainer: {
       flexDirection: isRTL ? "row-reverse" : "row",
-      // marginBottom: 10, 
+      // marginBottom: 10,
       marginTop: 5,
       justifyContent: "flex-start",
       flexWrap: "wrap",
@@ -347,7 +356,7 @@ const themedStyles = (theme: ThemeType, isRTL: boolean) =>
     buttonText: {
       color: theme.onSurface,
       fontWeight: "500",
-      fontSize: 14, 
+      fontSize: 14,
     },
     selectedButtonText: {
       color: theme.onPrimary,

package/src/components/TravelBooking/HotelForm.tsx

@@ -1,5 +1,11 @@
 import { ThemeType, useTheme } from "../../theme";
-import React, { useCallback, useMemo, useRef, useState } from "react";
+import React, {
+  useCallback,
+  useEffect,
+  useMemo,
+  useRef,
+  useState,
+} from "react";
 import {
   View,
   Text,
@@ -15,8 +21,8 @@ import { Ionicons } from "@expo/vector-icons";
 import CustomInput from "../Input/Input";
 import DateRangePicker from "../DateRangePicker/DateRangePicker";
 import { Picker } from "@react-native-picker/picker";
-import SuggestionList from "../Suggestions/SuggestionList"; 
-import { FormInputType, HotelSuggestions } from "./types"; 
+import SuggestionList from "../Suggestions/SuggestionList";
+import { FormInputType, HotelSuggestions } from "./types";
 import { TextInput } from "react-native-gesture-handler";
 
 // --- Helper Types ---
@@ -40,6 +46,13 @@ export interface HotelFormProps {
     nationality: string | undefined;
   }) => void;
 
+  onSelectionChange?: (details: {
+    destination: LocationData | undefined; // Renamed from destintation
+    checkin: string | undefined; // Send YYYY-MM-DD
+    checkout: string | undefined; // Send YYYY-MM-DD
+    nationality: string | undefined;
+  }) => void;
+
   // Labels & Placeholders
   destinationLabel?: string;
   destinationPlaceholder?: string;
@@ -52,22 +65,22 @@ export interface HotelFormProps {
 
   // Data & Config
   suggestionData?: HotelSuggestions[];
-  nationalityData?: { label: string; value: string }[]; 
+  nationalityData?: { label: string; value: string }[];
   calendarThemeOverrides?: object;
 
   // --- Style Props ---
   containerStyle?: StyleProp<ViewStyle>;
-  inputWrapperStyle?: StyleProp<ViewStyle>; 
+  inputWrapperStyle?: StyleProp<ViewStyle>;
   customInputContainerStyle?: StyleProp<ViewStyle>;
-  labelStyle?: StyleProp<TextStyle>; 
-  checkoutRowStyle?: StyleProp<ViewStyle>; 
+  labelStyle?: StyleProp<TextStyle>;
+  checkoutRowStyle?: StyleProp<ViewStyle>;
   searchButtonStyle?: StyleProp<ViewStyle>;
-  searchIconStyle?: StyleProp<TextStyle>; 
+  searchIconStyle?: StyleProp<TextStyle>;
 
   // DateRangePicker specific styles (passed down)
   dateRangePickerOuterContainerStyle?: StyleProp<ViewStyle>;
-  dateRangePickerLabelStyle?: StyleProp<TextStyle>; 
-  dateRangePickerInputGroupStyle?: StyleProp<ViewStyle>; 
+  dateRangePickerLabelStyle?: StyleProp<TextStyle>;
+  dateRangePickerInputGroupStyle?: StyleProp<ViewStyle>;
   dateRangePickerCalendarContainerStyle?: StyleProp<ViewStyle>;
 
   // SuggestionList specific styles
@@ -76,10 +89,10 @@ export interface HotelFormProps {
   suggestionItemTextStyle?: StyleProp<TextStyle>;
 
   // Nationality Picker specific styles
-  nationalityPickerWrapperStyle?: StyleProp<ViewStyle>; 
-  nationalityPickerLabelStyle?: StyleProp<TextStyle>; 
+  nationalityPickerWrapperStyle?: StyleProp<ViewStyle>;
+  nationalityPickerLabelStyle?: StyleProp<TextStyle>;
   pickerContainerStyle?: StyleProp<ViewStyle>;
-  pickerStyle?: StyleProp<TextStyle>; 
+  pickerStyle?: StyleProp<TextStyle>;
 }
 
 // Default Nationality Data (can be overridden by prop)
@@ -137,6 +150,7 @@ const HotelForm: React.FC<HotelFormProps> = ({
   nationalityPickerLabelStyle,
   pickerContainerStyle,
   pickerStyle,
+  onSelectionChange,
 }) => {
   const { theme, isRTL } = useTheme();
   const styles = useMemo(() => themedStyles(theme, isRTL), [theme, isRTL]);
@@ -158,6 +172,21 @@ const HotelForm: React.FC<HotelFormProps> = ({
   >(initialNationality);
   const [focusedInput, setFocusedInput] = useState<FormInputType>();
 
+  useEffect(() => {
+    onSelectionChange?.({
+      destination: destination,
+      checkin: checkinDate,
+      checkout: checkoutDate,
+      nationality: selectedNationality,
+    });
+  }, [
+    destination,
+    checkinDate,
+    checkoutDate,
+    selectedNationality,
+    onSelectionChange,
+  ]);
+
   // --- Handlers ---
   const handleSearch = useCallback(() => {
     onSearchPress?.({
@@ -236,8 +265,8 @@ const HotelForm: React.FC<HotelFormProps> = ({
         ]}
         labelStyle={[labelStyle, dateRangePickerLabelStyle]}
         inputGroupStyle={dateRangePickerInputGroupStyle}
-        calendarContainerStyle={dateRangePickerCalendarContainerStyle} 
-        calendarThemeOverrides={calendarThemeOverrides} 
+        calendarContainerStyle={dateRangePickerCalendarContainerStyle}
+        calendarThemeOverrides={calendarThemeOverrides}
         onDatesChange={(d) => {
           setCheckinDate(d.departure);
           setCheckoutDate(d.return);
@@ -249,15 +278,12 @@ const HotelForm: React.FC<HotelFormProps> = ({
 
       <View style={[styles.checkoutRow, checkoutRowStyle]}>
         <View
-          style={[styles.nationalityPickerWrapper, nationalityPickerWrapperStyle]}
+          style={[
+            styles.nationalityPickerWrapper,
+            nationalityPickerWrapperStyle,
+          ]}
         >
-          <Text
-            style={[
-              styles.label,
-              labelStyle, 
-              nationalityPickerLabelStyle, 
-            ]}
-          >
+          <Text style={[styles.label, labelStyle, nationalityPickerLabelStyle]}>
             {nationalityLabel}
           </Text>
           <View style={[styles.pickerContainer, pickerContainerStyle]}>
@@ -269,7 +295,7 @@ const HotelForm: React.FC<HotelFormProps> = ({
             >
               {nationalityData.map((nat) => (
                 <Picker.Item
-                  key={nat.value || "placeholder"} 
+                  key={nat.value || "placeholder"}
                   label={nat.label}
                   value={nat.value}
                   enabled={nat.value !== undefined}
@@ -279,18 +305,20 @@ const HotelForm: React.FC<HotelFormProps> = ({
           </View>
         </View>
 
-        <TouchableOpacity
-          style={[styles.searchButton, searchButtonStyle]}
-          onPress={handleSearch}
-          activeOpacity={0.8}
-        >
-          <Ionicons
-            name={searchIconName}
-            size={24}
-            color={theme.onPrimary}
-            style={searchIconStyle}
-          />
-        </TouchableOpacity>
+        {onSearchPress && (
+          <TouchableOpacity
+            style={[styles.searchButton, searchButtonStyle]}
+            onPress={handleSearch}
+            activeOpacity={0.8}
+          >
+            <Ionicons
+              name={searchIconName}
+              size={24}
+              color={theme.onPrimary}
+              style={searchIconStyle}
+            />
+          </TouchableOpacity>
+        )}
       </View>
     </View>
   );
@@ -306,8 +334,8 @@ const themedStyles = (theme: ThemeType, isRTL: boolean) =>
       borderBottomLeftRadius: 8,
     },
     inputWrapper: {
-      marginBottom: 15, 
-      position: "relative", 
+      marginBottom: 15,
+      position: "relative",
     },
     label: {
       color: theme.labelText,
@@ -318,12 +346,12 @@ const themedStyles = (theme: ThemeType, isRTL: boolean) =>
       marginBottom: 6,
     },
     dateRangePickerOuterContainer: {
-      marginTop: 10, 
+      marginTop: 10,
     },
     checkoutRow: {
       flexDirection: isRTL ? "row-reverse" : "row",
-      alignItems: "flex-end", 
-      marginTop: 20, 
+      alignItems: "flex-end",
+      marginTop: 20,
       gap: 10,
     },
     nationalityPickerWrapper: {
@@ -334,8 +362,8 @@ const themedStyles = (theme: ThemeType, isRTL: boolean) =>
       borderColor: theme.border,
       borderRadius: 8,
       backgroundColor: theme.surface,
-      justifyContent: "center", 
-      height: 50, 
+      justifyContent: "center",
+      height: 50,
     },
     picker: {
       width: "100%",

package/src/components/TravelBooking/index.ts

@@ -1,20 +1,20 @@
 
-// export { default, type TravelBookingProps } from "./TravelBooking";
-// export * from "./TravelBooking"
+export { default, type TravelBookingProps } from "./TravelBooking";
+export * from "./TravelBooking"
 
-// export { default as CarRentalForm, type CarRentalFormProps } from "./CarRentalForm";
-// export * from "./CarRentalForm"
-// export { default as FlightForm, type FlightFormProps } from "./FlightForm";
-// export * from "./FlightForm";
-// export { default as HotelForm, type HotelFormProps } from "./HotelForm";
-// export * from "./HotelForm";
-// export { default as SummaryBar, type SummaryBarProps, type SelectionCallbackDataType } from "./SummaryBar";
-// export * from "./SummaryBar";
-// export { default as TabSelector, type TabSelectorProps } from "./TabSelector";
-// export * from "./TabSelector"
-// export { default as FlightSummary, type FlightSummaryProps, type FlightSelection } from "./FlightSummary";
-// export * from "./FlightSummary"
-// export { default as HotelSummary, type HotelSummaryProps, type RoomState } from "./HotelSummary";
-// export * from "./HotelSummary"
+export { default as CarRentalForm, type CarRentalFormProps } from "./CarRentalForm";
+export * from "./CarRentalForm"
+export { default as FlightForm, type FlightFormProps } from "./FlightForm";
+export * from "./FlightForm";
+export { default as HotelForm, type HotelFormProps } from "./HotelForm";
+export * from "./HotelForm";
+export { default as SummaryBar, type SummaryBarProps, type SelectionCallbackDataType } from "./SummaryBar";
+export * from "./SummaryBar";
+export { default as TabSelector, type TabSelectorProps } from "./TabSelector";
+export * from "./TabSelector"
+export { default as FlightSummary, type FlightSummaryProps, type FlightSelection } from "./FlightSummary";
+export * from "./FlightSummary"
+export { default as HotelSummary, type HotelSummaryProps, type RoomState } from "./HotelSummary";
+export * from "./HotelSummary"
 
-// export * from "./types";
+export * from "./types";

package/src/components/index.ts

@@ -17,4 +17,5 @@ export * from "./RedeemedVoucher";
 export * from "./Button";
 export * from "./Skeleton";
 export * from "./CustomIcon"
-export * from "./CarouselCardStack";
+export * from "./CarouselCardStack";
+export * from "./TravelBooking";