Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

https://github.com/yepsua/filament-rating-field

Rating field for the Filament forms.
https://github.com/yepsua/filament-rating-field

Last synced: about 1 month ago
JSON representation

Rating field for the Filament forms.

Lists

README

        

# Ranting field for the Filament forms


Rating


[![Latest Version on Packagist](https://img.shields.io/packagist/v/yepsua/filament-rating-field.svg?style=flat-square)](https://packagist.org/packages/yepsua/filament-rating-field)
[![GitHub Tests Action Status](https://img.shields.io/github/actions/workflow/status/yepsua/filament-rating-field/run-tests.yml?label=tests)](https://github.com/yepsua/filament-rating-field/actions?query=workflow%3Arun-tests+branch%3Amaster)
[![GitHub Code Style Action Status](https://img.shields.io/github/actions/workflow/status/yepsua/filament-rating-field/php-cs-fixer.yml?label=code%20style)](https://github.com/yepsua/filament-rating-field/actions?query=workflow%3A"Check+%26+fix+styling"+branch%3Amaster)
[![Total Downloads](https://img.shields.io/packagist/dt/yepsua/filament-rating-field.svg?style=flat-square)](https://packagist.org/packages/yepsua/filament-rating-field)

## Installation

You can install the package via composer:

```bash
composer require yepsua/filament-rating-field
```

Optionally, you can publish the views using

```bash
php artisan vendor:publish --tag="filament-rating-field-views"
```

## Usage
### Form Field

```php
use Yepsua\Filament\Forms\Components\Rating

...
protected function getFormSchema(): array
{
return [
...
Rating::make('rating')
...
];
}
...
```


Rating


By default the range values goes from 1 to 5 and the icon displayed is `heroicon-o-star`

The rating fields provides several option to customize its behavior. Next some of the more used for:

####
#### *Disabled*

```php
use Yepsua\Filament\Forms\Components\Rating

...
protected function getFormSchema(): array
{
return [
...
Rating::make('rating')
->disabled()
...
];
}
...
```


Rating


#### *Min and max values*

```php
use Yepsua\Filament\Forms\Components\Rating

...
protected function getFormSchema(): array
{
return [
...
Rating::make('rating')
->min(5)
->max(10)
...
];
}
...
```


Rating


#### *Custom icons and colors*

```php
use Yepsua\Filament\Forms\Components\Rating

...
protected function getFormSchema(): array
{
return [
...
Rating::make('rating')
->icons('heroicon-o-moon', 'heroicon-s-sun')
->color('orange')
...
];
}
...
```


Rating


#### *Custom size*

```php
use Yepsua\Filament\Forms\Components\Rating

...
protected function getFormSchema(): array
{
return [
...
Rating::make('rating')
->size(10)
...
];
}
...
```


Rating


#### *No mouse effects*

Disable the mouseenter and mouseleave animation.

```php
use Yepsua\Filament\Forms\Components\Rating

...
protected function getFormSchema(): array
{
return [
...
Rating::make('rating')
->effects(false)
...
];
}
...
```
#### *Clearable*

Allow the user to clear the rating selection.

```php
use Yepsua\Filament\Forms\Components\Rating

...
protected function getFormSchema(): array
{
return [
...
Rating::make('rating')
->clearable()
->clearIconColor('red')
->clearIconTooltip('Clear')
...
];
}
...
```


Rating


#### *Cursors*

The value of the cursor is based on the [Tailwind cursor](https://tailwindcss.com/docs/cursor). The prefix `cursor-` its not required in the value.

```php
use Yepsua\Filament\Forms\Components\Rating

...
protected function getFormSchema(): array
{
return [
...
Rating::make('rating')
->cursor('default')
->clearIconTooltip('none')
...
];
}
...
```
#### *Tooltips*

```php
use Yepsua\Filament\Forms\Components\Rating

...
protected function getFormSchema(): array
{
return [
...
Rating::make('rating')
->options([
'Acceptable',
'Good',
'Very Good',
'Excellent',
])
...
];
}
...
```


Rating


#### Field options.

* ->color(): Set the icon colors for the rating field.
* ->disabledColor(): Set the icon color when the field is disabled.
* ->clearIconColor(): Set the color for the clear icon.
* ->icon(): Set the icon for the default items.
* ->selectedIcon(): Set the solid icon for the selected items.
* ->clearIcon(): Set the icon for the clear action.
* ->min(): Set the min value for the rating field. Default: 1
* ->max(): Set the max value for the rating field. Default: 5
* ->width(): Set the width value for each item in the field: Default: 6
* ->height(): Set the height value for each item in the field: Default: 6
* ->size(): Set the same value for the width and height properties.
* ->effects(): Enable\Disable the mouseenter and mouseleave effects. Default: true (enabled)
* ->clearable(): Add a extra icon at the end of the rating icons. Default: false
* ->cursor(): Set the default cursor
* ->disabledCursor(): Set the cursor to be displayed when the field is disabled
* ->clearIconTooltip(): Set the tooltip for the clear icon.

You can review the default value for the options above and others in the class `App\Forms\Components\Rating`

### Table Column
```php
use Yepsua\Filament\Tables\Components\RatingColumn;

// ...
protected function getTableColumns(): array
{
return [
// ..
RatingColumn::make('rating'),
// ..
];
}
...
```

#### RatingColumn options.

* ``` RatingColumn::make('rating')->color() ``` Set the icon colors for the rating field.
* ``` RatingColumn::make('rating')->icon() ``` Set the icon for the default items.
* ``` RatingColumn::make('rating')->selectedIcon() ``` Set the solid icon for the selected items.
* ``` RatingColumn::make('rating')->icons() ``` Set the icons for the default items and for selected items.
* ``` RatingColumn::make('rating')->minValue() ``` Set the min value for the rating field. Default: 1
* ``` RatingColumn::make('rating')->maxValue() ``` Set the max value for the rating field. Default: 5
* ``` RatingColumn::make('rating')->width() ``` Set the width value for each item in the field: Default: 6
* ``` RatingColumn::make('rating')->height() ``` Set the height value for each item in the field: Default: 6
* ``` RatingColumn::make('rating')->size() ``` Set the same value for the width and height properties.
* ``` RatingColumn::make('rating')->options() ``` set tooltip

![filament-page-with-sidebar](./images/rating-column.png)

## Testing

```bash
composer test
```

## Changelog

Please see [CHANGELOG](CHANGELOG.md) for more information on what has changed recently.

## Contributing

Please see [CONTRIBUTING](https://github.com/spatie/.github/blob/master/CONTRIBUTING.md) for details.

## Security Vulnerabilities

Please review [our security policy](../../security/policy) on how to report security vulnerabilities.

## Credits

- [Omar Yepez](https://github.com/oyepez003)
- [All Contributors](../../contributors)

## License

The MIT License (MIT). Please see [License File](LICENSE.md) for more information.