ordering-ui-react-native 0.17.40 → 0.17.42

package/themes/original/src/components/shared/OInput.tsx

@@ -1,119 +1,119 @@
-import * as React from 'react';
-import { ImageSourcePropType, ImageStyle, ViewStyle, TextInputProps, TextStyle } from 'react-native';
-import styled from 'styled-components/native';
-import OIcon from './OIcon';
-import MaterialIcon from 'react-native-vector-icons/MaterialIcons'
-
-const Input = styled.TextInput`
-  flex-grow: 1;
-  flex: 1;
-  min-height: 30px;
-  font-size: 15px;
-  font-family: 'Poppins-Regular';
-`;
-
-interface Props extends TextInputProps {
-	bgColor?: string;
-	borderColor?: string;
-	isRequired?: boolean;
-	requiredMsg?: string;
-	isDisabled?: boolean;
-	isSecured?: boolean;
-	style?: ViewStyle;
-	placeholder?: string;
-	icon?: ImageSourcePropType | string;
-	iconRight?: ImageSourcePropType;
-	iconColor?: string;
-	iconRightColor?: string;
-	iconStyle?: ImageStyle;
-	iconRightStyle?: ImageStyle;
-	iconCustomRight?: any;
-	value?: string;
-	onChange?: any;
-	name?: string;
-	type?: string;
-	multiline?: boolean;
-	vertorIcon?: string;
-	vectorIconColor?: string;
-	forwardRef?: any;
-	inputStyle?: TextStyle;
-	wrapperRef?: any;
-	onPress?: any;
-}
-
-const Wrapper = styled.Pressable`
-	background-color: ${(props: any) => props.theme.colors.backgroundLight};
-	border-radius: 25px;
-	border-width: 1px;
-	padding-horizontal: 16px;
-	height: 50px;
-	flex-direction: row;
-	align-items: center;
-	justify-content: center;
-	width: 100%;
-`;
-
-const OInput = (props: Props): React.ReactElement => {
-	return (
-		<Wrapper
-			onPress={() => { props.forwardRef?.current?.focus?.(); props.onPress && props.onPress() }}
-			style={{
-				backgroundColor: props.bgColor,
-				borderColor: props.borderColor,
-				...props.style,
-			}}>
-			{props.icon ? (
-				<OIcon
-					src={props.icon}
-					color={props.iconColor}
-					width={16}
-					height={20}
-					style={{ marginRight: 10, ...props.iconStyle }}
-				/>
-			) : null}
-			{props.vertorIcon && (
-				<MaterialIcon name={props?.vertorIcon} size={20} color={props?.vectorIconColor} style={{ marginHorizontal: 10 }} />
-			)}
-			<Input
-				autoFocus={props?.autoFocus}
-				name={props.name}
-				secureTextEntry={props.isSecured}
-				onChangeText={(txt: any) => props.name ? props.onChange({ target: { name: props.name, value: txt } }) : props.onChange(txt)}
-				defaultValue={props.value}
-				placeholder={props.placeholder ? props.placeholder : ''}
-				keyboardType={props.type || 'default'}
-				multiline={props.multiline}
-				scrollEnabled={props.multiline}
-				editable={!props.isDisabled}
-				autoCapitalize={props.autoCapitalize}
-				autoCompleteType={props.autoCompleteType}
-				autoCorrect={props.autoCorrect}
-				returnKeyType={props.returnKeyType}
-				onSubmitEditing={props.onSubmitEditing}
-				blurOnSubmit={props.blurOnSubmit}
-				ref={(e: any) => {
-					props.forwardRef && (props.forwardRef.current = e)
-				}}
-				style={props?.inputStyle}
-			/>
-			{props.iconRight && (
-				<OIcon
-					src={props.iconRight}
-					color={props.iconRightColor}
-					width={16}
-					height={16}
-					style={{ ...props.iconRightStyle }}
-				/>
-			)}
-			{props.iconCustomRight}
-		</Wrapper>
-	);
-};
-
-OInput.defaultProps = {
-	iconColor: '#959595',
-	bgColor: 'white',
-	borderColor: 'white',
-};
-
-export default OInput;
+import * as React from 'react';
+import { ImageSourcePropType, ImageStyle, ViewStyle, TextInputProps, TextStyle } from 'react-native';
+import styled from 'styled-components/native';
+import OIcon from './OIcon';
+import MaterialIcon from 'react-native-vector-icons/MaterialIcons'
+
+const Input = styled.TextInput`
+  flex-grow: 1;
+  flex: 1;
+  min-height: 30px;
+  font-size: 15px;
+  font-family: 'Poppins-Regular';
+`;
+
+interface Props extends TextInputProps {
+	bgColor?: string;
+	borderColor?: string;
+	isRequired?: boolean;
+	requiredMsg?: string;
+	isDisabled?: boolean;
+	isSecured?: boolean;
+	style?: ViewStyle;
+	placeholder?: string;
+	icon?: ImageSourcePropType | string;
+	iconRight?: ImageSourcePropType;
+	iconColor?: string;
+	iconRightColor?: string;
+	iconStyle?: ImageStyle;
+	iconRightStyle?: ImageStyle;
+	iconCustomRight?: any;
+	value?: string;
+	onChange?: any;
+	name?: string;
+	type?: string;
+	multiline?: boolean;
+	vertorIcon?: string;
+	vectorIconColor?: string;
+	forwardRef?: any;
+	inputStyle?: TextStyle;
+	wrapperRef?: any;
+	onPress?: any;
+}
+
+const Wrapper = styled.Pressable`
+	background-color: ${(props: any) => props.theme.colors.backgroundLight};
+	border-radius: 25px;
+	border-width: 1px;
+	padding-horizontal: 16px;
+	height: 50px;
+	flex-direction: row;
+	align-items: center;
+	justify-content: center;
+	width: 100%;
+`;
+
+const OInput = (props: Props): React.ReactElement => {
+	return (
+		<Wrapper
+			onPress={() => { props.forwardRef?.current?.focus?.(); props.onPress && props.onPress() }}
+			style={{
+				backgroundColor: props.bgColor,
+				borderColor: props.borderColor,
+				...props.style,
+			}}>
+			{props.icon ? (
+				<OIcon
+					src={props.icon}
+					color={props.iconColor}
+					width={16}
+					height={20}
+					style={{ marginRight: 10, ...props.iconStyle }}
+				/>
+			) : null}
+			{props.vertorIcon && (
+				<MaterialIcon name={props?.vertorIcon} size={20} color={props?.vectorIconColor} style={{ marginHorizontal: 10 }} />
+			)}
+			<Input
+				autoFocus={props?.autoFocus}
+				name={props.name}
+				secureTextEntry={props.isSecured}
+				onChangeText={(txt: any) => props.name ? props.onChange({ target: { name: props.name, value: txt } }) : props.onChange(txt)}
+				defaultValue={props.value}
+				placeholder={props.placeholder ? props.placeholder : ''}
+				keyboardType={props.type || 'default'}
+				multiline={props.multiline}
+				scrollEnabled={props.multiline}
+				editable={!props.isDisabled}
+				autoCapitalize={props.autoCapitalize}
+				autoCompleteType={props.autoCompleteType}
+				autoCorrect={props.autoCorrect}
+				returnKeyType={props.returnKeyType}
+				onSubmitEditing={props.onSubmitEditing}
+				blurOnSubmit={props.blurOnSubmit}
+				ref={(e: any) => {
+					props.forwardRef && (props.forwardRef.current = e)
+				}}
+				style={props?.inputStyle}
+			/>
+			{props.iconRight && (
+				<OIcon
+					src={props.iconRight}
+					color={props.iconRightColor}
+					width={16}
+					height={16}
+					style={{ ...props.iconRightStyle }}
+				/>
+			)}
+			{props.iconCustomRight}
+		</Wrapper>
+	);
+};
+
+OInput.defaultProps = {
+	iconColor: '#959595',
+	bgColor: 'white',
+	borderColor: 'white',
+};
+
+export default OInput;

