react-native-unit-components 0.1.0 → 1.0.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +157 -2
- package/android/src/main/java/com/unitreactnativecomponents/UnitAddToWalletButtonViewManager.kt +27 -0
- package/android/src/main/java/com/unitreactnativecomponents/UnitReactNativeComponentsEvent.kt +21 -0
- package/android/src/main/java/com/unitreactnativecomponents/UnitReactNativeComponentsPackage.kt +2 -1
- package/android/src/main/java/com/unitreactnativecomponents/visapresentation/UNGooglePayView.kt +197 -0
- package/android/src/main/res/drawable/ic_launcher_background.xml +170 -0
- package/android/src/main/res/drawable/un_add_to_googlepay_button_content.xml +54 -0
- package/android/src/main/res/drawable/un_black_add_to_googlepay_button_content.xml +54 -0
- package/android/src/main/res/drawable/un_black_googlepay_button_background.xml +6 -0
- package/android/src/main/res/drawable/un_black_googlepay_button_background_image.9.png +0 -0
- package/android/src/main/res/drawable/un_black_googlepay_button_content.xml +48 -0
- package/android/src/main/res/drawable/un_black_googlepay_button_no_shadow_background.xml +6 -0
- package/android/src/main/res/drawable/un_black_googlepay_button_no_shadow_background_image.9.png +0 -0
- package/android/src/main/res/drawable/un_black_googlepay_button_overlay.xml +12 -0
- package/android/src/main/res/drawable/un_border.xml +6 -0
- package/android/src/main/res/drawable/un_condensed_googlepay.xml +27 -0
- package/android/src/main/res/drawable/un_googlepay_button_background.xml +18 -0
- package/android/src/main/res/drawable/un_googlepay_button_background_image.9.png +0 -0
- package/android/src/main/res/drawable/un_googlepay_button_background_image_focused.9.png +0 -0
- package/android/src/main/res/drawable/un_googlepay_button_background_image_pressed.9.png +0 -0
- package/android/src/main/res/drawable/un_googlepay_button_content.xml +48 -0
- package/android/src/main/res/drawable/un_googlepay_button_no_shadow_background.xml +18 -0
- package/android/src/main/res/drawable/un_googlepay_button_no_shadow_background_image.9.png +0 -0
- package/android/src/main/res/drawable/un_googlepay_button_no_shadow_background_image_focused.9.png +0 -0
- package/android/src/main/res/drawable/un_googlepay_button_no_shadow_background_image_pressed.9.png +0 -0
- package/android/src/main/res/drawable/un_googlepay_button_overlay.xml +11 -0
- package/android/src/main/res/drawable/un_ic_launcher_foreground.xml +30 -0
- package/android/src/main/res/drawable/un_ic_unit_logo.xml +25 -0
- package/android/src/main/res/drawable/un_ic_visa.xml +13 -0
- package/android/src/main/res/drawable-bg/un_add_to_googlepay_button_content.xml +54 -0
- package/android/src/main/res/drawable-bg/un_black_add_to_googlepay_button_content.xml +54 -0
- package/android/src/main/res/drawable-ca/un_add_to_googlepay_button_content.xml +30 -0
- package/android/src/main/res/drawable-ca/un_black_add_to_googlepay_button_content.xml +30 -0
- package/android/src/main/res/drawable-cs/un_add_to_googlepay_button_content.xml +54 -0
- package/android/src/main/res/drawable-cs/un_black_add_to_googlepay_button_content.xml +54 -0
- package/android/src/main/res/drawable-da/un_add_to_googlepay_button_content.xml +30 -0
- package/android/src/main/res/drawable-da/un_black_add_to_googlepay_button_content.xml +30 -0
- package/android/src/main/res/drawable-de/un_add_to_googlepay_button_content.xml +60 -0
- package/android/src/main/res/drawable-de/un_black_add_to_googlepay_button_content.xml +60 -0
- package/android/src/main/res/drawable-el/un_add_to_googlepay_button_content.xml +67 -0
- package/android/src/main/res/drawable-el/un_black_add_to_googlepay_button_content.xml +67 -0
- package/android/src/main/res/drawable-es/un_add_to_googlepay_button_content.xml +54 -0
- package/android/src/main/res/drawable-es/un_black_add_to_googlepay_button_content.xml +54 -0
- package/android/src/main/res/drawable-et/un_add_to_googlepay_button_content.xml +64 -0
- package/android/src/main/res/drawable-et/un_black_add_to_googlepay_button_content.xml +64 -0
- package/android/src/main/res/drawable-fi/un_add_to_googlepay_button_content.xml +39 -0
- package/android/src/main/res/drawable-fi/un_black_add_to_googlepay_button_content.xml +39 -0
- package/android/src/main/res/drawable-fr/un_add_to_googlepay_button_content.xml +54 -0
- package/android/src/main/res/drawable-fr/un_black_add_to_googlepay_button_content.xml +54 -0
- package/android/src/main/res/drawable-hr/un_add_to_googlepay_button_content.xml +54 -0
- package/android/src/main/res/drawable-hr/un_black_add_to_googlepay_button_content.xml +54 -0
- package/android/src/main/res/drawable-hu/un_add_to_googlepay_button_content.xml +64 -0
- package/android/src/main/res/drawable-hu/un_black_add_to_googlepay_button_content.xml +64 -0
- package/android/src/main/res/drawable-in/un_add_to_googlepay_button_content.xml +54 -0
- package/android/src/main/res/drawable-in/un_black_add_to_googlepay_button_content.xml +54 -0
- package/android/src/main/res/drawable-it/un_add_to_googlepay_button_content.xml +54 -0
- package/android/src/main/res/drawable-it/un_black_add_to_googlepay_button_content.xml +54 -0
- package/android/src/main/res/drawable-iw/un_add_to_googlepay_button_content.xml +41 -0
- package/android/src/main/res/drawable-iw/un_black_add_to_googlepay_button_content.xml +41 -0
- package/android/src/main/res/drawable-ja/un_add_to_googlepay_button_content.xml +54 -0
- package/android/src/main/res/drawable-ja/un_black_add_to_googlepay_button_content.xml +54 -0
- package/android/src/main/res/drawable-ko/un_add_to_googlepay_button_content.xml +54 -0
- package/android/src/main/res/drawable-ko/un_black_add_to_googlepay_button_content.xml +54 -0
- package/android/src/main/res/drawable-lt/un_add_to_googlepay_button_content.xml +70 -0
- package/android/src/main/res/drawable-lt/un_black_add_to_googlepay_button_content.xml +70 -0
- package/android/src/main/res/drawable-lv/un_add_to_googlepay_button_content.xml +61 -0
- package/android/src/main/res/drawable-lv/un_black_add_to_googlepay_button_content.xml +61 -0
- package/android/src/main/res/drawable-ms/un_add_to_googlepay_button_content.xml +54 -0
- package/android/src/main/res/drawable-ms/un_black_add_to_googlepay_button_content.xml +54 -0
- package/android/src/main/res/drawable-nb/un_add_to_googlepay_button_content.xml +30 -0
- package/android/src/main/res/drawable-nb/un_black_add_to_googlepay_button_content.xml +30 -0
- package/android/src/main/res/drawable-nl/un_add_to_googlepay_button_content.xml +58 -0
- package/android/src/main/res/drawable-nl/un_black_add_to_googlepay_button_content.xml +54 -0
- package/android/src/main/res/drawable-pl/un_add_to_googlepay_button_content.xml +30 -0
- package/android/src/main/res/drawable-pl/un_black_add_to_googlepay_button_content.xml +30 -0
- package/android/src/main/res/drawable-pt/un_add_to_googlepay_button_content.xml +54 -0
- package/android/src/main/res/drawable-pt/un_black_add_to_googlepay_button_content.xml +54 -0
- package/android/src/main/res/drawable-ro/un_add_to_googlepay_button_content.xml +58 -0
- package/android/src/main/res/drawable-ro/un_black_add_to_googlepay_button_content.xml +58 -0
- package/android/src/main/res/drawable-ru/un_add_to_googlepay_button_content.xml +54 -0
- package/android/src/main/res/drawable-ru/un_black_add_to_googlepay_button_content.xml +54 -0
- package/android/src/main/res/drawable-sk/un_add_to_googlepay_button_content.xml +54 -0
- package/android/src/main/res/drawable-sk/un_black_add_to_googlepay_button_content.xml +54 -0
- package/android/src/main/res/drawable-sl/un_add_to_googlepay_button_content.xml +54 -0
- package/android/src/main/res/drawable-sl/un_black_add_to_googlepay_button_content.xml +54 -0
- package/android/src/main/res/drawable-sr/un_add_to_googlepay_button_content.xml +54 -0
- package/android/src/main/res/drawable-sr/un_black_add_to_googlepay_button_content.xml +54 -0
- package/android/src/main/res/drawable-sv/un_add_to_googlepay_button_content.xml +30 -0
- package/android/src/main/res/drawable-sv/un_black_add_to_googlepay_button_content.xml +30 -0
- package/android/src/main/res/drawable-th/un_add_to_googlepay_button_content.xml +54 -0
- package/android/src/main/res/drawable-th/un_black_add_to_googlepay_button_content.xml +54 -0
- package/android/src/main/res/drawable-tr/un_add_to_googlepay_button_content.xml +54 -0
- package/android/src/main/res/drawable-tr/un_black_add_to_googlepay_button_content.xml +54 -0
- package/android/src/main/res/drawable-uk/un_add_to_googlepay_button_content.xml +54 -0
- package/android/src/main/res/drawable-uk/un_black_add_to_googlepay_button_content.xml +54 -0
- package/android/src/main/res/drawable-v21/un_black_googlepay_button_background.xml +7 -0
- package/android/src/main/res/drawable-v21/un_black_googlepay_button_background_image.9.png +0 -0
- package/android/src/main/res/drawable-v21/un_black_googlepay_button_no_shadow_background.xml +7 -0
- package/android/src/main/res/drawable-v21/un_black_googlepay_button_no_shadow_background_image.9.png +0 -0
- package/android/src/main/res/drawable-v24/ic_launcher_background.xml +170 -0
- package/android/src/main/res/drawable-v24/un_border.xml +6 -0
- package/android/src/main/res/drawable-v24/un_ic_launcher_foreground.xml +30 -0
- package/android/src/main/res/drawable-v24/un_ic_unit_logo.xml +25 -0
- package/android/src/main/res/drawable-v24/un_ic_visa.xml +13 -0
- package/android/src/main/res/drawable-zh/un_add_to_googlepay_button_content.xml +54 -0
- package/android/src/main/res/drawable-zh/un_black_add_to_googlepay_button_content.xml +54 -0
- package/android/src/main/res/layout/un_black_add_to_googlepay_button.xml +32 -0
- package/android/src/main/res/layout/un_view_google_push_provisioning.xml +45 -0
- package/android/src/main/res/layout/un_white_add_to_googlepay_button.xml +31 -0
- package/android/src/main/res/layout/un_white_add_to_googlepay_button_no_shadow.xml +31 -0
- package/android/src/main/res/mipmap-anydpi-v26/ic_launcher.xml +5 -0
- package/android/src/main/res/mipmap-anydpi-v26/ic_launcher_round.xml +5 -0
- package/android/src/main/res/mipmap-hdpi/ic_launcher.webp +0 -0
- package/android/src/main/res/mipmap-hdpi/ic_launcher_round.webp +0 -0
- package/android/src/main/res/mipmap-mdpi/ic_launcher.webp +0 -0
- package/android/src/main/res/mipmap-mdpi/ic_launcher_round.webp +0 -0
- package/android/src/main/res/mipmap-xhdpi/black_googlepay_button_background_image.9.png +0 -0
- package/android/src/main/res/mipmap-xhdpi/black_googlepay_button_no_shadow_background_image.9.png +0 -0
- package/android/src/main/res/mipmap-xhdpi/googlepay_button_background_image.9.png +0 -0
- package/android/src/main/res/mipmap-xhdpi/googlepay_button_background_image_focused.9.png +0 -0
- package/android/src/main/res/mipmap-xhdpi/googlepay_button_background_image_pressed.9.png +0 -0
- package/android/src/main/res/mipmap-xhdpi/googlepay_button_no_shadow_background_image_focused.9.png +0 -0
- package/android/src/main/res/mipmap-xhdpi/googlepay_button_no_shadow_background_image_pressed.9.png +0 -0
- package/android/src/main/res/mipmap-xhdpi/ic_launcher.webp +0 -0
- package/android/src/main/res/mipmap-xhdpi/ic_launcher_round.webp +0 -0
- package/android/src/main/res/mipmap-xhdpi/white_googlepay_button_no_shadow_background_image.9.png +0 -0
- package/android/src/main/res/mipmap-xxhdpi/black_googlepay_button_background_image.9.png +0 -0
- package/android/src/main/res/mipmap-xxhdpi/black_googlepay_button_no_shadow_background_image.9.png +0 -0
- package/android/src/main/res/mipmap-xxhdpi/googlepay_button_background_image.9.png +0 -0
- package/android/src/main/res/mipmap-xxhdpi/googlepay_button_background_image_focused.9.png +0 -0
- package/android/src/main/res/mipmap-xxhdpi/googlepay_button_background_image_pressed.9.png +0 -0
- package/android/src/main/res/mipmap-xxhdpi/googlepay_button_no_shadow_background_image.9.png +0 -0
- package/android/src/main/res/mipmap-xxhdpi/googlepay_button_no_shadow_background_image_focused.9.png +0 -0
- package/android/src/main/res/mipmap-xxhdpi/googlepay_button_no_shadow_background_image_pressed.9.png +0 -0
- package/android/src/main/res/mipmap-xxhdpi/ic_launcher.webp +0 -0
- package/android/src/main/res/mipmap-xxhdpi/ic_launcher_round.webp +0 -0
- package/android/src/main/res/mipmap-xxxhdpi/black_googlepay_button_background_image.9.png +0 -0
- package/android/src/main/res/mipmap-xxxhdpi/black_googlepay_button_no_shadow_background_image.9.png +0 -0
- package/android/src/main/res/mipmap-xxxhdpi/googlepay_button_background_image.9.png +0 -0
- package/android/src/main/res/mipmap-xxxhdpi/googlepay_button_background_image_focused.9.png +0 -0
- package/android/src/main/res/mipmap-xxxhdpi/googlepay_button_background_image_pressed.9.png +0 -0
- package/android/src/main/res/mipmap-xxxhdpi/googlepay_button_no_shadow_background_image.9.png +0 -0
- package/android/src/main/res/mipmap-xxxhdpi/googlepay_button_no_shadow_background_image_focused.9.png +0 -0
- package/android/src/main/res/mipmap-xxxhdpi/googlepay_button_no_shadow_background_image_pressed.9.png +0 -0
- package/android/src/main/res/mipmap-xxxhdpi/ic_launcher.webp +0 -0
- package/android/src/main/res/mipmap-xxxhdpi/ic_launcher_round.webp +0 -0
- package/android/src/main/res/values/colors.xml +14 -0
- package/android/src/main/res/values/googlepay_strings.xml +7 -0
- package/android/src/main/res/values/strings.xml +4 -0
- package/android/src/main/res/values/themes.xml +16 -0
- package/android/src/main/res/values-night/themes.xml +16 -0
- package/ios/UnitReactNativeComponents.xcodeproj/project.pbxproj +8 -8
- package/ios/UnitReactNativeComponentsViewManager.m +3 -2
- package/ios/UnitReactNativeComponentsViewManager.swift +39 -25
- package/lib/commonjs/assets/images/close.png +0 -0
- package/lib/commonjs/assets/images/index.js +16 -0
- package/lib/commonjs/assets/images/index.js.map +1 -0
- package/lib/commonjs/components/UNActivityComponent/UNActivityComponent.js +28 -0
- package/lib/commonjs/components/UNActivityComponent/UNActivityComponent.js.map +1 -0
- package/lib/commonjs/components/UNActivityComponent/UNActivityComponent.utils.js +20 -0
- package/lib/commonjs/components/UNActivityComponent/UNActivityComponent.utils.js.map +1 -0
- package/lib/commonjs/components/UNBookPaymentComponent/UNBookPaymentComponent.js +39 -0
- package/lib/commonjs/components/UNBookPaymentComponent/UNBookPaymentComponent.js.map +1 -0
- package/lib/commonjs/components/UNBookPaymentComponent/UNBookPaymentComponent.utils.js +40 -0
- package/lib/commonjs/components/UNBookPaymentComponent/UNBookPaymentComponent.utils.js.map +1 -0
- package/lib/commonjs/components/UNBottomSheetComponent/UNBottomSheetComponent.constants.js +9 -0
- package/lib/commonjs/components/UNBottomSheetComponent/UNBottomSheetComponent.constants.js.map +1 -0
- package/lib/commonjs/components/UNBottomSheetComponent/UNBottomSheetComponent.js +195 -0
- package/lib/commonjs/components/UNBottomSheetComponent/UNBottomSheetComponent.js.map +1 -0
- package/lib/commonjs/components/UNBottomSheetComponent/UNBottomSheetComponent.styles.js +23 -0
- package/lib/commonjs/components/UNBottomSheetComponent/UNBottomSheetComponent.styles.js.map +1 -0
- package/lib/commonjs/components/UNBottomSheetComponent/UNBottomSheetComponent.utils.js +49 -0
- package/lib/commonjs/components/UNBottomSheetComponent/UNBottomSheetComponent.utils.js.map +1 -0
- package/lib/commonjs/components/{Card/CardComponent.js → UNCardComponent/UNCardComponent.js} +42 -46
- package/lib/commonjs/components/UNCardComponent/UNCardComponent.js.map +1 -0
- package/lib/commonjs/components/UNCardComponent/UNCardComponent.utils.js +42 -0
- package/lib/commonjs/components/UNCardComponent/UNCardComponent.utils.js.map +1 -0
- package/lib/commonjs/components/index.js +34 -8
- package/lib/commonjs/components/index.js.map +1 -1
- package/lib/commonjs/custom.d.js +2 -0
- package/lib/commonjs/custom.d.js.map +1 -0
- package/lib/commonjs/helpers/{BottomSheet.js → BottomSheet/BottomSheet.js} +38 -83
- package/lib/commonjs/helpers/BottomSheet/BottomSheet.js.map +1 -0
- package/lib/commonjs/helpers/BottomSheet/BottomSheet.styles.js +82 -0
- package/lib/commonjs/helpers/BottomSheet/BottomSheet.styles.js.map +1 -0
- package/lib/commonjs/helpers/EventBus.js +5 -13
- package/lib/commonjs/helpers/EventBus.js.map +1 -1
- package/lib/commonjs/hooks/listenerToBus.js +31 -0
- package/lib/commonjs/hooks/listenerToBus.js.map +1 -0
- package/lib/commonjs/hooks/useAppStateListener.js +34 -0
- package/lib/commonjs/hooks/useAppStateListener.js.map +1 -0
- package/lib/commonjs/index.js +33 -0
- package/lib/commonjs/index.js.map +1 -1
- package/lib/commonjs/messages/nativeMessages/index.js +13 -0
- package/lib/commonjs/messages/nativeMessages/index.js.map +1 -0
- package/lib/commonjs/messages/webMessages/bookPaymentMessage.js +13 -0
- package/lib/commonjs/messages/webMessages/bookPaymentMessage.js.map +1 -0
- package/lib/commonjs/{webComponent → messages}/webMessages/cardMessage.js +1 -1
- package/lib/commonjs/messages/webMessages/cardMessage.js.map +1 -0
- package/lib/commonjs/messages/webMessages/index.js +6 -0
- package/lib/commonjs/messages/webMessages/index.js.map +1 -0
- package/lib/commonjs/{webComponent → messages}/webMessages/pageMessage.js +0 -0
- package/lib/commonjs/messages/webMessages/pageMessage.js.map +1 -0
- package/lib/commonjs/{webComponent → messages}/webMessages/unitMessages.js +0 -0
- package/lib/commonjs/messages/webMessages/unitMessages.js.map +1 -0
- package/lib/commonjs/nativeComponent/UNNativeAddToWalletButton.js +13 -0
- package/lib/commonjs/nativeComponent/UNNativeAddToWalletButton.js.map +1 -0
- package/lib/commonjs/scripts/html/bodyHtml.js +52 -0
- package/lib/commonjs/scripts/html/bodyHtml.js.map +1 -0
- package/lib/commonjs/scripts/html/bodyScript.js +78 -0
- package/lib/commonjs/scripts/html/bodyScript.js.map +1 -0
- package/lib/commonjs/sharedTypes/bookPayment.types.js +6 -0
- package/lib/commonjs/sharedTypes/bookPayment.types.js.map +1 -0
- package/lib/commonjs/sharedTypes/card.types.js +6 -0
- package/lib/commonjs/sharedTypes/card.types.js.map +1 -0
- package/lib/commonjs/sharedTypes/index.js +32 -0
- package/lib/commonjs/sharedTypes/index.js.map +1 -0
- package/lib/commonjs/sharedTypes/types.js +2 -0
- package/lib/commonjs/sharedTypes/types.js.map +1 -0
- package/lib/commonjs/styles/variables.js +17 -0
- package/lib/commonjs/styles/variables.js.map +1 -0
- package/lib/commonjs/unitSdkManager/UnitSdk.api.js +54 -0
- package/lib/commonjs/unitSdkManager/UnitSdk.api.js.map +1 -0
- package/lib/commonjs/unitSdkManager/UnitSdkManager.js +51 -0
- package/lib/commonjs/unitSdkManager/UnitSdkManager.js.map +1 -0
- package/lib/commonjs/webComponent/WebComponent.js +47 -15
- package/lib/commonjs/webComponent/WebComponent.js.map +1 -1
- package/lib/commonjs/webComponent/html.js +22 -45
- package/lib/commonjs/webComponent/html.js.map +1 -1
- package/lib/module/assets/images/close.png +0 -0
- package/lib/module/assets/images/index.js +2 -0
- package/lib/module/assets/images/index.js.map +1 -0
- package/lib/module/components/UNActivityComponent/UNActivityComponent.js +13 -0
- package/lib/module/components/UNActivityComponent/UNActivityComponent.js.map +1 -0
- package/lib/module/components/UNActivityComponent/UNActivityComponent.utils.js +10 -0
- package/lib/module/components/UNActivityComponent/UNActivityComponent.utils.js.map +1 -0
- package/lib/module/components/UNBookPaymentComponent/UNBookPaymentComponent.js +23 -0
- package/lib/module/components/UNBookPaymentComponent/UNBookPaymentComponent.js.map +1 -0
- package/lib/module/components/UNBookPaymentComponent/UNBookPaymentComponent.utils.js +26 -0
- package/lib/module/components/UNBookPaymentComponent/UNBookPaymentComponent.utils.js.map +1 -0
- package/lib/module/components/UNBottomSheetComponent/UNBottomSheetComponent.constants.js +2 -0
- package/lib/module/components/UNBottomSheetComponent/UNBottomSheetComponent.constants.js.map +1 -0
- package/lib/module/components/UNBottomSheetComponent/UNBottomSheetComponent.js +163 -0
- package/lib/module/components/UNBottomSheetComponent/UNBottomSheetComponent.js.map +1 -0
- package/lib/module/components/UNBottomSheetComponent/UNBottomSheetComponent.styles.js +13 -0
- package/lib/module/components/UNBottomSheetComponent/UNBottomSheetComponent.styles.js.map +1 -0
- package/lib/module/components/UNBottomSheetComponent/UNBottomSheetComponent.utils.js +29 -0
- package/lib/module/components/UNBottomSheetComponent/UNBottomSheetComponent.utils.js.map +1 -0
- package/lib/module/components/UNCardComponent/UNCardComponent.js +65 -0
- package/lib/module/components/UNCardComponent/UNCardComponent.js.map +1 -0
- package/lib/module/components/UNCardComponent/UNCardComponent.utils.js +24 -0
- package/lib/module/components/UNCardComponent/UNCardComponent.utils.js.map +1 -0
- package/lib/module/components/index.js +4 -2
- package/lib/module/components/index.js.map +1 -1
- package/lib/module/custom.d.js +2 -0
- package/lib/module/custom.d.js.map +1 -0
- package/lib/module/helpers/{BottomSheet.js → BottomSheet/BottomSheet.js} +36 -82
- package/lib/module/helpers/BottomSheet/BottomSheet.js.map +1 -0
- package/lib/module/helpers/BottomSheet/BottomSheet.styles.js +70 -0
- package/lib/module/helpers/BottomSheet/BottomSheet.styles.js.map +1 -0
- package/lib/module/helpers/EventBus.js +4 -11
- package/lib/module/helpers/EventBus.js.map +1 -1
- package/lib/module/hooks/listenerToBus.js +18 -0
- package/lib/module/hooks/listenerToBus.js.map +1 -0
- package/lib/module/hooks/useAppStateListener.js +23 -0
- package/lib/module/hooks/useAppStateListener.js.map +1 -0
- package/lib/module/index.js +2 -0
- package/lib/module/index.js.map +1 -1
- package/lib/module/messages/nativeMessages/index.js +6 -0
- package/lib/module/messages/nativeMessages/index.js.map +1 -0
- package/lib/module/messages/webMessages/bookPaymentMessage.js +6 -0
- package/lib/module/messages/webMessages/bookPaymentMessage.js.map +1 -0
- package/lib/module/messages/webMessages/cardMessage.js +6 -0
- package/lib/module/messages/webMessages/cardMessage.js.map +1 -0
- package/lib/module/messages/webMessages/index.js +2 -0
- package/lib/module/messages/webMessages/index.js.map +1 -0
- package/lib/module/{webComponent → messages}/webMessages/pageMessage.js +0 -0
- package/lib/module/messages/webMessages/pageMessage.js.map +1 -0
- package/lib/module/{webComponent → messages}/webMessages/unitMessages.js +0 -0
- package/lib/module/messages/webMessages/unitMessages.js.map +1 -0
- package/lib/module/nativeComponent/UNNativeAddToWalletButton.js +4 -0
- package/lib/module/nativeComponent/UNNativeAddToWalletButton.js.map +1 -0
- package/lib/module/scripts/html/bodyHtml.js +42 -0
- package/lib/module/scripts/html/bodyHtml.js.map +1 -0
- package/lib/module/scripts/html/bodyScript.js +64 -0
- package/lib/module/scripts/html/bodyScript.js.map +1 -0
- package/lib/module/sharedTypes/bookPayment.types.js +2 -0
- package/lib/module/sharedTypes/bookPayment.types.js.map +1 -0
- package/lib/module/sharedTypes/card.types.js +2 -0
- package/lib/module/sharedTypes/card.types.js.map +1 -0
- package/lib/module/sharedTypes/index.js +3 -0
- package/lib/module/sharedTypes/index.js.map +1 -0
- package/lib/module/sharedTypes/types.js +2 -0
- package/lib/module/sharedTypes/types.js.map +1 -0
- package/lib/module/styles/variables.js +10 -0
- package/lib/module/styles/variables.js.map +1 -0
- package/lib/module/unitSdkManager/UnitSdk.api.js +37 -0
- package/lib/module/unitSdkManager/UnitSdk.api.js.map +1 -0
- package/lib/module/unitSdkManager/UnitSdkManager.js +38 -0
- package/lib/module/unitSdkManager/UnitSdkManager.js.map +1 -0
- package/lib/module/webComponent/WebComponent.js +46 -14
- package/lib/module/webComponent/WebComponent.js.map +1 -1
- package/lib/module/webComponent/html.js +18 -44
- package/lib/module/webComponent/html.js.map +1 -1
- package/lib/typescript/assets/images/index.d.ts +1 -0
- package/lib/typescript/components/UNActivityComponent/UNActivityComponent.d.ts +6 -0
- package/lib/typescript/components/UNActivityComponent/UNActivityComponent.utils.d.ts +2 -0
- package/lib/typescript/components/UNBookPaymentComponent/UNBookPaymentComponent.d.ts +11 -0
- package/lib/typescript/components/UNBookPaymentComponent/UNBookPaymentComponent.utils.d.ts +3 -0
- package/lib/typescript/components/UNBottomSheetComponent/UNBottomSheetComponent.constants.d.ts +1 -0
- package/lib/typescript/components/UNBottomSheetComponent/UNBottomSheetComponent.d.ts +7 -0
- package/lib/typescript/components/UNBottomSheetComponent/UNBottomSheetComponent.styles.d.ts +9 -0
- package/lib/typescript/components/UNBottomSheetComponent/UNBottomSheetComponent.utils.d.ts +5 -0
- package/lib/typescript/components/{Card/CardComponent.d.ts → UNCardComponent/UNCardComponent.d.ts} +3 -1
- package/lib/typescript/components/UNCardComponent/UNCardComponent.utils.d.ts +6 -0
- package/lib/typescript/components/index.d.ts +4 -2
- package/lib/typescript/helpers/{BottomSheet.d.ts → BottomSheet/BottomSheet.d.ts} +3 -0
- package/lib/typescript/helpers/BottomSheet/BottomSheet.styles.d.ts +63 -0
- package/lib/typescript/helpers/EventBus.d.ts +5 -7
- package/lib/typescript/hooks/listenerToBus.d.ts +7 -0
- package/lib/typescript/hooks/useAppStateListener.d.ts +1 -0
- package/lib/typescript/index.d.ts +2 -0
- package/lib/typescript/messages/nativeMessages/index.d.ts +3 -0
- package/lib/typescript/messages/webMessages/bookPaymentMessage.d.ts +8 -0
- package/lib/typescript/{webComponent → messages}/webMessages/cardMessage.d.ts +3 -2
- package/lib/typescript/messages/webMessages/index.d.ts +11 -0
- package/lib/typescript/{webComponent → messages}/webMessages/pageMessage.d.ts +0 -0
- package/lib/typescript/{webComponent → messages}/webMessages/unitMessages.d.ts +0 -0
- package/lib/typescript/nativeComponent/UNNativeAddToWalletButton.d.ts +6 -0
- package/lib/typescript/scripts/html/bodyHtml.d.ts +7 -0
- package/lib/typescript/scripts/html/bodyScript.d.ts +11 -0
- package/lib/typescript/sharedTypes/bookPayment.types.d.ts +26 -0
- package/lib/typescript/sharedTypes/card.types.d.ts +56 -0
- package/lib/typescript/sharedTypes/index.d.ts +2 -0
- package/lib/typescript/sharedTypes/types.d.ts +27 -0
- package/lib/typescript/styles/variables.d.ts +9 -0
- package/lib/typescript/unitSdkManager/UnitSdk.api.d.ts +3 -0
- package/lib/typescript/unitSdkManager/UnitSdkManager.d.ts +15 -0
- package/lib/typescript/webComponent/WebComponent.d.ts +9 -11
- package/lib/typescript/webComponent/html.d.ts +6 -1
- package/package.json +9 -5
- package/{unit-react-native-components.podspec → react-native-unit-components.podspec} +1 -1
- package/src/assets/images/close.png +0 -0
- package/src/assets/images/index.ts +1 -0
- package/src/components/UNActivityComponent/UNActivityComponent.tsx +21 -0
- package/src/components/UNActivityComponent/UNActivityComponent.utils.ts +11 -0
- package/src/components/UNBookPaymentComponent/UNBookPaymentComponent.tsx +37 -0
- package/src/components/UNBookPaymentComponent/UNBookPaymentComponent.utils.ts +29 -0
- package/src/components/UNBottomSheetComponent/UNBottomSheetComponent.constants.ts +1 -0
- package/src/components/UNBottomSheetComponent/UNBottomSheetComponent.styles.ts +13 -0
- package/src/components/UNBottomSheetComponent/UNBottomSheetComponent.tsx +167 -0
- package/src/components/UNBottomSheetComponent/UNBottomSheetComponent.utils.ts +34 -0
- package/src/components/UNCardComponent/UNCardComponent.tsx +73 -0
- package/src/components/UNCardComponent/UNCardComponent.utils.ts +28 -0
- package/src/components/index.ts +4 -2
- package/src/custom.d.ts +5 -0
- package/src/helpers/BottomSheet/BottomSheet.styles.ts +70 -0
- package/src/helpers/{BottomSheet.tsx → BottomSheet/BottomSheet.tsx} +74 -110
- package/src/helpers/EventBus.ts +13 -13
- package/src/hooks/listenerToBus.ts +23 -0
- package/src/hooks/useAppStateListener.ts +25 -0
- package/src/index.tsx +5 -1
- package/src/messages/nativeMessages/index.ts +3 -0
- package/src/messages/webMessages/bookPaymentMessage.ts +12 -0
- package/src/{webComponent → messages}/webMessages/cardMessage.ts +4 -2
- package/src/messages/webMessages/index.ts +21 -0
- package/src/{webComponent → messages}/webMessages/pageMessage.ts +1 -1
- package/src/{webComponent → messages}/webMessages/unitMessages.ts +1 -0
- package/src/nativeComponent/UNNativeAddToWalletButton.tsx +12 -0
- package/src/scripts/html/bodyHtml.ts +46 -0
- package/src/scripts/html/bodyScript.ts +67 -0
- package/src/sharedTypes/bookPayment.types.ts +27 -0
- package/src/sharedTypes/card.types.ts +59 -0
- package/src/sharedTypes/index.ts +2 -0
- package/src/sharedTypes/types.ts +35 -0
- package/src/styles/variables.ts +9 -0
- package/src/unitSdkManager/UnitSdk.api.ts +31 -0
- package/src/unitSdkManager/UnitSdkManager.ts +33 -0
- package/src/webComponent/WebComponent.tsx +55 -45
- package/src/webComponent/html.ts +22 -46
- package/android/src/main/java/com/unitreactnativecomponents/UnitReactNativeComponentsViewManager.kt +0 -19
- package/lib/commonjs/components/BottomSheet/BottomSheetComponent.js +0 -143
- package/lib/commonjs/components/BottomSheet/BottomSheetComponent.js.map +0 -1
- package/lib/commonjs/components/Card/CardComponent.js.map +0 -1
- package/lib/commonjs/helpers/BottomSheet.js.map +0 -1
- package/lib/commonjs/nativeComponenet/NativeComponentExample.js +0 -19
- package/lib/commonjs/nativeComponenet/NativeComponentExample.js.map +0 -1
- package/lib/commonjs/webComponent/webMessages/cardMessage.js.map +0 -1
- package/lib/commonjs/webComponent/webMessages/pageMessage.js.map +0 -1
- package/lib/commonjs/webComponent/webMessages/unitMessages.js.map +0 -1
- package/lib/module/components/BottomSheet/BottomSheetComponent.js +0 -118
- package/lib/module/components/BottomSheet/BottomSheetComponent.js.map +0 -1
- package/lib/module/components/Card/CardComponent.js +0 -75
- package/lib/module/components/Card/CardComponent.js.map +0 -1
- package/lib/module/helpers/BottomSheet.js.map +0 -1
- package/lib/module/nativeComponenet/NativeComponentExample.js +0 -10
- package/lib/module/nativeComponenet/NativeComponentExample.js.map +0 -1
- package/lib/module/webComponent/webMessages/cardMessage.js +0 -6
- package/lib/module/webComponent/webMessages/cardMessage.js.map +0 -1
- package/lib/module/webComponent/webMessages/pageMessage.js.map +0 -1
- package/lib/module/webComponent/webMessages/unitMessages.js.map +0 -1
- package/lib/typescript/components/BottomSheet/BottomSheetComponent.d.ts +0 -1
- package/lib/typescript/nativeComponenet/NativeComponentExample.d.ts +0 -7
- package/src/components/BottomSheet/BottomSheetComponent.tsx +0 -113
- package/src/components/Card/CardComponent.tsx +0 -75
- package/src/nativeComponenet/NativeComponentExample.tsx +0 -26
|
@@ -0,0 +1,163 @@
|
|
|
1
|
+
/* eslint-disable @typescript-eslint/no-explicit-any */
|
|
2
|
+
import React, { useEffect, useRef, useState } from 'react';
|
|
3
|
+
import { WebComponent, WebComponentType } from '../../webComponent/WebComponent';
|
|
4
|
+
import { Dimensions, Linking, View } from 'react-native';
|
|
5
|
+
import BottomSheet from '../../helpers/BottomSheet/BottomSheet';
|
|
6
|
+
import EventBus from '../../helpers/EventBus';
|
|
7
|
+
import { PageMessage } from '../../messages/webMessages/pageMessage';
|
|
8
|
+
import { UnitMessage } from '../../messages/webMessages/unitMessages';
|
|
9
|
+
import { CardMessage } from '../../messages/webMessages/cardMessage';
|
|
10
|
+
import { useListenerToBus } from '../../hooks/listenerToBus';
|
|
11
|
+
import { getBottomSheetScript, handleHtmlFullHeight, renderingBottomSheetRequest, resetHtml } from './UNBottomSheetComponent.utils';
|
|
12
|
+
import { getStylesObject } from './UNBottomSheetComponent.styles';
|
|
13
|
+
import { PresentationMode } from '../../scripts/html/bodyHtml';
|
|
14
|
+
import { useAppStateListener } from '../../hooks/useAppStateListener';
|
|
15
|
+
export let ScrollState;
|
|
16
|
+
|
|
17
|
+
(function (ScrollState) {
|
|
18
|
+
ScrollState["onTop"] = "onTop";
|
|
19
|
+
ScrollState["onlyWebView"] = "webViewScroll";
|
|
20
|
+
ScrollState["onlyBottomSheet"] = "onlyBottomSheet";
|
|
21
|
+
ScrollState["unScrollable"] = "unScrollable";
|
|
22
|
+
})(ScrollState || (ScrollState = {}));
|
|
23
|
+
|
|
24
|
+
export const UNBottomSheetComponent = () => {
|
|
25
|
+
const [isBottomSheetActive, setIsBottomSheetActive] = useState(false);
|
|
26
|
+
const [height, setHeight] = useState(0);
|
|
27
|
+
const [renderingRequest, setRenderingRequest] = useState(null);
|
|
28
|
+
const [scrollState, setScrollState] = useState(ScrollState.onTop);
|
|
29
|
+
const [waitForLoadingNewComponent, setWaitForLoadingNewComponent] = useState(false);
|
|
30
|
+
const [newHeightMessage, setNewHeightMessage] = useState(null);
|
|
31
|
+
const isAppActive = useAppStateListener();
|
|
32
|
+
const styles = getStylesObject();
|
|
33
|
+
const webRef = useRef(null);
|
|
34
|
+
|
|
35
|
+
const listenerAction = data => {
|
|
36
|
+
setRenderingRequest(data);
|
|
37
|
+
setIsBottomSheetActive(true);
|
|
38
|
+
};
|
|
39
|
+
|
|
40
|
+
useEffect(() => {
|
|
41
|
+
if (!isAppActive) {
|
|
42
|
+
setIsBottomSheetActive(false);
|
|
43
|
+
}
|
|
44
|
+
}, [isAppActive]);
|
|
45
|
+
useEffect(() => {
|
|
46
|
+
if (!webRef.current) return;
|
|
47
|
+
|
|
48
|
+
if (renderingRequest) {
|
|
49
|
+
renderingBottomSheetRequest(webRef.current, renderingRequest);
|
|
50
|
+
}
|
|
51
|
+
}, [webRef.current, renderingRequest]);
|
|
52
|
+
useEffect(() => {
|
|
53
|
+
if (!isBottomSheetActive) {
|
|
54
|
+
webRef.current && resetHtml(webRef.current);
|
|
55
|
+
setHeight(0);
|
|
56
|
+
setRenderingRequest(null);
|
|
57
|
+
setScrollState(ScrollState.onTop);
|
|
58
|
+
}
|
|
59
|
+
}, [isBottomSheetActive]);
|
|
60
|
+
useEffect(() => {
|
|
61
|
+
if (!waitForLoadingNewComponent && newHeightMessage) {
|
|
62
|
+
setWaitForLoadingNewComponent(false);
|
|
63
|
+
setNewHeight(newHeightMessage);
|
|
64
|
+
}
|
|
65
|
+
}, [waitForLoadingNewComponent, newHeightMessage]);
|
|
66
|
+
useListenerToBus([{
|
|
67
|
+
busEventKey: UnitMessage.UNIT_REQUEST_RENDERING,
|
|
68
|
+
action: listenerAction
|
|
69
|
+
}]);
|
|
70
|
+
|
|
71
|
+
const setNewHeight = message => {
|
|
72
|
+
if (renderingRequest) {
|
|
73
|
+
const nativePlace = JSON.parse(renderingRequest).nativePlace;
|
|
74
|
+
|
|
75
|
+
if (nativePlace == 'overFullScreen') {
|
|
76
|
+
const bottomSheetNewHeight = handleHtmlFullHeight(webRef.current, Dimensions.get('window').height);
|
|
77
|
+
setHeight(bottomSheetNewHeight);
|
|
78
|
+
setScrollState(ScrollState.onTop);
|
|
79
|
+
} else {
|
|
80
|
+
setHeight(message.details.height);
|
|
81
|
+
setScrollState(ScrollState.unScrollable);
|
|
82
|
+
}
|
|
83
|
+
}
|
|
84
|
+
};
|
|
85
|
+
|
|
86
|
+
const onWebMessage = message => {
|
|
87
|
+
switch (message.type) {
|
|
88
|
+
case PageMessage.PAGE_HEIGHT:
|
|
89
|
+
renderingRequest && setNewHeightMessage(message);
|
|
90
|
+
break;
|
|
91
|
+
|
|
92
|
+
case UnitMessage.UNIT_REQUEST_RENDERING:
|
|
93
|
+
// eslint-disable-next-line no-case-declarations
|
|
94
|
+
const {
|
|
95
|
+
data
|
|
96
|
+
} = message.details;
|
|
97
|
+
|
|
98
|
+
if (data != renderingRequest) {
|
|
99
|
+
setHeight(0);
|
|
100
|
+
setRenderingRequest(data);
|
|
101
|
+
setWaitForLoadingNewComponent(true);
|
|
102
|
+
setTimeout(() => setWaitForLoadingNewComponent(false), 400);
|
|
103
|
+
}
|
|
104
|
+
|
|
105
|
+
break;
|
|
106
|
+
|
|
107
|
+
case CardMessage.CARD_STATUS_CHANGED:
|
|
108
|
+
EventBus.Instance.event(CardMessage.CARD_STATUS_CHANGED, message.details.card);
|
|
109
|
+
break;
|
|
110
|
+
|
|
111
|
+
case UnitMessage.UNIT_REQUEST_CLOSE_FLOW:
|
|
112
|
+
setIsBottomSheetActive(false);
|
|
113
|
+
break;
|
|
114
|
+
|
|
115
|
+
case UnitMessage.UNIT_REQUEST_OPEN_LINK:
|
|
116
|
+
// eslint-disable-next-line no-case-declarations
|
|
117
|
+
const {
|
|
118
|
+
href
|
|
119
|
+
} = message.details;
|
|
120
|
+
Linking.openURL(href);
|
|
121
|
+
break;
|
|
122
|
+
}
|
|
123
|
+
};
|
|
124
|
+
|
|
125
|
+
const onScrollWebView = event => {
|
|
126
|
+
if (scrollState === ScrollState.unScrollable) return;
|
|
127
|
+
const currY = event.nativeEvent.contentOffset.y;
|
|
128
|
+
|
|
129
|
+
if (ScrollState.onTop && currY < 5) {
|
|
130
|
+
setScrollState(ScrollState.onlyBottomSheet);
|
|
131
|
+
}
|
|
132
|
+
|
|
133
|
+
if (scrollState !== ScrollState.onlyWebView && scrollState === ScrollState.onTop && currY > 5) {
|
|
134
|
+
setScrollState(ScrollState.onlyWebView);
|
|
135
|
+
}
|
|
136
|
+
};
|
|
137
|
+
|
|
138
|
+
const handleWebViewScroll = () => {
|
|
139
|
+
if (scrollState === ScrollState.unScrollable) return;
|
|
140
|
+
setScrollState(ScrollState.onlyWebView);
|
|
141
|
+
};
|
|
142
|
+
|
|
143
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(View, {
|
|
144
|
+
pointerEvents: isBottomSheetActive ? undefined : 'none',
|
|
145
|
+
style: styles.container
|
|
146
|
+
}, /*#__PURE__*/React.createElement(BottomSheet, {
|
|
147
|
+
isOpen: isBottomSheetActive,
|
|
148
|
+
height: height,
|
|
149
|
+
onClose: () => setIsBottomSheetActive(false),
|
|
150
|
+
onOpen: () => setIsBottomSheetActive(true),
|
|
151
|
+
handleWebViewScroll: () => handleWebViewScroll(),
|
|
152
|
+
shouldEnableBottomSheetScroll: scrollState !== ScrollState.onlyWebView
|
|
153
|
+
}, isAppActive && /*#__PURE__*/React.createElement(WebComponent, {
|
|
154
|
+
ref: webRef,
|
|
155
|
+
type: WebComponentType.slot,
|
|
156
|
+
presentationMode: PresentationMode.CoverInjectedHeight,
|
|
157
|
+
script: getBottomSheetScript(),
|
|
158
|
+
onMessage: onWebMessage,
|
|
159
|
+
isScrollable: scrollState === ScrollState.onlyWebView || scrollState === ScrollState.onTop,
|
|
160
|
+
handleScroll: onScrollWebView
|
|
161
|
+
}))));
|
|
162
|
+
};
|
|
163
|
+
//# sourceMappingURL=UNBottomSheetComponent.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["React","useEffect","useRef","useState","WebComponent","WebComponentType","Dimensions","Linking","View","BottomSheet","EventBus","PageMessage","UnitMessage","CardMessage","useListenerToBus","getBottomSheetScript","handleHtmlFullHeight","renderingBottomSheetRequest","resetHtml","getStylesObject","PresentationMode","useAppStateListener","ScrollState","UNBottomSheetComponent","isBottomSheetActive","setIsBottomSheetActive","height","setHeight","renderingRequest","setRenderingRequest","scrollState","setScrollState","onTop","waitForLoadingNewComponent","setWaitForLoadingNewComponent","newHeightMessage","setNewHeightMessage","isAppActive","styles","webRef","listenerAction","data","current","setNewHeight","busEventKey","UNIT_REQUEST_RENDERING","action","message","nativePlace","JSON","parse","bottomSheetNewHeight","get","details","unScrollable","onWebMessage","type","PAGE_HEIGHT","setTimeout","CARD_STATUS_CHANGED","Instance","event","card","UNIT_REQUEST_CLOSE_FLOW","UNIT_REQUEST_OPEN_LINK","href","openURL","onScrollWebView","currY","nativeEvent","contentOffset","y","onlyBottomSheet","onlyWebView","handleWebViewScroll","undefined","container","slot","CoverInjectedHeight"],"sources":["UNBottomSheetComponent.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport React, { useEffect, useRef, useState } from 'react';\nimport type WebView from 'react-native-webview';\nimport { WebComponent, WebComponentType } from '../../webComponent/WebComponent';\nimport { Dimensions, Linking, View } from 'react-native';\nimport BottomSheet from '../../helpers/BottomSheet/BottomSheet';\nimport EventBus from '../../helpers/EventBus';\nimport { HeightEvent, PageMessage } from '../../messages/webMessages/pageMessage';\nimport { RequestOpenLinkEvent, RequestRenderingData, RequestRenderingEvent, UnitMessage } from '../../messages/webMessages/unitMessages';\nimport { CardMessage, CardStatusChangedEvent } from '../../messages/webMessages/cardMessage';\nimport { useListenerToBus } from '../../hooks/listenerToBus';\nimport type { WebViewMessage } from '../../messages/webMessages';\nimport { getBottomSheetScript, handleHtmlFullHeight, renderingBottomSheetRequest, resetHtml } from './UNBottomSheetComponent.utils';\nimport { getStylesObject } from './UNBottomSheetComponent.styles';\nimport { PresentationMode } from '../../scripts/html/bodyHtml';\nimport { useAppStateListener } from '../../hooks/useAppStateListener';\n\nexport enum ScrollState {\n onTop = 'onTop',\n onlyWebView = 'webViewScroll',\n onlyBottomSheet = 'onlyBottomSheet',\n unScrollable = 'unScrollable'\n}\n\nexport const UNBottomSheetComponent = () => {\n const [isBottomSheetActive, setIsBottomSheetActive] = useState(false);\n const [height, setHeight] = useState(0);\n\n const [renderingRequest, setRenderingRequest] = useState<string | null>(null);\n const [scrollState, setScrollState] = useState<ScrollState>(ScrollState.onTop);\n\n const [waitForLoadingNewComponent, setWaitForLoadingNewComponent] = useState(false);\n const [newHeightMessage, setNewHeightMessage] = useState<WebViewMessage | null>(null);\n\n const isAppActive = useAppStateListener();\n\n const styles = getStylesObject();\n\n const webRef = useRef<WebView>(null);\n\n const listenerAction = (data: string) => {\n setRenderingRequest(data);\n setIsBottomSheetActive(true);\n };\n\n useEffect(() => {\n if (!isAppActive) {\n setIsBottomSheetActive(false);\n }\n }, [isAppActive]);\n\n useEffect(() => {\n if (!webRef.current) return;\n if (renderingRequest) {\n renderingBottomSheetRequest(webRef.current, renderingRequest);\n }\n }, [webRef.current, renderingRequest]);\n\n useEffect(() => {\n if (!isBottomSheetActive) {\n webRef.current && resetHtml(webRef.current);\n setHeight(0);\n setRenderingRequest(null);\n setScrollState(ScrollState.onTop);\n }\n }, [isBottomSheetActive]);\n\n useEffect(() => {\n if (!waitForLoadingNewComponent && newHeightMessage) {\n setWaitForLoadingNewComponent(false);\n setNewHeight(newHeightMessage);\n }\n }, [waitForLoadingNewComponent, newHeightMessage]);\n\n useListenerToBus([{ busEventKey: UnitMessage.UNIT_REQUEST_RENDERING, action: listenerAction }]);\n\n const setNewHeight = (message: WebViewMessage) => {\n if (renderingRequest) {\n const nativePlace = (JSON.parse(renderingRequest) as RequestRenderingData).nativePlace;\n if (nativePlace == 'overFullScreen') {\n const bottomSheetNewHeight = handleHtmlFullHeight(webRef.current, Dimensions.get('window').height);\n setHeight(bottomSheetNewHeight);\n setScrollState(ScrollState.onTop);\n } else {\n setHeight((message.details as HeightEvent).height);\n setScrollState(ScrollState.unScrollable);\n }\n }\n };\n\n const onWebMessage = (message: WebViewMessage) => {\n switch (message.type) {\n case PageMessage.PAGE_HEIGHT:\n renderingRequest && setNewHeightMessage(message);\n break;\n case UnitMessage.UNIT_REQUEST_RENDERING:\n // eslint-disable-next-line no-case-declarations\n const { data } = (message.details as RequestRenderingEvent);\n if (data != renderingRequest) {\n setHeight(0);\n setRenderingRequest(data);\n setWaitForLoadingNewComponent(true);\n setTimeout(() => setWaitForLoadingNewComponent(false), 400);\n }\n break;\n case CardMessage.CARD_STATUS_CHANGED:\n EventBus.Instance.event(CardMessage.CARD_STATUS_CHANGED, (message.details as CardStatusChangedEvent).card);\n break;\n case UnitMessage.UNIT_REQUEST_CLOSE_FLOW:\n setIsBottomSheetActive(false);\n break;\n case UnitMessage.UNIT_REQUEST_OPEN_LINK:\n // eslint-disable-next-line no-case-declarations\n const { href } = (message.details as RequestOpenLinkEvent);\n Linking.openURL(href);\n break;\n }\n };\n\n const onScrollWebView = (event: any) => {\n if (scrollState === ScrollState.unScrollable) return;\n\n const currY = event.nativeEvent.contentOffset.y;\n\n if (ScrollState.onTop && currY < 5) {\n setScrollState(ScrollState.onlyBottomSheet);\n }\n\n if ( scrollState !== ScrollState.onlyWebView && scrollState === ScrollState.onTop && currY > 5) {\n setScrollState(ScrollState.onlyWebView);\n }\n };\n\n const handleWebViewScroll = () => {\n if (scrollState === ScrollState.unScrollable) return;\n setScrollState(ScrollState.onlyWebView);\n };\n\n return (\n <>\n <View\n pointerEvents={isBottomSheetActive ? undefined : 'none'}\n style={styles.container}\n >\n <BottomSheet\n isOpen={isBottomSheetActive}\n height={height}\n onClose={() => setIsBottomSheetActive(false)}\n onOpen={() => setIsBottomSheetActive(true)}\n handleWebViewScroll={() => handleWebViewScroll()}\n shouldEnableBottomSheetScroll={scrollState !== ScrollState.onlyWebView}\n >\n { isAppActive && (\n <WebComponent\n ref={webRef}\n type={WebComponentType.slot}\n presentationMode={PresentationMode.CoverInjectedHeight}\n script={getBottomSheetScript()}\n onMessage={onWebMessage}\n isScrollable={scrollState === ScrollState.onlyWebView || scrollState === ScrollState.onTop}\n handleScroll={onScrollWebView}\n />)}\n </BottomSheet>\n </View>\n </>\n );\n};\n"],"mappings":"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"}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { StyleSheet } from 'react-native';
|
|
2
|
+
export const getStylesObject = () => {
|
|
3
|
+
return StyleSheet.create({
|
|
4
|
+
container: {
|
|
5
|
+
position: 'absolute',
|
|
6
|
+
top: 0,
|
|
7
|
+
bottom: 0,
|
|
8
|
+
left: 0,
|
|
9
|
+
right: 0
|
|
10
|
+
}
|
|
11
|
+
});
|
|
12
|
+
};
|
|
13
|
+
//# sourceMappingURL=UNBottomSheetComponent.styles.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["StyleSheet","getStylesObject","create","container","position","top","bottom","left","right"],"sources":["UNBottomSheetComponent.styles.ts"],"sourcesContent":["import { StyleSheet } from 'react-native';\n\nexport const getStylesObject = () => {\n return StyleSheet.create({\n container: {\n position: 'absolute',\n top: 0,\n bottom: 0,\n left: 0,\n right: 0\n }\n });\n};\n"],"mappings":"AAAA,SAASA,UAAT,QAA2B,cAA3B;AAEA,OAAO,MAAMC,eAAe,GAAG,MAAM;EACnC,OAAOD,UAAU,CAACE,MAAX,CAAkB;IACvBC,SAAS,EAAE;MACTC,QAAQ,EAAE,UADD;MAETC,GAAG,EAAE,CAFI;MAGTC,MAAM,EAAE,CAHC;MAITC,IAAI,EAAE,CAJG;MAKTC,KAAK,EAAE;IALE;EADY,CAAlB,CAAP;AASD,CAVM"}
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
import { UnitMessage } from '../../messages/webMessages/unitMessages';
|
|
2
|
+
import { BOTTOM_SHEET_MAX_PRECANTAGE_SIZE } from './UNBottomSheetComponent.constants';
|
|
3
|
+
export const getBottomSheetScript = () => {
|
|
4
|
+
return `
|
|
5
|
+
window.addEventListener("${UnitMessage.UNIT_REQUEST_REFRESH}", (e) => {
|
|
6
|
+
postMessageToSDK({ type: "${UnitMessage.UNIT_REQUEST_REFRESH}", details: e.detail })
|
|
7
|
+
});
|
|
8
|
+
`;
|
|
9
|
+
};
|
|
10
|
+
export const renderingBottomSheetRequest = (currentWebView, renderingRequest) => {
|
|
11
|
+
currentWebView === null || currentWebView === void 0 ? void 0 : currentWebView.injectJavaScript(`
|
|
12
|
+
document.activeElement && document.activeElement.blur();
|
|
13
|
+
dispatchRenderingEvent('${renderingRequest}');
|
|
14
|
+
`);
|
|
15
|
+
};
|
|
16
|
+
export const resetHtml = currentWebView => {
|
|
17
|
+
currentWebView === null || currentWebView === void 0 ? void 0 : currentWebView.injectJavaScript(`
|
|
18
|
+
document.activeElement && document.activeElement.blur();
|
|
19
|
+
document.getElementById('webViewContainer').style.height = null;
|
|
20
|
+
`);
|
|
21
|
+
};
|
|
22
|
+
export const handleHtmlFullHeight = (currentWebView, windowHeight) => {
|
|
23
|
+
const bottomSheetHeight = windowHeight * BOTTOM_SHEET_MAX_PRECANTAGE_SIZE;
|
|
24
|
+
currentWebView && (currentWebView === null || currentWebView === void 0 ? void 0 : currentWebView.injectJavaScript(`
|
|
25
|
+
document.getElementById('webViewContainer').style.height = '${bottomSheetHeight}px';
|
|
26
|
+
`));
|
|
27
|
+
return bottomSheetHeight;
|
|
28
|
+
};
|
|
29
|
+
//# sourceMappingURL=UNBottomSheetComponent.utils.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["UnitMessage","BOTTOM_SHEET_MAX_PRECANTAGE_SIZE","getBottomSheetScript","UNIT_REQUEST_REFRESH","renderingBottomSheetRequest","currentWebView","renderingRequest","injectJavaScript","resetHtml","handleHtmlFullHeight","windowHeight","bottomSheetHeight"],"sources":["UNBottomSheetComponent.utils.ts"],"sourcesContent":["import type WebView from 'react-native-webview';\nimport { UnitMessage } from '../../messages/webMessages/unitMessages';\nimport { BOTTOM_SHEET_MAX_PRECANTAGE_SIZE } from './UNBottomSheetComponent.constants';\n\nexport const getBottomSheetScript = () => {\n return `\n window.addEventListener(\"${UnitMessage.UNIT_REQUEST_REFRESH}\", (e) => {\n postMessageToSDK({ type: \"${UnitMessage.UNIT_REQUEST_REFRESH}\", details: e.detail })\n });\n `;\n};\n\nexport const renderingBottomSheetRequest = (currentWebView: WebView, renderingRequest: string) => {\n currentWebView?.injectJavaScript(`\n document.activeElement && document.activeElement.blur();\n dispatchRenderingEvent('${renderingRequest}');\n `);\n};\n\nexport const resetHtml = (currentWebView: WebView) => {\n currentWebView?.injectJavaScript(`\n document.activeElement && document.activeElement.blur();\n document.getElementById('webViewContainer').style.height = null;\n `);\n};\n\nexport const handleHtmlFullHeight = (currentWebView: WebView | null, windowHeight: number) => {\n const bottomSheetHeight = windowHeight * BOTTOM_SHEET_MAX_PRECANTAGE_SIZE;\n currentWebView && currentWebView?.injectJavaScript(`\n document.getElementById('webViewContainer').style.height = '${bottomSheetHeight}px';\n `);\n\n return bottomSheetHeight;\n};\n"],"mappings":"AACA,SAASA,WAAT,QAA4B,yCAA5B;AACA,SAASC,gCAAT,QAAiD,oCAAjD;AAEA,OAAO,MAAMC,oBAAoB,GAAG,MAAM;EACxC,OAAQ;AACV,+BAA+BF,WAAW,CAACG,oBAAqB;AAChE,kCAAkCH,WAAW,CAACG,oBAAqB;AACnE;AACA,GAJE;AAKD,CANM;AAQP,OAAO,MAAMC,2BAA2B,GAAG,CAACC,cAAD,EAA0BC,gBAA1B,KAAuD;EAChGD,cAAc,SAAd,IAAAA,cAAc,WAAd,YAAAA,cAAc,CAAEE,gBAAhB,CAAkC;AACpC;AACA,8BAA8BD,gBAAiB;AAC/C,GAHE;AAID,CALM;AAOP,OAAO,MAAME,SAAS,GAAIH,cAAD,IAA6B;EACpDA,cAAc,SAAd,IAAAA,cAAc,WAAd,YAAAA,cAAc,CAAEE,gBAAhB,CAAkC;AACpC;AACA;AACA,GAHE;AAID,CALM;AAOP,OAAO,MAAME,oBAAoB,GAAG,CAACJ,cAAD,EAAiCK,YAAjC,KAA0D;EAC5F,MAAMC,iBAAiB,GAAGD,YAAY,GAAGT,gCAAzC;EACAI,cAAc,KAAIA,cAAJ,aAAIA,cAAJ,uBAAIA,cAAc,CAAEE,gBAAhB,CAAkC;AACtD,kEAAkEI,iBAAkB;AACpF,GAFoB,CAAJ,CAAd;EAIA,OAAOA,iBAAP;AACD,CAPM"}
|
|
@@ -0,0 +1,65 @@
|
|
|
1
|
+
import React, { useEffect, useRef, useState } from 'react';
|
|
2
|
+
import { Dimensions, View } from 'react-native';
|
|
3
|
+
import { PageMessage } from '../../messages/webMessages/pageMessage';
|
|
4
|
+
import { UnitMessage } from '../../messages/webMessages/unitMessages';
|
|
5
|
+
import EventBus from '../../helpers/EventBus';
|
|
6
|
+
import { WebComponent, WebComponentType } from '../../webComponent/WebComponent';
|
|
7
|
+
import { useListenerToBus } from '../../hooks/listenerToBus';
|
|
8
|
+
import { getCardParams, getCardScript, injectRefreshEventIfNeeded } from './UNCardComponent.utils';
|
|
9
|
+
import { PresentationMode } from '../../scripts/html/bodyHtml';
|
|
10
|
+
import { CardMessage } from '../../messages/webMessages/cardMessage';
|
|
11
|
+
export const UNCardComponent = props => {
|
|
12
|
+
const [height, setHeight] = useState(0);
|
|
13
|
+
const [requestRefreshEvent, setRequestRefreshEvent] = useState(null);
|
|
14
|
+
const windowWidth = Dimensions.get('window').width;
|
|
15
|
+
const webRef = useRef(null);
|
|
16
|
+
|
|
17
|
+
const cardStatusChanged = card => {
|
|
18
|
+
if (props.onStatusChanged) {
|
|
19
|
+
props.onStatusChanged(card);
|
|
20
|
+
}
|
|
21
|
+
};
|
|
22
|
+
|
|
23
|
+
const requestRefresh = data => {
|
|
24
|
+
setRequestRefreshEvent(data);
|
|
25
|
+
};
|
|
26
|
+
|
|
27
|
+
useListenerToBus([{
|
|
28
|
+
busEventKey: CardMessage.CARD_STATUS_CHANGED,
|
|
29
|
+
action: cardStatusChanged
|
|
30
|
+
}, {
|
|
31
|
+
busEventKey: UnitMessage.UNIT_REQUEST_REFRESH,
|
|
32
|
+
action: requestRefresh
|
|
33
|
+
}]);
|
|
34
|
+
useEffect(() => {
|
|
35
|
+
injectRefreshEventIfNeeded(webRef.current, requestRefreshEvent, props.cardId);
|
|
36
|
+
}, [requestRefreshEvent]);
|
|
37
|
+
|
|
38
|
+
const handleMessage = message => {
|
|
39
|
+
switch (message.type) {
|
|
40
|
+
case UnitMessage.UNIT_REQUEST_RENDERING:
|
|
41
|
+
EventBus.Instance.event(UnitMessage.UNIT_REQUEST_RENDERING, message.details.data);
|
|
42
|
+
break;
|
|
43
|
+
|
|
44
|
+
case PageMessage.PAGE_HEIGHT:
|
|
45
|
+
setHeight(message.details.height);
|
|
46
|
+
break;
|
|
47
|
+
}
|
|
48
|
+
};
|
|
49
|
+
|
|
50
|
+
return /*#__PURE__*/React.createElement(View, {
|
|
51
|
+
style: {
|
|
52
|
+
height
|
|
53
|
+
}
|
|
54
|
+
}, /*#__PURE__*/React.createElement(WebComponent, {
|
|
55
|
+
ref: webRef,
|
|
56
|
+
type: WebComponentType.card,
|
|
57
|
+
presentationMode: PresentationMode.Default,
|
|
58
|
+
params: getCardParams(props),
|
|
59
|
+
script: getCardScript(),
|
|
60
|
+
onMessage: message => handleMessage(message),
|
|
61
|
+
width: windowWidth,
|
|
62
|
+
isScrollable: false
|
|
63
|
+
}));
|
|
64
|
+
};
|
|
65
|
+
//# sourceMappingURL=UNCardComponent.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["React","useEffect","useRef","useState","Dimensions","View","PageMessage","UnitMessage","EventBus","WebComponent","WebComponentType","useListenerToBus","getCardParams","getCardScript","injectRefreshEventIfNeeded","PresentationMode","CardMessage","UNCardComponent","props","height","setHeight","requestRefreshEvent","setRequestRefreshEvent","windowWidth","get","width","webRef","cardStatusChanged","card","onStatusChanged","requestRefresh","data","busEventKey","CARD_STATUS_CHANGED","action","UNIT_REQUEST_REFRESH","current","cardId","handleMessage","message","type","UNIT_REQUEST_RENDERING","Instance","event","details","PAGE_HEIGHT","Default"],"sources":["UNCardComponent.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from 'react';\nimport { Dimensions, View } from 'react-native';\nimport type WebView from 'react-native-webview';\nimport { HeightEvent, PageMessage } from '../../messages/webMessages/pageMessage';\nimport { RequestRefreshEvent, RequestRenderingEvent, UnitMessage } from '../../messages/webMessages/unitMessages';\nimport EventBus from '../../helpers/EventBus';\nimport { WebComponent, WebComponentType } from '../../webComponent/WebComponent';\nimport { useListenerToBus } from '../../hooks/listenerToBus';\nimport type { WebViewMessage } from '../../messages/webMessages';\nimport { getCardParams, getCardScript, injectRefreshEventIfNeeded } from './UNCardComponent.utils';\nimport { PresentationMode } from '../../scripts/html/bodyHtml';\nimport type { UNCardData } from '../../sharedTypes';\nimport { CardMessage } from '../../messages/webMessages/cardMessage';\n\nexport interface UNCardComponentProps {\n cardId: string;\n customerToken: string;\n theme?: string;\n onStatusChanged?: (card: UNCardData) => void;\n}\n\nexport const UNCardComponent = (props: UNCardComponentProps) => {\n const [height, setHeight] = useState(0);\n const [requestRefreshEvent, setRequestRefreshEvent] = useState<RequestRefreshEvent | null>(null);\n const windowWidth = Dimensions.get('window').width;\n\n const webRef = useRef<WebView>(null);\n\n const cardStatusChanged = (card: UNCardData) => {\n if (props.onStatusChanged) {\n props.onStatusChanged(card);\n }\n };\n\n const requestRefresh = (data: RequestRefreshEvent) => {\n setRequestRefreshEvent(data);\n };\n\n useListenerToBus([\n { busEventKey: CardMessage.CARD_STATUS_CHANGED, action: cardStatusChanged },\n { busEventKey: UnitMessage.UNIT_REQUEST_REFRESH, action: requestRefresh },\n ]);\n\n useEffect(() => {\n injectRefreshEventIfNeeded(webRef.current, requestRefreshEvent, props.cardId);\n }, [requestRefreshEvent]);\n\n const handleMessage = (message: WebViewMessage) => {\n switch (message.type) {\n case UnitMessage.UNIT_REQUEST_RENDERING:\n EventBus.Instance.event(UnitMessage.UNIT_REQUEST_RENDERING, (message.details as RequestRenderingEvent).data);\n break;\n case PageMessage.PAGE_HEIGHT:\n setHeight((message.details as HeightEvent).height);\n break;\n }\n };\n\n return (\n <View style={{ height }}>\n <WebComponent\n ref={webRef}\n type={WebComponentType.card}\n presentationMode={PresentationMode.Default}\n params={getCardParams(props)}\n script={getCardScript()}\n onMessage={message => handleMessage(message)}\n width={windowWidth}\n isScrollable={false}\n />\n </View>\n );\n};\n"],"mappings":"AAAA,OAAOA,KAAP,IAAgBC,SAAhB,EAA2BC,MAA3B,EAAmCC,QAAnC,QAAmD,OAAnD;AACA,SAASC,UAAT,EAAqBC,IAArB,QAAiC,cAAjC;AAEA,SAAsBC,WAAtB,QAAyC,wCAAzC;AACA,SAAqDC,WAArD,QAAwE,yCAAxE;AACA,OAAOC,QAAP,MAAqB,wBAArB;AACA,SAASC,YAAT,EAAuBC,gBAAvB,QAA+C,iCAA/C;AACA,SAASC,gBAAT,QAAiC,2BAAjC;AAEA,SAASC,aAAT,EAAwBC,aAAxB,EAAuCC,0BAAvC,QAAyE,yBAAzE;AACA,SAASC,gBAAT,QAAiC,6BAAjC;AAEA,SAASC,WAAT,QAA4B,wCAA5B;AASA,OAAO,MAAMC,eAAe,GAAIC,KAAD,IAAiC;EAC9D,MAAM,CAACC,MAAD,EAASC,SAAT,IAAsBjB,QAAQ,CAAC,CAAD,CAApC;EACA,MAAM,CAACkB,mBAAD,EAAsBC,sBAAtB,IAAgDnB,QAAQ,CAA6B,IAA7B,CAA9D;EACA,MAAMoB,WAAW,GAAGnB,UAAU,CAACoB,GAAX,CAAe,QAAf,EAAyBC,KAA7C;EAEA,MAAMC,MAAM,GAAGxB,MAAM,CAAU,IAAV,CAArB;;EAEA,MAAMyB,iBAAiB,GAAIC,IAAD,IAAsB;IAC9C,IAAIV,KAAK,CAACW,eAAV,EAA2B;MACzBX,KAAK,CAACW,eAAN,CAAsBD,IAAtB;IACD;EACF,CAJD;;EAMA,MAAME,cAAc,GAAIC,IAAD,IAA+B;IACpDT,sBAAsB,CAACS,IAAD,CAAtB;EACD,CAFD;;EAIApB,gBAAgB,CAAC,CACf;IAAEqB,WAAW,EAAEhB,WAAW,CAACiB,mBAA3B;IAAgDC,MAAM,EAAEP;EAAxD,CADe,EAEf;IAAEK,WAAW,EAAEzB,WAAW,CAAC4B,oBAA3B;IAAiDD,MAAM,EAAEJ;EAAzD,CAFe,CAAD,CAAhB;EAKA7B,SAAS,CAAC,MAAM;IACda,0BAA0B,CAACY,MAAM,CAACU,OAAR,EAAiBf,mBAAjB,EAAsCH,KAAK,CAACmB,MAA5C,CAA1B;EACD,CAFQ,EAEN,CAAChB,mBAAD,CAFM,CAAT;;EAIA,MAAMiB,aAAa,GAAIC,OAAD,IAA6B;IACjD,QAAQA,OAAO,CAACC,IAAhB;MACE,KAAKjC,WAAW,CAACkC,sBAAjB;QACEjC,QAAQ,CAACkC,QAAT,CAAkBC,KAAlB,CAAwBpC,WAAW,CAACkC,sBAApC,EAA6DF,OAAO,CAACK,OAAT,CAA2Cb,IAAvG;QACA;;MACF,KAAKzB,WAAW,CAACuC,WAAjB;QACEzB,SAAS,CAAEmB,OAAO,CAACK,OAAT,CAAiCzB,MAAlC,CAAT;QACA;IANJ;EAQD,CATD;;EAWA,oBACE,oBAAC,IAAD;IAAM,KAAK,EAAE;MAAEA;IAAF;EAAb,gBACE,oBAAC,YAAD;IACE,GAAG,EAAEO,MADP;IAEE,IAAI,EAAEhB,gBAAgB,CAACkB,IAFzB;IAGE,gBAAgB,EAAEb,gBAAgB,CAAC+B,OAHrC;IAIE,MAAM,EAAElC,aAAa,CAACM,KAAD,CAJvB;IAKE,MAAM,EAAEL,aAAa,EALvB;IAME,SAAS,EAAE0B,OAAO,IAAID,aAAa,CAACC,OAAD,CANrC;IAOE,KAAK,EAAEhB,WAPT;IAQE,YAAY,EAAE;EARhB,EADF,CADF;AAcD,CAnDM"}
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
import { WebComponentType } from '../../webComponent/WebComponent';
|
|
2
|
+
import { UnitMessage } from '../../messages/webMessages/unitMessages';
|
|
3
|
+
import { UnitSDK } from '../../unitSdkManager/UnitSdkManager';
|
|
4
|
+
export const getCardParams = props => {
|
|
5
|
+
return `
|
|
6
|
+
card-id="${props.cardId}"
|
|
7
|
+
customer-token="${props.customerToken}"
|
|
8
|
+
theme="${props.theme ?? UnitSDK.getTheme()}"
|
|
9
|
+
`;
|
|
10
|
+
};
|
|
11
|
+
export const getCardScript = () => {
|
|
12
|
+
return `
|
|
13
|
+
const dispatchRefreshEvent = (details) => {
|
|
14
|
+
const event = new CustomEvent("${UnitMessage.UNIT_REQUEST_REFRESH}",{ detail: JSON.parse(details) })
|
|
15
|
+
window.dispatchEvent(event)
|
|
16
|
+
}
|
|
17
|
+
`;
|
|
18
|
+
};
|
|
19
|
+
export const injectRefreshEventIfNeeded = (currentWeb, requestRefreshEvent, cardId) => {
|
|
20
|
+
if (requestRefreshEvent && requestRefreshEvent.dependencies.includes(WebComponentType.card.valueOf()) && requestRefreshEvent.resourceId == cardId) {
|
|
21
|
+
currentWeb === null || currentWeb === void 0 ? void 0 : currentWeb.injectJavaScript(`dispatchRefreshEvent('${JSON.stringify(requestRefreshEvent)}')`);
|
|
22
|
+
}
|
|
23
|
+
};
|
|
24
|
+
//# sourceMappingURL=UNCardComponent.utils.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["WebComponentType","UnitMessage","UnitSDK","getCardParams","props","cardId","customerToken","theme","getTheme","getCardScript","UNIT_REQUEST_REFRESH","injectRefreshEventIfNeeded","currentWeb","requestRefreshEvent","dependencies","includes","card","valueOf","resourceId","injectJavaScript","JSON","stringify"],"sources":["UNCardComponent.utils.ts"],"sourcesContent":["import type WebView from 'react-native-webview';\nimport type { UNCardComponentProps } from './UNCardComponent';\nimport { WebComponentType } from '../../webComponent/WebComponent';\nimport { RequestRefreshEvent, UnitMessage } from '../../messages/webMessages/unitMessages';\nimport { UnitSDK } from '../../unitSdkManager/UnitSdkManager';\n\nexport const getCardParams = (props: UNCardComponentProps) => {\n return `\n card-id=\"${props.cardId}\"\n customer-token=\"${props.customerToken}\"\n theme=\"${props.theme ?? UnitSDK.getTheme()}\"\n `;\n};\n\nexport const getCardScript = () => {\n return `\n const dispatchRefreshEvent = (details) => {\n const event = new CustomEvent(\"${UnitMessage.UNIT_REQUEST_REFRESH}\",{ detail: JSON.parse(details) })\n window.dispatchEvent(event)\n }\n `;\n};\n\nexport const injectRefreshEventIfNeeded = (currentWeb: WebView | null, requestRefreshEvent: RequestRefreshEvent | null, cardId: string) => {\n if (requestRefreshEvent && requestRefreshEvent.dependencies.includes(WebComponentType.card.valueOf()) && requestRefreshEvent.resourceId == cardId) {\n currentWeb?.injectJavaScript(`dispatchRefreshEvent('${JSON.stringify(requestRefreshEvent)}')`);\n }\n};\n"],"mappings":"AAEA,SAASA,gBAAT,QAAiC,iCAAjC;AACA,SAA8BC,WAA9B,QAAiD,yCAAjD;AACA,SAASC,OAAT,QAAwB,qCAAxB;AAEA,OAAO,MAAMC,aAAa,GAAIC,KAAD,IAAiC;EAC5D,OAAQ;AACV,eAAeA,KAAK,CAACC,MAAO;AAC5B,sBAAsBD,KAAK,CAACE,aAAc;AAC1C,aAAaF,KAAK,CAACG,KAAN,IAAeL,OAAO,CAACM,QAAR,EAAmB;AAC/C,GAJE;AAKD,CANM;AAQP,OAAO,MAAMC,aAAa,GAAG,MAAM;EACjC,OAAQ;AACV;AACA,qCAAqCR,WAAW,CAACS,oBAAqB;AACtE;AACA;AACA,GALE;AAMD,CAPM;AASP,OAAO,MAAMC,0BAA0B,GAAG,CAACC,UAAD,EAA6BC,mBAA7B,EAA8ER,MAA9E,KAAiG;EACzI,IAAIQ,mBAAmB,IAAIA,mBAAmB,CAACC,YAApB,CAAiCC,QAAjC,CAA0Cf,gBAAgB,CAACgB,IAAjB,CAAsBC,OAAtB,EAA1C,CAAvB,IAAqGJ,mBAAmB,CAACK,UAApB,IAAkCb,MAA3I,EAAmJ;IACjJO,UAAU,SAAV,IAAAA,UAAU,WAAV,YAAAA,UAAU,CAAEO,gBAAZ,CAA8B,yBAAwBC,IAAI,CAACC,SAAL,CAAeR,mBAAf,CAAoC,IAA1F;EACD;AACF,CAJM"}
|
|
@@ -1,3 +1,5 @@
|
|
|
1
|
-
export * from './
|
|
2
|
-
export * from './
|
|
1
|
+
export * from './UNCardComponent/UNCardComponent';
|
|
2
|
+
export * from './UNBottomSheetComponent/UNBottomSheetComponent';
|
|
3
|
+
export * from './UNBookPaymentComponent/UNBookPaymentComponent';
|
|
4
|
+
export * from './UNActivityComponent/UNActivityComponent';
|
|
3
5
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export * from './
|
|
1
|
+
{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export * from './UNCardComponent/UNCardComponent';\nexport * from './UNBottomSheetComponent/UNBottomSheetComponent';\nexport * from './UNBookPaymentComponent/UNBookPaymentComponent';\nexport * from './UNActivityComponent/UNActivityComponent';\n"],"mappings":"AAAA,cAAc,mCAAd;AACA,cAAc,iDAAd;AACA,cAAc,iDAAd;AACA,cAAc,2CAAd"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":[],"sources":["custom.d.ts"],"sourcesContent":["declare module '*.png' {\n import { ImageSourcePropType } from 'react-native';\n const content: ImageSourcePropType;\n export default content;\n}\n"],"mappings":""}
|
|
@@ -1,12 +1,16 @@
|
|
|
1
1
|
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
2
2
|
|
|
3
3
|
import React, { useEffect, useRef, useState } from 'react';
|
|
4
|
-
import { Animated, BackHandler, Dimensions, Easing,
|
|
4
|
+
import { Animated, BackHandler, Dimensions, Easing, Image, KeyboardAvoidingView, PanResponder, TouchableOpacity, View } from 'react-native';
|
|
5
5
|
import PropTypes from 'prop-types';
|
|
6
|
+
import { CloseIcon } from '../../assets/images';
|
|
7
|
+
import { BOTTOM_SHEET_MAX_PRECANTAGE_SIZE } from '../../components/UNBottomSheetComponent/UNBottomSheetComponent.constants';
|
|
8
|
+
import { getStylesObject } from './BottomSheet.styles';
|
|
6
9
|
|
|
7
10
|
const BottomSheet = props => {
|
|
8
11
|
const panelHeightValue = useRef(new Animated.Value(props.sliderMaxHeight)).current;
|
|
9
12
|
const fadeAnim = useRef(new Animated.Value(0)).current;
|
|
13
|
+
const styles = getStylesObject(fadeAnim);
|
|
10
14
|
const [isPanelOpened, setIsPanelOpened] = useState(props.isOpen);
|
|
11
15
|
const [contentHeight, setContentHeight] = useState(undefined);
|
|
12
16
|
const [currentHeight, setCurrentHeight] = useState(props.sliderMaxHeight);
|
|
@@ -14,12 +18,16 @@ const BottomSheet = props => {
|
|
|
14
18
|
|
|
15
19
|
const _parentPanResponder = PanResponder.create({
|
|
16
20
|
onMoveShouldSetPanResponderCapture: (_, gestureState) => {
|
|
17
|
-
return Math.abs(gestureState.dy) > 10;
|
|
21
|
+
return props.shouldEnableBottomSheetScroll && Math.abs(gestureState.dy) > 10;
|
|
18
22
|
},
|
|
19
23
|
|
|
20
24
|
onPanResponderMove(_, gestureState) {
|
|
25
|
+
if (props.shouldEnableBottomSheetScroll && gestureState.dy < 5) {
|
|
26
|
+
props.handleWebViewScroll();
|
|
27
|
+
}
|
|
28
|
+
|
|
21
29
|
if (currentHeight + gestureState.dy < 0) return;
|
|
22
|
-
if (!props.expandToMaxHeightEnabled && currentHeight + gestureState.dy < sliderMaxHeight - contentHeight) return;
|
|
30
|
+
if (!props.expandToMaxHeightEnabled && contentHeight && currentHeight + gestureState.dy < sliderMaxHeight - contentHeight) return;
|
|
23
31
|
panelHeightValue.setValue(currentHeight + gestureState.dy);
|
|
24
32
|
setDy(gestureState.dy);
|
|
25
33
|
},
|
|
@@ -28,7 +36,7 @@ const BottomSheet = props => {
|
|
|
28
36
|
if (dy > 0) {
|
|
29
37
|
collapse();
|
|
30
38
|
} else if (!props.expandToMaxHeightEnabled) {
|
|
31
|
-
setToContentHeight(contentHeight);
|
|
39
|
+
contentHeight && setToContentHeight(contentHeight);
|
|
32
40
|
} else if (dy < 0) {
|
|
33
41
|
expand();
|
|
34
42
|
} else {
|
|
@@ -90,7 +98,7 @@ const BottomSheet = props => {
|
|
|
90
98
|
animationDuration
|
|
91
99
|
} = props;
|
|
92
100
|
|
|
93
|
-
if (currentHeight > sliderMaxHeight - contentHeight) {
|
|
101
|
+
if (contentHeight && currentHeight > sliderMaxHeight - contentHeight) {
|
|
94
102
|
setToContentHeight(contentHeight);
|
|
95
103
|
return;
|
|
96
104
|
}
|
|
@@ -104,27 +112,13 @@ const BottomSheet = props => {
|
|
|
104
112
|
};
|
|
105
113
|
|
|
106
114
|
const collapse = () => {
|
|
107
|
-
if (currentHeight > sliderMaxHeight - contentHeight) {
|
|
115
|
+
if (contentHeight && currentHeight > sliderMaxHeight - contentHeight) {
|
|
108
116
|
_dismiss();
|
|
109
117
|
|
|
110
118
|
return;
|
|
111
119
|
}
|
|
112
120
|
|
|
113
|
-
setToContentHeight(contentHeight);
|
|
114
|
-
// duration: animationDuration,
|
|
115
|
-
// easing: Easing.quad,
|
|
116
|
-
// toValue: sliderMaxHeight - contentHeight!,
|
|
117
|
-
// useNativeDriver: false,
|
|
118
|
-
// }).start(() => {
|
|
119
|
-
// const isPanelOpenedNewValue = !isPanelOpened
|
|
120
|
-
// setIsPanelOpened(isPanelOpenedNewValue)
|
|
121
|
-
// if (isPanelOpenedNewValue) {
|
|
122
|
-
// // onOpen();
|
|
123
|
-
// } else {
|
|
124
|
-
// // onClose();
|
|
125
|
-
// Keyboard.dismiss();
|
|
126
|
-
// }
|
|
127
|
-
// });
|
|
121
|
+
contentHeight && setToContentHeight(contentHeight);
|
|
128
122
|
};
|
|
129
123
|
|
|
130
124
|
const _onBackPress = () => {
|
|
@@ -133,8 +127,7 @@ const BottomSheet = props => {
|
|
|
133
127
|
};
|
|
134
128
|
|
|
135
129
|
const _setSize = e => {
|
|
136
|
-
|
|
137
|
-
if (newContentHeight !== 0) newContentHeight += 42;
|
|
130
|
+
const newContentHeight = e.nativeEvent.layout.height;
|
|
138
131
|
setContentHeight(newContentHeight);
|
|
139
132
|
setToContentHeight(newContentHeight);
|
|
140
133
|
};
|
|
@@ -148,7 +141,9 @@ const BottomSheet = props => {
|
|
|
148
141
|
easing: Easing.quad,
|
|
149
142
|
toValue: sliderMaxHeight,
|
|
150
143
|
useNativeDriver: false
|
|
151
|
-
}).start(() => {
|
|
144
|
+
}).start(() => {
|
|
145
|
+
null;
|
|
146
|
+
});
|
|
152
147
|
fadeOut();
|
|
153
148
|
};
|
|
154
149
|
|
|
@@ -157,21 +152,11 @@ const BottomSheet = props => {
|
|
|
157
152
|
children
|
|
158
153
|
} = props;
|
|
159
154
|
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(TouchableOpacity, {
|
|
160
|
-
style:
|
|
161
|
-
position: 'absolute',
|
|
162
|
-
top: 0,
|
|
163
|
-
bottom: 0,
|
|
164
|
-
right: 0,
|
|
165
|
-
left: 0
|
|
166
|
-
},
|
|
155
|
+
style: styles.outsideContainer,
|
|
167
156
|
activeOpacity: 1,
|
|
168
157
|
onPress: _dismiss
|
|
169
158
|
}, /*#__PURE__*/React.createElement(Animated.View, {
|
|
170
|
-
style:
|
|
171
|
-
backgroundColor: 'black',
|
|
172
|
-
flex: 1,
|
|
173
|
-
opacity: fadeAnim
|
|
174
|
-
}
|
|
159
|
+
style: styles.animation
|
|
175
160
|
})), /*#__PURE__*/React.createElement(Animated.View, _extends({}, _parentPanResponder.panHandlers, {
|
|
176
161
|
style: { ...styles.container,
|
|
177
162
|
height: sliderMaxHeight,
|
|
@@ -182,15 +167,20 @@ const BottomSheet = props => {
|
|
|
182
167
|
}), /*#__PURE__*/React.createElement(View, {
|
|
183
168
|
style: styles.outerContent
|
|
184
169
|
}, /*#__PURE__*/React.createElement(TouchableOpacity, {
|
|
185
|
-
activeOpacity: 1
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
}, /*#__PURE__*/React.createElement(
|
|
189
|
-
|
|
190
|
-
}))
|
|
191
|
-
onLayout: _setSize
|
|
192
|
-
|
|
193
|
-
|
|
170
|
+
activeOpacity: 1,
|
|
171
|
+
style: styles.closeButton,
|
|
172
|
+
onPress: _dismiss
|
|
173
|
+
}, /*#__PURE__*/React.createElement(Image, {
|
|
174
|
+
source: CloseIcon
|
|
175
|
+
})), /*#__PURE__*/React.createElement(View, {
|
|
176
|
+
onLayout: _setSize
|
|
177
|
+
}, /*#__PURE__*/React.createElement(KeyboardAvoidingView, {
|
|
178
|
+
behavior: "padding",
|
|
179
|
+
style: {
|
|
180
|
+
height: props.height
|
|
181
|
+
},
|
|
182
|
+
keyboardVerticalOffset: props.height * (1 - BOTTOM_SHEET_MAX_PRECANTAGE_SIZE)
|
|
183
|
+
}, children)))));
|
|
194
184
|
};
|
|
195
185
|
|
|
196
186
|
BottomSheet.propTypes = {
|
|
@@ -206,47 +196,11 @@ BottomSheet.propTypes = {
|
|
|
206
196
|
BottomSheet.defaultProps = {
|
|
207
197
|
children: /*#__PURE__*/React.createElement(View, null),
|
|
208
198
|
isOpen: true,
|
|
209
|
-
sliderMaxHeight: Dimensions.get('window').height *
|
|
199
|
+
sliderMaxHeight: Dimensions.get('window').height * BOTTOM_SHEET_MAX_PRECANTAGE_SIZE,
|
|
210
200
|
animationDuration: 200,
|
|
211
201
|
onOpen: () => null,
|
|
212
202
|
onClose: () => null,
|
|
213
203
|
expandToMaxHeightEnabled: false
|
|
214
204
|
};
|
|
215
|
-
const styles = StyleSheet.create({
|
|
216
|
-
container: {
|
|
217
|
-
flex: 1,
|
|
218
|
-
marginTop: 60,
|
|
219
|
-
paddingHorizontal: 12,
|
|
220
|
-
shadowColor: '#000000',
|
|
221
|
-
shadowOffset: {
|
|
222
|
-
width: 0,
|
|
223
|
-
height: 6
|
|
224
|
-
},
|
|
225
|
-
shadowOpacity: 0.37,
|
|
226
|
-
shadowRadius: 7.49,
|
|
227
|
-
elevation: 12,
|
|
228
|
-
borderTopLeftRadius: 15,
|
|
229
|
-
borderTopRightRadius: 15,
|
|
230
|
-
backgroundColor: '#ffffff'
|
|
231
|
-
},
|
|
232
|
-
lineContainer: {
|
|
233
|
-
borderTopLeftRadius: 30,
|
|
234
|
-
borderTopRightRadius: 30,
|
|
235
|
-
alignItems: 'center'
|
|
236
|
-
},
|
|
237
|
-
line: {
|
|
238
|
-
width: 35,
|
|
239
|
-
height: 4,
|
|
240
|
-
borderRadius: 2,
|
|
241
|
-
marginTop: 18,
|
|
242
|
-
backgroundColor: '#D5DDE0'
|
|
243
|
-
},
|
|
244
|
-
outerContent: {
|
|
245
|
-
flex: -1
|
|
246
|
-
},
|
|
247
|
-
innerContent: {
|
|
248
|
-
flex: -1
|
|
249
|
-
}
|
|
250
|
-
});
|
|
251
205
|
export default BottomSheet;
|
|
252
206
|
//# sourceMappingURL=BottomSheet.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["React","useEffect","useRef","useState","Animated","BackHandler","Dimensions","Easing","Image","KeyboardAvoidingView","PanResponder","TouchableOpacity","View","PropTypes","CloseIcon","BOTTOM_SHEET_MAX_PRECANTAGE_SIZE","getStylesObject","BottomSheet","props","panelHeightValue","Value","sliderMaxHeight","current","fadeAnim","styles","isPanelOpened","setIsPanelOpened","isOpen","contentHeight","setContentHeight","undefined","currentHeight","setCurrentHeight","dy","setDy","_parentPanResponder","create","onMoveShouldSetPanResponderCapture","_","gestureState","shouldEnableBottomSheetScroll","Math","abs","onPanResponderMove","handleWebViewScroll","expandToMaxHeightEnabled","setValue","onPanResponderRelease","collapse","setToContentHeight","expand","fadeIn","_dismiss","addEventListener","_onBackPress","id","addListener","e","value","removeEventListener","removeListener","timing","toValue","duration","useNativeDriver","start","fadeOut","onClose","animationDuration","easing","quad","_setSize","newContentHeight","nativeEvent","layout","height","children","outsideContainer","animation","panHandlers","container","transform","translateY","outerContent","closeButton","propTypes","oneOfType","node","bool","number","func","onOpen","defaultProps","get"],"sources":["BottomSheet.tsx"],"sourcesContent":["import React, { ReactNode, useEffect, useRef, useState } from 'react';\nimport {\n Animated,\n BackHandler,\n Dimensions,\n Easing,\n Image,\n KeyboardAvoidingView,\n LayoutChangeEvent,\n PanResponder,\n TouchableOpacity,\n View,\n} from 'react-native';\nimport PropTypes from 'prop-types';\nimport { CloseIcon } from '../../assets/images';\nimport { BOTTOM_SHEET_MAX_PRECANTAGE_SIZE } from '../../components/UNBottomSheetComponent/UNBottomSheetComponent.constants';\nimport { getStylesObject } from './BottomSheet.styles';\n\nexport interface BottomSheetProps {\n isOpen: boolean\n children: ReactNode\n sliderMaxHeight: number\n onOpen: () => void\n onClose: () => void\n height: number,\n animationDuration: number,\n expandToMaxHeightEnabled: boolean\n handleWebViewScroll: () => void\n shouldEnableBottomSheetScroll: boolean\n}\n\nconst BottomSheet = (props: BottomSheetProps) => {\n const panelHeightValue = useRef(new Animated.Value(props.sliderMaxHeight)).current;\n const fadeAnim = useRef(new Animated.Value(0)).current;\n const styles = getStylesObject(fadeAnim);\n const [isPanelOpened, setIsPanelOpened] = useState(props.isOpen);\n const [contentHeight, setContentHeight] = useState<number | undefined>(undefined);\n\n const [currentHeight, setCurrentHeight] = useState<number>(props.sliderMaxHeight);\n\n const [dy, setDy] = useState(0);\n\n const _parentPanResponder = PanResponder.create({\n onMoveShouldSetPanResponderCapture: (_, gestureState) => {\n return props.shouldEnableBottomSheetScroll && Math.abs(gestureState.dy) > 10;\n },\n onPanResponderMove(_, gestureState) {\n if (props.shouldEnableBottomSheetScroll && gestureState.dy < 5) {\n props.handleWebViewScroll();\n }\n if (currentHeight + gestureState.dy < 0) return;\n if (!props.expandToMaxHeightEnabled && contentHeight && currentHeight + gestureState.dy < sliderMaxHeight - contentHeight) return;\n panelHeightValue.setValue(currentHeight + gestureState.dy);\n setDy(gestureState.dy);\n },\n onPanResponderRelease: () => {\n if (dy > 0) {\n collapse();\n } else if (!props.expandToMaxHeightEnabled) {\n contentHeight && setToContentHeight(contentHeight);\n } else if (dy < 0) {\n expand();\n } else {\n expand();\n }\n }\n });\n\n useEffect(() => {\n if (props.isOpen && !isPanelOpened) {\n fadeIn();\n } else if (isPanelOpened) {\n setContentHeight(0);\n _dismiss();\n }\n }, [props.isOpen]);\n\n useEffect(() => {\n BackHandler.addEventListener('hardwareBackPress', _onBackPress);\n const id = panelHeightValue.addListener(e => setCurrentHeight(e.value));\n\n return (() => {\n BackHandler.removeEventListener('hardwareBackPress', _onBackPress);\n panelHeightValue.removeListener(id);\n });\n }, []);\n\n const fadeIn = () => {\n Animated.timing(fadeAnim, {\n toValue: 0.3,\n duration: 500,\n useNativeDriver: false\n }).start(() => { setIsPanelOpened(true); });\n };\n\n const fadeOut = () => {\n Animated.timing(fadeAnim, {\n toValue: 0,\n duration: 500,\n useNativeDriver: false\n }).start(() => {\n setIsPanelOpened(false);\n props.onClose();\n });\n };\n\n const setToContentHeight = (contentHeight: number) => {\n Animated.timing(panelHeightValue, {\n duration: props.animationDuration,\n easing: Easing.quad,\n toValue: sliderMaxHeight - contentHeight,\n useNativeDriver: false,\n }).start();\n };\n\n const expand = () => {\n const { animationDuration } = props;\n\n if (contentHeight && currentHeight > (sliderMaxHeight - contentHeight)) {\n setToContentHeight(contentHeight);\n return;\n }\n\n Animated.timing(panelHeightValue, {\n duration: animationDuration,\n easing: Easing.quad,\n toValue: 0,\n useNativeDriver: false,\n }).start();\n };\n\n const collapse = () => {\n if (contentHeight && currentHeight > (sliderMaxHeight - contentHeight)) {\n _dismiss();\n return;\n }\n\n contentHeight && setToContentHeight(contentHeight);\n };\n\n const _onBackPress = () => {\n isPanelOpened && collapse();\n return isPanelOpened;\n };\n\n const _setSize = (e: LayoutChangeEvent) => {\n const newContentHeight = e.nativeEvent.layout.height;\n\n setContentHeight(newContentHeight);\n setToContentHeight(newContentHeight);\n };\n\n const _dismiss = () => {\n const { animationDuration } = props;\n Animated.timing(panelHeightValue, {\n duration: animationDuration,\n easing: Easing.quad,\n toValue: sliderMaxHeight,\n useNativeDriver: false,\n }).start(() => {\n null;\n });\n fadeOut();\n };\n\n const {\n sliderMaxHeight,\n children,\n } = props;\n\n return (\n <>\n <TouchableOpacity\n style={styles.outsideContainer} activeOpacity={1}\n onPress={_dismiss}\n >\n <Animated.View\n style={styles.animation}\n >\n </Animated.View>\n </TouchableOpacity>\n <Animated.View\n {..._parentPanResponder.panHandlers}\n style={{\n ...styles.container,\n height: sliderMaxHeight,\n transform: [\n { translateY: panelHeightValue },\n ],\n }}\n >\n <View\n style={styles.outerContent}\n >\n <TouchableOpacity\n activeOpacity={1}\n style={styles.closeButton}\n onPress={_dismiss}\n >\n <Image source={CloseIcon} />\n </TouchableOpacity>\n\n <View\n onLayout={_setSize}\n >\n <KeyboardAvoidingView\n behavior=\"padding\"\n style={{ height: props.height }}\n keyboardVerticalOffset={props.height * (1 - BOTTOM_SHEET_MAX_PRECANTAGE_SIZE)}\n >\n {children}\n </KeyboardAvoidingView>\n </View>\n </View>\n </Animated.View>\n </>\n );\n};\n\nBottomSheet.propTypes = {\n children: PropTypes.oneOfType([PropTypes.node]),\n isOpen: PropTypes.bool,\n sliderMaxHeight: PropTypes.number,\n animation: PropTypes.func,\n animationDuration: PropTypes.number,\n onOpen: PropTypes.func,\n onClose: PropTypes.func,\n expandToMaxHeightEnabled: PropTypes.bool\n};\n\nBottomSheet.defaultProps = {\n children: <View />,\n isOpen: true,\n sliderMaxHeight: Dimensions.get('window').height * BOTTOM_SHEET_MAX_PRECANTAGE_SIZE,\n animationDuration: 200,\n onOpen: () => null,\n onClose: () => null,\n expandToMaxHeightEnabled: false\n};\n\nexport default BottomSheet;\n"],"mappings":"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"}
|