PHPackages                             zndron/nova-tabs - 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. zndron/nova-tabs

ActiveLibrary

zndron/nova-tabs
================

Laravel Nova - Tabs.

0.0.9(3y ago)010MITPHPPHP ^8.0

Since Mar 8Pushed 3y ago1 watchersCompare

[ Source](https://github.com/zndron/nova-tabs)[ Packagist](https://packagist.org/packages/zndron/nova-tabs)[ RSS](/packages/zndron-nova-tabs/feed)WikiDiscussions master Synced 1mo ago

READMEChangelog (1)Dependencies (5)Versions (10)Used By (0)

Requirements
------------

[](#requirements)

- `php: ^7.4 | ^8`
- `laravel/nova: ^4`

Installation
------------

[](#installation)

You can install the package in to a Laravel app that uses [Nova](https://nova.laravel.com) via composer:

```
composer require zndron/nova-tabs
```

Usage
-----

[](#usage)

### Tabs Panel

[](#tabs-panel)

You can group fields of a resource into tabs.

```
// in app/Nova/Resource.php

use Zndron\Tabs\Traits\HasTabs;
use Zndron\Tabs\Tabs;
use Zndron\Tabs\Tab;

class User extends Resource
{
    use HasTabs;

    public function fields(Request $request)
    {
       return [
         Tabs::make('Some Title', [
            Tab::make('Balance', [
                Number::make('Balance', 'balance'),
                Number::make('Total', 'total'),
            ]),
            Tab::make('Other Info', [
                Number::make('Paid To Date', 'paid_to_date')
            ]),
         ]),
      ];
    }
 }
```

The first tab in every `Tabs` instance will be auto-selected.

### Relationship Tabs

[](#relationship-tabs)

These are a bit outdated, as the search and create buttons now show within the panel down where the actual content is displayed, not in the tab panel.

```
// in app/Nova/Resource.php

use Zndron\Tabs\Tabs;
use Laravel\Nova\Fields\HasMany;
use Zndron\Tabs\Traits\HasTabs;

class User extends Resource
{
    use HasTabs;

    public function fields(Request $request)
    {
        return [
           Tabs::make('Relations', [
                HasMany::make('Invoices'),
                HasMany::make('Notes'),
                HasMany::make('Contacts')
            ]),

        ];
    }
}
```

### Combine Fields and Relations in Tabs

[](#combine-fields-and-relations-in-tabs)

```
use Zndron\Tabs\Tabs;
use Laravel\Nova\Fields\HasMany;
use Zndron\Tabs\Traits\HasTabs;

use Laravel\Nova\Fields\ID;
use Laravel\Nova\Fields\Text;

class User extends Resource
{
    use HasTabs;

    public function fields(Request $request)
    {
          return [
              Tabs::make(__('Client Custom Details'), [
                  new Panel(__('Details'), [
                          ID::make('Id', 'id')->rules('required')->hideFromIndex(),
                          Text::make('Name', 'name'),
                  ]),
                  HasMany::make('Invoices')
              ]),
         ];
    }
}
```

### Actions in Tabs

[](#actions-in-tabs)

If your Model uses the `Laravel\Nova\Actions\Actionable` Trait you can put the Actions into a Tab like this:

```
// in app/Nova/Resource.php

use Zndron\Tabs\Tabs;
use Zndron\Tabs\Tab;
use Zndron\Tabs\Traits\HasTabs;
use Zndron\Tabs\Traits\HasActionsInTabs; // Add this Trait
use Laravel\Nova\Actions\ActionResource; // Import the Resource

class Client extends Resource
{
    use HasTabs;
    use HasActionsInTabs; // Use this Trait

    public function fields(Request $request)
    {
        return [
            Tabs::make('Client Custom Details', [
                Tab::make('Address', [
                    ID::make('Id', 'id'),
                    Text::make('Name', 'name')->hideFromDetail(),
                ]),
                Tab::make('Invoices', [
                    HasMany::make('Invoices'),
                ]),
                Tab::make('Actions', [
                    $this->actionfield(), // Add Actions whererver you like.
                ]),
            ]),
        ];
    }
}
```

### Tabs on Edit View

[](#tabs-on-edit-view)

Tabs are always shown on edit view as of Nova 4 for now.

Tab object
----------

[](#tab-object)

As of v1.4.0 it's possible to use a `Tab` class instead of an array to represent your tabs.

PropertyTypeDefaultDescriptionname`string``null`The name of the tab, used for the slug. Defaults to the title if not setshowIf`bool` or `Closure``null`If the result is truthy the tab will be shown. `showIf` takes priority over `showUnless` and if neither are set, `true` is assumed.showUnless`bool` or `Closure``null`If the result is falsy the tab will be shown. `showIf` takes priority over `showUnless` and if neither are set, `true` is assumed.bodyClass`string` or `array`Empty arrayA string or string array of classes to add to the tab's body. This sets the `bodyClass` property, if you want to append you can use `addBodyClass` instead.Customization
-------------

[](#customization)

### Display more than 5 items

[](#display-more-than-5-items)

By default, any `HasMany`, `BelongsToMany` and `MorphMany` fields show 5 items in their index. You can use Nova's built-in static property `$perPageViaRelationship` on the respective resource to show more (or less).

### Tab change Global Event

[](#tab-change-global-event)

Nova Tabs emits an event upon tabs loading and the user clicking on a tab, using [Nova Event Bus](https://nova.laravel.com/docs/4.0/customization/frontend.html#event-bus). Developers can listen to the event called `nova-tabs-changed`, with 2 parameters as payload: The tab panel name and the tab name itself.

Example of a component that subscribes to this event:

```
export default {
    mounted () {
        Nova.$on('nova-tabs-changed', (panel, tab) => {
            if (panel === 'Client Details' && tab === 'address') {
                this.$nextTick(() => this.map.updateSize())
            }
        })
    }
}
```

###  Health Score

21

—

LowBetter than 18% of packages

Maintenance20

Infrequent updates — may be unmaintained

Popularity5

Limited adoption so far

Community7

Small or concentrated contributor base

Maturity46

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 ~0 days

Total

9

Last Release

1165d ago

PHP version history (2 changes)0.0.1PHP ^7.4|^8

0.0.2PHP ^8.0

### Community

Maintainers

![](https://www.gravatar.com/avatar/612bf7e4be05ac72d4a5d135d10b5db9df23631877c327a619337a4520ee2a8d?d=identicon)[zndron](/maintainers/zndron)

---

Top Contributors

[![zndron](https://avatars.githubusercontent.com/u/2919737?v=4)](https://github.com/zndron "zndron (12 commits)")

---

Tags

laravelnova

###  Code Quality

Code StylePHP CS Fixer

### Embed Badge

![Health badge](/badges/zndron-nova-tabs/health.svg)

```
[![Health](https://phpackages.com/badges/zndron-nova-tabs/health.svg)](https://phpackages.com/packages/zndron-nova-tabs)
```

###  Alternatives

[eminiarts/nova-tabs

Laravel Nova - Tabs.

4624.1M20](/packages/eminiarts-nova-tabs)[oneduo/nova-file-manager

A handy file manager tool for Laravel Nova

157350.3k2](/packages/oneduo-nova-file-manager)[mostafaznv/nova-ckeditor

CkEditor for Laravel Nova

57327.2k1](/packages/mostafaznv-nova-ckeditor)[sbine/route-viewer

A Laravel Nova tool to view your registered routes.

57215.9k](/packages/sbine-route-viewer)[bbs-lab/nova-file-manager

A handy file manager tool for Laravel Nova

1578.0k](/packages/bbs-lab-nova-file-manager)[digital-creative/icon-action-toolbar

Allows you to update a single column of a resource all at once.

2626.0k](/packages/digital-creative-icon-action-toolbar)

PHPackages © 2026

[Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)