@teamnhz/rn-ui-toolkit 1.0.1 → 1.0.3

package/dist/components/KeyboardScroll/index.js

@@ -0,0 +1,76 @@
+import React from "react";
+import { KeyboardAwareScrollView } from "react-native-keyboard-aware-scroll-view";
+const KeyboardScroll = (props) => {
+    return (React.createElement(KeyboardAwareScrollView, { showsVerticalScrollIndicator: false, keyboardShouldPersistTaps: "handled", bounces: false, enableAutomaticScroll: true, ...props }));
+};
+export default KeyboardScroll;
+// import React from "react";
+// import { KeyboardAwareScrollView } from "react-native-keyboard-aware-scroll-view";
+// const KeyboardScroll = (props: any) => {
+//   return (
+//     <KeyboardAwareScrollView
+//       showsVerticalScrollIndicator={false}
+//       keyboardShouldPersistTaps={"handled"}
+//       bounces={false}
+//       enableAutomaticScroll={true}
+//       {...props}
+//     ></KeyboardAwareScrollView>
+//   );
+// };
+// export default KeyboardScroll;
+/////////////////////////////////////////////////////////////////////
+// import React, { ReactNode } from 'react';
+// import { StyleSheet, ViewStyle, Platform } from 'react-native';
+// import { Edges, SafeAreaView } from 'react-native-safe-area-context';
+// import { Colors, Scale } from '../../styles';
+// import { ScrollView } from 'react-native';
+// type ScrolledContainerProps = {
+//   children: ReactNode;
+//   containerStyle?: ViewStyle;
+//   safeEdgesTop?: boolean;
+//   safeEdgesBottom?: boolean;
+//   addPaddingTop?: boolean;
+//   scrollEnabled?: boolean;   // in case you want to toggle scroll
+//   keyboardShouldPersistTaps?: 'always' | 'handled' | 'never';
+// };
+// const ScrolledContainer = ({
+//   containerStyle,
+//   children,
+//   safeEdgesTop,
+//   safeEdgesBottom,
+//   addPaddingTop,
+//   scrollEnabled = true,
+//   keyboardShouldPersistTaps = 'handled',
+// }: ScrolledContainerProps) => {
+//   const edges: any = ['left', 'right'];
+//   if (safeEdgesTop) edges.push('top');
+//   if (safeEdgesBottom) edges.push('bottom');
+//   return (
+//     <SafeAreaView edges={edges} style={styles.globalSafeAreaStyle}>
+//       <ScrollView
+//         contentContainerStyle={[
+//           styles.screen,
+//           addPaddingTop && { paddingTop: Scale?.moderateScale(50) },
+//           containerStyle,
+//         ]}
+//         showsVerticalScrollIndicator={false}
+//         scrollEnabled={scrollEnabled}
+//         keyboardShouldPersistTaps={keyboardShouldPersistTaps}
+//       >
+//         {children}
+//       </ScrollView>
+//     </SafeAreaView>
+//   );
+// };
+// export default ScrolledContainer;
+// const styles = StyleSheet.create({
+//   globalSafeAreaStyle: {
+//     flex: 1,
+//     backgroundColor: Colors.background,
+//     paddingBottom: Platform.OS === 'android' ? Scale?.moderateScale(10) : 0,
+//   },
+//   screen: {
+//     flexGrow: 1,  // makes ScrollView expand & scroll
+//     paddingTop: Scale?.moderateScale(20),
+//   },
+// });

package/dist/components/Modal/index.d.ts

