diff --git a/docs/filter-types/filters-number.md b/docs/filter-types/filters-number.md index 2bfba4404..78dd191a3 100644 --- a/docs/filter-types/filters-number.md +++ b/docs/filter-types/filters-number.md @@ -5,6 +5,27 @@ weight: 9 Number filters are just HTML number inputs. +```php +public function filters(): array +{ + return [ + NumberFilter::make('Amount') + ->filter(function(Builder $builder, string $value) { + $builder->where('amount', '<', $value); + }), + ]; +} +``` + +Historically, min/max/placeholders were set using the "config" option, which is still available. However, it is strongly recommended to use the new setInputAttributes for enhanced customisation. + +## Old Behaviour +The following would: +- Set a min of 0 +- Set a max of 100 +- Add a placeholder +- Keep the default colors & styling + ```php public function filters(): array { @@ -21,3 +42,28 @@ public function filters(): array ]; } ``` + +## New Behaviour +The following would: +- Set a min of 5 +- Set a max of 20 +- Set steps to be 0.5 +- Add a placeholder +- Keep the default colors & styling + +```php +public function filters(): array +{ + return [ + NumberFilter::make('Age') + ->setInputAttributes([ + 'min' => '5', // Minimum Value Accepted + 'max' => '20', // Maximum Value Accepted + 'step' => '0.5', // Set step + 'placeholder' => 'Enter Number 0 - 100', // A placeholder value + 'default-colors' => true, + 'default-styling' => true, + ]), + ]; +} +``` \ No newline at end of file diff --git a/docs/filters/available-filter-methods.md b/docs/filters/available-filter-methods.md index 6e17a63b4..9597372d4 100644 --- a/docs/filters/available-filter-methods.md +++ b/docs/filters/available-filter-methods.md @@ -208,6 +208,58 @@ TextFilter::make('Name') ), ``` +## setInputAttributes +Allows for customising the attributes that will apply to the input field for the filter. + +By default, this replaces the default classes on the Filter Input, if you would like to keep them, set the default-styling and/or default-colors flags to true. + +### TextFilter Example +The following would: +- Set a maxlength of 75 +- Set a placeholder of "Enter a Name" +- Replace the default colors +- Retain the default styling (e.g. rounding/shadow) + +```php +public function filters(): array +{ + return [ + TextFilter::make('Name') + ->setInputAttributes([ + 'maxlength' => '75', + 'placeholder' => 'Enter a Name', + 'class' => 'text-white bg-red-500 dark:bg-red-500', + 'default-colors' => false, + 'default-styling' => true, + ]), + ]; +} +``` + +### NumberFilter Example +The following would: +- Set a min of 5 +- Set a max of 20 +- Set steps to be 0.5 +- Keep the default colors & styling + +```php +public function filters(): array +{ + return [ + NumberFilter::make('Age') + ->setInputAttributes([ + 'min' => '5', + 'max' => '20', + 'step' => '0.5', + 'default-colors' => true, + 'default-styling' => true, + ]), + ]; +} +``` + + ## setCustomView Use a fully custom view for a filter. This will utilise solely your view when rendering this filter. Note that the following methods will no longer apply to a filter using this: - setCustomFilterLabel diff --git a/resources/views/components/tools/filters/boolean.blade.php b/resources/views/components/tools/filters/boolean.blade.php index abc983581..759400e13 100644 --- a/resources/views/components/tools/filters/boolean.blade.php +++ b/resources/views/components/tools/filters/boolean.blade.php @@ -7,14 +7,15 @@ -