react-native-auto-positioned-popup 1.0.2

package/lib/AutoPositionedPopup.js

@@ -0,0 +1,306 @@
+import React, { forwardRef, memo, useCallback, useEffect, useImperativeHandle, useMemo, useRef, useState, } from 'react';
+import { Dimensions, Keyboard, Text, TextInput as RNTextInput, TouchableOpacity, View, } from 'react-native';
+import { AdvancedFlatList } from 'react-native-advanced-flatlist';
+import styles from './AutoPositionedPopup.style';
+import { useRootView } from './RootViewContext';
+const queryChangeListeners = [];
+const emitQueryChange = (query) => {
+    console.log('AutoPositionedPopup.tsx emitQueryChange query=', query, ' listeners=', queryChangeListeners.length);
+    queryChangeListeners.forEach((l) => l(query));
+};
+const subscribeQueryChange = (listener) => {
+    queryChangeListeners.push(listener);
+    return () => {
+        const idx = queryChangeListeners.indexOf(listener);
+        if (idx !== -1)
+            queryChangeListeners.splice(idx, 1);
+    };
+};
+// Default light theme
+const defaultTheme = {
+    colors: {
+        text: '#333333',
+        placeholderText: '#999999',
+        background: '#FFFFFF',
+        border: '#E0E0E0',
+    },
+};
+// List item component for rendering individual items
+const ListItem = memo(({ item, index, selectedItem, onItemPress, theme, rootViewsRef, selectedItemBackgroundColor = 'rgba(116, 116, 128, 0.08)' }) => {
+    const isSelected = item.id === (selectedItem === null || selectedItem === void 0 ? void 0 : selectedItem.id);
+    return useMemo(() => (<TouchableOpacity key={item.id} style={[
+            styles.commonModalRow,
+            {
+                backgroundColor: isSelected ? selectedItemBackgroundColor : 'transparent',
+                borderColor: theme.colors.border,
+            },
+        ]} onPress={() => {
+            console.log('AutoPositionedPopup.tsx ListItem onPress item=', item);
+            if (rootViewsRef) {
+                console.log('AutoPositionedPopup.tsx ListItem onPress rootViews=', rootViewsRef.current);
+            }
+            onItemPress(item);
+        }}>
+      <Text style={[styles.ListItemCode, { color: theme.colors.text }]} numberOfLines={1} ellipsizeMode="tail">
+        {item.title}
+      </Text>
+    </TouchableOpacity>), [item, index, selectedItem, onItemPress, theme, rootViewsRef, isSelected, selectedItemBackgroundColor]);
+});
+const PopupList = memo(({ data, selectedItem, onItemPress, renderItem, keyExtractor = (item) => String(item.id), theme, rootViewsRef, fetchData, localSearch = false, pageSize = 20, onDataUpdate, selectedItemBackgroundColor, }) => {
+    const [internalData, setInternalData] = useState(data);
+    const searchQueryRef = useRef('');
+    // Sync external data changes
+    useEffect(() => {
+        setInternalData(data);
+    }, [data]);
+    // Listen to search query changes
+    useEffect(() => {
+        const unsubscribe = subscribeQueryChange(async (newQuery) => {
+            console.log('PopupList subscribeQueryChange newQuery=', newQuery);
+            searchQueryRef.current = newQuery;
+            if (fetchData) {
+                try {
+                    const result = await fetchData({
+                        pageIndex: 0,
+                        pageSize,
+                        searchQuery: newQuery,
+                    });
+                    if (result === null || result === void 0 ? void 0 : result.items) {
+                        setInternalData(result.items);
+                        onDataUpdate === null || onDataUpdate === void 0 ? void 0 : onDataUpdate(result.items);
+                    }
+                }
+                catch (error) {
+                    console.error('PopupList fetchData error:', error);
+                }
+            }
+            else if (localSearch) {
+                // Local filtering
+                const filtered = data.filter(item => item.title.toLowerCase().includes(newQuery.toLowerCase()));
+                setInternalData(filtered);
+                onDataUpdate === null || onDataUpdate === void 0 ? void 0 : onDataUpdate(filtered);
+            }
+        });
+        return unsubscribe;
+    }, [fetchData, localSearch, pageSize, data, onDataUpdate]);
+    const defaultRenderItem = useCallback(({ item, index }) => (<ListItem item={item} index={index} selectedItem={selectedItem} onItemPress={onItemPress} theme={theme} rootViewsRef={rootViewsRef} selectedItemBackgroundColor={selectedItemBackgroundColor}/>), [selectedItem, onItemPress, theme, rootViewsRef, selectedItemBackgroundColor]);
+    return (<View style={[styles.autoPositionedPopupList, { backgroundColor: theme.colors.background }]}>
+      <AdvancedFlatList data={internalData} keyExtractor={keyExtractor} renderItem={renderItem || defaultRenderItem} keyboardShouldPersistTaps="always" showsVerticalScrollIndicator={true} nestedScrollEnabled={true}/>
+    </View>);
+});
+// Main AutoPositionedPopup component
+const AutoPositionedPopup = memo(forwardRef((props, parentRef) => {
+    const { tag, style, AutoPositionedPopupBtnStyle, placeholder = 'Please Select', textAlign = 'right', onSubmitEditing, TextInputProps = {}, inputStyle, labelStyle, popUpViewStyle = { left: '5%', width: '90%' }, fetchData, renderItem, onItemSelected, localSearch = false, pageSize = 20, selectedItem, useTextInput = false, btwChildren, CustomRow = ({ children }) => <View>{children}</View>, keyExtractor = (item) => item === null || item === void 0 ? void 0 : item.id, AutoPositionedPopupBtnDisabled = false, forceRemoveAllRootViewOnItemSelected = false, centerDisplay = false, selectedItemBackgroundColor = 'rgba(116, 116, 128, 0.08)', } = props;
+    // Use RootView context
+    const { addRootView, removeRootView, rootViews, searchQuery: contextSearchQuery, setSearchQuery: setContextSearchQuery } = useRootView();
+    const rootViewsRef = useRef(rootViews);
+    useEffect(() => {
+        rootViewsRef.current = rootViews;
+    }, [rootViews]);
+    // State management
+    const [isVisible, setIsVisible] = useState(false);
+    const [data, setData] = useState([]);
+    const [loading, setLoading] = useState(false);
+    const [popupPosition, setPopupPosition] = useState({ top: 0, left: 0, width: 0 });
+    const popupId = useRef(`popup-${tag}-${Date.now()}`);
+    // Refs for performance optimization
+    const containerRef = useRef(null);
+    const textInputRef = useRef(null);
+    const debounceTimerRef = useRef(null);
+    const searchQueryRef = useRef(''); // Use ref instead of state to avoid re-renders
+    // Constants
+    const LIST_HEIGHT = 200;
+    const theme = defaultTheme;
+    // Fetch data function
+    const loadData = useCallback(async (query = '') => {
+        if (!fetchData)
+            return;
+        setLoading(true);
+        try {
+            const result = await fetchData({
+                pageIndex: 0,
+                pageSize,
+                searchQuery: query,
+            });
+            if (result === null || result === void 0 ? void 0 : result.items) {
+                setData(result.items);
+            }
+        }
+        catch (error) {
+            console.error('Error loading data:', error);
+        }
+        finally {
+            setLoading(false);
+        }
+    }, [fetchData, pageSize]);
+    // Handle search query change with debounce and event emission
+    const handleSearchChange = useCallback((query) => {
+        // Store in ref to avoid re-renders
+        searchQueryRef.current = query;
+        // Update TextInput value directly if needed
+        if (textInputRef.current) {
+            // The TextInput's value will be controlled by its own state
+        }
+        // Clear previous debounce timer
+        if (debounceTimerRef.current) {
+            clearTimeout(debounceTimerRef.current);
+        }
+        // Use debounce for performance optimization
+        debounceTimerRef.current = setTimeout(() => {
+            // Emit query change event to decouple components and avoid context re-rendering
+            emitQueryChange(searchQueryRef.current);
+        }, 300); // Use 300ms debounce like the original
+    }, []);
+    // Calculate popup position
+    const calculatePosition = useCallback(() => {
+        if (!containerRef.current)
+            return;
+        containerRef.current.measureInWindow((x, y, width, height) => {
+            const screenHeight = Dimensions.get('screen').height;
+            const screenWidth = Dimensions.get('screen').width;
+            let top = y + height;
+            let left = x;
+            let popupWidth = width;
+            // Check if popup should appear above the input
+            if (y + height + LIST_HEIGHT > screenHeight) {
+                top = y - LIST_HEIGHT;
+            }
+            // Adjust horizontal position if needed
+            if ((popUpViewStyle === null || popUpViewStyle === void 0 ? void 0 : popUpViewStyle.left) && (popUpViewStyle === null || popUpViewStyle === void 0 ? void 0 : popUpViewStyle.width)) {
+                const leftPercent = parseFloat(String(popUpViewStyle.left).replace('%', '')) / 100;
+                const widthPercent = parseFloat(String(popUpViewStyle.width).replace('%', '')) / 100;
+                left = screenWidth * leftPercent;
+                popupWidth = screenWidth * widthPercent;
+            }
+            setPopupPosition({ top, left, width: popupWidth });
+        });
+    }, [popUpViewStyle]);
+    // Hide popup using RootView
+    const hidePopup = useCallback(() => {
+        var _a, _b;
+        setIsVisible(false);
+        // Reset search query
+        searchQueryRef.current = '';
+        if (textInputRef.current) {
+            textInputRef.current.blur();
+            (_b = (_a = textInputRef.current).clear) === null || _b === void 0 ? void 0 : _b.call(_a); // Clear the TextInput
+        }
+        removeRootView(popupId.current, forceRemoveAllRootViewOnItemSelected, rootViewsRef.current);
+    }, [removeRootView, forceRemoveAllRootViewOnItemSelected]);
+    // Handle data updates from PopupList
+    const handleDataUpdate = useCallback((newData) => {
+        setData(newData);
+    }, []);
+    // Handle item selection
+    const handleItemPress = useCallback((item) => {
+        onItemSelected === null || onItemSelected === void 0 ? void 0 : onItemSelected(item);
+        hidePopup();
+    }, [onItemSelected, hidePopup]);
+    // Show popup using RootView
+    const showPopup = useCallback(() => {
+        calculatePosition();
+        setIsVisible(true);
+        loadData(searchQueryRef.current);
+        // Wait for position to be calculated
+        setTimeout(() => {
+            const popupComponent = (<TouchableOpacity style={{
+                    flex: 1,
+                    backgroundColor: 'rgba(0, 0, 0, 0.3)',
+                }} activeOpacity={1} onPress={hidePopup}>
+              <View style={{
+                    position: 'absolute',
+                    top: popupPosition.top,
+                    left: popupPosition.left,
+                    width: popupPosition.width,
+                    height: LIST_HEIGHT,
+                    backgroundColor: theme.colors.background,
+                    borderRadius: 8,
+                    shadowColor: '#000',
+                    shadowOffset: { width: 0, height: 2 },
+                    shadowOpacity: 0.25,
+                    shadowRadius: 3.84,
+                    elevation: 5,
+                }}>
+                {useTextInput && (<RNTextInput ref={textInputRef} style={[
+                        styles.inputStyle,
+                        {
+                            height: 40,
+                            borderBottomWidth: 1,
+                            borderBottomColor: theme.colors.border,
+                            paddingHorizontal: 12,
+                            color: theme.colors.text,
+                        },
+                        inputStyle,
+                    ]} placeholder={placeholder} placeholderTextColor={theme.colors.placeholderText} defaultValue={searchQueryRef.current} onChangeText={handleSearchChange} onSubmitEditing={(e) => {
+                        onSubmitEditing === null || onSubmitEditing === void 0 ? void 0 : onSubmitEditing(e);
+                        Keyboard.dismiss();
+                    }} returnKeyType="done" {...TextInputProps}/>)}
+
+                <PopupList data={data} selectedItem={selectedItem} onItemPress={handleItemPress} renderItem={renderItem} keyExtractor={keyExtractor} theme={theme} rootViewsRef={rootViewsRef} fetchData={fetchData} localSearch={localSearch} pageSize={pageSize} onDataUpdate={handleDataUpdate} selectedItemBackgroundColor={selectedItemBackgroundColor}/>
+              </View>
+            </TouchableOpacity>);
+            addRootView({
+                id: popupId.current,
+                style: {
+                    position: 'absolute',
+                    top: 0,
+                    left: 0,
+                    right: 0,
+                    bottom: 0,
+                },
+                component: popupComponent,
+                useModal: true,
+                onModalClose: hidePopup,
+                centerDisplay: centerDisplay,
+            });
+        }, 100);
+    }, [calculatePosition, loadData, popupPosition, useTextInput, placeholder, theme, inputStyle, TextInputProps, data, selectedItem, renderItem, keyExtractor, centerDisplay, addRootView, hidePopup, handleSearchChange, handleItemPress, LIST_HEIGHT, selectedItemBackgroundColor]);
+    // Handle button press
+    const handleButtonPress = useCallback(() => {
+        if (AutoPositionedPopupBtnDisabled)
+            return;
+        if (useTextInput) {
+            showPopup();
+            // Focus text input after a short delay
+            setTimeout(() => {
+                var _a;
+                (_a = textInputRef.current) === null || _a === void 0 ? void 0 : _a.focus();
+            }, 100);
+        }
+        else {
+            showPopup();
+        }
+    }, [AutoPositionedPopupBtnDisabled, useTextInput, showPopup]);
+    // Imperative handle for parent component access
+    useImperativeHandle(parentRef, () => ({
+        clearSelectedItem: () => {
+            // Clear selection logic can be implemented here
+            console.log('Clearing selected item for:', tag);
+        },
+        showPopup,
+        hidePopup,
+    }), [tag, showPopup, hidePopup]);
+    // Cleanup
+    useEffect(() => {
+        return () => {
+            if (debounceTimerRef.current) {
+                clearTimeout(debounceTimerRef.current);
+            }
+        };
+    }, []);
+    // Render the component
+    return (<CustomRow>
+          <View style={[styles.contain, style]} ref={containerRef}>
+            <TouchableOpacity style={[styles.AutoPositionedPopupBtn, AutoPositionedPopupBtnStyle]} disabled={AutoPositionedPopupBtnDisabled} onPress={handleButtonPress}>
+              {btwChildren ? (btwChildren()) : (<Text style={[
+                styles.searchQueryTxt,
+                selectedItem && { color: theme.colors.text },
+                labelStyle,
+            ]} numberOfLines={1} ellipsizeMode="tail">
+                  {(selectedItem === null || selectedItem === void 0 ? void 0 : selectedItem.title) || placeholder}
+                </Text>)}
+            </TouchableOpacity>
+          </View>
+        </CustomRow>);
+}));
+export default AutoPositionedPopup;

