@devtravelcode/widget-native 1.0.0

package/dist/modules/search-form/flight/flight-results/FlightResults.js

@@ -0,0 +1,109 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState, useEffect, useRef } from "react";
+import { View, Text, ScrollView, ActivityIndicator, StyleSheet, } from "react-native";
+import FlightCard from "./FlightCard";
+import FlightsSkeleton from "./FlightsSkeleton";
+import Pagination from "../../Pagination";
+import { Colors, Spacing, FontSize } from "../../../../theme/colors";
+const FlightResults = ({ results, loading, isFiltering = false, isPageLoading = false, total = 0, limit = 25, offset = 0, fetchPage, dictionaries, airlines, sessionId, filtersData, translations, lang, currencySign, onFlightSelect, headerComponent, }) => {
+    const currentPage = Math.floor(offset / limit) + 1;
+    const totalPages = Math.ceil(total / limit);
+    const scrollRef = useRef(null);
+    const [hasSearched, setHasSearched] = useState(false);
+    const prevLoadingRef = useRef(false);
+    const formHeightRef = useRef(0);
+    useEffect(() => {
+        if (loading && !prevLoadingRef.current) {
+            setHasSearched(true);
+            const scrollOffset = formHeightRef.current > 0 ? formHeightRef.current - 120 : 400;
+            isAutoScrollingRef.current = true;
+            setTimeout(() => {
+                scrollRef.current?.scrollTo({ y: scrollOffset, animated: true });
+                setTimeout(() => { isAutoScrollingRef.current = false; }, 500);
+            }, 200);
+        }
+        prevLoadingRef.current = loading;
+    }, [loading]);
+    const scrollYRef = useRef(0);
+    const isAutoScrollingRef = useRef(false);
+    const isInitialLoad = loading && !results.length;
+    const hasResults = results.length > 0;
+    const showNoResultsFirstSearch = !loading && !isFiltering && hasSearched && !hasResults && !filtersData;
+    const showNoResultsAfterFilters = !loading && !isFiltering && hasSearched && !hasResults && !!filtersData;
+    const renderFooter = () => {
+        if (totalPages <= 1)
+            return null;
+        return (_jsx(View, { style: styles.paginationWrapper, children: _jsx(Pagination, { currentPage: currentPage, totalPages: totalPages, onPageChange: (page) => {
+                    if (fetchPage) {
+                        fetchPage(page);
+                    }
+                } }) }));
+    };
+    const renderNoResults = (isAfterFilters) => (_jsxs(View, { style: styles.noResultsContainer, children: [_jsx(Text, { style: styles.noResultsTitle, children: translations["flights_not_found_title"] || "No flights found" }), _jsxs(View, { style: styles.noResultsContent, children: [_jsx(Text, { style: styles.noResultsHint, children: translations["flights_not_found_hint"] ||
+                            "Try adjusting your search parameters:" }), _jsxs(Text, { style: styles.noResultsOption, children: ["\u2022", " ", translations["flights_not_found_option_1"] ||
+                                "Change departure or return dates"] }), _jsxs(Text, { style: styles.noResultsOption, children: ["\u2022", " ", translations["flights_not_found_option_2"] ||
+                                "Choose a different cabin class"] }), _jsxs(Text, { style: styles.noResultsOption, children: ["\u2022", " ", translations["flights_not_found_option_3"] ||
+                                "Check nearby airports"] }), _jsxs(Text, { style: styles.noResultsOption, children: ["\u2022", " ", translations["flights_not_found_option_4"] || "Modify your filters"] })] })] }));
+    return (_jsxs(View, { style: styles.container, children: [(isFiltering || isPageLoading) && (_jsxs(View, { style: styles.overlayLoader, children: [_jsx(ActivityIndicator, { size: "large", color: Colors.primary }), _jsx(Text, { style: styles.overlayText, children: translations["loading"] || "Loading..." })] })), _jsxs(ScrollView, { ref: scrollRef, contentContainerStyle: styles.listContent, showsVerticalScrollIndicator: false, onScroll: (e) => {
+                    scrollYRef.current = e.nativeEvent.contentOffset.y;
+                }, scrollEventThrottle: 16, onContentSizeChange: () => {
+                    if (scrollYRef.current > 0 && !isAutoScrollingRef.current) {
+                        scrollRef.current?.scrollTo({ y: scrollYRef.current, animated: false });
+                    }
+                }, children: [_jsxs(View, { onLayout: (e) => { formHeightRef.current = e.nativeEvent.layout.height; }, children: [headerComponent, isInitialLoad && _jsx(FlightsSkeleton, { translations: translations }), showNoResultsFirstSearch && renderNoResults(false), showNoResultsAfterFilters && renderNoResults(true)] }), hasResults && results.map((item, index) => (_jsx(FlightCard, { item: item, loading: loading, dictionaries: dictionaries, airlines: airlines, sessionId: sessionId, translations: translations, lang: lang, currencySign: currencySign, onSelect: onFlightSelect }, `${item.id || index}-${item.totalPrice}-${item.durationTime}`))), hasResults && renderFooter()] })] }));
+};
+const styles = StyleSheet.create({
+    container: {
+        flex: 1,
+        position: "relative",
+    },
+    overlayLoader: {
+        position: "absolute",
+        top: 0,
+        left: 0,
+        right: 0,
+        bottom: 0,
+        backgroundColor: "rgba(255,255,255,0.7)",
+        zIndex: 10,
+        justifyContent: "center",
+        alignItems: "center",
+    },
+    overlayText: {
+        marginTop: Spacing.sm,
+        fontSize: FontSize.md,
+        color: Colors.textSecondary,
+    },
+    listContent: {
+        paddingBottom: Spacing.lg,
+    },
+    noResultsContainer: {
+        padding: Spacing.xxl,
+        alignItems: "center",
+    },
+    noResultsTitle: {
+        fontSize: FontSize.xl,
+        fontWeight: "600",
+        color: Colors.text,
+        marginBottom: Spacing.md,
+        textAlign: "center",
+    },
+    noResultsContent: {
+        alignItems: "flex-start",
+    },
+    noResultsHint: {
+        fontSize: FontSize.md,
+        color: Colors.textSecondary,
+        marginBottom: Spacing.sm,
+    },
+    noResultsOption: {
+        fontSize: FontSize.md,
+        color: Colors.textSecondary,
+        marginBottom: Spacing.xs,
+        paddingLeft: Spacing.sm,
+    },
+    paginationWrapper: {
+        paddingVertical: Spacing.lg,
+        alignItems: "center",
+    },
+});
+export default FlightResults;

