Skip to main content


The @uppy/informer plugin is a pop-up bar for showing notifications for the Dashboard. When plugins have some exciting news (or errors) to share, they can with Informer

When should I use it?

When you use the Dashboard it’s already included by default. This plugin is published separately but made specifically for the Dashboard. You can technically use it without it, but it’s not officially supported.


npm install @uppy/informer


import Uppy from '@uppy/core';
import Informer from '@uppy/informer';

// The `@uppy/informer` plugin includes some basic styles.
// You can also choose not to use it and provide your own styles instead.
import '@uppy/core/dist/style.min.css';
import '@uppy/informer/dist/style.min.css';

new Uppy().use(Informer, { target: '#informer' });

Informer gets its data from, which is updated by various plugins via method.

In the compressor plugin we use it like this for instance:

const size = prettierBytes(totalCompressedSize);'compressedX', { size }), 'info');

When calling, Uppy emits info-visible and will emit info-hidden after the timeout.




A unique identifier for this plugin (string, default: 'Informer').

Use this if you need several Informer instances.


DOM element, CSS selector, or plugin to mount the Informer into (string or Element, default: null).