DOCSEARCHbyAlgolia
Submit Docs

FilamentPHP Documentation (Spanish)

website·Indexed 30 days ago

https://docs.filamentenespanol.com

Unofficial Spanish translation of the FilamentPHP documentation. Covers the implementation of the TALL stack framework for Laravel, including Panel Builder, Table Builder, Actions, Widgets, and testing guides. Includes release notes and changelogs from v4.3.0 to v4.5.2.

Tokens
184.5K
Snippets
1.2K
Records
1.3K
Agent score
49%

What's inside Filament

  1. Overview of Filament Class Generators

    Filament uses the nette/php-generator library to programmatically generate PHP classes instead of using template files. This provides greater flexibility for configuration options. Each type of generated file is handled by a specific ClassGenerator class.

  2. Overview of Filament SDUI Framework

    Filament is a Server-Driven UI (SDUI) framework for Laravel that allows developers to define user interfaces entirely in PHP using structured configuration objects instead of traditional templates. It is built on top of Livewire, Alpine.js, and Tailwind CSS. Unlike Server-Rendered UI (which uses static templates like Blade), SDUI allows the server to dynamically generate the UI based on real-time configurations and business logic. It can be used to build admin panels, dashboards, user portals, CRMs, or integrated into existing Blade views as standalone Livewire components.

  3. Overview of Filament Prime components

    Prime components are the most basic building blocks in Filament schemas used to insert arbitrary content that cannot be further divided. They are located in the Filament\Schemas\Components namespace. Common prime components include Text, Icon, Image, and UnorderedList.

  4. Overview of Filament Clusters

    Clusters allow developers to group resources and custom pages into logical sections. When a cluster is implemented, the following changes occur:

    • A new navigation item is added, linking to the first resource or page in the cluster.
    • Individual resources/pages within the cluster are hidden from the main navigation.
    • A sub-navigation UI is added to every resource or page within the cluster.
    • URLs for cluster members are prefixed with the cluster name.
    • The cluster name is automatically added to the breadcrumbs of all member resources and pages.

  5. Overview of Filament core components

    Filament provides a set of core components designed to ensure a consistent and maintainable base for all interfaces. These components are available for use within Filament applications, plugins, and can often be used outside of a standard Filament panel.

  6. Overview of Filament Infolists

    The Filament Infolists package allows developers to display read-only lists of data for specific entities. It is integrated into other Filament packages such as panel resources, relationship managers, and action modals. Infolists are primarily used to render structured data from Eloquent models.

  7. Understand Filament Plugin contexts

    Filament plugins operate in two primary contexts. A single plugin can implement both if necessary:

    1. Panel Plugins: Used with Panel Builders. These add functionality specifically to a Panel (e.g., widgets) or act as a complete Panel themselves (e.g., a blog or user administration suite).
    2. Standalone Plugins: Used outside of Panel Builders. These typically provide reusable components for other builders, such as custom fields for Form Builders or custom columns/filters for Table Builders.

  8. Add a heading and description to a Stats Overview widget

    You can add a header and description text above the widget by overriding the $heading and $description properties. For dynamic content, override the getHeading() and getDescription() methods.
    // Static properties
protected ?string $heading = 'Analytics';
protected ?string $description = 'An overview of some analytics.';

// Dynamic methods
protected function getHeading(): ?string
{
    return 'Analytics';
}

protected function getDescription(): ?string
{
    return 'An overview of some analytics.';
}

  9. Use Filament Widgets for dashboards

    Widgets are components used to build dashboards, typically for displaying statistical data such as charts, numbers, and tables. Each widget consists of a PHP class and a Blade view. Because the PHP class is a Livewire component, widgets have full access to Livewire's server-side rendering and interactivity capabilities.

  10. Understand Filament's color system

    Filament uses CSS variables to define its color palette, which are mapped to Tailwind classes. This allows the framework to pass colors from PHP to the browser via a <style> element rendered by the @filamentStyles Blade directive. A 'color' in Filament is not a single shade, but a full palette of 11 tones (50, 100, 200, 300, 400, 500, 600, 700, 800, 900, and 950). Filament automatically selects the appropriate tone based on the component context and whether dark mode is enabled to ensure accessible contrast.

  11. Create a tenant profile page

    A tenant profile page allows users to edit information about the current tenant. Create a page class that extends Filament\Pages\Tenancy\EditTenantProfile and register it in the panel configuration using tenantProfile().
    // app/Filament/Pages/Tenancy/EditTeamProfile.php
namespace App\Filament\Pages\Tenancy;

use Filament\Forms\Components\TextInput;
use Filament\Pages\Tenancy\EditTenantProfile;
use Filament\Schemas\Schema;

class EditTeamProfile extends EditTenantProfile
{
    public static function getLabel(): string
    {
        return 'Team profile';
    }

    public function form(Schema $schema): Schema
    {
        return $schema
            ->components([
                TextInput::make('name'),
            ]);
    }
}

// Panel Configuration
public function panel(Panel $panel): Panel
{
    return $panel
        ->tenantProfile(EditTeamProfile::class);
}

  12. Customize individual statistics in a Stats Overview widget

    The Stat class allows you to enhance individual statistics with descriptions, icons, colors, and historical charts. You can also add custom HTML attributes for interactivity.
    use Filament\Support\Enums\IconPosition;
use Filament\Widgets\StatsOverviewWidget\Stat;

protected function getStats(): array
{
    return [
        Stat::make('Unique views', '192.1k')
            ->description('32k increase')
            ->descriptionIcon('heroicon-m-arrow-trending-up', IconPosition::Before)
            ->color('success')
            ->chart([7, 2, 10, 3, 15, 4, 17])
            ->extraAttributes([
                'class' => 'cursor-pointer',
                'wire:click' => "\$dispatch('setStatusFilter', { filter: 'processed' })",
            ]),
    ];
}