package/dist/modules/search-form/flight/flight-results/FlightSegments.d.ts

@@ -0,0 +1,40 @@
+import React from "react";
+type AirportDictionary = {
+    [code: string]: {
+        title: string;
+        titleEn: string;
+        city?: {
+            title?: string;
+            titleEn?: string;
+        };
+        country?: {
+            title?: string;
+            titleEn?: string;
+        };
+    };
+};
+type Segment = {
+    duration: string;
+    departure: {
+        iata_code: string;
+        at: string;
+    };
+    arrival: {
+        iata_code: string;
+        at: string;
+    };
+    transfer_duration?: string;
+};
+type FlightSegmentsProps = {
+    segments: Segment[];
+    dictionaries?: {
+        airports?: AirportDictionary;
+    };
+    lang: string;
+    translations: Record<string, string>;
+    onShowTooltip?: (label: string, x: number, y: number, w: number, h: number) => void;
+    onDismissTooltip?: () => void;
+    activeTooltip?: string | null;
+};
+declare const FlightSegments: React.FC<FlightSegmentsProps>;
+export default FlightSegments;

package/dist/modules/search-form/flight/flight-results/FlightSegments.js

@@ -0,0 +1,162 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useRef } from "react";
+import { View, Text, TouchableOpacity, StyleSheet } from "react-native";
+import { Colors, Spacing, FontSize, BorderRadius } from "../../../../theme/colors";
+const TooltipTouchable = ({ label, onShow, onDismiss, active, children, style }) => {
+    const ref = useRef(null);
+    const handlePress = () => {
+        if (!onShow)
+            return;
+        if (active) {
+            onDismiss?.();
+        }
+        else {
+            ref.current?.measureInWindow((x, y, w, h) => {
+                onShow(label, x, y, w, h);
+            });
+        }
+    };
+    return (_jsx(View, { ref: ref, collapsable: false, style: style, children: _jsx(TouchableOpacity, { onPress: handlePress, activeOpacity: 0.7, children: children }) }));
+};
+const FlightSegments = ({ segments, dictionaries, lang, translations, onShowTooltip, onDismissTooltip, activeTooltip, }) => {
+    if (!segments?.length)
+        return null;
+    const airports = dictionaries?.airports || {};
+    const totalMinutes = segments.reduce((sum, seg, i) => {
+        const [h, m] = seg.duration.split(":").map(Number);
+        let minutes = h * 60 + m;
+        const next = segments[i + 1];
+        if (next) {
+            let transferMinutes = 0;
+            if (next.transfer_duration) {
+                const [th, tm] = next.transfer_duration.split(":").map(Number);
+                transferMinutes = th * 60 + tm;
+            }
+            else if (seg.arrival?.iata_code === next.departure?.iata_code) {
+                const diff = (new Date(next.departure.at).getTime() -
+                    new Date(seg.arrival.at).getTime()) /
+                    60000;
+                transferMinutes = diff > 0 ? diff : 60;
+            }
+            else {
+                transferMinutes = 60;
+            }
+            minutes += transferMinutes;
+        }
+        return sum + minutes;
+    }, 0);
+    const allCodes = [];
+    segments.forEach((seg, i) => {
+        if (i === 0)
+            allCodes.push(seg.departure?.iata_code);
+        allCodes.push(seg.arrival?.iata_code);
+    });
+    const hLabel = translations["hours_label"] || "h";
+    const mLabel = translations["minutes_label"] || "m";
+    const formatMin = (min) => {
+        const hh = Math.floor(min / 60);
+        const mm = min % 60;
+        return `${hh}${hLabel} ${mm.toString().padStart(2, "0")}${mLabel}`;
+    };
+    const getAirportName = (code) => {
+        const ap = airports[code];
+        if (!ap)
+            return code;
+        const name = lang === "en" ? ap.titleEn || ap.title : ap.title;
+        const city = lang === "en"
+            ? ap.city?.titleEn || ap.city?.title || ""
+            : ap.city?.title || "";
+        return city ? `${name}, ${city}` : name;
+    };
+    const barItems = [];
+    segments.forEach((segment, index) => {
+        const [h, m] = segment.duration.split(":").map(Number);
+        const segMinutes = h * 60 + m;
+        const arrival = segment.arrival?.iata_code;
+        const next = segments[index + 1];
+        const isTransfer = !!next;
+        let transferMinutes = 0;
+        if (isTransfer && next) {
+            if (next.transfer_duration) {
+                const [th, tm] = next.transfer_duration.split(":").map(Number);
+                transferMinutes = th * 60 + tm;
+            }
+            else if (arrival === next.departure?.iata_code) {
+                const diff = (new Date(next.departure.at).getTime() -
+                    new Date(segment.arrival.at).getTime()) /
+                    60000;
+                transferMinutes = diff > 0 ? diff : 60;
+            }
+            else {
+                transferMinutes = 60;
+            }
+        }
+        const segFlex = totalMinutes > 0 ? segMinutes / totalMinutes : 1;
+        const layoverFlex = isTransfer && totalMinutes > 0 ? transferMinutes / totalMinutes : 0;
+        const flightTooltip = `${translations["in_flight"] || "In flight"}: ${formatMin(segMinutes)}`;
+        barItems.push({ type: "flight", flex: segFlex, tooltip: flightTooltip });
+        if (isTransfer) {
+            const arrName = getAirportName(arrival);
+            const transferTooltip = `${translations["transfer"] || "Transfer"} ${formatMin(transferMinutes)}, ${arrName}`;
+            barItems.push({ type: "layover", flex: layoverFlex, tooltip: transferTooltip });
+        }
+    });
+    const firstCode = allCodes[0];
+    const lastCode = allCodes[allCodes.length - 1];
+    const middleCodes = allCodes.slice(1, -1);
+    const getIataTooltip = (code, type) => {
+        const ap = airports[code];
+        if (!ap)
+            return code;
+        const name = lang === "en" ? ap.titleEn || ap.title : ap.title;
+        const city = lang === "en"
+            ? ap.city?.titleEn || ap.city?.title || ""
+            : ap.city?.title || "";
+        const prefix = type === "dep"
+            ? translations["departure_from"] || "Departure from"
+            : translations["arrival_to"] || "Arrival to";
+        return city ? `${prefix} ${name}, ${city}` : `${prefix} ${name}`;
+    };
+    return (_jsxs(View, { style: styles.container, children: [_jsx(View, { style: styles.barsRow, children: barItems.map((item, i) => (_jsx(TooltipTouchable, { label: item.tooltip, onShow: onShowTooltip, onDismiss: onDismissTooltip, active: activeTooltip === item.tooltip, style: [
+                        item.type === "flight" ? styles.flightBar : styles.layoverBar,
+                        { flex: item.flex },
+                    ], children: _jsx(View, { style: { height: 14 } }) }, i))) }), _jsxs(View, { style: styles.labelsRow, children: [_jsx(TooltipTouchable, { label: getIataTooltip(firstCode, "dep"), onShow: onShowTooltip, onDismiss: onDismissTooltip, active: activeTooltip === getIataTooltip(firstCode, "dep"), children: _jsx(Text, { style: styles.airportLabel, numberOfLines: 1, children: firstCode }) }), middleCodes.map((code, i) => (_jsx(TooltipTouchable, { label: getAirportName(code), onShow: onShowTooltip, onDismiss: onDismissTooltip, active: activeTooltip === getAirportName(code), children: _jsx(Text, { style: [styles.airportLabel, styles.airportLabelCenter], numberOfLines: 1, children: code }) }, i))), _jsx(TooltipTouchable, { label: getIataTooltip(lastCode, "arr"), onShow: onShowTooltip, onDismiss: onDismissTooltip, active: activeTooltip === getIataTooltip(lastCode, "arr"), children: _jsx(Text, { style: [styles.airportLabel, styles.airportLabelEnd], numberOfLines: 1, children: lastCode }) })] })] }));
+};
+const styles = StyleSheet.create({
+    container: {
+        width: "100%",
+        marginVertical: Spacing.xs,
+    },
+    barsRow: {
+        flexDirection: "row",
+        alignItems: "center",
+        gap: 1,
+    },
+    flightBar: {
+        height: 4,
+        borderRadius: BorderRadius.sm,
+        backgroundColor: "#B5B5C2",
+        justifyContent: "center",
+    },
+    layoverBar: {
+        height: 1,
+        backgroundColor: "#B5B5C2",
+        justifyContent: "center",
+    },
+    labelsRow: {
+        flexDirection: "row",
+        justifyContent: "space-between",
+        marginTop: Spacing.xs,
+    },
+    airportLabel: {
+        fontSize: FontSize.xs,
+        color: Colors.primary,
+    },
+    airportLabelCenter: {
+        textAlign: "center",
+    },
+    airportLabelEnd: {
+        textAlign: "right",
+    },
+});
+export default FlightSegments;

