https://github.com/fuelviews/laravel-navigation
Navigation Package
https://github.com/fuelviews/laravel-navigation
Last synced: 7 days ago
JSON representation
Navigation Package
- Host: GitHub
- URL: https://github.com/fuelviews/laravel-navigation
- Owner: fuelviews
- License: mit
- Created: 2024-06-01T00:59:43.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2025-09-02T10:49:57.000Z (about 2 months ago)
- Last Synced: 2025-10-02T14:40:05.036Z (21 days ago)
- Language: Blade
- Homepage:
- Size: 240 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- Funding: .github/funding.yml
- License: LICENSE.md
Awesome Lists containing this project
README
# Laravel Navigation Package
[](https://packagist.org/packages/fuelviews/laravel-navigation)
[](https://github.com/fuelviews/laravel-navigation/actions/workflows/run-tests.yml?query=workflow%3Arun-tests+branch%3Amain)
[](https://github.com/fuelviews/laravel-navigation/actions/workflows/php-cs-fixer.yml)
[](https://packagist.org/packages/fuelviews/laravel-navigation)
A comprehensive and flexible Laravel navigation package that provides beautiful, responsive navigation components with Alpine.js interactions and Tailwind CSS styling. Perfect for building modern Laravel applications with professional navigation experiences.
## 📋 Requirements
- PHP 8.3+
- Laravel 10.x, 11.x, or 12.x
- Alpine.js (included with Livewire)
- Tailwind CSS
## 🚀 Installation
Install the package via Composer:
```bash
composer require fuelviews/laravel-navigation
```
### Quick Setup
Run the install command for guided setup:
```bash
php artisan navigation:install
```
This will:
- Publish the configuration file
- Publish view files for customization
- Provide setup instructions
### Manual Setup
Alternatively, you can manually publish components:
```bash
# Publish configuration
php artisan vendor:publish --tag="navigation-config"
# Publish views (optional)
php artisan vendor:publish --tag="navigation-views"
# Publish service provider for advanced customization (optional)
php artisan vendor:publish --tag="laravel-package-tools-service-provider"
```
## ⚙️ Configuration
The package uses a comprehensive configuration file located at `config/navigation.php`:
### Navigation Items
Define your navigation structure with support for simple links and dropdown menus:
```php
'navigation' => [
// Simple link
[
'type' => 'link',
'position' => 0,
'name' => 'Home',
'route' => 'home',
],
// Dropdown menu
[
'type' => 'dropdown',
'position' => 1,
'name' => 'Services',
'links' => [
[
'name' => 'Web Development',
'route' => 'services.web',
],
[
'name' => 'Mobile Apps',
'route' => 'services.mobile',
],
],
],
],
```
### Visual Configuration
```php
// logo config
'default_logo' => '',
'transparency_logo' => '',
// navigation config
'top_nav_enabled' => false,
'logo_swap_enabled' => true,
'transparent_nav_background' => true,
// logo shape config
'default_logo_shape' => 'square', // Can be 'horizontal', 'vertical', or 'square'
'transparency_logo_shape' => 'horizontal', // Can be 'horizontal', 'vertical', or 'square'
```
### Pre-scrolled Routes
Define routes that should have a "scrolled" appearance from page load:
```php
'pre_scrolled_routes' => [
'careers',
'contact',
'services',
'forms.*',
'sabhero-blog.*',
],
```
## 🧩 Components
### Desktop Navigation
```blade
```
### Mobile Navigation
```blade
```
### Navigation Wrapper
```blade
```
### Utility Components
```blade
```
## 🎯 Complete Navigation Example
Here's a complete navigation setup:
```blade
@vite(['resources/css/app.css', 'resources/js/app.js'])
@if(Navigation::isTopNavEnabled())
@endif
{{ $slot }}
```
## 🎨 Styling with Tailwind CSS
Add the package views to your `tailwind.config.js`:
```javascript
module.exports = {
content: [
'./resources/**/*.blade.php',
'./resources/**/*.js',
'./vendor/fuelviews/laravel-navigation/resources/**/*.blade.php',
],
// ... rest of your config
}
```
## 🔧 Using the Navigation Facade
Access navigation data programmatically:
```php
use Fuelviews\Navigation\Facades\Navigation;
// Get all navigation items
$items = Navigation::getNavigationItems();
// Check if dropdown route is active
$isActive = Navigation::isDropdownRouteActive($dropdownLinks);
// Get configuration values
$logo = Navigation::getDefaultLogo();
$phone = Navigation::getPhone();
$isTransparent = Navigation::isTransparentNavBackground();
// Check route states
$isPreScrolled = Navigation::isPreScrolledRoute();
$preScrolledString = Navigation::getPreScrolledRoute(); // 'true' or 'false'
```
## 🛠️ Artisan Commands
### List Navigation Items
View all configured navigation items:
```bash
php artisan navigation:list
```
Output:
```
Navigation Items:
+----------+----------+---------+--------------+
| Position | Type | Name | Route/Links |
+----------+----------+---------+--------------+
| 0 | link | Home | home |
| 1 | dropdown | Services| 3 links |
| 2 | link | About | about |
+----------+----------+---------+--------------+
```
### Validate Configuration
Validate your navigation configuration:
```bash
php artisan navigation:validate
```
This command checks for:
- Required fields (type, position, name)
- Valid navigation types
- Route existence
- Duplicate positions
- Dropdown structure integrity
## 🎛️ Advanced Usage
### Custom Navigation Items
Add navigation items programmatically:
```php
// In a service provider
config([
'navigation.navigation' => array_merge(
config('navigation.navigation'),
[
[
'type' => 'link',
'position' => 99,
'name' => 'Admin',
'route' => 'admin.dashboard',
]
]
)
]);
```
### Custom View Components
Extend the package with your own components:
```php
// Create custom component
class CustomNavigationLink extends Component
{
public function render()
{
return view('components.custom-navigation-link');
}
}
// Register in AppServiceProvider
Blade::component('custom-nav-link', CustomNavigationLink::class);
```
## 🧪 Testing
The package includes comprehensive tests. Run them with:
```bash
# In the package directory
composer test
# Code style
composer format
```
### Testing Your Navigation
Test navigation in your application:
```php
// Feature test example
public function test_navigation_renders_correctly()
{
$response = $this->get('/');
$response->assertSeeLivewire(DesktopNavigation::class);
$response->assertSee('Home');
$response->assertSee('Services');
}
```
## 🎨 Customization Examples
### Custom Dropdown Styling
```blade
Services
```
## 🤝 Contributing
We welcome contributions! Please see [CONTRIBUTING.md](CONTRIBUTING.md) for details.
### Development Setup
```bash
git clone https://github.com/fuelviews/laravel-navigation.git
cd laravel-navigation
composer install
composer test
```
## 📄 Changelog
Please see [CHANGELOG](CHANGELOG.md) for more information on what has changed recently.
## 🔐 Security Vulnerabilities
Please review [our security policy](../../security/policy) on how to report security vulnerabilities.
## 👨💻 Credits
- [Joshua Mitchener](https://github.com/thejmitchener)
- [Sweatybreeze](https://github.com/sweatybreeze)
- [Fuelviews](https://github.com/fuelviews)
- [All Contributors](../../contributors)
## 📜 License
The MIT License (MIT). Please see [License File](LICENSE.md) for more information.
---