@filix-dev-kit/vue-image-uploader

A production-ready Vue 3 image uploader built with Tailwind CSS. It supports automatic multi-file uploads, per-file and global progress, validation, retry/cancel/delete, RTL/Persian UI, responsive grids, direct order input, and precise pointer-based insertion between items.

Install

npm install @filix-dev-kit/vue-image-uploader

Vue 3 and Tailwind CSS are peer dependencies.

Quick start

<script setup lang="ts">
import {
  FilixImageUploader,
  createPhpAdapter
} from '@filix-dev-kit/vue-image-uploader';
import '@filix-dev-kit/vue-image-uploader/style.css';

const adapter = createPhpAdapter({ baseUrl: '/api' });
</script>

<template>
  <FilixImageUploader
    :adapter="adapter"
    auto-upload
    direction="rtl"
    locale="fa"
    :columns="6"
  />
</template>

The default stylesheet is already compiled. Developers who want Tailwind source mode can import @filix-dev-kit/vue-image-uploader/tailwind.css after their Tailwind import.

Backend agnostic

Use createPhpAdapter() for the bundled PHP example, createHttpAdapter() for conventional JSON APIs, or provide your own object implementing FilixUploadAdapter.

Documentation

• Persian usage guide
• API reference
• PHP backend
• Customization
• Troubleshooting
• Publishing guide (Persian)

License

MIT