Embedded betslip

Guide: Embedded

Use the SDK betslip inside EmbetOverlay and settle each bet in onPlaceBet. Omit mode or set mode: 'INTERNAL' in configureBetSlip.

Replace YOUR_CLIENT_ID, YOUR_EVENT_ID, and wire onPlaceBet to your sportsbook API.

npm install @livelike/embet-rn react-native-webview

import { useRef } from 'react';
import { View, StyleSheet } from 'react-native';
import {
  EmbetOverlay,
  type EmbetBetPayload,
  type EmbetOverlayRef,
} from '@livelike/embet-rn';

const CLIENT_ID = 'YOUR_CLIENT_ID';
const EVENT_ID = 'YOUR_EVENT_ID';

export function EmbetSportsbookScreen() {
  const overlayRef = useRef<EmbetOverlayRef>(null);

  const onInitialized = () => {
    overlayRef.current?.configureBetSlip({
      currency: '€',
      currencyDisplay: 'prefix',
      decimalSign: ',',
      maxAmount: 1000,
    });
    overlayRef.current?.configureResize({
      enabled: true,
      hostElement: 'body',
    });
  };

  const onPlaceBet = async (payload: EmbetBetPayload) => {
    const accepted = await placeBetWithYourSportsbook(payload);
    return accepted ? { success: true } : { error: 'undefined' };
  };

  return (
    <View style={styles.container}>
      <EmbetOverlay
        ref={overlayRef}
        clientId={CLIENT_ID}
        customId={EVENT_ID}
        sdkVersion="1.4.0"
        onInitialized={onInitialized}
        onPlaceBet={onPlaceBet}
      />
    </View>
  );
}

async function placeBetWithYourSportsbook(payload: EmbetBetPayload) {
  console.log('place bet', payload);
  return true;
}

const styles = StyleSheet.create({ container: { flex: 1 } });