react-native-boxes 1.3.19 → 1.3.22

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-boxes",
-  "version": "1.3.19",
+  "version": "1.3.22",
   "description": "A react native library for rapid development of UI using boxes",
   "main": "src/index.js",
   "scripts": {

package/src/Bar.tsx

@@ -1,9 +1,9 @@
 import { useContext } from "react";
-import { StatusBar, TextStyle, ViewProps } from "react-native";
+import { StatusBar, TextStyle, View, ViewProps } from "react-native";
 import { ThemeContext } from "./ThemeContext";
 import * as React from 'react'
 import { Center, HBox } from "./Box";
-import { TextView } from "./Text";
+import { Caption, TextView } from "./Text";
 import { Icon, getIcon } from "./Image";
 import { useSafeAreaInsets } from "react-native-safe-area-context";
 import { PressableView } from "./Button";
@@ -213,4 +213,42 @@ export function BottomNavBar(props: ViewProps &
         </HBox>
     )
 
+}
+
+
+
+export type DividerProps = ViewProps & {
+    text?: string
+}
+export function DividerView(props: DividerProps) {
+
+    const theme = useContext(ThemeContext)
+    return (
+        <Center style={{
+            marginTop: theme.dimens.space.md,
+            marginBottom: theme.dimens.space.md,
+            flexDirection: "row",
+            width: '100%',
+            justifyContent: 'space-between'
+        }}
+            {...props}
+        >
+            <View style={{
+                backgroundColor: theme.colors.caption,
+                width: props?.text ? '40%' : '50%',
+                height: 0.1
+            }} />
+            {
+                props?.text &&
+                <Caption>
+                    {props.text}
+                </Caption>
+            }
+            <View style={{
+                backgroundColor: theme.colors.caption,
+                width: props?.text ? '40%' : '50%',
+                height: 0.1
+            }} />
+        </Center>
+    )
 }

package/src/Box.tsx

@@ -82,7 +82,7 @@ export function VPage(props: ViewProps) {
  * @param param0 
  * @returns 
  */
-const KeyboardAvoidingScrollView: React.FC<ScrollViewProps> = (props: ScrollViewProps) => {
+export const KeyboardAvoidingScrollView: React.FC<ScrollViewProps> = (props: ScrollViewProps) => {
     const theme = useContext(ThemeContext)
     let insets
     try {
@@ -111,8 +111,6 @@ const KeyboardAvoidingScrollView: React.FC<ScrollViewProps> = (props: ScrollView
     )
 }
 
-export default KeyboardAvoidingScrollView
-
 export function CardView(props: ViewProps) {
 
     const theme = useContext(ThemeContext)

package/src/demo.tsx

@@ -8,7 +8,7 @@ import { AlertMessage } from './Message';
 import { BottomSheet, DropDownView } from './Modal';
 import { Avatar, Icon } from './Image';
 import { ReactWrapper } from './utils';
-import KeyboardAvoidingScrollView, { Box } from './Box';
+import { Box, KeyboardAvoidingScrollView } from './Box';
 import { DarkColors, LightColors } from './Styles';
 
 export interface DemoScreenProps {