package/lib/AutoPositionedPopup.style.d.ts

@@ -0,0 +1,80 @@
+declare const _default: {
+    des: {
+        fontSize: number;
+        lineHeight: number;
+        fontWeight: "400";
+        color: string;
+        marginLeft: number;
+    };
+    ListItemCode: {
+        fontSize: number;
+        lineHeight: number;
+        fontWeight: "600";
+        color: string;
+    };
+    commonModalRow: {
+        height: number;
+        borderBottomWidth: number;
+        overflow: "hidden";
+        alignItems: "center";
+        justifyContent: "center";
+        width: "100%";
+        flexDirection: "row";
+        borderRadius: number;
+    };
+    autoPositionedPopupList: {
+        flex: number;
+        height: "100%";
+        padding: number;
+    };
+    inputStyle: {
+        fontSize: number;
+        fontWeight: "400";
+        lineHeight: number;
+        color: string;
+        width: "90%";
+        textAlign: "right";
+    };
+    AutoPositionedPopupBtn: {
+        flex: number;
+        flexDirection: "row";
+        alignItems: "center";
+    };
+    searchQueryTxt: {
+        fontSize: number;
+        lineHeight: number;
+        color: string;
+        textAlign: "right";
+    };
+    contain: {
+        flex: number;
+        height: "100%";
+    };
+    selectArrow: {
+        marginLeft: number;
+        marginRight: number;
+        width: number;
+        height: number;
+    };
+    AutoDropdownBtnStyle1: {
+        justifyContent: "flex-start";
+    };
+    AutoDropdownBtnStyle: {
+        justifyContent: "flex-end";
+    };
+    usageRowText: {
+        fontSize: number;
+        lineHeight: number;
+        fontWeight: "400";
+        color: string;
+    };
+    AutoDropdownRow: {
+        flex: number;
+        height: number;
+        flexDirection: "row";
+        alignItems: "center";
+        justifyContent: "space-between";
+    };
+};
+export default _default;
+//# sourceMappingURL=AutoPositionedPopup.style.d.ts.map

