filepond-plugin-fetch-svg-preview v1.0.9

SVG Preview plugin for FilePond

This Fetch SVG Preview plugin will kick in automatically when the uploaded file has an SVG extension with incorrect Content-Type e.g. application/octet-stream which is common in S3 bucket.

Quick Start

Install using yarn or npm:

yarn add filepond-plugin-fetch-svg-preview

npm install filepond-plugin-fetch-svg-preview

Then import in your project:

import * as FilePond from 'filepond';
import FilePondPluginFetchSVGPreview from 'filepond-plugin-fetch-svg-preview';

Register the plugin:

FilePond.registerPlugin(FilePondPluginFetchSVGPreview);

Create a new FilePond instance as normal.

const pond = FilePond.create({
    name: 'filepond'
});

// Add it to the DOM
document.body.appendChild(pond.element);

The Fetch SVG preview will become active when loading an SVG file as describe above. It will remove all hyperlinks within the SVG documents itself for security reason.

Filepond options

Default styles

Be sure to include this lib's styles, by importing the minified css.

import 'filepond-plugin-fetch-svg-preview/dist/filepond-plugin-fetch-svg-preview.min.css';

Demo

Python 2.x

python -m SimpleHTTPServer 8000

Open localhost:8000 in your browser.