### Giphy Plugin

The Giphy plugin allows users to search for and embed GIFs from the [Giphy](https://giphy.com) library.

#### Editor

```tsx widget
import { pluginGiphy, RicosEditor } from '@wix/ricos';
import React from 'react';

export default () => {
  return (
    // @essential-start
    <RicosEditor placeholder={'Add A GIF to get the party started!'} plugins={[pluginGiphy()]} />
    // @essential-end
  );
};
```

##### <span style="font-weight: 700;" class="rounded-lg border-[1px] border-blue-300 font-mono border-none bg-blue-100 px-2 py-1 leading-[18px] tracking-[0.0175em] font-bold text-slate-900">GiphyPluginEditorConfig</span>

Configuration for the Giphy editor plugin. Pass to `pluginGiphy()`.

<code class="font-mono text-sm"><span class="text-blue-700">interface</span> GiphyPluginEditorConfig</code>

<dl class="pl-4 border-l-2 border-slate-200">
<dt><code><strong>getGiphyUrl</strong><span class="text-slate-400">?</span>: (path: 'search' | 'trending') =&gt; string | undefined</code></dt>
<dd><p>Override the Giphy proxy URL. Called with `'search'` or `'trending'` to get the endpoint URL for the corresponding Giphy API operation. Return `undefined` to fall back to the default proxy.</p></dd>
</dl>

#### Viewer

```tsx widget
import '@wix/ricos/css/plugin-giphy-viewer.global.css';
import '@wix/ricos/css/ricos-viewer.global.css';
import type { RichContent } from '@wix/ricos';
import { pluginGiphyViewer, RicosViewer } from '@wix/ricos';
import React from 'react';

export default () => {
  // @essential-start
  return <RicosViewer content={content} plugins={[pluginGiphyViewer()]} />;
  // @essential-end
};

const content = {
  nodes: [
    {
      type: 'GIF',
      id: 'a00xy33',
      gifData: {
        containerData: {
          width: {
            size: 'CONTENT',
          },
          alignment: 'CENTER',
          textWrap: true,
        },
        original: {
          gif: 'https://media3.giphy.com/media/v1.Y2lkPTc5MGI3NjExYng4MjIyeXliYWozODB3NmxncDhwcXMwNjcxZ2dkZHJ5ZjBnc2dpZCZlcD12MV9pbnRlcm5hbF9naWZfYnlfaWQmY3Q9Zw/kYNVwkyB3jkauFJrZA/giphy.webp',
        },
        height: 480,
        width: 480,
      },
    },
  ],
} as RichContent;
```

##### <span style="font-weight: 700;" class="rounded-lg border-[1px] border-blue-300 font-mono border-none bg-blue-100 px-2 py-1 leading-[18px] tracking-[0.0175em] font-bold text-slate-900">GiphyPluginViewerConfig</span>

Configuration for the Giphy viewer plugin. Currently has no options — pass none.

<code class="font-mono text-sm"><span class="text-blue-700">interface</span> GiphyPluginViewerConfig</code>

<dl class="pl-4 border-l-2 border-slate-200">

</dl>
