-
Notifications
You must be signed in to change notification settings - Fork 2
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
US1762588 - [iOS] React Native Demo Components Refactor and Props (#86)
* Us1762585 - iOS Refactor Native components (#81) * US1762570: create view manager to native AccessCheckoutEditText component; override onTextChange to support the react native onChangeText event; implement component in react native * US1762550: update card details field to use new component; update RN module to use reference to AccessCheckoutEditText and not the text value * US1762550: move AccessCheckoutEditTextManager to correct file path; update local android sdk files to most up-to-date version of master; update AccessCheckoutReactPackageTest * US1782181: add unit tests for AccessCheckoutEditTextManagerTest; add mockito to build.gradle for unit tests * US1762551: Expose AccessCheckoutUITextField to be able to use native components via the ios Bridge Simplify ReactNativeViewLocator and implement/expose specific POC methods to avoid disruptions with previous implementation Add POC toggle to demo app to be able to switch implementations Expose new POC validation and sessionGeneration methods to avoid diruptions with previous implementations * US1762551: Point client to npe environment * US1762585: Refactor ios Bridge and demo application Avoids having to handle inputs in states Uses native components Only a input field id is needed in order to configure validation and session generation for a field Integrate the latest AccessCheckoutUITextField changes Updates and renames cvcValue to cvcId Updates and renames panValue to panId Updates and renames expiryDateValue to expiryDateId * US1762585: Rebuild lib and clean up files * US1762585: Minor cleanup * US1762585: Rebuild lib files Rename AccessCheckoutEditText to AccessCheckoutInputText as EditText was specific to Android Minor renaming of fields like panUITextField to panACUITextField to improve readability and make it known that we are dealing with AccessCheckoutUITextField in the iOS bridge * US1762585: Rename AccessCheckoutEditText to AccessCheckoutInputText in Android bridge * US1762585: Rename AccessCheckoutInputText to AccessCheckoutTextInput Rebuild lib files * US1762585: Update bitrise-step to use xcode-test v5 and update e2e tests (#82) * US1762585: Update bitrise-step to use xcode-test v5 * US1762585: Use Optionals to mantain compatibility in both Xcode 13 and Xcode 15 * US1762585: Update e2e tests * US1762585: Improve matcher based on platform using type * US1762585: Remove TextInputPO as it is no longer used --------- Co-authored-by: e5661323 <jason.dzelamensah@fisglobal.com> * US1762588: Clean and Refactor CVC Expiry and Pan React Native Demo components Define Props and types to ReactNative component and Native component props * US1762588: Use paddingHorizontal in demo components * US1762588: Add Android AccessCheckoutEditText defaults when initialising the component * US1762588: Add Support for fonts via styling, minor refactorings * US1762588: Remove Comment and support for keyboartType in iOS Bridge * US1762588: Revert pod local version * US1762588: rebuild pod files to point to remote AccessCheckoutSDK * US1762588: rebuild pod files to point to remote AccessCheckoutSDK * US1762588: Remove support for fontStyle and fontWeight * US1762588: Add correct colours to text when input is not editable, remove inverted expression * US1762588: Fixx import after rebase * US1762588: Clean imports * US1762588: Remove unnecessary comments * US1762588: Rename fontColor to color, and remap in iOS Bridge Reset defaults provided by AccessCheckoutUITextfield Reset insets using horizontalPadding in AccessCheckoutUITextfield * US1762588: point to correct tag instad of branch * US1762588: Update pod deps * US1762588: change BitRise flow for iOS Bridge and iOS e2e tests to update and install Pods rather than just install --------- Co-authored-by: e5661323 <jason.dzelamensah@fisglobal.com> Co-authored-by: Olivier Chalet <olivier.chalet@fisglobal.com>
- Loading branch information
1 parent
7d2946e
commit 65e99e2
Showing
15 changed files
with
228 additions
and
160 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
104 changes: 52 additions & 52 deletions
104
access-checkout-react-native-sdk/ios/AccessCheckoutReactNative.xcodeproj/project.pbxproj
Large diffs are not rendered by default.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
11 changes: 10 additions & 1 deletion
11
...ckout-react-native-sdk/ios/AccessCheckoutReactNative/AccessCheckoutTextInputManager.swift
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
78 changes: 64 additions & 14 deletions
78
access-checkout-react-native-sdk/src/ui/AccessCheckoutTextInput.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,35 +1,85 @@ | ||
import React from 'react'; | ||
import { | ||
requireNativeComponent, | ||
StyleProp, | ||
TextStyle, | ||
type ViewProps, | ||
type StyleProp, | ||
StyleSheet, | ||
View, | ||
type ViewStyle, | ||
} from 'react-native'; | ||
import type { ColorValue } from 'react-native/Libraries/StyleSheet/StyleSheet'; | ||
|
||
/** | ||
* Composes `AccessCheckoutTextInput`. | ||
* | ||
* - nativeID: string | ||
* - testID: string | ||
* - style: StyleProp | ||
* - editable: boolean | ||
* - style: StyleProp<AccessCheckoutTextInputStyle>; | ||
* - placeholder: string | ||
* - editable: boolean | ||
*/ | ||
interface AccessCheckoutTextInputProps extends ViewProps { | ||
testID: string | undefined; | ||
style?: StyleProp<TextStyle>; | ||
editable?: boolean | undefined; | ||
placeholder?: string | undefined; | ||
isValid?: boolean; | ||
keyboardType?: string; | ||
interface AccessCheckoutTextInputProps { | ||
nativeID: string; | ||
testID?: string; | ||
style?: StyleProp<AccessCheckoutTextInputStyle>; | ||
placeholder?: string; | ||
editable?: boolean; | ||
} | ||
|
||
/** | ||
* Note: Not all properties apply styling to placeholder text and input text. | ||
* textColor: only applies to input text. | ||
* fontFamily: applies to both placeholder text and input text. | ||
* fontSize:applies to both placeholder text and input text. | ||
*/ | ||
interface AccessCheckoutTextInputStyle extends ViewStyle { | ||
color?: ColorValue; | ||
fontFamily?: string; | ||
fontSize?: number; | ||
} | ||
|
||
/** | ||
* Font Changes apply to placeholder text and input text | ||
*/ | ||
interface RTCAccessCheckoutTextInputFontProps { | ||
fontFamily?: string; | ||
fontSize?: number; | ||
} | ||
|
||
interface RTCAccessCheckoutTextInputProps { | ||
nativeID: string; | ||
testID?: string; | ||
style?: StyleProp<ViewStyle>; | ||
placeholder?: string; | ||
font?: RTCAccessCheckoutTextInputFontProps; | ||
editable?: boolean; | ||
color?: ColorValue; | ||
} | ||
|
||
const RTCAccessCheckoutTextInput = | ||
requireNativeComponent<AccessCheckoutTextInputProps>( | ||
requireNativeComponent<RTCAccessCheckoutTextInputProps>( | ||
'AccessCheckoutTextInput' | ||
); | ||
const AccessCheckoutTextInput = (props: AccessCheckoutTextInputProps) => { | ||
return <RTCAccessCheckoutTextInput {...props} />; | ||
const { nativeID, testID, style, placeholder, editable } = props; | ||
const { color, fontFamily, fontSize, ...otherStyles } = StyleSheet.flatten([ | ||
style, | ||
]); | ||
return ( | ||
<View style={[otherStyles]}> | ||
<RTCAccessCheckoutTextInput | ||
nativeID={nativeID} | ||
testID={testID} | ||
style={[{ flex: 1 }]} | ||
placeholder={placeholder} | ||
font={{ | ||
fontFamily, | ||
fontSize, | ||
}} | ||
color={color} | ||
editable={editable} | ||
/> | ||
</View> | ||
); | ||
}; | ||
|
||
export default AccessCheckoutTextInput; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.