related-ui-components 1.3.3 → 1.3.5

package/lib/module/components/NumericStepper/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["default","NumericStepper"],"sourceRoot":"..\\..\\..\\..\\src","sources":["components/NumericStepper/index.ts"],"mappings":";;AAAA,SAAQA,OAAO,IAAIC,cAAc,QAAO,qBAAkB;AAC1D,cAAc,qBAAkB","ignoreList":[]}

package/lib/module/components/SelectAmount/SelectAmount.js

@@ -0,0 +1,184 @@
+"use strict";
+
+import { useCallback, useMemo, useRef, useState } from "react";
+import { useTheme } from "../../theme/index.js";
+import { View, StyleSheet, Text, TouchableOpacity } from "react-native";
+import Slider from "@react-native-community/slider";
+import NumericStepper from "../NumericStepper/NumericStepper.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+const SelectAmount = ({
+  isRTL,
+  conversionRate = 20,
+  minValue = 1,
+  maxValue = 1000,
+  pointsValue = 1,
+  step = 20,
+  title,
+  buttonText = "Redeem",
+  currencyLabel = "SAR",
+  pointsLabel = "points",
+  rowStyle,
+  labelStyle,
+  titleStyle,
+  containerStyle,
+  actionButtonStyle,
+  actionButtonTextStyle,
+  sliderContainerStyle,
+  stepperButtonStyle,
+  stepperButtonTextStyle,
+  stepperValueTextStyle,
+  currencyValueTextStyle,
+  onValueChange,
+  onClick
+}) => {
+  const {
+    theme,
+    isRTL: rtl
+  } = useTheme();
+  isRTL = isRTL || rtl;
+  const styles = useMemo(() => themedStyles(theme, isRTL), [theme, isRTL]);
+  const sliding = useRef(false);
+  const clampedInitialValue = Math.max(minValue, Math.min(maxValue, pointsValue));
+  const [currentValue, setCurrentValue] = useState(clampedInitialValue);
+  const currencyValue = useMemo(() => {
+    return conversionRate > 0 ? Math.ceil(currentValue / conversionRate) : 0;
+  }, [currentValue, conversionRate]);
+  const handleValueChange = useCallback(newValue => {
+    let clampedValue = Math.max(minValue, Math.min(maxValue, newValue));
+    if (clampedValue !== currentValue && sliding.current) {
+      setCurrentValue(Math.round(clampedValue));
+      onValueChange?.(clampedValue);
+    }
+  }, [minValue, maxValue, step, currentValue]);
+  const handleIncrement = () => {
+    setCurrentValue(prev => prev + step);
+  };
+  const handleDecrement = () => {
+    setCurrentValue(prev => prev - step);
+  };
+  return /*#__PURE__*/_jsxs(View, {
+    style: [styles.mainContainer, containerStyle],
+    children: [title && /*#__PURE__*/_jsx(Text, {
+      style: [styles.title, titleStyle],
+      children: title
+    }), /*#__PURE__*/_jsxs(View, {
+      children: [/*#__PURE__*/_jsxs(View, {
+        style: [styles.row, rowStyle],
+        children: [/*#__PURE__*/_jsx(Text, {
+          style: [styles.label, labelStyle],
+          children: pointsLabel
+        }), /*#__PURE__*/_jsx(NumericStepper, {
+          value: currentValue,
+          minValue: minValue,
+          maxValue: maxValue,
+          onIncrement: handleIncrement,
+          onDecrement: handleDecrement,
+          isRTL: isRTL,
+          buttonStyle: stepperButtonStyle,
+          buttonTextStyle: stepperButtonTextStyle,
+          valueTextStyle: stepperValueTextStyle
+        })]
+      }), /*#__PURE__*/_jsxs(View, {
+        style: [styles.row, rowStyle],
+        children: [/*#__PURE__*/_jsx(Text, {
+          style: [styles.label, labelStyle],
+          children: currencyLabel
+        }), /*#__PURE__*/_jsxs(View, {
+          style: {
+            flexDirection: "row"
+          },
+          children: [/*#__PURE__*/_jsx(View, {
+            style: [styles.controlButton, {
+              opacity: 0
+            }]
+          }), /*#__PURE__*/_jsx(Text, {
+            style: [styles.currencyValueText, currencyValueTextStyle],
+            children: currencyValue
+          }), /*#__PURE__*/_jsx(View, {
+            style: [styles.controlButton, {
+              opacity: 0
+            }]
+          })]
+        })]
+      }), /*#__PURE__*/_jsx(Slider, {
+        step: step,
+        minimumValue: minValue,
+        maximumValue: maxValue,
+        onValueChange: handleValueChange,
+        onSlidingStart: () => sliding.current = true,
+        onSlidingComplete: () => sliding.current = false,
+        minimumTrackTintColor: theme.primary,
+        maximumTrackTintColor: theme.primary,
+        thumbTintColor: theme.primary,
+        inverted: isRTL,
+        style: sliderContainerStyle
+      })]
+    }), /*#__PURE__*/_jsx(TouchableOpacity, {
+      style: [styles.actionButton, actionButtonStyle],
+      onPress: () => onClick?.(currentValue),
+      children: /*#__PURE__*/_jsx(Text, {
+        style: [styles.actionButtonText, actionButtonTextStyle],
+        children: buttonText
+      })
+    })]
+  });
+};
+const themedStyles = (theme, isRTL) => StyleSheet.create({
+  mainContainer: {
+    width: "100%",
+    backgroundColor: theme.surface,
+    padding: 16
+  },
+  row: {
+    flexDirection: isRTL ? "row-reverse" : "row",
+    justifyContent: "space-between",
+    alignItems: "center",
+    marginBottom: 12
+  },
+  title: {
+    fontSize: 18,
+    fontWeight: "bold",
+    color: theme.onSurface,
+    marginBottom: 16,
+    textAlign: isRTL ? "right" : "left"
+  },
+  label: {
+    fontSize: 14,
+    color: theme.onSurface
+  },
+  controlButton: {
+    backgroundColor: theme.secondary,
+    width: 36,
+    height: 36,
+    borderRadius: 18,
+    justifyContent: "center",
+    alignItems: "center"
+  },
+  actionButton: {
+    backgroundColor: theme.primary,
+    paddingVertical: 12,
+    paddingHorizontal: 20,
+    borderRadius: 6,
+    alignItems: "center",
+    marginTop: 16
+  },
+  valueText: {
+    fontSize: 16,
+    color: theme.onSurface,
+    minWidth: 50,
+    textAlign: "center",
+    marginHorizontal: 8
+  },
+  currencyValueText: {
+    fontSize: 16,
+    color: theme.primary,
+    minWidth: 50,
+    textAlign: "center",
+    marginHorizontal: 8
+  },
+  actionButtonText: {
+    color: theme.onPrimary
+  }
+});
+export default SelectAmount;
+//# sourceMappingURL=SelectAmount.js.map