package/lib/AutoPositionedPopup.style.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AutoPositionedPopup.style.d.ts","sourceRoot":"","sources":["../src/AutoPositionedPopup.style.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA,wBA6EG"}

package/lib/AutoPositionedPopup.style.js

@@ -0,0 +1,79 @@
+import { StyleSheet } from 'react-native';
+export default StyleSheet.create({
+    des: {
+        fontSize: 12,
+        lineHeight: 20,
+        fontWeight: '400',
+        color: '#666666',
+        marginLeft: 4,
+    },
+    ListItemCode: {
+        fontSize: 15,
+        lineHeight: 20,
+        fontWeight: '600',
+        color: '#333333',
+    },
+    commonModalRow: {
+        height: 32,
+        borderBottomWidth: 0,
+        overflow: 'hidden',
+        alignItems: 'center',
+        justifyContent: 'center',
+        width: '100%',
+        flexDirection: 'row',
+        borderRadius: 8,
+    },
+    autoPositionedPopupList: {
+        flex: 1,
+        height: '100%',
+        padding: 12,
+    },
+    inputStyle: {
+        fontSize: 15,
+        fontWeight: '400',
+        lineHeight: 20,
+        color: '#333333',
+        width: '90%',
+        textAlign: 'right',
+    },
+    AutoPositionedPopupBtn: {
+        flex: 1,
+        flexDirection: 'row',
+        alignItems: 'center',
+    },
+    searchQueryTxt: {
+        fontSize: 17,
+        lineHeight: 24,
+        color: '#999999',
+        textAlign: 'right',
+    },
+    contain: {
+        flex: 1,
+        height: '100%',
+    },
+    selectArrow: {
+        marginLeft: 6,
+        marginRight: 8,
+        width: 8,
+        height: 14,
+    },
+    AutoDropdownBtnStyle1: {
+        justifyContent: 'flex-start',
+    },
+    AutoDropdownBtnStyle: {
+        justifyContent: 'flex-end',
+    },
+    usageRowText: {
+        fontSize: 17,
+        lineHeight: 21,
+        fontWeight: '400',
+        color: '#333333',
+    },
+    AutoDropdownRow: {
+        flex: 1,
+        height: 50,
+        flexDirection: 'row',
+        alignItems: 'center',
+        justifyContent: 'space-between',
+    },
+});

