Slider plugin screenshot
Dark mode ready
Multilingual support
Supports v5.x

Slider

Slide into Precision – Customizable Control at Your Fingertips.

Tags: Form Field
Supported versions:
3.x
Rupadana avatar Author: Rupadana

Documentation

Latest Version on Packagist Total Downloads

This component allows users to easily select a value or range of values by dragging a slider handle. It's ideal for settings where precise input is required, such as adjusting numerical values, controlling volume, or setting dates.

#Installation

You can install the package via composer:

composer require rupadana/filament-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')

#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

#License

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