PHPackages digit7s/inertia-table - PHPackages - PHPackages [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register) 1. [Directory](/) 2. / 3. [Utility & Helpers](/categories/utility) 4. / 5. digit7s/inertia-table ActiveLibrary[Utility & Helpers](/categories/utility) digit7s/inertia-table ===================== A backend-driven Inertia Datatable for Laravel and Vue 3 v1.1.0(3w ago)0108MITVuePHP ^8.2 Since May 2Pushed 3w agoCompare [ Source](https://github.com/Digit7s/inertia-table)[ Packagist](https://packagist.org/packages/digit7s/inertia-table)[ Docs](https://github.com/Digit7s/inertia-table)[ RSS](/packages/digit7s-inertia-table/feed)WikiDiscussions main Synced 1w ago READMEChangelogDependencies (16)Versions (3)Used By (0) Inertia Table ============= [](#inertia-table) [![Latest Version on Packagist](https://camo.githubusercontent.com/d883440cb33216d849234209ceaa62d0c797da226dd62dff254661b786c48057/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f762f646967697437732f696e65727469612d7461626c652e7376673f7374796c653d666c61742d737175617265)](https://packagist.org/packages/digit7s/inertia-table)[![Total Downloads](https://camo.githubusercontent.com/c1082f71a0953e0dd3522b6c2bcc20dda66b8eb6fa53c22b4c203b53dcfa720b/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f64742f646967697437732f696e65727469612d7461626c652e7376673f7374796c653d666c61742d737175617265)](https://packagist.org/packages/digit7s/inertia-table)[![PHP Version Compliance](https://camo.githubusercontent.com/efacf6c3872bdddcf5e66a859ed3da897672f639af9694d0dd8cc3b77576338b/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f7068702d762f646967697437732f696e65727469612d7461626c652e7376673f7374796c653d666c61742d737175617265)](https://packagist.org/packages/digit7s/inertia-table)[![License](https://camo.githubusercontent.com/7fe88931db8aedf2506c0548ee45e30b386bdc1af18df665aa32f627b0546bcb/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f6c2f646967697437732f696e65727469612d7461626c652e7376673f7374796c653d666c61742d737175617265)](LICENSE.md) A backend-driven datatable package for **Laravel**, **Inertia.js**, and **Vue 3**. Define your table structure, query, searching, sorting, filtering, row actions, bulk actions, and grouping in PHP, then render the result with published Vue 3 components in your Laravel/Inertia application. --- โœจ Features ---------- [](#-features) - ๐Ÿš€ **Backend-driven tables**: Manage columns, sorting, searching, filtering, actions, and pagination from PHP. - ๐Ÿ” **Global search**: Search across multiple columns, including relationship fields. - ๐ŸŽ›๏ธ **Dynamic filters**: Supports `text`, `select`, and `boolean` filters. - ๐Ÿ”ƒ **Smart sorting**: Built-in column-based sorting with direction handling. - ๐Ÿ“„ **Pagination**: Integrates with Laravel's native paginator. - ๐ŸŽจ **Modern Vue UI**: Published Vue 3 components built for Tailwind CSS and shadcn-vue. - ๐Ÿงฉ **Custom cell rendering**: Override cell rendering using Vue slots. - ๐Ÿ“ฆ **Bulk actions**: Built-in multi-row actions with confirmation support. - ๐Ÿ“ **Grouping**: Organize rows into expandable groups by column. - ๐Ÿงฑ **Publishable frontend components**: Publish and customize the Vue table components inside your own app. --- โœ… Version Support ----------------- [](#-version-support) Package VersionPHPLaravelInertia LaravelVue.jsTailwind CSSshadcn-vueStatus`1.x``^8.2``10.x`, `11.x`, `12.x`, `13.x``^1.0`, `^2.0`, `^3.0``3.x``3.x`, `4.x`CompatibleActiveVersion support is based on the Composer constraints and tested compatibility for each package release. --- ๐Ÿ›  Requirements -------------- [](#-requirements) Please refer to the [Version Support](#-version-support) table for PHP, Laravel, Inertia Laravel, and Vue.js compatibility. This package has two parts: 1. A Laravel/PHP backend table builder. 2. Publishable Vue 3 frontend components for your Laravel/Inertia app. ### Backend Requirements [](#backend-requirements) - PHP `8.2+` - Laravel `10.x`, `11.x`, or `12.x` - Inertia Laravel `1.x` or `2.x` ### Frontend Requirements [](#frontend-requirements) The published Vue components expect your Laravel/Inertia app to already have the following frontend stack installed and configured: - Vue 3 - `@inertiajs/vue3` - Tailwind CSS - shadcn-vue - `lucide-vue-next` ### Required shadcn-vue Components [](#required-shadcn-vue-components) The published components import shadcn-vue components from your app's `@/components/ui` directory. Make sure these components exist in your consuming Laravel app: - `badge` - `button` - `checkbox` - `dialog` - `dropdown-menu` - `input` - `select` - `table` Depending on the features you use, additional shadcn-vue components may be required in future versions. > **Note:** shadcn-vue components are generated into your application. They are not normal npm package imports. This package expects those components to exist in the consuming Laravel app after publishing the table components. --- ๐Ÿš€ Installation -------------- [](#-installation) Install the package via Composer: ``` composer require digit7s/inertia-table ``` ### Publish Vue Components [](#publish-vue-components) Since the table UI is built with Vue 3 and Tailwind CSS, publish the components into your Laravel app: ``` php artisan vendor:publish --tag="inertia-table-components" ``` This will publish the components to: ``` resources/js/components/inertia-table/ ``` After publishing, you may customize the Vue components to match your application's design system. --- ๐Ÿ“– Basic Usage ------------- [](#-basic-usage) ### 1. Generate a Table Class [](#1-generate-a-table-class) Use the Artisan command to create a new table class: ``` php artisan make:inertia-table UsersTable User ``` This will create: ``` app/Tables/UsersTable.php ``` --- ### 2. Configure the Table [](#2-configure-the-table) Define your query and columns in the generated table class: ``` namespace App\Tables; use App\Models\User; use Digit7s\InertiaTable\Column; use Digit7s\InertiaTable\Columns\DateColumn; use Digit7s\InertiaTable\Columns\TextColumn; use Digit7s\InertiaTable\InertiaTable; use Illuminate\Database\Eloquent\Builder; class UsersTable extends InertiaTable { protected ?string $model = User::class; public function query(): Builder { return User::query(); } public function columns(): array { return [ Column::make('id', 'ID')->sortable(), TextColumn::make('name')->searchable()->sortable(), TextColumn::make('email')->searchable(), TextColumn::make('roles.name', 'Role')->searchable(), DateColumn::make('created_at', 'Joined')->sortable(), ]; } } ``` --- ### 3. Return the Table from a Controller [](#3-return-the-table-from-a-controller) ``` use App\Tables\UsersTable; use Inertia\Inertia; public function index() { return Inertia::render('Users/Index', [ 'users' => (new UsersTable())->toInertia(), ]); } ``` --- ### 4. Render the Table in Vue [](#4-render-the-table-in-vue) ``` import InertiaTable from '@/components/inertia-table/InertiaTable.vue'; defineProps(); ``` > If your component currently expects `tableData` instead of `table-data`, both are the same Vue prop in templates because Vue supports kebab-case usage for camelCase props. --- ๐Ÿ’Ž Advanced Features ------------------- [](#-advanced-features) ### Column Types [](#column-types) The package provides specialized column types for common table data: - **`TextColumn`**: Default text representation. - **`NumericColumn`**: Right-aligned number/currency display. - **`BadgeColumn`**: Displays values as badges. - **`BooleanColumn`**: Displays boolean values with visual indicators. - **`DateColumn` / `DateTimeColumn`**: Formats date and datetime values. - **`ImageColumn`**: Displays image/avatar-style values. - **`TagsColumn`**: Displays arrays as badge groups. Example: ``` use Digit7s\InertiaTable\Columns\TagsColumn; TagsColumn::make('tags') ->labelKey('name') ->badgeClass('bg-blue-500 text-white'); ``` --- ๐Ÿ”— Row Actions & Links ------------------------- [](#-row-actions--links) ### Clickable Rows [](#clickable-rows) Make the entire row clickable: ``` public function query(): Builder { $this->rowLink(fn (User $user) => route('users.show', $user->id)); return User::query(); } ``` ### Row Actions Dropdown [](#row-actions-dropdown) Add row-level actions to your table: ``` use Digit7s\InertiaTable\Action; use Digit7s\InertiaTable\Columns\ActionColumn; public function columns(): array { return [ TextColumn::make('name'), ActionColumn::new(), ]; } public function actions(): array { return [ Action::make('edit', 'Edit') ->icon('Pencil') ->url(fn (User $user) => route('users.edit', $user->id)), Action::make('delete', 'Delete') ->icon('Trash') ->method('delete') ->requiresConfirmation() ->url(fn (User $user) => route('users.destroy', $user->id)), ]; } ``` --- ๐Ÿ“ฆ Bulk Actions -------------- [](#-bulk-actions) Enable multi-row operations with a floating bulk action bar: ``` use Digit7s\InertiaTable\BulkAction; public function bulkActions(): array { return [ BulkAction::make('delete', 'Delete Selected') ->icon('Trash') ->requiresConfirmation() ->action(function (array $ids) { User::whereIn('id', $ids)->delete(); }), ]; } ``` CSV Export ---------- [](#csv-export) CSV export is disabled by default. Enable it in your table class: ``` use Digit7s\InertiaTable\Exports\CsvExport; public function exports(): array { return [ CsvExport::make('products.csv') ->label('Export CSV') ->onlyVisibleColumns() ->withCurrentFilters() ->withCurrentSort(), ]; } ``` The package uses Laravel `streamDownload()` and PHP `fputcsv()`. No external export dependency is required. ๐Ÿ“ Grouping ---------- [](#-grouping) Organize records into expandable groups: ``` Column::make('status')->groupable(); ``` You may also define a default group: ``` protected ?string $defaultGroup = 'status'; ``` --- ๐ŸŽจ Customizing Cells ------------------- [](#-customizing-cells) You can override any cell's rendering using Vue slots. ``` {{ item.name }} {{ item.email }} Edit ``` Slot names follow this format: ``` cell-{column-key} ``` For example: Column KeySlot Name`name``cell-name``email``cell-email``status``cell-status``actions``cell-actions`--- ๐Ÿงฉ Frontend Customization ------------------------ [](#-frontend-customization) After publishing the components, you can customize them directly in your app: ``` resources/js/components/inertia-table/ ``` Common customization points: - Table layout - Cell styling - Empty state - Pagination UI - Filter UI - Row action dropdown - Bulk action bar - Confirmation dialog - Column visibility menu - Responsive behavior Because the components are published into your application, you are free to adapt them to your design system. --- ๐Ÿ“š Documentation --------------- [](#-documentation) For detailed information on each feature, see the documentation inside the `docs/` folder: - [Documentation Index](docs/index.md) - [Changelog](CHANGELOG.md) - [Installation](docs/installation.md) - [Usage](docs/usage.md) - [CSV Export](docs/export.md) - [Accessibility](docs/accessibility.md) - [Example App](docs/example.md) - [Troubleshooting](docs/troubleshooting.md) --- ๐Ÿงช Testing --------- [](#-testing) If you are contributing to the package, run the test suite: ``` composer test ``` If no test script is configured, run Pest directly: ``` vendor/bin/pest ``` You may also run Laravel Pint if it is installed: ``` vendor/bin/pint ``` --- ๐Ÿงญ Roadmap --------- [](#-roadmap) See the [Roadmap](docs/roadmap.md) for planned and potential future improvements. --- ๐Ÿค Contributing -------------- [](#-contributing) Contributions are welcome. Before submitting a pull request: 1. Keep changes focused. 2. Follow the existing code style. 3. Add or update tests when possible. 4. Update documentation when behavior changes. 5. Confirm the package still works in a Laravel/Inertia/Vue app. --- ๐Ÿ”’ Security ---------- [](#-security) If you discover a security vulnerability, please report it privately instead of opening a public issue. --- ๐Ÿ“„ License --------- [](#-license) The MIT License (MIT). Please see [License File](LICENSE.md) for more information. ### Health Score 43 โ€” FairBetter than 89% of packages Maintenance94 Actively maintained with recent releases Popularity14 Limited adoption so far Community6 Small or concentrated contributor base Maturity47 Maturing project, gaining track record Bus Factor1 Top contributor holds 100% of commits โ€” single point of failure How is this calculated?**Maintenance (25%)** โ€” Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window. **Popularity (30%)** โ€” Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores. **Community (15%)** โ€” Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement. **Maturity (30%)** โ€” Project age, version count, PHP version support, and release stability. ### Release Activity Cadence Every ~57 days Total 2 Last Release 26d ago ### Community Maintainers ![](https://avatars.githubusercontent.com/u/235431018?v=4)[Myo Min Oo](/maintainers/myominoo-digit7s)[@myominoo-digit7s](https://github.com/myominoo-digit7s) --- Top Contributors [![myominoo-digit7s](https://avatars.githubusercontent.com/u/235431018?v=4)](https://github.com/myominoo-digit7s "myominoo-digit7s (6 commits)") --- Tags laravelinertiatable ### Code Quality TestsPest Code StyleLaravel Pint ### Embed Badge ![Health badge](/badges/digit7s-inertia-table/health.svg) ``` [![Health](https://phpackages.com/badges/digit7s-inertia-table/health.svg)](https://phpackages.com/packages/digit7s-inertia-table) ``` ### Alternatives [psalm/plugin-laravel Psalm plugin for Laravel 3345.3M347](/packages/psalm-plugin-laravel)[laravel/ai The official AI SDK for Laravel. 1.0k3.2M246](/packages/laravel-ai)[erag/laravel-lang-sync-inertia A powerful Laravel package for syncing and managing language translations across backend and Inertia.js (Vue/React/Svelte) frontends, offering effortless localization, auto-sync features, and smooth multi-language support for modern Laravel applications. 4925.3k](/packages/erag-laravel-lang-sync-inertia)[emargareten/inertia-modal Inertia Modal is a Laravel package that lets you implement backend-driven modal dialogs for Inertia apps. 90142.9k](/packages/emargareten-inertia-modal)[aedart/athenaeum Athenaeum is a mono repository; a collection of various PHP packages 255.2k](/packages/aedart-athenaeum)[tomshaw/electricgrid A feature-rich Livewire package designed for projects that require dynamic, interactive data tables. 119.4k](/packages/tomshaw-electricgrid) PHPackages ยฉ 2026 [Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)