react-tenor-gif-picker

react-tenor-gif-picker is a React component that allows you to easily add a Tenor GIF picker to your React app.

Live Demo

For live demo check here For example app check Code Sandbox

Install

npm install --save react-tenor-gif-picker

Usage

How to use TenorGifPicker

import React, { Component } from 'react'
import 'react-tenor-gif-picker/dist/index.css'
import TenorGifPicker from 'react-tenor-gif-picker'

const App = () => {
  const [active, setActive] = React.useState(false)
  const tenorApiKey = 'TENOR_API_KEY'
  const [Gifs, setGifs] = React.useState([])

  return (
    <div>
      <button
        onClick={() => {
          setActive(true)
        }}
      >
        Show Picker
      </button>
      <TenorGifPicker
        tenorAccessKey={tenorApiKey}
        active={active}
        setActive={setActive}
        initialSearchQuery='Funny'
        onGifSelect={(gifData) => {
          let list = gifData ?? []
          list.push(gifData)
          setGifs(list)
          setActive(false)
        }}
      />
    </div>
  )
}

Before you get started with react-tenor-picker get a free Tenor API key tenor.com

License

MIT © thealphamerc