package/lib/module/components/SelectAmount/SelectAmount.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["useCallback","useMemo","useRef","useState","useTheme","View","StyleSheet","Text","TouchableOpacity","Slider","NumericStepper","jsx","_jsx","jsxs","_jsxs","SelectAmount","isRTL","conversionRate","minValue","maxValue","pointsValue","step","title","buttonText","currencyLabel","pointsLabel","rowStyle","labelStyle","titleStyle","containerStyle","actionButtonStyle","actionButtonTextStyle","sliderContainerStyle","stepperButtonStyle","stepperButtonTextStyle","stepperValueTextStyle","currencyValueTextStyle","onValueChange","onClick","theme","rtl","styles","themedStyles","sliding","clampedInitialValue","Math","max","min","currentValue","setCurrentValue","currencyValue","ceil","handleValueChange","newValue","clampedValue","current","round","handleIncrement","prev","handleDecrement","style","mainContainer","children","row","label","value","onIncrement","onDecrement","buttonStyle","buttonTextStyle","valueTextStyle","flexDirection","controlButton","opacity","currencyValueText","minimumValue","maximumValue","onSlidingStart","onSlidingComplete","minimumTrackTintColor","primary","maximumTrackTintColor","thumbTintColor","inverted","actionButton","onPress","actionButtonText","create","width","backgroundColor","surface","padding","justifyContent","alignItems","marginBottom","fontSize","fontWeight","color","onSurface","textAlign","secondary","height","borderRadius","paddingVertical","paddingHorizontal","marginTop","valueText","minWidth","marginHorizontal","onPrimary"],"sourceRoot":"..\\..\\..\\..\\src","sources":["components/SelectAmount/SelectAmount.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/components/SelectAmount/index.js

@@ -0,0 +1,4 @@
+// export {default as SelectAmount} from "./SelectAmount";
+// export * from "./SelectAmount";
+"use strict";
+//# sourceMappingURL=index.js.map

package/lib/module/components/SelectAmount/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sourceRoot":"..\\..\\..\\..\\src","sources":["components/SelectAmount/index.ts"],"mappings":"AAAA;AACA;AAAA","ignoreList":[]}

package/lib/module/components/Suggestions/SuggestionList.js

@@ -0,0 +1,92 @@
+"use strict";
+
+import React from "react"; // Ensure React is imported
+import { View, Text, FlatList, StyleSheet
+
+// Import this type
+} from "react-native";
+import { useTheme } from "@/theme"; // Adjust import path
+import { jsx as _jsx } from "react/jsx-runtime";
+const SuggestionList = ({
+  data,
+  visible,
+  renderItemContent,
+  containerStyle,
+  itemStyle,
+  // Style for the default wrapper
+  itemTextStyle,
+  // Style for the default text
+  listStyle
+}) => {
+  const {
+    theme
+  } = useTheme();
+  const styles = suggestionStyles(theme);
+  if (!visible || data.length === 0) {
+    return null;
+  }
+  const renderListItem = ({
+    item
+  }) => {
+    const content = renderItemContent(item);
+    if (/*#__PURE__*/React.isValidElement(content)) {
+      return content;
+    }
+    if (content === null || content === undefined) {
+      return null;
+    }
+    return /*#__PURE__*/_jsx(View, {
+      style: [styles.suggestionItem, itemStyle],
+      children: /*#__PURE__*/_jsx(Text, {
+        style: [styles.suggestionText, itemTextStyle],
+        children: String(content)
+      })
+    });
+  };
+  return /*#__PURE__*/_jsx(View, {
+    style: [styles.suggestionContainer, containerStyle],
+    children: /*#__PURE__*/_jsx(FlatList, {
+      data: data,
+      showsVerticalScrollIndicator: false,
+      keyExtractor: (_, index) => index.toString(),
+      renderItem: renderListItem // Use the robust render function
+      ,
+      style: [styles.list, listStyle],
+      keyboardShouldPersistTaps: "handled"
+    })
+  });
+};
+const suggestionStyles = theme => StyleSheet.create({
+  suggestionContainer: {
+    // ... (keep as before)
+    position: "absolute",
+    left: 0,
+    right: 0,
+    backgroundColor: theme.surface,
+    borderColor: theme.border,
+    top: "100%",
+    borderWidth: 1,
+    borderBottomRightRadius: 5,
+    borderBottomLeftRadius: 5,
+    padding: 12,
+    zIndex: 10,
+    maxHeight: 150
+  },
+  list: {
+    flexGrow: 0
+    //   padding: 12
+  },
+  // Default wrapper style (used if renderItemContent returns primitive)
+  suggestionItem: {
+    padding: 12,
+    borderBottomWidth: StyleSheet.hairlineWidth,
+    borderBottomColor: theme.border
+  },
+  // Default text style (used if renderItemContent returns primitive)
+  suggestionText: {
+    fontSize: 14,
+    color: theme.onSurface
+  }
+});
+export default SuggestionList;
+//# sourceMappingURL=SuggestionList.js.map

package/lib/module/components/Suggestions/SuggestionList.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","View","Text","FlatList","StyleSheet","useTheme","jsx","_jsx","SuggestionList","data","visible","renderItemContent","containerStyle","itemStyle","itemTextStyle","listStyle","theme","styles","suggestionStyles","length","renderListItem","item","content","isValidElement","undefined","style","suggestionItem","children","suggestionText","String","suggestionContainer","showsVerticalScrollIndicator","keyExtractor","_","index","toString","renderItem","list","keyboardShouldPersistTaps","create","position","left","right","backgroundColor","surface","borderColor","border","top","borderWidth","borderBottomRightRadius","borderBottomLeftRadius","padding","zIndex","maxHeight","flexGrow","borderBottomWidth","hairlineWidth","borderBottomColor","fontSize","color","onSurface"],"sourceRoot":"..\\..\\..\\..\\src","sources":["components/Suggestions/SuggestionList.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/components/TravelBooking/CarRentalForm.js

@@ -0,0 +1,363 @@
+"use strict";
+
+import { useTheme } from "@/theme";
+import React, { useCallback, useMemo, useRef, useState } from "react";
+import { View, Text, TouchableOpacity, StyleSheet } from "react-native";
+import { Ionicons } from "@expo/vector-icons";
+import CustomInput from "../Input/Input.js";
+import DateRangePicker from "../DateRangePicker/DateRangePicker.js";
+import { Picker } from "@react-native-picker/picker";
+import SuggestionList from "../Suggestions/SuggestionList.js";
+import { FormInputType } from "./types.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export const mockCarSuggestions = [{
+  id: 1,
+  city: "Beirut",
+  country: "Lebanon",
+  value: "BEIRUT, LEBANON"
+}, {
+  id: 2,
+  city: "Dubai",
+  country: "UAE",
+  value: "DUBAI, UAE"
+}, {
+  id: 3,
+  city: "London",
+  country: "UK",
+  value: "LONDON, UK"
+}, {
+  id: 4,
+  city: "Paris",
+  country: "France",
+  value: "PARIS, FRANCE"
+}, {
+  id: 5,
+  city: "New York",
+  country: "USA",
+  value: "NEW YORK, USA"
+}];
+
+// --- Helper Types ---
+
+// --- Component Props ---
+
+// --- Component ---
+const CarRentalForm = ({
+  initialFromLocation,
+  initialToLocation,
+  initialPickupDate,
+  initialDropoffDate,
+  onSwapPress,
+  onSearchPress,
+  fromLabel = "PICK-UP",
+  toLabel = "DROP-OFF",
+  fromPlaceholder = "From Where?",
+  toPlaceholder = "To Where?",
+  pickupLabel = "PICK-UP DATE",
+  dropoffLabel = "DROP-OFF DATE",
+  swapIconName = "swap-horizontal",
+  searchIconName = "search",
+  calendarThemeOverrides = {},
+  containerStyle,
+  inputGroupContainerStyle,
+  // Added
+  inputWrapperStyle,
+  // Added
+  inputGroupStyle,
+  labelStyle,
+  swapButtonContainerStyle,
+  swapButtonStyle,
+  swapIconStyle,
+  pickupRowStyle,
+  searchButtonStyle,
+  searchIconStyle,
+  isOneWay,
+  suggestionData,
+  onInputFocus,
+  onTextChange,
+  dateRangePickerOuterContainerStyle,
+  dateRangePickerLabelStyle,
+  dateRangePickerInputGroupStyle,
+  dateRangePickerCalendarContainerStyle,
+  suggestionListContainerStyle,
+  suggestionItemStyle,
+  suggestionItemTextStyle,
+  agePickerWrapperStyle,
+  agePickerLabelStyle,
+  pickerContainerStyle,
+  pickerStyle
+}) => {
+  const {
+    theme,
+    isRTL
+  } = useTheme();
+  const styles = useMemo(() => themedStyles(theme, isRTL), [theme, isRTL]);
+  const fromInputRef = useRef(null);
+  const toInputRef = useRef(null);
+
+  // --- State ---
+  const [fromLocation, setFromLocation] = useState(initialFromLocation);
+  const [toLocation, setToLocation] = useState(initialToLocation);
+  const [pickupDate, setPickupDate] = useState(initialPickupDate);
+  const [dropoffDate, setDropoffDate] = useState(initialDropoffDate);
+  const [age, setAge] = useState();
+  const [focusedInput, setFocusedInput] = useState();
+
+  // --- Handlers ---
+  const handleSwap = useCallback(() => {
+    const currentFrom = fromLocation;
+    const currentTo = toLocation;
+    setFromLocation(currentTo);
+    setToLocation(currentFrom);
+    onSwapPress?.(currentFrom, currentTo);
+  }, [fromLocation, toLocation, onSwapPress]);
+  const handleSearch = useCallback(() => {
+    onSearchPress?.({
+      from: fromLocation,
+      to: toLocation,
+      pickup: pickupDate,
+      dropoff: dropoffDate,
+      driverAge: age
+    });
+  }, [fromLocation, toLocation, pickupDate, dropoffDate, age, onSearchPress]);
+
+  // --- Shared Suggestion Render Item ---
+  const suggestionRenderItem = item => /*#__PURE__*/_jsx(TouchableOpacity, {
+    onPress: () => {
+      if (focusedInput === FormInputType.CAR_PICKUP) {
+        setFromLocation(item.value);
+        fromInputRef.current?.blur();
+      } else if (focusedInput === FormInputType.CAR_DROP_OFF) {
+        setToLocation(item.value);
+        toInputRef.current?.blur();
+      }
+      // setFocusedInput(undefined); // Hide suggestions after selection
+    },
+    style: [styles.suggestionItem, suggestionItemStyle] // Use new prop
+    ,
+    children: /*#__PURE__*/_jsx(Text, {
+      style: [styles.suggestionItemText, suggestionItemTextStyle],
+      children: item.value
+    })
+  }, item.id);
+  return /*#__PURE__*/_jsxs(View, {
+    style: [styles.container, containerStyle],
+    children: [/*#__PURE__*/_jsxs(View, {
+      style: [styles.inputGroupContainer, inputGroupContainerStyle],
+      children: [/*#__PURE__*/_jsxs(View, {
+        style: [styles.inputWrapper, inputWrapperStyle],
+        children: [/*#__PURE__*/_jsx(CustomInput, {
+          ref: fromInputRef,
+          onChangeText: t => {
+            onTextChange?.(t);
+            setFromLocation(t);
+          },
+          label: fromLabel,
+          value: fromLocation,
+          labelStyle: [styles.label, labelStyle],
+          placeholder: fromPlaceholder,
+          onFocus: () => {
+            onInputFocus?.(FormInputType.CAR_PICKUP);
+            setFocusedInput(FormInputType.CAR_PICKUP);
+          },
+          onBlur: () => {
+            // Delay blur slightly to allow suggestion press
+            setTimeout(() => {
+              if (focusedInput === FormInputType.CAR_PICKUP) {
+                setFocusedInput(undefined);
+              }
+            }, 150);
+          },
+          containerStyle: inputGroupStyle
+        }), suggestionData && /*#__PURE__*/_jsx(SuggestionList, {
+          data: suggestionData,
+          visible: focusedInput === FormInputType.CAR_PICKUP,
+          renderItemContent: suggestionRenderItem,
+          containerStyle: suggestionListContainerStyle
+        })]
+      }), /*#__PURE__*/_jsx(View, {
+        style: [styles.swapButtonContainer, swapButtonContainerStyle],
+        children: /*#__PURE__*/_jsx(TouchableOpacity, {
+          style: [styles.swapButton, swapButtonStyle],
+          onPress: handleSwap,
+          activeOpacity: 0.7,
+          children: /*#__PURE__*/_jsx(Ionicons, {
+            name: swapIconName,
+            size: 20,
+            color: theme.onSurface,
+            style: swapIconStyle
+          })
+        })
+      }), /*#__PURE__*/_jsxs(View, {
+        style: [styles.inputWrapper, inputWrapperStyle],
+        children: [/*#__PURE__*/_jsx(CustomInput, {
+          ref: toInputRef,
+          onChangeText: t => {
+            setToLocation(t);
+            onTextChange?.(t);
+          },
+          label: toLabel,
+          value: toLocation,
+          labelStyle: [styles.label, labelStyle],
+          placeholder: toPlaceholder,
+          onFocus: () => {
+            onInputFocus?.(FormInputType.CAR_DROP_OFF);
+            setFocusedInput(FormInputType.CAR_DROP_OFF);
+          },
+          onBlur: () => {
+            setTimeout(() => {
+              if (focusedInput === FormInputType.CAR_DROP_OFF) {
+                setFocusedInput(undefined);
+              }
+            }, 150);
+          },
+          containerStyle: inputGroupStyle
+        }), suggestionData && /*#__PURE__*/_jsx(SuggestionList, {
+          data: suggestionData,
+          visible: focusedInput === FormInputType.CAR_DROP_OFF,
+          renderItemContent: suggestionRenderItem,
+          containerStyle: suggestionListContainerStyle // Use new prop
+        })]
+      })]
+    }), /*#__PURE__*/_jsx(DateRangePicker, {
+      departureLabel: pickupLabel,
+      returnLabel: dropoffLabel,
+      outerContainerStyle: [styles.dateRangePickerOuterContainer, dateRangePickerOuterContainerStyle],
+      labelStyle: [labelStyle, dateRangePickerLabelStyle],
+      inputGroupStyle: dateRangePickerInputGroupStyle,
+      calendarContainerStyle: dateRangePickerCalendarContainerStyle,
+      calendarThemeOverrides: calendarThemeOverrides,
+      onDatesChange: d => {
+        setDropoffDate(d.return);
+        setPickupDate(d.departure);
+      },
+      isOneWay: isOneWay
+    }), /*#__PURE__*/_jsxs(View, {
+      style: [styles.pickupRow, pickupRowStyle],
+      children: [/*#__PURE__*/_jsxs(View, {
+        style: [styles.agePickerWrapper, agePickerWrapperStyle],
+        children: [/*#__PURE__*/_jsx(Text, {
+          style: [styles.label, labelStyle, agePickerLabelStyle],
+          children: "Driver's Age"
+        }), /*#__PURE__*/_jsx(View, {
+          style: [styles.pickerContainer, pickerContainerStyle],
+          children: /*#__PURE__*/_jsxs(Picker, {
+            selectedValue: age,
+            onValueChange: setAge,
+            style: [styles.picker, pickerStyle],
+            dropdownIconColor: theme.onSurface,
+            children: [/*#__PURE__*/_jsx(Picker.Item, {
+              label: "Select Age",
+              value: undefined,
+              enabled: false
+            }), Array.from({
+              length: 80 - 21 + 1
+            }, (_, i) => i + 21).map(n => /*#__PURE__*/_jsx(Picker.Item, {
+              label: n.toString(),
+              value: n
+            }, n))]
+          })
+        })]
+      }), /*#__PURE__*/_jsx(TouchableOpacity, {
+        style: [styles.searchButton, searchButtonStyle],
+        onPress: handleSearch,
+        activeOpacity: 0.8,
+        children: /*#__PURE__*/_jsx(Ionicons, {
+          name: searchIconName,
+          size: 24,
+          color: theme.onPrimary,
+          style: searchIconStyle
+        })
+      })]
+    })]
+  });
+};
+
+// --- Styles ---
+const themedStyles = (theme, isRTL) => StyleSheet.create({
+  container: {
+    padding: 16,
+    backgroundColor: theme.surface,
+    borderBottomRightRadius: 8,
+    borderBottomLeftRadius: 8
+  },
+  inputGroupContainer: {
+    position: "relative"
+  },
+  inputWrapper: {
+    marginBottom: 15,
+    position: "relative"
+  },
+  label: {
+    color: theme.labelText,
+    fontSize: 12,
+    fontWeight: "600",
+    textTransform: "uppercase",
+    textAlign: isRTL ? "right" : "left",
+    marginBottom: 6
+  },
+  swapButtonContainer: {
+    // // Centering the button between the input wrappers
+    // position: "absolute",
+    // left: 0,
+    // right: 0,
+    // top: "50%", // Position roughly in the middle vertically
+    // transform: [{ translateY: -18 }], // Adjust based on button height / 2
+    alignItems: "center"
+    // zIndex: 1, // Ensure swap button is above inputs if they overlap slightly
+  },
+  swapButton: {
+    width: 36,
+    height: 36,
+    borderRadius: 18,
+    backgroundColor: theme.surface,
+    borderColor: theme.border,
+    borderWidth: 1,
+    justifyContent: "center",
+    alignItems: "center"
+  },
+  dateRangePickerOuterContainer: {
+    marginTop: 10 // Default margin, can be overridden
+  },
+  pickupRow: {
+    flexDirection: isRTL ? "row-reverse" : "row",
+    alignItems: "flex-end",
+    marginTop: 20,
+    gap: 10
+  },
+  agePickerWrapper: {
+    flex: 1
+  },
+  pickerContainer: {
+    borderWidth: 1,
+    borderColor: theme.border,
+    borderRadius: 8,
+    backgroundColor: theme.surface,
+    justifyContent: "center",
+    height: 50
+  },
+  picker: {
+    width: "100%",
+    color: theme.onSurface
+  },
+  searchButton: {
+    backgroundColor: theme.primary,
+    width: 50,
+    height: 50,
+    borderRadius: 8,
+    justifyContent: "center",
+    alignItems: "center"
+  },
+  suggestionItem: {
+    padding: 12,
+    borderBottomWidth: StyleSheet.hairlineWidth,
+    borderBottomColor: theme.border,
+    backgroundColor: theme.surface
+  },
+  suggestionItemText: {
+    fontSize: 14,
+    color: theme.onSurface
+  }
+});
+export default CarRentalForm;
+//# sourceMappingURL=CarRentalForm.js.map