package/lib/AutoPositionedPopupProps.d.ts

@@ -0,0 +1,58 @@
+import React from 'react';
+import { StyleProp, TextInputProps, TextStyle, ViewStyle } from 'react-native';
+import { TextInputSubmitEditingEventData } from 'react-native/Libraries/Components/TextInput/TextInput';
+import { NativeSyntheticEvent } from 'react-native/Libraries/Types/CoreEventTypes';
+export interface Data {
+    items: any[];
+    pageIndex: number;
+    needLoadMore: boolean;
+}
+export interface SelectedItem {
+    id: string;
+    title: string;
+}
+/**
+ * Props interface for AutoPositionedPopup component
+ */
+export interface AutoPositionedPopupProps {
+    style?: ViewStyle;
+    labelStyle?: ViewStyle;
+    tag: string;
+    tagStyle?: ViewStyle;
+    fetchData?: ({ pageIndex, pageSize, searchQuery, }: {
+        pageIndex: number;
+        pageSize: number;
+        searchQuery?: string;
+    }) => Promise<Data | null>;
+    renderItem?: ({ item, index }: {
+        item: SelectedItem;
+        index: number;
+    }) => React.ReactElement;
+    onItemSelected?: (item: SelectedItem) => void;
+    onSubmitEditing?: (e: NativeSyntheticEvent<TextInputSubmitEditingEventData>) => void;
+    localSearch?: boolean;
+    placeholder?: string;
+    textAlign?: 'left' | 'center' | 'right' | undefined;
+    pageSize?: number;
+    selectedItem?: SelectedItem | any;
+    CustomRow?: React.ComponentType<ViewStyle & {
+        children?: React.ReactNode;
+    }>;
+    btwChildren?: () => React.ReactNode;
+    useTextInput?: boolean;
+    keyExtractor?: (item: SelectedItem) => string;
+    CustomPopView?: () => React.ComponentType<ViewStyle & {
+        children?: React.ReactNode;
+        selectedItem?: SelectedItem | any;
+    }>;
+    CustomPopViewStyle?: ViewStyle;
+    forceRemoveAllRootViewOnItemSelected?: boolean;
+    inputStyle?: StyleProp<TextStyle>;
+    TextInputProps?: TextInputProps;
+    popUpViewStyle?: ViewStyle;
+    AutoPositionedPopupBtnStyle?: ViewStyle;
+    AutoPositionedPopupBtnDisabled?: boolean;
+    centerDisplay?: boolean;
+    selectedItemBackgroundColor?: string;
+}
+//# sourceMappingURL=AutoPositionedPopupProps.d.ts.map

