abdelhamiderrahmouni/filament-slick-slider

A Slick Slider for your filament v3 forms.

v0.1.0 2025-09-02 07:38 UTC

Requires

• php: ^8.2
• filament/forms: ^3.2
• illuminate/contracts: ^10.0|^11.0|^12.0
• spatie/laravel-package-tools: ^1.9

Requires (Dev)

• larastan/larastan: ^3.6
• laravel/pint: ^1.24
• nunomaduro/collision: ^8.8
• orchestra/testbench: ^10.6
• pestphp/pest: ^3.8
• pestphp/pest-plugin-laravel: ^3.2
• phpunit/phpunit: ^11.5

MIT

• Abdelhamid Errahmouni

• Forms
• laravel
• slider
• slick
• form-builder
• filament
• form-field
• filament-forms
• slick-slider

README

This component lets users intuitively select single values or ranges by moving a slider handle.
It is perfect for scenarios requiring accurate input, such as setting numbers, adjusting audio levels, or satisfaction levels.

Installation

You can install the package via composer:

composer require abdelhamiderrahmouni/filament-slick-slider

Usage

Simple Input Slider

InputSliderGroup::make()
->sliders([
    InputSlider::make('min')
])
->label('Limit')

Multiple Input

InputSliderGroup::make()
->sliders([
    InputSlider::make('min'),
    InputSlider::make('max')
])
->label('Limit')

Connect

InputSliderGroup::make()
->sliders([
    InputSlider::make('min'),
    InputSlider::make('max')
])
->connect([
    false,
    true,
    false
])
->label('Limit')

Maximum & Minimum

InputSliderGroup::make()
->sliders([
    InputSlider::make('min'),
    InputSlider::make('max')
])
->connect([
    false,
    true,
    false
])
->max(100)
->min(0)
->label('Limit')

Default Value

InputSliderGroup::make()
    ->sliders([
        InputSlider::make('starting')
            ->default(50),
        InputSlider::make('ending')
            ->default(70)
    ])
    ->range(["min" => 30, "max" => 100])
    ->step(10)
    ->behaviour([
        InputSliderBehaviour::DRAG,
        InputSliderBehaviour::TAP
    ])
    ->enableTooltips()
    ->label('Limit')

Complete

InputSliderGroup::make()
    ->sliders([
        InputSlider::make('min'),
        InputSlider::make('max')->default(50),
    ])
    ->connect([
        true,
        false,
        true
    ]) // array length must be sliders length + 1
    ->range([
        "min" => 30,
        "max" => 100
    ])
    ->step(10)
    ->behaviour([
        InputSliderBehaviour::DRAG,
        InputSliderBehaviour::TAP
    ])
    ->enableTooltips()
    ->label("Limit")

Changelog

Please see CHANGELOG for more information on what has changed recently.

Contributing

Please see CONTRIBUTING for details.

Credits

• Abdelhamid Errahmouni
• Rupadana
• All Contributors
• This package is a fork of filament-slider by Rupadana

License

The MIT License (MIT). Please see License File for more information.