Skip to Content
EmbeddingReact Native

React Native embedding

Beta

Komo cards can be embedded into your React Native application through Komo’s NPM package.

Installation

npm install @komo-tech/react-native-widgets

NOTE: This package has a peer dependency on react-native-webview, and recommends the latest major version, 11.x.

Usage

From the Komo portal, navigate to the settings of the card to be embedded. Select the Embed tab and copy the Native embed URL in the right sidebar. Pass as a prop to the KomoCardWidget, along with any optional styling or render props detailed below.

import { KomoCardWidget } from '@komo-tech/react-native-widgets'; // ... <KomoCardWidget embedUrl={KomoCardNativeEmbedUrl} />;

Props


NameTypeDescriptionOptional
embedUrl
String
The native embed url taken from the Komo portal settings of the card to be embedded
False
appId
String
Useful for the embedded Komo content to identify where it's being embedded
True
containerStyle
StyleProp<ViewStyle>
Style overrides for the container of the card cover (including both image and CTA button)
True
coverImageStyle
StyleProp<ImageStyle>
Style overrides for the image of the card cover
True
buttonStyle
StyleProp<ViewStyle>
Style overrides for the CTA button of the card cover
True
buttonTextStyle
StyleProp<TextStyle>
Style overrides for the CTA button text of the card cover
True
coverLoader
ReactNode
The loader shown while the cover is loading (defaults to a skeleton card loader)
True
hideCoverButton
Boolean
Hide the CTA button of the cover
True
modalHeader
ReactNode
The header of the modal to render instead of the default
True
onError
(error) => void
Callback on error
True
onModalClose
() => void
Callback on modal close
True
onModalOpen
() => void
Callback on modal open
True
shareClickUrl
String
Override of the url that redirects a user when clicking on a share link
True