package/lib/AutoPositionedPopupProps.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AutoPositionedPopupProps.d.ts","sourceRoot":"","sources":["../src/AutoPositionedPopupProps.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,SAAS,EAAE,cAAc,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAC/E,OAAO,EAAE,+BAA+B,EAAE,MAAM,uDAAuD,CAAC;AACxG,OAAO,EAAE,oBAAoB,EAAE,MAAM,6CAA6C,CAAC;AAEnF,MAAM,WAAW,IAAI;IACnB,KAAK,EAAE,GAAG,EAAE,CAAC;IACb,SAAS,EAAE,MAAM,CAAC;IAClB,YAAY,EAAE,OAAO,CAAC;CACvB;AAED,MAAM,WAAW,YAAY;IAC3B,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;CACf;AAED;;GAEG;AACH,MAAM,WAAW,wBAAwB;IACvC,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,GAAG,EAAE,MAAM,CAAC;IACZ,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,SAAS,CAAC,EAAE,CAAC,EACX,SAAS,EACT,QAAQ,EACR,WAAW,GACZ,EAAE;QACD,SAAS,EAAE,MAAM,CAAC;QAClB,QAAQ,EAAE,MAAM,CAAC;QACjB,WAAW,CAAC,EAAE,MAAM,CAAC;KACtB,KAAK,OAAO,CAAC,IAAI,GAAG,IAAI,CAAC,CAAC;IAC3B,UAAU,CAAC,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,EAAE;QAAE,IAAI,EAAE,YAAY,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,KAAK,KAAK,CAAC,YAAY,CAAC;IAC5F,cAAc,CAAC,EAAE,CAAC,IAAI,EAAE,YAAY,KAAK,IAAI,CAAC;IAC9C,eAAe,CAAC,EAAE,CAAC,CAAC,EAAE,oBAAoB,CAAC,+BAA+B,CAAC,KAAK,IAAI,CAAC;IACrF,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,OAAO,GAAG,SAAS,CAAC;IACpD,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,YAAY,CAAC,EAAE,YAAY,GAAG,GAAG,CAAC;IAClC,SAAS,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,SAAS,GAAG;QAAE,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;KAAE,CAAC,CAAC;IAC5E,WAAW,CAAC,EAAE,MAAM,KAAK,CAAC,SAAS,CAAC;IACpC,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,YAAY,KAAK,MAAM,CAAC;IAC9C,aAAa,CAAC,EAAE,MAAM,KAAK,CAAC,aAAa,CACvC,SAAS,GAAG;QACV,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;QAC3B,YAAY,CAAC,EAAE,YAAY,GAAG,GAAG,CAAC;KACnC,CACF,CAAC;IACF,kBAAkB,CAAC,EAAE,SAAS,CAAC;IAC/B,oCAAoC,CAAC,EAAE,OAAO,CAAC;IAC/C,UAAU,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAClC,cAAc,CAAC,EAAE,cAAc,CAAC;IAChC,cAAc,CAAC,EAAE,SAAS,CAAC;IAC3B,2BAA2B,CAAC,EAAE,SAAS,CAAC;IACxC,8BAA8B,CAAC,EAAE,OAAO,CAAC;IACzC,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,2BAA2B,CAAC,EAAE,MAAM,CAAC;CACtC"}

