@onehat/ui 0.3.73 → 0.3.74

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@onehat/ui",
-	"version": "0.3.73",
+	"version": "0.3.74",
 	"description": "Base UI for OneHat apps",
 	"main": "src/index.js",
 	"type": "module",

package/src/Components/Form/Form.js

@@ -712,7 +712,7 @@ function Form(props) {
 			}
 		}
 
-		if (!_.isEmpty(formState.errors)) {
+		if (!_.isEmpty(formState.errors) || !formState.isValid) {
 			isSaveDisabled = true;
 			isSubmitDisabled = true;
 		}

package/src/Components/Messages/ConfirmationMessage.js

@@ -12,12 +12,13 @@ export default function ConfirmationMessage(props) {
 			onOk = emptyFn,
 		} = props;
 
-	return <Modal {...props} _backdrop={{ bg: "#000" }}>
+	return <Modal isOpen={true} {...props} _backdrop={{ bg: "#000" }}>
 				<Modal.Content maxWidth="400px">
+					<Modal.Header>Confirm</Modal.Header>
 					<Modal.Body p={5} pb={0} borderTopWidth={0}>
 						<Text color="#000">{textMessage}</Text>
 					</Modal.Body>
-					<Modal.Footer p={0} pr={4} borderTopWidth={0}>
+					<Modal.Footer py={2} pr={4}>
 						<Button variant="ghost" color="primary.800" onPress={onCancel}>Cancel</Button>
 						<Button variant="ghost" color="primary.800" onPress={onOk}>OK</Button>
 					</Modal.Footer>

package/src/Components/Messages/ErrorMessage.js

@@ -1,18 +1,21 @@
 import {
+	Button,
 	Icon,
-	Row,
+	Modal,
 	Text,
 } from 'native-base';
 import TriangleExclamation from '../Icons/TriangleExclamation.js';
 
 export default function ErrorMsg(props) {
 	const {
-			textMessage = 'Error',
-			textColor = 'red.500',
+			text = 'Error',
+			color = 'red.500',
+			onOk,
 		} = props;
-
-	return <Modal {...props} _backdrop={{ bg: "#000" }}>
+console.log('render ErrorMessage text', text);
+	return <Modal isOpen={true} {...props} _backdrop={{ bg: "#000" }}>
 				<Modal.Content>
+					<Modal.Header>Alert</Modal.Header>
 					<Modal.Body
 						borderTopWidth={0}
 						bg="#fff"
@@ -22,11 +25,12 @@ export default function ErrorMsg(props) {
 						borderRadius={5}
 						flexDirection="row"
 					>
-						<Row justifyContent="center" alignItems="center" my={2} w="100%">
-							<Icon as={TriangleExclamation} color="red.500" size="sm" mr={1} />
-							<Text color={textColor}>{textMessage}</Text>
-						</Row>
+						<Icon as={TriangleExclamation} color="red.500" size="md" mr={1} />
+						<Text color={color} fontSize="18px">{text}</Text>
 					</Modal.Body>
+					<Modal.Footer py={2} pr={4}>
+						<Button color="primary.800" onPress={onOk}>OK</Button>
+					</Modal.Footer>
 				</Modal.Content>
 			</Modal>;
 }