Quick Implementation

Picker Component for React is a set of prebuilt UI components that allows you to easily craft an in-app chat with stickers you downloaded. You can implement Picker Component by using the following step. This component support both stickers you downloaded and Store Component open function.

Before you begin

Make sure you went through all processes in Before You Begin to sign up for stipop dashborad and get API Key, which is reuiqred to complete development of the SDK.

Using Picker Component

apikey : Stipop API key for your app.
userId : Unique value for every user to distinguish unique users. The userId can be a string of any format.

React

1
2
3
4
5
6
7
8
9
10
11
12
13
14
import { PickerComponent } from 'stipop-react-sdk'

const App = () => {
  return (
    <PickerComponent 
      params={{
        apikey: 'apikey',
        userId: 'userId',
      }}
    />
  )
}

export default App

Next.js

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
import dynamic from 'next/dynamic'

const PickerComponent = dynamic(
  () => import('stipop-react-sdk/dist/PickerComponent'),
  {
    ssr: false,
  })
  
const App = () => {
  return (
    <PickerComponent 
      params={{
        apikey: 'apikey',
        userId: 'userId',
      }}
    />
  )
}

export default App

Was this page helpful?

We’re here to help. Contact us.