package/lib/AutoPositionedPopupProps.js

@@ -0,0 +1 @@
+export {};

package/lib/RootViewContext.d.ts

@@ -0,0 +1,31 @@
+import React, { ReactNode } from 'react';
+import { ViewStyle } from 'react-native';
+interface DynamicViewBase {
+    id: string;
+    style: ViewStyle;
+    component: ReactNode;
+    useModal?: boolean;
+    onModalClose?: () => void;
+    centerDisplay?: boolean;
+}
+interface RootViewContextType {
+    addRootView: (view: DynamicViewBase) => void;
+    setRootViewNativeStyle: (id: string, style: ViewStyle) => void;
+    updateRootView: (id: string, update: Partial<DynamicViewBase>) => void;
+    removeRootView: (id?: string, force?: boolean, _rootViews?: DynamicViewBase[]) => void;
+    rootViews: DynamicViewBase[];
+    searchQuery: string;
+    setSearchQuery: (searchQuery: string) => void;
+}
+interface RootViewProviderProps {
+    children: ReactNode;
+}
+/**
+ * Dynamically add or remove views on the root view.
+ * @param children
+ * @constructor
+ */
+export declare const RootViewProvider: React.FC<RootViewProviderProps>;
+export declare const useRootView: () => RootViewContextType;
+export {};
+//# sourceMappingURL=RootViewContext.d.ts.map

