Components Laravel Package

Getting Started

Minimal Setup

1. Installation

   composer require appverk/components
   

   Ensure your composer.json includes "minimum-stability": "dev" if testing unreleased features.

2. Service Provider Register the package in config/app.php under providers:

   AppVerk\Components\ComponentsServiceProvider::class,
   

3. Publish Config (Optional)

   php artisan vendor:publish --provider="AppVerk\Components\ComponentsServiceProvider" --tag="config"
   

   Check config/components.php for default settings.

4. First Use Case Use the Component facade to render a basic component:

   use AppVerk\Components\Facades\Component;
   
   // In a Blade view
   {{ Component::make('alert')->with(['type' => 'success', 'message' => 'Hello!']) }}
   

Implementation Patterns

Component Registration

1. Registering Components Define components in config/components.php:

   'components' => [
       'alert' => [
           'view' => 'components.alert',
           'data' => ['type' => 'info', 'message' => 'Default alert'],
       ],
       'card' => [
           'view' => 'components.card',
           'data' => ['title' => 'Default Card'],
       ],
   ],
   

   Dynamically register via service provider:

   $this->app->singleton('components.alert', function () {
       return new AlertComponent();
   });
   

2. Blade Integration Use the @component directive for cleaner syntax:

   @component('alert', ['type' => 'warning', 'message' => 'Custom message'])
       @slot('title') Custom Title @endslot
   @endcomponent
   

Dynamic Data Handling

• Passing Data

  Component::make('card')
      ->with(['title' => 'Dynamic Card'])
      ->withSlots(['content' => 'Dynamic content']);
  

• Slot Support

  @component('card')
      @slot('content')
          <p>Slot content</p>
      @endslot
  @endcomponent
  

Event-Driven Extensions

Extend functionality via events:

// Listen for component rendering
event(new ComponentRendering('alert'));

// Fire custom events
Component::make('alert')->fire('alert.rendered');

Gotchas and Tips

Common Pitfalls

1. View Paths Ensure component views exist in resources/views/components/ or specify full paths in config:

   'view' => 'path.to.component',
   

2. Caching Issues Clear config cache after changes:

   php artisan config:clear
   

3. Data Overrides Later with() calls override earlier ones. Use merge() for partial updates:

   Component::make('card')->merge(['title' => 'Updated']);
   

Debugging

• Check Registered Components

  dd(\AppVerk\Components\ComponentsManager::getComponents());
  

• Log Component Data

  Component::make('alert')->debug(); // Dumps data to logs
  

Extension Points

1. Custom Component Classes Extend \AppVerk\Components\Component:

   class CustomComponent extends \AppVerk\Components\Component {
       public function customMethod() { ... }
   }
   

   Register via service provider.

2. Middleware for Components Apply middleware to specific components:

   Component::make('admin-panel')->middleware('auth.admin');
   

3. View Compilation Override default Blade compilation by publishing assets:

   php artisan vendor:publish --provider="AppVerk\Components\ComponentsServiceProvider" --tag="assets"