PHP code example of litepie / layout

1. Go to this page and download the library: Download litepie/layout library. Choose the download type require.

2. Extract the ZIP file and open the index.php.

3. Add this code to the index.php.
    
        
<?php
require_once('vendor/autoload.php');

/* Start to develop here. Best regards https://php-download.com/ */

    

litepie / layout example snippets


use Litepie\Layout\Facades\Layout;

// Create a simple card layout
$layout = Layout::create('dashboard')
    ->section('main', function ($section) {
        $section->card('user-stats')
            ->title('User Statistics')
            ->dataUrl('/api/stats')
            ->addField('total_users', 'Total Users')
            ->addField('active_users', 'Active Today')
            ->addField('new_registrations', 'New This Month');
    });

// Render using the layout response macro (recommended)
return response()->layout($layout->cache(true, 3600));

// Or render to array manually
return response()->json($layout->render());

use Litepie\Layout\Facades\Layout;

$layout = Layout::create('user-form')
    ->section('main', function ($section) {
        $section->form('user-form')
            ->action('/users')
            ->method('POST')
            ->addField('name', 'text', 'Full Name')
            ->addField('email', 'email', 'Email Address')
            ->addField('role', 'select', 'Role', ['options' => ['admin', 'user', 'guest']])
            ->addButton('submit', 'Save User', 'primary');
    });

return $layout->render();

use Litepie\Layout\Facades\Layout;

$layout = Layout::create('dashboard')
    ->section('header', function ($section) {
        $section->breadcrumb('navigation')
            ->addItem('Home', '/')
            ->addItem('Dashboard', '/dashboard');
    })
    ->section('main', function ($section) {
        // Grid layout with multiple cards
        $section->grid('stats-grid')
            ->columns(3)
            ->addComponent(
                $section->card('revenue')
                    ->title('Revenue')
                    ->dataUrl('/api/revenue')
            )
            ->addComponent(
                $section->card('orders')
                    ->title('Orders')
                    ->dataUrl('/api/orders')
            )
            ->addComponent(
                $section->card('customers')
                    ->title('Customers')
                    ->dataUrl('/api/customers')
            );
    })
    ->section('footer', function ($section) {
        $section->text('copyright')
            ->content('© 2025 Your Company');
    });

return $layout->render();

$layout->section('main', function ($section) {
    // Add to 'header' slot
    $section->section('header')->text('title')->content('Dashboard');
    
    // Add to 'body' slot (default)
    $section->card('main-content')->title('Content');
    
    // Add to 'footer' slot
    $section->section('footer')->text('info')->content('Last updated: Today');
});

// From API endpoint
$section->card('api-data')
    ->dataUrl('/api/stats')
    ->dataParams(['filter' => 'active']);

// From database
$section->table('users')
    ->dataSource('users')
    ->dataTransform(function ($query) {
        return $query->where('active', true)->orderBy('created_at', 'desc');
    });

// From closure
$section->card('dynamic')
    ->dataSource(function () {
        return [
            'total' => User::count(),
            'active' => User::where('active', true)->count(),
        ];
    });

$section->card('admin-panel')
    ->permissions(['manage-users', 'view-logs'])
    ->canSee(function ($user) {
        return $user->isAdmin();
    });

// Resolve authorization for current user
$layout->resolveAuthorization(auth()->user());

$section->grid('responsive-grid')
    ->columns(4)
    ->setDeviceConfig('mobile', ['columns' => 1])
    ->setDeviceConfig('tablet', ['columns' => 2]);

$layout->cache()
    ->ttl(3600)
    ->key('dashboard-layout')
    ->tags(['layouts', 'dashboard']);

$layout->beforeRender(function ($layout) {
    Log::info('Rendering layout: ' . $layout->getName());
});

$layout->afterRender(function ($layout, $output) {
    Log::info('Rendered layout with ' . count($output) . ' sections');
});

$section->card('premium-features')
    ->condition('user.subscription.status == "active"')
    ->condition('user.subscription.plan == "premium"');

$section->form('user-form')
    ->validationRules([
        'name' => 'quired|integer|min:18',
    ]);

$section->card('welcome')
    ->title('layout.welcome.title')  // Translatable key
    ->translate();  // Enable translation

// Or translate specific fields
$section->form('contact')
    ->translateField('submit_button', 'forms.submit');
bash
php artisan vendor:publish --provider="Litepie\Layout\LayoutServiceProvider"