PHP code example of daikazu / filament-image-checkbox-group

1. Go to this page and download the library: Download daikazu/filament-image-checkbox-group 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/ */

    

daikazu / filament-image-checkbox-group example snippets


use Daikazu\FilamentImageCheckboxGroup\Forms\Components\ImageCheckboxGroup;

// In your form schema
ImageCheckboxGroup::make('amenities')
    ->options([
        'wifi' => [
            'label' => 'Wi-Fi',
            'image' => asset('images/amenities/wifi.jpg'),
        ],
        'parking' => [
            'label' => 'Parking',
            'image' => asset('images/amenities/parking.jpg'),
        ],
        'pool' => [
            'label' => 'Swimming Pool',
            'image' => asset('images/amenities/pool.jpg'),
        ],
    ])
    ->

ImageCheckboxGroup::make('amenities')
    ->options([...])
    ->gridColumns(4)  // Will create a responsive grid that grows up to 4 columns

ImageCheckboxGroup::make('amenities')
    ->options([...])
    ->gridColumns([
        'default' => 1,  // mobile first (xs breakpoint)
        'sm' => 2,       // small screens (640px)
        'md' => 3,       // medium screens (768px)
        'lg' => 4,       // large screens (1024px)
        'xl' => 6,       // extra large screens (1280px)
        '2xl' => 8,      // 2xl screens (1536px)
    ])

ImageCheckboxGroup::make('amenities')
    ->options([...])
    ->gridColumns([
        'default' => 1,  // 1 column on mobile
        'md' => 3,       // 3 columns from medium screens up
        'xl' => 4,       // 4 columns from extra large screens up
    ])

ImageCheckboxGroup::make('amenities')
    ->options([
        'wifi' => [
            'label' => 'Wi-Fi',
            'image' => asset('images/amenities/wifi.jpg'),
        ],
        'parking' => [
            'label' => 'Parking',
            'image' => asset('images/amenities/parking.jpg'),
        ],
        'pool' => [
            'label' => 'Swimming Pool',
            'image' => asset('images/amenities/pool.jpg'),
        ],
    ])
    ->minSelect(1) // Must select at least 1
    ->maxSelect(2) // Cannot select more than 2
    ->

ImageCheckboxGroup::make('categories')
    ->options([
        'electronics' => 'Electronics',
        'clothing' => 'Clothing',
        'food' => 'Food',
        'books' => 'Books',
    ])
    ->gridColumns(2) // Show in 2 columns
    ->

ImageCheckboxGroup::make('attachments')
    ->options([
        'swivel-hook' => 'Swivel J-Hook',
        'bulldog-clip' => 'Bulldog Clip',
        'key-ring' => 'Key Ring',
    ])
    ->compactLabels() // Renders as compact text buttons
    ->gridColumns(3)
    ->

ImageCheckboxGroup::make('attachments')
    ->options([
        'swivel-hook' => [
            'label' => 'Swivel J-Hook',
            'image' => asset('images/attachments/swivel-hook.jpg'),
        ],
        'bulldog-clip' => [
            'label' => 'Bulldog Clip',
            'image' => asset('images/attachments/bulldog-clip.jpg'),
        ],
        'key-ring' => [
            'label' => 'Key Ring',
            'image' => asset('images/attachments/key-ring.jpg'),
        ],
    ])
    ->compactLabels() // Shows text buttons with image popover on hover
    ->gridColumns(4)
    ->

ImageCheckboxGroup::make('additional_features')
    ->options([
        'feature1' => [
            'label' => 'Feature 1',
            'image' => asset('images/features/feature1.jpg'),
        ],
        'feature2' => [
            'label' => 'Feature 2',
            'image' => asset('images/features/feature2.jpg'),
        ],
    ])
    ->maxSelect(3) // Optional but limited to max 3 selections

// config/filament-image-checkbox-group.php
return [
    'default_grid_columns' => 4,
    'default_min_select' => null,
    'default_max_select' => null,
];

ImageCheckboxGroup::make('amenities')
    ->options([...])
    ->helperText('Select the amenities available at this property')

// Example data in your model
public $amenities = ['wifi', 'pool'];

use Daikazu\FilamentImageCheckboxGroup\Forms\Components\ImageCheckboxGroup;

// In your form schema
Forms\Components\Section::make('Amenities')
    ->description('Select the amenities available at this property')
    ->schema([
        ImageCheckboxGroup::make('amenities')
            ->options([
                'wifi' => [
                    'label' => 'Wi-Fi',
                    'image' => asset('images/amenities/wifi.jpg'),
                ],
                'parking' => [
                    'label' => 'Parking',
                    'image' => asset('images/amenities/parking.jpg'),
                ],
                'pool' => [
                    'label' => 'Swimming Pool',
                    'image' => asset('images/amenities/pool.jpg'),
                ],
                'gym' => [
                    'label' => 'Fitness Center',
                    'image' => asset('images/amenities/gym.jpg'),
                ],
                'spa' => [
                    'label' => 'Spa',
                    'image' => asset('images/amenities/spa.jpg'),
                ],
                'breakfast' => [
                    'label' => 'Breakfast',
                    'image' => asset('images/amenities/breakfast.jpg'),
                ],
                'restaurant' => [
                    'label' => 'Restaurant',
                    'image' => asset('images/amenities/restaurant.jpg'),
                ],
                'laundry' => [
                    'label' => 'Laundry',
                    'image' => asset('images/amenities/laundry.jpg'),
                ],
            ])
            ->minSelect(1)
            ->maxSelect(5)
            ->
css
@source '../../../../vendor/daikazu/filament-image-checkbox-group/resources/views/**/*.blade.php';