package/lib/RootViewContext.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"RootViewContext.d.ts","sourceRoot":"","sources":["../src/RootViewContext.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAmE,MAAM,OAAO,CAAC;AAC1G,OAAO,EAAmB,SAAS,EAAE,MAAM,cAAc,CAAC;AAE1D,UAAU,eAAe;IACvB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,SAAS,CAAC;IACjB,SAAS,EAAE,SAAS,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB;AAED,UAAU,mBAAmB;IAC3B,WAAW,EAAE,CAAC,IAAI,EAAE,eAAe,KAAK,IAAI,CAAC;IAC7C,sBAAsB,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,KAAK,EAAE,SAAS,KAAK,IAAI,CAAC;IAC/D,cAAc,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,MAAM,EAAE,OAAO,CAAC,eAAe,CAAC,KAAK,IAAI,CAAC;IACvE,cAAc,EAAE,CAAC,EAAE,CAAC,EAAE,MAAM,EAAE,KAAK,CAAC,EAAE,OAAO,EAAE,UAAU,CAAC,EAAE,eAAe,EAAE,KAAK,IAAI,CAAC;IACvF,SAAS,EAAE,eAAe,EAAE,CAAC;IAC7B,WAAW,EAAE,MAAM,CAAC;IACpB,cAAc,EAAE,CAAC,WAAW,EAAE,MAAM,KAAK,IAAI,CAAC;CAC/C;AAED,UAAU,qBAAqB;IAC7B,QAAQ,EAAE,SAAS,CAAC;CACrB;AAGD;;;;GAIG;AACH,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,qBAAqB,CA+I5D,CAAC;AAIF,eAAO,MAAM,WAAW,QAAO,mBAM9B,CAAC"}