package/themes/original/src/components/shared/OKeyButton.tsx

@@ -1,35 +1,35 @@
-import * as React from 'react'
-import { ViewStyle } from 'react-native'
-import styled from 'styled-components/native'
-import OText from './OText'
-
-const Wrapper = styled.TouchableOpacity`
-    background-color: white;
-    border-radius: 4px;
-    height: 50px;
-    align-items: center;
-    justify-content: center;
-`
-
-interface Props {
-    title?: string,
-    subTitle?: string,
-    onClick?: any,
-    style?: ViewStyle
-}
-
-const OKeyButton = (props: Props) => {
-    return (
-        <Wrapper 
-            style={props.style}
-            onPress={props.onClick}
-        >
-            <OText size={22}>{props.title}</OText>
-            {props.subTitle ? (
-                <OText>{props.subTitle}</OText>
-            ) : null}
-        </Wrapper>
-    )
-}
-
+import * as React from 'react'
+import { ViewStyle } from 'react-native'
+import styled from 'styled-components/native'
+import OText from './OText'
+
+const Wrapper = styled.TouchableOpacity`
+    background-color: white;
+    border-radius: 4px;
+    height: 50px;
+    align-items: center;
+    justify-content: center;
+`
+
+interface Props {
+    title?: string,
+    subTitle?: string,
+    onClick?: any,
+    style?: ViewStyle
+}
+
+const OKeyButton = (props: Props) => {
+    return (
+        <Wrapper 
+            style={props.style}
+            onPress={props.onClick}
+        >
+            <OText size={22}>{props.title}</OText>
+            {props.subTitle ? (
+                <OText>{props.subTitle}</OText>
+            ) : null}
+        </Wrapper>
+    )
+}
+
 export default OKeyButton