package/dist/modules/search-form/flight/flight-results/FlightsSkeleton.d.ts

@@ -0,0 +1,6 @@
+import React from "react";
+type FlightsSkeletonProps = {
+    translations: Record<string, string>;
+};
+declare const FlightsSkeleton: React.FC<FlightsSkeletonProps>;
+export default FlightsSkeleton;

package/dist/modules/search-form/flight/flight-results/FlightsSkeleton.js

@@ -0,0 +1,52 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { View, StyleSheet } from "react-native";
+import { Skeleton } from "../../../../components/ui/Skeleton";
+import { Colors, Spacing, BorderRadius } from "../../../../theme/colors";
+const FlightsSkeleton = () => {
+    return (_jsx(View, { style: styles.container, children: [1, 2, 3, 4].map((i) => (_jsxs(View, { style: styles.card, children: [_jsxs(View, { style: styles.headerRow, children: [_jsx(Skeleton, { width: 32, height: 32, borderRadius: BorderRadius.full }), _jsx(Skeleton, { width: 100, height: 16, style: { marginLeft: Spacing.sm } })] }), _jsxs(View, { style: styles.routeRow, children: [_jsxs(View, { style: styles.timeCol, children: [_jsx(Skeleton, { width: 50, height: 20 }), _jsx(Skeleton, { width: 60, height: 12, style: { marginTop: Spacing.xs } })] }), _jsxs(View, { style: styles.timelineCol, children: [_jsx(Skeleton, { width: "100%", height: 3 }), _jsx(Skeleton, { width: 80, height: 12, style: { marginTop: Spacing.xs, alignSelf: "center" } })] }), _jsxs(View, { style: [styles.timeCol, styles.timeColRight], children: [_jsx(Skeleton, { width: 50, height: 20 }), _jsx(Skeleton, { width: 60, height: 12, style: { marginTop: Spacing.xs } })] })] }), _jsxs(View, { style: [styles.routeRow, { marginTop: Spacing.md }], children: [_jsxs(View, { style: styles.timeCol, children: [_jsx(Skeleton, { width: 50, height: 20 }), _jsx(Skeleton, { width: 60, height: 12, style: { marginTop: Spacing.xs } })] }), _jsx(View, { style: styles.timelineCol, children: _jsx(Skeleton, { width: "100%", height: 3 }) }), _jsxs(View, { style: [styles.timeCol, styles.timeColRight], children: [_jsx(Skeleton, { width: 50, height: 20 }), _jsx(Skeleton, { width: 60, height: 12, style: { marginTop: Spacing.xs } })] })] }), _jsxs(View, { style: styles.priceRow, children: [_jsx(Skeleton, { width: 80, height: 14 }), _jsx(Skeleton, { width: "100%", height: 44, borderRadius: BorderRadius.md, style: { marginTop: Spacing.sm } })] })] }, i))) }));
+};
+const styles = StyleSheet.create({
+    container: {
+        paddingHorizontal: Spacing.lg,
+    },
+    card: {
+        backgroundColor: Colors.surface,
+        borderRadius: BorderRadius.lg,
+        padding: Spacing.lg,
+        marginBottom: Spacing.md,
+        shadowColor: Colors.black,
+        shadowOffset: { width: 0, height: 2 },
+        shadowOpacity: 0.05,
+        shadowRadius: 4,
+        elevation: 2,
+    },
+    headerRow: {
+        flexDirection: "row",
+        alignItems: "center",
+        marginBottom: Spacing.lg,
+    },
+    routeRow: {
+        flexDirection: "row",
+        alignItems: "flex-start",
+    },
+    timeCol: {
+        width: 70,
+    },
+    timeColRight: {
+        alignItems: "flex-end",
+    },
+    timelineCol: {
+        flex: 1,
+        paddingHorizontal: Spacing.sm,
+        justifyContent: "center",
+        paddingTop: Spacing.sm,
+    },
+    priceRow: {
+        borderTopWidth: 1,
+        borderTopColor: Colors.borderLight,
+        paddingTop: Spacing.md,
+        marginTop: Spacing.lg,
+        alignItems: "center",
+    },
+});
+export default FlightsSkeleton;

