v2.0.0-rc.1

Hello, and welcome back after a short break.

As you may have heard, Google has announced that the Tenor API is shutting down on June 30, 2026, which puts this library in a tricky spot — until now, we've relied on Tenor exclusively. That means some radical changes are needed.

The headline feature: we've added support for multiple providers. Alongside Tenor, we now also support GIPHY and KLIPY. This makes the library far more resilient to API changes like this one, but it also introduces a number of breaking changes. As of now, the Tenor integration is still supported, but it will effectively stop working June 30, 2026.

Breaking changes

This update contains backwards-incompatible changes for most of the picker API.

Explicit provider selection

Instead of relying on the default Tenor integration, you now need to explicitly specify which provider you want to use. Any provider-specific props were moved to the provider function and removed from props. We currently offer three built-in providers:

• Tenor (stops working on June 30, 2026)
• Klipy
• Giphy

// 1.x
import GifPicker, { ContentFilter } from 'gif-picker-react';

<GifPicker
  tenorApiKey="YOUR_TENOR_KEY"
  contentFilter={ContentFilter.OFF}
  country="US"
  locale="en_US"
/>

// 2.0.0
import { GifPicker } from 'gif-picker-react';
import { Tenor, ContentFilter } from 'gif-picker-react/providers/tenor';

<GifPicker
  provider={Tenor('YOUR_TENOR_KEY', {
    contentFilter: ContentFilter.OFF,
    country: 'US',
    locale: 'en_US',
  })}
/>

Import and class name changes

We've cleaned up our imports structure and removed Tenor-specific names.

1. GifPicker is now a named export, rather than the default export.
2. TenorImage and TenorImagePreview were renamed to Gif and GifPreview.
3. Tenor-specific types are now exported under gif-picker-react/providers/tenor.

What	1.x	2.x
GifPicker	import GifPicker from 'gif-picker-react';	import { GifPicker } from 'gif-picker-react';
Common objects	import { TenorImage } from 'gif-picker-react';	import { Gif } from 'gif-picker-react';
Provider-specific types	import { ContentFilter } from 'gif-picker-react';	import { ContentFilter } from 'gif-picker-react/providers/tenor';

Result object (Gif) reshape

The object passed to onGifClick is now a provider-agnostic Gif rather than TenorImage.

1. gif.url is now gif.imageUrl
2. gif.preview.url is now gif.preview.imageUrl
3. Tenor-only fields (tenorUrl, shortTenorUrl, createdAt, tags) moved under gif.raw

For a full reference of the new objects, see the README.

Styling delivery changed

In 1.x the stylesheet was bundled into the JavaScript and injected as a <style> tag at runtime. In 2.x the styles ship as a separate style.css that the bundle pulls in via a side-effect import './style.css';. For most setups (Vite, webpack, Next.js, etc.) this is transparent — the import is included automatically and no action is needed.

If your bundler does not process CSS imports from node_modules, import the stylesheet manually:

import 'gif-picker-react/style.css';

What's Changed

• Update dependencies by @MrBartusek in #43
• Migrate from tsup to tsdown by @MrBartusek in #45
• Add multiple GIF providers support by @MrBartusek in #46
• Update docs for 2.0 by @MrBartusek in #49
• Migrate from npm to pnpm by @MrBartusek in #51
• Better support for custom providers by @MrBartusek in #52
• Migrate storybook to vite by @MrBartusek in #53
• Add provider for klipy.com by @MrBartusek in #54
• Additional provider features by @MrBartusek in #56
• Add Giphy provider by @MrBartusek in #57

Full Changelog: v1.5.0...v2.0.0-rc.1