package/themes/original/src/components/shared/OModal.tsx

@@ -1,191 +1,191 @@
-import * as React from 'react';
-import { Modal, StyleSheet, Text, SafeAreaView, View, TouchableOpacity, Platform } from "react-native";
-import { OIcon } from '.';
-import styled, { useTheme } from 'styled-components/native';
-
-interface Props {
-	open?: boolean;
-	title?: string;
-	children?: any;
-	onAccept?: any;
-	onCancel?: any;
-	onClose?: any;
-	style?: any;
-	acceptText?: string;
-	cancelText?: string;
-	isTransparent?: boolean;
-	hideCloseDefault?: boolean;
-	entireModal?: boolean;
-	customClose?: boolean;
-	titleSectionStyle?: any;
-	isNotDecoration?: boolean;
-	styleCloseButton?: any,
-	isAvoidKeyBoardView?: boolean;
-	styleContainerCloseButton?: any;
-}
-const KeyboardView = styled.KeyboardAvoidingView`
-  flex-grow: 1;
-  flex-shrink: 1;
-`;
-
-const OModal = (props: Props): React.ReactElement => {
-	const {
-		open,
-		title,
-		children,
-		onAccept,
-		onCancel,
-		onClose,
-		acceptText,
-		cancelText,
-		isTransparent,
-		hideCloseDefault,
-		entireModal,
-		customClose,
-		titleSectionStyle,
-		isNotDecoration,
-		style,
-		styleCloseButton,
-		styleContainerCloseButton,
-		isAvoidKeyBoardView
-	} = props
-
-	const theme = useTheme();
-
-	const RenderSafeAreaView = () => (
-		<SafeAreaView style={styles.container}>
-			{!entireModal ? (
-				<View style={styles.centeredView}>
-					<View style={titleSectionStyle ? titleSectionStyle : styles.titleSection}>
-						<TouchableOpacity style={{...styles.wrapperIcon, ...styleContainerCloseButton}} onPress={onClose}>
-							<OIcon
-								src={theme.images.general.close}
-								width={16}
-								style={isNotDecoration && (styleCloseButton || styles.cancelBtn)}
-							/>
-						</TouchableOpacity>
-						<Text style={styles.modalText}>{title || ''}</Text>
-					</View>
-					{children}
-				</View>
-			) :
-				<View>
-					{!customClose && (
-						<View style={titleSectionStyle ? titleSectionStyle : styles.titleSection}>
-							<TouchableOpacity style={styles.wrapperIcon} onPress={onClose}>
-								<OIcon
-									src={theme.images.general.close}
-									width={16}
-									style={styleCloseButton || styles.cancelBtn}
-								/>
-							</TouchableOpacity>
-							<Text style={styles.modalText}>{title || ''}</Text>
-						</View>
-					)}
-					{children}
-				</View>
-			}
-		</SafeAreaView>
-	)
-
-	return (
-		<Modal
-			animationType="slide"
-			transparent={isTransparent}
-			visible={open}
-			onRequestClose={() =>  onClose && onClose()}
-			style={{ height: '100%', flex: 1, position: 'absolute', ...style, zIndex: 9999 }}
-		>
-			{isAvoidKeyBoardView ? (
-				<KeyboardView
-					enabled
-					behavior={Platform.OS === 'ios' ? 'padding' : 'height'}
-				>
-					<RenderSafeAreaView/>
-				</KeyboardView>
-			) : (
-				<RenderSafeAreaView/>
-			)}
-		</Modal>
-	);
-};
-
-const styles = StyleSheet.create({
-	container: {
-		flex: 1,
-	},
-	centeredView: {
-		justifyContent: "center",
-		alignItems: 'flex-start',
-		position: 'relative',
-		width: '100%',
-	},
-	titleSection: {
-		width: '100%',
-		flex: 1,
-		justifyContent: 'space-between',
-		alignItems: 'flex-start',
-		paddingLeft: 40,
-		paddingRight: 40,
-		marginBottom: 40
-	},
-	cancelBtn: {
-		//  position: 'absolute',
-		//  left: 0,
-		//  margin: 15,
-		// zIndex: 10000
-	},
-	modalText: {
-		marginTop: 15,
-		fontSize: 20,
-		lineHeight: 30,
-		fontWeight: '600',
-		textAlign: "center",
-		zIndex: 10
-	},
-	wrapperIcon: {
-		overflow: 'hidden',
-		backgroundColor: 'transparent',
-		width: 35,
-		height: 35,
-		marginStart: -9,
-		marginTop: 12,
-		alignItems: 'center',
-		justifyContent: 'center',
-		zIndex: 99999
-	},
-
-	modalView: {
-		margin: 20,
-		backgroundColor: "white",
-		borderRadius: 20,
-		padding: 35,
-		alignItems: "center",
-		shadowColor: "#000",
-		shadowOffset: {
-			width: 0,
-			height: 2
-		},
-		shadowOpacity: 0.25,
-		shadowRadius: 4,
-		elevation: 5
-	},
-	button: {
-		borderRadius: 20,
-		padding: 10,
-		elevation: 2
-	},
-	buttonOpen: {
-		backgroundColor: "#F194FF",
-	},
-	buttonClose: {
-		backgroundColor: "#2196F3",
-	},
-	textStyle: {
-		color: "white",
-		fontWeight: "bold",
-		textAlign: "center"
-	},
-});
-
-export default OModal;
+import * as React from 'react';
+import { Modal, StyleSheet, Text, SafeAreaView, View, TouchableOpacity, Platform } from "react-native";
+import { OIcon } from '.';
+import styled, { useTheme } from 'styled-components/native';
+
+interface Props {
+	open?: boolean;
+	title?: string;
+	children?: any;
+	onAccept?: any;
+	onCancel?: any;
+	onClose?: any;
+	style?: any;
+	acceptText?: string;
+	cancelText?: string;
+	isTransparent?: boolean;
+	hideCloseDefault?: boolean;
+	entireModal?: boolean;
+	customClose?: boolean;
+	titleSectionStyle?: any;
+	isNotDecoration?: boolean;
+	styleCloseButton?: any,
+	isAvoidKeyBoardView?: boolean;
+	styleContainerCloseButton?: any;
+}
+const KeyboardView = styled.KeyboardAvoidingView`
+  flex-grow: 1;
+  flex-shrink: 1;
+`;
+
+const OModal = (props: Props): React.ReactElement => {
+	const {
+		open,
+		title,
+		children,
+		onAccept,
+		onCancel,
+		onClose,
+		acceptText,
+		cancelText,
+		isTransparent,
+		hideCloseDefault,
+		entireModal,
+		customClose,
+		titleSectionStyle,
+		isNotDecoration,
+		style,
+		styleCloseButton,
+		styleContainerCloseButton,
+		isAvoidKeyBoardView
+	} = props
+
+	const theme = useTheme();
+
+	const RenderSafeAreaView = () => (
+		<SafeAreaView style={styles.container}>
+			{!entireModal ? (
+				<View style={styles.centeredView}>
+					<View style={titleSectionStyle ? titleSectionStyle : styles.titleSection}>
+						<TouchableOpacity style={{...styles.wrapperIcon, ...styleContainerCloseButton}} onPress={onClose}>
+							<OIcon
+								src={theme.images.general.close}
+								width={16}
+								style={isNotDecoration && (styleCloseButton || styles.cancelBtn)}
+							/>
+						</TouchableOpacity>
+						<Text style={styles.modalText}>{title || ''}</Text>
+					</View>
+					{children}
+				</View>
+			) :
+				<View>
+					{!customClose && (
+						<View style={titleSectionStyle ? titleSectionStyle : styles.titleSection}>
+							<TouchableOpacity style={styles.wrapperIcon} onPress={onClose}>
+								<OIcon
+									src={theme.images.general.close}
+									width={16}
+									style={styleCloseButton || styles.cancelBtn}
+								/>
+							</TouchableOpacity>
+							<Text style={styles.modalText}>{title || ''}</Text>
+						</View>
+					)}
+					{children}
+				</View>
+			}
+		</SafeAreaView>
+	)
+
+	return (
+		<Modal
+			animationType="slide"
+			transparent={isTransparent}
+			visible={open}
+			onRequestClose={() =>  onClose && onClose()}
+			style={{ height: '100%', flex: 1, position: 'absolute', ...style, zIndex: 9999 }}
+		>
+			{isAvoidKeyBoardView ? (
+				<KeyboardView
+					enabled
+					behavior={Platform.OS === 'ios' ? 'padding' : 'height'}
+				>
+					<RenderSafeAreaView/>
+				</KeyboardView>
+			) : (
+				<RenderSafeAreaView/>
+			)}
+		</Modal>
+	);
+};
+
+const styles = StyleSheet.create({
+	container: {
+		flex: 1,
+	},
+	centeredView: {
+		justifyContent: "center",
+		alignItems: 'flex-start',
+		position: 'relative',
+		width: '100%',
+	},
+	titleSection: {
+		width: '100%',
+		flex: 1,
+		justifyContent: 'space-between',
+		alignItems: 'flex-start',
+		paddingLeft: 40,
+		paddingRight: 40,
+		marginBottom: 40
+	},
+	cancelBtn: {
+		//  position: 'absolute',
+		//  left: 0,
+		//  margin: 15,
+		// zIndex: 10000
+	},
+	modalText: {
+		marginTop: 15,
+		fontSize: 20,
+		lineHeight: 30,
+		fontWeight: '600',
+		textAlign: "center",
+		zIndex: 10
+	},
+	wrapperIcon: {
+		overflow: 'hidden',
+		backgroundColor: 'transparent',
+		width: 35,
+		height: 35,
+		marginStart: -9,
+		marginTop: 12,
+		alignItems: 'center',
+		justifyContent: 'center',
+		zIndex: 99999
+	},
+
+	modalView: {
+		margin: 20,
+		backgroundColor: "white",
+		borderRadius: 20,
+		padding: 35,
+		alignItems: "center",
+		shadowColor: "#000",
+		shadowOffset: {
+			width: 0,
+			height: 2
+		},
+		shadowOpacity: 0.25,
+		shadowRadius: 4,
+		elevation: 5
+	},
+	button: {
+		borderRadius: 20,
+		padding: 10,
+		elevation: 2
+	},
+	buttonOpen: {
+		backgroundColor: "#F194FF",
+	},
+	buttonClose: {
+		backgroundColor: "#2196F3",
+	},
+	textStyle: {
+		color: "white",
+		fontWeight: "bold",
+		textAlign: "center"
+	},
+});
+
+export default OModal;