mg-library 1.0.718 → 1.0.720

package/components.js

@@ -1,6 +1,6 @@
 import React, { useRef, useState } from "react";
 import { Platform, Animated, View } from "react-native";
-import { Box, Text, Divider, Button, ButtonText, ButtonIcon, Icon, Popover, PopoverTrigger, PopoverContent, PopoverArrow, PopoverCloseButton, PopoverBody, PopoverFooter } from '@gluestack-ui/themed';
+import { Box, Text, Divider, Button, ButtonText, ButtonIcon, Icon, Popover, PopoverTrigger, PopoverBackdrop, PopoverContent, PopoverArrow, PopoverCloseButton, PopoverBody, PopoverFooter } from '@gluestack-ui/themed';
 import MaterialCommunityIcons from 'react-native-vector-icons/MaterialCommunityIcons';
 
 import * as mgFunctionsLib from './functions.js';
@@ -170,63 +170,54 @@ export function MGButton({
 export function MGPopover(props) {
     const [visible, setVisible] = useState(false);
     const footer = (
-        <View style={{ flexGrow: 1, flexDirection: 'row', justifyContent: 'space-around', marginTop: 20, marginBottom: 20 }}>
+        <Box flexDirection="row" justifyContent="space-around" mt="$5" mb="$5">
             <MGButton
-                title={mgFunctionsLib.i18nString('yes', props.language)}
+                title={mgFunctionsLib.i18nString("yes", props.language)}
                 action="primary"
                 variant="solid"
                 py="$4"
-                style={{ flexGrow: 0.3 }}
                 onPress={() => {
                     setVisible(false);
-                    props.callback();
+                    props.callback?.();
                 }}
             />
             <MGButton
-                title={mgFunctionsLib.i18nString('no', props.language)}
+                title={mgFunctionsLib.i18nString("no", props.language)}
                 action="primary"
                 variant="solid"
                 py="$4"
-                style={{ flexGrow: 0.3 }}
                 onPress={() => setVisible(false)}
             />
-        </View>
+        </Box>
     );
     return (
-        <Popover isOpen={visible} onClose={() => setVisible(false)}>
+        <Popover isOpen={visible} onOpenChange={setVisible}>
             <PopoverTrigger>
-                <MGButton
-                    icon={props.icon}
-                    title={props.title}
-                    action="primary"
-                    variant="solid"
-                    py="$4"
-                    onPress={() => setVisible(true)}
-                />
+                {(triggerProps) => (
+                    <Button {...triggerProps} action="primary" variant="solid" py="$4">
+                        {props.icon ? (
+                            <Icon as={MaterialCommunityIcons} name={props.icon} mr="$2" color="$white" />
+                        ) : null}
+                        <ButtonText>{props.title}</ButtonText>
+                    </Button>
+                )}
             </PopoverTrigger>
+            <PopoverBackdrop />
             <PopoverContent w={300} bg="$white">
                 <PopoverArrow />
                 <PopoverCloseButton />
                 <PopoverBody>
                     <Box alignItems="center" justifyContent="center">
-                        <Icon
-                            as={MaterialCommunityIcons}
-                            name="alert-outline"
-                            size={16}
-                            color="$primary500"
-                            mb="$3"
-                        />
+                        <Icon as={MaterialCommunityIcons} name="alert-outline" size={16} color="$primary500" mb="$3" />
                         <MGText textAlign="center">
-                            {mgFunctionsLib.i18nString('confirm', props.language)}?
+                            {mgFunctionsLib.i18nString("confirm", props.language)}?
                         </MGText>
                     </Box>
                 </PopoverBody>
-                <PopoverFooter>
-                    {footer}
-                </PopoverFooter>
+                <PopoverFooter>{footer}</PopoverFooter>
             </PopoverContent>
         </Popover>
-    )
+    );
 }
 
 export function MGDivider({ style, ...props }) {

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "mg-library",
-    "version": "1.0.718",
+    "version": "1.0.720",
     "description": "",
     "main": "index.js",
     "react-native": "index.js",