@@ -1,5 +1,5 @@
-import React, { ReactNode } from 'react';
-import { ModalProps } from 'react-native-modal';
+import React, { ReactNode } from "react";
+import { ModalProps } from "react-native-modal";
 type AppModalProps = Partial<ModalProps> & {
     children: ReactNode;
     closing: () => void;

package/dist/components/Modal/index.js

@@ -1,5 +1,33 @@
-import React from 'react';
-import Modal from 'react-native-modal';
+import React from "react";
+import Modal from "react-native-modal";
 // Base Modal Component customized for app needs
-const Modals = ({ children, closing, bkO = 0.5, ...props }) => (React.createElement(Modal, { backdropOpacity: bkO, animationInTiming: 400, animationOutTiming: 400, backdropTransitionOutTiming: 0, swipeDirection: ['down', 'left', 'right', 'up'], onSwipeComplete: closing, onBackdropPress: closing, onBackButtonPress: closing, ...props }, children));
+const Modals = ({ children, closing, bkO = 0.5, ...props }) => (React.createElement(Modal, { backdropOpacity: bkO, animationInTiming: 400, animationOutTiming: 400, backdropTransitionOutTiming: 0, swipeDirection: ["down", "left", "right", "up"], onSwipeComplete: closing, onBackdropPress: closing, onBackButtonPress: closing, ...props }, children));
 export default Modals;
+// import React, { ReactNode } from 'react';
+// import Modal, { ModalProps } from 'react-native-modal';
+// type AppModalProps = Partial<ModalProps> & {
+//   children: ReactNode;
+//   closing: () => void;
+//   bkO?: number;
+// };
+// // Base Modal Component customized for app needs
+// const Modals = ({
+//   children,
+//   closing,
+//   bkO = 0.5,
+//   ...props
+// }: AppModalProps) => (
+//   <Modal
+//     backdropOpacity={bkO}
+//     animationInTiming={400}
+//     animationOutTiming={400}
+//     backdropTransitionOutTiming={0}
+//     swipeDirection={['down', 'left', 'right', 'up']}
+//     onSwipeComplete={closing}
+//     onBackdropPress={closing}
+//     onBackButtonPress={closing}
+//     {...props}>
+//     {children}
+//   </Modal>
+// );
+// export default Modals;

package/dist/components/Switch/index.d.ts

@@ -1,6 +1,16 @@
-import React from 'react';
-declare const SwitchUI: ({ isEnabled, onValueChange }: {
+import React from "react";
+import { StyleProp, ViewStyle, ColorValue } from "react-native";
+type SwitchUIProps = {
     isEnabled?: boolean;
     onValueChange?: (value: boolean) => void;
-}) => React.JSX.Element;
+    disabled?: boolean;
+    trackColor?: {
+        false?: ColorValue;
+        true?: ColorValue;
+    };
+    thumbColor?: ColorValue;
+    ios_backgroundColor?: ColorValue;
+    switchStyle?: StyleProp<ViewStyle>;
+};
+declare const SwitchUI: ({ isEnabled, onValueChange, disabled, trackColor, thumbColor, ios_backgroundColor, switchStyle, }: SwitchUIProps) => React.JSX.Element;
 export default SwitchUI;

package/dist/components/Switch/index.js

@@ -1,23 +1,104 @@
-import React, { useState } from 'react';
-import { View, Switch, StyleSheet } from 'react-native';
-import { Colors } from '../../styles';
-// Switch component
-const SwitchUI = ({ isEnabled, onValueChange }) => {
+// import React, { useState } from "react";
+// import { View, Switch, StyleSheet } from "react-native";
+// import { Colors } from "../../styles";
+// // Switch component
+// const SwitchUI = ({
+//   isEnabled,
+//   onValueChange,
+// }: {
+//   isEnabled?: boolean;
+//   onValueChange?: (value: boolean) => void;
+// }) => {
+//   const [internalState, setInternalState] = useState(isEnabled ?? false);
+//   const toggleSwitch = () => {
+//     setInternalState((prev) => !prev);
+//     onValueChange && onValueChange(!internalState);
+//   };
+//   const value = isEnabled ?? internalState;
+//   return (
+//     <View
+//       style={[
+//         styles.container,
+//         { borderColor: value ? Colors.primaryColor : Colors.disabledGrey },
+//       ]}
+//     >
+//       <Switch
+//         trackColor={{ false: Colors.textGrey, true: Colors.appThemeColor }}
+//         style={{ transform: [{ scaleX: 0.8 }, { scaleY: 0.8 }] }}
+//         thumbColor={value ? Colors.black : Colors.disabledGrey}
+//         onValueChange={toggleSwitch}
+//         value={value}
+//       />
+//     </View>
+//   );
+// };
+// const styles = StyleSheet.create({
+//   container: {
+//     flex: 1,
+//   },
+// });
+// export default SwitchUI;
+import React, { useState } from "react";
+import { View, Switch, StyleSheet, } from "react-native";
+import { Colors } from "../../styles";
+const SwitchUI = ({ isEnabled, onValueChange, disabled = false, trackColor = { false: Colors.textGrey, true: Colors.appThemeColor }, thumbColor, ios_backgroundColor = Colors.disabledGrey, switchStyle, }) => {
     const [internalState, setInternalState] = useState(isEnabled ?? false);
     const toggleSwitch = () => {
-        setInternalState(prev => !prev);
+        setInternalState((prev) => !prev);
         onValueChange && onValueChange(!internalState);
     };
     const value = isEnabled ?? internalState;
-    return (React.createElement(View, { style: [
-            styles.container,
-            { borderColor: value ? Colors.primaryColor : Colors.disabledGrey },
-        ] },
-        React.createElement(Switch, { trackColor: { false: 'grey', true: 'green' }, style: { transform: [{ scaleX: 0.8 }, { scaleY: 0.8 }] }, thumbColor: value ? Colors.primaryColor : Colors.disabledGrey, onValueChange: toggleSwitch, value: value })));
+    return (React.createElement(View, { style: styles.container },
+        React.createElement(Switch, { disabled: disabled, trackColor: trackColor, thumbColor: thumbColor ?? (value ? Colors.black : Colors.disabledGrey), ios_backgroundColor: ios_backgroundColor, style: [styles.switch, switchStyle], onValueChange: toggleSwitch, value: value })));
 };
 const styles = StyleSheet.create({
     container: {
-        flex: 1
+        flex: 0,
+        alignItems: "center",
+        justifyContent: "center",
+    },
+    switch: {
+        transform: [{ scaleX: 1 }, { scaleY: 1 }], // default broad look
     },
 });
 export default SwitchUI;
+// import React, { useState } from "react";
+// import { View, Switch, StyleSheet } from "react-native";
+// import { Colors } from "../../styles";
+// // Switch component
+// const SwitchUI = ({
+//   isEnabled,
+//   onValueChange,
+// }: {
+//   isEnabled?: boolean;
+//   onValueChange?: (value: boolean) => void;
+// }) => {
+//   const [internalState, setInternalState] = useState(isEnabled ?? false);
+//   const toggleSwitch = () => {
+//     setInternalState((prev) => !prev);
+//     onValueChange && onValueChange(!internalState);
+//   };
+//   const value = isEnabled ?? internalState;
+//   return (
+//     <View
+//       style={[
+//         styles.container,
+//         { borderColor: value ? Colors.primaryColor : Colors.disabledGrey },
+//       ]}
+//     >
+//       <Switch
+//         trackColor={{ false: "grey", true: "green" }}
+//         style={{ transform: [{ scaleX: 0.8 }, { scaleY: 0.8 }] }}
+//         thumbColor={value ? Colors.primaryColor : Colors.disabledGrey}
+//         onValueChange={toggleSwitch}
+//         value={value}
+//       />
+//     </View>
+//   );
+// };
+// const styles = StyleSheet.create({
+//   container: {
+//     flex: 1,
+//   },
+// });
+// export default SwitchUI;

package/dist/components/T/index.d.ts

@@ -1,7 +1,7 @@
-import React from 'react';
-import { TextProps, TextStyle } from 'react-native';
+import React from "react";
+import { TextProps, TextStyle } from "react-native";
 type AppTextProps = TextProps & {
-    title: string;
+    title?: string;
     value?: string | number;
     value2?: string | number;
     value3?: string | number;
@@ -12,6 +12,7 @@ type AppTextProps = TextProps & {
     isTime?: boolean;
     isDate?: boolean;
     reactComponent?: React.ReactNode;
+    children?: React.ReactNode;
 };
-declare const T: ({ title, value, value2, value3, intlType, textStyle, isTime, isDate, reactComponent, color, size, ...props }: AppTextProps) => React.JSX.Element;
+declare const T: ({ title, value, value2, value3, intlType, textStyle, isTime, isDate, reactComponent, children, color, size, ...props }: AppTextProps) => React.JSX.Element;
 export default T;

package/dist/components/T/index.js

@@ -1,9 +1,9 @@
-import React from 'react';
-import { Text } from 'react-native';
-import { useTranslation } from 'react-i18next';
-import { Colors, Scale, Typography } from '../../styles';
-const T = ({ title, value, value2, value3, intlType, textStyle, isTime, isDate, reactComponent, color = Colors.textColor, size = 14, ...props }) => {
-    const { t } = useTranslation(['common', 'validation', 'address']);
+import React from "react";
+import { Text } from "react-native";
+import { useTranslation } from "react-i18next";
+import { Colors, Scale, Typography } from "../../styles";
+const T = ({ title, value, value2, value3, intlType, textStyle, isTime, isDate, reactComponent, children, color = Colors.textColor, size = 14, ...props }) => {
+    const { t } = useTranslation(["common", "validation", "address"]);
     const defaultStyles = {
         color,
         ...Typography.style.standardU(),
@@ -12,9 +12,68 @@ const T = ({ title, value, value2, value3, intlType, textStyle, isTime, isDate,
     const textStyles = Array.isArray(textStyle)
         ? [defaultStyles, ...textStyle]
         : [defaultStyles, textStyle];
-    const renderText = () => intlType
-        ? t(title, { ns: intlType, value, value2, value3 })
-        : t(title, { value, value2, value3 });
-    return (React.createElement(Text, { style: textStyles, ...props }, reactComponent || (isTime || isDate ? title : renderText())));
+    const renderText = () => {
+        if (children)
+            return children; // ✅ children take priority
+        if (reactComponent)
+            return reactComponent;
+        if (isTime || isDate)
+            return title;
+        if (intlType)
+            return t(title || "", { ns: intlType, value, value2, value3 });
+        return t(title || "", { value, value2, value3 });
+    };
+    return (React.createElement(Text, { style: textStyles, ...props }, renderText()));
 };
 export default T;
+// import React from 'react';
+// import { Text, TextProps, TextStyle } from 'react-native';
+// import { useTranslation } from 'react-i18next';
+// import { Colors, Scale, Typography } from '../../styles';
+// type AppTextProps = TextProps & {
+//   title: string;
+//   value?: string | number;
+//   value2?: string | number;
+//   value3?: string | number;
+//   intlType?: string;
+//   textStyle?: TextStyle | TextStyle[];
+//   color?: string;
+//   size?: number;
+//   isTime?: boolean;
+//   isDate?: boolean;
+//   reactComponent?: React.ReactNode;
+// };
+// const T = ({
+//   title,
+//   value,
+//   value2,
+//   value3,
+//   intlType,
+//   textStyle,
+//   isTime,
+//   isDate,
+//   reactComponent,
+//   color = Colors.textColor,
+//   size = 14,
+//   ...props
+// }: AppTextProps) => {
+//   const { t } = useTranslation(['common', 'validation', 'address']);
+//   const defaultStyles = {
+//     color,
+//     ...Typography.style.standardU(),
+//     fontSize: Scale.moderateScale(size),
+//   };
+//   const textStyles = Array.isArray(textStyle)
+//     ? [defaultStyles, ...textStyle]
+//     : [defaultStyles, textStyle];
+//   const renderText = () =>
+//     intlType
+//       ? t(title, { ns: intlType, value, value2, value3 })
+//       : t(title, { value, value2, value3 });
+//   return (
+//     <Text style={textStyles} {...props}>
+//       {reactComponent || (isTime || isDate ? title : renderText())}
+//     </Text>
+//   );
+// };
+// export default T;

package/dist/components/Toast/index.js

@@ -43,9 +43,7 @@ const Toast = ({ visible, message, duration = 2000, onHide, type = "info", posit
                     styles.toast,
                     { backgroundColor: getBackgroundColor(), opacity: fadeAnim },
                 ] },
-                icon && (React.createElement(View, { style: styles.iconWrapper }, typeof icon === "string" && icon.startsWith("http")
-                    ? React.createElement(Image, { source: { uri: icon }, style: styles.icon, resizeMode: "contain" })
-                    : React.createElement(Image, { source: icon, style: styles.icon, resizeMode: "contain" }))),
+                icon && (React.createElement(View, { style: styles.iconWrapper }, typeof icon === "string" && icon.startsWith("http") ? (React.createElement(Image, { source: { uri: icon }, style: styles.icon, resizeMode: "contain" })) : (React.createElement(Image, { source: icon, style: styles.icon, resizeMode: "contain" })))),
                 React.createElement(Text, { style: styles.text }, message)))));
 };
 export default Toast;
@@ -82,3 +80,125 @@ const styles = StyleSheet.create({
         resizeMode: "contain",
     },
 });
+// import React, { useEffect, useRef } from "react";
+// import {
+//   Modal,
+//   View,
+//   Text,
+//   StyleSheet,
+//   Animated,
+//   Image,
+//   ViewStyle,
+// } from "react-native";
+// import { Colors } from "../../styles";
+// interface AppToastProps {
+//   visible: boolean;
+//   message: string;
+//   duration?: number; // in ms
+//   onHide: () => void;
+//   type?: "success" | "danger" | "warning" | "info" | "custom";
+//   position?: "top" | "bottom";
+//   customColor?: string;
+//   icon?: any; // Image source or React Node
+// }
+// const Toast: React.FC<AppToastProps> = ({
+//   visible,
+//   message,
+//   duration = 2000,
+//   onHide,
+//   type = "info",
+//   position = "top",
+//   customColor,
+//   icon,
+// }) => {
+//   const fadeAnim = useRef(new Animated.Value(0)).current;
+//   const getBackgroundColor = () => {
+//     if (customColor) return customColor;
+//     switch (type) {
+//       case "success":
+//         return Colors.lightGreen || "green";
+//       case "danger":
+//         return Colors.dangerRed || "red";
+//       case "warning":
+//         return Colors.starGold || "orange";
+//       case "info":
+//         return Colors.primaryColor || "blue";
+//       default:
+//         return Colors.black;
+//     }
+//   };
+//   useEffect(() => {
+//     if (visible) {
+//       Animated.timing(fadeAnim, {
+//         toValue: 1,
+//         duration: 300,
+//         useNativeDriver: true,
+//       }).start();
+//       const timer = setTimeout(() => {
+//         onHide();
+//       }, duration);
+//       return () => clearTimeout(timer);
+//     }
+//   }, [visible]);
+//   const containerStyle: ViewStyle = {
+//     justifyContent: position === "top" ? "flex-start" : "flex-end",
+//     marginTop: position === "top" ? 20 : 0,
+//     marginBottom: position === "bottom" ? 60 : 0,
+//   };
+//   return (
+//     <Modal transparent visible={visible} animationType="fade">
+//       <View style={[styles.overlay, containerStyle]}>
+//         <Animated.View
+//           style={[
+//             styles.toast,
+//             { backgroundColor: getBackgroundColor(), opacity: fadeAnim },
+//           ]}
+//         >
+//           {icon && (
+//             <View style={styles.iconWrapper}>
+//               {typeof icon === "string" && icon.startsWith("http")
+//                 ? <Image source={{ uri: icon }} style={styles.icon} resizeMode="contain" />
+//                 : <Image source={icon} style={styles.icon} resizeMode="contain"  />
+//               }
+//             </View>
+//           )}
+//           <Text style={styles.text}>{message}</Text>
+//         </Animated.View>
+//       </View>
+//     </Modal>
+//   );
+// };
+// export default Toast;
+// const styles = StyleSheet.create({
+//   overlay: {
+//     flex: 1,
+//     alignItems: "center",
+//   },
+//   toast: {
+//     flexDirection: "row",
+//     alignItems: "center",
+//     paddingHorizontal: 16,
+//     paddingVertical: 12,
+//     borderRadius: 10,
+//     maxWidth: "90%",
+//     minWidth: "70%",
+//     shadowColor: "#000",
+//     shadowOffset: { width: 0, height: 2 },
+//     shadowOpacity: 0.3,
+//     shadowRadius: 3,
+//     elevation: 4,
+//   },
+//   text: {
+//     color: Colors.white,
+//     fontSize: 14,
+//     flexShrink: 1,
+//   },
+//   iconWrapper: {
+//     marginRight: 8,
+//   },
+//   icon: {
+//     width: 20,
+//     height: 20,
+//     resizeMode: "contain",
+//   },
+// });

package/dist/components/VerticalFlatList/index.d.ts

@@ -1,7 +1,7 @@
 import React from "react";
-import { FlatListProps } from "react-native";
+import { FlatList, FlatListProps } from "react-native";
 interface VerticalFlatListProps<ItemT> extends FlatListProps<ItemT> {
     spacing?: number;
 }
-declare const VerticalFlatList: <ItemT>({ spacing, ...props }: VerticalFlatListProps<ItemT>) => React.JSX.Element;
+declare const VerticalFlatList: React.ForwardRefExoticComponent<VerticalFlatListProps<unknown> & React.RefAttributes<FlatList<unknown>>>;
 export default VerticalFlatList;

package/dist/components/VerticalFlatList/index.js

@@ -1,6 +1,23 @@
-import React from "react";
-import { FlatList, View } from "react-native";
-const VerticalFlatList = ({ spacing = 0, ...props }) => {
-    return (React.createElement(FlatList, { ...props, ItemSeparatorComponent: () => React.createElement(View, { style: { height: spacing } }), showsVerticalScrollIndicator: props.showsVerticalScrollIndicator ?? false }));
-};
+import React, { forwardRef } from "react";
+import { FlatList, View, } from "react-native";
+const VerticalFlatList = forwardRef(({ spacing = 0, ...props }, ref) => {
+    return (React.createElement(FlatList, { ...props, ref: ref, ItemSeparatorComponent: () => React.createElement(View, { style: { height: spacing } }), showsVerticalScrollIndicator: props.showsVerticalScrollIndicator ?? false }));
+});
 export default VerticalFlatList;
+// import { FlatList, FlatListProps, View, StyleSheet } from "react-native";
+// interface VerticalFlatListProps<ItemT> extends FlatListProps<ItemT> {
+//   spacing?: number; // extra control for spacing between items
+// }
+// const VerticalFlatList = <ItemT,>({
+//   spacing = 0,
+//   ...props
+// }: VerticalFlatListProps<ItemT>) => {
+//   return (
+//     <FlatList
+//       {...props}
+//       ItemSeparatorComponent={() => <View style={{ height: spacing }} />}
+//       showsVerticalScrollIndicator={props.showsVerticalScrollIndicator ?? false}
+//     />
+//   );
+// };
+// export default VerticalFlatList;

package/dist/components/index.d.ts

@@ -1,29 +1,29 @@
-export { default as Buttons } from './Buttons';
-export { default as Container } from './Container';
-export { default as Dividers } from './Dividers';
-export { default as Image } from './Image';
-export { default as Input } from './Input';
-export { default as Modal } from './Modal';
-export { default as Spinner } from './Spinner';
-export { default as T } from './T';
-export { default as FullSpinner } from './FullSpinner';
-export { default as ScrolledContainer } from './ScrolledContainer';
-export { default as MyStatusBar } from './MyStatusBar';
-export { default as Switch } from './Switch';
-export { default as DropDown } from './DropDown';
-export { default as CheckBox } from './CheckBox';
-export { default as RadioButton } from './RadioButton';
-export { default as DateTimePicker } from './DateTimePicker';
-export { default as VProgressSteps } from './VProgressSteps';
-export { default as HProgressSteps } from './HProgressSteps';
-export { default as VStack } from './VStack';
-export { default as HStack } from './HStack';
-export { default as Accordion } from './Accordion';
-export { default as VerticalFlatList } from './VerticalFlatList';
-export { default as HorizontalFlatList } from './HorizontalFlatList';
-export { default as Toast } from './Toast';
-export { default as BottomSheet } from './BottomSheet';
-export { default as ProgressBar } from './ProgressBar';
-export { default as DocumentPicker } from './DocumentPicker';
-export { default as ImagePicker } from './ImagePicker';
-export { default as AppHeader } from './AppHeader';
+export { default as Buttons } from "./Buttons";
+export { default as Container } from "./Container";
+export { default as Dividers } from "./Dividers";
+export { default as Image } from "./Image";
+export { default as Input } from "./Input";
+export { default as Modal } from "./Modal";
+export { default as Spinner } from "./Spinner";
+export { default as T } from "./T";
+export { default as FullSpinner } from "./FullSpinner";
+export { default as KeyboardScroll } from "./KeyboardScroll";
+export { default as MyStatusBar } from "./MyStatusBar";
+export { default as Switch } from "./Switch";
+export { default as DropDown } from "./DropDown";
+export { default as CheckBox } from "./CheckBox";
+export { default as RadioButton } from "./RadioButton";
+export { default as DateTimePicker } from "./DateTimePicker";
+export { default as VProgressSteps } from "./VProgressSteps";
+export { default as HProgressSteps } from "./HProgressSteps";
+export { default as VStack } from "./VStack";
+export { default as HStack } from "./HStack";
+export { default as Accordion } from "./Accordion";
+export { default as VerticalFlatList } from "./VerticalFlatList";
+export { default as HorizontalFlatList } from "./HorizontalFlatList";
+export { default as Toast } from "./Toast";
+export { default as BottomSheet } from "./BottomSheet";
+export { default as ProgressBar } from "./ProgressBar";
+export { default as DocumentPicker } from "./DocumentPicker";
+export { default as ImagePicker } from "./ImagePicker";
+export { default as AppHeader } from "./AppHeader";