react-native-passkit

所属分类:iPhone/iOS
开发工具:kotlin
文件大小:0KB
下载次数:0
上传日期:2024-01-29 09:48:21
上 传 者sh-1993
说明:  在google PayClient(用于android)和PassKit(用于iOS)上 React本机包装器。包含谷歌和苹果按钮
(React native wrapper over google PayClient (for android) and PassKit (for iOS). Contains google and apple buttons)

文件列表:
android/
assets/
example/
ios/
scripts/
src/
.editorconfig
.nvmrc
.watchmanconfig
.yarnrc
CODE_OF_CONDUCT.md
CONTRIBUTING.md
LICENSE
babel.config.js
lefthook.yml
package.json
react-native-passkit.podspec
tsconfig.build.json
tsconfig.json
yarn.lock

# react-native-passkit React native wrapper over google PayClient (for android) and PassKit (for iOS). Contains google and apple buttons ## Installation ```bash $ npm install --save @reeq/react-native-passkit # --- or --- $ yarn add @reeq/react-native-passkit ``` and ```bash $ pod install ``` ## Usage ```js import { AddPassButton, addPass, canAddPasses, containsPass, } from '@reeq/react-native-passkit'; const handleAddPassButton = async () => { try { const pass = 'BASE_64_ENCODED_STRING'; const isAddable = await canAddPasses(); if (!isAddable) { return; } const hasPassAlready = await containsPass(pass); if (hasPassAlready) { return; } await addPass(pass); } catch (err) { console.log(err); } }; ; ``` ## Components ### AddPassButton #### Platform: iOS/Android #### Type ```ts type AndroidVariant = 'dark' | 'light' | 'light-outline'; type iOSVariant = 'dark' | 'dark-outline'; interface AddPassButtonProps extends ViewProps { variant?: { ios?: iOSVariant; android?: AndroidVariant; }; onPress?: () => void; } type AddPassButton: React.FC ``` #### Usage ```js import { AddPassButton } from '@reeq/react-native-passkit'; import { Platform } from 'react-native'; //... { console.log("I'm pressed"); }} style={{ height: Platform.select({ android: 44, ios: 60, }), width: Platform.select({ android: 288, ios: 260, }), // This style is default. Can be overriden }} />; ``` ## API ### addPass() #### Platform: iOS/Android #### Type ```ts type addPass = (base64EncodedPass: string) => Promise; ``` #### Usage ```js import { addPass } from '@reeq/react-native-passkit'; //... await addPass('BASE_64_ENCODED_PASS'); ``` ### addPassJWT() #### Platform: Android #### Type ```ts type addPassJWT = (passJWT: string) => Promise; ``` #### Usage ```js import { addPassJWT } from '@reeq/react-native-passkit'; //... await addPassJWT('JWT_SIGNED_PASS'); ``` ### canAddPasses() #### Platform: iOS/Android #### Type: ```ts type canAddPasses = () => Promise; ``` #### Usage ```js import { canAddPasses } from '@reeq/react-native-passkit'; //... const canAdd = await canAddPasses(); console.log(canAdd); // true / false ``` ### containsPass() #### Platform: iOS #### Type ```ts type containsPass = (base64encodedPass: string) => Promise; ``` #### Usage ```js import { containsPass } from '@reeq/react-native-passkit'; //... const hasPassInWallet = await containsPass('BASE_64_ENCODED_PASS'); console.log(hasPassInWallet); // true / false ``` ### addPassResultListener() #### Platform: iOS/Android #### Type ```ts type AddPassResultStatus = 'success' | 'cancelled' | 'error'; type AddPassResultErrorType = 'api' | 'unexpected'; interface AddPassResultEvent { status: AddPassResultStatus; errorType?: AddPassResultErrorType; message?: string; } type addPassResultListener = ( callback: (event: AddPassResultEvent) => void ) => EmitterSubscription.remove; ``` #### Usage ```js import { addPassResultListener } from '@reeq/react-native-passkit'; import { useEffect } from 'React'; //... useEffect(() => { const unsubscribe = addPassResultListener((event) => { console.log(event); // { status: 'success' } }); return () => { unsubscribe(); }; }, []); ``` ### useAddPassResult() #### Platform: iOS/Android #### Type ```ts type AddPassResultStatus = 'success' | 'cancelled' | 'error'; type AddPassResultErrorType = 'api' | 'unexpected'; interface AddPassResultEvent { status: AddPassResultStatus; errorType?: AddPassResultErrorType; message?: string; } type useAddPassResult: () => AddPassResultEvent | undefined ``` #### Usage ```js import { useAddPassResult } from '@reeq/react-native-passkit'; //... const passAddResult = useAddPassResult(); console.log(passAddResult); // { status: "success" } ``` ## How to create pass ### iOS - [pass-js](https://github.com/tinovyatkin/pass-js) creating pass lib for node js ### Android - [google-codelab](https://codelabs.developers.google.com/add-to-wallet-web#0) for node js ## Localization ### iOS By default iOS add pass button does not support localization. To enable languages you want to support add them in XCode under Localizations list in the Info tab of the project. Button's localization will change automatically based on user phone setting's locale. ### Android By default Android will apply localization for button with all [available](https://developers.google.com/wallet/legacy-resources/button-guidelines) languages. To restrict app to support only specific languages you need to do the following in android/app/build.gradle: ```gradle android { //... defaultConfig { //... resConfigs("en", "da", "uk") // restrict locale to English, Danish and Ukrainian } } ``` ## Contributing See the [contributing guide](CONTRIBUTING.md) to learn how to contribute to the repository and the development workflow. ## License MIT --- Made with [create-react-native-library](https://github.com/callstack/react-native-builder-bob)

近期下载者

相关文件


收藏者