package/dist/modules/search-form/flight/flight-results/ProvidersLoader.d.ts

@@ -0,0 +1,9 @@
+import React from "react";
+type LoaderType = "flights" | "cars" | "hotels";
+type ProvidersLoaderProps = {
+    active: boolean;
+    type?: LoaderType;
+    translations: Record<string, string>;
+};
+declare const ProvidersLoader: React.FC<ProvidersLoaderProps>;
+export default ProvidersLoader;

package/dist/modules/search-form/flight/flight-results/ProvidersLoader.js

@@ -0,0 +1,242 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useState, useRef } from "react";
+import { View, Text, Animated, StyleSheet } from "react-native";
+import { Colors, Spacing, FontSize, BorderRadius } from "../../../../theme/colors";
+const AIRLINES = [
+    "Lufthansa",
+    "Swiss International Air Lines",
+    "Austrian Airlines",
+    "Air France",
+    "KLM Royal Dutch Airlines",
+    "British Airways",
+    "Finnair",
+    "SAS Scandinavian Airlines",
+    "Iberia",
+    "LOT Polish Airlines",
+    "TAP Air Portugal",
+    "Brussels Airlines",
+    "Norwegian Air Shuttle",
+    "easyJet",
+    "Ryanair",
+    "Qatar Airways",
+    "Emirates",
+    "Etihad Airways",
+    "United Airlines",
+    "American Airlines",
+    "Delta Air Lines",
+    "Air Canada",
+];
+const CAR_RENTALS = [
+    "Hertz",
+    "Avis",
+    "Europcar",
+    "Sixt",
+    "Enterprise",
+    "Budget",
+    "Alamo",
+    "National Car Rental",
+    "Thrifty",
+    "Dollar Rent A Car",
+    "Fox Rent A Car",
+    "Green Motion",
+    "Goldcar",
+    "Firefly",
+    "Locauto",
+    "Keddy",
+    "InterRent",
+    "OK Mobility",
+    "Rentmotors",
+    "AddCar",
+];
+const HOTEL_BRANDS = [
+    "Hilton Hotels",
+    "Marriott",
+    "Hyatt",
+    "Accor",
+    "IHG Hotels & Resorts",
+    "Radisson Blu",
+    "Best Western",
+    "Sheraton",
+    "Holiday Inn",
+    "Novotel",
+    "Crowne Plaza",
+    "Mercure",
+    "DoubleTree",
+    "Pullman",
+    "Courtyard by Marriott",
+    "Four Seasons",
+    "Ritz-Carlton",
+    "InterContinental",
+    "Sofitel",
+    "NH Hotels",
+];
+function shuffleArray(arr) {
+    const a = arr.slice();
+    for (let i = a.length - 1; i > 0; i--) {
+        const j = Math.floor(Math.random() * (i + 1));
+        [a[i], a[j]] = [a[j], a[i]];
+    }
+    return a;
+}
+const ProvidersLoader = ({ active, type = "flights", translations, }) => {
+    const configMap = {
+        flights: {
+            title: translations["loader_flights_title"] || "Searching flights",
+            subtitlePrefix: translations["loader_flights_prefix"] || "in",
+            list: AIRLINES,
+            initialCount: 39,
+        },
+        cars: {
+            title: translations["loader_cars_title"] || "Finding cars",
+            subtitlePrefix: translations["loader_cars_prefix"] || "at",
+            list: CAR_RENTALS,
+            initialCount: 24,
+        },
+        hotels: {
+            title: translations["loader_hotels_title"] || "Searching hotels",
+            subtitlePrefix: translations["loader_hotels_prefix"] || "in",
+            list: HOTEL_BRANDS,
+            initialCount: 52,
+        },
+    };
+    const config = configMap[type];
+    const [index, setIndex] = useState(0);
+    const [progress, setProgress] = useState(0);
+    const [counter, setCounter] = useState(config.initialCount);
+    const [names, setNames] = useState(() => shuffleArray(config.list));
+    const [visible, setVisible] = useState(false);
+    const fadeAnim = useRef(new Animated.Value(0)).current;
+    const progressAnim = useRef(new Animated.Value(0)).current;
+    const nameOpacity = useRef(new Animated.Value(1)).current;
+    const progressTimerRef = useRef(null);
+    const rotateTimerRef = useRef(null);
+    const counterTimerRef = useRef(null);
+    useEffect(() => {
+        if (active) {
+            setVisible(true);
+            startTimers();
+            Animated.timing(fadeAnim, {
+                toValue: 1,
+                duration: 300,
+                useNativeDriver: true,
+            }).start();
+        }
+        else if (visible) {
+            clearTimers();
+            setProgress(100);
+            progressAnim.setValue(1);
+            Animated.timing(fadeAnim, {
+                toValue: 0,
+                duration: 600,
+                useNativeDriver: true,
+            }).start(() => setVisible(false));
+        }
+        return () => clearTimers();
+    }, [active]);
+    const startTimers = () => {
+        clearTimers();
+        setProgress(0);
+        setCounter(config.initialCount);
+        setNames(shuffleArray(config.list));
+        progressAnim.setValue(0);
+        progressTimerRef.current = setInterval(() => {
+            setProgress((p) => {
+                const next = p < 95 ? p + 0.6 : p;
+                progressAnim.setValue(next / 100);
+                return next;
+            });
+        }, 200);
+        rotateTimerRef.current = setInterval(() => {
+            Animated.sequence([
+                Animated.timing(nameOpacity, {
+                    toValue: 0,
+                    duration: 200,
+                    useNativeDriver: true,
+                }),
+                Animated.timing(nameOpacity, {
+                    toValue: 1,
+                    duration: 200,
+                    useNativeDriver: true,
+                }),
+            ]).start();
+            setIndex((i) => (i + 1) % config.list.length);
+        }, 1800);
+        counterTimerRef.current = setInterval(() => {
+            setCounter((c) => (c > 0 ? c - 1 : 0));
+        }, 1000);
+    };
+    const clearTimers = () => {
+        if (progressTimerRef.current)
+            clearInterval(progressTimerRef.current);
+        if (rotateTimerRef.current)
+            clearInterval(rotateTimerRef.current);
+        if (counterTimerRef.current)
+            clearInterval(counterTimerRef.current);
+    };
+    if (!visible)
+        return null;
+    const progressWidth = progressAnim.interpolate({
+        inputRange: [0, 1],
+        outputRange: ["0%", "100%"],
+    });
+    return (_jsx(Animated.View, { style: [styles.container, { opacity: fadeAnim }], children: _jsxs(View, { style: styles.content, children: [_jsxs(View, { style: styles.headerRow, children: [_jsx(View, { style: styles.counterBadge, children: _jsx(Text, { style: styles.counterText, children: counter }) }), _jsxs(View, { style: styles.textBlock, children: [_jsx(Text, { style: styles.title, children: config.title }), _jsxs(Animated.Text, { style: [styles.subtitle, { opacity: nameOpacity }], children: [config.subtitlePrefix, " ", names[index], "..."] })] })] }), _jsx(View, { style: styles.progressBackground, children: _jsx(Animated.View, { style: [styles.progressBar, { width: progressWidth }] }) })] }) }));
+};
+const styles = StyleSheet.create({
+    container: {
+        backgroundColor: Colors.surface,
+        borderRadius: BorderRadius.lg,
+        marginHorizontal: Spacing.lg,
+        marginVertical: Spacing.md,
+        padding: Spacing.lg,
+        shadowColor: Colors.black,
+        shadowOffset: { width: 0, height: 2 },
+        shadowOpacity: 0.1,
+        shadowRadius: 8,
+        elevation: 4,
+    },
+    content: {},
+    headerRow: {
+        flexDirection: "row",
+        alignItems: "center",
+        marginBottom: Spacing.lg,
+    },
+    counterBadge: {
+        width: 48,
+        height: 48,
+        borderRadius: BorderRadius.full,
+        backgroundColor: Colors.primaryLight,
+        justifyContent: "center",
+        alignItems: "center",
+        marginRight: Spacing.md,
+    },
+    counterText: {
+        fontSize: FontSize.xl,
+        fontWeight: "700",
+        color: Colors.primary,
+    },
+    textBlock: {
+        flex: 1,
+    },
+    title: {
+        fontSize: FontSize.lg,
+        fontWeight: "600",
+        color: Colors.text,
+    },
+    subtitle: {
+        fontSize: FontSize.md,
+        color: Colors.textSecondary,
+        marginTop: 2,
+    },
+    progressBackground: {
+        height: 6,
+        backgroundColor: Colors.borderLight,
+        borderRadius: BorderRadius.full,
+        overflow: "hidden",
+    },
+    progressBar: {
+        height: 6,
+        backgroundColor: Colors.primary,
+        borderRadius: BorderRadius.full,
+    },
+});
+export default ProvidersLoader;

package/dist/modules/search-form/hotel/DatePicker.d.ts

@@ -0,0 +1 @@
+export { default } from "../flight/DatePicker";

package/dist/modules/search-form/hotel/DatePicker.js

@@ -0,0 +1 @@
+export { default } from "../flight/DatePicker";

package/dist/modules/search-form/hotel/GuestSelector.d.ts

@@ -0,0 +1,13 @@
+import React from "react";
+type Room = {
+    adults: number;
+    children: number;
+    childrenAges: number[];
+};
+type GuestSelectorProps = {
+    value?: Room[];
+    onChange: (rooms: Room[]) => void;
+    translations: Record<string, string>;
+};
+declare const GuestSelector: React.FC<GuestSelectorProps>;
+export default GuestSelector;